diff --git a/components.css b/components.css
index ba19df6..487db9c 100644
--- a/components.css
+++ b/components.css
@@ -376,6 +376,7 @@ a:hover { opacity: .78; }
   transition: background-color var(--md-motion-short) var(--md-motion-standard),
               color var(--md-motion-short) var(--md-motion-standard);
 }
+.menu-toggle { display: none; }
 #theme-toggle:hover,
 .menu-toggle:hover { background: rgba(var(--md-state-rgb), var(--md-state-hover)); }
 .header-social a:hover {
@@ -942,8 +943,53 @@ textarea:focus-visible,
 
 @media (max-width: 1024px) {
   .menu-toggle { display: inline-flex; }
+
+  .nav-container {
+    position: fixed;
+    inset: 64px 0 0 0;
+    flex-direction: column;
+    align-items: stretch;
+    gap: 0;
+    padding: var(--space-4) var(--container-pad) var(--space-6);
+    background: var(--md-sys-color-surface);
+    border-top: 1px solid var(--md-sys-color-outline-variant);
+    box-shadow: var(--md-elevation-2);
+    overflow-y: auto;
+    transform: translateY(-8px);
+    opacity: 0;
+    visibility: hidden;
+    pointer-events: none;
+    transition: opacity var(--md-motion-short) var(--md-motion-standard),
+                transform var(--md-motion-short) var(--md-motion-standard),
+                visibility 0s linear var(--md-motion-short);
+  }
+
+  .nav-container.is-active {
+    opacity: 1;
+    transform: translateY(0);
+    visibility: visible;
+    pointer-events: auto;
+    transition: opacity var(--md-motion-short) var(--md-motion-standard),
+                transform var(--md-motion-short) var(--md-motion-standard),
+                visibility 0s linear 0s;
+  }
+
+  .nav-links {
+    flex-direction: column;
+    align-items: stretch;
+    gap: var(--space-1);
+    width: 100%;
+  }
+
+  .nav-links a { padding: var(--space-3) var(--space-2); }
+
+  .nav-divider { width: 100%; height: 1px; margin: var(--space-3) 0; }
+
+  .header-social { padding-left: 0; }
 }
 
+body.no-scroll { overflow: hidden; }
+
 @media (max-width: 900px) {
   :root { --container-pad: 24px; }
   .practice-card { padding: var(--space-7); }