/* ════════════════════════════════════════════════════════════════════════════
   MERIDIAN — clean-sheet presentation (Command Center). Flat matte, hairline
   borders, NO glass / glow / gradient-cards / dark-shadows / count-ups.
   Brand: Voltage (dark, default) / Quiet Capital (light, html.light).
   The proven data/auth/render engine (appended below) reads CSS custom props via
   readTheme()/THEME — so BOTH token-name sets are defined here on the same brand
   values: the app-v2 names (--acc,--panel,--line…) for fresh chrome, and the
   engine's legacy names (--accent,--card,--bg-1…) so every render fn re-skins.
   ════════════════════════════════════════════════════════════════════════════ */
/* ════ shell / header (the only backdrop-filter — the sticky header, per spec) ════ */
.wrap{max-width:1440px;margin:0 auto;padding:0 20px}
header.topbar{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topin{display:flex;align-items:center;gap:16px;height:58px;min-width:0}
.wordmark{display:inline-flex;align-items:center;gap:10px;flex-shrink:0}
.wm-glyph{width:26px;height:26px;flex-shrink:0;border-radius:7px;background:var(--acc);
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 46'%3E%3Cpath d='M12 28 L19 28 L24 18 L29 22 L34 11' stroke='%23070809' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='34' cy='11' r='2.7' fill='%23070809'/%3E%3C/svg%3E");
  background-size:80%;background-position:center;background-repeat:no-repeat}
html.light .wm-glyph,html[data-theme=paper] .wm-glyph{background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 46'%3E%3Cpath d='M12 28 L19 28 L24 18 L29 22 L34 11' stroke='%23ffffff' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='34' cy='11' r='2.7' fill='%23ffffff'/%3E%3C/svg%3E")}
.wm-name{font-family:var(--disp);font-weight:800;font-size:19px;letter-spacing:-.02em;line-height:1}
.wm-sub{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);margin-top:3px}
.nav{display:flex;gap:3px;min-width:0;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.tab-btn{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:6px 13px;border-radius:8px;color:var(--mut);background:transparent;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:color .15s,background .15s,border-color .15s}
.tab-btn:hover:not(.active){color:var(--tx2);background:var(--panel2)}
.tab-btn.active{color:var(--acc);background:var(--acc-soft);border-color:var(--acc-line);box-shadow:0 0 0 1px var(--acc-soft),0 4px 14px -8px var(--acc-glow)}
.sp{flex:1 1 auto;min-width:8px}
/* always-on status zone */
.statuszone{display:flex;align-items:center;gap:8px;flex-shrink:0;font-family:var(--mono);font-size:11px;color:var(--mut)}
.chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:4px 10px;white-space:nowrap;color:var(--mut);transition:border-color .15s,color .15s}
.chip b{color:var(--tx);font-weight:600}
.chip.live{color:var(--up);background:var(--up-soft);border-color:var(--up-line);box-shadow:0 0 0 1px var(--up-soft),0 4px 14px -8px rgba(53,217,138,.4)}
.chip.halt{color:var(--dn);background:var(--dn-soft);border-color:var(--down-line);box-shadow:0 0 0 1px var(--dn-soft),0 4px 14px -8px rgba(255,93,107,.4)}
.iconbtn{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;border:1px solid var(--line);background:transparent;color:var(--tx2);cursor:pointer;flex-shrink:0;transition:color .12s,border-color .12s}
.iconbtn:hover{color:var(--tx);border-color:var(--line2)}
.iconbtn.on{color:var(--acc);border-color:var(--acc-line)}
.linkbtn{font-family:var(--mono);font-size:10.5px;padding:5px 11px;border-radius:7px;background:var(--bg2);border:1px solid var(--line);color:var(--mut);cursor:pointer;white-space:nowrap;transition:color .12s}
.linkbtn:hover{color:var(--tx)}
.linkbtn.acc{background:var(--acc-soft);border-color:var(--acc-line);color:var(--acc)}

/* scope switcher (header pills) */
#scope-toggle{display:inline-flex;gap:2px;padding:2px;background:var(--bg2);border:1px solid var(--line);border-radius:8px;flex-shrink:0}
#scope-toggle button{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:5px 10px;border:none;background:transparent;color:var(--mut);border-radius:6px;cursor:pointer;-webkit-appearance:none;appearance:none;transition:color .12s,background .12s}
#scope-toggle button.on{color:var(--acc);background:var(--acc-soft)}

/* news ticker */
#news-ticker{overflow:hidden;white-space:nowrap;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent)}
#news-inner{display:inline-block;font-family:var(--mono);font-size:11px;color:var(--tx2);animation:ticker 70s linear infinite}
#news-inner:hover{animation-play-state:paused}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ════ context strip (BTC.D / F&G / OI) — compact readouts with an accent tick ════ */
.ctx-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ctx-pill{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px;box-shadow:var(--elev);position:relative;overflow:hidden}
.ctx-pill::before{content:"";position:absolute;left:0;top:14%;bottom:14%;width:2px;border-radius:2px;background:var(--acc);opacity:.5}
.ctx-label{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--mut);white-space:nowrap}
.ctx-pill .text-sm{font-size:14px;font-weight:600}

/* ════ KPI strip — elevated rail, hairline dividers, the hero balance as the anchor ════ */
#kpi-rail{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel);box-shadow:var(--elev);position:relative}
/* a hairline of brand light along the top edge of the rail — the signature "charged" cue */
#kpi-rail::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--acc-line) 24%,var(--acc-line) 76%,transparent);opacity:.7;pointer-events:none}
/* Balance+P&L merged into one pill (they share the same curve); DD is the second. Every pill
   carries a full-bleed history curve behind its figures — text z-index:1, .hero-bg layer z-index:0. */
