/* Brand fonts, self-hosted (latin subset). Previously declared but never vendored — the whole
   terminal was silently falling back to SF Mono / system-ui, which is why it read generic.
   Google Fonts, Open Font License. No runtime CDN. */
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:300 700;font-display:swap;
  src:url(/fonts/V8mDoQDjQSkFtoMM3T6r8E7mPbF4C_k3HqU.woff2) format("woff2")}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:400;font-display:optional;
  src:url(/fonts/i7dPIFZifjKcF5UAWdDRYEF8RXi4EwQ.woff2) format("woff2")}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:700;font-display:optional;
  src:url(/fonts/i7dMIFZifjKcF5UAWdDRaPpZUFWaHi6WZ3Q.woff2) format("woff2")}

/* ALWAYSON Terminal — design system v2.
   Direction: institutional trading terminal, not a crypto landing page. Three rules:
   1. Lime means one thing — "up" or "active". Everywhere else is a warm grey scale, so the eye
      goes to the data instead of the chrome.
   2. Prose loses to instrumentation. Anything that was a paragraph is now a chip, a meter, or a
      tooltip. If a sentence can be a number, it's a number.
   3. Numbers are the typography. Tabular, tight, larger than the labels around them. */

/* The UA sheet's [hidden]{display:none} loses to any author display rule — this caught us once
   when an iframe overlay covered a working chart. Keep this first. */
[hidden]{display:none!important}

:root{
  /* surfaces, darkest → raised */
  --s0:#080A06; --s1:#0D110A; --s2:#131810; --s3:#1A2015;
  --line:#1E2617; --line-2:#141A0F;
  /* text */
  --t1:#E9EFDD; --t2:#8D9A78; --t3:#5C6749;
  /* semantic */
  --up:#CCFF00; --up-press:#BEF200; --up-dim:rgba(204,255,0,.13);
  --dn:#FF5C5C; --dn-dim:rgba(255,92,92,.12); --warn:#FFC94D;
  --mono:"Space Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --disp:"Space Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r:7px;
  --hair:1px solid var(--line);
}

*{box-sizing:border-box;margin:0;padding:0}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.livedot,.mkt.shut .led{animation:none;opacity:.75}}

.term-body{
  background:var(--s0);color:var(--t1);overflow:hidden;
  font-family:var(--disp);font-size:13px;line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
@media(max-width:960px){.term-body{overflow:auto}}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:1.5px solid var(--up);outline-offset:1px;border-radius:3px}
::selection{background:rgba(204,255,0,.28);color:#000}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.t2{color:var(--t2)} .t3{color:var(--t3)}
.up{color:var(--up)} .dn{color:var(--dn)}

/* scrollbars — thin and dark, so panes don't sprout bright rails */
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--s3);border-radius:4px}
*::-webkit-scrollbar-thumb:hover{background:#25301a}

/* ═══ top bar ═══ */
.tbar{
  height:46px;display:flex;align-items:center;gap:12px;padding:0 14px;
  background:var(--s1);border-bottom:var(--hair);position:sticky;top:0;z-index:40;
}
.brand{display:flex;align-items:center;gap:8px;font-family:var(--disp);font-weight:700;
  font-size:14.5px;letter-spacing:-.02em;white-space:nowrap}
.brand b{color:var(--up)}
.dot{width:6px;height:6px;border-radius:50%;background:var(--up);flex:none;
  box-shadow:0 0 0 0 rgba(204,255,0,.5);animation:pulse 2.6s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(204,255,0,.45)}70%{box-shadow:0 0 0 7px rgba(204,255,0,0)}100%{box-shadow:0 0 0 0 rgba(204,255,0,0)}}

.mkt{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;
  color:var(--t2);border:var(--hair);border-radius:999px;padding:4px 11px;background:var(--s0)}
.mkt .led{width:6px;height:6px;border-radius:50%;background:var(--dn)}
.mkt.shut .led{background:var(--up);animation:blink 1.8s steps(2,end) infinite}
@keyframes blink{50%{opacity:.3}}
.mkt b{color:var(--t1);font-weight:400}

