/* ============================================================
   Signal Console — token system (spec §4) + component CSS.
   Dark-committed terminal identity. Evolves the original palette:
   --panel/--panel2/--line kept as aliases so ported CSS still reads.
   ============================================================ */
:root{
  /* base / surface ladder */
  --bg:#06090d;
  --surface-0:#0b1116;
  --surface-1:#0f1720;
  --surface-2:#14202b;
  --border-hair:rgba(126,156,186,.12);
  --border:#1c2b3a;
  --border-strong:#28405a;
  --border-accent:rgba(65,176,255,.35);
  /* legacy aliases */
  --panel:var(--surface-1); --panel2:var(--surface-2); --line:var(--border);

  /* semantic signal accents (direction/state only) */
  --up:#2ee06f;  --grn:#2ee06f;
  --dn:#ff5757;  --red:#ff5757;
  --warn:#ffb02e; --amb:#ffb02e;
  --info:#41b0ff; --cyn:#41b0ff;
  --ai:#b18cff;  --vio:#b18cff;
  --flat:#5f7488; --dim:#5f7488;

  /* categorical series */
  --c1:#5aa9ff; --c2:#4fd08a; --c3:#c39bff; --c4:#ffc061; --c5:#49c9d6; --c6:#ff8f9c;

  /* text */
  --txt:#c9d6e2; --txt-hi:#eaf2f9; --txt-dim:#7f93a6;

  /* type */
  --font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --font-sans:'IBM Plex Sans',system-ui,-apple-system,sans-serif;
  --t-xs:11px; --t-sm:12px; --t-base:13px; --t-md:15px; --t-lg:18px; --t-xl:22px;
  --lh-tight:1.3; --lh-body:1.55;

  /* spacing */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;
  /* radii */
  --r-sm:4px; --r-md:8px; --r-lg:12px; --r-pill:999px;
  /* motion */
  --dur-fast:120ms; --dur-mid:220ms; --dur-slow:360ms;
  --ease-out:cubic-bezier(.2,.8,.2,1); --ease-in:cubic-bezier(.4,0,1,1);
  /* elevation */
  --elev-panel:inset 0 1px 0 rgba(255,255,255,.03);
  --elev-float:0 0 0 1px var(--border), 0 8px 24px -8px rgba(0,0,0,.6), 0 2px 6px -2px rgba(0,0,0,.5);
  --glow-info:0 0 0 1px var(--border-accent), 0 0 12px -2px rgba(65,176,255,.4);
  --glow-ai:0 0 0 1px rgba(177,140,255,.5), 0 0 18px -4px rgba(177,140,255,.5);
}
:root[data-density=compact]{ --s3:8px; --s4:12px; --t-base:12px; --t-sm:11px; }

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:calc(var(--sb-h,46px) + 96px)}
body{background:var(--bg);color:var(--txt);
  font-family:var(--font-mono);font-size:var(--t-base);line-height:var(--lh-body);
  font-variant-numeric:tabular-nums;font-feature-settings:'zero' 1;
  overflow-x:hidden;padding-bottom:96px}
a{color:var(--cyn);text-decoration:none}a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--info);outline-offset:2px}
::selection{background:rgba(65,176,255,.28);color:#eaf4ff}
.wrap{max-width:1420px;margin:0 auto;padding:0 4.5%}
.dimtx{color:var(--dim)}
.skiplink{position:absolute;left:-999px;top:0;z-index:200;background:var(--surface-2);
  color:var(--txt-hi);padding:8px 14px;border:1px solid var(--border-accent)}
.skiplink:focus{left:8px;top:8px}

/* ============ STATUS BAR (sticky) ============ */
.statusbar{position:sticky;top:0;z-index:80;display:flex;justify-content:space-between;
  align-items:center;gap:var(--s3);flex-wrap:wrap;
  padding:6px 4.5%;min-height:34px;
  background:color-mix(in oklab,var(--bg) 82%,transparent);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border)}
.sbleft,.sbright{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap}
.brand{font-weight:700;letter-spacing:.14em;color:var(--txt-hi);font-size:var(--t-sm)}
.brand .x{color:var(--amb)}
.stamp{color:var(--dim);font-size:var(--t-xs)}
.chips.dots{display:flex;gap:5px;flex-wrap:wrap}
.chips.dots .chip{padding:2px 6px;font-size:10px}
.sbtn{font-family:inherit;font-size:var(--t-xs);color:var(--txt);background:var(--surface-2);
  border:1px solid var(--border);padding:3px 9px;border-radius:var(--r-sm);cursor:pointer;
  letter-spacing:.04em;transition:border-color var(--dur-fast),color var(--dur-fast)}
.sbtn:hover{border-color:var(--border-strong);color:var(--txt-hi)}
.sbtn kbd{font-family:inherit;font-size:10px}
.sbtn.ai{color:var(--ai);border-color:rgba(177,140,255,.35)}
.sbtn.ai:hover{box-shadow:var(--glow-ai)}

.chip{border:1px solid var(--border);background:var(--surface-2);padding:2px 10px;font-size:var(--t-xs);
  color:var(--dim);border-radius:var(--r-sm);white-space:nowrap}
.chip .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;background:var(--dim)}
.ok .dot{background:var(--grn)} .fail .dot{background:var(--red)}

/* live/stale + AUTO indicators (kept) */
.livewrap{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);
  background:var(--surface-2);padding:2px 9px;border-radius:var(--r-sm);font-size:10px;letter-spacing:.14em}
