/* =====================================================================
   STAGE PALETTE — page-local accents, derived from theme tokens.
   These NEVER redefine core tokens; they only name the four stages so the
   arc, chips and bands share one ramp. Each is verified legible on --panel
   in dark AND light (light overrides below).
   ===================================================================== */
:root{
  --s1:#7f97b3;              /* base — steel / dormant */
  --s2:var(--up);           /* advance — green */
  --s3:#d9a441;             /* top — amber / ripe */
  --s4:var(--down);         /* decline — red */
  /* Canonical Mastermind face: San Francisco on Apple platforms, with the
     self-hosted Inter family as the consistent cross-platform fallback. */
  --font-display:-apple-system,BlinkMacSystemFont,'SF Pro Display',Inter,system-ui,'Segoe UI',Roboto,sans-serif;
  --hair:color-mix(in srgb,var(--text) 8%,transparent);
  /* sentence-level secondary copy — clears the 7:1 body gate in BOTH themes
     (dark 8.26:1 / light 8.73:1 on the worst panel). --muted stays reserved
     for true labels / eyebrows / captions (short, non-sentence). */
  --muted-strong:color-mix(in srgb,var(--text) 55%,var(--muted));
}
html[data-theme="light"]{
  --s1:#5b7391; --s3:#a8791c;  /* darker steel/amber so chips clear 4.5:1 on white */
}
*,*::before,*::after{box-sizing:border-box}
html:not([data-lang="zh"]) .l-zh{display:none}
html[data-lang="zh"] .l-en{display:none}
html[data-lang="zh"] body{font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",Inter,sans-serif}
html body{margin:0;padding-top:24px;background:var(--bg);color:var(--text);
  font:14px/1.5 var(--font-display);
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
a{color:var(--ink-link, var(--link));text-decoration:none}
.tnum{font-variant-numeric:tabular-nums}
.mut{color:var(--muted)}
.wrap{max-width:1440px;margin:0 auto;padding:0 26px 96px;position:relative;z-index:1}
@media(max-width:640px){.wrap{padding:0 14px 72px}}

/* ── ambient wash (very restrained; static on reduced-motion) ── */
.aura{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.aura::before{content:"";position:absolute;top:-220px;left:4%;width:820px;height:560px;
  border-radius:50%;filter:blur(110px);
  background:radial-gradient(ellipse,color-mix(in srgb,var(--up) 9%,transparent) 0%,transparent 70%)}
.aura::after{content:"";position:absolute;bottom:-120px;right:-60px;width:680px;height:520px;
  border-radius:50%;filter:blur(110px);
  background:radial-gradient(ellipse,color-mix(in srgb,var(--info) 8%,transparent) 0%,transparent 70%)}
[data-theme="light"] .aura::before,[data-theme="light"] .aura::after{opacity:.5}

/* ── page header row ── */
.pghead{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  flex-wrap:wrap;margin:6px 0 4px}
.kick{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);margin:0 0 6px}
.pghead h1{margin:0;font-size:23px;font-weight:800;letter-spacing:-.02em;color:var(--text);
  font-family:var(--font-display)}
.pghead .sub{margin:5px 0 0;font-size:13px;color:var(--muted-strong);max-width:52ch;line-height:1.55}
/* `white-space:nowrap` was safe for the old one-word "Priced <date>" label, but
   the Wave 8 clock ("Stage week ended <date> · source tape through <date>") plus
   the coverage receipt are far longer and overflowed the viewport at 375px —
   measured .asof scrollWidth 374px inside a 347px .pghead, clipping the second
   date, "Weekly stage read" and "unknown". Wrap on narrow viewports; keep each
   clause and its date together so a line never breaks mid-phrase. */
.asof{font-size:11.5px;color:var(--muted);text-align:right;white-space:nowrap;
  max-width:100%;min-width:0}
.asof b{color:var(--text);font-weight:700;white-space:nowrap}
.asof .clk{display:inline-block}
@media (max-width:760px){
  .pghead .asof{white-space:normal;text-align:left;width:100%}
}

/* =====================================================================
   HERO — the stage arc (signature). An idealised Weinstein cycle with the
   whole universe scattered as density dots, four count-stations, one stance.
   ===================================================================== */
.hero{position:relative;margin:20px 0 8px;border:1px solid var(--line);border-radius:20px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 92%,transparent),var(--panel2));
  overflow:hidden;padding:26px 28px 22px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
.arc-wrap{position:relative;width:100%}
.arc-wrap svg{display:block;width:100%;height:auto}
.arc-stance-eyebrow{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin:0 0 8px}
.arc-state{font-size:30px;font-weight:800;letter-spacing:-.025em;line-height:1.08;margin:0 0 8px;
  font-family:var(--font-display)}
/* the big weather word — coloured to the dominant stage. The colour is set on
   --accent-c so light mode can darken it (the raw token is pale on white). It
   is 30px display text, so 3:1 is the WCAG floor, but we clear ~6:1 anyway. */
.arc-state .accent{color:var(--accent-c,var(--s2))}
.arc-state .accent.s3{--accent-c:var(--s3)}
.arc-state .accent.s4{--accent-c:var(--s4)}
html[data-theme="light"] .arc-state .accent{color:color-mix(in srgb,var(--accent-c,var(--s2)) 65%,var(--text))}
.arc-stance{font-size:14.5px;color:var(--text);line-height:1.55;margin:0 0 14px;max-width:40ch}
.arc-stance .em{color:var(--muted-strong)}
.stancepill{display:inline-flex;align-items:center;gap:7px;padding:6px 15px;border-radius:999px;
  font-size:13px;font-weight:700;border:1px solid var(--line)}
.stancepill.act{color:var(--ink-up, var(--up));border-color:color-mix(in srgb,var(--up) 45%,var(--line));
  background:color-mix(in srgb,var(--up) 12%,transparent)}
.stancepill.watch{color:var(--s3);border-color:color-mix(in srgb,var(--s3) 45%,var(--line));
  background:color-mix(in srgb,var(--s3) 12%,transparent)}
.stancepill.stand{color:var(--muted)}
.stancepill .dot{width:8px;height:8px;border-radius:50%;background:currentColor}

/* count stations under the arc */
.stations{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.stn{position:relative;padding:11px 12px 12px;border-radius:13px;border:1px solid var(--line);
  background:var(--panel);overflow:hidden}
.stn::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--sc,var(--muted))}
.stn .num{font-family:var(--font-display);font-size:26px;font-weight:700;line-height:1;letter-spacing:-.02em;
  color:var(--text)}