.tbar-r{margin-left:auto;display:flex;align-items:center;gap:7px}
.chip{font-family:var(--mono);font-size:11px;color:var(--t2);border:var(--hair);
  border-radius:6px;padding:4px 9px;white-space:nowrap;background:var(--s0);
  transition:color .12s,border-color .12s;display:inline-flex;align-items:center}
button.chip:hover,a.chip:hover{color:var(--t1);border-color:var(--t3)}
.kbd{font-family:var(--mono);font-size:9.5px;border:var(--hair);border-radius:4px;
  padding:0 4px;color:var(--t3);margin-left:6px}

/* ═══ grid ═══ */
.term{
  display:grid;grid-template-columns:252px minmax(0,1fr) 306px;
  height:calc(100vh - 46px);background:var(--line-2);gap:1px;
}
.pane{background:var(--s0);min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.ph{display:flex;align-items:center;justify-content:space-between;gap:8px;height:31px;
  padding:0 11px;border-bottom:var(--hair);background:var(--s1);flex:none;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--t3)}
.ph b{color:var(--t2);font-weight:400;letter-spacing:.04em}

/* ═══ watchlist ═══ */
.wl-h{display:grid;grid-template-columns:1fr 74px 56px;gap:5px;padding:5px 11px;flex:none;
  font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--t3);border-bottom:1px solid var(--line-2)}
.wl-rows{overflow-y:auto;flex:1}
.wl-row{display:grid;grid-template-columns:1fr 74px 56px;gap:5px;align-items:center;
  padding:7px 11px 7px 9px;cursor:pointer;border-left:2px solid transparent;
  font-family:var(--mono);font-size:12px;transition:background .1s}
.wl-row:hover{background:var(--s1)}
.wl-row.on{background:var(--s2);border-left-color:var(--up)}
.wl-row .tk{font-weight:700;color:var(--t1);letter-spacing:.01em;display:flex;align-items:center;gap:5px}
.wl-row .px{text-align:right;color:var(--t1);font-variant-numeric:tabular-nums}
.wl-row .ch{text-align:right;font-size:11px;font-variant-numeric:tabular-nums}
.wl-row .ch.up{color:var(--up)} .wl-row .ch.dn{color:var(--dn)}
.livedot{width:4px;height:4px;border-radius:50%;background:var(--up);flex:none;opacity:.9}
.wl-foot{padding:8px 11px;border-top:var(--hair);flex:none;
  font-family:var(--mono);font-size:9.5px;line-height:1.5;color:var(--t3)}
