diff --git a/containers/libreportal/frontend/css/apps.css b/containers/libreportal/frontend/css/apps.css
index 4899b8f..17d30c5 100644
--- a/containers/libreportal/frontend/css/apps.css
+++ b/containers/libreportal/frontend/css/apps.css
@@ -8,20 +8,24 @@
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(var(--app-min), 1fr));
   gap: var(--app-gap);
-  margin: 22px auto;
+  margin: 22px;
   padding: 22px;
   background: rgba(var(--text-rgb), 0.025);
   border: 1px solid var(--border-subtle);
   border-radius: 16px;
   /* Shrink the glass box to exactly the visible-card count so a row with
      two apps doesn't leave a card-shaped hole on the right. --app-count
-     is set from apps-manager.js (render + search filter); the 100%-44px
-     cap keeps the same 22px symmetric gap from the layout edges when
-     there are enough cards to fill the row. Default 99 = no cap until
-     JS reports a real count. */
+     is set from apps-manager.js (render + search filter). Box is
+     left-aligned (margin: 22px, not auto) so cards stay where they were
+     before the cap was introduced — the box just shortens on the right.
+     The 100%-44px cap honours the same 22px gutter at full width. The
+     formula is the outer width under border-box (the global default from
+     style.css:4): N*min + (N-1)*gap + 44px padding + 2px border + 2px
+     buffer for sub-pixel rounding so 2 cards reliably stay on one row.
+     Default 99 = no cap until JS reports a real count. */
   max-width: min(
     calc(100% - 44px),
-    calc(var(--app-count, 99) * var(--app-min) + (var(--app-count, 99) - 1) * var(--app-gap) + 44px)
+    calc(var(--app-count, 99) * var(--app-min) + (var(--app-count, 99) - 1) * var(--app-gap) + 48px)
   );
 }