.stn .lab{display:block;font-size:11.5px;font-weight:600;margin-top:5px;color:var(--sc,var(--muted))}
.stn .sub{display:block;font-size:11px;color:var(--muted);margin-top:2px;line-height:1.35}
.stn.s1{--sc:var(--s1)} .stn.s2{--sc:var(--s2)} .stn.s3{--sc:var(--s3)} .stn.s4{--sc:var(--s4)}
.stn .roman{position:absolute;right:9px;top:7px;font-family:var(--font-display);font-size:12px;
  font-weight:700;color:var(--sc);opacity:.6}

/* =====================================================================
   TAB BAR + CONTROLS
   ===================================================================== */
.tabbar{display:flex;gap:3px;margin:22px 0 0;padding:4px;border-radius:14px;
  border:1px solid var(--line);background:var(--panel2);overflow-x:auto;scrollbar-width:none}
.tabbar::-webkit-scrollbar{display:none}
.tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:10px;
  font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;border:none;background:transparent;
  white-space:nowrap;transition:color .16s,background .16s}
.tab:hover{color:var(--text)}
.tab[aria-selected="true"]{color:var(--text);background:var(--panel);
  box-shadow:0 1px 0 color-mix(in srgb,var(--text) 6%,transparent),0 6px 18px -12px rgba(0,0,0,.5)}
.tab .tnum{font-family:var(--font-display);font-size:12px;font-weight:700;color:var(--muted);
  border:1px solid var(--line);border-radius:6px;padding:0 5px;line-height:16px}
.tab[aria-selected="true"] .tnum{color:var(--ink-info, var(--info));border-color:color-mix(in srgb,var(--info) 40%,var(--line))}
.tab:focus-visible{outline:2px solid color-mix(in srgb,var(--info) 70%,transparent);outline-offset:2px}

.controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:16px 0 4px}
.seg{display:inline-flex;padding:3px;border-radius:10px;border:1px solid var(--line);background:var(--panel2)}
.seg button{border:none;background:transparent;color:var(--muted);font-size:12.5px;font-weight:600;
  padding:5px 12px;border-radius:7px;cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--panel);color:var(--text);
  box-shadow:0 1px 0 color-mix(in srgb,var(--text) 6%,transparent)}
.seg button:focus-visible{outline:2px solid color-mix(in srgb,var(--info) 70%,transparent);outline-offset:1px}
.ctl-lab{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.searchbox{display:inline-flex;align-items:center;gap:7px;flex:1 1 200px;min-width:170px;max-width:320px;
  padding:7px 12px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);color:var(--text)}
.searchbox input{flex:1;border:none;background:transparent;color:var(--text);font-size:13px;outline:none}
.searchbox input::placeholder{color:var(--muted)}
.searchbox svg{flex:0 0 auto;opacity:.7}

/* =====================================================================
   SURFACE PANELS
   ===================================================================== */
.surface{margin-top:18px}
.surface[hidden]{display:none}

/* filter bar */
.filterbar{display:flex;flex-wrap:wrap;gap:9px 12px;align-items:flex-end;padding:14px 16px;
  border:1px solid var(--line);border-radius:14px;background:var(--panel2);margin-bottom:12px}