.skel{display:inline-block;height:10px;border-radius:2px;
  background:linear-gradient(90deg,#141A0F,#1E2617,#141A0F);background-size:200% 100%;
  animation:sh 1.4s linear infinite}
@keyframes sh{to{background-position:-200% 0}}

/* ═══ chart pane ═══ */
.cid{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:11px 14px 9px;flex:none}
.cid-tk{font-family:var(--disp);font-weight:700;font-size:23px;letter-spacing:-.035em;line-height:1}
.cid-nm{font-size:11.5px;color:var(--t3);letter-spacing:.02em}
.cid-px{font-family:var(--mono);font-size:20px;color:var(--t1);letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;transition:color .3s}
.cid-px.tick-up{color:var(--up)} .cid-px.tick-dn{color:var(--dn)}
.cid-ch{font-family:var(--mono);font-size:12px;padding:2.5px 7px;border-radius:5px;
  font-variant-numeric:tabular-nums}
.cid-ch.up{color:var(--up);background:var(--up-dim)}
.cid-ch.dn{color:var(--dn);background:var(--dn-dim)}
.cid-r{margin-left:auto;display:flex;align-items:center;gap:7px}

/* segmented control — outline, not fill. A lime block per control was shouting. */
.seg{display:inline-flex;background:var(--s1);border:var(--hair);border-radius:var(--r);padding:2px;gap:2px}
.seg button{font-family:var(--mono);font-size:11px;padding:4px 9px;border-radius:5px;
  color:var(--t3);transition:background .12s,color .12s;white-space:nowrap}
.seg button:hover{color:var(--t1);background:var(--s2)}
.seg button.on{color:var(--up);background:var(--s3)}

/* ═══ the ribbon — was three paragraphs of prose, now instruments ═══ */
.ribbon{display:flex;align-items:stretch;padding:0 14px 10px;flex:none;flex-wrap:wrap;gap:0}
.gauge{display:flex;flex-direction:column;gap:2px;padding-right:16px;margin-right:16px;
  border-right:1px solid var(--line-2);min-width:0}
.gauge:last-child{border-right:0;margin-right:0;padding-right:0}
.gauge .k{font-family:var(--mono);font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--t3);display:flex;align-items:center;gap:5px}
.gauge .v{font-family:var(--mono);font-size:13.5px;color:var(--t1);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:5px}
.gauge .v.tight{color:var(--up)} .gauge .v.moderate{color:#DCEB6E}
.gauge .v.wide{color:var(--warn)} .gauge .v.very-wide{color:var(--dn)}
.bar{width:52px;height:3px;border-radius:2px;background:var(--s3);overflow:hidden;margin-top:3px}
.bar i{display:block;height:100%;border-radius:2px;background:var(--up);transition:width .35s ease}
.bar i.moderate{background:#DCEB6E} .bar i.wide{background:var(--warn)} .bar i.very-wide{background:var(--dn)}

/* tooltip replaces the explainer paragraph */
.info{width:13px;height:13px;border-radius:50%;border:var(--hair);color:var(--t3);
  font-size:9px;line-height:11px;text-align:center;cursor:help;position:relative;flex:none;
  font-family:var(--mono)}
.info:hover{color:var(--t1);border-color:var(--t3)}
.info::after{
  content:attr(data-tip);position:absolute;left:0;top:19px;width:262px;z-index:60;
  background:var(--s2);border:var(--hair);border-radius:var(--r);padding:9px 11px;
  font-family:var(--disp);font-size:11.5px;line-height:1.5;color:var(--t2);
  letter-spacing:0;text-transform:none;opacity:0;pointer-events:none;transition:opacity .14s;
  box-shadow:0 8px 26px rgba(0,0,0,.6);white-space:normal;text-align:left}
.info:hover::after{opacity:1}

/* ═══ chart ═══ */
.cbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:0 14px 9px;flex:none}
.legend{font-family:var(--mono);font-size:10.5px;color:var(--t3);display:flex;gap:9px;flex-wrap:wrap;
  margin-left:auto;align-items:center}
.legend b{color:var(--t1);font-weight:400}
.legend .up{color:var(--up)} .legend .dn{color:var(--dn)}
.legend .shut{color:var(--up);border:1px solid rgba(204,255,0,.28);border-radius:3px;
  padding:0 4px;font-size:9px;letter-spacing:.09em}

.plotwrap{position:relative;flex:1;min-height:0;border-top:var(--hair)}
.plot{position:absolute;inset:0}
.plotmsg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:11.5px;color:var(--t3);text-align:center;padding:22px;
  background:var(--s0);z-index:2}
.framewrap{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--s0);z-index:3}
.frame-note{font-family:var(--mono);font-size:10px;color:var(--t3);padding:6px 14px;
  border-bottom:var(--hair);flex:none}
.frame-note a{color:var(--up)}
.frame-load{position:absolute;inset:30px 0 0;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:11px;color:var(--t3)}
.framewrap iframe{flex:1;width:100%;border:0;background:var(--s0);position:relative;z-index:1}

.cfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:7px 14px;border-top:var(--hair);flex:none;
  font-family:var(--mono);font-size:9.5px;color:var(--t3)}
.cfoot b{color:var(--up);font-weight:400}
.cfoot .clip{color:var(--warn)}
.cfoot a{color:var(--t3);text-decoration:underline;text-underline-offset:2px}
.cfoot a:hover{color:var(--t2)}