.livedot{width:8px;height:8px;border-radius:50%;background:var(--dim)}
.livewrap.live .livedot{background:var(--grn);animation:pulse 1.6s ease-out infinite}
.livewrap.live{color:var(--grn)}
.livewrap.stale .livedot{background:var(--amb)}.livewrap.stale{color:var(--amb)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(46,224,111,.55)}70%{box-shadow:0 0 0 7px rgba(46,224,111,0)}100%{box-shadow:0 0 0 0 rgba(46,224,111,0)}}
.autoind{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);
  background:var(--surface-2);padding:2px 8px;border-radius:var(--r-sm);font-size:9px;letter-spacing:.16em;color:var(--cyn)}
.autoind .autodot{width:6px;height:6px;border-radius:50%;background:var(--cyn);animation:spin 2.4s linear infinite}
@keyframes spin{0%{opacity:.35}50%{opacity:1}100%{opacity:.35}}

/* ============ WHAT MATTERS NOW ============ */
.matters{margin:var(--s4) 0;border:1px solid var(--border);border-radius:var(--r-md);
  background:linear-gradient(180deg,var(--surface-2),var(--surface-1));box-shadow:var(--elev-panel);padding:var(--s3) var(--s4)}
.mhead{display:flex;align-items:baseline;gap:var(--s2);margin-bottom:var(--s2)}
.mhead h2{font-size:var(--t-sm);letter-spacing:.18em;color:var(--txt-hi);font-weight:700}
.mhead .sub{color:var(--dim);font-size:var(--t-xs)}
.brief{display:flex;gap:var(--s2);align-items:flex-start;padding:var(--s2) 0 var(--s3);
  border-bottom:1px dashed var(--border);margin-bottom:var(--s3)}
.brief .brieftag{flex:0 0 auto;font-size:9px;letter-spacing:.16em;color:var(--ai);
  border:1px solid rgba(177,140,255,.35);border-radius:var(--r-sm);padding:1px 6px;margin-top:2px}
.brief .brieftext{font-family:var(--font-sans);font-size:var(--t-base);line-height:var(--lh-body);max-width:62ch}
.topsignals{display:flex;flex-wrap:wrap;gap:var(--s2)}
.sigchip{display:inline-flex;align-items:center;gap:6px;font-family:inherit;cursor:pointer;
  background:var(--surface-0);border:1px solid var(--border-strong);border-radius:var(--r-pill);
  padding:4px 10px;color:var(--txt);font-size:var(--t-xs);
  transition:border-color var(--dur-fast),transform var(--dur-fast),box-shadow var(--dur-fast)}
.sigchip:hover{border-color:var(--border-accent);box-shadow:var(--glow-info);transform:translateY(-1px)}
.sigchip .sg{color:var(--cyn)}
.sigchip .st{font-weight:700;color:var(--txt-hi);letter-spacing:.03em}
.sigchip .sk{color:var(--dim);font-size:10px}
.sigchip .ss{font-weight:700;color:var(--amb);font-size:11px}
.sigchip.more{color:var(--cyn);border-style:dashed}
.watchstrip{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:var(--s3);
  padding-top:var(--s3);border-top:1px dashed var(--border)}
.watchstrip .wslab{font-size:9px;letter-spacing:.16em;color:var(--dim)}
.wschip{font-family:inherit;font-size:var(--t-xs);color:var(--amb);cursor:pointer;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-pill);padding:2px 9px}
.wschip:hover{border-color:var(--amb)}

/* ============ PANELS ============ */
section.pulse,section.matters{scroll-margin-top:48px}
.groups section,.pulse section,.livegrid section,.grid2 section{
  border:1px solid var(--border);background:var(--surface-1);box-shadow:var(--elev-panel);
  border-radius:var(--r-sm);margin-bottom:var(--s3)}
.sh{display:flex;justify-content:space-between;align-items:baseline;padding:9px 14px;
  border-bottom:1px solid var(--border);gap:var(--s2);flex-wrap:wrap}
.sh h2{font-size:var(--t-sm);letter-spacing:.16em;color:var(--cyn);font-weight:500}
.sh .sub{color:var(--dim);font-size:var(--t-xs);flex:1}
.sh .age{color:var(--dim);font-size:10px;white-space:nowrap}
.interp{font-family:inherit;font-size:11px;background:transparent;border:1px solid rgba(177,140,255,.28);
  color:var(--ai);border-radius:var(--r-sm);padding:1px 7px;cursor:pointer;opacity:.75;
  transition:opacity var(--dur-fast),box-shadow var(--dur-fast)}
.interp:hover{opacity:1;box-shadow:var(--glow-ai)}

table{width:100%;border-collapse:collapse}
th{color:var(--dim);font-weight:500;font-size:10px;letter-spacing:.1em;text-align:left;
  padding:7px 10px;border-bottom:1px solid var(--border)}
td{padding:6px 10px;border-bottom:1px solid var(--border-hair);vertical-align:middle}
tr:hover td{background:var(--surface-0)}
tr[data-aid]:hover td{box-shadow:inset 2px 0 0 var(--info)}
.tk{font-weight:700;color:var(--txt-hi)}.co{color:var(--dim);font-size:var(--t-xs)}
.num{text-align:right}
.big{font-size:var(--t-md);font-weight:700;color:var(--amb)}
.bar{height:7px;background:var(--surface-2);border-radius:1px;min-width:60px;position:relative;top:1px}
.bar i{display:block;height:100%;border-radius:1px}