#hero-band{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr)}
#hero-band>div{padding:22px 24px 20px;border-right:1px solid var(--line);min-width:0;position:relative;overflow:hidden}
#hero-band>div>*{position:relative;z-index:1}
#hero-band>div:last-child{border-right:none}
.hero-bg{position:absolute!important;inset:0;z-index:0!important;pointer-events:none}
.hero-bg svg{width:100%;height:100%;display:block}
.hero-bg-cap{position:absolute!important;right:12px;bottom:8px;font-family:var(--mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);pointer-events:none}
.stat-label{font-family:var(--mono);font-size:8.5px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--mut)}
/* the balance + P&L figures share a baseline row */
.hero-figs{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-top:8px}
.hero-bal{font-family:var(--disp);font-weight:800;font-size:clamp(42px,4vw,58px);line-height:1;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:var(--tx);min-height:56px;white-space:nowrap}
.hero-pnl{font-family:var(--disp);font-weight:700;font-size:clamp(22px,2vw,28px);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--up);white-space:nowrap}
.hero-sub-sep{color:var(--line2)}
.hero-sub{display:flex;align-items:baseline;gap:12px;font-family:var(--mono);font-size:11px;color:var(--mut);margin-top:8px;flex-wrap:wrap}
.hero-chip .stat-val{font-size:30px;margin-top:8px}
.stat-val{font-family:var(--disp);font-weight:700;font-size:22px;line-height:1.05;font-variant-numeric:tabular-nums;color:var(--tx);min-height:26px}
.stat-sub{font-family:var(--mono);font-size:10px;color:var(--mut);margin-top:4px;min-height:14px}
#kpi-sub{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
#kpi-sub .kpi-mini{display:flex;align-items:baseline;gap:8px;background:var(--bg2);padding:9px 16px;min-width:0;white-space:nowrap;overflow:hidden;border-right:1px solid var(--line)}
#kpi-sub .kpi-mini:last-child{border-right:none}
#kpi-sub .kpi-mini .k{font-family:var(--mono);font-size:8.5px;font-weight:500;text-transform:uppercase;letter-spacing:.09em;color:var(--mut);flex-shrink:0}
#kpi-sub .kpi-mini .v{font-family:var(--disp);font-size:16px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--tx)}
#kpi-sub .kpi-mini .s{font-family:var(--mono);font-size:9.5px;color:var(--mut);overflow:hidden;text-overflow:ellipsis}
@media(max-width:820px){#hero-band{grid-template-columns:1fr}#hero-band>div{border-right:none;border-bottom:1px solid var(--line)}#hero-band>div:last-child{border-bottom:none}}
@media(max-width:1180px){#kpi-sub{grid-template-columns:repeat(2,1fr)}#kpi-sub .kpi-mini:nth-child(2){border-right:none}}
@media(max-width:640px){.hero-bal{font-size:42px;min-height:42px}}

/* risk rail (auto-fit pills) */
#risk-rail{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}

/* ════ 3-zone Overview grid ════ */
.zone3{display:grid;grid-template-columns:220px 1fr 300px;gap:16px;align-items:start}
.zone3 .col{display:flex;flex-direction:column;gap:16px;min-width:0}
/* side rails are JS-pinned to the centre column's height (syncRails); grow-card fills the slack + scrolls overflow so all 3 bottoms align */
.zone3 .col .grow-card{flex:1 1 auto;min-height:140px;display:flex;flex-direction:column;overflow:hidden}
.zone3 .col .grow-card>.scroll{flex:1 1 auto;overflow-y:auto;min-height:0}
#recent-trades .rt-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 16px;border-bottom:1px solid var(--line)}
#recent-trades .rt-row:last-child{border-bottom:none}
#recent-trades .rt-row:hover{background:var(--panel2)}
@media(max-width:1100px){.zone3{grid-template-columns:1fr;align-items:start}.zone3 .col .grow-card{flex:none}.zone3 .col .grow-card>.scroll{max-height:460px}}
.row{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line);font-size:12.5px}
.row:last-child{border-bottom:none}
.row .k{color:var(--mut);font-family:var(--mono);font-size:11px}
.row .v{font-family:var(--mono);font-weight:500;color:var(--tx)}

/* watchlist */
#watchlist .wl{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 16px;border-bottom:1px solid var(--line);position:relative;cursor:pointer}
#watchlist .wl:last-child{border-bottom:none}
#watchlist .wl:hover{background:var(--panel2)}
#watchlist .wl.haspos{box-shadow:inset 2px 0 0 var(--acc)}
#watchlist .wl b{font-family:var(--disp);font-weight:600;font-size:13px;color:var(--tx)}
#watchlist .wl .px{font-family:var(--mono);font-size:9.5px;color:var(--mut)}
#watchlist .wl .c{font-family:var(--mono);font-size:10.5px;text-align:right}

/* fear & greed gauge block */
.fg-block{display:flex;align-items:center;gap:14px}
.fg-block .fgnum{font-family:var(--disp);font-weight:800;font-size:24px;line-height:1;font-variant-numeric:tabular-nums}

/* ════ position bar (the signature component) ════ */
/* The row grid was scoped to #positions-strips (the Desk tab's container) while every child
   rule below is global. renderPositionStrips() takes a container id, so the AI Desk panel
   (#ad-pos) got the track, the detail line and the R column — but no grid: the row's children
   fell back to block layout and stacked full-width. Scope the row to the class, not the
   container, so a strip looks identical wherever it is rendered. */
.pos-row{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s}
.pos-row:last-child{border-bottom:none}
.pos-row:hover,.pos-row.active-strip{background:var(--panel2)}
.pos-coin{display:flex;flex-direction:column;gap:5px;min-width:64px}
.pos-coin .c{font-family:var(--disp);font-weight:600;font-size:15px;letter-spacing:-.01em;color:var(--tx)}
.pos-mid{display:flex;flex-direction:column;gap:7px;min-width:0}
.pos-track{height:5px;background:var(--bg2);border:1px solid var(--line2);border-radius:99px;position:relative}
.pos-track .fill{position:absolute;top:0;bottom:0;left:0;border-radius:99px}
.pos-track .entry{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--tx);opacity:.9;border-radius:1px}
.pos-track .exit{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--acc);opacity:.95;border-radius:1px}
.pos-track .cc{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--acc);opacity:.42;border-radius:1px}
.pos-detail{display:flex;gap:12px;font-family:var(--mono);font-size:10px;color:var(--mut);flex-wrap:wrap}
.pos-r{text-align:right;font-family:var(--mono);white-space:nowrap}
.pos-r .upnl{font-size:15px;font-weight:600}.pos-r .upnl.up{color:var(--up)}.pos-r .upnl.down{color:var(--dn)}
.pos-r .rr{font-size:11px;color:var(--mut);margin-top:3px}
.empty-note{text-align:center;font-family:var(--mono);font-size:11px;color:var(--mut);padding:16px 12px}