.filt{display:flex;flex-direction:column;gap:4px}
.filt label{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.filt select,.filt input{background:var(--panel);border:1px solid var(--line);color:var(--text);
  border-radius:8px;padding:5px 8px;font-size:12.5px;font-family:inherit;min-width:78px}
.filt input[type="number"]{width:74px}
.filt select:focus,.filt input:focus{outline:2px solid color-mix(in srgb,var(--info) 60%,transparent);
  outline-offset:0;border-color:color-mix(in srgb,var(--info) 45%,var(--line))}
@media(max-width:640px){
  .filterbar .filt{min-width:0;flex:1 1 140px;max-width:100%}
  .filterbar .filt select{width:100%;min-width:0;max-width:100%}
}
.fb-actions{margin-left:auto;display:flex;gap:8px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:9px;font-size:12.5px;
  font-weight:600;cursor:pointer;border:1px solid var(--line);background:var(--panel);color:var(--text)}
.btn:hover{border-color:color-mix(in srgb,var(--info) 45%,var(--line));color:var(--text)}
.btn.ghost{background:transparent;color:var(--muted)}
.btn:focus-visible{outline:2px solid color-mix(in srgb,var(--info) 70%,transparent);outline-offset:2px}
.showing{font-size:12px;color:var(--muted-strong)}
.showing b{color:var(--text);font-weight:700}

/* table */
.tbl-scroll{position:relative;border:1px solid var(--line);border-radius:14px;overflow:auto;
  background:var(--panel);max-height:74vh}
table.screener{border-collapse:separate;border-spacing:0;width:100%;min-width:1100px;font-size:12.5px}
.screener thead th{position:sticky;top:0;z-index:3;background:var(--panel2);color:var(--muted);
  font-weight:700;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;text-align:left;
  padding:11px 10px;border-bottom:1px solid var(--line);white-space:nowrap;cursor:pointer;user-select:none}
.screener thead th:hover{color:var(--text)}
.screener thead th .caret{opacity:0;font-size:9px;margin-left:3px;color:var(--ink-info, var(--info))}
.screener thead th[data-dir] .caret{opacity:1}
.screener thead th.num{text-align:right}
.screener thead th.sticky-l,.screener td.sticky-l{position:sticky;left:0;z-index:2;background:var(--panel)}
.screener thead th.sticky-l{z-index:4;background:var(--panel2)}
.screener tbody td{padding:9px 10px;border-bottom:1px solid var(--hair);vertical-align:middle;
  white-space:nowrap;color:var(--text)}
.screener tbody tr:hover td{background:color-mix(in srgb,var(--info) 5%,transparent)}
.screener tbody tr:hover td.sticky-l{background:color-mix(in srgb,var(--info) 7%,var(--panel))}
.screener td.num{text-align:right;font-variant-numeric:tabular-nums}
.tk{font-weight:700;color:var(--text);font-family:var(--font-display);letter-spacing:-.01em}
.tk[data-tip-en]{cursor:help;border-bottom:1px dotted color-mix(in srgb,var(--text) 30%,transparent)}
.nm{color:var(--muted);max-width:190px;overflow:hidden;text-overflow:ellipsis;display:inline-block;
  vertical-align:bottom}
.ind{color:var(--muted);font-size:12px;max-width:150px;overflow:hidden;text-overflow:ellipsis;
  display:inline-block;vertical-align:bottom}
.exp-btn{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;
  padding:2px 4px;line-height:1;transition:transform .18s,color .16s}
.exp-btn:hover{color:var(--text)}
tr.open .exp-btn{transform:rotate(90deg);color:var(--ink-info, var(--info))}
.exp-btn:focus-visible{outline:2px solid color-mix(in srgb,var(--info) 70%,transparent);outline-offset:1px;border-radius:4px}

/* score chips — shared ramp. --c set inline per band. */
.chip{display:inline-flex;align-items:center;justify-content:center;min-width:34px;padding:2px 8px;
  border-radius:7px;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;
  color:color-mix(in srgb,var(--c) 88%,var(--text));
  background:color-mix(in srgb,var(--c) 15%,transparent);
  border:1px solid color-mix(in srgb,var(--c) 34%,transparent);cursor:help}
.chip.c-up{--c:var(--up)} .chip.c-dn{--c:var(--down)} .chip.c-amb{--c:var(--s3)}
.chip.c-steel{--c:var(--s1)} .chip.c-info{--c:var(--info)} .chip.c-mut{--c:var(--muted)}
.chip.plain{background:none;border:none;color:var(--muted);font-weight:600;min-width:0;padding:0}
.delta{font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums}
.delta.up{color:var(--ink-up, var(--up))} .delta.dn{color:var(--ink-down, var(--down))} .delta.flat{color:var(--muted)}

/* stage chip (the star of the row) */
.stagechip{display:inline-flex;align-items:center;gap:6px;padding:3px 9px 3px 8px;border-radius:8px;
  font-size:11.5px;font-weight:700;border:1px solid color-mix(in srgb,var(--sc) 40%,transparent);
  background:color-mix(in srgb,var(--sc) 14%,transparent);
  color:color-mix(in srgb,var(--sc) 90%,var(--text));cursor:help;white-space:nowrap}
.stagechip .glyph{width:16px;height:12px;flex:0 0 auto}
.stagechip.st1{--sc:var(--s1)} .stagechip.st2{--sc:var(--s2)} .stagechip.st3{--sc:var(--s3)} .stagechip.st4{--sc:var(--s4)}
.freshdot{width:6px;height:6px;border-radius:var(--r-pill, 999px);background:var(--ok);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 22%,transparent);display:inline-block;margin-left:1px}

/* tag pills in table */
.tagcell{display:inline-flex;gap:4px;flex-wrap:nowrap}
.tagpill{font-size:10.5px;font-weight:600;padding:1px 7px;border-radius:999px;
  border:1px solid var(--line);color:var(--muted);background:var(--panel2);white-space:nowrap}
.tagpill.pos{color:var(--ink-up, var(--up));border-color:color-mix(in srgb,var(--up) 35%,var(--line))}
.tagpill.neg{color:var(--ink-down, var(--down));border-color:color-mix(in srgb,var(--down) 35%,var(--line))}
.tagmore{font-size:10.5px;color:var(--muted)}
/* seed-provenance chip on EU/Asia rows sourced from the EquityDesk backfill
   (no live non-US price feed yet). Muted amber, cursor:help → hover receipt. */
.seedtag{display:inline-block;margin-left:5px;font-size:9.5px;font-weight:700;letter-spacing:.04em;
  padding:1px 6px;border-radius:5px;vertical-align:middle;cursor:help;
  border:1px solid color-mix(in srgb,var(--s3) 34%,var(--line));
  color:color-mix(in srgb,var(--s3) 78%,var(--text));
  background:color-mix(in srgb,var(--s3) 10%,transparent)}
html[data-theme="light"] .seedtag{color:color-mix(in srgb,var(--s3) 55%,var(--text))}
/* Wave 8 §3 — a stale row stays browseable but must SAY it is stale. Same chip
   idiom as .seedtag, warmer hue so "old reading" reads differently from
   "seed universe". The row also carries no rating (rank is withheld upstream). */
