diff --git a/website/preview/mockup.css b/website/preview/mockup.css
index c65ee08c..102a4981 100644
--- a/website/preview/mockup.css
+++ b/website/preview/mockup.css
@@ -1293,6 +1293,13 @@ select.form-control option {
     .m2-who { flex-direction: column; }
 }
 @media (max-width: 768px) {
+    /* ADAPTED from the controller, which carries it as a bare `body` rule - the kind an
+       extractor keyed on class names does not see. Without it the sticky mobile topbar
+       stays a ROW flex item, pushes .content 135px to the right, and the launcher grid
+       collapses to one column. Measured, then fixed. */
+    body.mockup { flex-direction: column; }
+    body.mockup.nav-open { overflow: hidden; }
+
     .welcome-card { flex-direction: column; align-items: flex-start; }
     .nav-off-hint { display: inline-block; margin-left: .5rem; }
     .app-panel { padding: 1rem .5rem; }