diff --git a/web/zebra-spaces.html b/web/zebra-spaces.html
index f531f64..7b63167 100644
--- a/web/zebra-spaces.html
+++ b/web/zebra-spaces.html
@@ -231,6 +231,15 @@
body { padding: 1.25rem; }
/* mobile: single column, all three sections stack to grid-column:1 */
.page { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
+ /* hide-panel on mobile must NOT swap the layout into the wide-
+ * viewport two-column rail (cameras-col + timeline). Keep the
+ * single-column stack regardless of the controls-collapsed state.
+ * Wins over the desktop .controls-collapsed selector by being
+ * inside this media query (later in cascade, equal specificity
+ * after the matching selector) — using the same class so the
+ * specificity matches and the order decides. */
+ .page.controls-collapsed,
+ html.controls-collapsed-pref .page { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.controls, .timeline, .cameras-col { grid-column: 1; }
.controls { grid-row: 1; }
.timeline { grid-row: 2;
@@ -3788,8 +3797,8 @@ logLine('', 'ready — pick a handle, type a rendezvous code, enter the space');