.staletag{display:inline-block;margin-left:5px;font-size:9.5px;font-weight:700;letter-spacing:.04em;
  padding:1px 6px;border-radius:5px;vertical-align:middle;cursor:help;
  border:1px solid color-mix(in srgb,var(--s4) 34%,var(--line));
  color:color-mix(in srgb,var(--s4) 78%,var(--text));
  background:color-mix(in srgb,var(--s4) 10%,transparent)}
html[data-theme="light"] .staletag{color:color-mix(in srgb,var(--s4) 55%,var(--text))}
.addbtn{border:1px solid var(--line);background:var(--panel2);color:var(--muted);border-radius:7px;
  width:24px;height:24px;font-size:15px;line-height:1;cursor:pointer;padding:0}
.addbtn:hover{color:var(--ink-up, var(--up));border-color:color-mix(in srgb,var(--up) 45%,var(--line))}
.addbtn.on{color:var(--ink-up, var(--up));border-color:var(--up);background:color-mix(in srgb,var(--up) 12%,transparent)}

/* row-expand panel */
tr.detail-row td{padding:0;background:var(--panel2);border-bottom:1px solid var(--line)}
.detail{display:grid;grid-template-columns:minmax(300px,1.4fr) 1fr;gap:20px;padding:18px 20px}
@media(max-width:820px){.detail{grid-template-columns:1fr}}
.detail h4{margin:0 0 4px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted)}
.stagechart{width:100%;height:150px;display:block;border-radius:10px;
  background:color-mix(in srgb,var(--bg) 60%,var(--panel));border:1px solid var(--line)}
