diff --git a/DESIGN.md b/DESIGN.md
index a7bb5ba..aa8634e 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -152,7 +152,8 @@ The shell uses `.container-fluid` with no row/column wrapper. Bootstrap's grid a
 
 **Z-index.** `$zindex-offcanvas: 2105` and `$zindex-offcanvas-backdrop: 2100` (stock `1045` /
 `1040`) deliberately lift offcanvas above modals; `$zindex-modal-backdrop: 1040` (stock
-`1050`); bundle-only `$zindex-backtotop: 1035`. `.buttons-fixed` sits at `2000`.
+`1050`); bundle-only `$zindex-backtotop: 1035`. `.buttons-fixed` sits at `2000`, dropped to
+`$zindex-modal-backdrop - 1` under `.modal-open` so the backdrop covers it.
 
 ## Elevation and shape
 
diff --git a/assets/scss/components/_modal.scss b/assets/scss/components/_modal.scss
index 5393b60..0631ae5 100644
--- a/assets/scss/components/_modal.scss
+++ b/assets/scss/components/_modal.scss
@@ -1,5 +1,6 @@
-.modal-backdrop.in {
-  z-index: 9999999;
+// .buttons-fixed sits at z-index 2000, above the modal backdrop; drop it below the backdrop while a modal is open.
+.modal-open .buttons-fixed {
+  z-index: $zindex-modal-backdrop - 1;
 }
 
 .modal-content {