/* tonal badges (spec §4 recipe) */
.tag{display:inline-block;border:1px solid var(--border);background:var(--surface-2);
  padding:1px 7px;margin:1px 3px 1px 0;font-size:10px;color:#9fb3c4;border-radius:var(--r-sm);white-space:nowrap}
.tag.g{color:var(--grn);background:color-mix(in oklab,var(--grn) 12%,transparent);border-color:color-mix(in oklab,var(--grn) 34%,transparent)}
.tag.r{color:var(--red);background:color-mix(in oklab,var(--red) 12%,transparent);border-color:color-mix(in oklab,var(--red) 34%,transparent)}
.tag.a{color:var(--amb);background:color-mix(in oklab,var(--amb) 12%,transparent);border-color:color-mix(in oklab,var(--amb) 34%,transparent)}
.tag.v{color:var(--vio);background:color-mix(in oklab,var(--vio) 12%,transparent);border-color:color-mix(in oklab,var(--vio) 34%,transparent)}
.cap{display:inline-block;padding:1px 6px;border-radius:var(--r-sm);font-size:10px;font-weight:700;
  letter-spacing:.05em;color:var(--txt-hi)}
.side{font-weight:700;padding:1px 8px;border-radius:var(--r-sm);font-size:var(--t-xs)}
.side.b{color:#04160a;background:var(--grn)}.side.s{color:#1d0505;background:var(--red)}
.fl-anomaly{color:var(--amb);border-color:#7a5a12;background:#231803;font-weight:700}
.fl-routine{color:var(--dim)}.fl-signal{color:var(--grn);border-color:#1c4a2e}
.up{color:var(--grn)}.dn{color:var(--red)}.fl{color:var(--dim)}
.streak b{font-weight:700}.star{color:var(--amb)}.viscnt{color:var(--cyn)}
.darknote{padding:var(--s4);color:var(--dim);font-size:var(--t-sm)}.darknote b{color:var(--amb)}
[data-peek]{cursor:help}

/* ☆ watchlist pin */
.pin{font-family:inherit;background:transparent;border:none;color:var(--dim);cursor:pointer;
  font-size:13px;padding:0 4px 0 0;line-height:1;vertical-align:baseline}
.pin:hover{color:var(--amb)}.pin.on{color:var(--amb)}

/* ============ LIVE tape + grid (kept) ============ */
.tape{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;
  border:1px solid var(--border);background:var(--surface-1);border-radius:var(--r-sm);margin-bottom:var(--s3)}
.tape .tlab{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:8px 14px;
  border-right:1px solid var(--border);background:var(--surface-2);font-size:10px;letter-spacing:.14em;
  color:var(--dim);white-space:nowrap}
.tapeitems{display:flex;flex:1}
.qitem{flex:0 0 auto;padding:8px 16px;border-right:1px solid var(--border-hair);white-space:nowrap;
  display:flex;align-items:baseline;gap:8px}
.qitem .qs{font-weight:700;color:var(--txt-hi)}
.qitem .qc{font-size:var(--t-xs)}.qitem .qv{font-size:10px;color:var(--dim)}
.livegrid{display:grid;grid-template-columns:260px 1fr 1fr;gap:var(--s3);margin-bottom:0}
.livegrid section{margin-bottom:0}
.grid2>section,.livegrid>section{min-width:0}
.gaugewrap{display:flex;flex-direction:column;gap:6px;align-items:center;padding:14px 18px;text-align:center}
.gaugewrap .rd{font-size:var(--t-lg);font-weight:700;color:var(--txt-hi)}
.gaugewrap .lb{color:var(--dim);font-size:10px;line-height:1.45}
.trend{padding:12px 16px}.trend .grp{margin-bottom:10px}.trend .grp:last-child{margin-bottom:0}
.trend .glab{color:var(--dim);font-size:10px;letter-spacing:.12em;margin-bottom:6px}
.tchip{display:inline-flex;align-items:baseline;gap:5px;border:1px solid var(--border);
  background:var(--surface-2);padding:2px 8px;margin:0 5px 5px 0;border-radius:var(--r-sm);font-size:var(--t-xs)}
.tchip .tt{font-weight:700;color:var(--txt-hi)}.tchip .tr{color:var(--dim);font-size:10px}.tchip .tv{font-size:10px}
.heads{padding:6px 0;max-height:230px;overflow-y:auto;scrollbar-width:thin}
.heads .hl{padding:6px 16px;border-bottom:1px solid var(--border-hair);font-size:var(--t-sm)}
.heads .hl:last-child{border-bottom:none}.heads .hm{color:var(--dim);font-size:10px;margin-top:2px}

.legend{color:var(--dim);font-size:10px;display:flex;gap:14px;flex-wrap:wrap;padding:8px 16px;border-bottom:1px solid var(--border)}
.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}
.legend i.dm{transform:rotate(45deg);border-radius:1px}.legend i.tk2{width:2px;height:10px;border-radius:0}
.tlrow{display:flex;gap:16px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--border-hair);
  overflow-x:auto;-webkit-overflow-scrolling:touch}
.tlrow .lab{min-width:78px}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);margin-bottom:0}
.grid2 section,.grid2 .subblock{margin-bottom:0}
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.tblwrap>table{min-width:760px}.tblwrap.mid>table{min-width:520px}.tblwrap.slim>table{min-width:295px}
.subhd{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap;
  padding:8px 16px;border-top:1px solid var(--border);background:var(--surface-2)}