.chart-note{font-size:11px;color:var(--muted-strong);margin:6px 0 0;line-height:1.5}
.detail .facts{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.fact{font-size:11.5px;color:var(--muted);background:var(--panel);border:1px solid var(--line);
  border-radius:8px;padding:5px 9px}
.fact b{color:var(--text);font-weight:700}
.ec-block{font-size:12.5px;line-height:1.55}
.ec-hi{margin:6px 0;padding:8px 11px;border-radius:9px;border:1px solid var(--line);background:var(--panel)}
.ec-hi.pos{border-left:3px solid var(--up)}
.ec-hi.neg{border-left:3px solid var(--down)}
.ec-hi .lab{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:2px}

/* ── data tooltip (Tier-2 home) ── */
[data-tip-en]{position:relative}
[data-tip-en]::after{content:attr(data-tip-en);position:absolute;bottom:calc(100% + 8px);left:50%;
  transform:translateX(-50%) translateY(4px);min-width:170px;max-width:270px;white-space:normal;
  background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:10px;
  padding:9px 12px;font-size:11.5px;font-weight:500;line-height:1.5;text-transform:none;letter-spacing:0;
  box-shadow:0 12px 34px -14px rgba(0,0,0,.6);opacity:0;pointer-events:none;z-index:60;
  transition:opacity .14s,transform .14s}
html[data-lang="zh"] [data-tip-en]::after{content:attr(data-tip-zh)}
[data-tip-en]:hover::after{opacity:1;transform:translateX(-50%) translateY(0)}
@media(hover:none){[data-tip-en]::after{display:none}}

/* ── warm-up / empty states ── */
.empty{border:1px dashed var(--line);border-radius:16px;background:var(--panel2);
  padding:44px 30px;text-align:center;color:var(--muted)}
.empty .ico{font-size:30px;margin-bottom:10px;opacity:.8}
.empty h3{margin:0 0 6px;font-size:16px;font-weight:700;color:var(--text)}
.empty p{margin:0 auto;max-width:44ch;font-size:13px;line-height:1.6;color:var(--muted-strong)}
.empty.soon .ico{filter:grayscale(.2)}
.warmnote{display:inline-block;margin-top:14px;font-size:11.5px;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;padding:4px 12px}
.spinner{width:26px;height:26px;border-radius:50%;border:2.5px solid var(--line);
  border-top-color:var(--info);animation:spin .8s linear infinite;margin:0 auto 12px}
@keyframes spin{to{transform:rotate(360deg)}}

/* section provenance footer — real honesty sentences, so body-tier contrast */
.provfoot{margin-top:14px;font-size:11.5px;color:var(--muted-strong);line-height:1.55}
.provfoot .rec{cursor:help;border-bottom:1px dotted var(--muted-strong)}

/* =====================================================================
   INDUSTRIES + STAGE BOARD — surfaces built on the same system as the
   screener. No second visual language: reuse .seg, .chip, .stagechip,
   table.screener, .provfoot. New here = the rank-ramp heatmap grid and the
   stage-2/stage-4 diverging bar. Every colour is a theme token or a stage
   accent (--s1..--s4); never a literal text colour.
   ===================================================================== */

/* inner sub-tab bar (lighter than the main .tabbar) */
.subtabs{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;margin:2px 0 4px}
.subseg{display:inline-flex;gap:2px;padding:3px;border-radius:11px;border:1px solid var(--line);
  background:var(--panel2);overflow-x:auto;scrollbar-width:none}
.subseg::-webkit-scrollbar{display:none}
.subseg button{flex:0 0 auto;border:none;background:transparent;color:var(--muted);font-size:12.5px;
  font-weight:600;padding:6px 13px;border-radius:8px;cursor:pointer;white-space:nowrap;
  transition:color .16s,background .16s}
.subseg button:hover{color:var(--text)}
.subseg button[aria-pressed="true"]{background:var(--panel);color:var(--text);
  box-shadow:0 1px 0 color-mix(in srgb,var(--text) 6%,transparent)}
.subseg button:focus-visible{outline:2px solid color-mix(in srgb,var(--info) 70%,transparent);outline-offset:1px}
.subcap{font-size:12.5px;color:var(--muted-strong);line-height:1.5;margin:0 0 12px;max-width:64ch}
.subcap b{color:var(--text);font-weight:700}

/* state chip for flows (BASING/LEADING/BREAKING/…) — plain words, colour-coded */
.statechip{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:7px;
  font-size:11px;font-weight:700;white-space:nowrap;cursor:help;
  border:1px solid color-mix(in srgb,var(--sc) 40%,transparent);
  background:color-mix(in srgb,var(--sc) 13%,transparent);
  color:color-mix(in srgb,var(--sc) 90%,var(--text))}
.statechip .dot{width:6px;height:6px;border-radius:50%;background:var(--sc)}
.statechip.st-basing{--sc:var(--info)} .statechip.st-leading{--sc:var(--s2)}
.statechip.st-breaking{--sc:var(--s4)} .statechip.st-distributing{--sc:var(--s3)}
.statechip.st-neutral{--sc:var(--muted)}
.turnpill{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.03em;padding:1px 7px;
  border-radius:999px;border:1px solid color-mix(in srgb,var(--s2) 40%,var(--line));
  color:var(--s2);background:color-mix(in srgb,var(--s2) 10%,transparent);white-space:nowrap}
.turnpill.roll{color:var(--s4);border-color:color-mix(in srgb,var(--s4) 40%,var(--line));
  background:color-mix(in srgb,var(--s4) 10%,transparent)}
.dashcell{color:var(--muted);opacity:.5}

/* a numeric cell whose background is a green→red ramp (--rc set inline) */
.rampcell{position:relative;text-align:right;font-variant-numeric:tabular-nums;
  color:color-mix(in srgb,var(--rc,var(--muted)) 80%,var(--text))}
.rampcell::before{content:"";position:absolute;inset:3px 4px;border-radius:6px;z-index:0;
  background:color-mix(in srgb,var(--rc,transparent) 20%,transparent)}
.rampcell>span{position:relative;z-index:1}

/* the stage-2 vs stage-4 diverging bar (flows signature mini-viz) */
.divbar{display:inline-grid;grid-template-columns:1fr 1fr;align-items:center;width:96px;height:16px;
  border-radius:5px;overflow:hidden;background:color-mix(in srgb,var(--text) 5%,transparent);
  border:1px solid var(--hair);cursor:help;vertical-align:middle}
.divbar i{display:block;height:100%}
.divbar .s4{justify-self:end;background:color-mix(in srgb,var(--s4) 55%,transparent);
  border-right:1px solid color-mix(in srgb,var(--text) 22%,transparent)}
.divbar .s2{justify-self:start;background:color-mix(in srgb,var(--s2) 55%,transparent)}

/* heatmap grid — dense integer-rank cells on a smooth green→red ramp */
.heatscroll{position:relative;border:1px solid var(--line);border-radius:14px;overflow:auto;
  background:var(--panel);max-height:78vh}
table.heat{border-collapse:separate;border-spacing:0;font-size:11px;font-variant-numeric:tabular-nums}
.heat thead th{position:sticky;top:0;z-index:3;background:var(--panel2);color:var(--muted);
  font-weight:700;font-size:10px;letter-spacing:.02em;padding:8px 6px;text-align:center;
  border-bottom:1px solid var(--line);white-space:nowrap;min-width:38px}
.heat thead th.hind,.heat tbody th.hind{position:sticky;left:0;z-index:2;text-align:left;
  background:var(--panel);min-width:210px;max-width:240px;white-space:normal;line-height:1.3;
  padding:8px 12px;border-right:1px solid var(--line);font-weight:600;color:var(--text);font-size:11.5px}
.heat thead th.hind{z-index:5;background:var(--panel2);color:var(--muted);vertical-align:bottom}
.heat tbody th.hind{font-weight:600}
.heat tbody td{padding:0;text-align:center;height:26px;position:relative}
.heat tbody td .hc{display:flex;align-items:center;justify-content:center;height:100%;margin:1px;
  border-radius:5px;font-weight:700;color:var(--text);cursor:default}
.heat tbody td.na .hc{color:var(--muted);opacity:.4;background:transparent}
.heat tbody tr:hover th.hind{background:color-mix(in srgb,var(--info) 8%,var(--panel))}
.heatlegend{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 0;font-size:11.5px;
  color:var(--muted)}
.heatlegend .grad{width:150px;height:10px;border-radius:5px;
  background:linear-gradient(90deg,var(--s2),var(--s3),var(--s4))}
.heatlegend .grad.rev{background:linear-gradient(90deg,var(--s4),var(--s3),var(--s2))}

/* stage board — a card-lite list that reuses screener chips */
.boardhead{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin:2px 0 12px}
.boardnote{font-size:11.5px;color:var(--muted-strong);line-height:1.5;border:1px solid var(--line);
  border-radius:10px;background:var(--panel2);padding:9px 13px;max-width:70ch}
.boardnote b{color:var(--text);font-weight:700}
.gatechip{display:inline-flex;align-items:center;padding:1px 7px;border-radius:6px;font-size:10.5px;
  font-weight:700;border:1px solid color-mix(in srgb,var(--info) 38%,var(--line));color:var(--ink-info, var(--info));
  background:color-mix(in srgb,var(--info) 10%,transparent);cursor:help}
.gatechip.t1{border-color:color-mix(in srgb,var(--s2) 42%,var(--line));color:var(--s2);
  background:color-mix(in srgb,var(--s2) 11%,transparent)}
.evchip{font-size:10.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.rschip{font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums}
.rschip.up{color:var(--ink-up, var(--up))} .rschip.dn{color:var(--ink-down, var(--down))} .rschip.flat{color:var(--muted)}

/* =====================================================================
   EARNINGS CALLS · ALT-DATA · RESEARCH — same visual system as above.
   No second language: reuse .subtabs/.subseg, .chip, .stagechip, .tagpill,
   table.screener, .empty, .provfoot, [data-tip-*], the stage accents.
   New here: the two-part earnings tone/result score block, the transcript
   reader drawer (the "I can't view the transcripts" fix), the alt-data
   source columns, and the research thesis cards. Colour is always a theme
   token or a stage accent — never a literal text colour.
   ===================================================================== */

/* two-part earnings score: tone (0–100) over result (0–10), stacked + colour */
.ecscore{display:inline-flex;flex-direction:column;gap:2px;min-width:56px;vertical-align:middle;cursor:help}
.ecscore .bar{position:relative;height:5px;border-radius:3px;background:color-mix(in srgb,var(--text) 8%,transparent);overflow:hidden}
.ecscore .bar i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--ec,var(--muted))}
.ecscore .duo{display:flex;align-items:baseline;gap:5px;font-variant-numeric:tabular-nums;line-height:1}
.ecscore .tone{font-size:13px;font-weight:700;color:color-mix(in srgb,var(--ec,var(--muted)) 88%,var(--text))}
.ecscore .perf{font-size:10.5px;font-weight:600;color:var(--muted)}
.ecscore.up{--ec:var(--up)} .ecscore.mid{--ec:var(--info)} .ecscore.dn{--ec:var(--down)} .ecscore.amb{--ec:var(--s3)}

