diff --git a/docs/stylesheets/extra.css b/docs/stylesheets/extra.css
index c7deada..415028e 100644
--- a/docs/stylesheets/extra.css
+++ b/docs/stylesheets/extra.css
@@ -858,6 +858,8 @@ article h1, article h2, article h3 {
     min-height: 150px;
     padding: 1.1rem 1.1rem 3.2rem 1.1rem;
   }
+}
+
 /* ═════════════════════════════════════════════════════════════════
    Action Points — Interactive Checklist
    ═════════════════════════════════════════════════════════════════ */
@@ -978,3 +980,16 @@ h3[data-toa-complete="true"]::after {
 .toa-export:hover {
   color: var(--gp-primary, #4a8262);
 }
+
+/* ═════════════════════════════════════════════════════════════════
+   Nav-drawer stacking fix (.md-overlay)
+   The backdrop-filter / transform / will-change rules in this stylesheet
+   spawn extra stacking contexts that let the drawer scrim (.md-overlay)
+   paint ON TOP of the open nav panel, blurring the menu and swallowing
+   its clicks. Dropping the scrim's z-index back to 1 puts it below the
+   drawer panel again, so the menu is visible and interactive.
+   (Verified: z-index:1 restores usable mobile nav.)
+   ═════════════════════════════════════════════════════════════════ */
+.md-overlay {
+  z-index: 1;
+}