.subhd h3{font-size:var(--t-xs);letter-spacing:.15em;color:#9fb3c4;font-weight:500}
.subhd .sub{color:var(--dim);font-size:10px}
.spk{min-width:132px}.spk .spark{display:block;vertical-align:middle}
.sparkbtn{cursor:pointer;display:inline-block}.sparkbtn:focus-visible{outline:2px solid var(--info)}
.morphbig{padding:10px 4px}.morphrow td{background:var(--surface-0)}

/* backtest */
.btstats{display:flex;flex-wrap:wrap;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border)}
.btile{flex:1 1 130px;border:1px solid var(--border);background:var(--surface-2);border-radius:var(--r-sm);padding:10px 12px;min-width:120px}
.btile .bv{font-size:var(--t-xl);font-weight:700;color:var(--txt-hi);line-height:1.1}
.btile .bv.up{color:var(--grn)}.btile .bv.dn{color:var(--red)}
.btile .bl{color:var(--dim);font-size:9px;letter-spacing:.1em;margin-top:4px}

/* details sub-blocks */
.subblock{border:1px solid var(--border);background:var(--surface-1);border-radius:var(--r-sm)}
.subblock>summary{cursor:pointer;list-style:none}
.subblock>summary::-webkit-details-marker{display:none}
.subblock>summary::before{content:'▸';color:var(--dim);margin-right:6px;display:inline-block;transition:transform var(--dur-fast)}
.subblock[open]>summary::before{transform:rotate(90deg)}

/* ============ PRIMARY TAB NAV (sticky under the status bar) ============ */
.navzone{position:sticky;top:var(--sb-h,46px);z-index:70;margin-top:var(--s3);
  background:color-mix(in oklab,var(--bg) 90%,transparent);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border)}