/* ═══ side pane ═══ */
.sidepane{overflow:hidden}
.stab{display:flex;border-bottom:var(--hair);background:var(--s1);flex:none}
.stab button{flex:1;padding:9px 4px;font-family:var(--mono);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--t3);border-bottom:1.5px solid transparent;transition:color .12s}
.stab button:hover{color:var(--t2)}
.stab button.on{color:var(--up);border-bottom-color:var(--up)}
.spanes{flex:1;min-height:0;overflow-y:auto}
.spane{padding:12px}

/* trade */
.side2{display:flex;gap:2px;background:var(--s1);border:var(--hair);border-radius:var(--r);
  padding:2px;margin-bottom:11px}
.side2 button{flex:1;padding:7px;font-family:var(--mono);font-size:11.5px;border-radius:5px;
  color:var(--t3);transition:background .12s,color .12s}
.side2 button.on{background:var(--s3);color:var(--up)}
.side2 button.on[data-side=sell]{color:var(--dn)}

.fld{margin-bottom:9px}
.fld .lab{display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--mono);font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--t3);margin-bottom:5px}
.fld .lab b{color:var(--t2);font-weight:400;letter-spacing:0;text-transform:none;font-size:10px}
.fld .box{display:flex;align-items:center;gap:8px;border:var(--hair);border-radius:var(--r);
  background:var(--s1);padding:9px 11px;transition:border-color .12s}
.fld .box:focus-within{border-color:var(--up)}
.fld .box.ro{background:var(--s2)}
.fld input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--t1);
  font-family:var(--mono);font-size:16px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.fld input::placeholder{color:var(--t3)}
.fld .tok{font-family:var(--mono);font-size:11.5px;color:var(--t2);flex:none}

.quick{display:flex;gap:5px;margin:-3px 0 11px}
.quick button{flex:1;background:var(--s1);border:var(--hair);color:var(--t3);
  font-family:var(--mono);font-size:10px;padding:5px 0;border-radius:5px;
  transition:color .12s,border-color .12s}
.quick button:hover{color:var(--t1);border-color:var(--t3)}

.qrows{display:flex;flex-direction:column;gap:5px;margin-top:10px;
  font-family:var(--mono);font-size:10.5px;color:var(--t3)}
