diff --git a/src/components/Timeline.css b/src/components/Timeline.css index 8b3591a..7ded4ba 100644 --- a/src/components/Timeline.css +++ b/src/components/Timeline.css @@ -156,7 +156,7 @@ font-size: var(--fs-sm); line-height: var(--lh-normal); color: var(--zk-muted); - max-width: 76ch; + max-width: 82ch; } .tl__figs { diff --git a/src/screens/screens.css b/src/screens/screens.css index 77e1f8f..300c7cb 100644 --- a/src/screens/screens.css +++ b/src/screens/screens.css @@ -593,13 +593,14 @@ /* ---- lead: the file beside the story ---- */ .lead { display: grid; - /* THE STORY GETS THE WIDE COLUMN. The trail used to sit in a 384px gutter - with its own scrollbar while a panel of reference fields had the whole - width — exactly backwards for a product whose point is the record of - work nobody watched. Now the narrative has the measure prose needs and - the reference rail is narrow, because short key/value pairs are the one - thing a narrow column is good for. */ - grid-template-columns: minmax(0, 1fr) 340px; + /* 60 / 40. The story is the point, so it takes the larger share — but a + fixed 340px rail left the main column ballooning far wider than the feed + text, so a dead gap opened between the narrative and the facts. A + proportional split closes it: the AI decision stream gets ~60%, the + customer/vehicle/document facts ~40% (capped so it does not sprawl on an + ultra-wide monitor). The facts breathe now too — the PDF names stop + wrapping. */ + grid-template-columns: minmax(0, 3fr) minmax(320px, 2fr); gap: var(--sp-6); align-items: start; }