/* tone word chip */
.toneword{font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px;white-space:nowrap;
  border:1px solid color-mix(in srgb,var(--ec,var(--muted)) 40%,transparent);
  background:color-mix(in srgb,var(--ec,var(--muted)) 12%,transparent);
  color:color-mix(in srgb,var(--ec,var(--muted)) 90%,var(--text))}
.toneword.up{--ec:var(--up)} .toneword.mid{--ec:var(--info)} .toneword.dn{--ec:var(--down)} .toneword.amb{--ec:var(--s3)}

/* highlight-count mini pills in the calls table (green / red) */
.hicount{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;
  font-variant-numeric:tabular-nums}
.hicount.pos{color:var(--ink-up, var(--up))} .hicount.neg{color:var(--ink-down, var(--down))}
.hicount .g{width:7px;height:7px;border-radius:2px;background:currentColor;opacity:.85}
.callrow{cursor:pointer}
.callrow:hover .tk{color:var(--ink-info, var(--info))}
.readcue{font-size:10.5px;color:var(--muted);opacity:0;transition:opacity .14s}
.callrow:hover .readcue{opacity:1}

/* ── the transcript reader drawer (signature of this lane) ── */
.reader-scrim{position:fixed;inset:0;z-index:80;background:color-mix(in srgb,var(--bg) 72%,transparent);
  backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .2s}
.reader-scrim.open{opacity:1;pointer-events:auto}
.reader{position:fixed;top:0;right:0;bottom:0;z-index:81;width:min(560px,94vw);
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 94%,transparent),var(--panel2));
  border-left:1px solid var(--line);box-shadow:-30px 0 80px -40px rgba(0,0,0,.7);
  transform:translateX(102%);transition:transform .26s cubic-bezier(.2,.7,.2,1);
  display:flex;flex-direction:column;overflow:hidden}
.reader.open{transform:none}
@media(prefers-reduced-motion:reduce){.reader,.reader-scrim{transition:none}}
.reader-head{position:relative;padding:20px 22px 16px;border-bottom:1px solid var(--line);flex:0 0 auto}
.reader-head .co{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 4px}
.reader-head h3{margin:0;font-size:21px;font-weight:800;letter-spacing:-.02em;color:var(--text);font-family:var(--font-display)}
.reader-head .meta{margin:6px 0 0;font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:5px 12px}
.reader-head .meta b{color:var(--text);font-weight:700}
.reader-actions{display:flex;gap:8px;margin-top:12px;padding-right:40px}
.reader-terminal{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:34px;padding:0 13px;border:1px solid color-mix(in srgb,var(--info) 48%,var(--line));border-radius:9px;background:color-mix(in srgb,var(--info) 12%,var(--panel2));color:var(--text);font-size:11.5px;font-weight:750;text-decoration:none;transition:border-color .16s ease,background .16s ease,transform .16s ease}
.reader-terminal:hover{border-color:color-mix(in srgb,var(--info) 75%,var(--line));background:color-mix(in srgb,var(--info) 18%,var(--panel2));transform:translateY(-1px)}
.reader-terminal:focus-visible{outline:2px solid color-mix(in srgb,var(--info) 70%,transparent);outline-offset:2px}
.reader-terminal .arr{color:var(--ink-info, var(--info));font-size:14px}
.reader-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:9px;
  border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:17px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center}
.reader-close:hover{color:var(--text);border-color:color-mix(in srgb,var(--info) 45%,var(--line))}
.reader-close:focus-visible{outline:2px solid color-mix(in srgb,var(--info) 70%,transparent);outline-offset:2px}
/* tone gauge in the reader header */
.tonegauge{display:flex;align-items:center;gap:12px;margin-top:14px}
.tonegauge .track{position:relative;flex:1;height:8px;border-radius:5px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--down) 55%,transparent),
    color-mix(in srgb,var(--s3) 45%,transparent),color-mix(in srgb,var(--up) 55%,transparent))}