/* ════ chart panel ════ */
#chart-btns{display:grid;grid-template-columns:repeat(9,1fr);gap:4px;padding:10px 14px}
@media(max-width:640px){#chart-btns{grid-template-columns:repeat(6,1fr);gap:5px;padding:8px 10px}}
.cbtn{font-family:var(--mono);font-size:11px;padding:6px 4px;border-radius:7px;background:var(--bg2);color:var(--mut);cursor:pointer;text-align:center;width:100%;position:relative;border:1px solid var(--line);transition:color .15s,background .15s,border-color .15s}
.cbtn:hover{background:var(--panel2);color:var(--tx);border-color:var(--line2)}
.cbtn.active{background:var(--acc-soft);color:var(--acc);border-color:var(--acc-line);box-shadow:0 0 0 1px var(--acc-soft)}
.cbtn .pos-dot{position:absolute;top:3px;right:4px;width:5px;height:5px;border-radius:50%}
#tv-chart-container{height:460px;position:relative}
#chart-legend{position:absolute;top:9px;left:13px;z-index:10;pointer-events:none;font-family:var(--mono)}
.tfpill{font-family:var(--mono);font-size:10px;padding:3px 9px;border-radius:6px;background:var(--bg2);border:1px solid var(--line);color:var(--mut);cursor:pointer}
.tfpill.on{background:var(--acc-soft);border-color:var(--acc-line);color:var(--acc)}
#adx-badge,#ch-badge,#sig-badge{font-family:var(--mono);font-size:11px;padding:2px 7px;border-radius:6px;background:var(--bg2);border:1px solid var(--line)}

/* ════ tables ════ */
.tbl{width:100%}
.tbl th{color:var(--mut);font-family:var(--mono);font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;padding:9px 12px;border-bottom:1px solid var(--line);font-weight:500;text-align:left}
.tbl td{padding:9px 12px;font-size:12.5px;font-family:var(--mono)}
.tbl tbody tr{border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent)}
.tbl tbody tr:last-child{border-bottom:none}
.tbl tbody tr:nth-child(even){background:color-mix(in srgb,var(--bg2) 50%,transparent)}
.tbl tr:hover td,.trow:hover td,.trow:hover{background:var(--panel2)}
.tbl td.coin,.tbl td .coin{font-family:var(--disp);font-weight:600}
.th-sort{cursor:pointer;white-space:nowrap;user-select:none}
.page-btn{font-family:var(--mono);font-size:11px;padding:3px 8px;border-radius:6px;background:var(--bg2);border:1px solid var(--line);color:var(--mut);cursor:pointer}
.page-btn.active{background:var(--acc-soft);color:var(--acc);border-color:var(--acc-line)}
.tf-chip{font-family:var(--mono);font-size:10px;padding:3px 8px;border-radius:6px;background:var(--bg2);border:1px solid var(--line);color:var(--mut);cursor:pointer}
.tf-chip:hover{color:var(--tx2)}
.tf-chip.on{background:var(--acc-soft);border-color:var(--acc-line);color:var(--acc)}
.detail-grid{grid-template-columns:repeat(6,1fr)}
@media(max-width:640px){.detail-grid,#td-detail-grid{grid-template-columns:repeat(3,1fr)!important}}

/* fold */
.fold-btn{cursor:pointer;user-select:none;display:flex;align-items:center;gap:8px}
.fold-icon{font-size:10px;color:var(--faint);transition:transform .2s;display:inline-block}
.fold-icon.open{transform:rotate(0deg)}.fold-icon.closed{transform:rotate(-90deg)}

/* ════ monitor / gate card ════ */
#mon-stats .mon-cell{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:11px 13px}
#mon-stats .mon-cell .k{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin-bottom:7px}
#mon-stats .mon-cell .mlive{font-family:var(--mono);font-size:18px;font-weight:500;display:block}
#mon-stats .mon-cell .mexp{font-family:var(--mono);font-size:10px;color:var(--mut);margin-top:4px;display:block}
#mon-stats .mon-bar{height:3px;background:var(--line);border-radius:99px;margin-top:9px;overflow:hidden}
#mon-stats .mon-bar i{display:block;height:100%;border-radius:99px}

/* ════ market grid (Market tab) ════ */
#market-grid .mtile{background:var(--bg2);border:1px solid var(--line);border-left:2px solid var(--line);border-radius:8px;padding:9px 10px;cursor:pointer;transition:border-color .12s;display:flex;flex-direction:column;height:108px;overflow:hidden}
#market-grid .mtile .ebody{flex:1 1 auto;overflow:hidden;min-height:0;display:flex;flex-direction:column;gap:2px}
#market-grid .mtile:hover{border-color:var(--line2)}
#market-grid .mtile.haspos{border-left-color:var(--mut)}
#market-grid .gdiv{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin:4px 2px 0}
#market-grid .gdiv::after{content:"";flex:1;height:1px;background:var(--line)}
#market-grid .gdiv.mkt-toggle{cursor:pointer;margin-top:10px}
#market-grid .gdiv.mkt-toggle:hover{color:var(--tx)}
#market-grid .mtile.quiet{opacity:.55}
#market-grid .mtile .top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
#market-grid .mtile .c{font-family:var(--disp);font-weight:600;font-size:12.5px;color:var(--tx)}
#market-grid .mtile .top .mstate{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.02em;padding:1px 6px;border-radius:5px;white-space:nowrap}
#market-grid .mtile .mstate.live{color:var(--up);background:var(--up-soft);border:1px solid var(--up-line)}
#market-grid .mtile .mstate.watch{color:var(--acc);background:var(--acc-soft);border:1px solid var(--acc-line)}
#market-grid .mtile .mstate.veto{color:var(--dn);background:var(--dn-soft);border:1px solid var(--down-line)}
#market-grid .mtile .top .cpx{font-family:var(--mono);font-size:10px;font-weight:500;color:var(--mut);margin-left:7px}
#market-grid .mtile .msig{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.03em;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#market-grid .mtile .msig.long{color:var(--up)}#market-grid .mtile .msig.short{color:var(--dn)}
#market-grid .mtile .msig.primed{color:var(--acc)}#market-grid .mtile .msig.flat{color:var(--mut)}
#market-grid .mtile .ch{height:4px;background:var(--bg2);border:1px solid var(--line);border-radius:99px;position:relative;overflow:hidden;flex-shrink:0;margin-top:6px}
#market-grid .mtile .ch i{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--mut);border-radius:1px}
#market-grid .mtile .ch.trend i{background:var(--acc)}
#market-grid .mtile .ch .buf{position:absolute;top:-1px;bottom:-1px;background:var(--acc-soft)}
#market-grid .mtile .ch .ez{position:absolute;top:0;bottom:0;width:11%}
#market-grid .mtile .ch .emt{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--violet);opacity:.85;border-radius:1px}
#market-grid .mtile.primed{border-left-color:var(--acc)}
#market-grid .mtile.sig-long{border-left-color:var(--up);border-left-width:3px}
#market-grid .mtile.sig-short{border-left-color:var(--dn);border-left-width:3px}
#market-grid .mtile .adx{font-family:var(--mono);font-size:9px;color:var(--mut)}
#market-grid .mtile .px{font-family:var(--mono);font-size:11px;color:var(--mut);margin-bottom:7px}
#market-grid .mtile .ebody>div{font-family:var(--mono);font-size:9px}
.mkt-divider{grid-column:1/-1;height:1px;background:var(--line);margin:2px 0}

/* r-bar (per-coin) */
.r-bar-wrap{display:flex;align-items:center;gap:6px}
.r-bar-bg{flex:1;height:4px;background:var(--panel2);border-radius:99px;overflow:hidden;min-width:40px}
.r-bar-fill{height:100%;border-radius:99px}

/* equity/monthly chart canvases sit in cards */

/* ════ treasury flow tab ════ */
.trf-wrap{padding:16px}
.trf-rail{display:flex;align-items:stretch;gap:8px;flex-wrap:wrap}
.trf-node{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:11px 13px;flex:1 1 150px;min-width:138px}
.trf-node .trf-k{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut)}
.trf-node .trf-v{font-family:var(--disp);font-size:19px;font-weight:700;margin-top:4px;line-height:1.15;font-variant-numeric:tabular-nums}
.trf-node .trf-s{font-size:10px;color:var(--mut);margin-top:4px;line-height:1.35;font-family:var(--mono)}
.trf-gate{background:var(--acc-soft);border-color:var(--acc-line);flex:0 1 190px}
.trf-arrow{display:flex;align-items:center;justify-content:center;color:var(--faint);font-size:15px;flex:0 0 auto}
.trf-fan{text-align:center;font-family:var(--mono);font-size:10px;color:var(--faint);margin:14px 0 11px;letter-spacing:.03em}
.trf-splits{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.trf-split{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:10px 11px 11px}
.trf-split .trf-k{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut)}
.trf-pct{font-family:var(--mono);font-size:9px;font-weight:600;white-space:nowrap}
.trf-split .trf-v{font-family:var(--disp);font-size:17px;font-weight:700;margin-top:5px;line-height:1.1;font-variant-numeric:tabular-nums}
.trf-dest{font-size:10px;color:var(--mut);margin-top:4px;min-height:14px;font-family:var(--mono)}
.trf-bar{height:4px;background:var(--line);border-radius:99px;overflow:hidden;margin-top:9px}
.trf-bar>i{display:block;height:100%;border-radius:99px;transition:width .5s}
.trf-status{font-family:var(--mono);font-size:9px;color:var(--faint);margin-top:5px;min-height:13px}
.trf-tag{display:inline-block;font-family:var(--mono);font-size:8.5px;letter-spacing:.03em;padding:1px 5px;border-radius:5px;border:1px solid var(--line);margin-top:8px;margin-right:4px}
.trf-clocks{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:14px}
.trf-clock{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:11px 12px}
.trf-clock .cw-t{font-size:11px;font-weight:600;color:var(--tx2)}
.trf-clock .cw-when{font-family:var(--mono);font-size:10px;color:var(--acc);margin-top:4px}
.trf-clock .cw-d{font-size:10px;color:var(--mut);margin-top:7px;line-height:1.45}
.trf-note{font-size:11.5px;line-height:1.55;color:var(--tx2);background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:9px 12px}
.trf-note b{color:var(--tx)}
@media(max-width:900px){.trf-splits,.trf-clocks{grid-template-columns:repeat(2,1fr)}}

