/* ETLYON RAG Console — base stylesheet.
   Carried from the v4 reference implementation's second style block, plus the
   rules the reference expressed as React inline `style-hover` props (a
   server-rendered page has no such prop, so they become real CSS here).

   The ONLY token source is console.tokens.css. This file adds no colour and no
   font size of its own: every value below is a var(--*) or a geometry the
   reference implementation already fixed. See docs/CONSOLE_REGISTER_CONTRACT.md.

   TWO KINDS OF NUMBER LIVE HERE, and the difference is the contract's §1.0.
   Type and row heights are rem, because they must grow with the reader's own
   base. Structure (bar heights, hairlines, signal geometry, the 68px bar, the
   250px default rail — drag-resizable via --rail-w) stays px, because a 4px funnel segment scaled by the text factor
   stops being a signal and becomes a stripe.
*/

html,body{margin:0;padding:0}
body{background:var(--c-bg);font-family:var(--f-sans);font-size:var(--t-body);color:var(--c-t1);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
a{color:var(--c-acc);text-decoration:none}
a:hover{text-decoration:underline}
input,button,select{font-family:inherit;font-size:inherit;color:inherit}
::placeholder{color:var(--c-t3)}
:focus-visible{outline:2px solid var(--c-acc);outline-offset:1px}
table{border-collapse:collapse;width:100%;table-layout:fixed}
th,td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
th{position:sticky;top:0;z-index:2;background:var(--c-raised);border-bottom:1px solid var(--c-line);text-align:left;font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t1);padding:0 12px;height:32px}
th a{color:inherit}
th a:hover{color:var(--c-t1);text-decoration:none;opacity:.85}
.col-resizer{position:absolute;top:0;right:-3px;width:7px;height:100%;cursor:col-resize;z-index:3;user-select:none}
.col-resizer:hover,.col-resizer.is-dragging{background:var(--c-acc)}
body.is-col-resizing{cursor:col-resize;user-select:none}
td{padding:0 12px;height:var(--row)}
tbody tr{background:var(--c-raised)}
tbody tr:hover{background:var(--c-hover)}
kbd{font:400 var(--t-micro) var(--f-mono);color:var(--c-t3);border:1px solid var(--c-line);padding:1px 4px}
@keyframes sk{0%{opacity:.35}50%{opacity:.7}100%{opacity:.35}}
.sk{background:var(--c-track);height:8px;animation:sk 1.4s ease-in-out infinite}
[hidden]{display:none !important}

/* ---- shell ----------------------------------------------------------
   §1.19: the console fills the window. A fixed height leaves bare page below
   it on a tall display, which reads as a broken app. 820px is the floor, not
   the height. */
.app{position:relative;height:100dvh;min-height:820px;min-width:1240px;display:grid;grid-template-columns:var(--rail-w,250px) 1fr;grid-template-rows:68px auto 1fr;background:var(--c-bg);color:var(--c-t1);overflow:hidden;--rail-w:250px}

/* §1.14: the top bar holds only what is global — logo, search, mode badge,
   and the one link out to chat. Preferences and session left it entirely. */
