/* Crypto Academy · ④ Original Neon · design system (bilingual, English-primary)

   ══ STANDING LAYOUT CONTRACT (Bobbuu, 2026-08-03. Do not delete this banner.) ══
   This dashboard must look correct AND stay usable while the window is drag-resized,
   in ALL of Bobbuu's browsers: Comet + Chrome (Chromium), Safari + DuckDuckGo mac
   (WebKit), Firefox (Gecko). Rules for every future change:
   1. FLUID ONLY: no layout may assume one fixed viewport. Use flex/grid, %, vh/vw,
      minmax() and min-width:0; never hardcode a single screen's pixel math.
   2. 1920x1080 is the OBS streaming baseline (fills edge to edge), but every build
      must also be checked at ~1440x900, ~1280x800 and one mid-drag width, in BOTH
      EN and 中, with zero overlap, clipping or text escaping its box.
   3. Engine coverage: verify Chromium directly, WebKit + Firefox via Playwright
      (npx playwright, engines already installed). Anything not machine-verified
      must be flagged to Bobbuu for an eyeball check.
   4. NO vh-SIZED BOX MAY CONTAIN FIXED-PX CONTENT (added 2026-08-05 after the
      galaxy carousel 爆框: .galaxy was 30vh while its .gsnap rows were fixed px,
      so any window shorter than ~1040px spilled rows past the card border).
      A container whose height tracks the viewport must hold only content that
      shrinks with it (fr/%/scroll); fixed-px content gets a fixed-px container.
      Every card also needs an overflow fuse so worst-case is a clean clip,
      never paint outside the border. Height checks: 1080 / 1000 / 900 / 800.
   ═══════════════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700;800&family=Manrope:wght@400;500;600;700&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#080B12;--panel:#101726;--panel2:#141C2E;--panel3:#1C2536;--line:#243149;
  --cyan:#2AF5FF;--cyanD:#22D3EE;--ice:#CDEBF3;--mag:#F23CDD;--violet:#8B6BFF;--violetLt:#B49BFF;--amber:#EAC36A;--ink:#041018;
  --text:#EAF2F8;--muted:#8296AE;--faint:#556780;
  --grad:linear-gradient(135deg,#2AF5FF,#8B6BFF 55%,#F23CDD);
  --disp:'Sora',system-ui,sans-serif;--body:'Manrope',system-ui,sans-serif;
}
html,body{min-height:100%}
body{background:radial-gradient(1100px 560px at 84% -10%,#0a2733 0,transparent 56%),radial-gradient(900px 500px at -8% 108%,#1a0a2e 0,transparent 54%),var(--bg);color:var(--text);font-family:var(--body);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.upT{color:var(--cyan)}.dnT{color:var(--mag)}.amT{color:var(--amber)}

/* ---------- App shell ---------- */
/* middle track is minmax(0,1fr), NOT 1fr: a bare 1fr's implied min is the content's
   min-width, so at 1100 to 1240px viewports wide content inside .main used to push
   the whole grid past the viewport and shove the rail off screen (rule 16 fix) */
.app{display:grid;grid-template-columns:240px minmax(0,1fr) 372px;grid-template-rows:54px minmax(calc(100vh - 54px),auto);min-height:100vh;max-width:2100px;margin:0 auto}
/* rule 17 skeleton: nav locked top, .sidemid scrolls, Telegram locked bottom-left; the
   whole column is sticky so long pages never scroll it away */