.qrow{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.qrow b{color:var(--t2);font-weight:400}
.qnote{padding:7px 9px;border-radius:5px;line-height:1.5}
.qnote.warn{background:rgba(255,201,77,.07);border:1px solid rgba(255,201,77,.22);color:var(--warn)}
.qnote.bad{background:var(--dn-dim);border:1px solid rgba(255,92,92,.25);color:var(--dn)}
.qnote.ok{background:var(--s1);border:var(--hair);color:var(--t2)}

.btn{width:100%;display:block;text-align:center;font-family:var(--mono);font-size:12px;
  border-radius:var(--r);padding:11px 14px;border:var(--hair);background:var(--s2);color:var(--t1);
  transition:background .12s,border-color .12s,color .12s}
.btn:hover{background:var(--s3);border-color:var(--t3)}
.btn.go{background:var(--up);color:#000;border-color:var(--up);font-weight:700;letter-spacing:.01em}
.btn.go:hover{background:var(--up-press);border-color:var(--up-press)}
.btn:disabled{background:var(--s1);color:var(--t3);border-color:var(--line);cursor:not-allowed;font-weight:400}
.btn.mt{margin-top:11px}

.wopts{display:flex;flex-direction:column;gap:6px;margin-top:9px}
.wopt{display:flex;align-items:center;gap:9px;padding:8px 10px;border:var(--hair);
  border-radius:var(--r);background:var(--s1);font-family:var(--mono);font-size:11.5px;
  color:var(--t1);text-align:left;width:100%;transition:border-color .12s}
.wopt:hover{border-color:var(--up)}
.wopt img{width:18px;height:18px;border-radius:4px;flex:none}
.acct{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;
  color:var(--t2);margin-bottom:10px}
.acct .lk{margin-left:auto;color:var(--t3);text-decoration:underline;text-underline-offset:2px;font-size:10px}
.acct .lk:hover{color:var(--t1)}

/* depth ladder — the number nobody else on this chain publishes */
.ladder{display:flex;flex-direction:column;gap:1px;background:var(--line-2);
  border:var(--hair);border-radius:var(--r);overflow:hidden;margin-top:4px}
.lrow{display:grid;grid-template-columns:52px 1fr 54px;gap:8px;align-items:center;
  padding:7px 10px;background:var(--s1);font-family:var(--mono);font-size:11px}
.lrow .sz{color:var(--t2)}
.lrow .meter{height:4px;border-radius:2px;background:var(--s3);overflow:hidden}
.lrow .meter i{display:block;height:100%;background:var(--up);transition:width .4s ease}
.lrow .meter i.warn{background:var(--warn)} .lrow .meter i.bad{background:var(--dn)}
.lrow .pc{text-align:right;color:var(--t1);font-variant-numeric:tabular-nums}
.lrow .pc.warn{color:var(--warn)} .lrow .pc.bad{color:var(--dn)}

/* tape */
.tape-h{display:grid;grid-template-columns:44px 1fr 1fr 46px;gap:6px;padding:5px 12px;flex:none;
  font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--t3);border-bottom:1px solid var(--line-2)}
.tape-rows{font-family:var(--mono);font-size:11px}
.trow{display:grid;grid-template-columns:44px 1fr 1fr 46px;gap:6px;align-items:center;
  padding:4.5px 12px;border-bottom:1px solid rgba(20,26,15,.7)}
.trow:hover{background:var(--s1)}
.trow .sd{font-weight:700;font-size:9.5px;letter-spacing:.06em}
.trow.buy .sd{color:var(--up)} .trow.sell .sd{color:var(--dn)}
.trow .pz,.trow .qt{text-align:right;color:var(--t1);font-variant-numeric:tabular-nums}
.trow .tm{text-align:right;color:var(--t3);font-size:10px}
.trow .moon{opacity:.85;font-size:8px;margin-left:3px}
.trow.new{animation:flash 1s ease-out}
@keyframes flash{from{background:rgba(204,255,0,.11)}to{background:transparent}}
.empty{padding:16px 12px;font-family:var(--mono);font-size:10.5px;color:var(--t3);line-height:1.6}

.foot-note{font-family:var(--mono);font-size:9px;color:var(--t3);line-height:1.6;
  padding:10px 12px;border-top:var(--hair)}
.foot-note a{text-decoration:underline;text-underline-offset:2px}

/* ═══ command palette ═══ */
.cmdk{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-start;justify-content:center;
  padding-top:13vh;background:rgba(4,6,3,.72);backdrop-filter:blur(3px)}
.cmdk-box{width:min(540px,92vw);background:var(--s1);border:var(--hair);border-radius:11px;
  box-shadow:0 24px 70px rgba(0,0,0,.7);overflow:hidden}
.cmdk-in{width:100%;background:none;border:0;outline:0;padding:15px 17px;color:var(--t1);
  font-family:var(--mono);font-size:14px;border-bottom:var(--hair)}
.cmdk-in::placeholder{color:var(--t3)}
.cmdk-list{max-height:44vh;overflow-y:auto;padding:6px}
.cmdk-item{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:6px;
  font-family:var(--mono);font-size:12px;color:var(--t2);cursor:pointer}
.cmdk-item .g{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3);
  min-width:54px;flex:none}
.cmdk-item .l{color:var(--t1)}
.cmdk-item .r{margin-left:auto;color:var(--t3);font-size:10.5px}
.cmdk-item.on{background:var(--s3)}
.cmdk-item.on .l{color:var(--up)}
.cmdk-empty{padding:18px;text-align:center;font-family:var(--mono);font-size:11.5px;color:var(--t3)}