.topbar{grid-column:1 / 3;background:var(--c-chrome);display:flex;align-items:center;gap:12px;padding:0 12px;white-space:nowrap;border-bottom:1px solid #000}
.brand{flex:none;display:flex;align-items:center;gap:9px;text-decoration:none}
.brand:hover{text-decoration:none}
.brand img{height:36px;width:auto;display:block}
.brand span{font:600 var(--t-chrome)/1 var(--f-sans);letter-spacing:.14em;color:#F5F3ED}
.searchbox{flex:none;display:flex;align-items:center;gap:10px;width:480px;height:40px;padding:0 11px;background:#1E1F21;border:1px solid #55585C;cursor:pointer;font-size:var(--t-chrome);color:var(--c-placeholder)}
.searchbox:hover{border-color:#3E9483;text-decoration:none}
.searchbox kbd{margin-left:auto;color:var(--c-placeholder);border-color:#55585C}
/* GATE 2 topbar chip is gone; Chat keeps the trailing pin that the chip used to hold. */
.chat-link{margin-left:auto;flex:none;color:#3E9483;font-size:var(--t-chrome)}

/* ---- rail ----------------------------------------------------------- */
.rail{grid-row:3;position:relative;background:var(--c-raised);border-right:1px solid var(--c-line);display:flex;flex-direction:column;overflow:hidden;min-width:0}
.rail-resizer{position:absolute;top:0;right:-3px;width:7px;height:100%;cursor:col-resize;z-index:4;user-select:none}
.rail-resizer:hover,.rail-resizer.is-dragging{background:var(--c-acc)}
body.is-rail-resizing{cursor:col-resize;user-select:none}
.rail-label{padding:18px 11px 7px;font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c-t3)}
.rail-item{height:2rem;padding:0 11px;display:flex;align-items:center;cursor:pointer;color:var(--c-t2)}
.rail-item:hover{background:var(--c-hover);color:var(--c-t1);text-decoration:none}
.rail-item[aria-current="page"]{padding:0 11px 0 9px;border-left:2px solid var(--c-acc);background:var(--c-hover);color:var(--c-t1);font-weight:600}
.rail-item .n{margin-left:auto;font-size:var(--t-label);color:var(--c-t3)}
.rail-item[aria-current="page"] .n{color:var(--c-t2)}
.rail-item .n.bad{color:var(--c-bad)}
.rail-item .n.ok{color:var(--c-ok)}
.rail-live-dot{width:5px;height:5px;background:var(--c-ok);border-radius:50%;flex:none;margin-left:7px;animation:live-pulse 2s ease-in-out infinite}
.rail-check .n.bad{color:var(--c-bad)}
.rail-check .n.ok{color:var(--c-ok)}
.rail-group{padding:0 11px;display:flex;flex-direction:column}
.rail-check{height:26px;display:flex;align-items:center;gap:7px;color:var(--c-t2);cursor:pointer}
.rail-check:hover{text-decoration:none;color:var(--c-t1)}
.rail-check input{width:11px;height:11px;margin:0;accent-color:var(--c-acc)}
.rail-check .n{margin-left:auto;font-size:var(--t-label);color:var(--c-t3)}
.rail-state{height:26px;padding:0 11px;display:flex;align-items:center;cursor:pointer;color:var(--c-t3);font-size:var(--t-label)}
.rail-state:hover{background:var(--c-hover);text-decoration:none;color:var(--c-t2)}

/* Workspace switcher — §9: it renders ALWAYS, from the first workspace. */
.ws{display:flex;flex-direction:column;border-bottom:1px solid var(--c-line);padding:8px 11px 9px}
.ws-label{font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c-t3);margin-bottom:8px}
.ws-pill{height:30px;padding:0 7px;display:flex;align-items:center;gap:6px;border:1px solid var(--c-line);color:var(--c-t1);cursor:pointer;background:none;width:100%;text-align:left}
.ws-pill:hover{border-color:var(--c-acc);color:var(--c-acc)}
.ws-pill .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ws-pill .n{flex:none;font-size:var(--t-label);color:var(--c-t3)}
.ws-pill .caret{flex:none;margin-left:auto;color:var(--c-t3)}
.ws-note{font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.5;margin-top:5px}

/* Health — §1.16: pinned, collapsed by default. Collapsed head is label +
   chevron only (Alain 2026-08-21); status lives in the expanded rows. */
.health{margin-top:auto;border-top:1px solid var(--c-line);display:flex;flex-direction:column}
.health-head{height:2rem;flex:none;padding:0 11px;display:flex;align-items:center;gap:7px;cursor:pointer;background:none;border:0;width:100%;text-align:left;min-width:0}
.health-head:hover{background:var(--c-hover)}
.health-head .h{flex:none;font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c-t3)}
.health-head .chev{flex:none;margin-left:auto;color:var(--c-t3);font-size:var(--t-label)}
.health-body{display:flex;flex-direction:column;padding:0 0 6px;color:var(--c-t2);font-size:var(--t-label)}
.health-row{height:26px;padding:0 11px;display:flex;align-items:center;gap:6px;cursor:pointer;color:inherit;min-width:0}
.health-row:hover{background:var(--c-hover);color:var(--c-t1);text-decoration:none}
.health-row > span:nth-child(2){flex:none}
.health-row .v{margin-left:auto;flex:none;max-width:7.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.health-row .v.mono{font-size:var(--t-label)}
.health-row .go{flex:none;margin-left:6px;color:var(--c-t3)}
.dot{width:5px;height:5px;border-radius:50%;flex:none;background:var(--c-t3)}
.dot.ok{background:var(--c-ok)}
.dot.bad{background:var(--c-bad)}
.dot.unknown{background:var(--c-warn)}

/* Account row — §1.15: bottom of the sidebar, opening upward. */
.acct{flex:none;border-top:1px solid var(--c-line);height:46px;padding:0 11px;display:flex;align-items:center;gap:8px;cursor:pointer;background:none;border-left:0;border-right:0;border-bottom:0;width:100%;text-align:left;color:inherit}
.acct:hover{background:var(--c-hover)}
.acct[aria-expanded="true"]{background:var(--c-hover)}
.acct .av{flex:none;width:20px;height:24px;border:1px solid var(--c-acc);color:var(--c-acc);display:flex;align-items:center;justify-content:center;font:600 var(--t-micro) var(--f-sans);letter-spacing:.04em}
.acct .who{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct .caret{flex:none;margin-left:auto;color:var(--c-t3)}

/* ---- popovers: account, preferences, workspaces --------------------- */
.menu-scrim{position:absolute;inset:0;z-index:24}
.popover{position:absolute;z-index:25;background:var(--c-raised);border:1px solid var(--c-line)}
.popover.up{left:8px;bottom:46px;box-shadow:0 -10px 32px rgba(0,0,0,.5)}
.popover.ws-pop{top:130px;left:11px;width:300px;box-shadow:0 12px 32px rgba(0,0,0,.45)}
.popover.account{width:242px}
.popover.prefs{width:268px}
.pop-head{height:2rem;padding:0 11px;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--c-line)}
.pop-head .h{font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.pop-head .who{margin-left:auto;font-size:var(--t-label);color:var(--c-t3)}
.pop-head.clickable{cursor:pointer;background:none;border-left:0;border-right:0;border-top:0;width:100%;text-align:left;color:inherit}
.pop-head.clickable:hover{background:var(--c-hover)}
.pop-id{padding:8px 11px;border-bottom:1px solid var(--c-line)}
.pop-id .who{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pop-id .scope{font:400 var(--t-xs) var(--f-mono);color:var(--c-t3);margin-top:2px}
.pop-row{height:34px;padding:0 11px;display:flex;align-items:center;gap:8px;cursor:pointer;color:var(--c-t2);background:none;border:0;width:100%;text-align:left;font-size:inherit}
.pop-row:hover{background:var(--c-hover);text-decoration:none;color:var(--c-t1)}
.pop-row .hint{margin-left:auto;font-size:var(--t-label);color:var(--c-t3)}
.pop-row.flat{cursor:default;color:var(--c-t3)}
.pop-row.flat:hover{background:none}
.pop-sep{border-top:1px solid var(--c-line)}
.pop-foot{border-top:1px solid var(--c-line);padding:7px 11px;font:400 var(--t-micro) var(--f-mono);color:var(--c-t3);line-height:1.6;white-space:normal}
.pop-note{padding:8px 11px;font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.55}
.pop-body{padding:10px 11px}
.pref-label{font-size:var(--t-label);color:var(--c-t2);margin-bottom:5px}
.seg{display:flex;border:1px solid var(--c-line);margin-bottom:11px}
.seg a{flex:1;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--c-t2)}
.seg a + a{border-left:1px solid var(--c-line)}
.seg a:hover{text-decoration:none;background:var(--c-hover)}
.seg a[aria-current="true"]{background:var(--c-hover);color:var(--c-t1);font-weight:600}

/* §1.20: every toggle shows its state — filled track, moved knob, ON / OFF. */
.switch{display:flex;align-items:center;gap:9px;cursor:pointer;padding:3px 0;background:none;border:0;width:100%;text-align:left;color:inherit;font-size:inherit}
.switch .track{flex:none;width:32px;height:18px;background:var(--c-track);border:1px solid var(--c-line);display:flex;align-items:center;padding:2px;justify-content:flex-start}
.switch .knob{width:12px;height:12px;background:var(--c-t3)}
.switch .word{margin-left:auto;font:400 var(--t-micro) var(--f-mono);letter-spacing:.08em;color:var(--c-t3)}
.switch[aria-checked="true"] .track{background:var(--c-acc);border-color:var(--c-acc);justify-content:flex-end}
.switch[aria-checked="true"] .knob{background:var(--c-bg)}
.switch[aria-checked="true"] .word{color:var(--c-acc)}

/* ---- main ----------------------------------------------------------- */
.main{grid-row:3;overflow:auto;background:var(--c-bg)}
.viewbar{height:42px;padding:0 14px;display:flex;align-items:center;gap:12px;white-space:nowrap;border-bottom:1px solid var(--c-line)}
.viewbar .title{font-weight:600}
.viewbar .meta{color:var(--c-t2);font-size:var(--t-label)}
.viewbar .age{margin-left:auto;display:flex;align-items:center;gap:8px}
.viewbar .when{color:var(--c-t2);font-size:var(--t-label);font-variant-numeric:tabular-nums}
.viewbar .countdown-join{color:var(--c-t3);font-size:var(--t-label)}
.viewbar .countdown{color:var(--c-t2);font-size:var(--t-label);font-variant-numeric:tabular-nums}
.viewbar .reload{box-sizing:border-box;width:26px;height:26px;padding:0;border:1px solid var(--c-line);background:none;color:var(--c-t1);font-size:var(--t-label);line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:2px}
.viewbar .reload:hover{background:var(--c-hover)}
.viewbar .pager-hit{display:inline-flex;align-items:center;gap:6px;min-width:132px;min-height:26px;padding:0 12px;border-left:1px solid var(--c-line);cursor:text;user-select:none;border-radius:2px}
.viewbar .pager-hit:hover{background:var(--c-hover)}
.viewbar .pager{color:var(--c-t2);font-size:var(--t-label);font-variant-numeric:tabular-nums;border-left:0;padding-left:0}
.viewbar .pager-hit:hover .pager{color:var(--c-t1)}
.viewbar .pager-hint{color:var(--c-t3);font-size:var(--t-micro);letter-spacing:.04em}
.viewbar .pager-hit.is-editing .pager-hint{display:none}
.viewbar .pager-size{display:none;width:52px;height:26px;padding:0 6px;border:1px solid var(--c-acc);background:var(--c-bg);color:var(--c-t1);font:var(--t-label) var(--f-sans);font-variant-numeric:tabular-nums;border-radius:2px}
.viewbar .pager-size-unit{display:none;color:var(--c-t3);font-size:var(--t-label)}
.viewbar .pager-hit.is-editing .pager{display:none}
.viewbar .pager-hit.is-editing .pager-size{display:block}
.viewbar .pager-hit.is-editing .pager-size-unit{display:inline}
.viewbar .pager-size:focus{outline:none}
.viewbar .nav{color:var(--c-t1);font-size:var(--t-label)}
.viewbar .nav[aria-disabled="true"]{color:var(--c-t3);opacity:.45;cursor:default;pointer-events:none}
/* Alain GO 2026-08-21 — Collections + Add collection / row Actions / freeze pane */
.viewbar .add-collection{height:26px;padding:0 10px;border:1px solid var(--c-acc);background:none;color:var(--c-acc);font:600 var(--t-label) var(--f-sans);cursor:pointer;border-radius:2px}
.viewbar .add-collection:hover{background:var(--c-hover)}
.collections-board{display:flex;align-items:stretch;min-width:0;width:100%}
.pin-pane{flex:0 0 auto;max-width:min(260px,58vw);min-width:0;z-index:5;background:var(--c-raised);border-right:1px solid var(--c-line)}
.pin-pane table{width:100%;min-width:0;table-layout:fixed;border-collapse:collapse}
.pin-pane th.col-collection,.pin-pane td.col-collection{min-width:0;width:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.pin-pane th.col-actions,.pin-pane td.col-actions{width:72px;min-width:72px;max-width:72px;white-space:nowrap;vertical-align:middle;padding:0 6px;overflow:visible}
.table-scroll{flex:1 1 auto;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.row-action{box-sizing:border-box;width:26px;height:26px;padding:0;margin:0 2px 0 0;border:1px solid var(--c-line);background:none;color:var(--c-t1);font-size:var(--t-label);line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:2px;vertical-align:middle}
.row-action:hover{background:var(--c-hover)}
.row-action svg{display:block;pointer-events:none}
@media (max-width:820px){
  .pin-pane{max-width:min(220px,62vw)}
  .viewbar .add-collection{padding:0 8px}
}
.lede{padding:8px 14px 10px;color:var(--c-t1);font-size:var(--t-body);white-space:normal;line-height:1.45;border-bottom:1px solid var(--c-line)}
.tip{position:fixed;z-index:40;max-width:280px;padding:7px 9px;background:#141414;border:1px solid var(--c-line);border-radius:2px;color:var(--c-t1);font:var(--t-label)/1.45 var(--f-sans);white-space:normal;pointer-events:none;display:none}
.toolbar{height:36px;padding:0 14px;display:flex;align-items:center;gap:8px;white-space:nowrap;border-bottom:1px solid var(--c-line);background:var(--c-raised)}
.toolbar input[type=search],.toolbar input[type=text]{flex:none;width:170px;height:24px;border:1px solid var(--c-line);background:var(--c-hover);padding:0 7px;font-size:var(--t-label)}
.pill{flex:none;font-size:var(--t-label);border:1px solid var(--c-line);color:var(--c-t2);padding:2px 7px;cursor:pointer}
.pill:hover{border-color:var(--c-acc);color:var(--c-acc);text-decoration:none}
.pill.on{border-color:var(--c-acc);color:var(--c-acc)}
.pill.bad:hover{border-color:var(--c-bad);color:var(--c-bad)}
.footnote{padding:9px 14px;font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.55}
.section-label{font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}

/* ---- table signals -------------------------------------------------- */
.bar-track{width:88px;height:4px;background:var(--c-track);display:flex}
.bar-fill{height:4px;flex:none}
.bar-fill.ok{background:var(--c-ok)}
.bar-fill.bad{background:var(--c-bad)}
/* §1.8c: the text floor does not apply to bars. A neutral segment uses
   --c-gate, never --c-t3: near-white bars out-shout the red ones. */
.bar-fill.gate{background:var(--c-gate)}
.bar-fill.ingested{background:var(--c-t1)}
.bar-fill.published{background:var(--c-ok)}
.bar-fill.faded{background:var(--c-gate)}
.bar-ok{width:88px;height:4px;background:var(--c-ok)}
.bar-ingested{width:88px;height:4px;background:var(--c-t1)}
.swatch{display:inline-block;width:14px;height:4px;background:var(--c-gate);vertical-align:middle;margin-right:3px}
.swatch.ingested{background:var(--c-t1)}
.swatch.published{background:var(--c-ok)}
.swatch.faded{background:var(--c-gate)}
.stage{display:flex;gap:2px}
.stage i{width:14px;height:4px;display:block}
.stage i.ok{background:var(--c-ok)}
.stage i.bad{background:var(--c-bad)}
.stage i.pending{background:var(--c-track)}
tr.failed{background:var(--c-bad-wash);box-shadow:inset 2px 0 0 var(--c-bad)}
tr[data-selected="true"]{background:var(--c-hover);box-shadow:inset 2px 0 0 var(--c-acc)}
.num{text-align:right}
.ok{color:var(--c-ok)}
.bad{color:var(--c-bad);font-weight:600}
.warn{color:var(--c-warn)}
.quiet{color:var(--c-t2)}
.quieter{color:var(--c-t3)}
.mono{font-family:var(--f-mono);font-size:var(--t-sm)}
.tag{font-size:var(--t-micro);letter-spacing:.06em;text-transform:uppercase;padding:0 3px;border:1px solid currentColor}
.tag.curated{color:var(--c-warn)}
.tag.current{color:var(--c-acc)}
.tag.machine{color:var(--c-ok)}
.branch{color:var(--c-t3);margin-right:6px}

/* ---- gated affordances (present, disabled, gate named) -------------- */
.gated{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-label);color:var(--c-t2);border:1px dashed var(--c-gate);padding:2px 7px;cursor:not-allowed}
.gated .g{font:400 var(--t-nano) var(--f-mono);letter-spacing:.08em;color:var(--c-t3)}
.gated:hover{border-color:var(--c-gate)}
/* §8: the second gate vocabulary. No colour, the question stated in full. */
.decision{border:1px dashed var(--c-gate);padding:8px 9px;white-space:normal;line-height:1.55}
.decision .k{font:400 var(--t-nano) var(--f-mono);letter-spacing:.08em;color:var(--c-t3);margin-bottom:5px}
.decision .body{font-size:var(--t-label);color:var(--c-t2)}

/* ---- Q-tags: always in the DOM, painted only when the dev toggle is on */
.q{font:400 var(--t-micro) var(--f-mono);color:var(--c-t3);display:none}
[data-qtags="on"] .q{display:inline}
[data-qtags="on"] [data-q]{outline:1px dotted var(--c-acc-dim);outline-offset:-1px}

/* ---- infrastructure grid ------------------------------------------- */
.infra{display:grid;grid-template-columns:1fr 1fr}
.infra > div{border-bottom:1px solid var(--c-line);padding:11px 14px;background:var(--c-raised)}
.infra > div:nth-child(odd){border-right:1px solid var(--c-line)}
/* §1.18: a health figure links to the card that explains it, and the jump
   MARKS that card. The marker points and clears on the next navigation. */
.infra > div[data-focus="true"]{box-shadow:inset 2px 0 0 var(--c-acc)}
.infra h2{display:flex;align-items:center;gap:8px;margin:0 0 7px;white-space:nowrap;font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.infra .pick{font:400 var(--t-sm) var(--f-mono);color:var(--c-t1);margin-bottom:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.infra table{table-layout:auto}
.infra td{height:24px;padding:0}
.infra tbody tr{background:transparent}
.infra tbody tr:hover{background:transparent}
.infra .k{color:var(--c-t2);white-space:normal}
.infra .v{text-align:right;font-family:var(--f-mono);font-size:var(--t-sm)}
.infra .adapter{flex:none;font:400 var(--t-micro) var(--f-mono);color:var(--c-t3);border:1px solid var(--c-line);padding:0 4px}
.infra .detail{margin-left:auto;flex:none;font-size:var(--t-label)}

/* ---- usage ---------------------------------------------------------- */
.panels{display:grid;grid-template-columns:1fr 1fr}
.panels > div{border-bottom:1px solid var(--c-line);padding:11px 14px;background:var(--c-raised)}
.panels > div:nth-child(odd){border-right:1px solid var(--c-line)}
.panels table{table-layout:auto}
.panels td{height:26px;padding:0}
.panels tbody tr{background:transparent}
.panels tbody tr:hover{background:transparent}
.panels .k{color:var(--c-t2);white-space:normal}
.panels .v{text-align:right;font-family:var(--f-mono);font-size:var(--t-sm)}
.panels .note{margin-top:9px;font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.55}
/* §1.17: utilisation thresholds are the monitoring convention — green under
   80 %, amber 80–90 %, red above. Both marks are drawn on the bar. */
.meter{margin-top:9px;display:flex;align-items:center;gap:8px}
.meter .rail{flex:1;height:5px;background:var(--c-track);display:flex;position:relative;border:0}
.meter .fill{height:5px}
.meter .fill.ok{background:var(--c-ok)}
.meter .fill.warn{background:var(--c-warn)}
.meter .fill.bad{background:var(--c-bad)}
.meter .mark{position:absolute;top:-2px;width:1px;height:9px}
.meter .mark.warn{background:var(--c-warn)}
.meter .mark.bad{background:var(--c-bad)}
.meter .val{flex:none;font-size:var(--t-label)}

/* ---- extensions ----------------------------------------------------- */
.section-row td{height:26px;background:var(--c-bg);border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.section-row .h{font:600 var(--t-micro) var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c-t3)}
.section-row .d{font-size:var(--t-label);color:var(--c-t3);margin-left:9px}
.status-active{display:inline-flex;align-items:center;gap:5px;font-size:var(--t-label);color:var(--c-ok)}
.status-off{font-size:var(--t-label);color:var(--c-t3);border:1px dashed var(--c-gate);padding:2px 7px}

/* ---- overlays: the only two surfaces allowed a shadow --------------- */
.scrim{position:absolute;inset:0;background:rgba(0,0,0,.45);z-index:20}
.slideover{position:absolute;top:68px;right:0;bottom:0;width:560px;z-index:21;background:var(--c-raised);border-left:1px solid var(--c-line);box-shadow:-8px 0 24px rgba(0,0,0,.35);display:flex;flex-direction:column;overflow:hidden}
.slideover.narrow{width:480px}
.slideover header{height:42px;flex:none;padding:0 12px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--c-line);white-space:nowrap}
.slideover header .name{font-weight:600;overflow:hidden;text-overflow:ellipsis}
.slideover .body{flex:1;overflow:auto;padding:12px}
.slideover .close{flex:none;cursor:pointer;color:var(--c-t2);font-size:var(--t-glyph);padding:0 2px;background:none;border:0}
.slideover .close:hover{color:var(--c-t1)}
.ingest-control{display:flex;flex-direction:column}
.ingest-label{font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3);margin-bottom:6px}
.ingest-target{height:33px;border:1px solid var(--c-line);background:var(--c-bg);padding:0 12px;display:flex;align-items:center;color:var(--c-t1);margin-bottom:5px}
.ingest-target span{margin-left:auto;color:var(--c-t3)}
.ingest-help{font-size:var(--t-label);margin-bottom:18px;white-space:normal;line-height:1.5}
.ingest-tabs{display:flex;border:1px solid var(--c-line);margin-bottom:13px;font-size:var(--t-label)}
.ingest-tabs span{flex:1;text-align:center;padding:6px 0;color:var(--c-t2);border-right:1px solid var(--c-line)}
.ingest-tabs span:last-child{border-right:0}
.ingest-tabs span[aria-current="true"]{background:var(--c-hover);color:var(--c-t1);font-weight:600}
.ingest-tabs span[aria-disabled="true"]{color:var(--c-t3)}
.ingest-source-label{display:block;color:var(--c-t2);font-size:var(--t-label);white-space:normal;line-height:1.5;margin-bottom:6px}
.ingest-control select{width:100%;height:34px;border:1px solid var(--c-line);background:var(--c-bg);padding:0 9px;color:var(--c-t1);margin-bottom:5px}
.ingest-control select:disabled{color:var(--c-t3);cursor:not-allowed}
.ingest-drop{border:1px dashed var(--c-gate);padding:15px;text-align:center;font-size:var(--t-label);color:var(--c-t3);margin-bottom:18px}
.ingest-status{border:1px solid var(--c-line);background:var(--c-bg);padding:10px 12px;display:flex;flex-direction:column;gap:4px;white-space:normal;line-height:1.5}
.ingest-status [data-ingest-observation]{font-weight:600}
.ingest-evidence{border:1px solid var(--c-line);background:var(--c-bg);color:var(--c-t2);font:400 var(--t-xs)/1.55 var(--f-mono);white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0;padding:9px 11px;max-height:190px;overflow:auto}
.ingest-footer{flex:none;border-top:1px solid var(--c-line);padding:13px 15px;display:flex;align-items:center;gap:8px}
.ingest-button{height:36px;padding:0 14px;border:1px solid var(--c-line);background:none;color:var(--c-t2);cursor:pointer}
.ingest-button.primary{border-color:var(--c-acc);color:var(--c-acc);margin-right:auto}
.ingest-button:hover:not(:disabled){border-color:var(--c-acc);color:var(--c-acc)}
.ingest-button:disabled{border-color:var(--c-line);color:var(--c-t3);cursor:not-allowed}
.palette{position:absolute;top:116px;left:50%;transform:translateX(-50%);width:660px;z-index:22;background:var(--c-raised);border:1px solid var(--c-line);box-shadow:0 16px 48px rgba(0,0,0,.5);display:flex;flex-direction:column;overflow:hidden}
.palette .field{height:46px;flex:none;display:flex;align-items:center;gap:9px;padding:0 12px;border-bottom:1px solid var(--c-line)}
.palette .field input{flex:1;background:none;border:0;outline:0;color:var(--c-t1)}
.palette .results{max-height:488px;overflow:auto}
.palette .group{padding:11px 12px 4px;font:600 var(--t-nano) var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c-t3);display:flex;gap:8px;align-items:center}
.palette .group:first-child{padding-top:7px}
.palette .group .scope{font-family:var(--f-mono);font-weight:400;letter-spacing:0;text-transform:none;color:var(--c-t3)}
.palette .hit{height:34px;padding:0 12px;display:flex;align-items:center;gap:9px;white-space:nowrap;color:var(--c-t1)}
.palette .hit:hover,.palette .hit[aria-selected="true"]{background:var(--c-hover);text-decoration:none}
.palette .hit[aria-selected="true"]{border-left:2px solid var(--c-acc);padding-left:10px}
.palette .foot{flex:none;border-top:1px solid var(--c-line);padding:6px 12px;display:flex;align-items:center;gap:12px;font-size:var(--t-label);color:var(--c-t3)}

/* ---- document pane -------------------------------------------------- */
.journey{display:flex;gap:0;border:1px solid var(--c-line);margin-bottom:12px}
.journey > div{flex:1;padding:6px 9px;border-right:1px solid var(--c-line)}
.journey > div:last-child{border-right:0}
.journey .k{font:600 var(--t-nano) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.journey .v{font-size:var(--t-xs);margin-top:2px}
.pane-label{font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3);margin:14px 0 7px;display:flex;align-items:center;gap:9px}
.pane-label:first-child{margin-top:0}
.pane-label a{margin-left:auto;font-size:var(--t-label)}
.reader{border:1px solid var(--c-line);background:var(--c-bg);padding:8px 10px;font:400 var(--t-xs)/1.7 var(--f-mono);white-space:pre;overflow:auto}
.artifact{border:1px solid var(--c-line);background:var(--c-bg);padding:12px 14px;max-height:288px;overflow:auto;white-space:normal;line-height:1.62}
.artifact h1{font-weight:600;font-size:var(--t-read);margin:0 0 8px}
.artifact h2{font-weight:600;font-size:var(--t-body);margin:12px 0 4px}
.artifact p{color:var(--c-t2);margin:0 0 10px}
.failbox{border:1px solid var(--c-bad);background:var(--c-bad-wash);padding:10px 12px;margin-bottom:12px}
.failbox .h{font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-bad);margin-bottom:5px}
.failbox .story{white-space:normal;line-height:1.55}
.curation{border:1px solid var(--c-line);background:var(--c-bg);padding:8px 9px;font-size:var(--t-sm);color:var(--c-t2)}
.curation .kv{display:flex;justify-content:space-between;gap:10px;height:24px;align-items:center}
.note{margin-top:12px;border:1px solid var(--c-line);border-left:2px solid var(--c-gate);background:var(--c-bg);padding:7px 9px;font-size:var(--t-label);color:var(--c-t2);white-space:normal;line-height:1.55}

/* ---- empty and error states ----------------------------------------- */
.empty{padding:34px 14px;color:var(--c-t2);white-space:normal;max-width:900px}
.empty h1{font:600 var(--t-body) var(--f-sans);margin:0 0 6px;color:var(--c-t1)}
.empty p{margin:0 0 8px;line-height:1.55}
.empty.bad{border-left:2px solid var(--c-bad)}
.empty.gate{border-left:2px solid var(--c-gate)}
.strain{padding:9px 14px;font-size:var(--t-label);color:var(--c-warn);border-top:1px solid var(--c-line);white-space:normal}

/* ---- the funnel: one collection's whole pipeline ---------------------
   Data-encoding geometry, so it stays px: a stage box scaled by the reader's
   type factor stops being comparable to the box beside it. */
.funnel{padding:11px 14px 12px;border-bottom:1px solid var(--c-line);background:var(--c-raised)}
.funnel-head{display:flex;align-items:center;gap:9px;margin-bottom:9px;white-space:nowrap}
.funnel-head .meta{margin-left:auto;font-size:var(--t-label);color:var(--c-t3)}
.funnel-strip{display:flex;align-items:stretch;gap:0;white-space:nowrap;overflow-x:auto;padding-bottom:2px}
.stage-box{flex:none;min-width:112px;padding:8px 10px;background:var(--c-bg);border:1px solid var(--c-line)}
.stage-box.gated{border:1px dashed var(--c-gate);cursor:default}
.stage-box.published{box-shadow:inset 2px 0 0 var(--c-ok)}
.stage-box .k{font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3);display:flex;gap:5px;align-items:center}
.stage-box .k .g{font:400 var(--t-nano) var(--f-mono);letter-spacing:.08em}
.stage-box .v{font-size:var(--t-read);font-weight:600;margin-top:3px}
.stage-box .v.none{color:var(--c-t3);font-weight:400;font-size:var(--t-label)}
.stage-gap{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:0 7px;min-width:52px;font-size:var(--t-label)}
.stage-gap .arrow{color:var(--c-t3)}
.stage-gap a{color:var(--c-bad)}
.stage-gap .zero{color:var(--c-t3)}
.funnel-note{margin-top:9px;font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.55;max-width:1125px}

/* ---- Triage: one signal strip, and the cohorts ---------------------- */
.signal{padding:11px 14px 12px;border-bottom:1px solid var(--c-line);background:var(--c-raised)}
.signal-head{display:flex;align-items:center;gap:9px;margin-bottom:9px;white-space:nowrap}
.signal-head .meta{margin-left:auto;font-size:var(--t-label);color:var(--c-t3)}
.hist{display:flex;align-items:flex-end;gap:3px;height:64px}
.hist a{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.hist a:hover{text-decoration:none}
.hist a:hover i{outline:1px solid var(--c-acc);outline-offset:1px}
.hist i{display:block}
.hist i.bad{background:var(--c-bad)}
.hist i.warn{background:var(--c-warn)}
/* §1.8c — a neutral bar is --c-gate, never --c-t3. Near-white bars out-shout
   the red ones and invert the signal the strip exists to send. */
.hist i.gate{background:var(--c-gate)}
.hist-labels{display:flex;gap:3px;margin-top:4px;font-size:var(--t-label);color:var(--c-t3)}
.hist-labels span{flex:1}
.hist-labels span.bad{color:var(--c-bad);font-weight:400}
.hist-labels span.warn{color:var(--c-warn)}
.share{width:100px;height:4px;background:var(--c-track);display:flex}
.share i{height:4px;display:block}
.share i.bad{background:var(--c-bad)}
.share i.warn{background:var(--c-warn)}
.share i.gate{background:var(--c-gate)}

/* ---- Review: original / extraction / judgment ------------------------ */
.review{height:100%;display:flex;flex-direction:column;overflow:hidden}
.review-bar{height:42px;flex:none;padding:0 14px;display:flex;align-items:center;gap:9px;white-space:nowrap;border-bottom:1px solid var(--c-line)}
.review-bar .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;max-width:425px}
.gens{flex:none;padding:9px 14px 10px;border-bottom:1px solid var(--c-line);background:var(--c-raised)}
.gens-head{display:flex;align-items:center;gap:9px;margin-bottom:8px;white-space:nowrap}
.gens-head .meta{margin-left:auto;font-size:var(--t-label);color:var(--c-t3)}
.gens-strip{display:flex;align-items:stretch;gap:8px;white-space:nowrap;overflow-x:auto;padding-bottom:2px}
.gen{flex:none;min-width:264px;padding:6px 9px;background:var(--c-bg);border:1px solid var(--c-line)}
.gen[aria-current="true"]{border-color:var(--c-acc);box-shadow:inset 2px 0 0 var(--c-acc)}
.gen .top{display:flex;align-items:center;gap:7px}
.gen .hash{margin-left:auto;font:400 var(--t-xs) var(--f-mono);color:var(--c-t3)}
.gen .sub{font-size:var(--t-label);color:var(--c-t2);margin-top:3px}
.panes{flex:1;display:grid;grid-template-columns:375px minmax(520px,1fr) 335px;overflow:hidden}
.pane{display:flex;flex-direction:column;overflow:hidden}
.pane.left,.pane.right{background:var(--c-raised)}
.pane.left,.pane.mid{border-right:1px solid var(--c-line)}
.pane > header{height:32px;flex:none;padding:0 11px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--c-line);white-space:nowrap;background:var(--c-raised)}
.pane > header .h{font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.pane > header a{margin-left:auto;font-size:var(--t-label)}
.pane .body{flex:1;overflow:auto;padding:11px}
.pane.mid .body{padding:0;background:var(--c-bg);font:400 var(--t-xs)/1.75 var(--f-mono)}
.pane > footer{flex:none;height:32px;border-top:1px solid var(--c-line);background:var(--c-raised);display:flex;align-items:center;gap:12px;padding:0 11px;white-space:nowrap;font-size:var(--t-label);color:var(--c-t3);overflow:hidden}
.frame{border:1px dashed var(--c-gate);background:var(--c-bg);height:288px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:14px;text-align:center}
.pagestrip{margin-top:11px;display:flex;gap:4px;flex-wrap:wrap}
.pagestrip i{width:47px;height:62px;border:1px solid var(--c-line);background:var(--c-bg);display:block}
.pagestrip i:first-child{border-color:var(--c-acc)}
.banner{flex:none;padding:7px 11px;white-space:normal;line-height:1.55}
.banner.bad{border-bottom:1px solid var(--c-bad);background:var(--c-bad-wash)}
.banner.quiet{border-bottom:1px solid var(--c-line);background:var(--c-raised);font-size:var(--t-label);color:var(--c-t2)}
.diff-line{display:flex}
.diff-line .ln{flex:none;width:42px;text-align:right;padding-right:7px;color:var(--c-t3)}
.diff-line .rn{flex:none;width:32px;text-align:right;padding-right:7px;color:var(--c-t3)}
.diff-line .mk{flex:none;width:18px}
.diff-line .tx{white-space:pre}
.diff-line.add{background:var(--c-ok-wash)}
.diff-line.add .mk{color:var(--c-ok)}
.diff-line.del{background:var(--c-bad-wash)}
.diff-line.del .mk{color:var(--c-bad)}
.diff-line.dropped{box-shadow:inset 2px 0 0 var(--c-bad)}
.diff-line.dropped .tx{color:var(--c-t1)}
.diff-fold{display:flex;height:24px;align-items:center;background:var(--c-raised);border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line);color:var(--c-t3);padding:0 7px;font-size:var(--t-nano);letter-spacing:.08em}
.callout{display:flex;align-items:center;gap:8px;padding:5px 7px;font-family:var(--f-sans);white-space:normal;line-height:1.5}
.callout .k{flex:none;font-weight:600;font-size:var(--t-label)}
.callout.dropped{background:var(--c-bad-wash);border-top:1px solid var(--c-bad);border-bottom:1px solid var(--c-bad)}
.callout.dropped .k{color:var(--c-bad)}
.callout.recovered{background:var(--c-ok-wash);border-top:1px solid var(--c-line)}
.callout.recovered .k{color:var(--c-ok)}
.signals{border:1px solid var(--c-line);background:var(--c-bg)}
.signals .kv{display:flex;align-items:center;gap:8px;height:26px;padding:0 9px}
.signals .kv .k{color:var(--c-t2);font-size:var(--t-label)}
.signals .kv .v{margin-left:auto}
.signals .kv.verdict{border-top:1px solid var(--c-line)}
.decide{display:flex;flex-direction:column;gap:6px}
.decide .row{display:flex;align-items:center;gap:7px;height:32px;padding:0 9px;border:1px dashed var(--c-gate);color:var(--c-t2);font-size:var(--t-label);cursor:not-allowed}
.decide .row .g{margin-left:auto;font:400 var(--t-nano) var(--f-mono);letter-spacing:.08em;color:var(--c-t3)}

/* A row's tag must never be the thing that gets clipped: an empty bordered box
   reads as a rendering fault, while an ellipsized filename reads as a long
   filename. The cell is a flex row so the name yields and the tag does not. */
td .namecell{display:flex;align-items:center;gap:6px;min-width:0}
td .namecell .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
td .namecell .tag{flex:none}

/* ---- sign-in door (DEV-102) ----------------------------------------
   Two-column door: story left, form right. Tokens from the login mock.
   border-box matches the mock — without it, width:100% inputs grow past
   the 19.5rem column (padding+border) and read as the wrong box size.
   Keep .signin-submit as the filled primary so CSS/tests still pin fill. */
body.door,body.door *{box-sizing:border-box}
body.door{min-height:100dvh;margin:0;background:#121314;color:#F5F3ED;font:1.125rem/1.45 var(--f-sans);-webkit-font-smoothing:antialiased}
.door-shell{position:relative;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 40px 72px}
.door-grid{width:100%;max-width:52rem;display:grid;grid-template-columns:1fr 19.5rem;gap:72px;align-items:center}
.door-kicker{margin:0 0 18px;font:600 .9375rem/1 var(--f-sans);letter-spacing:.04em;color:#E0DED7}
.door-walk{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:18px}
.door-walk li{display:grid;grid-template-columns:10px 1fr;gap:14px;align-items:start}
.door-walk i{width:10px;height:10px;margin-top:7px;border-radius:50%}
.door-walk i.orig{background:#F5F3ED}
.door-walk i.art{background:#6E6A62}
.door-walk i.ret{background:#3E9483}
.door-walk strong{display:block;font-size:1.125rem;font-weight:600;letter-spacing:-.01em}
.door-walk span{display:block;margin-top:4px;color:#CBC8C0;font-size:.9375rem;line-height:1.45}
.door-form{display:grid;gap:16px;width:100%}
.door-mark{display:flex;flex-direction:row;align-items:center;gap:10px;margin-bottom:28px}
.door-mark img{width:22px;height:22px;display:block}
.door-mark .name{font:600 1.25rem/1 var(--f-sans);letter-spacing:.16em}
.door-form label{display:grid;gap:7px}
.door-form label>span{font:600 .875rem/1 var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:#CBC8C0}
.door-form input{height:46px;padding:0 12px;background:#1E1F21;border:1px solid #55585C;color:#F5F3ED;outline:none;font:inherit;width:100%}
.door-form input:focus{border-color:#3E9483}
.door-form .err{margin:0;color:#E0DED7;font-size:.9375rem}
.door-form .signin-submit,.door-form .go{display:block;width:100%;height:48px;margin-top:6px;border:0;background:var(--c-acc);color:var(--c-bg);font:600 1.125rem/1 var(--f-sans);cursor:pointer;-webkit-appearance:none;appearance:none}
.door-form .signin-submit:hover,.door-form .go:hover{background:#348274;filter:none}
.door-form .door-create{margin:10px 0 0;font:400 .9375rem/1.45 var(--f-sans);color:#CBC8C0;cursor:default;user-select:none}
a.door-create{cursor:pointer;text-decoration:none;color:#CBC8C0}
a.door-create:hover{color:#3E9483;text-decoration:underline}
.door-site{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font:600 .875rem/1 var(--f-mono);letter-spacing:.08em;color:#CBC8C0}
.door-site:hover{color:#3E9483}
@media (max-width:820px){.door-grid{grid-template-columns:1fr;gap:36px;max-width:21rem}}
/* Legacy compact card selectors retained for CSS pin tests. */
body.signin{min-height:100dvh;display:flex;align-items:center;justify-content:center;background:var(--c-bg);padding:24px}
.signin-card{width:260px;max-width:100%;background:var(--c-raised);border:1px solid var(--c-line);padding:16px 16px 14px}
.signin-brand{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.signin-brand img{height:22px;width:auto;display:block}
.signin-brand span{font:600 var(--t-chrome)/1 var(--f-sans);letter-spacing:.14em;color:var(--c-t1)}
.signin-error{border:1px solid var(--c-bad);background:var(--c-bad-wash);color:var(--c-t1);padding:8px 10px;margin-bottom:12px;font-size:var(--t-label);line-height:1.5;white-space:normal}
.signin-form{display:flex;flex-direction:column}
.signin-label{font:600 var(--t-micro) var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c-t3);margin-bottom:4px}
.signin-label + .signin-input{margin-bottom:10px}
.signin-input{height:26px;border:1px solid var(--c-line);background:var(--c-hover);color:var(--c-t1);padding:0 8px;font-size:var(--t-body);width:100%}
.signin-input:focus{border-color:var(--c-acc);outline:none}
.signin-submit{height:26px;margin-top:2px;border:1px solid var(--c-acc);background:var(--c-acc);color:var(--c-bg);cursor:pointer;font:600 var(--t-body) var(--f-sans);-webkit-appearance:none;appearance:none}
.signin-submit:hover{filter:brightness(1.1)}
/* The sign-out row is a POST form, because signing out is a write. It is
   styled to sit in the account menu exactly as the links beside it do. */
.pop-form{margin:0}
.pop-form button.pop-row{font:inherit;cursor:pointer}

/* ---- DEV-102 live-run strip + journey + capacity (Alain GO 2026-08-21) --- */
@keyframes live-pulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes live-pill-pulse{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.18)}
}
@keyframes live-bar-probe{
  0%{transform:scale(1);opacity:1}
  55%{transform:scale(1.35);opacity:.55}
  100%{transform:scale(1);opacity:1}
}
@keyframes live-sweep{0%{left:-30%}100%{left:100%}}

/* Expand strip — replaces the old 40px single-row chrome */
.live-strip{
  grid-column:1 / 3;
  grid-row:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
  min-height:44px;
  height:auto;
  padding:0 14px;
  gap:0;
  background:var(--c-raised);
  border-bottom:1px solid var(--c-line);
  cursor:pointer;
  white-space:nowrap;
  overflow:visible;
  text-decoration:none;
  color:inherit;
  position:relative;
  z-index:30;
}
.live-strip:hover{text-decoration:none;background:var(--c-hover)}
.live-strip[hidden]{display:none!important}

.ls-main{display:flex;align-items:center;gap:10px;width:100%;height:44px;flex:none;min-width:0}
.ls-state{display:inline-flex;align-items:center;gap:10px;flex:none}
.ls-verb{display:inline-flex;align-items:baseline;gap:8px;font-size:var(--t-body);color:var(--c-t1)}
.ls-slash{color:var(--c-t3);font-weight:400}
.ls-subject{color:var(--c-t1);font-weight:600}
.ls-count{margin-left:auto;display:inline-flex;align-items:baseline;gap:8px;flex:none;font-variant-numeric:tabular-nums}

.live-strip .live-docs-stat{font:400 var(--t-body)/1 var(--f-sans);font-variant-numeric:tabular-nums;color:var(--c-t1)}
.live-strip .live-progress-meta{color:var(--c-t3);font-size:var(--t-body);margin:0}

.live-pill{
  flex:none;display:inline-flex;align-items:center;gap:5px;
  background:var(--c-ok);color:#0E1411;
  font:600 var(--t-label)/1 var(--f-sans);letter-spacing:.06em;
  padding:2px 6px;border-radius:2px;
}
.live-pill.stopping{background:var(--c-warn);animation:none}
.live-strip .live-pill:not(.stopping){animation:live-pill-pulse 1.8s ease-in-out infinite}
.live-pill .dot,.folder-active .dot,.live-dot{
  width:5px;height:5px;background:#0E1411;border-radius:50%;
  animation:live-pulse 1.4s ease-in-out infinite;display:inline-block;flex:none;
}
.live-dot.ok{background:var(--c-ok);animation:none}

.ls-meta{
  display:none;align-items:baseline;flex-wrap:wrap;gap:8px 14px;
  width:100%;padding:2px 0 10px;font-size:var(--t-micro);color:var(--c-t3);
  position:static;white-space:normal;line-height:1.45;
}
.live-strip:hover .ls-meta,
.live-strip:focus-within .ls-meta{display:flex}

.ls-pair{display:inline-flex;align-items:baseline;gap:5px;flex:none}
.ls-pair .v,.ls-pair .ls-code,.ls-pair .ls-time{color:var(--c-t2)}
.ls-code{font-weight:500;color:var(--c-t2);font-size:var(--t-micro)}
.ls-time{color:var(--c-t3);font-size:var(--t-micro)}
.ls-go{margin-left:auto;display:inline-flex;align-items:baseline;gap:8px;flex:none}

.live-strip .live-progress{
  position:absolute;left:0;right:0;bottom:0;height:4px;padding:0;
  display:block;overflow:visible;z-index:40;pointer-events:none;
}
.live-strip .live-bar,
.live-strip .live-bar.known{
  width:100%;height:4px;display:block;
  background:rgba(62,148,131,.18);position:relative;overflow:visible;
}
.live-strip .live-bar > i{
  height:4px;background:var(--c-acc);display:block;position:relative;z-index:1;min-width:0;max-width:100%;
}
.live-strip .live-bar.indeterminate > i{
  position:absolute;top:0;left:-30%;width:30%;height:4px;animation:live-sweep 1.6s linear infinite;
}
.live-strip .live-bar-probe{
  position:absolute;left:0;bottom:-4px;width:12px;height:12px;margin-left:-6px;
  border-radius:50%;background:#5BB8A8;border:2px solid #0E1411;
  animation:live-bar-probe 1.25s ease-out infinite;
  pointer-events:none;z-index:41;
}
.live-strip:has(.live-pill.stopping) .live-bar-probe,
.live-strip .live-bar.indeterminate ~ .live-bar-probe{animation:none;opacity:0}
.live-strip .live-meta{margin:0;color:var(--c-t3);font-size:var(--t-micro)}
.live-strip .live-meta[hidden],
.live-strip .live-meta:empty{display:none !important}
.live-strip .live-go{font-size:var(--t-micro);color:var(--c-acc)}

/* Journey / shared capacity still use these (not the strip expand layout) */
.live-phase{flex:none;font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.08em;color:var(--c-acc)}
.live-progress{flex:none;display:inline-flex;align-items:center;gap:8px;font-size:var(--t-label)}
.live-bar{position:relative;width:110px;height:5px;background:var(--c-track);overflow:hidden;display:inline-block}
.live-bar > i{display:block;height:5px;background:var(--c-acc)}
.live-bar.indeterminate > i{position:absolute;top:0;left:-30%;width:30%;animation:live-sweep 1.6s linear infinite}
.live-bar.known{width:140px;display:inline-flex}
.live-bar.jp-bar{flex:1;width:auto;height:12px}
.live-bar.jp-bar > i,.live-bar.jp-bar.indeterminate > i{height:12px}
.live-progress-text{font-size:var(--t-label);display:inline-flex;align-items:baseline;gap:0}
.live-docs-stat{font:600 var(--t-stat)/1.1 var(--f-sans);font-variant-numeric:tabular-nums}
.live-progress-meta{color:var(--c-t2);font-size:var(--t-label)}
.live-chips{flex:none;display:inline-flex;gap:6px;font-size:var(--t-label)}
.live-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--c-line);padding:1px 6px}
.live-chip.bad{border-color:var(--c-bad);background:var(--c-bad-wash)}
.live-chip .v{font-weight:600;font-variant-numeric:tabular-nums}
.live-chip .v.ok,.id-row .v.ok,.cap-val.ok,.gate-pass.ok,.ev-k.ok{color:var(--c-ok)}
.live-chip .v.bad,.id-row .v.bad,.ev-k.bad{color:var(--c-bad)}
.live-chip .v.warn,.id-row .v.warn,.cap-val.warn,.gate-pass.warn,.ev-k.warn{color:var(--c-warn)}
.live-meta{margin-left:auto;flex:none;color:var(--c-t3);font-size:var(--t-label)}
.live-go{flex:none;font-size:var(--t-label);color:var(--c-acc)}

.journey{border-bottom:1px solid var(--c-line);background:var(--c-raised);padding:12px 14px 16px}
.journey-quiet{border-bottom:1px solid var(--c-line);background:var(--c-raised);padding:12px 14px;color:var(--c-t2);font-size:var(--t-label)}
.journey-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;white-space:nowrap;overflow:hidden}
.journey-phases{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:12px}
.phase-card{border:1px solid var(--c-line);padding:8px 10px}
.phase-card.active{box-shadow:inset 2px 0 0 var(--c-acc)}
.phase-card.pending{border-style:dashed;border-color:var(--c-gate)}
.phase-title{display:flex;align-items:center;gap:6px;font-weight:600}
.phase-card.pending .phase-title{color:var(--c-t2)}
.phase-dot{width:5px;height:5px;border-radius:50%;background:var(--c-t3);flex:none}
.phase-card.done .phase-dot{background:var(--c-ok)}
.phase-card.active .phase-dot{background:var(--c-acc);animation:live-pulse 2s ease-in-out infinite}
.phase-card.pending .phase-dot{background:transparent;border:1px solid var(--c-gate)}
.phase-note{margin-top:3px;font-size:var(--t-label);color:var(--c-t2)}
.phase-card.pending .phase-note{color:var(--c-t3)}
.journey-progress{margin-bottom:10px}
.jp-row{display:flex;align-items:center;gap:14px}
.jp-stat{flex:none;display:flex;align-items:baseline;gap:7px}
.jp-stat .n{font:600 var(--t-stat)/1.2 var(--f-sans);font-variant-numeric:tabular-nums}
.jp-stat .c,.jp-side{color:var(--c-t2);font-size:var(--t-label);flex:none}
.jp-caption{margin-top:5px;display:flex;justify-content:space-between;gap:12px;font-size:var(--t-label);color:var(--c-t3)}
.journey-time{display:flex;gap:28px;align-items:flex-end;flex-wrap:wrap;margin:10px 0 14px}
.journey-stat{display:flex;flex-direction:column;gap:3px}
.journey-stat .n{font:600 var(--t-stat)/1 var(--f-sans);font-variant-numeric:tabular-nums;color:var(--c-t1)}
.journey-stat .c{font-size:var(--t-label);color:var(--c-t2)}
.sec-label{font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.journey-rate{margin-bottom:16px}
.journey-rate-box{background:var(--c-bg);border:1px solid var(--c-line);padding:12px 14px}
.jr-head{display:flex;align-items:baseline;gap:10px;white-space:nowrap;margin-bottom:6px}
.jr-rate{margin-left:auto;font:600 var(--t-stat)/1 var(--f-sans);font-variant-numeric:tabular-nums}
.spark-empty{min-height:88px;border:1px dashed var(--c-gate);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;padding:12px 14px;font-size:var(--t-label);color:var(--c-t2);background:var(--c-bg)}
.spark-empty.tall{min-height:110px}
.spark-empty .quiet{color:var(--c-t3)}
.spark-chart{display:flex;gap:8px;align-items:stretch}
.spark-ylab{flex:none;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;font-size:var(--t-label);color:var(--c-t3);padding:2px 0;font-variant-numeric:tabular-nums}
.spark-plot{flex:1;min-width:0;position:relative;height:130px;background:var(--c-bg)}
.spark-plot svg{display:block;width:100%;height:100%}
.spark-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:var(--t-label);color:var(--c-t3);pointer-events:none;text-align:center;padding:8px}
.spark-xlab{display:flex;justify-content:space-between;font-size:var(--t-label);color:var(--c-t3);margin-top:3px;padding-left:1.5rem}
.spark-stub{height:26px;margin-top:6px}
.spark-stub svg{display:block;width:100%;height:26px}
.journey-idgrid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-bottom:14px}
.journey-idgrid h3,.journey-queue h3{margin:0 0 7px;font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.id-row{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:28px;font-size:var(--t-label)}
.id-row .k{color:var(--c-t2)}
.id-row .v{font-weight:600;font-variant-numeric:tabular-nums;font-size:var(--t-stat);line-height:1}
.id-row .v.mono{font-family:var(--f-mono);font-size:var(--t-sm);font-weight:400;line-height:inherit}
.id-row .v-wrap{display:inline-flex;align-items:center;gap:8px;flex:none}
.gate-chip{font:400 var(--t-nano) var(--f-mono);letter-spacing:.08em;color:var(--c-t3);border:1px dashed var(--c-gate);padding:1px 4px;white-space:nowrap}
.outcome-note{margin-top:4px;font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.5}
.journey-queue,.journey-events-block{margin-top:14px}
.jq-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;white-space:nowrap}
.journey-folders{width:100%}
.journey-folders th{height:auto;padding:4px 8px 4px 0}
.journey-folders td{height:auto;padding:5px 8px 5px 0;font-size:var(--t-label)}
.journey-folders tr.active{background:rgba(62,148,131,.08);box-shadow:inset 2px 0 0 var(--c-acc)}
.folder-active{display:inline-flex;align-items:center;gap:5px;background:var(--c-acc);color:#0E1411;font-size:var(--t-label);font-weight:600;padding:2px 8px;border-radius:2px}
.folder-active .dot{background:#0E1411;width:5px;height:5px}
.folder-bar{width:140px;height:4px;background:var(--c-track)}
.folder-bar > i{display:block;height:4px}
.folder-bar > i.ok{background:var(--c-ok)}
.journey-events{max-height:170px;overflow:auto;border:1px solid var(--c-line);background:var(--c-bg)}
.ev-row{display:flex;gap:12px;height:24px;align-items:center;white-space:nowrap;padding:0 8px}
.ev-row:hover{background:var(--c-hover)}
.ev-t{flex:none;font:400 var(--t-xs,var(--t-nano)) var(--f-mono);color:var(--c-t3)}
.ev-k{flex:none;width:145px;font-size:var(--t-label);font-weight:600}
.ev-x{overflow:hidden;text-overflow:ellipsis;color:var(--c-t2);font-size:var(--t-label)}

.deploy-strip{margin:10px 14px 12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;border:1px solid var(--c-line);padding:7px 12px;font-size:var(--t-label);line-height:1.5}
.deploy-strip-label{flex:none;font:600 var(--t-micro) var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.deploy-kv{display:inline-flex;gap:6px;align-items:baseline;white-space:nowrap}
.deploy-kv .k{color:var(--c-t3)}
.deploy-kv .v{font-weight:600;font-variant-numeric:tabular-nums}
.deploy-kv .v.mono{font-family:var(--f-mono);font-weight:400;font-size:var(--t-sm)}
.pub-panels{display:grid;gap:18px;padding:0 14px 18px}
.pub-panels .section-label{margin-bottom:7px}

.infra-verdict{margin:10px 14px 12px;display:flex;align-items:center;gap:10px;border:1px solid var(--c-line);padding:7px 12px;font-size:var(--t-label);line-height:1.5;white-space:nowrap;overflow:hidden}
.infra-verdict.ok{border-color:var(--c-ok);background:var(--c-bg)}
.infra-verdict.warn{background:var(--c-raised);border-color:var(--c-warn)}
.infra-verdict.bad{background:var(--c-bad-wash);border-color:var(--c-bad)}
.infra-verdict-dot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--c-ok);animation:live-pulse 2s ease-in-out infinite}
.infra-verdict.warn .infra-verdict-dot{background:var(--c-warn);animation:none}
.infra-verdict.bad .infra-verdict-dot{background:var(--c-bad);animation:none}
.infra-verdict-label{flex:none;font-weight:600;color:var(--c-ok)}
.infra-verdict.warn .infra-verdict-label{color:var(--c-warn)}
.infra-verdict.bad .infra-verdict-label{color:var(--c-bad)}
.infra-verdict-text{overflow:hidden;text-overflow:ellipsis;color:var(--c-t2)}
.main:has(.infra-detail-panel){margin-right:min(620px,100vw)}
.app.infra-detail-open .main{margin-right:min(620px,100vw)}
.cap{margin:6px 0 8px}
.cap-row{display:flex;align-items:baseline;gap:8px;margin-bottom:3px;font-size:var(--t-label)}
.cap-row .lab{color:var(--c-t2)}
.cap-row .val{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:600}
.cap-track{position:relative;height:6px;background:var(--c-track);overflow:hidden}
.cap-track.thin{height:5px;flex:1;display:flex}
.cap-track > i{display:block;height:100%}
.cap-track > i.ok{background:var(--c-ok)}
.cap-track > i.warn{background:var(--c-warn)}
.cap-track > i.bad{background:var(--c-bad)}
.cap-track .mark{position:absolute;top:0;bottom:0;width:1px;background:var(--c-t3);opacity:.55}
.cap-track .mark.tall{top:-2px;bottom:auto;height:9px;background:var(--c-warn)}
.cap-track .mark.tall[style*="90%"]{background:var(--c-bad)}
.cap-cap{font-size:var(--t-label);color:var(--c-t2);margin-top:3px}
.cap-inline{display:flex;align-items:center;gap:8px;height:26px;white-space:nowrap;margin:2px 0}
.cap-lab{flex:none;width:52px;color:var(--c-t2);font-size:var(--t-label)}
.cap-val{flex:none;font-variant-numeric:tabular-nums}
.cap-free{flex:none;font-size:var(--t-label);color:var(--c-t3)}
.cap-rule{font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.5;margin:0 0 6px}
.cap-rule.warn-line{color:var(--c-warn)}
.infra .detail{cursor:pointer;color:var(--c-acc)}
.infra .detail:hover{text-decoration:underline}
.infra-gauge{font:600 var(--t-stat)/1 var(--f-sans);font-variant-numeric:tabular-nums;margin:4px 0 2px}
.compute-sub{display:flex;align-items:center;gap:8px;margin-bottom:8px;white-space:nowrap}
.compute-sub .pick{margin:0;overflow:hidden;text-overflow:ellipsis}
.health-dot{flex:none;display:inline-flex;align-items:center;gap:5px;font-size:var(--t-label)}
.health-dot.ok{color:var(--c-ok)}
.health-dot.ok::before,.health-dot.warn::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.health-dot.warn{color:var(--c-warn)}
.sample-age{margin-left:auto;flex:none;font-size:var(--t-label);color:var(--c-t3)}
.gauge-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:9px}
.gauge,.vital{background:var(--c-bg);border:1px solid var(--c-line);padding:8px 10px 7px}
.g-lab{font:600 var(--t-nano)/1 var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.g-val{font:600 var(--t-stat)/1.3 var(--f-sans);font-variant-numeric:tabular-nums;margin-top:2px}
.g-val.mono{font-family:var(--f-mono)}
.g-cap{font-size:var(--t-label);color:var(--c-t3);white-space:normal;line-height:1.4;overflow:hidden}
.gate-row{display:flex;align-items:center;gap:8px;height:28px;white-space:nowrap;margin-top:4px}
.gate-chip-live{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--c-line);padding:1px 6px;font:400 var(--t-label) var(--f-mono)}
.gate-pass{margin-left:auto;flex:none;font-size:var(--t-label)}
.host-spark{margin-top:10px;background:var(--c-bg);border:1px solid var(--c-line);padding:9px 11px}
.slideover.wide{width:min(620px,100vw)}
.infra-detail-scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:60}
.slideover.infra-detail-panel{position:fixed;top:0;right:0;bottom:0;width:min(620px,100vw);z-index:61;box-shadow:-12px 0 32px rgba(0,0,0,.35)}
.slideover.infra-detail-panel header{height:46px;padding:0 16px}
.slideover.infra-detail-panel .detail-body{padding:12px 16px}
.gate-list-head{font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3);margin-bottom:8px}
.service-row{display:flex;align-items:center;gap:8px;height:28px;white-space:nowrap;font-size:var(--t-label)}
.service-row .dot{width:5px;height:5px;border-radius:50%;flex:none}
.service-row .dot.ok{background:var(--c-ok)}
.service-row .dot.warn{background:var(--c-warn)}
.service-row .mono{font:400 var(--t-sm) var(--f-mono)}
.service-note{color:var(--c-t2);overflow:hidden;text-overflow:ellipsis}
.service-age{margin-left:auto;flex:none;color:var(--c-t3);font-size:var(--t-label)}
.detail-body{padding:12px 16px;overflow:auto;flex:1}
.detail-body h3{margin:14px 0 8px;font:600 var(--t-micro)/1 var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-t3)}
.detail-body h3:first-child{margin-top:0}
.detail-body table{width:100%}
.detail-body .k{color:var(--c-t2)}
.detail-body .v{text-align:right;font-variant-numeric:tabular-nums}
.detail-note{font-size:var(--t-label);color:var(--c-t2);line-height:1.55;white-space:normal;margin-top:10px}
.detail-story{padding:0 0 12px;border-bottom:1px solid var(--c-line);margin-bottom:4px}
.story-title{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-weight:600}
.story-body{color:var(--c-t2);line-height:1.6;white-space:normal;font-size:var(--t-label)}
.vital-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.history-tabs{display:flex;align-items:center;gap:6px;margin:12px 0 8px;white-space:nowrap;flex-wrap:wrap}
.hist-chip{height:22px;padding:0 9px;display:inline-flex;align-items:center;border:1px solid var(--c-line);font-size:var(--t-label)}
.hist-chip.on{background:var(--c-hover);font-weight:600}
.hist-chip.gated{border-style:dashed;border-color:var(--c-gate);color:var(--c-t3)}
.history-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px}
.tall-frame .spark-plot{height:96px;border:1px solid var(--c-line);background:var(--c-bg);padding:10px 12px}