.tabbar{display:flex;gap:2px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.tabbar::-webkit-scrollbar{display:none}
.tab{flex:0 0 auto;font-family:inherit;font-size:var(--t-xs);letter-spacing:.12em;font-weight:700;
  color:var(--dim);background:transparent;border:none;cursor:pointer;padding:10px 15px;white-space:nowrap;
  border-bottom:2px solid transparent;
  transition:color var(--dur-fast),background var(--dur-fast),border-color var(--dur-fast)}
.tab:hover{color:var(--txt-hi);background:var(--surface-1)}
.tab[aria-selected=true]{color:var(--txt-hi);border-bottom-color:var(--cyn);
  background:linear-gradient(180deg,transparent,color-mix(in oklab,var(--cyn) 8%,transparent))}
.filterrow{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;padding:6px 0}
.filterrow .fgrp{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.filterrow .fgrp.end{margin-left:auto}
.filterrow .lb{color:var(--dim);font-size:9px;letter-spacing:.12em;margin-right:2px}
.fbtn,.cbtn{font-family:inherit;font-size:var(--t-xs);color:var(--dim);background:var(--surface-2);
  border:1px solid var(--border);padding:3px 9px;cursor:pointer;border-radius:var(--r-sm)}
.fbtn:hover,.cbtn:hover{border-color:var(--border-strong);color:var(--txt)}
.fbtn.on{color:#04121f;background:var(--cyn);border-color:var(--cyn);font-weight:700}
.cbtn.on{color:#04121f;background:var(--amb);border-color:var(--amb);font-weight:700}
.fbtn.reset{color:var(--dim);padding:3px 8px}
.watchtoggle{font-family:inherit;font-size:var(--t-xs);color:var(--amb);background:var(--surface-2);
  border:1px solid var(--border);padding:3px 10px;cursor:pointer;border-radius:var(--r-pill)}
.watchtoggle:hover{border-color:var(--amb)}
.watchtoggle[aria-pressed=true]{background:color-mix(in oklab,var(--amb) 16%,transparent);
  border-color:var(--amb);font-weight:700}

/* ============ TAB PANELS (domain groups; one shown at a time) ============ */
.groups{margin-top:var(--s3)}
.group{border:1px solid var(--border);background:var(--surface-1);border-radius:var(--r-md);
  margin-bottom:var(--s3);overflow:hidden}
.group[hidden]{display:none}
.group:focus-visible{outline:2px solid var(--info);outline-offset:-2px}
.ginner{padding:var(--s3) var(--s3) 2px}
.btexplain{padding:var(--s4) var(--s4) var(--s2);max-width:80ch;font-family:var(--font-sans);
  line-height:var(--lh-body);color:var(--txt)}
.btexplain b{color:var(--txt-hi)}

/* ============ watchlist-only filter (composes with active tab) ============ */
body.watchonly tr[data-ticker]:not(.watched){display:none}
.watched td{box-shadow:inset 2px 0 0 var(--amb)}

/* ============ tip jar + footer ============ */
.tipjar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:4px 0 8px}
.tipjar .tjlab{color:var(--dim);font-size:10px;letter-spacing:.16em}
.tipjar .tjval{color:var(--amb);font-size:var(--t-xs);word-break:break-all;background:var(--surface-2);border:1px solid var(--border);padding:2px 8px;border-radius:var(--r-sm)}
.tipjar a.tjval{color:var(--cyn)}
.tipjar .tjcopy{font-family:inherit;font-size:10px;color:var(--dim);background:var(--surface-2);border:1px solid var(--border);padding:2px 9px;cursor:pointer;border-radius:var(--r-sm)}
.tipjar .tjcopy:hover{color:var(--cyn);border-color:var(--cyn)}
footer{color:var(--dim);font-size:var(--t-xs);border:1px solid var(--border);background:var(--surface-1);padding:16px 20px;border-radius:var(--r-md);margin-top:var(--s4)}
footer h3{display:inline;color:#9fb3c4;font-size:var(--t-xs);letter-spacing:.15em}
footer summary{cursor:pointer;margin-bottom:6px}
footer .fchips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.disc{margin-top:8px;color:var(--dim);font-size:var(--t-xs)}

/* ============ AI / disclosure host nodes ============ */
.peek{position:fixed;z-index:120;max-width:280px;background:var(--surface-2);color:var(--txt-hi);
  border:1px solid var(--border-strong);border-radius:var(--r-sm);padding:6px 9px;font-size:var(--t-xs);
  line-height:1.4;box-shadow:var(--elev-float);pointer-events:none;opacity:0;transition:opacity var(--dur-fast)}
.peek.show{opacity:1}
.copilot,.drawer{position:fixed;top:0;right:0;height:100%;width:min(420px,92vw);z-index:100;
  background:var(--surface-1);border-left:1px solid var(--border-strong);box-shadow:var(--elev-float);
  transform:translateX(100%);transition:transform var(--dur-mid) var(--ease-out)}
.copilot:not([hidden]),.drawer:not([hidden]){transform:translateX(0)}
.palette{position:fixed;inset:0;z-index:110;display:flex;align-items:flex-start;justify-content:center;
  padding-top:12vh;background:rgba(4,7,11,.55)}

/* ============ micro-interactions ============ */
@keyframes flash{0%{box-shadow:inset 0 0 0 2px var(--info),0 0 0 0 rgba(65,176,255,.4)}100%{box-shadow:inset 0 0 0 2px transparent,0 0 0 8px rgba(65,176,255,0)}}
.flash{animation:flash 1.4s var(--ease-out)}
@keyframes flashup{0%{background:color-mix(in oklab,var(--grn) 34%,transparent)}100%{background:transparent}}
@keyframes flashdn{0%{background:color-mix(in oklab,var(--red) 34%,transparent)}100%{background:transparent}}
.flash-up{animation:flashup .7s var(--ease-out)}
.flash-down{animation:flashdn .7s var(--ease-out)}
.skelwrap{padding:var(--s3)}
.skel{height:12px;margin:6px 0;border-radius:var(--r-sm);
  background:linear-gradient(90deg,var(--surface-1),var(--surface-2),var(--surface-1));
  background-size:200% 100%;animation:shimmer 1.4s infinite}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.ai-cite{animation:aicite 2.4s ease-in-out infinite}
@keyframes aicite{0%,100%{box-shadow:0 0 0 1px rgba(177,140,255,.3)}50%{box-shadow:var(--glow-ai)}}
::view-transition-group(*){animation-timing-function:var(--ease-out)}

/* ============ responsive ============ */
@media(max-width:1000px){.livegrid{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}}
@media(max-width:720px){
  body{font-size:var(--t-sm)}
  .wrap{padding:0 3%}
  .statusbar{padding:6px 3%;gap:6px}
  .sbleft,.sbright{gap:6px}.brand{font-size:var(--t-xs)}
  .chips.dots{display:none}
  th,td{padding:6px 7px}.big{font-size:var(--t-md)}.bar{min-width:40px}
  .btstats{padding:10px 12px;gap:8px}.btile{padding:8px 10px}.btile .bv{font-size:var(--t-md)}
  .spk{min-width:110px}.tlrow{padding:8px 10px;gap:10px}.tlrow .lab{min-width:60px}
  .tab{padding:9px 12px}
  .fbtn,.cbtn{padding:2px 7px}
  /* keep the filter row from wrapping into many rows on narrow screens */
  .filterrow{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .filterrow::-webkit-scrollbar{display:none}
  .filterrow .fgrp.end{margin-left:8px}
  /* dock + drawer become full-height bottom sheets */
  .copilot,.drawer{top:auto;bottom:0;width:100%;height:80vh;border-left:none;border-top:1px solid var(--border-strong);
    transform:translateY(100%)}
  .copilot:not([hidden]),.drawer:not([hidden]){transform:translateY(0)}
}

/* ============ reduced motion (spec §5/§6) ============ */
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .livewrap.live .livedot,.autoind .autodot{animation:none}
  .exp{transition:none}
  .flash,.flash-up,.flash-down,.skel,.ai-cite{animation:none}
  .skel{background:var(--surface-1)}
  .sigchip:hover{transform:none}
  .copilot,.drawer{transition:opacity var(--dur-mid)}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}

/* ============================================================
   AI FRONTEND components (ai.js + palette.js) — dock internals,
   brief actions, citation chips, command palette. Self-contained;
   all motion gated by the reduced-motion block at the file end.
   ============================================================ */

/* ---- Copilot dock internals (shell .copilot lives above) ---- */
.copilot:not([hidden]){display:flex;flex-direction:column}
.dockhead{flex:0 0 auto;display:flex;align-items:center;gap:var(--s2);padding:10px 14px;
  border-bottom:1px solid var(--border);background:var(--surface-2)}
.docktitle{font-weight:700;letter-spacing:.16em;color:var(--ai);font-size:var(--t-sm)}
.dockscope{font-size:9px;letter-spacing:.1em;color:var(--dim);border:1px solid var(--border);
  border-radius:var(--r-pill);padding:1px 8px;text-transform:uppercase}
.dockclose{margin-left:auto;font-family:inherit;background:transparent;border:1px solid var(--border);
  color:var(--dim);cursor:pointer;border-radius:var(--r-sm);padding:2px 8px;font-size:12px}
.dockclose:hover{color:var(--txt-hi);border-color:var(--border-strong)}
.docklog{flex:1 1 auto;overflow-y:auto;scrollbar-width:thin;padding:var(--s3) var(--s3) var(--s2);
  display:flex;flex-direction:column;gap:var(--s2)}
.dockhint{color:var(--dim);font-size:var(--t-xs);line-height:var(--lh-body);font-family:var(--font-sans)}
.dockhint em{color:var(--txt);font-style:italic}
.aimsg{max-width:100%;font-size:var(--t-base);line-height:var(--lh-body);border-radius:var(--r-md);
  padding:8px 11px;word-wrap:break-word;overflow-wrap:anywhere}
.aimsg.user{align-self:flex-end;background:var(--surface-2);border:1px solid var(--border-strong);
  color:var(--txt-hi);max-width:88%;font-family:var(--font-mono);font-size:var(--t-sm)}
.aimsg.ai{align-self:flex-start;background:color-mix(in oklab,var(--ai) 8%,var(--surface-0));
  border:1px solid rgba(177,140,255,.28);color:var(--txt);font-family:var(--font-sans);max-width:100%}
.aimsg.ai.offline{background:var(--surface-0);border-color:var(--border);color:var(--dim)}
/* structured AI prose: paragraphs, lists, bold */
.aimsg.ai p{margin:0 0 var(--s2)}
.aimsg.ai p:last-child{margin-bottom:0}
.aimsg.ai strong{color:var(--txt-hi);font-weight:600}
.aimsg.ai .ailist{margin:0 0 var(--s2);padding-left:1.1em;list-style:none}
.aimsg.ai .ailist li{position:relative;margin:2px 0}
.aimsg.ai .ailist li::before{content:"›";position:absolute;left:-1em;color:var(--ai);opacity:.8}
/* live "thinking" (reasoning-model chain-of-thought preview) */
.aimsg.ai.thinking{background:var(--surface-0);border-color:var(--border);color:var(--dim);
  font-family:var(--font-mono);font-size:var(--t-sm)}
.thinkhead{display:flex;align-items:center;gap:6px;color:var(--ai);font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.thinktext{display:block;color:var(--txt-dim);font-style:italic;line-height:var(--lh-tight);
  max-height:2.8em;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,#000 40%,transparent);mask-image:linear-gradient(180deg,#000 40%,transparent)}
.offtag{display:inline-block;font-size:9px;letter-spacing:.12em;color:var(--amb);
  border:1px solid color-mix(in oklab,var(--amb) 35%,transparent);border-radius:var(--r-sm);
  padding:0 6px;margin-right:6px;vertical-align:baseline}
.offtag.busy{color:var(--info);border-color:color-mix(in oklab,var(--info) 35%,transparent)}
.aidots{display:inline-flex;gap:4px;align-items:center;height:16px}
.aidots i{width:6px;height:6px;border-radius:50%;background:var(--ai);opacity:.5;
  animation:aidot 1.1s infinite ease-in-out}
.aidots i:nth-child(2){animation-delay:.18s}
.aidots i:nth-child(3){animation-delay:.36s}
@keyframes aidot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
/* citation chip inside AI prose */
.citechip{font-family:var(--font-mono);font-size:11px;color:var(--ai);cursor:pointer;
  background:color-mix(in oklab,var(--ai) 12%,transparent);
  border:1px solid color-mix(in oklab,var(--ai) 40%,transparent);border-radius:var(--r-sm);
  padding:0 5px;margin:0 1px;line-height:1.5;transition:box-shadow var(--dur-fast),border-color var(--dur-fast)}
.citechip:hover{box-shadow:var(--glow-ai);border-color:var(--ai)}
.citechip.demo{cursor:default}
.dockform{flex:0 0 auto;display:flex;gap:var(--s2);padding:var(--s2) var(--s3) var(--s3);
  border-top:1px solid var(--border);background:var(--surface-1)}
#dockinput{flex:1;font-family:inherit;font-size:var(--t-sm);color:var(--txt-hi);
  background:var(--surface-0);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px}
#dockinput:focus{outline:none;border-color:var(--border-accent);box-shadow:var(--glow-info)}
.docksend{font-family:inherit;color:var(--ai);background:var(--surface-2);
  border:1px solid rgba(177,140,255,.35);border-radius:var(--r-sm);padding:0 12px;cursor:pointer;font-size:14px}
.docksend:hover{box-shadow:var(--glow-ai)}

/* ---- Brief banner actions + skeleton ---- */
.brief{align-items:center}
.briefacts{margin-left:auto;display:inline-flex;gap:6px;flex:0 0 auto}
.briefbtn{font-family:inherit;font-size:10px;letter-spacing:.04em;color:var(--dim);
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:2px 9px;cursor:pointer;transition:color var(--dur-fast),border-color var(--dur-fast)}
.briefbtn:hover{color:var(--ai);border-color:rgba(177,140,255,.35)}
.briefskel{display:block;height:11px;margin:3px 0;border-radius:var(--r-sm);
  background:linear-gradient(90deg,var(--surface-1),var(--surface-2),var(--surface-1));
  background-size:200% 100%;animation:shimmer 1.4s infinite}
.briefskel.s2{width:70%}

/* ---- Command palette ---- */
/* the base `.palette{display:flex}` (overlay) would otherwise beat the UA
   [hidden] rule and leave a full-viewport scrim intercepting every click while
   the palette is closed — restore hidden semantics. */
.palette[hidden]{display:none}
.palbox{width:min(620px,94vw);max-height:70vh;display:flex;flex-direction:column;
  background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--r-lg);
  box-shadow:var(--elev-float);overflow:hidden}
.palinput{font-family:inherit;font-size:var(--t-md);color:var(--txt-hi);background:var(--surface-0);
  border:none;border-bottom:1px solid var(--border);padding:14px 16px}
.palinput:focus{outline:none}
.pallist{list-style:none;overflow-y:auto;scrollbar-width:thin;padding:6px;margin:0}
.palitem{display:flex;align-items:center;gap:var(--s2);padding:7px 10px;border-radius:var(--r-sm);
  cursor:pointer;font-size:var(--t-sm)}
.palitem.active{background:var(--surface-2);box-shadow:inset 2px 0 0 var(--info)}
.palitem .palkind{flex:0 0 auto;min-width:56px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim);border:1px solid var(--border);border-radius:var(--r-sm);padding:1px 6px;text-align:center}
.palitem .palkind.ai{color:var(--ai);border-color:rgba(177,140,255,.35)}
.palitem .paltitle{color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.palitem.active .paltitle{color:var(--txt-hi)}
.palitem.ask .paltitle{font-family:var(--font-sans)}
.palitem.empty{color:var(--dim);cursor:default;justify-content:center}
.palfoot{display:flex;gap:16px;padding:8px 16px;border-top:1px solid var(--border);
  color:var(--dim);font-size:10px;background:var(--surface-2)}
.palfoot kbd{font-family:inherit;color:var(--txt);border:1px solid var(--border);border-radius:3px;padding:0 4px}

/* ---- reduced motion for the AI components ---- */
@media(prefers-reduced-motion:reduce){
  .aidots i{animation:none;opacity:.6}
  .briefskel{animation:none;background:var(--surface-1)}
  .citechip{transition:none}
}
/* ---- mobile: palette + dock as bottom sheets ---- */
@media(max-width:720px){
  .palette{align-items:flex-end;padding:0}
  .palbox{width:100%;max-height:80vh;border-radius:var(--r-lg) var(--r-lg) 0 0}
}

/* ============================================================
   ADDED FEATURES (spec §1–§8): hero, TradingView ticker links,
   top-movers panel, reddit feed, prominent tip jar + contact,
   and the LIGHT THEME token override. Self-contained.
   ============================================================ */

/* ---- HERO (product thesis, top of page) ---- */
.hero{margin:var(--s4) 0 0}
.herotitle{font-size:var(--t-xl);letter-spacing:.06em;color:var(--txt-hi);font-weight:700;line-height:1.15}
.herotitle .x{color:var(--amb)}
.herotag{margin-top:6px;max-width:82ch;color:var(--txt);font-family:var(--font-sans);
  font-size:var(--t-md);line-height:var(--lh-body)}
@media(max-width:720px){.herotitle{font-size:var(--t-lg)}.herotag{font-size:var(--t-base)}}

/* ---- TradingView ticker links (every ticker occurrence) ---- */
a.tkl{color:var(--txt-hi);text-decoration:none;border-bottom:1px dotted transparent;
  transition:color var(--dur-fast),border-color var(--dur-fast)}
a.tkl:hover{color:var(--cyn);text-decoration:none;border-bottom-color:currentColor}
a.tkl:hover::after{content:"↗";font-size:.78em;opacity:.75;margin-left:2px;vertical-align:super}
a.tag.tkchip{cursor:pointer}
a.tag.tkchip:hover{text-decoration:none;border-color:currentColor}
a.tag.tkchip:hover::after{content:"↗";font-size:.9em;opacity:.75;margin-left:2px}
.qitem a.qs.tkl{color:var(--txt-hi)}

/* ---- TOP MOVERS panel ---- */
.moversgrid{margin-bottom:0}
.sh h2.up{color:var(--grn)}
.sh h2.dn{color:var(--red)}
.moversgrid .tblwrap.mid>table{min-width:420px}

/* ---- REDDIT FEED ---- */
.rdcov{padding:8px 14px;border-bottom:1px solid var(--border);font-size:var(--t-xs);
  color:var(--txt);line-height:1.6}
.rdcov .rdvia{color:var(--amb);font-weight:700}
.rdcov .tag{margin:1px 2px}
a.rdlink{color:var(--cyn);white-space:nowrap}
a.rdlink:hover{text-decoration:underline}

/* ---- PROMINENT TIP JAR ---- */
.tipjar.prominent{display:block;margin:6px 0 12px;padding:14px 16px;border-radius:var(--r-md);
  border:1px solid var(--border-accent);
  background:linear-gradient(180deg,color-mix(in oklab,var(--amb) 9%,var(--surface-1)),var(--surface-1));
  box-shadow:var(--elev-panel)}
.tipjar.prominent .tjhead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.tipjar .tjheart{color:var(--red);font-size:15px;line-height:1}
.tipjar.prominent .tjlab{color:var(--amb);font-size:var(--t-sm);letter-spacing:.16em;font-weight:700}
.tipjar .tjmsg{color:var(--dim);font-size:var(--t-xs);font-family:var(--font-sans)}
.tipjar.prominent .tjbody{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tipjar.prominent .tjval{font-size:var(--t-sm)}
.tipjar .tjbtn{font-weight:700;padding:6px 14px;border:1px solid var(--amb);color:var(--amb);
  background:color-mix(in oklab,var(--amb) 14%,transparent);border-radius:var(--r-sm);text-decoration:none}
.tipjar .tjbtn:hover{box-shadow:0 0 0 1px var(--amb);text-decoration:none}
.tipjar.prominent .tjcopy{padding:5px 12px}

/* ---- CONTACT line ---- */
.contact{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 10px}
.contact .ctlab{color:var(--dim);font-size:10px;letter-spacing:.16em}
.contact .ctval{color:var(--cyn);font-size:var(--t-xs)}
.contact .cthint{font-size:10px}

/* ============================================================
   LIGHT / WHITE THEME (spec §2) — override the token system.
   Light surfaces, dark text, accents darkened to hold AA contrast
   in daylight while still reading as green/red/amber/cyan/violet.
   ============================================================ */
:root{color-scheme:dark}
:root[data-theme=light]{
  color-scheme:light;
  --bg:#eef1f5;
  --surface-0:#ffffff;
  --surface-1:#ffffff;
  --surface-2:#eef2f6;
  --border-hair:rgba(28,48,68,.14);
  --border:#d4dbe4;
  --border-strong:#aeb9c6;
  --border-accent:rgba(20,104,196,.45);

  --up:#0a8f3c;  --grn:#0a8f3c;
  --dn:#d11f28;  --red:#d11f28;
  --warn:#a86a00; --amb:#a86a00;
  --info:#1668c4; --cyn:#1668c4;
  --ai:#7a49d6;  --vio:#7a49d6;
  --flat:#5a6b7a; --dim:#5a6b7a;

  --c1:#2f7fd6; --c2:#149a5b; --c3:#7a49d6; --c4:#b26b00; --c5:#1596a4; --c6:#d1495e;

  --txt:#26333f; --txt-hi:#0b1620; --txt-dim:#556575;

  --elev-panel:inset 0 1px 0 rgba(255,255,255,.6);
  --elev-float:0 0 0 1px var(--border),0 10px 28px -10px rgba(20,40,60,.28),0 2px 6px -2px rgba(20,40,60,.16);
  --glow-info:0 0 0 1px var(--border-accent),0 0 10px -2px rgba(22,104,196,.32);
  --glow-ai:0 0 0 1px rgba(122,73,214,.45),0 0 14px -4px rgba(122,73,214,.38);
}
/* targeted fixes where the base CSS hard-coded dark-only colors */
:root[data-theme=light] .tag{color:#3a4a5a}
:root[data-theme=light] .subhd h3,
:root[data-theme=light] footer h3{color:#3a4a5a}
:root[data-theme=light] .cap{color:#fff}
:root[data-theme=light] .side.b{color:#042a12}
:root[data-theme=light] .side.s{color:#2a0508}
:root[data-theme=light] .fbtn.on,
:root[data-theme=light] .cbtn.on{color:#fff}
:root[data-theme=light] .fl-anomaly{background:#fff3df;border-color:#e0ab53;color:#8a5300}
:root[data-theme=light] tr:hover td{background:#f2f6fb}
:root[data-theme=light] tr[data-aid]:hover td{box-shadow:inset 2px 0 0 var(--info)}
:root[data-theme=light] ::selection{background:rgba(22,104,196,.22);color:#082441}
:root[data-theme=light] .aimsg.ai{color:var(--txt)}
:root[data-theme=light] .aimsg.user{color:var(--txt-hi)}

/* ---- TOP MOVERS grid + jump-to-card ---- */
.moversgrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.moversgrid.three{grid-template-columns:1fr 1fr 1fr}
.moversgrid>section{margin-bottom:0;min-width:0}
@media(max-width:1000px){.moversgrid,.moversgrid.three{grid-template-columns:1fr}}
a.jumpcard{color:var(--cyn);font-size:10px;margin-left:6px;white-space:nowrap;cursor:pointer;
  border:1px solid var(--border);border-radius:var(--r-sm);padding:0 5px;text-decoration:none}
a.jumpcard:hover{border-color:var(--border-accent);text-decoration:none}

/* ---- REDDIT CHATTER FEED (feed of links) ---- */
.rd-subs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 14px;
  border-bottom:1px solid var(--border);font-size:var(--t-xs)}
.rd-subslab{color:var(--dim);font-size:9px;letter-spacing:.16em}
a.rd-sub{color:var(--cyn);border:1px solid var(--border);border-radius:var(--r-pill);
  padding:1px 9px;font-size:11px;text-decoration:none}
a.rd-sub:hover{border-color:var(--cyn);text-decoration:none}
.rd-feed{display:flex;flex-direction:column}
.rd-row{border-bottom:1px solid var(--border-hair)}
.rd-row:last-child{border-bottom:none}
.rd-item{display:flex;align-items:center;gap:10px;padding:8px 14px;color:var(--txt);
  text-decoration:none;transition:background var(--dur-fast)}
a.rd-item:hover{background:var(--surface-0);text-decoration:none}
.rd-rank{color:var(--dim);font-size:11px;min-width:34px}
.rd-tk{font-weight:700;color:var(--txt-hi);min-width:76px}
.rd-m{color:var(--txt);font-size:var(--t-xs);flex:1}
.rd-d{font-size:var(--t-xs);font-weight:700}
.rd-d.up{color:var(--grn)}.rd-d.dn{color:var(--red)}.rd-d.flat{color:var(--dim)}
.rd-go{color:var(--cyn);font-size:12px}