/* ═══ popover (indicators) ═══ */
.pop{position:absolute;z-index:70;background:var(--s1);border:var(--hair);border-radius:9px;
  box-shadow:0 16px 44px rgba(0,0,0,.6);padding:7px;min-width:206px;max-height:62vh;overflow-y:auto}
.pop-h{font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--t3);padding:6px 8px 4px}
.pop-i{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:5px;
  font-family:var(--mono);font-size:11.5px;color:var(--t2);cursor:pointer;width:100%;text-align:left}
.pop-i:hover{background:var(--s2);color:var(--t1)}
.pop-i .sw{width:8px;height:8px;border-radius:2px;flex:none;background:var(--t3)}
.pop-i.on{color:var(--t1)}
.pop-i .ck{margin-left:auto;color:var(--up);opacity:0}
.pop-i.on .ck{opacity:1}

/* ═══ heatmap overlay ═══ */
.heat{position:fixed;inset:46px 0 0;z-index:35;background:var(--s0);padding:18px;overflow-y:auto}
.heat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:9px;
  max-width:1100px;margin:0 auto}
.hcell{border:var(--hair);border-radius:9px;padding:13px 14px;background:var(--s1);cursor:pointer;
  transition:border-color .14s,transform .14s}
.hcell:hover{border-color:var(--t3);transform:translateY(-1px)}
.hcell .t{font-family:var(--disp);font-weight:700;font-size:17px;letter-spacing:-.03em}
.hcell .p{font-family:var(--mono);font-size:14px;color:var(--t1);margin-top:5px;font-variant-numeric:tabular-nums}
.hcell .c{font-family:var(--mono);font-size:12px;margin-top:2px;font-variant-numeric:tabular-nums}
.hcell .m{font-family:var(--mono);font-size:9px;color:var(--t3);margin-top:8px;display:flex;justify-content:space-between}
.heat-top{max-width:1100px;margin:0 auto 15px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.heat-top h2{font-family:var(--disp);font-size:19px;letter-spacing:-.03em;font-weight:700}
.heat-top p{font-family:var(--mono);font-size:11px;color:var(--t3)}

/* ═══ responsive ═══ */
@media(max-width:1200px){.term{grid-template-columns:232px minmax(0,1fr) 282px}}
@media(max-width:960px){
  .term{display:block;height:auto;background:var(--s0)}
  .pane{border-bottom:var(--hair)}
  .wl-rows{max-height:212px}
  .plotwrap{height:min(56vh,400px);flex:none}
  .tbar{gap:9px;padding:0 11px}
  .mkt{font-size:10px;padding:3px 8px}
  .tbar-r .hide-sm{display:none}
}
@media(max-width:430px){
  .cid-tk{font-size:19px} .cid-px{font-size:16px} .cid-nm{display:none}
  .seg button{padding:4px 7px;font-size:10.5px}
  .gauge{padding-right:11px;margin-right:11px}
  .plotwrap{height:320px}
}

/* heatmap cell magnitude bar */
.hbar{height:3px;border-radius:2px;background:var(--s3);overflow:hidden;margin-top:9px}
.hbar i{display:block;height:100%;border-radius:2px}
.hbar i.u{background:var(--up)} .hbar i.d{background:var(--dn)}
.heat-grid{grid-template-columns:repeat(auto-fill,minmax(196px,1fr))}
.heat-top h2{font-size:22px}
.heat-top p b{font-weight:400}

/* watchlist sparklines */
/* ticker · sparkline · price · 24h — sized so nothing clips at the pane width above */
.wl-h, .wl-row{grid-template-columns:minmax(0,1fr) 44px 64px 48px;gap:4px}
.wl-h{padding-left:10px;padding-right:10px}
.wl-row{padding-left:8px;padding-right:10px}
.wl-row .spark{display:flex;align-items:center;justify-content:flex-end;opacity:.95;min-width:42px}
.wl-row .spark svg{display:block}

/* who moved this price */
.movers{padding:9px 12px;border-bottom:1px solid var(--line-2);display:flex;flex-direction:column;gap:5px}
.movers:empty{display:none}
.mv{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-family:var(--mono);font-size:10.5px}
.mv-k{color:var(--t3);letter-spacing:.08em;text-transform:uppercase;font-size:8.5px}
.mv-v{color:var(--t2)}
.mv-v b{color:var(--t1);font-weight:400}
.mv-v.warn{color:var(--warn)} .mv-v.warn b{color:var(--warn)}
.mv-v.bad{color:var(--dn)} .mv-v.bad b{color:var(--dn)}

/* shortcuts overlay */
.help-h{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--t3);padding:15px 17px 10px;border-bottom:var(--hair)}
.help-grid{display:grid;grid-template-columns:auto 1fr;gap:9px 16px;padding:14px 17px;
  font-family:var(--mono);font-size:11.5px;color:var(--t2);align-items:center}