.tonegauge .track .pin{position:absolute;top:50%;width:3px;height:16px;border-radius:2px;background:var(--text);
  transform:translate(-50%,-50%);box-shadow:0 0 0 2px var(--panel)}
.tonegauge .val{font-family:var(--font-display);font-size:20px;font-weight:700;line-height:1;
  font-variant-numeric:tabular-nums;color:color-mix(in srgb,var(--ec,var(--muted)) 88%,var(--text))}
.tonegauge .val small{font-size:11px;font-weight:600;color:var(--muted)}
.reader-body{flex:1;overflow-y:auto;padding:18px 22px 40px;scrollbar-width:thin}
.reader-sec{margin:0 0 20px}
.reader-sec h4{margin:0 0 9px;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);display:flex;align-items:center;gap:7px}
.reader-sec h4::after{content:"";flex:1;height:1px;background:var(--hair)}
.hlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.hlist li{position:relative;padding:9px 12px 9px 13px;border-radius:10px;font-size:13px;line-height:1.55;
  color:var(--text);border:1px solid var(--line);background:var(--panel)}
.hlist.pos li{border-left:3px solid var(--up)}
.hlist.neg li{border-left:3px solid var(--down)}
.hlist li .n{font-family:var(--font-display);font-weight:700;font-size:11px;margin-right:6px;
  color:var(--muted)}
.hlist.pos li .n{color:var(--ink-up, var(--up))} .hlist.neg li .n{color:var(--ink-down, var(--down))}
.quoteblock{margin:0;padding:14px 16px 14px 18px;border-radius:12px;position:relative;
  border:1px solid var(--line);background:color-mix(in srgb,var(--info) 6%,var(--panel));
  border-left:3px solid var(--info);font-size:14px;line-height:1.6;color:var(--text);font-style:italic}
.quoteblock::before{content:"\201C";position:absolute;top:2px;left:8px;font-size:34px;line-height:1;
  color:color-mix(in srgb,var(--info) 40%,transparent);font-family:Georgia,serif}
.quoteblock .qtxt{display:block;padding-left:14px}
.readertags{display:flex;flex-wrap:wrap;gap:6px}
.reader-empty{padding:14px 16px;border:1px dashed var(--line);border-radius:11px;background:var(--panel2);
  font-size:12.5px;color:var(--muted-strong);line-height:1.55}

/* ── alt-data: four source columns, each a compact trending list ── */
.altwrap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:4px}
@media(max-width:1080px){.altwrap{grid-template-columns:1fr}}
.altcol{border:1px solid var(--line);border-radius:16px;background:var(--panel);overflow:hidden;
  display:flex;flex-direction:column}
.altcol-head{display:flex;align-items:center;gap:9px;padding:13px 16px;border-bottom:1px solid var(--line);
  background:var(--panel2)}
.altcol-head .ico{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-size:14px;flex:0 0 auto;border:1px solid var(--line);background:var(--panel);color:var(--text)}
.altcol-head .nm{font-size:14px;font-weight:700;color:var(--text)}
.altcol-head .cnt{font-size:11.5px;color:var(--muted)}
.altcol-head .seedflag{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.04em;padding:2px 8px;
  border-radius:999px;border:1px solid color-mix(in srgb,var(--s3) 40%,var(--line));color:var(--s3);
  background:color-mix(in srgb,var(--s3) 10%,transparent);cursor:help}
.altcol-head .liveflag{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.04em;padding:2px 8px;
  border-radius:999px;border:1px solid color-mix(in srgb,var(--up) 34%,var(--line));color:var(--ink-up, var(--up));
  background:color-mix(in srgb,var(--up) 9%,transparent);cursor:help}
.altlist{list-style:none;margin:0;padding:6px;display:flex;flex-direction:column;gap:2px;
  max-height:520px;overflow-y:auto;scrollbar-width:thin}
.altitem{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:9px 10px;border-radius:11px;
  cursor:help;transition:background .14s}
.altitem:hover{background:color-mix(in srgb,var(--info) 6%,transparent)}
.altitem .top{grid-column:1;display:flex;align-items:center;gap:7px;min-width:0}
.altitem .topic{font-size:12.5px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.altitem .typ{font-size:10px;font-weight:600;color:var(--muted);border:1px solid var(--line);border-radius:5px;
  padding:0 5px;white-space:nowrap;flex:0 0 auto}
.altitem .yoy{grid-column:2;grid-row:1;align-self:center;font-family:var(--font-display);font-size:12.5px;
  font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink-up, var(--up));white-space:nowrap}