.side{grid-row:1/3;grid-column:1;border-right:1px solid var(--line);padding:18px 14px 16px;display:flex;flex-direction:column;gap:6px;position:sticky;top:0;height:100vh;overflow:hidden}
.logo{display:flex;align-items:center;gap:10px;padding:4px 6px 18px}
.logo .mk{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--cyan),var(--cyanD));display:flex;align-items:center;justify-content:center;color:var(--ink);font-family:var(--disp);font-weight:800;box-shadow:0 0 18px #2af5ff44}
.logo .tx{font-family:var(--disp);font-weight:800;font-size:14px;line-height:1.05}
.logo .tx span{color:var(--muted);font-weight:600;font-size:10.5px}
.nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;color:var(--muted);font-weight:600}
.nav a svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9;flex:none}
.nav a .en{font-family:var(--disp);font-size:13.5px;line-height:1.15}
.nav a .zh{font-size:10px;opacity:.7}
.nav a.on{background:var(--violet);color:#fff;box-shadow:0 8px 22px #8b6bff55}
.nav a:not(.on):hover{background:var(--panel2);color:var(--text);cursor:pointer}
.side .grow{flex:1}
.sidemid{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:6px;margin-bottom:10px;padding-right:8px;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:rgba(139,107,255,.35) transparent}
.comm{background:var(--panel2);border:1px solid var(--line);border-radius:16px;padding:14px;text-align:center}
.comm .qr{width:72px;height:72px;margin:0 auto 10px;border-radius:10px;background:repeating-linear-gradient(0deg,#0000 0 3px,#e9edf2 3px 6px),repeating-linear-gradient(90deg,#0b0c10 0 3px,#0000 3px 6px);background-color:#e9edf2;opacity:.9}
.comm .cta{background:var(--cyan);color:var(--ink);font-family:var(--disp);font-weight:800;font-size:12px;border-radius:999px;padding:8px 0;margin-bottom:6px;box-shadow:0 0 16px #2af5ff33}
.comm small{color:var(--muted);font-size:10.5px}

.top{grid-column:2/4;grid-row:1;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:0 22px}
.crumbs{display:inline-flex;gap:6px;align-items:center;color:var(--muted);font-size:12.5px;font-weight:600}
.crumbs .cur{color:var(--text)}
.pill{display:inline-flex;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:4px}
.pill a{font-family:var(--disp);font-weight:600;font-size:12px;color:var(--muted);padding:8px 15px;border-radius:999px;cursor:pointer}
.pill a.on{background:var(--cyan);color:var(--ink);box-shadow:0 0 16px #2af5ff44}
.top .right{margin-left:auto;display:flex;align-items:center;gap:14px}
.top .hi{text-align:right;font-size:12px;line-height:1.2}.top .hi b{font-family:var(--disp)}.top .hi small{color:var(--muted);font-size:11px}
.ic{width:38px;height:38px;border-radius:12px;background:var(--panel2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;position:relative}
.ic svg{width:18px;height:18px;stroke:var(--text);fill:none;stroke-width:1.8}
.ic .dot{position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.av{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--cyan),var(--mag));border:2px solid var(--violetLt)}

.main{grid-column:2;grid-row:2;padding:16px 18px;display:flex;flex-direction:column;gap:12px;min-height:100%}
.rail{grid-column:3;grid-row:2;border-left:1px solid var(--line);padding:18px 16px;display:flex;flex-direction:column;gap:11px;height:calc(100vh - 54px);position:sticky;top:54px;overflow:hidden}
.rail .rh{display:flex;align-items:center;justify-content:space-between}
.rail .rh h3{font-family:var(--disp);font-weight:700;font-size:14px}
.rail .rh a{font-size:11.5px;color:var(--violetLt);cursor:pointer}

/* ---------- Common bits ---------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:18px}
.pagehd{display:flex;align-items:baseline;gap:12px}
.pagehd .h{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:800;font-size:20px}
.pagehd .h::before{content:"";width:10px;height:10px;background:var(--cyan);box-shadow:0 0 12px var(--cyan);transform:rotate(45deg)}
.pagehd .sub{color:var(--muted);font-size:12.5px}
.pagehd .zh{color:var(--faint);font-size:12px;font-weight:600}
.ch{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--muted);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.ch .zh{color:var(--faint);font-size:11px;font-weight:600}
.ch .n{color:var(--faint);font-size:11px;font-weight:600}
.foot{color:var(--faint);font-size:11px;text-align:center;padding:6px}

.ribbon{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:10px;overflow:hidden}
.rtile{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:10px 12px;min-width:120px}
.rtile .k{font-size:10.5px;color:var(--muted);font-weight:600}
.rtile .v{font-family:var(--disp);font-weight:700;font-size:15px;margin-top:3px}
.rtile .c{font-size:11px;font-weight:700;margin-top:2px}
.rtile.x{position:relative;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.rtile.x::after{content:"ⓘ";position:absolute;top:5px;right:7px;font-size:8px;color:var(--ice);opacity:.5}
.rtile.x:hover{border-color:var(--cyan);box-shadow:0 0 16px #2af5ff44}
.riblabel{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:1px 2px -3px}

/* ---------- Galaxy hero (Today) ---------- */
.galaxy{position:relative;display:flex;height:324px;border-radius:22px;overflow:hidden;border:1px solid var(--line);background:#05070e}
.main-today{gap:10px}
.gleft{position:relative;flex:1;min-width:0;overflow:hidden;background:radial-gradient(ellipse 64% 64% at 44% 50%,#0c1a30 0%,#070d1c 48%,#04060d 100%)}
.neb{position:absolute;border-radius:50%;filter:blur(46px);mix-blend-mode:screen;pointer-events:none}
.neb1{width:540px;height:340px;left:14%;top:10%;background:radial-gradient(closest-side,#1f7bffaa,transparent);opacity:.5;animation:drift1 46s ease-in-out infinite}
.neb2{width:470px;height:320px;right:8%;bottom:4%;background:radial-gradient(closest-side,#b45cffaa,transparent);opacity:.46;animation:drift2 54s ease-in-out infinite}
.neb3{width:360px;height:260px;left:45%;top:42%;background:radial-gradient(closest-side,#2af5ff70,transparent);opacity:.4;animation:drift1 40s ease-in-out infinite reverse}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(28px,-16px) scale(1.12)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1.05)}50%{transform:translate(-24px,18px) scale(.92)}}
.coreglow{position:absolute;top:50%;left:50%;width:360px;height:360px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,#2af5ff3a,#8b6bff16,transparent);filter:blur(4px);animation:gpulse 5.5s ease-in-out infinite;pointer-events:none}
@keyframes gpulse{0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}
.field{position:absolute;top:50%;left:50%;border-radius:50%;background:transparent}
.far{width:1.5px;height:1.5px;opacity:.92;animation:gspin 240s linear infinite,gtw 7s ease-in-out infinite}
.near{width:2px;height:2px;animation:gspin 165s linear infinite reverse,gtw2 5s ease-in-out infinite .4s}
@keyframes gspin{to{transform:rotate(360deg)}}
@keyframes gtw{0%,100%{opacity:.55}50%{opacity:.95}}
@keyframes gtw2{0%,100%{opacity:.7}50%{opacity:1}}
.shoot{position:absolute;width:120px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#eafcff);opacity:0;filter:drop-shadow(0 0 4px #eafcff)}
.shoot.a{top:18%;left:-140px;animation:gshoot 13s linear infinite 3s}
.shoot.b{top:66%;left:-140px;animation:gshoot 16s linear infinite 9s}
@keyframes gshoot{0%{opacity:0;transform:translate(0,0) rotate(19deg)}4%{opacity:.85}15%{opacity:.85}22%{opacity:0;transform:translate(900px,300px) rotate(19deg)}100%{opacity:0;transform:translate(900px,300px) rotate(19deg)}}
.gcore{position:absolute;top:53%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:7;width:100%}
.gcore .lbl{font-family:var(--disp);font-size:10.5px;letter-spacing:2.5px;color:#9fb6c9}
.gcore .num{font-family:var(--disp);font-weight:800;font-size:38px;letter-spacing:-1.5px;line-height:1;margin:7px 0 4px;color:#EAFBFF;text-shadow:0 0 24px #2af5ff88,0 0 54px #2af5ff44}
.gcore .chg{font-family:var(--disp);font-weight:700;font-size:14px;color:var(--mag)}
.orbit{position:absolute;top:50%;left:50%;width:0;height:0;z-index:6;animation:gorbit 50s linear infinite}
.slot{position:absolute;left:0;top:0}
.m{position:absolute;left:0;top:0;animation:gorbitR 50s linear infinite;background:#0a1626cc;border:1px solid #ffffff1f;border-radius:12px;padding:6px 11px;text-align:center;backdrop-filter:blur(6px);box-shadow:0 0 18px #2af5ff1a;white-space:nowrap}
.m .k{font-family:var(--disp);font-size:9px;letter-spacing:.5px;color:var(--muted)}
.m .v{font-family:var(--disp);font-weight:700;font-size:12.5px;margin-top:2px}
@keyframes gorbit{to{transform:rotate(360deg)}}
@keyframes gorbitR{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(-360deg)}}
/* ticker panel inside galaxy */
.gsnap{position:relative;flex:0 0 340px;margin:16px 16px 16px 6px;z-index:8;background:rgba(9,16,30,.66);backdrop-filter:blur(12px);border:1px solid #ffffff22;border-radius:16px;padding:14px 16px 11px;display:flex;flex-direction:column;box-shadow:0 10px 34px #00000066;overflow:hidden}
.gsh{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:4px}
.gsh .gt{font-family:var(--disp);font-weight:800;font-size:13px;letter-spacing:2px}
.gsh .gsrc{color:var(--faint);font-size:10px}
.tkrows{flex:1;display:flex;flex-direction:column;justify-content:space-between}
.tk{display:grid;grid-template-columns:32px 1fr 58px auto;gap:9px;align-items:center;padding:7px 0}
.tk+.tk{border-top:1px solid #ffffff0e}
.tk .ico{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:800;font-size:8px;color:#fff;box-shadow:inset 0 0 0 1px #ffffff22}
.tk .nm{min-width:0}
.tk .nm .s{font-family:var(--disp);font-weight:700;font-size:13px;line-height:1.1}
.tk .nm .f{color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk .spark{width:58px;height:28px}
.tk .pr{text-align:right;white-space:nowrap}
.tk .pr .p{font-family:var(--disp);font-weight:700;font-size:13px}
.tk .pr .c{font-family:var(--disp);font-weight:700;font-size:11px;display:block;margin-top:1px}
.up-c{color:var(--cyan)}.dn-c{color:var(--mag)}
.dots{display:flex;gap:6px;justify-content:center;margin-top:8px}
.dots i{width:7px;height:7px;border-radius:50%;background:#ffffff2a}
.dots i.on{width:18px;border-radius:999px;background:var(--cyan);box-shadow:0 0 10px #2af5ff77}

/* stories / snapshot (Today) */
.midrow{display:grid;grid-template-columns:1fr;gap:16px}
.story{padding:13px 0;border-bottom:1px solid var(--line)}.story:last-child{border-bottom:none;padding-bottom:0}.story:first-of-type{padding-top:0}
.story .row1{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.imp{font-family:var(--disp);font-weight:700;font-size:10px;padding:3px 9px;border-radius:999px}
.imp.hi{background:var(--cyan);color:var(--ink)}.imp.mid{background:#8b6bff22;color:var(--violetLt);border:1px solid #8b6bff55}
.story .no{font-family:var(--disp);font-weight:800;color:var(--faint);font-size:13px}
.tag{font-size:10px;font-weight:600;color:var(--violetLt);background:#8b6bff1f;border:1px solid #8b6bff44;border-radius:999px;padding:2px 8px}
.story .tags{display:flex;gap:6px}
.story h2{font-family:var(--disp);font-weight:700;font-size:19px;line-height:1.25;letter-spacing:-.3px}
.story .zh{color:var(--muted);font-size:12px;margin-top:3px}
.claude{display:flex;gap:9px;margin-top:11px;background:#8b6bff14;border-left:3px solid var(--violet);border-radius:0 10px 10px 0;padding:9px 12px}
.claude .b{font-family:var(--disp);font-weight:700;font-size:11px;color:var(--violetLt);white-space:nowrap}
.claude .t{font-size:12px;color:var(--text);line-height:1.5}

/* placeholder note for pages being built */
.stub{border:1px dashed var(--line);border-radius:16px;padding:26px;text-align:center;color:var(--muted);font-size:13px}
.stub b{color:var(--cyan);font-family:var(--disp)}

/* --- fit-to-screen + single-language + declutter overrides --- */
.nav{margin-top:2px}
.nav a .lb{font-family:var(--disp);font-size:14px}
.top .who{color:var(--muted);font-size:12px;font-family:var(--disp);white-space:nowrap}
.pill.lang a{padding:6px 12px;font-size:12px}
.pagehd .h{font-size:18px}
.stories{flex:1 0 auto;display:flex;flex-direction:column;padding:12px 16px}
.stories .ch{margin-bottom:6px}
.storywrap{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:2px}
.story{padding:5px 0;border-bottom:1px solid var(--line)}.story:last-child{border-bottom:none}
.story h2{font-size:14.5px;line-height:1.18}
.sgrid .story{padding:4px 0}
.sgrid .story h2{font-size:13px;line-height:1.22}
.sgrid .claude .t{font-size:11.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sgrid .claude{margin-top:5px;padding:6px 11px}
[data-lang="zh"] .sgrid .story{padding:3px 0}
[data-lang="zh"] .sgrid .story h2{line-height:1.16}
[data-lang="zh"] .sgrid .claude .t{line-height:1.38}
[data-lang="zh"] .sgrid .claude{margin-top:4px}
.claude{margin-top:5px;padding:7px 11px}
.claude .t{font-size:11.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.foot{padding:2px 6px}
.rail{gap:10px}
.ncard{padding:13px}
.nrow{display:flex;gap:10px;align-items:flex-start}
.ic.small{width:36px;height:36px;border-radius:11px}
.ic.small svg{width:18px;height:18px}
.ntitle{font-weight:700;font-size:12.5px;line-height:1.25}
.ntags{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap}
.tag.g{color:var(--ink);background:var(--cyan);border-color:var(--cyan)}
.nbar{height:6px;border-radius:999px;background:var(--panel3);margin-top:9px;overflow:hidden}
.nbar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--violet));border-radius:999px}
.nmeta{display:flex;align-items:center;justify-content:space-between;margin-top:9px}
.nmeta small{color:var(--muted);font-size:11px}
.arrowbtn{width:32px;height:32px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;flex:none}
.arrowbtn svg{width:15px;height:15px;stroke:#0c0d11;fill:none;stroke-width:2.2}
.live{background:var(--grad);border:none;padding:13px}
.live .lt{color:#04121a;font-family:var(--disp);font-weight:800;font-size:13px}
.live .ls{color:#08202a;font-size:11.5px;margin-top:5px;font-weight:600}

/* ---------- Markets page ---------- */
.kpis{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:12px}
.kpi{position:relative;overflow:hidden;padding:14px 16px}
.kpi .lab{font-size:11.5px;color:var(--muted);font-weight:600}
.kpi .big{font-family:var(--disp);font-weight:800;font-size:27px;letter-spacing:-1px;margin-top:6px;line-height:1}
.kpi .sub{margin-top:8px;font-size:11.5px;color:var(--muted)}
.kpi .chg{display:inline-flex;align-items:center;gap:4px;font-family:var(--disp);font-weight:700;font-size:12px;padding:2px 8px;border-radius:999px;margin-top:8px}
.hero{background:linear-gradient(140deg,#3BF6FF,#1FCBE0);color:var(--ink);border:none;box-shadow:0 14px 44px rgba(42,245,255,.22)}
.hero .lab{color:#053a45;font-weight:700}
.hero .big{font-size:34px;color:var(--ink)}
.hero .pillchg{display:inline-block;background:var(--ink);color:var(--cyan);font-family:var(--disp);font-weight:700;font-size:11.5px;border-radius:999px;padding:4px 11px;margin-top:9px}
.hero .spark{position:absolute;right:-6px;bottom:-8px;width:140px;opacity:.9}
.kpi .donut{position:absolute;right:12px;top:14px}
.chartcard{flex:1;min-height:0;display:flex;flex-direction:column;padding:14px 16px}
.chartcard .hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.chartcard h3{font-family:var(--disp);font-weight:700;font-size:14.5px}
.seg{display:inline-flex;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:3px}
.seg a{font-size:11px;font-weight:600;color:var(--muted);padding:5px 12px;border-radius:999px;cursor:pointer}
.seg a.on{background:var(--violet);color:#fff}
.legend{display:flex;gap:16px;font-size:11.5px;color:var(--muted);margin:2px 0 4px}
.legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle}
.chartcard .line{flex:1;min-height:0;width:100%}
.chartcard .axis{display:flex;justify-content:space-between;font-size:10.5px;color:var(--faint);margin-top:4px}
.main-markets{gap:8px}
.main-markets .kpi{padding:10px 14px 12px}
.main-markets .kpi.hero{padding:12px 16px}
.main-markets .kpi .big{font-size:24px;margin-top:4px}
.main-markets .kpi .sub{margin-top:5px}
.main-markets .kpi .chg{margin-top:5px}
.main-markets .rtile{padding:8px 12px}
.main-markets .chartcard{max-height:340px}
.brow{display:grid;grid-template-columns:1.35fr 1fr;gap:12px}
.lead,.senti{padding:14px 16px}
.lead h3,.senti h3{font-family:var(--disp);font-weight:700;font-size:14.5px;margin-bottom:6px}
.lrow{display:grid;grid-template-columns:22px 30px 1fr auto auto;align-items:center;gap:10px;padding:5px 8px;border-radius:12px}
.lrow .rk{font-family:var(--disp);font-weight:800;font-size:13px;color:var(--muted);text-align:center}
.lrow.top .rk{color:var(--cyan)}
.lrow .coin{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:800;font-size:10px;color:#03121a;border:2px solid var(--cyan)}
.lrow .nm{font-weight:700;font-size:12.5px}.lrow .nm small{display:block;color:var(--muted);font-weight:500;font-size:10px}
.lrow .pc{font-family:var(--disp);font-weight:700;font-size:12.5px}
.lrow.hl{background:linear-gradient(90deg,#8b6bff26,transparent);box-shadow:inset 2px 0 0 var(--violet)}
.lrow .spark{width:52px;height:20px}
.senti{display:flex;flex-direction:column}
.gauge-wrap{display:flex;flex-direction:column;align-items:center;gap:2px}
.gnum{font-family:var(--disp);font-weight:800;font-size:22px}
.scap{color:var(--muted);font-size:11.5px;text-align:center}
.senti .track{height:11px;border-radius:999px;background:linear-gradient(90deg,#F23CDD,#F5B54A,#2AF5FF);position:relative;margin:14px 6px 8px}
.senti .knob{position:absolute;top:50%;left:72%;transform:translate(-50%,-50%);width:24px;height:24px;border-radius:50%;background:var(--cyan);border:3px solid #080B12;box-shadow:0 4px 12px #0008,0 0 14px #2af5ff66;display:flex;align-items:center;justify-content:center}
.senti .knob svg{width:13px;height:13px;stroke:#03121a;fill:none;stroke-width:2}
.senti .lb{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}

/* ---------- Macro page ---------- */
.cols{flex:1;min-height:0;display:grid;grid-template-columns:0.9fr 1.2fr;gap:14px}
.feedcard,.cascade{display:flex;flex-direction:column;min-height:0;padding:14px 16px}
.feedwrap{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:space-between;gap:6px;overflow:hidden}
.evt{display:flex;gap:10px;padding:7px 10px;border-radius:12px;border:1px solid var(--line);background:var(--panel2)}
.evt.on{border-color:var(--violet);background:linear-gradient(90deg,#8b6bff1f,var(--panel2));box-shadow:inset 3px 0 0 var(--violet)}
.evt .eico{width:34px;height:34px;border-radius:11px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--panel3)}
.evt .eico svg{width:18px;height:18px;stroke:var(--cyan);fill:none;stroke-width:1.8}
.evt.on .eico svg{stroke:var(--violetLt)}
.evt .ebody{min-width:0}
.evt .et{font-family:var(--disp);font-weight:700;font-size:13px;line-height:1.25}
.evt .eo{color:var(--muted);font-size:11.5px;margin-top:2px}
.evt .em{display:flex;gap:7px;align-items:center;margin-top:4px;flex-wrap:wrap}
.evt .tm{color:var(--faint);font-size:10.5px;margin-left:auto}
.evt.clk{cursor:pointer;transition:border-color .15s, transform .15s}
.evt.clk:hover{border-color:var(--cyan);transform:translateY(-1px)}
.evt .eo{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.tag.techo{color:var(--cyan);background:#2af5ff14;border-color:#2af5ff55}
.feedwait{flex:1;display:flex;align-items:center;justify-content:center;color:var(--faint);font-size:12px;padding:30px 0;text-align:center}

/* ---- institutions vs retail positioning card (macro page left column) ---- */
.lstack{display:flex;flex-direction:column;gap:14px;min-height:0;min-width:0}
.lstack .feedcard{flex:1;min-height:0}
.poscard{padding:11px 16px 12px;flex:none}
.ptiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:8px}
.ptile{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:8px 10px;cursor:pointer;transition:border-color .15s;min-width:0}
.ptile:hover{border-color:var(--cyan)}
.ptile .pl{font-size:9px;color:var(--faint);letter-spacing:.06em;display:flex;justify-content:space-between;gap:4px;white-space:nowrap;overflow:hidden}
.ptile .pl>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
.ptile .pl>span:last-child{flex:none}
.lockp .ldot.brk{background:var(--mag);box-shadow:0 0 8px var(--mag)}
.ptile .pv{font-family:var(--disp);font-weight:800;font-size:13.5px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptile .pd{font-size:9px;margin-top:2px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pv.cyan{color:var(--cyan)}.pv.mag{color:var(--mag)}.pv.vio{color:var(--violetLt)}
@media (max-width:700px){.ptiles{grid-template-columns:1fr}}

/* ---- transmission tree (live engine, 2026-08-03): fluid flex nodes, no fixed-canvas
   SVG, so the tree reflows at any window size per working-agreement rule 16 ---- */
.trbody{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:6px}
.trconv{display:flex;align-items:center;gap:0;width:100%;min-height:0}
.trforces{flex:1.3;display:flex;flex-direction:column;gap:9px;justify-content:center;min-width:0}
.trf{display:flex;align-items:center;min-width:0}
.trf .trnode{flex:1}
.trnode{background:var(--panel2);border:1px solid var(--line);border-radius:13px;padding:10px 12px;min-width:0}
.trnode.tu{border-color:#2af5ff55}.trnode.td{border-color:#f23cdd55}
.trl{font-family:var(--disp);font-weight:700;font-size:12.5px;line-height:1.3}
.trw{color:var(--muted);font-size:10.5px;margin-top:3px;line-height:1.5}
.trm{display:flex;gap:7px;align-items:center;margin-top:6px;flex-wrap:wrap}
.pill2{font-size:9.5px;font-weight:800;padding:2px 9px;border-radius:999px;white-space:nowrap}
.pill2.pu{color:var(--cyan);background:#2af5ff12;border:1px solid #2af5ff55}
.pill2.pd{color:var(--mag);background:#f23cdd12;border:1px solid #f23cdd55}
.trsrc{color:var(--faint);font-size:9.5px}
.trflow{width:38px;height:2px;flex:none;background:repeating-linear-gradient(90deg,var(--violet) 0 6px,transparent 6px 12px);animation:trdash 1.1s linear infinite;opacity:.75;position:relative}
.trflow::after{content:'';position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left:6px solid var(--violet)}
.trflow.fu{background:repeating-linear-gradient(90deg,var(--cyan) 0 6px,transparent 6px 12px)}.trflow.fu::after{border-left-color:var(--cyan)}
.trflow.fd{background:repeating-linear-gradient(90deg,var(--mag) 0 6px,transparent 6px 12px)}.trflow.fd::after{border-left-color:var(--mag)}
@keyframes trdash{to{background-position:12px 0}}
.trmid{flex:none;width:58px;align-self:stretch;position:relative}
.trmid svg{position:absolute;inset:0;width:100%;height:100%}
.trcurve{fill:none;stroke-width:1.6;opacity:.55;filter:drop-shadow(0 0 3px currentColor)}
.trcurve.fu{stroke:var(--cyan)}
.trcurve.fd{stroke:var(--mag)}
.trcwrap{flex:1;display:flex;align-items:center;min-width:0}
.trc{flex:1;background:var(--panel2);border:1px solid var(--violet);border-radius:15px;padding:13px 15px;box-shadow:0 0 22px #8b6bff22;min-width:0}
.trc.cu{border-color:#2af5ff88;box-shadow:0 0 22px #2af5ff22}
.trc.cd{border-color:#f23cdd88;box-shadow:0 0 22px #f23cdd22}
.trcl{font-family:var(--disp);font-weight:800;font-size:14px;line-height:1.3}
.trc.cu .trcl{color:var(--cyan)}.trc.cd .trcl{color:var(--mag)}.trc.cm .trcl{color:var(--violetLt)}
.trmeter{height:8px;border-radius:999px;background:linear-gradient(90deg,#f23cdd77,#8b6bff55,#2af5ff77);margin:9px 0 4px;position:relative}
.trmeter i{position:absolute;top:-3px;width:3px;height:14px;background:#fff;border-radius:2px;box-shadow:0 0 8px #fff;transform:translateX(-50%)}
.trmlab{display:flex;justify-content:space-between;font-size:9px;color:var(--faint)}
.trcnote{color:var(--muted);font-size:10.5px;margin-top:7px;line-height:1.55}
.trwild{font-size:10.5px;color:var(--violetLt);padding:2px 2px 0}
.trdeep{display:flex;align-items:stretch;width:100%;min-height:0}
.trdeep .trnode,.trdeep .trc{flex:1;display:flex;flex-direction:column;justify-content:center}
.trdeep .trflow{align-self:center}
.tonite{display:flex;gap:10px;align-items:flex-start;margin-top:9px;padding:8px 12px;border:1px solid #ffd16644;background:#ffd1660d;border-radius:12px;flex-wrap:wrap}
.tonite .tb{font-family:var(--disp);font-size:10px;font-weight:800;letter-spacing:.14em;color:#ffd166;padding-top:2px;white-space:nowrap}
.tonite .tt2{font-size:11.5px;font-weight:700;min-width:0}
.tonite .scens{display:flex;gap:8px;width:100%}
.scen{flex:1;font-size:10.5px;line-height:1.5;padding:7px 9px;border-radius:9px;color:var(--muted);min-width:0}
.scen b{display:block;font-size:9.5px;margin-bottom:2px}
.scen.hot{border:1px solid #f23cdd44;background:#f23cdd0a}.scen.hot b{color:var(--mag)}
.scen.cool{border:1px solid #2af5ff44;background:#2af5ff0a}.scen.cool b{color:var(--cyan)}
/* app grid keeps side(240)+rail(372) until 1080, so at 1100 to 1240 viewport the
   main column is only ~490 to 630px: the macro page must go single column there
   and the tree goes vertical a bit earlier (rule 16 mid-drag widths) */
@media (max-width:1240px){
  .main-macro .cols{grid-template-columns:1fr}
}
@media (max-width:1280px){
  .trconv{flex-direction:column;align-items:stretch;gap:8px}
  .trf .trflow{display:none}
  .trmid{display:none}
  .trcwrap{width:100%}
  .trdeep{flex-direction:column;gap:8px}
  .trdeep .trflow{transform:rotate(90deg);margin:2px auto}
  .tonite .scens{flex-direction:column}
}
.cascade .ctree{flex:1;min-height:0;width:100%}
.cnode{fill:#0a1626;stroke:var(--cyan);stroke-width:1.5;filter:drop-shadow(0 0 6px #2af5ff44)}
.cnode.evtn{stroke:var(--violet);filter:drop-shadow(0 0 6px #8b6bff55)}
.cnode.btcn{stroke:var(--mag);filter:drop-shadow(0 0 7px #f23cdd55)}
.cnl{fill:var(--text);font-family:var(--disp);font-weight:700;font-size:12px}
.cns{fill:var(--muted);font-family:var(--body);font-size:9.5px}
.cel{fill:var(--muted);font-family:var(--body);font-size:9px}
.cpath{fill:none;stroke-width:2.4;stroke-dasharray:7 9;animation:cflow 1s linear infinite}
@keyframes cflow{to{stroke-dashoffset:-32}}
.c-cy{stroke:var(--cyan)}.c-mg{stroke:var(--mag)}
.btcglow{animation:bpulse 2.4s ease-in-out infinite}
@keyframes bpulse{0%,100%{opacity:.85}50%{opacity:1}}
.mxp{display:flex;gap:10px;margin-top:10px;background:#8b6bff14;border-left:3px solid var(--violet);border-radius:0 12px 12px 0;padding:10px 13px}
.mxp .b{font-family:var(--disp);font-weight:700;font-size:11px;color:var(--violetLt);white-space:nowrap}
.mxp .tt{font-size:12px;color:var(--text);line-height:1.5}
.concl{align-self:flex-start;margin-top:10px;background:#f23cdd14;border:1px solid #f23cdd44;border-radius:12px;padding:7px 13px;font-family:var(--disp);font-weight:700;font-size:12px;color:var(--mag)}
.cal{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:4px}
.cev{display:flex;gap:11px;align-items:center;padding:9px 12px;border-bottom:1px solid #ffffff0c}
.cev:last-child{border-bottom:none}
.cev .dt{font-family:var(--disp);font-weight:700;font-size:11px;color:var(--cyan);width:78px;flex:none;line-height:1.2}
.cev .cn{flex:1;min-width:0}.cev .cn .t{font-weight:700;font-size:12.5px}.cev .cn .s{color:var(--muted);font-size:10.5px;margin-top:1px}
.dotimp{width:8px;height:8px;border-radius:50%;flex:none}
.di-hi{background:var(--mag);box-shadow:0 0 8px var(--mag)}.di-mid{background:var(--amber)}.di-lo{background:var(--faint)}

/* ---------- On-Chain page ---------- */
.main-onchain .cols{grid-template-columns:1.15fr 0.85fr}
.leg{display:flex;gap:14px;font-size:11px;color:var(--muted);margin-bottom:4px;flex-wrap:wrap}
.leg i{display:inline-block;width:16px;height:3px;border-radius:2px;margin-right:5px;vertical-align:middle}
.net{display:flex;flex-direction:column;padding:14px 16px}
.net .wnet{flex:1;min-height:0;width:100%}
/* ---- whale starmap (template B, 2026-08-03): fluid div planets + SMIL comet SVG ---- */
.whgal{flex:1;min-height:0;position:relative;border-radius:14px;background:radial-gradient(60% 55% at 50% 50%,rgba(139,107,255,.08),transparent 75%);overflow:hidden}
.cometsvg{position:absolute;inset:0;width:100%;height:100%}
.wplanet{position:absolute;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid;padding:6px;min-width:0;z-index:2}
.wplanet .nm{font-family:var(--disp);font-weight:800;font-size:11px;line-height:1.2}
.wplanet .val{font-family:var(--disp);font-size:9.5px;opacity:.9;margin-top:2px}
.wplanet.pin{border-color:rgba(42,245,255,.55);background:radial-gradient(circle at 35% 30%,rgba(42,245,255,.18),rgba(13,20,40,.92) 62%);box-shadow:0 0 26px rgba(42,245,255,.2);color:var(--cyan)}
.wplanet.pout{border-color:rgba(242,60,221,.55);background:radial-gradient(circle at 35% 30%,rgba(242,60,221,.16),rgba(13,20,40,.92) 62%);box-shadow:0 0 24px rgba(242,60,221,.2);color:var(--mag)}
.wplanet.wp-whale{width:104px;height:104px;left:8%;top:20%;border-color:rgba(139,107,255,.6);background:radial-gradient(circle at 35% 30%,rgba(139,107,255,.22),rgba(13,20,40,.92) 62%);box-shadow:0 0 28px rgba(139,107,255,.24);color:var(--violetLt);animation:whbreathe 3.2s ease-in-out infinite}
.wplanet.wp-unk{width:76px;height:76px;left:14%;top:60%;border-color:rgba(139,107,255,.4);background:radial-gradient(circle at 35% 30%,rgba(139,107,255,.12),rgba(13,20,40,.92) 62%);color:var(--violetLt)}
@keyframes whbreathe{50%{box-shadow:0 0 44px rgba(139,107,255,.42)}}
.whcap{position:absolute;font-size:9.5px;color:var(--muted);letter-spacing:.05em;z-index:2;background:rgba(7,10,20,.55);padding:2px 8px;border-radius:999px;border:1px solid rgba(139,107,255,.18)}
.whsince{font-size:9.5px;color:var(--faint);margin-top:6px;text-align:right}
.weekline{display:flex;align-items:center;gap:10px;padding:7px 14px;border:1px solid rgba(42,245,255,.35);background:rgba(42,245,255,.06);border-radius:12px;font-family:var(--disp);font-weight:700;font-size:12px;color:var(--cyan);flex:none}
.wldot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);flex:none;display:inline-block;animation:pulsewl 2s ease-in-out infinite}
.wldot.sm{width:6px;height:6px;margin-right:6px;vertical-align:middle}
@keyframes pulsewl{50%{opacity:.45}}
.weekline span{font-family:var(--body);font-weight:500;font-size:10.5px;color:var(--muted)}
.rh2{margin-top:4px}
.esyms2{display:flex;flex-wrap:wrap;gap:3px 10px}
.esym2{font-family:var(--disp);font-weight:700;font-size:10.5px;color:var(--muted);display:inline-flex;align-items:center;gap:4px;cursor:default}
.edot{width:6px;height:6px;border-radius:50%;display:inline-block;flex:none}
.edot.eg{background:#FFD166;box-shadow:0 0 7px #ffd166cc}
.edot.ev{background:#8B6BFF;box-shadow:0 0 6px #8b6bff88;opacity:.8}
#etipbox{position:fixed;display:none;z-index:200;background:#0d1428;border:1px solid rgba(42,245,255,.4);border-radius:10px;padding:8px 12px;font-size:11px;line-height:1.6;color:var(--text);white-space:pre;box-shadow:0 8px 24px #000c,0 0 14px #2af5ff22;pointer-events:none;font-family:var(--body)}
.earnsec{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:10px 12px;flex:none}
.earnsec .eh{font-family:var(--disp);font-size:10.5px;letter-spacing:.14em;color:var(--muted);margin-bottom:7px}
.erow{display:flex;gap:8px;align-items:flex-start;padding:3px 0;font-size:10.5px}
.erow .ewd{flex:none;width:34px;color:var(--faint);font-family:var(--disp);font-weight:700}
.erow .esyms{display:flex;flex-wrap:wrap;gap:4px;min-width:0}
.esym{font-family:var(--disp);font-weight:700;font-size:9.5px;padding:1px 7px;border-radius:999px;border:1px solid var(--line);color:var(--muted);cursor:default}
.esym.star{color:#ffd166;border-color:rgba(255,209,102,.45);background:rgba(255,209,102,.07)}
/* visible-netflow gauges */
.gaugewrap{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:8px;margin-top:6px}
.gr{display:flex;align-items:center;gap:9px;font-size:11px;min-width:0}
.gr .nm{width:66px;color:var(--faint);font-family:var(--disp);font-size:9.5px;letter-spacing:.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gr.net .nm{color:var(--text)}
.gr .track{flex:1;height:9px;border-radius:999px;background:rgba(139,107,255,.08);position:relative;overflow:hidden}
.gr .fill{position:absolute;top:0;bottom:0;border-radius:999px}
.gr .fill.in{left:50%;background:linear-gradient(90deg,rgba(42,245,255,.9),rgba(42,245,255,.3));box-shadow:0 0 9px rgba(42,245,255,.35)}
.gr .fill.out{right:50%;background:linear-gradient(270deg,rgba(242,60,221,.9),rgba(242,60,221,.3));box-shadow:0 0 9px rgba(242,60,221,.35)}
.gr .fill::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 7px,rgba(255,255,255,.14) 7px 9px);animation:whshimmer 1.2s linear infinite}
@keyframes whshimmer{to{background-position:16px 0}}
.gr .v{width:86px;text-align:right;font-family:var(--disp);font-weight:800;font-size:10.5px;white-space:nowrap}
.upc{color:var(--cyan)}.dnc{color:var(--mag)}
.whnote{font-size:9.5px;color:var(--faint);margin-top:8px}
.gr .fill.mv{left:27%;background:linear-gradient(90deg,rgba(139,107,255,.55),rgba(139,107,255,.25));box-shadow:0 0 9px rgba(139,107,255,.3)}
.ulbar{display:block;height:4px;border-radius:999px;background:rgba(139,107,255,.12);margin-top:4px;overflow:hidden;max-width:130px}
.ulbar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#8B6BFF,#B49BFF);box-shadow:0 0 6px #8b6bff66}
.ulbar i.warm{background:linear-gradient(90deg,#EAC36A,#FFD166);box-shadow:0 0 6px #ffd16688}
.ulbar i.hot{background:linear-gradient(90deg,#F23CDD,#ff7ae9);box-shadow:0 0 8px #f23cdd99}

/* ---- template C circuit board (2026-08-03): HTML chips + stretchy SVG pulse lanes ---- */
.whpcb{flex:1;min-height:0;position:relative;overflow:hidden;border-radius:14px}
.pcbsvg{position:absolute;inset:0;width:100%;height:100%}
/* rule: EVERY pair keeps a visible line at all times (his order); pulse rides on top */
.wtrace{fill:none;stroke-width:2;opacity:.3}
.wtrace.wtc4{opacity:.42;stroke-width:2.6}
.wpulse{fill:none;stroke-linecap:round;stroke-dasharray:46 574;animation:wprun linear infinite}
@keyframes wprun{to{stroke-dashoffset:-620}}
/* four-tier colour ramp: violet, cyan, magenta, GOLD (1K+ BTC whale) */
.wtc1{stroke:#B49BFF;color:#B49BFF}
.wtc2{stroke:#2AF5FF;color:#2AF5FF}
.wtc3{stroke:#F23CDD;color:#F23CDD}
.wtc4{stroke:#FFD166;color:#FFD166}
.k-live{stroke:#ffd166;color:#ffd166}
.wtb1{border-color:#8b6bff55}.wtb2{border-color:#2af5ff55}.wtb3{border-color:#f23cdd66}
.wtb4{border-color:#ffd16677;box-shadow:0 0 16px #ffd16626}
@keyframes wland1{0%,86%{}92%{box-shadow:0 0 18px #b49bff88;border-color:#b49bffcc}100%{}}
@keyframes wland2{0%,86%{}92%{box-shadow:0 0 20px #2af5ff99;border-color:#2af5ff}100%{}}
@keyframes wland3{0%,86%{}92%{box-shadow:0 0 24px #f23cddaa;border-color:#f23cdd}100%{}}
@keyframes wland4{0%,84%{box-shadow:0 0 16px #ffd16626}91%{box-shadow:0 0 34px #ffd166dd;border-color:#ffd166}100%{box-shadow:0 0 16px #ffd16626}}
.wvia{fill:#0d1428;stroke:rgba(139,107,255,.5);stroke-width:1.2;animation:wviab linear infinite}
@keyframes wviab{0%,40%{r:4;filter:none}47%{r:6;filter:drop-shadow(0 0 6px currentColor)}54%,100%{r:4;filter:none}}
/* template D background: energy grid + soft two-colour aurora (kept clear of magenta) */
.whbgg{position:absolute;inset:0;border-radius:14px;
 background:
  radial-gradient(340px 200px at 30% 40%,rgba(42,245,255,.05),transparent 70%),
  radial-gradient(300px 180px at 75% 65%,rgba(242,60,221,.04),transparent 70%),
  repeating-linear-gradient(90deg,rgba(139,107,255,.05) 0 1px,transparent 1px 46px),
  repeating-linear-gradient(0deg,rgba(139,107,255,.05) 0 1px,transparent 1px 46px);
 animation:whgb 6s ease-in-out infinite}
@keyframes whgb{50%{opacity:.55}}
.whbga{position:absolute;inset:-30%;filter:blur(52px);opacity:.22;pointer-events:none;
 background:
  radial-gradient(40% 32% at 28% 40%,rgba(42,245,255,.2),transparent 70%),
  radial-gradient(44% 34% at 70% 62%,rgba(139,107,255,.22),transparent 70%);
 animation:whaur 13s ease-in-out infinite alternate}
@keyframes whaur{to{transform:translate(6%,8%) rotate(8deg) scale(1.12)}}
.wpulse.s1{stroke-width:2;opacity:.5}
.wpulse.s2{stroke-width:2.8;opacity:.7;filter:drop-shadow(0 0 4px currentColor)}
.wpulse.s3{stroke-width:3.6;opacity:.9;filter:drop-shadow(0 0 8px currentColor)}
.wpulse.s4{stroke-width:4.8;opacity:1;filter:drop-shadow(0 0 14px currentColor)}
.wchip{position:absolute;width:190px;max-width:23%;transform:translateY(-50%);background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:5px 9px;z-index:2;cursor:pointer;min-width:0;transition:border-color .15s}
.wchip:hover{border-color:var(--cyan)}
.wchip.l{left:4px}.wchip.r{right:4px}
.wchip .cl{font-family:var(--disp);font-weight:800;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wchip .cs{font-size:8.5px;color:var(--faint);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wchip.k-in{border-color:#2af5ff44}.wchip.k-in .cl{color:var(--cyan)}
.wchip.k-out{border-color:#f23cdd44}.wchip.k-out .cl{color:var(--mag)}
.wchip.k-mv .cl{color:var(--violetLt)}
.whamt{position:absolute;left:50%;transform:translate(-50%,-160%);font-family:var(--disp);font-weight:800;z-index:2;letter-spacing:.04em;pointer-events:none}
.whamt.a1{font-size:10px;opacity:.75}
.whamt.a2{font-size:11px;text-shadow:0 0 8px currentColor}
.whamt.a3{font-size:12.5px;text-shadow:0 0 12px currentColor}
.whamt.a4{font-size:14.5px;text-shadow:0 0 18px currentColor}
.wa.clk{cursor:pointer;transition:border-color .15s}
.wa.clk:hover{border-color:var(--cyan)}
@media(prefers-reduced-motion:reduce){.wpulse{display:none}.whbga,.whbgg{animation:none}}
.gsub{font-size:10px;color:var(--violetLt);margin-top:4px;line-height:1.5}
.tkimg{width:28px;height:28px;border-radius:50%;flex:none;background:#0d1428}
/* whale rail drama: kind-colored spine, amount-tier brightness, new-entry pop */
.wa.kb-in{border-left:3px solid var(--mag)}
.wa.kb-out{border-left:3px solid var(--cyan)}
.wa.kb-mv{border-left:3px solid #8b6bff77}
.wa.wt2{background:linear-gradient(90deg,rgba(139,107,255,.05),var(--panel))}
.wa.wt3{background:linear-gradient(90deg,rgba(139,107,255,.11),var(--panel));border-color:#8b6bff55}
.wa.wt4{background:linear-gradient(90deg,rgba(242,60,221,.13),rgba(139,107,255,.07),var(--panel));border-color:#f23cdd66;box-shadow:0 0 14px #f23cdd22}
.wa .amt.g3{text-shadow:0 0 10px currentColor}
.wa .amt.g4{font-size:14px;text-shadow:0 0 14px currentColor}
.wa.wt4 .wt{font-size:13.5px}
.wex{font-family:var(--disp);font-size:8.5px;font-weight:800;padding:1px 7px;border-radius:999px;letter-spacing:.04em}
.wex.exin{color:var(--mag);background:#f23cdd14;border:1px solid #f23cdd44}
.wex.exout{color:var(--cyan);background:#2af5ff14;border:1px solid #2af5ff44}
@keyframes wnewpop{0%{transform:translateX(14px);opacity:0;box-shadow:0 0 22px #2af5ff55}60%{transform:translateX(-2px);opacity:1}100%{transform:none}}
.wa.wnew{animation:wnewpop .6s ease-out}
/* structured teaching zones inside the metric modal (OI quadrant, funding ladder) */
.mmxtra:empty{display:none}
.qgrid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:4px 0 10px}
.qcell{border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--panel2);opacity:.55}
.qcell b{display:block;font-family:var(--disp);font-size:11px;margin-bottom:3px}
.qcell span{font-size:10.5px;color:var(--muted);line-height:1.5}
.qcell.on{opacity:1;border-color:var(--cyan);box-shadow:0 0 14px #2af5ff22}
.qcell.on b{color:var(--cyan)}
.flwho{font-family:var(--disp);font-weight:800;font-size:12px;color:var(--cyan);margin:2px 0 7px}
.fladder{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.flrow{display:flex;gap:10px;align-items:baseline;border:1px solid var(--line);border-radius:9px;padding:5px 10px;background:var(--panel2);opacity:.5}
.flrow b{font-family:var(--disp);font-size:10.5px;white-space:nowrap;min-width:110px}
.flrow span{font-size:10.5px;color:var(--muted)}
.flrow.on{opacity:1;border-color:var(--cyan);box-shadow:0 0 12px #2af5ff22}
.flrow.on b{color:var(--cyan)}

/* unconfirmed live whale entries in the rail */
.wa.unconf{border-style:dashed;border-color:rgba(255,209,102,.5);background:rgba(255,209,102,.05)}
.wa.unconf .wt{color:#ffd166}
@media(prefers-reduced-motion:reduce){.cometsvg{display:none}}
.wn{fill:#0a1626;stroke:var(--cyan);stroke-width:1.6;filter:drop-shadow(0 0 5px #2af5ff44)}
.wn.mg{stroke:var(--mag);filter:drop-shadow(0 0 5px #f23cdd44)}
.wl{fill:var(--text);font-family:var(--disp);font-weight:700;font-size:12px}
.ws{fill:var(--muted);font-family:var(--body);font-size:9.5px}
.flow{fill:none;stroke-width:2.3;stroke-dasharray:7 9;animation:flow 1s linear infinite}
@keyframes flow{to{stroke-dashoffset:-32}}
.f-cy{stroke:var(--cyan)}.f-mg{stroke:var(--mag)}
.side-stack{display:flex;flex-direction:column;gap:14px;min-height:0}
.ustack,.fstack{flex:1;min-height:0;display:flex;flex-direction:column;padding:14px 16px}
.ustack .ulwrap,.fstack .xfwrap{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-start}
.ustack .ulwrap{overflow-y:auto;padding-right:3px;scrollbar-width:thin;scrollbar-color:rgba(139,107,255,.35) transparent}
.ul{display:grid;grid-template-columns:30px 1fr auto;gap:9px;align-items:center;padding:4px 0;border-bottom:1px solid #ffffff0c;flex:none}
.ul:last-child{border-bottom:none}
.ul .tk{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:800;font-size:9px;color:#041018}
.ul .nm .s{font-family:var(--disp);font-weight:700;font-size:13px}.ul .nm .d{color:var(--muted);font-size:10.5px}
.ul .amt{text-align:right}.ul .amt .a{font-family:var(--disp);font-weight:700;font-size:13px}.ul .amt .p{font-size:10.5px;color:var(--mag);font-weight:600}
.xf{display:flex;align-items:center;gap:10px;padding:6px 0}
.xf.net{border-top:1px solid var(--line);margin-top:2px;padding-top:9px}
.xf .xn{width:74px;font-weight:700;font-size:12.5px}
.xf.net .xn{color:var(--muted)}
.xf .barwrap{flex:1;height:8px;background:var(--panel3);border-radius:999px;position:relative;overflow:hidden}
.xf .bar{position:absolute;top:0;bottom:0;border-radius:999px}
.xf .val{width:66px;text-align:right;font-family:var(--disp);font-weight:700;font-size:12px}
.wa{display:flex;gap:11px;align-items:center;padding:11px 12px;background:var(--panel);border:1px solid var(--line);border-radius:14px}
.wa .wi{width:36px;height:36px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--panel3)}
.wa .wi svg{width:18px;height:18px}
.wa .wbody{min-width:0}
.wa .wt{font-weight:700;font-size:12.5px;line-height:1.25}.wa .wsub{color:var(--muted);font-size:10.5px;margin-top:2px}
.wa .wm{margin-left:auto;text-align:right;flex:none}.wa .wm .amt{font-family:var(--disp);font-weight:700;font-size:12px}.wa .wm .tm{color:var(--faint);font-size:10px}

/* ---------- clickable orbit metric + explain modal ---------- */
.m.mc{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.m.mc::after{content:"ⓘ";position:absolute;top:2px;right:5px;font-size:8px;color:var(--ice);opacity:.55}
.m.mc:hover{border-color:var(--cyan);box-shadow:0 0 22px #2af5ff55}
.galaxy:hover .orbit,.galaxy:hover .orbit .m{animation-play-state:paused}
.mmodal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center}
.mmodal[hidden]{display:none}
.mmback{position:absolute;inset:0;background:rgba(4,7,14,.74);backdrop-filter:blur(5px)}
.mmcard{position:relative;z-index:1;width:min(460px,90vw);background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:22px 22px 20px;box-shadow:0 30px 80px #000b,0 0 46px #2af5ff22;animation:mmin .18s ease}
@keyframes mmin{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.mmx{position:absolute;top:10px;right:14px;background:none;border:none;color:var(--muted);font-size:24px;line-height:1;cursor:pointer}
.mmx:hover{color:var(--text)}
.mmhead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:13px;padding-right:22px}
.mmk{font-family:var(--disp);font-weight:800;font-size:17px}
.mmv{font-family:var(--disp);font-weight:800;font-size:20px;white-space:nowrap}
.mmbar{height:6px;border-radius:999px;background:var(--grad);opacity:.85;margin-bottom:14px}
.mmexp{font-size:13px;line-height:1.65;color:var(--text)}
.mmnote{margin-top:12px;font-size:11px;color:var(--amber)}
/* Market-read button + modal */
/* askp pulse keyframes kept: cpdotlive + freshness light use them (the ✨ dot itself
   was removed 2026-08-05, the market read now lives only in the copilot) */
@keyframes askp{0%,100%{opacity:.55}50%{opacity:1}}
.readcard{width:min(600px,92vw)}
.rdhead{margin-bottom:12px;padding-right:26px}
.rdk{font-family:var(--disp);font-weight:800;font-size:18px}
.rdbody{font-size:14px;line-height:1.7;color:var(--text);white-space:pre-wrap;max-height:60vh;overflow:auto}
.rdnote{margin-top:14px;font-size:11px;color:var(--muted)}
.rdload{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;padding:18px 0}
.rddots{display:inline-flex;gap:4px}
.rddots i{width:6px;height:6px;border-radius:50%;background:var(--cyan);animation:rdb 1s infinite ease-in-out}
.rddots i:nth-child(2){animation-delay:.15s}
.rddots i:nth-child(3){animation-delay:.3s}
@keyframes rdb{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}
/* news cards + news modal (Method B) */
.nbody{min-width:0}
.ncard.news{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.ncard.news:hover{border-color:var(--cyan);box-shadow:0 0 20px #2af5ff33}
.nt2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nsrc{color:var(--muted);font-size:10.5px;margin-top:6px}
.nsrc2{color:var(--cyanD);font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.5px;margin-bottom:9px;padding-right:22px}
.ntitle2{font-family:var(--disp);font-weight:800;font-size:18px;line-height:1.3;margin-bottom:12px}
.nsum{margin-bottom:16px}
.nlink{display:inline-flex;align-items:center;gap:6px;background:var(--cyan);color:var(--ink);font-family:var(--disp);font-weight:800;font-size:12.5px;border-radius:999px;padding:9px 16px;box-shadow:0 0 16px #2af5ff33;text-decoration:none}
.nlink:hover{filter:brightness(1.08)}

/* ---------- live data indicators ---------- */
.gcore .chg.gcup{color:#2AF5FF;text-shadow:0 0 14px #2af5ff66}
.gcore .chg.gcdn{color:var(--mag)}
@keyframes tku{0%{color:#8FF9FF;text-shadow:0 0 30px #2af5ffcc,0 0 60px #2af5ff66}}
@keyframes tkd{0%{color:#FF8FEA;text-shadow:0 0 30px #f23cddcc,0 0 60px #f23cdd66}}
.tickup{animation:tku .45s ease}
.tickdn{animation:tkd .45s ease}
/* sidebar live watchlist */
.watch{margin:18px 10px 0;padding:10px 6px 6px;border-top:1px solid var(--line)}
.wh{font-size:9.5px;font-weight:700;letter-spacing:.14em;color:var(--faint);margin:0 10px 7px}
.wrow{display:flex;align-items:baseline;gap:6px;padding:5.5px 10px;border-radius:10px;font-family:var(--disp)}
.wrow:hover{background:var(--panel2)}
.wrow .ws{font-weight:700;font-size:11.5px;color:var(--muted);width:40px}
.wrow .wp{font-weight:700;font-size:12px;color:var(--text);margin-left:auto}
.wrow .wc{font-size:10px;font-weight:700;width:44px;text-align:right}
.wrow .wrm{display:none;font-size:12px;color:var(--faint);cursor:pointer;padding:0 2px;line-height:1}
.wrow:hover .wrm{display:inline}
.wrow .wrm:hover{color:var(--mag)}
.waddrow{padding:5px 6px 0}
#wadd{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:6px 10px;font-family:var(--disp);font-size:11px;color:var(--text);outline:none}
#wadd:focus{border-color:var(--cyan);box-shadow:0 0 10px #2af5ff33}
#wadd::placeholder{color:var(--faint)}
.bnm-wait{font-size:11px;color:var(--faint);padding:4px 10px}
.tkrows{transition:opacity .2s,transform .2s}
/* spot taker-flow tape */
.sgrid{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) minmax(0,1fr);gap:14px}
/* home shell B (2026-09-29): headlines | X signals | social temperature. The tape moved
   to the Order Flow page. Below 1500px the temperature card drops under the two feeds. */
.xcard,.sentcard{display:flex;flex-direction:column;min-height:0;padding:12px 14px;position:relative}
.xcard .ch,.sentcard .ch{margin-bottom:6px;gap:8px}
.xcard .chl,.sentcard .chl{display:inline-flex;align-items:center;gap:8px;min-width:0;white-space:nowrap}
.xsrc{margin-left:auto;font-size:9.5px;color:var(--faint);font-weight:600;letter-spacing:.04em;white-space:nowrap}
.xrows{flex:1;min-height:0;overflow:hidden}
.xr{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:8px;align-items:start;padding:6px 0;border-bottom:1px solid var(--line);cursor:pointer}
.xr:last-child{border-bottom:none}
.xr:hover .xtx{color:var(--text)}
.xdot{width:8px;height:8px;border-radius:50%;margin-top:4px;display:block}
.xdot.cy{background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.xdot.am{background:var(--amber);box-shadow:0 0 8px var(--amber)}
.xdot.mg{background:var(--mag);box-shadow:0 0 8px var(--mag)}
.xb{min-width:0}
.xh{font-family:var(--disp);font-size:11px;font-weight:700;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.xh .xt{color:var(--faint);font-weight:500;font-size:10px}
.xst{font-size:9px;border-radius:5px;padding:1px 5px;font-weight:700}
.xst.xs-am{background:#3a2c0e;color:var(--amber)}.xst.xs-ok{background:#0e2a35;color:var(--cyan)}.xst.xs-brk{background:#3a0e2e;color:var(--mag)}
.xtx{font-size:10.5px;line-height:1.4;color:#c4caea;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.xe{font-size:9px;color:var(--faint);text-align:right;white-space:nowrap;display:flex;flex-direction:column;gap:1px}
.xe b{font-weight:700}
.xempty{font-size:11px;color:var(--faint);padding:10px 2px;line-height:1.5;display:flex;align-items:center;gap:6px}
.sentbody{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.sentnum{display:flex;align-items:baseline;gap:10px}
.sentnum .big{font-family:var(--disp);font-size:30px;font-weight:800;line-height:1}
.sentnum .sub{font-size:10px;color:var(--muted)}
.sgauge{height:8px;border-radius:999px;background:linear-gradient(90deg,var(--cyan),#3a2c60 50%,var(--mag));position:relative;margin:8px 0 6px}
.sgauge i{position:absolute;top:-4px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 0 12px #ffffffaa;transform:translateX(-50%);transition:left .6s}
.skv div{display:flex;justify-content:space-between;gap:8px;font-size:11px;padding:7px 0;border-bottom:1px solid var(--line)}
.skv span{color:var(--muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skv b{font-family:var(--disp);font-weight:700;white-space:nowrap}
.sloud{font-size:10px;color:var(--muted);margin-top:8px;line-height:1.5;overflow:hidden;text-overflow:ellipsis}
.shours{margin-top:auto;padding-top:8px;height:52px;display:flex;align-items:flex-end;gap:2px}
.shours i{flex:1;display:block;background:linear-gradient(180deg,var(--violet),#8b6bff33);border-radius:2px 2px 0 0;min-height:2px}
.shours .sub{font-size:10px;color:var(--faint)}
@media(max-width:1500px){.sgrid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.sentcard{grid-column:1/-1;max-height:230px}.sentcard .shours{display:none}}
.tapewrap{position:relative;border-left:1px solid var(--line)}
.tape-inner{position:absolute;top:0;right:0;bottom:0;left:16px;display:flex;flex-direction:column}
.tape-hd{font-family:var(--disp);font-weight:700;font-size:12px;display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}
.tape-hd .tex-src{font-size:9px;color:var(--faint);font-weight:600;letter-spacing:.04em}
.tape-cols{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tcol{display:flex;flex-direction:column;min-height:0}
.tcol-h{font-size:9.5px;font-weight:700;letter-spacing:.12em;margin-bottom:6px}
.tbuy .tcol-h{color:var(--cyan)}
.tsell .tcol-h{color:var(--mag)}
.trows{flex:1;min-height:0;overflow:hidden}
.trow{display:flex;gap:6px;align-items:baseline;font-family:var(--disp);font-size:10.5px;padding:2.5px 7px;border-radius:6px;animation:tin .22s ease}
@keyframes tin{0%{opacity:0;transform:translateY(-4px)}100%{opacity:1}}
.trow .tex{font-size:8.5px;width:17px;font-weight:700;opacity:.72}
.trow.tb .tex{color:var(--cyan)}
.trow.ts .tex{color:var(--mag)}
.trow.t0 .tex{opacity:.5}
.trow.t2 .tex,.trow.t3 .tex{opacity:1;font-size:9.5px;font-weight:800}
.trow.tb.t3 .tex{text-shadow:0 0 10px #2af5ff99}
.trow.ts.t3 .tex{text-shadow:0 0 10px #f23cdd99}
.trow .tpx{color:var(--muted)}
.trow .tsz{margin-left:auto;font-weight:700}
.trow.tb .tsz{color:var(--cyan)}
.trow.ts .tsz{color:var(--mag)}
.trow.t0 .tsz{opacity:.45}
.trow.t0 .tpx{color:var(--faint)}
.trow.t1 .tsz{opacity:1}
.trow.tb.t1 .tsz{text-shadow:0 0 9px #2af5ff55}
.trow.ts.t1 .tsz{text-shadow:0 0 9px #f23cdd55}
.trow.t1 .tpx{color:#9FB2C8}
.trow.t2 .tsz{font-size:11.5px;font-weight:800}
.trow.tb.t2{box-shadow:0 0 16px #2af5ff40}
.trow.ts.t2{box-shadow:0 0 16px #f23cdd40}
.trow.tb.t2 .tsz{text-shadow:0 0 12px #2af5ffaa}
.trow.ts.t2 .tsz{text-shadow:0 0 12px #f23cddaa}
.trow.t2 .tpx{color:var(--text)}
.trow.t3 .tsz{font-size:13px;font-weight:800}
.trow.tb.t3{animation:whb .8s ease;box-shadow:0 0 20px #2af5ff77}
.trow.ts.t3{animation:whs .8s ease;box-shadow:0 0 20px #f23cdd77}
.trow.tb.t3 .tsz{text-shadow:0 0 16px #2af5ff}
.trow.ts.t3 .tsz{text-shadow:0 0 16px #f23cdd}
.trow.t3 .tpx{color:var(--text)}
@keyframes whb{0%{transform:scale(1.07);box-shadow:0 0 0 2px var(--cyan),0 0 38px #2af5ffcc}65%{box-shadow:0 0 0 9px rgba(42,245,255,0),0 0 22px #2af5ff77}100%{transform:scale(1)}}
@keyframes whs{0%{transform:scale(1.07);box-shadow:0 0 0 2px var(--mag),0 0 38px #f23cddcc}65%{box-shadow:0 0 0 9px rgba(242,60,221,0),0 0 22px #f23cdd77}100%{transform:scale(1)}}
/* taker-flow pressure bars (1m / 15m) */
.press{display:flex;flex-direction:column;gap:4px;margin-bottom:9px}
.prow{display:flex;align-items:center;gap:7px;font-family:var(--disp)}
.plb{font-size:9px;font-weight:700;letter-spacing:.06em;color:var(--faint);width:22px}
.pbar{flex:1;height:5px;border-radius:99px;background:rgba(242,60,221,.32);overflow:hidden}
.pbar i{display:block;height:100%;background:var(--cyan);border-radius:99px;transition:width .6s ease;box-shadow:0 0 8px #2af5ff66}
.pdl{font-size:9.5px;font-weight:700;width:54px;text-align:right}
/* live dots, NFA badge, exchange legend, mover toast, rail pinning */
.ldot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);margin-right:6px;vertical-align:1px;animation:ldp 1.6s ease-in-out infinite}
@keyframes ldp{0%,100%{opacity:1}50%{opacity:.3}}
.ldot.dim{background:var(--violet);box-shadow:0 0 6px #8b6bff99;animation-duration:2.8s}
.nfa{display:inline-flex;align-items:center;font-family:var(--disp);font-size:9px;font-weight:800;letter-spacing:.09em;color:var(--amber);border:1px solid #eac36a55;border-radius:999px;padding:3px 9px;white-space:nowrap;animation:nfab 2.8s ease-in-out infinite}
@keyframes nfab{0%,100%{opacity:.6;box-shadow:0 0 4px #eac36a22}50%{opacity:1;box-shadow:0 0 14px #eac36a77}}
.thelp{position:relative;cursor:help;color:var(--faint);font-size:11px;margin-left:2px}
.thelp:hover{color:var(--cyan)}
.tlegend{display:none;position:absolute;top:18px;left:-60px;z-index:40;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 14px;box-shadow:0 18px 50px #000c,0 0 30px #2af5ff22;white-space:nowrap;font-size:11px;line-height:1.9;color:var(--muted)}
.tlegend b{color:var(--cyan);font-family:var(--disp);display:inline-block;width:26px}
.thelp:hover .tlegend{display:block}
.mvtoast{position:absolute;top:14px;left:14px;z-index:8;display:flex;align-items:baseline;gap:5px;font-family:var(--disp);font-size:12px;font-weight:700;color:var(--text);background:#0a0f1acc;border:1px solid var(--cyan);border-radius:999px;padding:8px 15px;box-shadow:0 0 26px #2af5ff66;backdrop-filter:blur(6px);animation:mtin .4s ease}
.mvtoast.dn{border-color:var(--mag);box-shadow:0 0 26px #f23cdd66}
.mvtoast b{color:var(--cyan)}
.mvtoast.dn b{color:var(--mag)}
.mvtoast span{color:var(--muted);font-weight:600;font-size:10.5px}
.mvtoast.out{opacity:0;transition:opacity .7s}
@keyframes mtin{0%{opacity:0;transform:translateY(-10px)}100%{opacity:1;transform:translateY(0)}}
.bnm .wrow.hot .wc{animation:hotp 2.2s ease-in-out infinite}
@keyframes hotp{0%,100%{text-shadow:none}50%{text-shadow:0 0 11px currentColor}}
.bnm-rows.bnm-flash{animation:bnf .5s ease}
@keyframes bnf{0%{opacity:.35}100%{opacity:1}}
/* rule 17 (non-negotiable, Bobbuu 2026-08-03): livestream promo pinned bottom-right on EVERY page */
.rail .card.live{margin-top:auto}
.flowcard{margin-top:0;flex:none}
.foot{margin-top:auto}
/* round-5 fix batch: snap dots reachable + clickable stories */
.gsnap .tk{padding:3px 0}
.gsnap .tk .ico{width:27px;height:27px}
.gsnap .tk .spark{height:22px}
.gsnap .gsh{margin-bottom:6px}
.gsnap .dots{position:relative;z-index:9;padding:6px 0 2px}
.gsnap .dots i{width:18px;height:7px}
.story.clk{cursor:pointer}
.story.clk:hover h2{color:var(--cyan)}
/* rail density: 5 news + totals card + promo must fit 1080 */
.rail .ncard{padding:8px 11px}
.rail .ncard .ntitle{font-size:11.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rail .ncard .nmeta{margin-top:4px}
.flowcard{padding:10px 12px}
.flowcard .fw{padding:2px 0}
.flowcard .sess{padding:4px 9px;margin-top:4px}
.flowcard .fnote{font-size:7.5px;margin-top:6px}
.rail{gap:9px}
.liqbar{min-height:20px;margin-top:8px;font-family:var(--disp);font-size:11px;font-weight:700}
.liqbar .lqL{color:var(--mag)}
.liqbar .lqS{color:var(--cyan)}
.lqflash{animation:lqf .6s ease}
@keyframes lqf{0%{transform:scale(1.05)}100%{transform:scale(1)}}
@media(max-width:1080px){.sgrid{grid-template-columns:1fr}.sentcard{grid-column:auto}}
.livedot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#2AF5FF;box-shadow:0 0 8px #2af5ff;margin-right:7px;vertical-align:middle;animation:lp 2s ease-in-out infinite}
@keyframes lp{0%,100%{opacity:.35}50%{opacity:1}}

@media(max-width:1200px){.galaxy{flex-direction:column;height:auto}.gleft{height:360px}.gsnap{flex:auto;margin:0 16px 16px}}
/* News-history · open log (Today sub-view) */
.todtoggle{margin-left:auto}
.todtoggle a{font-size:11.5px;padding:6px 13px}
.oplog{display:flex;flex-direction:column;gap:16px;flex:1;min-height:0}
.oplog-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:14px;text-align:center;padding:0 40px;line-height:1.7}
.oplog-day{display:flex;flex-direction:column}
.oplog-date{font-family:var(--disp);font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--faint);margin-bottom:8px}
.oplog-caps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.opcap{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:14px 15px;display:flex;flex-direction:column}
.opcap-hd{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding-bottom:9px;border-bottom:1px solid var(--line);margin-bottom:2px}
.opcap-mkt{font-family:var(--disp);font-weight:700;font-size:14px}
.opcap-at{font-size:11px;color:var(--muted)}
.opcap-late{font-size:9.5px;font-weight:700;letter-spacing:.05em;color:var(--amber);border:1px dashed #eac36a66;border-radius:999px;padding:2px 7px;cursor:help}
.ndeep{margin:4px 0 10px;padding:10px 13px;background:#8b6bff14;border-left:3px solid #8B6BFF;border-radius:9px}
.ndeep-h{font-family:var(--disp);font-size:9.5px;font-weight:800;letter-spacing:.12em;color:#B9A5FF;margin-bottom:5px}
.ndeep-b{font-size:13px;line-height:1.7;color:var(--text);margin:0;white-space:pre-wrap}
/* ---- LIVE CO-PILOT 直播小抄 (#/copilot): bare prompter window for the 2nd monitor.
   Big type, wide leading, one calm column. Never linked from the streamed pages. */
.app.cpmode{display:block;max-width:none;grid-template-columns:none}
.cpwrap{max-width:1060px;margin:0 auto;padding:26px 34px 70px;font-family:var(--body)}
.cphead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.cpdotlive{width:10px;height:10px;border-radius:50%;background:var(--mag);box-shadow:0 0 12px var(--mag);animation:askp 1.6s ease-in-out infinite}
.cptitle{font-family:var(--disp);font-weight:800;font-size:20px;letter-spacing:.08em}
.cpchip{font-family:var(--disp);font-size:12.5px;font-weight:700;color:var(--ice);background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:5px 12px}
.cpgrow{flex:1}
.cplang a{font-family:var(--disp);font-size:12px;font-weight:700;color:var(--muted);text-decoration:none;padding:5px 10px;border-radius:999px}
.cplang a.on{color:var(--ink);background:var(--cyan)}
.cphint{font-size:12.5px;color:var(--faint);margin-bottom:16px;line-height:1.6}
.cpcard{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:20px 26px;margin-bottom:16px}
.cpsec{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-size:11px;font-weight:800;letter-spacing:.16em;color:var(--violetLt);margin-bottom:6px}
.cpscore{font-size:11px;letter-spacing:.02em;color:var(--amber);border:1px solid #eac36a44;border-radius:999px;padding:2px 9px}
.cpstory{padding:16px 0;border-bottom:1px solid var(--line)}
.cpstory:last-child{border-bottom:none;padding-bottom:4px}
.cpsh{display:flex;gap:10px;align-items:center;font-size:11px;color:var(--muted)}
.cpno{font-family:var(--disp);font-weight:800;color:var(--cyan)}
.cpimp{font-size:10px;font-weight:700;letter-spacing:.05em;border:1px solid var(--line);border-radius:999px;padding:2px 9px;color:var(--muted)}
.cpimp.hi{color:var(--cyan);border-color:#2af5ff55}
.cpimp.med{color:var(--amber);border-color:#eac36a55}
.cpimp.brk{color:var(--mag);border-color:#f23cdd66}
.cpsrc{margin-left:auto}
.cpht{font-family:var(--disp);font-size:19px;font-weight:800;line-height:1.4;margin:7px 0 8px;color:var(--text)}
.cptake{font-size:14.5px;line-height:1.75;color:var(--ice);margin-bottom:9px}
.cpdeep{border-left:3px solid var(--violet);background:#8b6bff12;border-radius:9px;padding:6px 16px}
.cpdeep p{font-size:15px;line-height:1.85;color:var(--text);margin:10px 0}
.cpwrap .rdbody p{font-size:15px;line-height:1.85}
.cpnote{font-size:11px;color:var(--faint);margin-top:8px}
.cptt{font-family:var(--disp);font-size:15px;font-weight:700;color:var(--text);margin:4px 0 12px}
.cpscen{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cpscen .sc{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:13px 16px;font-size:14px;line-height:1.7;color:var(--ice)}
.cpscen .sc b{display:block;font-family:var(--disp);font-size:11px;letter-spacing:.08em;margin-bottom:6px}
.cpscen .sc.hot{border-color:#2af5ff44}.cpscen .sc.hot b{color:var(--cyan)}
.cpscen .sc.cool{border-color:#f23cdd44}.cpscen .sc.cool b{color:var(--mag)}
.cpread2{font-size:14px;line-height:1.75;color:var(--ice);margin-top:12px;border-top:1px solid var(--line);padding-top:12px}
.cprow{display:flex;gap:11px;align-items:baseline;padding:8px 0;border-bottom:1px solid #24314955;font-size:14.5px}
.cprow:last-child{border-bottom:none}
.cpdot{width:8px;height:8px;border-radius:50%;flex:0 0 auto;align-self:center;background:var(--faint)}
.cpdot.hi{background:var(--mag);box-shadow:0 0 9px var(--mag)}
.cpdot.mid{background:var(--amber);box-shadow:0 0 7px #eac36a88}
.cpdt{font-family:var(--disp);font-weight:700;color:var(--cyan);white-space:nowrap}
.cpct{color:var(--text);line-height:1.6}
.cpcs{color:var(--muted)}
.cptabs{display:flex;gap:8px;margin:2px 0 14px}
.cptab{font-family:var(--disp);font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--muted);text-decoration:none;padding:7px 16px;border-radius:999px;border:1px solid var(--line)}
.cptab.on{color:var(--ink);background:var(--cyan);border-color:var(--cyan)}
.cpbtn{font-family:var(--disp);font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--ink);background:linear-gradient(135deg,#2AF5FF,#8B6BFF);border:none;border-radius:999px;padding:7px 15px;cursor:pointer}
.cpbtn:disabled{opacity:.45;cursor:default}
.cplight{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--muted);cursor:help}
.cplight i{width:8px;height:8px;border-radius:50%}
.cplight.g i{background:#3ddc84;box-shadow:0 0 8px #3ddc8488}
.cplight.a i{background:var(--amber);box-shadow:0 0 8px #eac36a88}
.cplight.r i{background:var(--mag);box-shadow:0 0 9px var(--mag);animation:askp 1.2s ease-in-out infinite}
.cphr{display:inline-flex;gap:10px;align-items:center;margin-left:auto;flex-wrap:nowrap;white-space:nowrap}
.cpsl{width:90px;height:24px;flex:0 0 auto;margin-left:auto;align-self:center;opacity:.9}
.cpladder{display:block;width:100%;max-width:560px;height:auto;margin:4px 0 10px}
.cpladder .cplv{stroke:#243149;stroke-width:1}
.cpladder .cplt{font-family:Sora,system-ui;font-size:9.5px;font-weight:700;fill:#8296AE}
.cpladder .cpnow{stroke:#2AF5FF;stroke-width:1.6;filter:drop-shadow(0 0 4px #2af5ff)}
.cpladder .cpnt{font-family:Sora,system-ui;font-size:10px;font-weight:800;fill:#2AF5FF}
.cpkv{display:flex;gap:12px;align-items:baseline;padding:7px 0;border-bottom:1px solid #24314955;font-size:14.5px}
.cpkv:last-child{border-bottom:none}
.cpkv .k{font-family:var(--disp);font-size:10.5px;font-weight:800;letter-spacing:.1em;color:var(--muted);flex:0 0 92px}
.cpkv .v{color:var(--text);line-height:1.6}
.cpcd{color:var(--amber);border-color:#eac36a44}
/* copilot v3: tile grid + fullscreen reader + classroom accordion */
.cpsec2{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--faint);margin-bottom:12px;flex-wrap:wrap}
.cpgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-bottom:16px}
.cptile{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:15px 18px;cursor:pointer;transition:border-color .15s,box-shadow .15s;min-height:128px;overflow:hidden}
.cptile:hover{border-color:#2af5ff66;box-shadow:0 0 18px #2af5ff22}
.cptile.brk{border-color:#f23cdd55}
.cptile.op{border-color:#8b6bff55}
.cptk{display:flex;align-items:center;gap:6px;row-gap:4px;font-family:var(--disp);font-size:10px;font-weight:800;letter-spacing:.1em;color:var(--muted);flex-wrap:wrap}
.chip2{white-space:nowrap}
.cpttag{font-size:9.5px;color:var(--cyan);border:1px solid #2af5ff44;border-radius:999px;padding:1px 7px;letter-spacing:.04em}
.cptt{font-family:var(--disp);font-size:15.5px;font-weight:800;line-height:1.4;color:var(--text);margin:7px 0 6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cptp{font-size:12.5px;line-height:1.6;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cpov{position:fixed;inset:0;z-index:60}
.cpovback{position:absolute;inset:0;background:#04060dee;backdrop-filter:blur(6px)}
.cpovcard{position:absolute;inset:4vh 8vw;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:34px 42px;overflow-y:auto}
.cpovcard h2{font-family:var(--disp);font-size:26px;font-weight:800;line-height:1.4;margin:2px 0 16px;color:var(--text)}
.cpovk{font-family:var(--disp);font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--muted)}
.cpovsec{font-family:var(--disp);font-size:11px;font-weight:800;letter-spacing:.14em;color:var(--violetLt);margin:20px 0 6px}
.cpovtxt{border-left:3px solid #8B6BFF33;padding:2px 18px;border-radius:8px}
.cpovtxt p{font-size:17.5px;line-height:1.95;color:var(--text);margin:12px 0}
.cpovtxt .cpnote{font-size:11px;color:var(--faint)}
.cprg{margin-right:8px}
.cpcls{border-bottom:1px solid var(--line);padding:4px 0}
.cpcls:last-child{border-bottom:none}
.cpcls summary{display:flex;align-items:baseline;gap:12px;cursor:pointer;padding:11px 4px;list-style:none}
.cpcls summary::-webkit-details-marker{display:none}
.cpcls summary::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--violet);box-shadow:0 0 8px #8b6bff88;flex:0 0 auto;align-self:center;transition:background .2s}
.cpcls[open] summary::before{background:var(--cyan);box-shadow:0 0 9px #2af5ff88}
.cpclsn{font-family:var(--disp);font-size:15px;font-weight:800;color:var(--text)}
.cpclst{font-size:12.5px;color:var(--muted)}
.cpclsf{display:flex;gap:14px;padding:7px 4px 7px 19px;align-items:baseline}
.cpclsk{font-family:var(--disp);font-size:10px;font-weight:800;letter-spacing:.1em;color:var(--violetLt);flex:0 0 108px}
.cpclsv p{font-size:14px;line-height:1.8;color:var(--ice);margin:0 0 8px}
@media(max-width:760px){.cpovcard{inset:2vh 3vw;padding:22px 20px}.cpclsf{flex-direction:column;gap:4px}}
/* 盤面 v3 積木條 (his template picks 2026-08-05) */
.chip2{display:inline-block;font-size:9.5px;font-weight:700;border-radius:999px;padding:2px 8px;border:1px solid var(--line);color:var(--muted);vertical-align:middle}
.chip2.g{color:#3ddc84;border-color:#3ddc8455}.chip2.a{color:var(--amber);border-color:#eac36a55}.chip2.r{color:var(--mag);border-color:#f23cdd55}
.map2{margin-left:auto;font-size:8.5px;color:var(--faint);border:1px dashed #24314999;border-radius:999px;padding:2px 7px;white-space:nowrap}
.big2{font-family:var(--disp);font-size:21px;font-weight:800;letter-spacing:-.4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sub2{font-size:11.5px;color:var(--muted);line-height:1.6;margin-top:4px}
.verd2{margin-top:9px;border-left:3px solid var(--violet);background:#8b6bff12;border-radius:8px;padding:8px 12px;font-size:12.5px;line-height:1.65;color:var(--ice)}
.verd2 b{color:var(--violetLt);margin-right:6px}
.cpband{position:relative;height:13px;border-radius:999px;background:var(--panel2);margin:10px 0 4px}
.cpbz{position:absolute;top:0;bottom:0}
.cpbz.g{background:#3ddc841f}.cpbz.a{background:#eac36a1f}.cpbz.r{background:#f23cdd1f}
.cpbz:first-child{border-radius:999px 0 0 999px}.cpbz:last-of-type{border-radius:0 999px 999px 0}
.cpbm{position:absolute;top:-4px;width:3px;height:21px;background:var(--cyan);border-radius:2px;box-shadow:0 0 8px var(--cyan)}
.blab2{display:flex;justify-content:space-between;font-size:9px;color:var(--faint);margin-top:4px}
.cpstk{display:flex;height:24px;border-radius:8px;overflow:hidden;font-size:10px;font-weight:800;color:#041018;margin-bottom:8px}
.cpstk div{display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow:hidden}
.dch2{display:flex;gap:6px;flex-wrap:wrap}
.mini3v{display:flex;gap:14px}
.mini3v .m3{flex:1;text-align:center}
.mgl2{font-size:9px;color:var(--faint)}
.mgv2{font-family:var(--disp);font-size:14px;font-weight:800;margin:3px 0}
.cpsrw{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:12px}
.cpsrw .n{flex:0 0 84px;color:var(--muted);font-size:10px}
.cpsrw .p{flex:0 0 64px;font-family:var(--disp);font-weight:800;font-size:12px}
.cpsrw .b{flex:1;height:6px;border-radius:99px;background:var(--panel2);overflow:hidden;position:relative}
.cpsrw .b i{position:absolute;top:0;bottom:0;left:0;border-radius:99px}
.cpsrw .b i.up{background:linear-gradient(90deg,#F23CDD,#f23cdd55)}
.cpsrw .b i.dn{background:linear-gradient(90deg,#2AF5FF,#2af5ff55)}
.cpsrw .d{flex:0 0 46px;text-align:right;font-size:10px;color:var(--faint)}
.cpnows{display:flex;align-items:center;gap:10px;margin:8px 0;padding:7px 11px;border:1px solid #2af5ff44;border-radius:9px;background:#2af5ff0d;font-size:10.5px;color:var(--muted);flex-wrap:wrap}
.cpnows b{font-family:var(--disp);color:var(--cyan);font-size:13.5px}
.small2{font-size:9.5px;font-weight:800;letter-spacing:.08em;margin:6px 0 2px}
.small2.mg2{color:var(--mag)}.small2.cg2{color:var(--cyan)}
.wr2{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:11px}
.wr2 .nm{flex:0 0 70px;color:var(--muted);font-size:10px}
.wr2 .tr2{flex:1;height:7px;border-radius:99px;background:var(--panel2);overflow:hidden;position:relative}
.wr2 .tr2 i{position:absolute;top:0;bottom:0;left:0;border-radius:99px}
.wr2 .tr2 i.in{background:linear-gradient(90deg,#2AF5FF,#2af5ff55)}
.wr2 .tr2 i.out{background:linear-gradient(90deg,#F23CDD,#f23cdd55)}
.wr2 .v{flex:0 0 auto;font-size:10px;text-align:right}
.cpztbl{margin-top:10px}
.cpzr{display:flex;align-items:baseline;gap:10px;padding:6px 8px;border-radius:8px;font-size:12px;margin:2px 0}
.cpzr.on{background:#2af5ff12;outline:1px solid #2af5ff33}
.cpzr .rng{flex:0 0 118px;font-family:var(--disp);font-weight:700;font-size:11px;color:var(--muted)}
.cpzr .ds{flex:1;color:var(--ice);font-size:11.5px;line-height:1.5}
.cpzr .here{color:var(--cyan);font-size:10.5px;font-weight:800;white-space:nowrap}
.mini2{margin-top:8px;border-top:1px solid #24314966;padding-top:7px;font-size:11px;line-height:1.75;color:var(--muted)}
.mini2 b{color:var(--violetLt);font-size:9.5px;letter-spacing:.06em;margin-right:5px}
.cprc{padding:14px 0;border-bottom:1px solid var(--line)}
.cprc:last-child{border-bottom:none;padding-bottom:2px}
.cprch{display:flex;align-items:center;gap:10px;margin-bottom:7px;flex-wrap:wrap}
.cprcs{font-family:var(--disp);font-weight:800;font-size:14px;color:var(--cyan)}
.cprct{font-size:11px;color:var(--muted)}
.cprcrow{display:flex;gap:10px;padding:5px 0}
.cprcno{font-family:var(--disp);font-weight:800;font-size:11px;color:var(--violetLt);padding-top:3px}
.cprct2{font-size:14px;font-weight:600;color:var(--text);line-height:1.5}
.cprctk{font-size:12.5px;color:var(--muted);line-height:1.65;margin-top:2px}
@media(max-width:760px){.cpwrap{padding:18px 16px 50px}.cpscen{grid-template-columns:1fr}}
.opcap-ctx{margin-left:auto;font-family:var(--disp);font-size:11px;font-weight:600;color:var(--cyan)}
.opcap-news{display:flex;flex-direction:column}
.opnews{display:flex;align-items:baseline;gap:9px;padding:7px 0;border-top:1px solid rgba(255,255,255,.05);text-decoration:none;color:var(--text)}
.opnews:first-child{border-top:none}
.opn-no{font-family:var(--disp);font-weight:700;font-size:11px;color:var(--violet);min-width:13px}
.opn-t{flex:1;font-size:12.5px;line-height:1.4}
.opn-src{font-size:10.5px;color:var(--muted);white-space:nowrap}
.opnews:hover .opn-t{color:var(--cyan)}
.opn-none{color:var(--faint);font-size:12px;padding:8px 0}
@media(max-width:1080px){.app{grid-template-columns:1fr}.side,.rail{display:none}.top{grid-column:1}.main{grid-column:1}.oplog-caps{grid-template-columns:1fr}.todtoggle{margin-left:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
/* ============ round 5 ============ */
/* circular orbit planets (③) */
.orbit{animation:none}
.orbit .pl{position:absolute;width:58px;height:58px;border-radius:50%;background:#0a0f1acc;border:1.5px solid #2af5ff55;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;transform:translate(-50%,-50%);backdrop-filter:blur(4px);cursor:pointer;box-shadow:0 0 13px #2af5ff22;transition:box-shadow .2s,border-color .2s;animation:plp 3.4s ease-in-out infinite}
@keyframes plp{0%,100%{box-shadow:0 0 10px #2af5ff20}50%{box-shadow:0 0 19px #2af5ff44}}
.orbit .pl .pk{font-size:7.5px;font-weight:700;letter-spacing:.07em;color:var(--faint)}
.orbit .pl .pv{font-family:var(--disp);font-size:10.5px;font-weight:800;color:var(--cyan);max-width:52px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.orbit .pl .pv.pvsm{font-size:9px;letter-spacing:-.2px}
.orbit .pl.am{border-color:#eac36a55}.orbit .pl.am .pv{color:var(--amber)}
.orbit .pl.mg{border-color:#f23cdd55}.orbit .pl.mg .pv{color:var(--mag)}
.orbit .pl:hover{border-color:var(--cyan);box-shadow:0 0 26px #2af5ff77}
.orbit .pl::after{content:"ⓘ";position:absolute;top:5px;right:9px;font-size:6.5px;color:var(--faint)}
/* galaxy speed radar (③) */
.gradar{position:absolute;top:12px;left:12px;z-index:8;width:150px}
.grh{font-size:9px;font-weight:700;letter-spacing:.12em;color:#7FEBFF;margin-bottom:6px}
.rchip{display:flex;gap:6px;align-items:baseline;background:#0a0f1acc;border:1px solid #2af5ff55;border-radius:10px;padding:5.5px 10px;margin-bottom:6px;font-family:var(--disp);font-weight:700;font-size:11px;box-shadow:0 0 14px #2af5ff2e;animation:rin .35s ease}
.rchip .rp{margin-left:auto}
.rchip.hotc{animation:rin .35s ease, plp 1.8s ease-in-out infinite}
.rchip.d{border-color:#f23cdd55;box-shadow:0 0 11px #f23cdd2a}
@keyframes rin{0%{opacity:0;transform:translateX(-12px)}100%{opacity:1;transform:translateX(0)}}
/* mini ask button (④) */
/* mover toast countdown (③ 30s) */
.mvtoast .tbar{position:absolute;left:15px;right:15px;bottom:4px;height:2px;border-radius:99px;background:#1c2536;overflow:hidden}
.mvtoast .tbar i{display:block;height:100%;background:var(--cyan);box-shadow:0 0 5px var(--cyan);animation:tdrain 30s linear forwards}
.mvtoast.dn .tbar i{background:var(--mag);box-shadow:0 0 5px var(--mag)}
@keyframes tdrain{0%{width:100%}100%{width:0}}
.mvtoast{padding-bottom:12px}
/* breaking + session lock (②) */
.imp.brk{background:#ff3b5c;color:#fff;animation:brkp 1.2s infinite}
@keyframes brkp{0%,100%{box-shadow:0 0 4px #ff3b5c66}50%{box-shadow:0 0 14px #ff3b5c}}
.lockp{font-size:9px;color:var(--faint);border:1px solid var(--line);border-radius:999px;padding:2.5px 9px;font-weight:700;margin-left:8px;vertical-align:2px;display:inline-flex;align-items:center;gap:5px;max-width:46%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box}
.lockp .ldot{width:6px;height:6px;margin:0;flex:none}
/* topbar disclaimer (⑥) */
.disc{font-size:10px;color:var(--faint);white-space:nowrap}
/* sidebar mode toggle (①) */
.mtog{margin-left:auto;display:inline-flex;background:var(--panel2);border:1px solid var(--line);border-radius:99px}
.mtog i{font-style:normal;font-size:8px;font-weight:800;padding:2.5px 8px;border-radius:99px;color:var(--faint);cursor:pointer;letter-spacing:.04em}
.mtog i.on{background:var(--cyan);color:var(--ink)}
.wh{display:flex;align-items:center}
/* taker flow totals card (⑦) */
.flowcard{padding:11px 13px}
.flowcard .fh{font-family:var(--disp);font-weight:800;font-size:12px;display:flex;align-items:center;margin-bottom:8px}
.fw,.sess{display:flex;align-items:center;gap:7px;font-size:9.5px;color:var(--faint);font-weight:700;padding:2.5px 0}
.fw .w{width:24px;font-family:var(--disp)}
.fb{flex:1;height:5px;border-radius:99px;background:rgba(242,60,221,.32);overflow:hidden}
.fb i{display:block;height:100%;background:var(--cyan);border-radius:99px;transition:width .5s ease;box-shadow:0 0 7px #2af5ff55}
.fd{width:52px;text-align:right;font-family:var(--disp);font-weight:800;font-size:9.5px}
.fsep{font-size:7.5px;color:var(--faint);letter-spacing:.12em;font-weight:800;margin:8px 0 3px}
.sess{border:1px solid var(--line);border-radius:10px;padding:5px 9px;margin-top:5px}
.sess .slb{font-family:var(--disp);white-space:nowrap}
.sess.now{border-color:var(--cyan);box-shadow:0 0 15px #2af5ff44;animation:plp 2.4s ease-in-out infinite}
.sess .stag{font-size:7px;color:var(--ink);background:var(--cyan);border-radius:99px;padding:1.5px 6px;font-weight:800}
.fnote{font-size:8px;color:var(--faint);margin-top:8px;line-height:1.5}
/* tape header v2 (⑧ + premium) */
.tape-hd .tt{font-size:14.5px;font-weight:800}
.tape-hd .tsp{flex:1}
.prem{font-family:var(--disp);font-size:9.5px;font-weight:800;border-radius:999px;padding:2.5px 9px;white-space:nowrap;cursor:pointer;animation:plp 2.8s ease-in-out infinite}
.prem.pu{color:var(--cyan);border:1px solid #2af5ff55;box-shadow:0 0 10px #2af5ff33}
.prem.pd2{color:var(--mag);border:1px solid #f23cdd55;box-shadow:0 0 10px #f23cdd33}
/* crypto movers carousel page (⑤) */
.ico.icoimg{background:#101826;overflow:hidden;display:flex;align-items:center;justify-content:center}
.ico.icoimg img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.gsnap .dots i{cursor:pointer}
/* 2H majors log (②) */
.hblocks{display:flex;flex-direction:column;gap:8px}
.hblock{display:flex;gap:12px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:9px 13px}
.hhh{font-family:var(--disp);font-weight:800;font-size:11px;color:var(--cyan);min-width:44px;padding-top:2px}
.hitems{display:flex;flex-direction:column;gap:5px;min-width:0}
.hitem{color:var(--text);text-decoration:none;font-size:12.5px;line-height:1.35;display:flex;gap:8px;align-items:baseline}
.hitem small{color:var(--faint);font-size:9.5px;white-space:nowrap}
.hitem:hover span{color:var(--cyan)}
/* read modal paragraphs (④) */
.rdbody p{margin:0 0 12px}
.rdbody p:last-child{margin-bottom:0}

/* ---------- LLM usage + master switch (sidebar entry + modal) ---------- */
.ub{font-size:10.5px;padding:3px 10px;border-radius:999px;letter-spacing:.6px;font-weight:800;display:inline-flex;align-items:center;gap:6px}
.ub.on{color:var(--cyan);border:1px solid rgba(42,245,255,.4)}
.ub.off{color:var(--mag);border:1px solid rgba(242,60,221,.4)}
.uwhere{margin:0;font-size:12px;color:var(--text);line-height:1.55}
.usec .ut{font-size:10px;color:var(--muted);letter-spacing:.8px;font-weight:800;margin-bottom:4px;text-transform:uppercase}
.urow{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--text);padding:5px 0;border-bottom:1px dashed rgba(255,255,255,.07)}
.urow:last-child{border-bottom:none}
.urow .un{margin-left:auto;color:var(--faint);font-size:11px;white-space:nowrap}
.urow .uu{font-family:var(--disp);font-weight:700;color:var(--cyan);min-width:64px;text-align:right}
.urow.ubig .uu{font-size:15px}
.uempty{font-size:11.5px;color:var(--faint);padding:6px 0;line-height:1.5}
.uconfirm{border:1px solid rgba(242,60,221,.35);border-radius:12px;padding:11px 13px;background:rgba(242,60,221,.05)}
.uconfirm.g{border-color:rgba(42,245,255,.35);background:rgba(42,245,255,.05)}
.uconfirm .uct{font-size:12px;font-weight:800;margin-bottom:6px}
.uconfirm ul{margin:0 0 8px;padding-left:18px}
.uconfirm li{font-size:11.5px;line-height:1.5;margin:3px 0;color:var(--text)}
.ubtns{display:flex;align-items:center;gap:8px}
.ubtn2{cursor:pointer;border-radius:10px;padding:7px 14px;font-size:12px;font-weight:700;font-family:var(--body);border:1px solid rgba(42,245,255,.45);color:var(--cyan);background:none;transition:all .2s}
.ubtn2:hover{box-shadow:0 0 12px rgba(42,245,255,.18)}
.ubtn2.um{border-color:rgba(242,60,221,.45);color:var(--mag)}
.ubtn2.um:hover{box-shadow:0 0 12px rgba(242,60,221,.18)}
.ubtn2.gh{border-color:rgba(255,255,255,.16);color:var(--muted)}
.ubtn2.big{align-self:flex-start}
.ukeyrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0}
.ukeyrow small{color:var(--faint);font-size:10.5px}
.uinput{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:9px;color:var(--text);padding:7px 10px;font-size:12px;width:150px;font-family:var(--body)}
.uinput:focus{outline:none;border-color:rgba(42,245,255,.5)}
.uerr{font-size:11px;color:var(--mag)}
.unote{display:block;color:var(--faint);font-size:10.5px;line-height:1.5}
/* admin panel page (#/admin) */
.main-admin{gap:12px}
.admingrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
.adcard{display:flex;flex-direction:column;gap:8px}
.adbody{display:flex;flex-direction:column;gap:8px}
.adrow1{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.akgate{max-width:520px;display:flex;flex-direction:column;gap:10px}
.akt{font-size:14px;font-weight:800}
.hbad{color:var(--mag)}
@media(max-width:980px){.admingrid{grid-template-columns:1fr}}
/* per-story source chip on the top-5 (round 6) */
.story .srcchip{margin-left:auto;font-size:9px;letter-spacing:.4px;color:var(--faint);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:2px 8px;white-space:nowrap;flex:none}
.story.clk:hover .srcchip{color:var(--muted);border-color:rgba(42,245,255,.3)}
/* story time chip + (?) logic tooltip (round 6) */
.story .tchip{font-size:9px;color:var(--faint);white-space:nowrap;flex:none}
.qhint{position:relative;display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border:1px solid rgba(255,255,255,.25);border-radius:50%;font-size:9.5px;font-weight:700;color:var(--muted);margin-left:7px;cursor:help;vertical-align:1px}
.qhint:hover{color:var(--cyan);border-color:rgba(42,245,255,.5)}
.qhint .qtip{display:none;position:absolute;top:22px;left:-14px;z-index:80;width:340px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:11px 13px;font-size:11px;font-weight:400;line-height:1.6;color:var(--text);box-shadow:0 14px 40px rgba(0,0,0,.55);text-transform:none;letter-spacing:0;white-space:normal}
.qhint:hover .qtip{display:block}
.qhint .qtip span{display:block;margin:3px 0}
/* open log: media tone + actual move chips + day trend */
.opcap-tone{display:flex;gap:6px;flex-wrap:wrap;margin:5px 0 2px}
.mtone{font-size:9px;font-weight:700;letter-spacing:.4px;padding:2px 7px;border-radius:999px;white-space:nowrap}
.tc-up{color:var(--cyan);border:1px solid rgba(42,245,255,.35)}
.tc-dn{color:var(--mag);border:1px solid rgba(242,60,221,.35)}
.tc-md{color:var(--amber);border:1px solid rgba(234,195,106,.35)}
.daytrend{font-size:9px;color:var(--faint);letter-spacing:.5px;margin-left:10px;font-weight:600}
.daytrend i{font-style:normal;margin-left:3px;font-size:8px}
.dt-up{color:var(--cyan)}.dt-dn{color:var(--mag)}.dt-md{color:var(--amber)}.dt-x{color:var(--faint)}
/* keep the headlines title + (?) glued together on the left (round 6b) */
.stories .chl{display:inline-flex;align-items:center;min-width:0}
/* log-page (?) opens its tooltip to the left so it never overflows the right edge */
.qhint.qr .qtip{left:auto;right:-14px}
/* hidden admin entry: transparent triple-click hotspot, bottom-left corner (below modals) */
.adminhot{position:fixed;left:0;bottom:0;width:26px;height:26px;z-index:40;background:transparent}

/* ---------- Markets v2: dual signature (heatmap + money panel) ---------- */
.mksig{display:grid;grid-template-columns:1.38fr 1fr;gap:12px;margin-top:4px}
.tfp{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:2px;margin-left:auto}
.tfp a{font-size:10px;font-weight:800;padding:3px 10px;border-radius:999px;color:var(--muted);cursor:pointer;letter-spacing:.3px}
.tfp a.on{background:var(--cyan);color:var(--ink)}
.mksig .ch{margin-bottom:10px}
.mksig .chl{display:inline-flex;align-items:center;gap:8px;min-width:0}
.hmg{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:48px;gap:5px;grid-auto-flow:dense}
.hmt{border-radius:10px;padding:7px 8px;display:flex;flex-direction:column;justify-content:flex-end;gap:1px;overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.05);cursor:pointer;transition:transform .15s}
.hmt:hover{transform:scale(1.04);z-index:2}
.hmt .hsym{font-family:var(--disp);font-weight:800;font-size:11.5px;letter-spacing:.3px}
.hmt .hpx{font-family:var(--disp);font-weight:700;font-size:14px}
.hmt .hpc{font-weight:800;font-size:10.5px}
.hmt.hxl .hsym{font-size:14px}
.hmt.hxl .hpx{font-size:21px}
.hmt.hxl .hpc{font-size:12.5px}
.hmt.hxl .hlogo{position:absolute;top:8px;left:8px;width:24px;height:24px;border-radius:50%}
.hmt.hs{justify-content:center;align-items:center;padding:2px}
.hmt.hs .hsym{font-size:9px;color:var(--text)}
.hmwait{color:var(--faint);font-size:11.5px;padding:16px 4px}
.secstrip{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap;align-items:center}
.seclb{font-size:9.5px;color:var(--faint);font-weight:800;letter-spacing:.5px;margin-right:2px}
.secna{color:var(--faint);font-size:11px}
.secchip{font-size:10.5px;font-weight:800;border-radius:999px;padding:3.5px 10px;border:1px solid;cursor:pointer;white-space:nowrap}
.secchip:hover{filter:brightness(1.25)}
/* money panel */
.dmr{display:flex;align-items:center;gap:8px;padding:5.5px 0;border-bottom:1px dashed rgba(255,255,255,.07);cursor:pointer}
.dmr:last-child{border-bottom:none}
.dmr:hover .k{color:var(--text)}
.dmr .k{font-size:11px;color:var(--muted);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dmr .v{font-family:var(--disp);font-weight:800;font-size:14px;margin-left:auto;white-space:nowrap}
.dmr .d{font-size:10.5px;font-weight:800;min-width:52px;text-align:right;white-space:nowrap}
.dmr .dmc{width:7px;height:7px;border-radius:2px;flex:none;font-style:normal}
.dmr.dwater .v{font-size:16px}
.qh2{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;border:1px solid rgba(255,255,255,.22);border-radius:50%;font-size:8.5px;font-weight:700;color:var(--faint);vertical-align:1px}
.dmlb{font-size:10.5px;color:var(--muted);font-weight:700;margin:8px 0 5px}
.twt{display:inline-block;font-size:8px;font-weight:800;letter-spacing:.04em;line-height:1.45;padding:0 5px;border-radius:999px;border:1px solid var(--line);color:var(--muted);vertical-align:middle;margin:0 3px;flex:none}
.tw24{color:#EAC36A;border-color:rgba(234,195,106,.38)}
.rivbox{border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(0,0,0,.18);overflow:hidden;cursor:pointer}
.rivsvg{display:block;width:100%;height:104px}
.rivax{display:flex;justify-content:space-between;font-size:9px;color:var(--faint);font-weight:700;margin:3px 1px 0}
.stackx{display:flex;height:30px;border-radius:9px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.stackx i{display:flex;align-items:center;justify-content:center;font-style:normal;font-family:var(--disp);font-weight:800;font-size:10px;color:#03121a;overflow:hidden;white-space:nowrap}
.stackxlb{display:flex;margin:2px 0 4px}
.stackxlb span{font-size:9px;color:var(--faint);font-weight:700;text-align:center;overflow:hidden;white-space:nowrap}
.regx{margin:8px 0;border:1px solid rgba(42,245,255,.35);background:rgba(42,245,255,.05);border-radius:12px;padding:9px 12px;cursor:pointer}
.regx:hover{border-color:rgba(42,245,255,.6)}
.regx .rg1{font-family:var(--disp);font-weight:800;font-size:13.5px}
.regx .rg2{font-size:10.5px;color:var(--muted);margin-top:3px;line-height:1.5}
.vio{color:var(--violetLt)}
.brow2{display:grid;grid-template-columns:1.5fr 1fr;gap:12px}
.mmexp{white-space:pre-line}
@media(max-width:1080px){.mksig{grid-template-columns:1fr}.brow2{grid-template-columns:1fr}}
/* movers real logos + glued (?) on second-screen card titles */
.lead .coin{overflow:hidden}
.lead .coin img{width:100%;height:100%;border-radius:inherit;object-fit:cover;display:block}
.chartcard .hd h3,.lead h3{display:inline-flex;align-items:center}
.seg a{cursor:pointer}
/* markets round 7c: race/river toggle, marquee, full-width trend chart */
.dmlbrow{display:flex;align-items:center;gap:8px}
.dvm{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:1.5px;margin-left:auto}
.dvm a{font-size:9.5px;font-weight:800;padding:2px 9px;border-radius:999px;color:var(--muted);cursor:pointer}
.dvm a.on{background:var(--violet);color:#fff}
.shiftsvg{height:118px}
.shp{animation:shpp 1.8s ease-in-out infinite}
@keyframes shpp{0%,100%{opacity:1}50%{opacity:.35}}
.hmarq{display:flex;align-items:center;gap:9px;margin-top:9px;border-top:1px dashed rgba(255,255,255,.08);padding-top:8px}
.mqlb{font-size:9px;color:var(--faint);font-weight:800;letter-spacing:.5px;flex:none}
.mqwin{overflow:hidden;flex:1;min-width:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.hmq{display:flex;gap:20px;width:max-content;animation:mqx 42s linear infinite}
.hmarq:hover .hmq{animation-play-state:paused}
@keyframes mqx{to{transform:translateX(-50%)}}
.mqi{display:inline-flex;align-items:center;gap:6px;font-family:var(--disp);font-weight:800;font-size:11px;white-space:nowrap}
.mqi img{width:15px;height:15px;border-radius:50%}
.mqi b{font-size:10.5px}
.brow2{grid-template-columns:1fr}
.brow2 .chartcard .line{height:300px}
/* grid min-content trap: marquee max-content must not widen the signature columns */
.mksig>.card{min-width:0}
/* race skin D: aurora ribbons + star map (round 7d) */
.mktw{animation:mktww 2.6s ease-in-out infinite}
@keyframes mktww{0%,100%{opacity:.14}50%{opacity:.8}}
.mkshm{animation:mkshmm 3.2s linear infinite}
@keyframes mkshmm{0%,100%{opacity:.2}50%{opacity:.55}}
/* round 8: scrollable news rail + capped watchlist + compact BTCvsETH inside heatmap card */
.railnews{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding-right:10px;scrollbar-gutter:stable}
.railmid{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding-right:3px;scrollbar-width:thin;scrollbar-color:rgba(139,107,255,.35) transparent;padding-right:10px;scrollbar-gutter:stable}
.railnews::-webkit-scrollbar,.wlscroll::-webkit-scrollbar,.railmid::-webkit-scrollbar,.sidemid::-webkit-scrollbar,.ulwrap::-webkit-scrollbar{width:5px}
.railnews::-webkit-scrollbar-thumb,.wlscroll::-webkit-scrollbar-thumb,.railmid::-webkit-scrollbar-thumb,.sidemid::-webkit-scrollbar-thumb,.ulwrap::-webkit-scrollbar-thumb{background:rgba(139,107,255,.35);border-radius:99px}
.railnews::-webkit-scrollbar-track,.wlscroll::-webkit-scrollbar-track,.railmid::-webkit-scrollbar-track,.sidemid::-webkit-scrollbar-track,.ulwrap::-webkit-scrollbar-track{background:transparent}
.wlscroll{padding-right:3px}
.side .comm{margin-top:8px}
.mkcmp{margin-top:9px;border-top:1px dashed rgba(255,255,255,.08);padding-top:8px}
.mch{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-size:12px;font-weight:700;color:var(--muted)}
.mch .legend{margin:0 0 0 auto;font-size:10px;gap:12px}
.mch .seg a{padding:3px 10px;font-size:10px}
.mkline{height:114px;display:block;width:100%;margin-top:4px}
.maxis{display:flex;justify-content:space-between;font-size:9.5px;color:var(--faint);margin-top:3px}

.rail .card.live{flex:none}

/* ---- WEEX community funnel: real QR in the sidebar comm block + big QR modal
   (2026-09-20, his call: the existing Join Telegram button is the entry to his
   WEEX community; the modal discloses the partner/referral nature). ---- */
.comm{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.comm:hover{border-color:var(--violet);box-shadow:0 0 18px #8b6bff33}
.comm .qr{background:#fff;padding:5px;opacity:1}
.comm .qr svg{display:block;width:100%;height:100%}
.wxcard{max-width:340px;text-align:center}
.qrbig{background:#fff;border-radius:14px;padding:12px;width:min(280px,70vw);margin:14px auto 4px}
.qrbig svg{display:block;width:100%;height:auto}
.wxhead{font-family:var(--disp);font-weight:800;font-size:15px;letter-spacing:.4px;margin-top:4px}
.wxhint{color:var(--muted);font-size:12px;margin:8px 0 12px}
.wxdisc{display:block;color:var(--faint);font-size:10px;margin-top:12px}

/* ---------- Order Flow page (v1, 2026-09-29) ----------
   chart boxes are FIXED px (banner rule 4): the library autosizes inside them,
   the lower row flexes and clips cleanly (.trows / .ofbars fuses). */
.main-orderflow{gap:12px}
.ofchart{display:flex;flex-direction:column;flex:none;padding:14px 16px 12px}
.ofchart .ch{margin-bottom:8px;gap:10px}
.ofchart .chl,.ofhist .chl{display:inline-flex;align-items:center;gap:8px;min-width:0}
.ofchart .ch .ldot,.ofhist .ch .ldot{margin-right:0}
.oftfs{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.oftfs a{font-family:var(--disp);font-size:10px;font-weight:700;padding:3px 8px;border-radius:999px;background:var(--panel2);color:var(--muted);cursor:pointer;line-height:1.3}
.oftfs a:hover{color:var(--text)}
.oftfs a.on{background:var(--cyan);color:var(--ink);box-shadow:0 0 12px #2af5ff44}
.ofbadge{font-family:var(--disp);font-size:9.5px;font-weight:700;letter-spacing:.06em;color:var(--faint);border:1px solid var(--line);border-radius:6px;padding:2px 7px;white-space:nowrap}
.ofcandle{height:300px;border-radius:12px;overflow:hidden;background:#0a0e1c;border:1px solid var(--line);position:relative}
.ofcvd{height:130px;border-radius:12px;overflow:hidden;background:#0a0e1c;border:1px solid var(--line)}
.ofwait{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--faint)}
.oflg{display:flex;flex-wrap:wrap;gap:12px;font-size:10px;color:var(--muted);margin:7px 2px 9px}
.oflg i{display:inline-block;width:10px;height:3px;border-radius:2px;margin-right:5px;vertical-align:middle}
.ch.ofsub{margin-top:0}
.ofsrc{margin-left:auto;font-size:9.5px;color:var(--faint);font-weight:600;letter-spacing:.04em;white-space:nowrap}
.ofrow{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px}
.oftape{display:flex;flex-direction:column;min-height:0;padding:14px 16px}
.oftape .tapewrap{flex:1;min-height:0;border-left:0}
.oftape .tape-inner{left:0}
.ofhist{display:flex;flex-direction:column;min-height:0;padding:14px 16px;overflow:hidden}
.ofbars{flex:1;min-height:120px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;align-items:stretch;padding:6px 2px 0}
.ofb{display:flex;flex-direction:column;align-items:center;gap:5px;height:100%;min-height:0}
.ofst{flex:1;width:100%;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;gap:2px;transition:opacity .3s}
.ofst i{display:block;width:100%;border-radius:4px 4px 0 0;transition:height .4s;min-height:0}
.ofst i.b{background:var(--cyan);box-shadow:0 0 10px #2af5ff55}
.ofst i.s{background:#A05CF5;box-shadow:0 0 10px #a05cf555;border-radius:0 0 4px 4px}
.ofst.dim{opacity:.38}
.ofring{width:13px;height:13px;border-radius:50%;background:conic-gradient(var(--cyan) var(--p,0%),#22294a 0);border:2px solid var(--panel);flex:none}
.ofnm{font-family:var(--disp);font-size:10.5px;font-weight:700;line-height:1}
.ofnet{font-family:var(--disp);font-size:9.5px;font-weight:700;line-height:1;white-space:nowrap}
.ofnote{font-size:10px;color:var(--faint);margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* narrow main column (rail + side stay fixed until 1080): timeframe pills drop to their
   own row under the title instead of squeezing the title into a stack */
.ofchart .ch .chl{white-space:nowrap}
.oftape .tape-hd{flex-wrap:wrap;row-gap:2px}
.oftape .tex-src{white-space:nowrap}
@media(max-width:1500px){.ofchart .ch{flex-wrap:wrap}.ofchart .ch .oftfs{order:3;flex-basis:100%;margin-left:0;justify-content:flex-start}}
@media(max-width:1240px){.ofrow{grid-template-columns:1fr}.oftape{min-height:320px}.ofhist{min-height:240px}}

/* last-good stale chip: a feed is serving its previous successful copy */
.stalechip{display:inline-flex;align-items:center;gap:5px;margin-left:8px;font-family:var(--disp);font-size:9px;font-weight:700;letter-spacing:.04em;color:var(--amber);background:#2a2208;border:1px solid #4a3a10;border-radius:999px;padding:1px 7px;vertical-align:middle;white-space:nowrap}
.stalechip i{width:6px;height:6px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px var(--amber);animation:stalepulse 1.6s ease-in-out infinite}
@keyframes stalepulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ---------- Order Flow v2 (2026-09-29): gate, timezone, TV text link, 3-card row, 24h liq board ---------- */
.ofgate{position:fixed;top:54px;left:240px;right:0;bottom:0;z-index:65;display:flex;align-items:center;justify-content:center;background:rgba(8,11,18,.78);backdrop-filter:blur(6px)}
.ofgcard{width:min(520px,90vw);background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:22px 22px 20px;box-shadow:0 30px 80px #000b,0 0 46px #2af5ff22}
.ofgt{font-family:var(--disp);font-weight:800;font-size:17px;margin-bottom:12px}
.ofgcard .mmexp{white-space:pre-line;margin-top:12px}
.ofgok{margin-top:16px;width:100%;font-family:var(--disp);font-weight:800;font-size:13px;color:var(--ink);background:var(--cyan);border:0;border-radius:999px;padding:11px 0;cursor:pointer;box-shadow:0 0 18px #2af5ff55}
.ofgok:hover{filter:brightness(1.08)}
@media(max-width:1080px){.ofgate{left:0}}
.oftz{font-family:var(--disp);font-size:10px;font-weight:700;color:var(--muted);background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:3px 8px;margin-left:auto;cursor:pointer;-webkit-appearance:none;appearance:none}
.oftz:focus{outline:none;border-color:var(--cyan)}
.ofchart .ch .oftz+.oftfs{margin-left:0}
.oftv{font-size:8.5px;color:var(--faint);letter-spacing:.03em;text-decoration:none;opacity:.7}
.oftv:hover{color:var(--muted);opacity:1}
.ofrow{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,.95fr)}
.ofliq{display:flex;flex-direction:column;min-height:0;padding:14px 16px;overflow:hidden}
.ofliqbody{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}
.oflq2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px}
.oflq2 div{display:flex;flex-direction:column;gap:2px}
.oflq2 .k{font-size:9.5px;color:var(--faint);letter-spacing:.08em;font-weight:700}
.oflq2 b{font-family:var(--disp);font-size:20px;font-weight:800;line-height:1.1}
.oflqh{height:44px;display:flex;align-items:flex-end;gap:2px;margin:2px 0 4px}
.oflqh i{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%;gap:1px}
.oflqh i b{display:block;background:#A05CF5;border-radius:2px 2px 0 0;min-height:1px}
.oflqh i s{display:block;background:var(--cyan);border-radius:0 0 2px 2px;min-height:1px}
.oflqt{font-family:var(--disp);font-size:10px;font-weight:700;letter-spacing:.06em;color:var(--muted);margin:8px 0 4px;display:flex;justify-content:space-between}
.oflqt span{color:var(--faint);font-weight:600;letter-spacing:.03em}
.oflqr{display:grid;grid-template-columns:34px 44px 1fr auto 44px;gap:8px;align-items:center;font-size:10.5px;padding:4px 0;border-bottom:1px solid var(--line)}
.oflqr:last-child{border-bottom:none}
.oflqr .ex{font-family:var(--disp);font-weight:700;color:var(--muted)}
.oflqr .px{color:var(--muted)}
.oflqr b{font-family:var(--disp);font-weight:700}
.oflqr .tm{color:var(--faint);text-align:right;font-size:9.5px}
@media(max-width:1500px){.ofrow{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ofliq{grid-column:1/-1;max-height:300px}}
@media(max-width:1240px){.ofrow{grid-template-columns:1fr}.ofliq{grid-column:auto}}

/* ---------- Today page skeleton lock (his image 3): sidebar, hero row and rail never scroll;
   the three feed cards scroll INSIDE themselves when the window is short ---------- */
@media(min-width:1201px){
  .main-today{height:calc(100vh - 54px);min-height:0;overflow:hidden}
  .main-today .stories{flex:1 1 auto;min-height:0}
  /* EDGE RULE (his order 2026-09-30, 'we keep making this mistake'): every scrolling list keeps
     10px of air between its text and the scrollbar, and the scrollbar keeps its own lane
     (scrollbar-gutter) so nothing ever sits on the card's edge */
  .main-today .storywrap{overflow:auto;justify-content:flex-start;gap:2px;padding-right:10px;scrollbar-gutter:stable}
  .main-today .xrows,.main-today .sentbody{overflow:auto;padding-right:10px;scrollbar-gutter:stable}
}
.main-today .storywrap::-webkit-scrollbar,.main-today .xrows::-webkit-scrollbar,.main-today .sentbody::-webkit-scrollbar{width:4px}
.main-today .storywrap::-webkit-scrollbar-thumb,.main-today .xrows::-webkit-scrollbar-thumb,.main-today .sentbody::-webkit-scrollbar-thumb{background:#2a3450;border-radius:4px}
/* social temperature v2 */
.shcap{font-size:9.5px;color:var(--faint);margin-top:8px;letter-spacing:.03em}
.shours{margin-top:4px;height:30px;flex:none}
.teamh{font-family:var(--disp);font-size:10px;font-weight:700;letter-spacing:.06em;color:var(--muted);margin:14px 0 6px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.teamh span{font-family:var(--body);font-weight:500;letter-spacing:0;color:var(--faint);font-size:9.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.teamrows{display:flex;flex-direction:column}
.tr2{padding:7px 0;border-bottom:1px solid var(--line);cursor:pointer}
.tr2:last-child{border-bottom:none}
.tr2 .th{font-family:var(--disp);font-size:10.5px;font-weight:700;display:flex;gap:6px;align-items:baseline}
.tr2 .th .xt{color:var(--faint);font-weight:500;font-size:9.5px}
.tr2 .ttx{font-size:10.5px;color:#c4caea;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tr2:hover .ttx{color:var(--text)}
/* livestream card buttons + feedback modal */
.live .lbtns{display:flex;gap:8px;margin-top:10px}
.lbtn{flex:1;text-align:center;font-family:var(--disp);font-weight:800;font-size:11px;padding:7px 0;border-radius:999px;background:#fff;color:#1a0f3a;cursor:pointer;text-decoration:none}
.lbtn.gh{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}
.lbtn:hover{filter:brightness(.95)}
.fbcard{width:min(480px,90vw)}
.fbhint{font-size:12px;color:var(--muted);line-height:1.55;margin:10px 0}
.fbta{width:100%;min-height:110px;resize:vertical;background:var(--panel2);border:1px solid var(--line);border-radius:12px;color:var(--text);font-family:var(--body);font-size:13px;padding:10px 12px;margin-bottom:8px}
.fbta:focus,.fbcard .uinput:focus{outline:none;border-color:var(--cyan)}
.fbcard .uinput{width:100%;margin-bottom:10px}
.fbhp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.fbrow{padding:6px 0;border-bottom:1px solid var(--line)}
.fbrow:last-child{border-bottom:none}
.fbm{font-size:12px;line-height:1.5}
.fbmeta{font-size:10px;color:var(--faint);margin-top:2px}
/* 2026-09-29 late fixes (his review): hero row must never shrink or crop inside the locked Today
   column (flex items default to shrink:1), the X header text truncates instead of colliding,
   team posts get vivid colour, tweet photos in the modal */
.main-today .galaxy,.main-today .pagehd{flex:none}
.xcard .xsrc{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;text-align:right}
.tr2 .th{color:var(--cyan)}
.tr2 .th .xt{color:var(--muted)}
.tr2 .ttx{color:var(--text)}
.nimg{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:12px;margin:10px 0 4px;border:1px solid var(--line)}
/* X rows: the right-hand tag column gets a fixed lane and wraps inside it instead of being
   pushed against the card edge (his catch 2026-09-29 late) */
.xr{grid-template-columns:10px minmax(0,1fr) 96px}
.xe{white-space:normal;line-height:1.25;padding-right:2px}
.xe b{display:block}
.xe span{display:block}
/* social temperature: empty hours render as a faint baseline, never as dashes; gauge spacing */
.shours i.z{background:#22294a;box-shadow:none}
.sgauge{margin:12px 0 8px}
video.nimg{background:#000}
/* ---------- On-chain v2 (2026-09-29): fills the blank space only ---------- */
.ucompact{flex:none;padding:12px 14px}
.ugrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.ug{display:flex;flex-direction:column;gap:3px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:7px 8px;min-width:0}
.ug .tkimg,.ug .tk{width:22px;height:22px;border-radius:50%;font-size:8px;display:flex;align-items:center;justify-content:center;font-weight:700}
.ug .nm .s{font-family:var(--disp);font-weight:700;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ug .nm .d{font-size:9.5px;color:var(--muted)}
.ug .a{font-family:var(--disp);font-weight:700;font-size:12px}
.occard{flex:none;padding:12px 14px;display:flex;flex-direction:column;min-height:0}
.occard .ch{margin-bottom:8px;gap:8px}
.occard .chl,.ocsh .chl{display:inline-flex;align-items:center;gap:8px;min-width:0;white-space:nowrap;font-family:var(--disp);font-weight:700;font-size:12.5px}
.occard .ch .n,.ocsh .n{margin-left:auto;font-size:9.5px;color:var(--faint);font-weight:600;white-space:nowrap}
.ochl{flex:1;min-height:0;overflow:hidden}
.ocbig{display:flex;align-items:baseline;gap:10px;min-width:0}
.ocbig .big{font-family:var(--disp);font-size:24px;font-weight:800;line-height:1}
.ocbig .sub{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocetf{display:flex;align-items:flex-end;gap:3px;height:48px;margin:8px 0 4px}
.ocetf i{flex:1;background:var(--cyan);border-radius:3px 3px 0 0;box-shadow:0 0 8px #2af5ff44;min-height:2px}
.ocetf i.n{background:var(--mag);box-shadow:0 0 8px #f23cdd44}
.ocnote{font-size:9.5px;color:var(--faint)}
.ocrow{display:grid;grid-template-columns:44px minmax(0,1fr) auto 40px;gap:8px;align-items:center;font-size:10.5px;padding:4px 0;border-bottom:1px solid var(--line)}
.ocrow:last-child{border-bottom:none}
.ocrow .k{font-family:var(--disp);font-weight:700;font-size:10px;letter-spacing:.04em}
.ocrow .t{color:#c4caea;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocrow b{font-family:var(--disp);font-weight:700;white-space:nowrap}
.ocrow .tm{color:var(--faint);font-size:9.5px;text-align:right}
.ocrow.hl{grid-template-columns:78px 34px 40px minmax(0,1fr) auto;cursor:pointer}
.ocrow.hl .ad{font-family:var(--disp);color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocrow.hl:hover .t{color:var(--text)}
.occells{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.occells.three{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:6px}
.occells div{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:6px 8px;min-width:0}
.occells .k{font-size:9px;color:var(--muted);letter-spacing:.06em;font-weight:700;display:block}
.occells b{display:block;font-family:var(--disp);font-size:12.5px;margin:2px 0 1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.occells b.mut{color:var(--faint)}
.occells .d{font-size:9px;color:var(--faint);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ocstrip{flex:none;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.ocsh{display:flex;align-items:center;gap:8px;margin-bottom:7px}
@media(max-width:1500px){.ugrid{grid-template-columns:repeat(2,minmax(0,1fr))}.occells{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* rail tooltips must open leftwards and never wider than the rail (his catch 2026-09-29, third time a tip clipped) */
.rail .qhint .qtip{left:auto;right:-14px;width:min(340px,calc(100vw - 40px))}
.rail .rh h3{overflow:visible}
/* rail tooltips anchor to the rail header row itself, so they span the rail width and can never
   leave the rail (which clips overflow) on either side */
.rail .rh{position:relative}
.rail .rh .qhint{position:static}
.rail .rh .qhint .qtip{left:0;right:0;width:auto;top:30px}
.qhint .qtip.up{top:auto;bottom:22px}
.qhint .qtip.qrx{left:auto;right:-14px}
.rail .rh .qhint .qtip.up{bottom:30px}
.rail .rh .qhint .qtip.qrx{left:0;right:0}

/* ═══════════════ MOBILE (phase 1+2, 2026-09-30): under 768px only, desktop untouched ═══════════════ */
.mtabs{display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(8,11,18,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom));justify-content:space-around}
.mtabs a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;font-weight:600;color:var(--muted);padding:4px 0;border-radius:12px;min-height:44px}
.mtabs a svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mtabs a.on{color:var(--cyan)}
.qhint.open .qtip{display:block}
@media(max-width:768px){
  html,body{overflow-x:hidden}
  body{font-size:14px}
  .app{display:block;max-width:100%;min-height:100vh}
  .side{display:none}
  .mtabs{display:flex}
  .top{position:sticky;top:0;z-index:40;background:rgba(8,11,18,.96);backdrop-filter:blur(10px);padding:0 12px;gap:8px;height:50px;grid-column:auto}
  .crumbs,.disc,.who{display:none}
  .top .right{margin-left:auto}
  .main{grid-column:auto;padding:12px 12px 88px;gap:10px;min-height:0;height:auto!important;overflow:visible!important}
  .rail{display:flex;flex-direction:column;position:static;height:auto;overflow:visible;border-left:0;padding:0 12px 88px;gap:10px;grid-column:auto}
  .railmid,.railnews{max-height:none;overflow:visible;flex:none}
  .pagehd{flex-wrap:wrap;gap:6px}.pagehd .h{font-size:17px}.nfa{display:none}.pagehd .sub{font-size:12px}
  .ribbon{grid-auto-flow:row;grid-template-columns:1fr 1fr;gap:8px;overflow:visible}.rtile{min-width:0;padding:8px 10px}
  .galaxy{flex-direction:column;height:auto}.gleft{height:270px}.orbit{transform:scale(.72)}.gcore .num{font-size:30px}.gsnap{flex:auto;margin:0 10px 10px}
  .gradar{display:none}
  .sgrid,.kpis,.brow,.brow2,.cols,.ofrow,.mksig,.admingrid,.oplog-caps{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:10px}
  .card,.net,.whpcb,.side-stack,.stack{min-width:0;max-width:100%}
  .net{overflow:hidden}.wchip{max-width:38%;width:auto}
  .gleft{flex:none!important}
  .card{padding:12px;border-radius:16px}
  .stories,.xcard,.sentcard,.ustack,.fstack{min-height:0;flex:none}
  .xrows,.sentbody,.storywrap,.ustack .ulwrap{overflow:visible;max-height:none}
  .sentcard{grid-column:auto;max-height:none}.sentcard .shours{display:flex}
  .xr{grid-template-columns:10px minmax(0,1fr)}.xe{grid-column:2;flex-direction:row;flex-wrap:wrap;gap:8px;text-align:left;white-space:normal}.xe b,.xe span{display:inline}
  .xtx{-webkit-line-clamp:3}
  .ofcandle{height:clamp(400px,58vh,600px)}.ofcvd{height:110px}
  .ofchart .ch{flex-wrap:wrap}.ofchart .ch .oftfs{order:3;flex-basis:100%;margin-left:0;flex-wrap:wrap;overflow:visible;justify-content:flex-start;padding-bottom:2px;row-gap:6px}.oftfs a{padding:7px 12px;font-size:11px;flex:none;min-height:34px;display:inline-flex;align-items:center}.oftz{margin-left:auto;min-height:32px}
  .oftape{min-height:360px}.ofhist{min-height:260px}.ofliq{max-height:none;grid-column:auto}
  .ofgate{left:0;top:0}.ofgcard{width:92vw}
  .mmodal{align-items:flex-end}.mmcard{width:100vw;max-width:100vw;max-height:86vh;overflow:auto;border-radius:20px 20px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));animation:none}
  .qhint{width:24px;height:24px;font-size:12px;flex:none}
  .qhint .qtip{position:fixed;left:12px;right:12px;top:auto;bottom:calc(74px + env(safe-area-inset-bottom));width:auto;max-height:50vh;overflow:auto;z-index:90;font-size:12px}
  .qhint:hover .qtip{display:none}.qhint.open .qtip{display:block}
  .rail .rh .qhint{position:relative}.rail .rh .qhint .qtip{left:12px;right:12px;top:auto;bottom:calc(74px + env(safe-area-inset-bottom));width:auto}
  .pill a,.tabs span,.tabs a,.lbtn,.ubtn2,.mtog i{min-height:36px;display:inline-flex;align-items:center}
  .live{position:static}
  .ugrid{grid-template-columns:1fr 1fr}.occells{grid-template-columns:repeat(3,minmax(0,1fr))}.occells.three{grid-template-columns:repeat(3,minmax(0,1fr))}
  /* heatmap on phones: 5 tight columns, first 20 coins only (his ask: shorter block) */
  #hmgrid,.hmgrid{grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-auto-rows:44px;gap:4px}
  #hmgrid>*:nth-child(n+21){display:none}
  #hmgrid>*{grid-column:auto!important;grid-row:auto!important}
  #hmgrid .hlogo{width:14px;height:14px}
  .main-markets .chartcard{max-height:none}
  .shoot,.neb,.wpulse,.wvia{animation:none!important}
  .sub,.n,.src,.ofnote,.ocnote,.shcap,.tm{font-size:11px}
  .whpcb{min-height:320px}
}
/* heatmap: small tiles show their percentage too (his ask 2026-09-30) */
.hmt.hs{flex-direction:column;justify-content:center;gap:1px}
.hmt.hs .hsym{font-size:10px}.hmt.hs .hpc{font-size:9px;font-weight:700}
/* whale flow plain list: phones only */
.whlist{display:none}
.whlsum{font-family:var(--disp);font-weight:700;font-size:12px;color:var(--muted);margin:2px 0 6px}
.whl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 10px;padding:7px 0;border-bottom:1px solid var(--line)}
.whl .wla{font-family:var(--disp);font-weight:800;font-size:12.5px;grid-row:1/3}
.whl .wlr{font-size:11.5px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.whl .wlk{font-size:10.5px;color:var(--muted)}
.whl .wlt{grid-column:2;font-size:10px;color:var(--faint)}
@media(max-width:768px){
  .net .whpcb,.net .leg,.net .whsum{display:none}
  .whlist{display:block}
  .lbtn{justify-content:center}
  .hmt.hs .hpc{font-size:9px}
}
/* phone heatmap: BTC and ETH tiles use the same compact layout as every other tile (no price line, no logo) */
@media(max-width:768px){
  #hmgrid .hmt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:3px 4px;min-width:0;overflow:hidden}
  #hmgrid .hmt .hpx,#hmgrid .hmt .hlogo{display:none}
  #hmgrid .hmt .hsym{font-size:11px;line-height:1.1}
  #hmgrid .hmt .hpc{font-size:10px;line-height:1.1}
}
@media(max-width:768px){#hmgrid .hmt:nth-child(n+21){display:none!important}}

/* Order Flow drawing toolbar (2026-09-30): overlay in the candle box's top-left; the box
   is overflow:visible now so the toolbar's (?) tip is never clipped (mistake #14 family) */
.ofcandle{overflow:visible}
.ofcandle>div:not(.ofdraw):not(.ofwait){border-radius:12px;overflow:hidden}
.ofdraw{position:absolute;left:8px;top:8px;z-index:5;display:flex;gap:4px;align-items:center}
.ofdraw a{font-family:var(--disp);font-size:9.5px;font-weight:700;padding:3px 8px;border-radius:999px;background:#101726dd;border:1px solid var(--line);color:var(--muted);cursor:pointer;line-height:1.3;user-select:none}
.ofdraw a:hover{color:var(--text)}
.ofdraw a.on{background:var(--cyan);color:var(--ink);border-color:var(--cyan);box-shadow:0 0 12px #2af5ff44}
.ofdraw .qhint{margin-left:2px}
.ofcandle.drawing{cursor:crosshair}
.ofcandle.drawing canvas{cursor:crosshair}
@media(max-width:768px){.ofdraw{left:6px;top:6px;gap:3px}.ofdraw a{padding:6px 8px;font-size:9px;min-height:30px;display:inline-flex;align-items:center}}

/* drawing palette v2 (colour / opacity / width / dash / ray / delete), under the toolbar */
.ofpal{position:absolute;left:8px;top:34px;z-index:5;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;background:#101726ee;border:1px solid var(--line);border-radius:10px;padding:6px 8px;max-width:calc(100% - 90px)}
.ofpal .pg{display:inline-flex;gap:4px;align-items:center}
.ofpal i{width:14px;height:14px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-sizing:border-box;display:inline-block}
.ofpal i.on{border-color:#fff;box-shadow:0 0 8px #ffffff88}
.ofpal a{font-family:var(--disp);font-size:9px;font-weight:700;padding:2px 6px;border-radius:999px;background:var(--panel2);color:var(--muted);cursor:pointer;line-height:1.3;user-select:none}
.ofpal a:hover{color:var(--text)}
.ofpal a.on{background:var(--cyan);color:var(--ink)}
.ofpal a.del{background:#3a0e2e;color:var(--mag)}
.ofcandle.dragging canvas{cursor:grabbing}
/* phones: the palette is a collapsed STYLE pill at the bottom-left of the box (nothing covers
   the candles until asked); tapping it opens the full palette in wrapped rows, anchored to the
   bottom so it grows upward, with DELETE first and the pill turning into CLOSE */
.ofpal .ptg{display:none}
@media(max-width:768px){
  .ofpal{top:auto;bottom:32px;left:6px;right:auto;max-width:calc(100% - 70px);flex-wrap:wrap;gap:6px 8px;padding:5px 7px}
  .ofpal .ptg{display:inline-flex;background:var(--cyan);color:var(--ink);order:-2}
  .ofpal:not(.open)>*:not(.ptg){display:none}
  .ofpal.open{right:64px;padding:8px}
  .ofpal .pg{flex:none}.ofpal i{width:20px;height:20px;flex:none}.ofpal a{padding:5px 8px;font-size:10px;min-height:26px;display:inline-flex;align-items:center;flex:none;white-space:nowrap}.ofpal a.del{order:-1}
}

/* the palette's own display rules must never resurrect an element the JS hid (RAY, DELETE) */
.ofpal [hidden]{display:none!important}

.ofnote.warn{color:var(--amber)}

/* BREAKING chip: glowing magenta dot instead of the old red-circle emoji (rule 18 sweep 2026-09-30) */
.imp.brk .ldot{width:6px;height:6px;margin:0 5px 0 0;background:var(--mag);box-shadow:0 0 8px var(--mag);vertical-align:0}
.ldot.brk{background:var(--mag);box-shadow:0 0 8px var(--mag)}