.help-grid span:nth-child(odd){display:flex;gap:4px;justify-content:flex-start}
kbd{font-family:var(--mono);font-size:10px;border:var(--hair);border-radius:4px;padding:2px 6px;
  color:var(--t1);background:var(--s2);white-space:nowrap}
.help-f{padding:11px 17px 15px;border-top:var(--hair);font-family:var(--mono);font-size:10.5px;
  color:var(--t3);line-height:1.55}

/* ============================================================
   v5 — premium polish: motion tokens · scrollbars · modal blur pop
   ============================================================ */
:root{--dur-1:110ms;--dur-2:180ms;--dur-3:260ms;--ease:cubic-bezier(.4,0,.2,1)}
@view-transition{navigation:auto}
.tbar{view-transition-name:site-top}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* styled pane scrollbars — the default chrome scrollbar is the loudest non-premium tell */
.wl-rows,.tape-rows,.spanes,.cmdk-list{scrollbar-width:thin;scrollbar-color:#26301a transparent}
.wl-rows::-webkit-scrollbar,.tape-rows::-webkit-scrollbar,.spanes::-webkit-scrollbar,.cmdk-list::-webkit-scrollbar{width:8px}
.wl-rows::-webkit-scrollbar-thumb,.tape-rows::-webkit-scrollbar-thumb,.spanes::-webkit-scrollbar-thumb,.cmdk-list::-webkit-scrollbar-thumb{background:#26301a;border-radius:8px;border:2px solid transparent;background-clip:content-box}
.wl-rows::-webkit-scrollbar-thumb:hover,.tape-rows::-webkit-scrollbar-thumb:hover{background:#3a4a26;background-clip:content-box}

/* command palette + overlays: blur backdrop, spring-adjacent pop */
.cmdk{backdrop-filter:blur(6px)}
.cmdk-box{animation:cmdk-in var(--dur-3) var(--ease)}
@keyframes cmdk-in{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
.pop{animation:cmdk-in var(--dur-2) var(--ease)}

/* number hygiene everywhere */
.px,.ch,.cid-px,.cid-ch,.legend,.qrow b,.gauge .v,.trow,.lrow .pc,.wl-row .px,.wl-row .ch{font-variant-numeric:tabular-nums}

/* watchlist age label degrades honestly */
#wlUpdated{transition:color var(--dur-2)}

/* focus reach */
.wl-row:focus-visible,.trow a:focus-visible,.chip:focus-visible{outline:2px solid var(--lime);outline-offset:-2px}

/* ============================================================
   v5.2 — futuristic HUD layer: pane brackets · glass bar ·
   spark glow · selected rail · entrance · plot vignette
   ============================================================ */
/* glass top bar */
.tbar{background:rgba(8,10,6,.72);backdrop-filter:blur(12px);border-bottom:1px solid rgba(204,255,0,.14)}

/* HUD corner brackets on every pane — the card-chassis motif, whisper-quiet */
.pane{position:relative}
.pane::before,.pane::after{content:"";position:absolute;width:16px;height:16px;pointer-events:none;z-index:4;
  border:1.5px solid rgba(204,255,0,.22)}
.pane::before{left:-1px;top:-1px;border-right:0;border-bottom:0}
.pane::after{right:-1px;bottom:-1px;border-left:0;border-top:0}

/* watchlist: selected gets a lime rail + wash; hover lifts */
.wl-row{transition:background var(--dur-1,110ms)}
.wl-row.on{position:relative;background:linear-gradient(90deg,rgba(204,255,0,.10),rgba(204,255,0,.02) 60%,transparent)}
.wl-row.on::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--lime,#CCFF00);
  box-shadow:0 0 10px rgba(204,255,0,.6)}
@media(hover:hover){.wl-row:not(.on):hover{background:rgba(204,255,0,.04)}}

/* sparkline glow — the mini charts read as live instruments */
.sp{overflow:visible}
.sp.u{filter:drop-shadow(0 0 2.5px rgba(204,255,0,.45))}
.sp.d{filter:drop-shadow(0 0 2.5px rgba(255,92,92,.4))}

/* chart pane: soft vignette + top hairline glow so the plot sits in depth */
.plotwrap{position:relative}
.plotwrap::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  background:radial-gradient(120% 90% at 50% 40%,transparent 62%,rgba(0,0,0,.24) 100%)}
.cid{border-bottom:1px solid rgba(204,255,0,.10)}

/* chips + segments: lift on hover, lime edge on active */
@media(hover:hover){
  .chip:hover,.seg button:hover{border-color:rgba(204,255,0,.4);box-shadow:0 0 14px rgba(204,255,0,.08)}
}
.seg button.on{box-shadow:0 0 16px rgba(204,255,0,.12) inset,0 0 12px rgba(204,255,0,.10)}

/* one-time entrance — panes rise in with a 60ms stagger; killed under reduced motion */
@keyframes pane-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.term .pane{animation:pane-in .38s cubic-bezier(0,0,.2,1) backwards}
.term .pane:nth-child(1){animation-delay:.02s}
.term .pane:nth-child(2){animation-delay:.08s}
.term .pane:nth-child(3){animation-delay:.14s}
@media (prefers-reduced-motion:reduce){.term .pane{animation:none}}

/* live block pill breathes */
#blockPill{position:relative}

/* ════ v6 elevation — terminal polish: depth + micro-interactions, lime discipline intact ════ */

/* pane depth: inset top highlight; edge sharpens under the pointer */
.pane{box-shadow:0 1px 0 rgba(255,255,255,.04) inset}
.pane:hover{box-shadow:0 1px 0 rgba(255,255,255,.06) inset, 0 0 0 1px rgba(204,255,0,.07)}

/* header price: charged when it ticks (classes set by renderHeader) */
.cid-px.tick-up{text-shadow:0 0 18px rgba(204,255,0,.5)}
.cid-px.tick-dn{text-shadow:0 0 18px rgba(255,92,92,.45)}

/* every actionable chip/button: hover lift + press, 140ms token */
.tbar button,#tfSeg button,.stab button,.side2 button,#quick button,.btn{
  transition:background 140ms ease,border-color 140ms ease,color 140ms ease,transform 140ms ease,box-shadow 140ms ease}
.tbar button:hover,#tfSeg button:hover,.stab button:hover,#quick button:hover{transform:translateY(-1px)}
.tbar button:active,#tfSeg button:active,.stab button:active,.side2 button:active,#quick button:active,.btn:active{transform:scale(.96)}
#tfSeg button.on{box-shadow:0 0 14px rgba(204,255,0,.15)}

/* watchlist rows: selection rail glow refinement */
.wl-row{transition:background 140ms ease, box-shadow 140ms ease}
.wl-row.on{box-shadow:inset 2px 0 0 var(--lime)}
.wl-row:hover:not(.on){box-shadow:inset 2px 0 0 rgba(204,255,0,.35)}

/* trade pane: faint brand atmosphere in the empty depth (static, non-verbal) */
#tabTrade{position:relative}
#tabTrade::after{content:"";position:absolute;inset:auto 0 0 0;height:120px;pointer-events:none;
  background:radial-gradient(80% 100% at 50% 100%, rgba(204,255,0,.04), transparent 70%)}