.altitem .yoy.dn{color:var(--ink-down, var(--down))}
.altitem .match{grid-column:1;display:flex;align-items:center;gap:6px;min-width:0;margin-top:1px}
.altitem .match .arrow{color:var(--muted);font-size:11px}
.altitem .mtk{font-size:11px;font-weight:700;font-family:var(--font-display);color:var(--ink-info, var(--info));flex:0 0 auto}
.altitem .mco{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.altitem .add2{grid-column:2;grid-row:2;justify-self:end;align-self:center}

/* ── research: thesis cards with model badges + expand ── */
.reswrap{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;margin-top:4px}
.rescard{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:15px 16px 14px;
  display:flex;flex-direction:column;gap:8px;transition:border-color .16s}
.rescard:hover{border-color:color-mix(in srgb,var(--info) 40%,var(--line))}
.rescard-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.rescard .tk{font-size:15px}
.rescard .cnm{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  flex:1;min-width:0}
.modelbadges{display:inline-flex;gap:4px;flex:0 0 auto}
.mbadge{font-size:9.5px;font-weight:700;letter-spacing:.02em;padding:1px 6px;border-radius:6px;
  border:1px solid var(--line);background:var(--panel2);color:var(--muted);cursor:help}
.mbadge.g{color:var(--ink-info, var(--info));border-color:color-mix(in srgb,var(--info) 38%,var(--line))}
.mbadge.o{color:var(--s2);border-color:color-mix(in srgb,var(--s2) 38%,var(--line))}
.mbadge.c{color:var(--s3);border-color:color-mix(in srgb,var(--s3) 38%,var(--line))}
.rescard .thesis{font-size:12.5px;line-height:1.6;color:var(--text);margin:0;
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.rescard.open .thesis{-webkit-line-clamp:unset;overflow:visible}
.rescard-foot{display:flex;align-items:center;gap:10px;margin-top:auto}
.rescard .more{border:none;background:none;color:var(--ink-info, var(--info));font-size:11.5px;font-weight:600;cursor:pointer;
  padding:0}
.rescard .more:hover{text-decoration:underline}
.rescard .rlink{font-size:11.5px;color:var(--ink-link, var(--link));font-weight:600}
.rescount{font-size:12px;color:var(--muted-strong);margin:2px 0 12px}
.rescount b{color:var(--text);font-weight:700}

/* =====================================================================
   LIGHT-MODE CONTRAST GATE (spec §1: chips ≥ 4.5:1, light mode MUST pass).
   In light mode the --up/--down/--info/--s* tokens are pale-on-white, so any
   chip that renders a colour token AS TEXT (color-mix(--c 88–90%, --text))
   falls to ~3.2–4.5:1. We rebalance every such family to a 55% colour / 45%
   --text share on white — measured worst case is chip "up" 5.89:1, stagechip
   S2 5.97:1, statechip Leading 6.04:1, tagpill pos 6.18:1. The chip
   BACKGROUND fill (color-mix(--c 14–15%, transparent)) is unchanged, so the
   accent colour still reads; only the text darkens. Dark mode is untouched
   (already ≥ 4.5:1). Verified with the contrast harness in the PR notes.
   ===================================================================== */
/* score chips + stage chip + flow state chip + tone word + earnings-tone
   numeral + setup gate chip — all share the "colour-as-text" recipe */
html[data-theme="light"] .chip{color:color-mix(in srgb,var(--c) 55%,var(--text))}
html[data-theme="light"] .stagechip{color:color-mix(in srgb,var(--sc) 55%,var(--text))}
html[data-theme="light"] .statechip{color:color-mix(in srgb,var(--sc) 55%,var(--text))}
html[data-theme="light"] .toneword{color:color-mix(in srgb,var(--ec) 55%,var(--text))}
html[data-theme="light"] .ecscore .tone{color:color-mix(in srgb,var(--ec) 55%,var(--text))}
html[data-theme="light"] .gatechip{color:color-mix(in srgb,var(--info) 55%,var(--text))}
html[data-theme="light"] .gatechip.t1{color:color-mix(in srgb,var(--s2) 55%,var(--text))}
html[data-theme="light"] .turnpill{color:color-mix(in srgb,var(--s2) 55%,var(--text))}
html[data-theme="light"] .turnpill.roll{color:color-mix(in srgb,var(--s4) 55%,var(--text))}
/* semantic green/red TEXT that sits on the panel with no chip bg
   (deltas, relative-strength cells, highlight counts) */
html[data-theme="light"] .delta.up,html[data-theme="light"] .rschip.up{color:color-mix(in srgb,var(--up) 55%,var(--text))}
html[data-theme="light"] .delta.dn,html[data-theme="light"] .rschip.dn{color:color-mix(in srgb,var(--down) 60%,var(--text))}
html[data-theme="light"] .hicount.pos{color:color-mix(in srgb,var(--up) 55%,var(--text))}
html[data-theme="light"] .hicount.neg{color:color-mix(in srgb,var(--down) 60%,var(--text))}
/* tag pills + model badges: colour token on the pale --panel2 fill */
html[data-theme="light"] .tagpill.pos{color:color-mix(in srgb,var(--up) 55%,var(--text))}
html[data-theme="light"] .tagpill.neg{color:color-mix(in srgb,var(--down) 55%,var(--text))}
html[data-theme="light"] .mbadge.g{color:color-mix(in srgb,var(--info) 55%,var(--text))}
html[data-theme="light"] .mbadge.o{color:color-mix(in srgb,var(--s2) 55%,var(--text))}
html[data-theme="light"] .mbadge.c{color:color-mix(in srgb,var(--s3) 55%,var(--text))}
/* hero stance pill — the Tier-1 signature; the colour token as text is pale on
   the light tinted fill, so darken to the 55% share (act 5.46:1 / watch 5.72:1) */
html[data-theme="light"] .stancepill.act{color:color-mix(in srgb,var(--up) 55%,var(--text))}
html[data-theme="light"] .stancepill.watch{color:color-mix(in srgb,var(--s3) 55%,var(--text))}
/* hero station labels are coloured to their stage token (11.5px, so must clear
   4.5:1) — darken on white to the 65% share (worst = Advancing/green 5.98:1) */
html[data-theme="light"] .stn .lab{color:color-mix(in srgb,var(--sc,var(--muted)) 65%,var(--text))}

/* page-load stagger + reduced motion */
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.rise{animation:rise .5s cubic-bezier(.2,.7,.2,1) both}
.rise.d1{animation-delay:.05s}.rise.d2{animation-delay:.12s}.rise.d3{animation-delay:.2s}
@media(prefers-reduced-motion:reduce){
  .rise{animation:none}
  .spinner{animation:none}
}