/* stat-pill (perf) */
.stat-pill{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 14px}
.stat-label2{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut);margin-bottom:4px}

/* calendar */
.cal-row{display:grid;grid-template-columns:repeat(7,1fr) .8fr;gap:4px;margin-bottom:4px}
.cal-dow{font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.05em;color:var(--mut);text-align:center;text-transform:uppercase;padding-bottom:2px}
.cal-cell{background:var(--bg2);border:1px solid var(--line);border-radius:6px;min-height:56px;padding:4px 6px;position:relative}
.cal-empty{background:transparent;border:none}
.cal-day{font-family:var(--mono);font-size:9px;color:var(--mut)}
.cal-day-dim{color:var(--faint)}
.cal-r{font-family:var(--disp);font-size:13px;font-weight:700;margin-top:7px;font-variant-numeric:tabular-nums}
.cal-n{font-family:var(--mono);font-size:9px;color:var(--mut);margin-top:1px}
.cal-week{background:var(--panel);border-color:var(--line);display:flex;flex-direction:column;justify-content:center;align-items:center}
.cal-nav{background:var(--bg2);border:1px solid var(--line);color:var(--mut);border-radius:6px;width:26px;height:26px;cursor:pointer;font-size:15px;line-height:1}
.cal-nav:hover{color:var(--tx)}
.cal-cell.cal-has{cursor:pointer;transition:border-color .12s}
.cal-cell.cal-has:hover{border-color:var(--line2)}
.cal-cell.cal-sel{border-color:var(--acc)!important;box-shadow:0 0 0 1px var(--acc-line)}
.cal-cell .cal-dot{position:absolute;top:5px;right:6px;width:5px;height:5px;border-radius:50%}
#cal-detail{border-top:1px solid var(--line);padding:12px 16px}
.cd-row{display:grid;grid-template-columns:64px 52px 1fr auto auto;gap:10px;align-items:center;padding:7px 10px;border:1px solid var(--line);border-radius:6px;margin-bottom:5px;background:var(--bg2);cursor:pointer}
.cd-row:hover{background:var(--panel2)}
@media(max-width:640px){.cal-cell{min-height:42px;padding:3px 4px}.cal-r{font-size:11px;margin-top:3px}.cal-dow{font-size:8px}}
.rep-h{font-family:var(--mono);font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--mut);margin-bottom:8px}
@media(max-width:640px){#rep-metrics{grid-template-columns:repeat(3,1fr)!important}.rep-grid{grid-template-columns:1fr!important}}

/* offramp / refresh buttons (engine references via inline; keep base) */
.bell-btn{display:inline-flex;align-items:center;justify-content:center;padding:6px 9px;background:var(--bg2);border:1px solid var(--line);border-radius:7px;cursor:pointer;color:var(--mut)}
.bell-btn:hover{color:var(--tx)}
.bell-btn.on{color:var(--acc);border-color:var(--acc-line)}

/* ════ gate (matches app-v2 aesthetic; flat matte) ════ */
#gate{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px}
#gate-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:42px 36px 34px;width:360px;max-width:100%;text-align:center}
html.light #gate-box,html[data-theme=paper] #gate-box{box-shadow:0 1px 3px rgba(0,0,0,.06)}
#gate-box .glyph{width:50px;height:50px;margin:0 auto 22px;border-radius:13px;background:var(--acc);
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 46'%3E%3Cpath d='M12 28 L19 28 L24 18 L29 22 L34 11' stroke='%23070809' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='34' cy='11' r='2.7' fill='%23070809'/%3E%3C/svg%3E");background-size:74%;background-position:center;background-repeat:no-repeat}
html.light #gate-box .glyph,html[data-theme=paper] #gate-box .glyph{background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 46'%3E%3Cpath d='M12 28 L19 28 L24 18 L29 22 L34 11' stroke='%23ffffff' stroke-width='3' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='34' cy='11' r='2.7' fill='%23ffffff'/%3E%3C/svg%3E")}
#gate-box h1{font-family:var(--disp);font-size:30px;font-weight:800;letter-spacing:-.03em;margin-bottom:6px}
#gate-box p{font-size:13px;color:var(--mut);margin-bottom:24px}
/* (legacy #gate-input / #gate-btn / #gate-pw-toggle CSS removed 2026-07-04 — the typed-password
   DOM and its unlock path were deleted; Google sign-in is the only gate now.) */
#gate-error{font-size:12px;color:var(--dn);margin-top:10px;min-height:18px}
#gate-google{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:13px;border-radius:10px;background:#fff;color:#1f2328;font-family:var(--ui);font-size:14px;font-weight:600;cursor:pointer;border:1px solid var(--line);transition:filter .12s,transform .12s}
#gate-google:hover{filter:brightness(.95);transform:translateY(-1px)}
#gate-google:active{transform:translateY(0)}
.gate-shake{animation:gshake .4s}
@keyframes gshake{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(2px)}30%,50%,70%{transform:translateX(-4px)}40%,60%{transform:translateX(4px)}}

