diff --git a/src/layout/Shell.css b/src/layout/Shell.css index fe92c53..0d1f469 100644 --- a/src/layout/Shell.css +++ b/src/layout/Shell.css @@ -186,13 +186,11 @@ flex: 1; min-width: 0; background: var(--zk-white); + /* Fill the whole width beside the nav. No centring cap: a sidebar dashboard + should use the screen, so the content spans from the rail to the right + edge. The reading columns cap their own line length internally, so text + stays comfortable while the layout itself uses every pixel. */ width: 100%; - /* Anchor the content to the nav rather than centring it. Centring a capped - block left a wide empty river between the sidebar and the content on a - large or zoomed-out monitor; a sidebar layout should hug the rail. The cap - is raised so a wide screen is used, and the reading columns cap their own - line length internally so text stays comfortable. */ - max-width: 1320px; padding: 30px 40px 76px; } diff --git a/src/screens/screens.css b/src/screens/screens.css index 61d6f18..7a222f2 100644 --- a/src/screens/screens.css +++ b/src/screens/screens.css @@ -593,15 +593,11 @@ /* ---- lead: the file beside the story ---- */ .lead { display: grid; - /* The story column caps at its comfortable reading width and the facts rail - at the width its key/value pairs need; the pair anchors to the nav rather - than stretching to fill an ultra-wide monitor (which only opened a void - inside each card). Any spare width falls to the right as breathing room, - the way a sidebar dashboard should read — never a river between the rail - and the content. */ - grid-template-columns: minmax(0, 760px) minmax(340px, 440px); - justify-content: start; - max-width: 1240px; + /* Fill the full width. The story column takes all the slack, the facts rail + is fixed to the width its key/value pairs need. Reading comfort is handled + inside the feed (its paragraphs cap their own line length), so the panel + can be wide without the text sprawling. */ + grid-template-columns: minmax(0, 1fr) minmax(360px, 420px); gap: var(--sp-6); align-items: start; } @@ -1112,7 +1108,9 @@ anyone actually came for — are bigger again. */ .lmetrics { display: grid; - grid-template-columns: repeat(4, 1fr); + /* Auto-fit so the row always fills the width whether three tiles show or + four (AI-confidence is conditional); no empty hard-coded 4th cell. */ + grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--sp-4); margin-bottom: var(--sp-5); }