/* ════ toasts ════ */
#toast-wrap{position:fixed;top:14px;right:14px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:330px}
@media(max-width:768px){#toast-wrap{top:8px;right:8px;left:8px;max-width:none}}
.toast{pointer-events:auto;display:flex;align-items:stretch;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;transform:translateX(120%);opacity:0;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s}
html.light .toast,html[data-theme=paper] .toast{box-shadow:0 8px 24px rgba(20,24,32,.16)}
.toast.in{transform:translateX(0);opacity:1}
.toast.out{transform:translateX(120%);opacity:0}
.toast-bar{width:3px;flex-shrink:0}
.toast-body{flex:1;min-width:0;padding:9px 11px}
.toast-title{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--tx);display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.toast-detail{font-family:var(--mono);font-size:11px;color:var(--mut);margin-top:2px}
.toast-x{pointer-events:auto;background:none;border:none;color:var(--faint);font-size:15px;line-height:1;padding:7px 9px;cursor:pointer;align-self:flex-start}
.toast-x:hover{color:var(--mut)}
.toast-clear{align-self:flex-end;pointer-events:auto;display:none;font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:var(--mut);background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:3px 9px;cursor:pointer}
.toast-clear:hover{color:var(--tx)}

/* trust footer */
.trust-footer{display:flex;align-items:center;justify-content:center;gap:9px;font-family:var(--mono);font-size:10px;color:var(--faint);padding:18px 8px 26px;white-space:nowrap;overflow:hidden;flex-wrap:wrap}
.trust-footer svg{flex-shrink:0;opacity:.7}
.trust-footer .wm{font-family:var(--disp);font-weight:600;font-size:11px;letter-spacing:.02em;color:var(--mut)}
.trust-footer .sep{color:var(--ghost)}

/* demo banner */
.demo-banner{display:none;align-items:center;gap:8px;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);background:var(--acc-soft);border:1px solid var(--acc-line);border-radius:999px;padding:4px 13px;margin:0 auto 14px;width:max-content;max-width:100%;flex-shrink:0}

/* a11y */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
button:focus-visible,a:focus-visible,input:focus-visible,[role=tab]:focus-visible,[role=button]:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:4px}
.val-flash{}
@media(prefers-reduced-motion:no-preference){.val-flash{animation:valflash .45s ease-out}@keyframes valflash{0%{filter:brightness(1.5)}100%{filter:brightness(1)}}
  .strip-pulse{animation:stripPulse 1.5s ease-out 2}@keyframes stripPulse{0%{background:var(--acc-soft)}100%{background:transparent}}
  /* per-tick strip flash (whole row, Dom 2026-07-03): green = P&L ticked up, red = down (side-aware) */
  .pos-row.tick-up{animation:tickUp .7s ease-out}
  .pos-row.tick-down{animation:tickDown .7s ease-out}
  @keyframes tickUp{0%{background:color-mix(in srgb,var(--up) 16%,transparent)}100%{background:transparent}}
  @keyframes tickDown{0%{background:color-mix(in srgb,var(--down) 16%,transparent)}100%{background:transparent}}}

/* ════════════════════ UNIFIED RESPONSIVE — one DOM, reflowed (shell v2) ════════════════════ */
@media(max-width:768px){
  .hide-mobile{display:none!important}
  /* header compresses: tabs move to the bottom nav; keep brand + status + actions */
  .topin{height:50px;gap:10px}
  .topin .nav{display:none}
  .wm-sub{display:none}
  .statuszone .chip:not(.live):not(#live-badge){display:none}
  #hdr-clock{display:none!important}
  .topin .iconbtn{width:34px;height:34px}
  #brief-btn,#stream-btn,#bell-btn{display:none}   /* reachable from the More sheet */
  /* second header row: scope + heat scroll, ticker hides */
  .subrow2{overflow-x:auto;scrollbar-width:none}
  .subrow2::-webkit-scrollbar{display:none}
  #news-ticker{display:none}
  #hdr-next{display:none}
  /* content grids collapse */
  .zone3{grid-template-columns:1fr!important}
  .ctx-strip{grid-template-columns:1fr 1fr}
  .ctx-strip .ctx-pill:last-child{grid-column:1/-1}
  #risk-rail{grid-template-columns:1fr!important}
  #kpi-sub{grid-template-columns:repeat(2,1fr)}
  #kpi-sub .kpi-mini:nth-child(2n){border-right:none}
  #kpi-sub .kpi-mini:nth-child(n+3){border-top:1px solid var(--line)}
  .hero-bal{font-size:38px;min-height:40px}
  .hero-pnl{font-size:20px}
  /* tables scroll inside their panels, never the page */
  .card .overflow-x-auto{overflow-x:auto}
  .trust-footer{display:none}
}

/* ── compact "glance" cards — still used by renderMStatus/MEdge/MTsum/MRegime/MTreasury
   (Desk/Market tab synthesized reads). The rest of the old #mobile-view shell CSS that used
   to live in this section was removed 2026-07-04 (dead since the dual-DOM mobile view was
   deleted) — see .pos-row for the live position-bar equivalent of the old .m-pos cards. ── */
.m-card{
  background:var(--panel);border:1px solid var(--line);border-radius:10px;
  width:100%;box-sizing:border-box;overflow:hidden;min-width:0;
}
.m-section-hdr{font-family:var(--mono);font-weight:500;text-transform:uppercase;color:var(--mut);letter-spacing:.1em;font-size:10px}
.m-label{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}

/* ════ Brief (marked.js) — flat matte re-skin ════ */
.brief-md{font-size:13.5px;line-height:1.62;color:var(--tx2);overflow-wrap:break-word}
.brief-hero{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:10px;padding:18px 20px 17px;margin-bottom:14px;background:var(--panel)}
.brief-hero::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--acc)}
.brief-eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);display:flex;align-items:center;gap:7px;margin-bottom:8px}
.brief-eyebrow .dot{width:5px;height:5px;border-radius:50%;background:var(--acc)}
.brief-hero h1{font-family:var(--disp);font-weight:800;font-size:22px;line-height:1.2;color:var(--tx);margin:0;letter-spacing:-.02em}
.brief-hero-meta{font-family:var(--mono);font-size:11px;color:var(--mut);margin-top:8px}
.brief-tagline{font-style:italic;color:var(--mut);font-size:12.5px;margin-top:10px;padding-left:11px;border-left:2px solid var(--acc-line)}
.brief-tagline em{color:var(--mut)}
.brief-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:9px;margin-top:15px}
.brief-tile{position:relative;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:11px 13px 12px 16px;overflow:hidden}
.brief-tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--st)}
.brief-tile .lane{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--mut)}
.brief-tile .lane .led{width:7px;height:7px;border-radius:50%;background:var(--st);flex-shrink:0}
.brief-tile .head{font-size:12px;color:var(--tx);margin-top:7px;line-height:1.45}
.brief-tile .head strong{font-family:var(--mono);font-weight:600}
.brief-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;margin-bottom:13px;overflow:hidden}
.brief-card-hd{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid var(--line);background:var(--bg2);font-family:var(--disp);font-weight:700;font-size:13.5px;color:var(--tx)}
.brief-card-hd::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--acc);transform:rotate(45deg);flex-shrink:0}
.brief-card-bd{padding:13px 16px}
.brief-card-bd>:first-child{margin-top:0}.brief-card-bd>:last-child{margin-bottom:0}
.brief-thesis{background:var(--acc-soft);border:1px solid var(--acc-line);border-radius:10px;padding:14px 16px;margin-bottom:13px}
.brief-thesis .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:var(--acc);margin-bottom:8px}
.brief-thesis>:last-child{margin-bottom:0}
.brief-md h2{font-size:16px;font-weight:700;color:var(--tx);margin:22px 0 9px;padding-top:16px;border-top:1px solid var(--line)}
.brief-md h2:first-child{border-top:none;padding-top:0;margin-top:2px}
.brief-md h3{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--tx2);margin:15px 0 7px;text-transform:uppercase}
.brief-md p{margin:8px 0}.brief-md strong{color:var(--tx);font-weight:600}
.brief-md a{color:var(--acc);text-decoration:none;border-bottom:1px dotted var(--acc-line)}
.brief-md ul,.brief-md ol{margin:8px 0;padding-left:19px}.brief-md li{margin:4px 0}
.brief-md em{color:var(--mut)}
.brief-md blockquote{margin:10px 0;padding:9px 13px;border-left:3px solid var(--acc);background:var(--bg2);border-radius:0 8px 8px 0;color:var(--mut)}
.brief-md blockquote p{margin:0}
.brief-md code{font-family:var(--mono);font-size:12px;background:var(--bg2);border:1px solid var(--line);border-radius:4px;padding:1px 5px;color:var(--tx2)}
.brief-md hr{display:none}
.brief-md pre{position:relative;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:27px 14px 13px;overflow-x:auto;margin:11px 0}
.brief-md pre::before{content:"";position:absolute;left:13px;top:12px;width:8px;height:8px;border-radius:50%;background:var(--dn);box-shadow:14px 0 0 var(--warn),28px 0 0 var(--up)}
.brief-md pre code{background:none;border:none;padding:0;font-size:11.5px;line-height:1.55;white-space:pre;color:var(--tx2)}
.brief-md table{border-collapse:separate;border-spacing:0;width:100%;margin:11px 0;font-family:var(--mono);font-size:11.5px;border:1px solid var(--line);border-radius:8px;overflow:hidden;display:block;overflow-x:auto}
.brief-md thead th{background:var(--bg2);color:var(--mut);font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-size:10px;text-align:left;padding:8px 11px;border-bottom:1px solid var(--line);white-space:nowrap}
.brief-md tbody td{padding:7px 11px;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent);color:var(--mut);white-space:nowrap}
.brief-md tbody tr:last-child td{border-bottom:none}
.brief-md tbody tr:nth-child(even){background:color-mix(in srgb,var(--bg2) 45%,transparent)}
.brief-md td strong{color:var(--tx)}
.brief-cell-up{color:var(--up)!important;font-weight:600}
.brief-cell-down{color:var(--dn)!important;font-weight:600}
.brief-cell-warn{color:var(--warn)!important;font-weight:600}
ul.brief-alerts{list-style:none;padding:0;margin:8px 0}
.brief-alert{display:block;padding:9px 12px;border-radius:8px;margin:7px 0;background:var(--bg2);border:1px solid var(--line);border-left:3px solid var(--al)}
.brief-alert strong{color:var(--tx)}
/* ════ Board (kanban) — flat matte re-skin ════ */
.board-wip-chip{font-family:var(--mono);font-size:10px;color:var(--mut);background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:3px 9px;display:inline-flex;align-items:center;gap:4px}
.board-wip-n{font-weight:700;color:var(--tx2)}
.board-wip-over .board-wip-n{color:var(--dn)}
.board-lane-btn{font-family:var(--mono);font-size:10px;letter-spacing:.04em;padding:3px 9px;border-radius:6px;background:var(--bg2);border:1px solid var(--line);color:var(--mut);cursor:pointer}
.board-lane-btn.active{background:var(--acc-soft);border-color:var(--acc-line);color:var(--acc)}
.board-grid{display:grid;grid-template-columns:repeat(5,minmax(180px,1fr));gap:10px;overflow-x:auto;padding-bottom:4px}
@media(max-width:900px){.board-grid{grid-template-columns:repeat(3,minmax(160px,1fr))}}
@media(max-width:560px){.board-grid{grid-template-columns:repeat(2,minmax(150px,1fr))}}
.board-col{background:var(--bg2);border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;min-width:0}
.board-col-hdr{display:flex;align-items:center;justify-content:space-between;padding:9px 11px 8px;border-bottom:1px solid var(--line);flex-shrink:0}
.board-col-title{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.board-col-count{font-family:var(--mono);font-size:10px;background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:var(--mut)}
.board-col-body{padding:8px 7px;display:flex;flex-direction:column;gap:6px;flex:1 1 auto}
.board-card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 11px 9px;transition:border-color .12s}
.board-card:hover{border-color:var(--line2)}
.board-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:6px;margin-bottom:6px}
.board-card-id{font-family:var(--mono);font-size:9px;color:var(--faint);flex-shrink:0;padding-top:1px}
.board-card-ws{font-family:var(--mono);font-size:9px;padding:1px 6px;border-radius:5px;flex-shrink:0}
.board-card-title{font-size:12px;font-weight:600;color:var(--tx);line-height:1.38;margin-bottom:4px}
.board-card-notes{font-size:11px;color:var(--mut);line-height:1.45;display:none}
.board-card.expanded .board-card-notes{display:block}
.board-card-foot{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:6px}
.board-card-lane{font-family:var(--mono);font-size:9px;color:var(--mut);background:var(--bg2);border:1px solid var(--line);border-radius:5px;padding:1px 5px}
.board-card-gate{font-family:var(--mono);font-size:9px;color:var(--acc);border:1px dotted var(--acc-line);border-radius:5px;padding:1px 5px}
.board-card[data-lane="Crypto"]{border-left:3px solid #c6f24e}
.board-card[data-lane="Prop"]{border-left:3px solid #3fae9e}
.board-card[data-lane="TradFi"]{border-left:3px solid #8aa2b3}
.board-card[data-lane="Infra"]{border-left:3px solid #8891a0}
.board-card[data-lane="Research"]{border-left:3px solid #fb6f84}
.board-ws-crypto{background:rgba(198,242,78,.12);color:#c6f24e;border:1px solid rgba(198,242,78,.25)}
.board-ws-prop{background:rgba(126,184,247,.12);color:#3fae9e;border:1px solid rgba(126,184,247,.25)}
.board-ws-tradfi{background:rgba(247,198,126,.12);color:#8aa2b3;border:1px solid rgba(247,198,126,.25)}
.board-ws-infra{background:rgba(176,126,247,.12);color:#8891a0;border:1px solid rgba(176,126,247,.25)}
.board-ws-research{background:rgba(251,111,132,.12);color:#fb6f84;border:1px solid rgba(251,111,132,.25)}
.board-col[data-col="Done"] .board-card{opacity:.62}
.board-col[data-col="Done"] .board-card:hover{opacity:1}

/* tab panes */
.tab-pane{display:none}
.tab-pane.active{display:block}

/* ════════════════════ SHELL v2 — 6-tab IA chrome ════════════════════ */
/* compact account strip — every tab except Desk (body[data-tab] set by the switchTab wrapper) */
#mini-rail{display:none;grid-template-columns:repeat(6,minmax(0,1fr));border:1px solid var(--line);border-radius:10px;background:var(--panel);box-shadow:var(--elev);overflow:hidden;cursor:pointer}
body:not([data-tab=overview]) #mini-rail{display:grid}
.mini-cell{display:flex;align-items:baseline;gap:8px;padding:9px 14px;border-right:1px solid var(--line);min-width:0;overflow:hidden;white-space:nowrap}
.mini-cell:last-child{border-right:none}
.mini-cell .k{font-family:var(--mono);font-size:8.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);flex-shrink:0}
.mini-cell b{font-family:var(--disp);font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--tx);overflow:hidden;text-overflow:ellipsis}
#mini-rail:hover{border-color:var(--line2)}
@media(max-width:900px){#mini-rail{grid-template-columns:repeat(3,1fr)}.mini-cell:nth-child(3n){border-right:none}.mini-cell:nth-child(n+4){border-top:1px solid var(--line)}}

/* Brief drawer — the morning read as a right slide-over, any tab, any width */
#brief-drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,94vw);background:var(--panel);border-left:1px solid var(--line);z-index:80;transform:translateX(102%);transition:transform .22s ease;display:flex;flex-direction:column;box-shadow:var(--elev-hi)}
body.drawer-open #brief-drawer{transform:none}
#drawer-scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:79;opacity:0;pointer-events:none;transition:opacity .2s}
body.drawer-open #drawer-scrim{opacity:1;pointer-events:auto}
.bd-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);flex-shrink:0}
.bd-head .sp{flex:1}
.bd-age{font-size:11px;color:var(--faint)}
.bd-body{overflow-y:auto;flex:1;overscroll-behavior:contain;padding-bottom:28px}
.bd-body #brief-pulse{padding:14px 18px 0}
.bd-body #cclive-content{padding:6px 18px 0}
.bd-body #brief-content{padding:16px 18px}
@media(prefers-reduced-motion:reduce){#brief-drawer,#more-sheet{transition:none}}

/* bottom nav (mobile) + More sheet */
#mnav{display:none}
#more-sheet{position:fixed;left:0;right:0;bottom:0;background:var(--panel);border-top:1px solid var(--line);border-radius:16px 16px 0 0;z-index:85;transform:translateY(105%);transition:transform .22s ease;padding:6px 16px calc(14px + env(safe-area-inset-bottom))}
body.sheet-open #more-sheet{transform:none}
#sheet-scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:84;opacity:0;pointer-events:none;transition:opacity .2s}
body.sheet-open #sheet-scrim{opacity:1;pointer-events:auto}
.ms-grip{width:36px;height:4px;border-radius:2px;background:var(--line2);margin:6px auto 8px}
.ms-item{display:flex;width:100%;align-items:center;gap:12px;padding:13px 8px;border-bottom:1px solid var(--line);font-family:var(--ui);font-size:14px;font-weight:500;color:var(--tx);background:none;text-align:left;cursor:pointer}
.ms-item svg{color:var(--acc);flex-shrink:0}
.ms-item .ms-sub{margin-left:auto;font-family:var(--mono);font-size:9.5px;color:var(--faint);text-transform:none;letter-spacing:0}
.ms-row{display:flex;gap:8px;padding-top:12px}
.ms-row button{flex:1;padding:11px 4px;border:1px solid var(--line);border-radius:8px;font-family:var(--mono);font-size:10.5px;color:var(--tx2);background:var(--bg2);cursor:pointer}
@media(max-width:768px){
  #mnav{display:flex;position:fixed;bottom:0;left:0;right:0;background:color-mix(in srgb,var(--bg2) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:60;padding-bottom:env(safe-area-inset-bottom)}
  .mn-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 0 7px;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);background:none;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative}
  .mn-btn.active{color:var(--acc)}
  .mn-btn.active::after{content:"";position:absolute;top:0;width:18px;height:2px;border-radius:2px;background:var(--acc)}
  body{padding-bottom:calc(58px + env(safe-area-inset-bottom))}
}
/* closed overlays are fully hidden (not just translated) — keeps captures + a11y clean */
body:not(.drawer-open) #brief-drawer{visibility:hidden;transition:transform .22s ease,visibility 0s linear .25s}
body:not(.sheet-open) #more-sheet{visibility:hidden;transition:transform .22s ease,visibility 0s linear .25s}

/* ════════════════════ SHELL v2 · part 2 — freshness, events, compare, mobile chart ════════════════════ */
/* offline / stale banner — one global slot under the header banners */
.offline-banner{display:none;align-items:center;gap:10px;margin-bottom:14px;padding:10px 16px;border-radius:8px;font-family:var(--mono);font-size:12px}
.offline-banner.show{display:flex}
.offline-banner.off{background:var(--dn-soft);border:1px solid var(--down-line);border-left:4px solid var(--dn);color:var(--dn)}
.offline-banner.stale{background:var(--warn-soft);border:1px solid var(--warn-line);border-left:4px solid var(--warn);color:var(--warn)}

/* events feed (Ops) */
#events-list{max-height:420px;overflow-y:auto}
.ev-row{display:flex;align-items:baseline;gap:10px;padding:8px 16px;border-bottom:1px solid var(--line);min-width:0}
.ev-row:last-child{border-bottom:none}
.ev-bar{width:3px;align-self:stretch;border-radius:2px;flex-shrink:0}
.ev-time{font-family:var(--mono);font-size:10px;color:var(--faint);flex-shrink:0}
.ev-title{font-size:12.5px;font-weight:500;color:var(--tx);white-space:nowrap}
.ev-detail{font-family:var(--mono);font-size:10.5px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

/* compare view (Combined · Performance) */
.hd-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.cmp-sub{font-size:10px;color:var(--faint)}
.cmp-legend{display:flex;gap:14px;flex-wrap:wrap;padding:12px 16px 0;font-family:var(--mono);font-size:11px;color:var(--tx2)}
.cmp-key{display:inline-flex;align-items:center;gap:6px}
.cmp-key i{width:14px;height:3px;border-radius:2px;display:inline-block}
.cmp-key b{color:var(--tx);font-weight:600}
.cmp-plot{height:260px;padding:10px 16px 4px;position:relative}
.cmp-plot canvas{width:100%!important;height:100%!important}
.cmp-table th,.cmp-table td{white-space:nowrap}
.cmp-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:7px;vertical-align:0}

/* combined trade log filter */
.ct-filter{font-family:var(--mono);font-size:11px;background:var(--bg2);border:1px solid var(--line);border-radius:7px;color:var(--tx);padding:5px 10px;width:210px;max-width:45vw}
.ct-filter:focus{outline:none;border-color:var(--acc-line)}

/* mobile chart: sparkline-first — the full chart loads on demand */
#chart-expand{display:none}
@media(max-width:768px){
  body:not(.mchart-on) #tv-chart-container{display:none}
  body:not(.mchart-on) #chart-expand{display:flex;flex-direction:column;align-items:center;gap:4px;width:calc(100% - 32px);margin:12px 16px;padding:14px;border:1px dashed var(--line2);border-radius:10px;background:var(--bg2);color:var(--tx2);font-family:var(--ui);font-size:13px;font-weight:600;cursor:pointer}
  #chart-expand .mono{font-size:9.5px;color:var(--faint);letter-spacing:.08em;text-transform:uppercase;font-weight:400}
  body.mchart-on #chart-expand{display:none}
}
@media(max-width:768px){
  body.mchart-on #tv-chart-container{height:300px}
}
@media(max-width:768px){
  /* chart-header detail badges: the N/Hi/Lo readout is desktop context — it re-appears in the
     chart legend once the mobile chart is expanded. Headers wrap rather than push the page. */
  #ch-badge{display:none}
  .card .hd{flex-wrap:wrap}
  /* backstop: no element may scroll the page sideways (the harness still measures scrollWidth) */
  body{overflow-x:clip}
}
@media(max-width:768px){
  /* trade-context (crowding) rows are JS-generated fixed rows — let them wrap, never widen the page */
  #crowding-panel{overflow:hidden}
  #crowding-panel div{flex-wrap:wrap;min-width:0}
}
@media(max-width:400px){
  /* ultra-narrow (360): glyph-only brand, tighter status cluster — nothing may widen the page */
  .wm-name{display:none}
  .topin{gap:8px}
  .statuszone{gap:6px}
}
@media(max-width:768px){
  /* generated context rows (book-context macro cluster etc.) wrap inside their card */
  #book-context{overflow:hidden}
  #book-context div{flex-wrap:wrap;min-width:0}
  .tab-pane[data-tab="market"] .card{overflow:hidden}
}
@media(max-width:768px){
  /* mini-rail: stacked label-over-value so figures never truncate at 390 */
  .mini-cell{flex-direction:column;align-items:flex-start;gap:1px;padding:8px 12px}
  .mini-cell b{font-size:14px}
}
@media(max-width:768px){
  /* Ops freshness/health readouts: stack label over value — no mid-word wraps at 390 */
  .tab-pane[data-tab="system"] .ctx-pill{flex-direction:column;align-items:flex-start;gap:3px}
  .tab-pane[data-tab="system"] div[style*="grid-template-columns"]{grid-template-columns:1fr 1fr!important}
}

/* ════ SHELL v2 · part 3 — edge analytics ════ */
/* edge-quality (per-book Performance): cost tiles + MAE scatter */
.eq-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border-bottom:1px solid var(--line)}
.eq-tile{display:flex;flex-direction:column;gap:2px;padding:11px 16px;border-right:1px solid var(--line);min-width:0}
.eq-tile:last-child{border-right:none}
.eq-tile .k{font-family:var(--mono);font-size:8.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut)}
.eq-tile b{font-family:var(--disp);font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--tx);white-space:nowrap}
.eq-tile .s{font-family:var(--mono);font-size:9.5px;color:var(--faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eq-plot{height:240px;padding:8px 16px 4px;position:relative}
.eq-plot canvas{width:100%!important;height:100%!important}
.eq-cap{font-size:10px;color:var(--faint);padding:8px 16px 12px;line-height:1.5}
@media(max-width:768px){.eq-stats{grid-template-columns:1fr 1fr}.eq-tile:nth-child(2n){border-right:none}.eq-tile:nth-child(n+3){border-top:1px solid var(--line)}}

/* compare: rolling-sharpe strip */
.cmp-shead{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);padding:10px 16px 0}
.cmp-plot-sm{height:120px;padding-top:4px}

/* prop guard history */
.gh-body{padding:12px 16px 4px;display:flex;flex-direction:column;gap:12px}
.gh-row{display:grid;grid-template-columns:190px 1fr;gap:14px;align-items:center;min-width:0}
.gh-meta{display:flex;flex-direction:column;gap:1px;min-width:0}
.gh-meta .k{font-family:var(--mono);font-size:8.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--mut)}
.gh-meta b{font-family:var(--disp);font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--tx)}
.gh-meta .s{font-family:var(--mono);font-size:9px;color:var(--faint)}
.gh-spark{min-width:0}
@media(max-width:768px){.gh-row{grid-template-columns:120px 1fr}}
