/* ── RESET + ROOT ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root,[data-theme="dark"]{
  --bg:#0a0a0f;--surface:#12121a;--s2:#1a1a24;--border:#242433;--bhi:#323247;
  --tx:#9ea7bc;--dim:#4b5563;--hi:#f3f4f6;--mid:#6b7280;
  --g:#00e676;--gd:#00e67615;--gg:#00e67635;
  --r:#ff3b30;--rd:#ff3b3015;
  --a:#ffb547;--ad:#ffb54715;
  --b:#4da6ff;--bd:#4da6ff15;
  --p:#b490ff;
  --mono:'IBM Plex Mono',monospace;--sans:'Inter',sans-serif;
  --scanline:rgba(0,0,0,.03);
}
[data-theme="gray"]{
  --bg:#1a1d23;--surface:#22262e;--s2:#282d36;--border:#343a46;--bhi:#454d5c;
  --tx:#b0b8cc;--dim:#5c6478;--hi:#e4e8f2;--mid:#7f8a9e;
  --g:#00e5a0;--gd:#00e5a012;--gg:#00e5a030;
  --r:#ff3d5a;--rd:#ff3d5a12;
  --a:#ffb547;--ad:#ffb54712;
  --b:#4da6ff;--bd:#4da6ff12;
  --p:#b490ff;
  --scanline:rgba(0,0,0,.02);
}
[data-theme="light"]{
  --bg:#f0f1f4;--surface:#ffffff;--s2:#e8eaef;--border:#d0d4dc;--bhi:#bcc2ce;
  --tx:#3a3f4e;--dim:#8990a2;--hi:#1a1e2a;--mid:#5c6378;
  --g:#00b37e;--gd:#00b37e12;--gg:#00b37e28;
  --r:#d9304a;--rd:#d9304a12;
  --a:#d49520;--ad:#d4952012;
  --b:#2b82d9;--bd:#2b82d912;
  --p:#8f6ad9;
  --scanline:rgba(0,0,0,.015);
}
[data-theme="rgb"]{
  --bg:#050611;--surface:#090b18;--s2:#0e1022;--border:#191d32;--bhi:#262b43;
  --tx:#9fa7d8;--dim:#4f5674;--hi:#f4f5ff;--mid:#757e9f;
  --g:#00ffb3;--gd:#00ffb312;--gg:#00ffb334;
  --r:#ff417d;--rd:#ff417d1a;
  --a:#ffc447;--ad:#ffc4471a;
  --b:#4d7dff;--bd:#4d7dff1c;
  --p:#b16dff;
  --mono:'IBM Plex Mono',monospace;--sans:'Syne',sans-serif;
  --scanline:rgba(0,0,0,.04);
}
html,body{height:100%;background:var(--bg);color:var(--tx);font-family:var(--mono);font-size:12px;overflow:hidden}
button{font-family:var(--mono);cursor:pointer}

/* ── SCAN LINES OVERLAY ── */
body::after{content:'';position:fixed;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,var(--scanline) 2px,var(--scanline) 4px);pointer-events:none;z-index:999}

/* ── TICKER TAPE ── */
#tape{height:26px;background:var(--surface);border-bottom:1px solid var(--border);overflow:hidden;flex-shrink:0;position:relative}
#tape::before,#tape::after{content:'';position:absolute;top:0;width:40px;height:100%;z-index:2}
#tape::before{left:0;background:linear-gradient(90deg,var(--surface),transparent)}
#tape::after{right:0;background:linear-gradient(-90deg,var(--surface),transparent)}
#tape-track{display:flex;white-space:nowrap;height:100%;align-items:center;animation:tape 55s linear infinite;width:max-content}
#tape-track:hover{animation-play-state:paused}
@keyframes tape{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.t-item{display:inline-flex;align-items:center;gap:6px;padding:0 14px;font-size:10px;border-right:1px solid var(--border)}
.t-sym{font-weight:700;font-size:10px;color:var(--hi);letter-spacing:.3px}
.t-px{color:var(--mid)}
.t-ch{font-size:9px;padding:1px 4px;border-radius:2px}
.t-ch.up{color:var(--g);background:var(--gd)}
.t-ch.dn{color:var(--r);background:var(--rd)}
.t-ch.fl{color:var(--dim)}
.t-hist{font-size:8px;color:var(--dim);margin-left:4px;opacity:.9}

/* ── TOPBAR ── */
#bar{height:42px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 14px;gap:14px;z-index:20;flex-shrink:0}
#logo{font-family:var(--sans);font-weight:800;font-size:15px;color:var(--hi);display:flex;align-items:center;gap:7px;letter-spacing:-.3px;margin-right:2px}
#logo em{color:var(--g);font-style:normal}
.dot-pulse{width:6px;height:6px;border-radius:50%;background:var(--g);box-shadow:0 0 7px var(--g);animation:dp 2.4s ease-in-out infinite;flex-shrink:0}
@keyframes dp{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.75)}}
.nb{font-size:10px;color:var(--dim);background:none;border:1px solid transparent;padding:3px 11px;border-radius:6px;letter-spacing:.5px;text-transform:uppercase;transition:all .2s cubic-bezier(0.4, 0, 0.2, 1)}
.nb:hover{color:var(--hi);border-color:var(--bhi);background:var(--border)}
.nb.on{color:var(--g);border-color:var(--g);background:var(--gd)}
#rbar{margin-left:auto;display:flex;align-items:center;gap:12px}
#api-pill{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--dim);padding:3px 8px;border-radius:3px;border:1px solid var(--border);cursor:pointer;transition:border-color .2s;background:none}
#api-pill:hover{border-color:var(--bhi);color:var(--tx)}
.apd{width:5px;height:5px;border-radius:50%;background:var(--dim);transition:all .3s}
.apd.live{background:var(--g);box-shadow:0 0 5px var(--g)}
.apd.err{background:var(--r);box-shadow:0 0 5px var(--r)}
.apd.chk{background:var(--a);animation:dp 1s ease-in-out infinite}
#clock{font-size:10px;color:var(--dim);font-variant-numeric:tabular-nums;letter-spacing:.4px}
#mkt-pill{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--dim);padding:3px 8px;border-radius:3px;border:1px solid var(--border);background:none;white-space:nowrap}
.mktd{width:5px;height:5px;border-radius:50%;background:var(--dim);flex-shrink:0;transition:all .3s}
.mktd.open{background:var(--g);box-shadow:0 0 5px var(--g)}
.mktd.pre,.mktd.post{background:var(--a);box-shadow:0 0 4px var(--a)}
.mktd.closed{background:var(--dim)}
/* theme switcher */
#theme-btn{font-size:9px;padding:3px 8px;border-radius:3px;border:1px solid var(--border);background:none;color:var(--dim);transition:all .15s;letter-spacing:.4px;text-transform:uppercase}
#theme-btn:hover{color:var(--hi);border-color:var(--bhi);background:var(--border)}

/* ── LAYOUT ── */
#ws{height:calc(100vh - 68px);display:flex;flex-direction:column;overflow:hidden}
.view{display:none;flex:1;overflow:hidden}
.view.on{display:flex}

/* ══════════════════ CHART VIEW ══════════════════ */
#cv{flex-direction:row}
#cmain{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}

/* symbol bar */
#sb{height:42px;min-height:42px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:10px;flex-shrink:0}
#sw{position:relative;display:flex;align-items:center;gap:6px}
#si{background:var(--border);border:1px solid var(--bhi);color:var(--hi);font-family:var(--sans);font-weight:700;font-size:14px;padding:4px 9px;border-radius:3px;outline:none;width:125px;text-transform:uppercase;letter-spacing:.8px;transition:border-color .15s}
#si:focus{border-color:var(--g)}
#sd{position:absolute;top:calc(100% + 4px);left:0;width:260px;background:color-mix(in srgb, var(--s2) 90%, transparent);backdrop-filter:blur(12px);border:1px solid var(--bhi);border-radius:8px;z-index:100;display:none;overflow:hidden;box-shadow:0 20px 40px -10px rgba(0,0,0,0.6)}
.si-item{padding:8px 11px;cursor:pointer;display:flex;gap:10px;align-items:center;border-bottom:1px solid var(--border);transition:background .1s}
.si-item:last-child{border-bottom:none}
.si-item:hover{background:var(--border)}
.si-sym{font-family:var(--sans);font-weight:700;font-size:12px;color:var(--hi);min-width:65px}
.si-nm{font-size:10px;color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#cpx{display:flex;align-items:baseline;gap:7px}
#px{font-family:var(--sans);font-weight:700;font-size:20px;color:var(--hi)}
#pch{font-size:11px;padding:2px 6px;border-radius:3px}
#pch.up{color:var(--g);background:var(--gd)}
#pch.dn{color:var(--r);background:var(--rd)}
.ohlc{display:flex;gap:10px;margin-left:4px}
.oi{font-size:10px;color:var(--dim)}
.oi b{color:var(--tx)}
/* type badge */
#sym-type{font-size:8px;padding:2px 5px;border-radius:2px;letter-spacing:.5px;text-transform:uppercase;margin-left:2px}
#sym-type.stock{color:var(--b);background:var(--bd);border:1px solid #4da6ff20}
#sym-type.crypto{color:var(--a);background:var(--ad);border:1px solid #ffb54720}
#sym-type.forex{color:var(--p);background:#b490ff0d;border:1px solid #b490ff20}
#sym-type.index{color:var(--dim);background:var(--border);border:1px solid var(--bhi)}

/* toolbar */
#tb{height:35px;min-height:35px;background:var(--bg);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 10px;gap:3px;flex-shrink:0;overflow:hidden}
.tg{display:flex;align-items:center;gap:1px}
.sep{width:1px;height:15px;background:var(--border);margin:0 5px}
.tbtn{font-size:10px;color:var(--dim);background:none;border:1px solid transparent;padding:3px 7px;border-radius:4px;letter-spacing:.3px;transition:all .2s cubic-bezier(0.4, 0, 0.2, 1);white-space:nowrap}
.tbtn:hover{color:var(--hi);background:var(--border)}
.tbtn.on{color:var(--hi);background:var(--bhi);border-color:var(--bhi)}
.tbtn.on.tf{color:var(--a);border-color:var(--a);background:var(--ad)}
.tbtn.ion{color:var(--g);border-color:var(--g);background:var(--gd)}
.tbtn.don{color:var(--p);border-color:var(--p);background:#b490ff0d}
#bt-link{font-size:10px;color:var(--b);background:none;border:1px solid #4da6ff20;padding:3px 9px;border-radius:3px;letter-spacing:.3px;transition:all .12s;margin-left:auto;white-space:nowrap}
#bt-link:hover{background:var(--bd);border-color:var(--b)}

/* chart area */
#ca{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}
.cp{position:relative;width:100%}
#mp{flex:1;min-height:0}
.pl{position:absolute;top:6px;left:9px;font-size:10px;color:var(--dim);letter-spacing:.4px;text-transform:uppercase;z-index:5;pointer-events:none}
.pl span{color:var(--tx);margin-left:5px}
#dc{position:absolute;top:0;left:0;pointer-events:none;z-index:10}
#ce{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;pointer-events:none}
#ce h3{font-family:var(--sans);font-size:14px;color:var(--dim);opacity:.3}
#ce p{font-size:10px;opacity:.15}

/* analytics panel (below chart) */
#analytics-panel{flex-shrink:0;height:200px;min-height:80px;max-height:50vh;display:flex;flex-direction:column;background:var(--surface);border-top:1px solid var(--border);overflow:hidden;position:relative}
#analytics-panel .resize-h-top{position:absolute;top:0;left:0;right:0;height:5px;cursor:ns-resize;z-index:10;transition:background .2s, opacity .2s}
#analytics-panel .resize-h-top:hover{background:var(--g);opacity:.6;box-shadow:0 0 8px var(--g)}
.ap-head{flex-shrink:0;padding:6px 12px;border-bottom:1px solid var(--border);background:var(--bg)}
.ap-title{font-family:var(--sans);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--dim)}
.ap-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:8px 12px}
.ap-scroll::-webkit-scrollbar{width:4px}
.ap-scroll::-webkit-scrollbar-thumb{background:var(--bhi);border-radius:2px}
.ap-section{margin-bottom:12px}
.ap-section:last-child{margin-bottom:0}
.ap-section-title{font-size:9px;letter-spacing:1.2px;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.heatmap{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:4px}
.heat-cell{padding:4px 6px;border-radius:3px;text-align:center;font-size:9px;font-weight:700;background:var(--border);color:var(--tx);transition:opacity .15s}
.heat-cell:hover{opacity:.9}
.heat-cell.pos{background:var(--gd);color:var(--g);border:1px solid var(--gg)}
.heat-cell.neg{background:var(--rd);color:var(--r);border:1px solid #ff3d5a22}
.heat-cell.neu{background:var(--bhi);color:var(--dim)}
.asset-grid{display:flex;flex-wrap:wrap;gap:4px}
.asset-item{display:flex;align-items:center;justify-content:space-between;padding:5px 8px;background:var(--border);border-radius:3px;font-size:10px;border:1px solid transparent;transition:opacity .15s;flex:1 1 auto;min-width:0;max-width:100%;box-sizing:border-box}
.asset-item:hover{opacity:.9}
.asset-item.pos{background:var(--gd);border-color:var(--gg)}
.asset-item.neg{background:var(--rd);border-color:#ff3d5a22}
.asset-item.neu{background:var(--bhi)}
.asset-item .name{color:var(--dim);text-transform:uppercase;letter-spacing:.5px}
.asset-item.pos .name{color:var(--g)}
.asset-item.neg .name{color:var(--r)}
.asset-item .pct{font-weight:700}
.asset-item .pct.up{color:var(--g)}
.asset-item .pct.dn{color:var(--r)}
.industry-list{display:flex;flex-direction:column;gap:2px}
.industry-row{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;background:var(--border);border-radius:2px;font-size:10px}
.industry-row .label{color:var(--tx)}
.industry-row .val{font-weight:700;font-variant-numeric:tabular-nums}
.industry-row .val.up{color:var(--g)}
.industry-row .val.dn{color:var(--r)}

/* ind settings */
#is{position:absolute;top:38px;right:0;width:215px;background:var(--s2);border:1px solid var(--bhi);border-radius:4px;z-index:50;display:none;padding:13px;box-shadow:0 12px 32px #000d}
.ir{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;font-size:11px}
.ir:last-child{margin-bottom:0}
.ir label{font-size:10px;color:var(--dim);letter-spacing:.3px}
.ir input[type=number]{background:var(--border);border:1px solid var(--bhi);color:var(--tx);font-family:var(--mono);font-size:11px;padding:3px 7px;border-radius:3px;width:55px;outline:none}
.ir input:focus{border-color:var(--g)}
.isec{font-family:var(--sans);font-size:10px;color:var(--dim);letter-spacing:1.2px;text-transform:uppercase;padding-bottom:7px;margin-bottom:8px;border-bottom:1px solid var(--border)}

/* ── NEWS SIDEBAR ── */
#ns{width:305px;min-width:180px;max-width:50vw;border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;position:relative}
#ns .resize-h-left{position:absolute;top:0;left:0;bottom:0;width:5px;cursor:ew-resize;z-index:10;transition:background .2s, opacity .2s}
#ns .resize-h-left:hover{background:var(--g);opacity:.6;box-shadow:0 0 8px var(--g)}

/* stream panel */
#sp{border-bottom:1px solid var(--border);flex-shrink:0}
#sh{height:33px;display:flex;align-items:center;padding:0 11px;gap:7px;background:var(--surface);border-bottom:1px solid var(--border)}
.pt{font-family:var(--sans);font-size:9px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--dim)}
#stream-wrap{background:#000;overflow:hidden;transition:height .25s}
#stream-wrap.shut{height:0!important}
#stream-inner{height:160px;position:relative}
#stream-frame{width:100%;height:100%;border:none;display:block}
#stream-blocked{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#000;text-align:center}
#stream-blocked p{font-size:10px;color:var(--dim);line-height:1.6;padding:0 16px}
.open-btn{font-size:9px;padding:5px 12px;background:var(--border);border:1px solid var(--bhi);color:var(--tx);border-radius:3px;text-decoration:none;letter-spacing:.3px;transition:all .15s}
.open-btn:hover{background:var(--bhi)}
#stream-url-row{display:flex;gap:3px;padding:4px 7px;background:var(--surface)}
#sui{flex:1;background:var(--border);border:1px solid var(--bhi);color:var(--tx);font-family:var(--mono);font-size:10px;padding:3px 7px;border-radius:3px;outline:none;min-width:0}
#sui:focus{border-color:var(--g)}
#sui::placeholder{color:var(--dim)}
#stream-url-row button{background:var(--bhi);border:none;color:var(--tx);font-size:11px;padding:3px 8px;border-radius:3px;transition:background .15s;flex-shrink:0}
#stream-url-row button:hover{background:var(--g);color:var(--bg)}
#stream-links{display:flex;gap:4px;padding:4px 7px;background:var(--surface)}
.sl-btn{flex:1;font-size:9px;padding:3px 0;background:var(--border);border:1px solid var(--bhi);color:var(--dim);border-radius:3px;text-align:center;cursor:pointer;transition:all .12s;letter-spacing:.3px;text-transform:uppercase}
.sl-btn:hover{color:var(--hi);border-color:var(--bhi)}
#stog{margin-left:auto;background:none;border:none;color:var(--dim);font-size:13px;padding:2px 5px;border-radius:2px;transition:all .15s}
#stog:hover{background:var(--border);color:var(--hi)}

/* news */
#nh{display:flex;flex-direction:column;padding:6px 11px 5px;gap:4px;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0}
.nhr{display:flex;align-items:center;gap:7px}
.live-badge{font-size:8px;background:var(--gd);color:var(--g);border:1px solid var(--gg);padding:1px 6px;border-radius:20px;margin-left:auto}
#nf{display:flex;gap:2px;flex-wrap:wrap}
.nfb{font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--bhi);background:var(--border);color:var(--dim);transition:all .12s;letter-spacing:.3px;text-transform:uppercase}
.nfb:hover{color:var(--hi)}
.nfb.on{color:var(--g);border-color:var(--g);background:var(--gd)}
#nfeed{flex:1;overflow-y:auto;padding:2px 0}
#nfeed::-webkit-scrollbar{width:2px}
#nfeed::-webkit-scrollbar-thumb{background:var(--bhi);border-radius:2px}
.ni{padding:9px 11px;border-bottom:1px solid var(--border);cursor:pointer;transition:all .2s cubic-bezier(0.4, 0, 0.2, 1);position:relative;border-left:2px solid transparent}
.ni:hover{background:rgba(255,255,255,.02);border-left-color:var(--bhi)}
.ni.urg{border-left:2px solid var(--r)}
.ni.wrn{border-left:2px solid var(--a)}
.nsrc{font-size:9px;color:var(--b);letter-spacing:.4px;text-transform:uppercase;margin-bottom:3px;display:flex;align-items:center;gap:5px}
.nhl{font-size:11px;color:var(--hi);line-height:1.45;font-family:var(--sans);font-weight:700;margin-bottom:4px}
.nmeta{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--dim)}
.ntag{padding:1px 5px;background:var(--border);color:var(--a);border-radius:2px;letter-spacing:.2px}
.tbadge{font-size:8px;padding:1px 4px;border-radius:2px;font-weight:700;letter-spacing:.3px;text-transform:uppercase}
.tbadge.hi{color:var(--r);background:var(--rd);border:1px solid #ff3d5a22}
.tbadge.md{color:var(--a);background:var(--ad);border:1px solid #ffb54722}
.sd{width:5px;height:5px;border-radius:50%;margin-left:auto;flex-shrink:0}
.sd.pos{background:var(--g)}.sd.neg{background:var(--r)}.sd.neu{background:var(--dim)}
@keyframes si{from{opacity:0;transform:translateX(5px)}to{opacity:1;transform:translateX(0)}}
.ni.fr{animation:si .3s ease-out}
#nload{display:flex;flex-direction:column;gap:12px;padding:12px}
.skeleton-item{display:flex;flex-direction:column;gap:6px;padding:9px 0;border-bottom:1px solid var(--border)}
.skeleton-line{height:10px;background:var(--border);border-radius:3px;animation:skel 1.5s ease-in-out infinite}
.skeleton-line.w-40{width:40%}
.skeleton-line.w-80{width:80%}
.skeleton-line.w-full{width:100%}
@keyframes skel{0%,100%{opacity:.4}50%{opacity:.8}}
#news-err{display:none;padding:16px 11px;text-align:center}
#news-err p{font-size:10px;color:var(--dim);line-height:1.7}
#news-err a{color:var(--g);text-decoration:none}

/* ══════════════════ BACKTEST VIEW ══════════════════ */
#bv{flex-direction:row}
#cfgp{width:270px;min-width:180px;max-width:40vw;border-right:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto;background:var(--surface);position:relative}
#cfgp .resize-h-right{position:absolute;top:0;right:0;bottom:0;width:5px;cursor:ew-resize;z-index:10;transition:background .2s, opacity .2s}
#cfgp .resize-h-right:hover{background:var(--g);opacity:.6;box-shadow:0 0 8px var(--g)}
#cfgp::-webkit-scrollbar{width:2px}
#cfgp::-webkit-scrollbar-thumb{background:var(--bhi)}
.cs{padding:12px 13px;border-bottom:1px solid var(--border)}
.ct{font-family:var(--sans);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--dim);margin-bottom:10px}
.cr{display:flex;flex-direction:column;gap:3px;margin-bottom:9px}
.cr:last-child{margin-bottom:0}
.cl{font-size:10px;color:var(--dim);letter-spacing:.2px}
.ci{background:var(--bg);border:1px solid var(--bhi);color:var(--tx);font-family:var(--mono);font-size:11px;padding:5px 9px;border-radius:3px;outline:none;transition:border-color .15s;width:100%}
.ci:focus{border-color:var(--g)}
.ci::placeholder{color:var(--dim)}
select.ci{cursor:pointer}
select.ci option{background:var(--surface)}
.cr.r2{flex-direction:row;gap:6px;align-items:flex-end}
.cr.r2>.cf{flex:1}
#stabs{display:flex;gap:2px;margin-bottom:10px;flex-wrap:wrap}
.st{font-size:9px;padding:3px 7px;border-radius:3px;border:1px solid var(--bhi);background:var(--border);color:var(--dim);transition:all .12s;letter-spacing:.3px;text-transform:uppercase}
.st:hover{color:var(--hi)}
.st.on{color:var(--a);border-color:var(--a);background:var(--ad)}
.pb{display:none}
.pb.vis{display:block}
#ce-editor{background:var(--bg);border:1px solid var(--bhi);color:#c9d0e0;font-family:var(--mono);font-size:10px;padding:9px;border-radius:3px;width:100%;min-height:150px;resize:vertical;outline:none;line-height:1.65;tab-size:2}
#ce-editor:focus{border-color:var(--g)}
.ch{font-size:9px;color:var(--dim);line-height:1.65;margin-top:5px}
#rbtn{width:100%;background:var(--g);color:var(--bg);font-family:var(--mono);font-weight:700;font-size:11px;padding:10px;border:none;border-radius:4px;letter-spacing:1px;text-transform:uppercase;transition:opacity .15s;margin-top:3px}
#rbtn:hover{opacity:.85}
#rbtn:disabled{opacity:.3;cursor:not-allowed}
#rst{font-size:10px;color:var(--dim);margin-top:5px;min-height:14px;text-align:center}
#resp{flex:1;display:flex;flex-direction:column;overflow-y:auto}
#scs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border-bottom:1px solid var(--border);flex-shrink:0}
#scs2{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--border);border-bottom:1px solid var(--border);flex-shrink:0}
.sc{background:var(--surface);padding:9px 13px;display:flex;flex-direction:column;gap:3px}
.sl{font-size:9px;color:var(--dim);letter-spacing:1px;text-transform:uppercase}
.sv{font-family:var(--sans);font-size:16px;font-weight:700;color:var(--hi)}
.sv.pos{color:var(--g)}.sv.neg{color:var(--r)}.sv.neu{color:var(--a)}
.sa{font-size:9px;color:var(--dim)}
#char{flex:1;display:flex;flex-direction:column;overflow:hidden}
.pane{position:relative;border-bottom:1px solid var(--border)}
#ep{flex:1;min-height:0}
#dp{height:115px;min-height:115px}
.plab{position:absolute;top:6px;left:11px;font-size:10px;color:var(--dim);letter-spacing:.4px;text-transform:uppercase;z-index:5;pointer-events:none}
.plab b{color:var(--tx);margin-left:5px;font-weight:400}
#trades{height:145px;min-height:145px;border-top:1px solid var(--border);flex-shrink:0;overflow:hidden;display:flex;flex-direction:column}
#th{height:31px;min-height:31px;display:flex;align-items:center;padding:0 13px;gap:8px;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0}
.ttl{font-family:var(--sans);font-size:9px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--dim)}
#tcnt{font-size:10px;color:var(--dim)}
.xbtn{margin-left:auto;font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--bhi);background:var(--border);color:var(--dim);transition:all .12s;letter-spacing:.3px}
.xbtn:hover{color:var(--g);border-color:var(--g)}
#twrap{flex:1;overflow-y:auto}
#twrap::-webkit-scrollbar{width:2px}
#twrap::-webkit-scrollbar-thumb{background:var(--bhi)}
table{width:100%;border-collapse:collapse}
thead th{font-size:9px;color:var(--dim);letter-spacing:.4px;text-transform:uppercase;padding:5px 13px;text-align:left;background:var(--bg);border-bottom:1px solid var(--border);position:sticky;top:0;font-weight:400}
tbody td{font-size:10px;color:var(--tx);padding:5px 13px;border-bottom:1px solid var(--border)}
tbody tr:hover td{background:rgba(255,255,255,.02)}
.tp.pos{color:var(--g)}.tp.neg{color:var(--r)}
#empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--dim);padding:40px}
#empty h3{font-family:var(--sans);font-size:13px;font-weight:700;opacity:.3;letter-spacing:.5px}
#empty p{font-size:10px;opacity:.18;text-align:center;line-height:1.65}
.th{font-size:9px;color:var(--dim);letter-spacing:.4px;text-transform:uppercase;padding:5px 13px;text-align:left;background:var(--bg);border-bottom:1px solid var(--border);position:sticky;top:0;font-weight:400}

/* ══════════════════ ANALYTICS (inline in backtest) ══════════════════ */
#an-c{padding:18px;border-top:1px solid var(--border)}
#an-hd{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}
#an-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:1400px}
.ac{background:var(--surface);border:1px solid var(--border);border-radius:4px;overflow:hidden}
.ac-h{padding:9px 13px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.ac-t{font-family:var(--sans);font-size:9px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--dim)}
.ac-b{padding:13px}
.ac.wide{grid-column:span 2}
.ac.full{grid-column:span 3}
.mt{width:100%;border-collapse:collapse}
.mt tr{border-bottom:1px solid var(--border)}
.mt tr:last-child{border-bottom:none}
.mt td{padding:5px 0;font-size:11px}
.mt td:last-child{text-align:right;font-family:var(--sans);font-weight:700}
.gb{width:100%;height:5px;background:var(--border);border-radius:3px;overflow:hidden;margin-top:8px}
.gf{height:100%;border-radius:3px;transition:width .7s ease}
.hw{display:flex;align-items:flex-end;gap:2px;height:75px}
.hb{flex:1;border-radius:2px 2px 0 0;min-height:2px;cursor:default}
.hb.p{background:var(--gg);border-top:1px solid var(--g)}
.hb.n{background:var(--rd);border-top:1px solid var(--r)}

/* ══════════════════ STARTUP MODAL ══════════════════ */
#modal{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:300;overflow-y:auto;overflow-x:hidden;padding:20px 0}
#modal-fluid-bg{position:absolute;inset:-100%;pointer-events:none;z-index:0;background:
  radial-gradient(ellipse 70% 50% at 20% 30%,rgba(0,230,118,.18) 0%,transparent 45%),
  radial-gradient(ellipse 60% 45% at 85% 70%,rgba(77,166,255,.14) 0%,transparent 45%),
  radial-gradient(ellipse 55% 40% at 50% 85%,rgba(180,144,255,.12) 0%,transparent 45%),
  radial-gradient(ellipse 50% 35% at 70% 15%,rgba(255,181,71,.08) 0%,transparent 40%);
animation:fluidBg 18s ease-in-out infinite}
#modal-fluid-bg::before{content:'';position:absolute;inset:-50%;background:
  radial-gradient(ellipse 50% 40% at 30% 80%,rgba(0,230,118,.1) 0%,transparent 50%),
  radial-gradient(ellipse 45% 35% at 75% 25%,rgba(77,166,255,.1) 0%,transparent 50%);
animation:fluidBg2 22s ease-in-out infinite reverse}
#modal-fluid-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,var(--bg) 40%,var(--bg) 60%,transparent 100%);opacity:.6;pointer-events:none}
@keyframes fluidBg{0%,100%{transform:translate(0,0) scale(1) rotate(0deg)}25%{transform:translate(8%,-6%) scale(1.08) rotate(2deg)}50%{transform:translate(-5%,4%) scale(0.95) rotate(-1deg)}75%{transform:translate(-8%,-3%) scale(1.05) rotate(1deg)}}
@keyframes fluidBg2{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-10%,8%) scale(1.1)}66%{transform:translate(6%,-5%) scale(0.92)}}
#mbox{position:relative;z-index:1;background:color-mix(in srgb, var(--s2) 90%, transparent);backdrop-filter:blur(12px);border:1px solid var(--bhi);border-radius:12px;padding:26px 28px;width:400px;max-height:calc(100vh - 40px);overflow-y:auto;display:flex;flex-direction:column;gap:10px;margin:auto;box-shadow:0 25px 50px -12px rgba(0,0,0,0.5)}
#mbox h1{font-family:var(--sans);font-size:24px;font-weight:800;color:var(--hi);letter-spacing:-.3px}
#mbox h1 em{color:var(--g);font-style:normal}
.mrow{font-size:11px;color:var(--dim);line-height:1.7}
.mrow a{color:var(--g);text-decoration:none}
.mrow a:hover{text-decoration:underline}
.mkey-hint{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--border);border:1px solid var(--bhi);border-radius:4px;cursor:help;font-size:10px;color:var(--dim);transition:background .15s,border-color .15s}
.mkey-hint:hover{background:var(--bhi);border-color:var(--g);color:var(--tx)}
.mkey-hint-icon{opacity:.8;font-style:italic}
.mkey-hint-text{flex:1}
.mfield-info{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;margin-left:2px;font-size:10px;font-style:italic;color:var(--dim);cursor:help;border-radius:50%;background:var(--border);vertical-align:middle;opacity:1}
.mfield-info:hover{color:var(--g);background:var(--bhi)}
.mnote a{color:var(--g);text-decoration:none}
.mnote a:hover{text-decoration:underline}
.mfield{display:flex;flex-direction:column;gap:3px}
.mfield label{font-size:10px;color:var(--dim);letter-spacing:.3px}
.mfield label span{opacity:.5}
.minput{background:var(--bg);border:1px solid var(--bhi);color:var(--hi);font-family:var(--mono);font-size:11px;padding:7px 10px;border-radius:4px;outline:none;letter-spacing:.7px;transition:border-color .15s;width:100%;box-sizing:border-box}
.minput:focus{border-color:var(--g)}
.minput::placeholder{color:var(--dim);letter-spacing:.3px}
#mtest{display:flex;align-items:center;gap:8px;padding:9px 12px;background:var(--bg);border-radius:4px;border:1px solid var(--border)}
#mtd{width:7px;height:7px;border-radius:50%;background:var(--dim);flex-shrink:0;transition:all .3s}
#mtd.ok{background:var(--g);box-shadow:0 0 6px var(--g)}
#mtd.err{background:var(--r);box-shadow:0 0 6px var(--r)}
#mtd.chk{background:var(--a);animation:dp 1s ease-in-out infinite}
#mtxt{font-size:10px;color:var(--dim)}
.mtest-row{display:flex;gap:6px}
#mtest-btn{font-size:9px;padding:3px 9px;background:var(--border);border:1px solid var(--bhi);color:var(--dim);border-radius:3px;flex-shrink:0;transition:all .15s;letter-spacing:.3px}
#mtest-btn:hover{color:var(--hi);border-color:var(--bhi)}
#mgo{background:var(--g);color:var(--bg);font-family:var(--mono);font-weight:700;font-size:11px;padding:9px;border:none;border-radius:4px;letter-spacing:1px;text-transform:uppercase;transition:opacity .15s;width:100%;opacity:.4;pointer-events:none;box-sizing:border-box}
#mgo.active{opacity:1;pointer-events:all}
#mgo.active:hover{opacity:.87}
.mnote{font-size:10px;color:var(--dim);text-align:center}

/* ══════════════════ "ARE YOU BORED?" ARCADE VIEW ══════════════════ */
#gv{flex-direction:column}
#bored-root{flex:1;display:flex;flex-direction:column;padding:16px 18px;gap:14px;overflow:hidden}
.arcade-header{display:flex;flex-direction:column;gap:6px}
.arcade-title{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-size:18px;font-weight:800;color:var(--hi);letter-spacing:.3px}
.arcade-title span:first-child{text-transform:uppercase;letter-spacing:1.4px;font-size:13px;opacity:.85}
.arcade-pill{font-size:9px;padding:3px 9px;border-radius:999px;border:1px solid var(--bhi);background:linear-gradient(120deg,var(--bd),transparent);color:var(--b);letter-spacing:.5px;text-transform:uppercase}
.arcade-sub{font-size:11px;color:var(--dim);max-width:640px}
.arcade-layout{flex:1;display:flex;gap:12px;min-height:0}
.arcade-left{width:260px;min-width:230px;display:flex;flex-direction:column;gap:10px}
.arcade-right{flex:1;display:flex;flex-direction:column;gap:10px;min-width:0}
.arcade-card{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:11px 13px;display:flex;flex-direction:column;gap:8px;box-shadow:0 10px 30px #0007}
.arcade-card-title{font-family:var(--sans);font-size:10px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--dim)}
.arcade-field{display:flex;flex-direction:column;gap:4px;margin-top:2px}
.arcade-field label{font-size:10px;color:var(--dim);letter-spacing:.4px}
.arcade-hint{font-size:9px;color:var(--dim);opacity:.8}
.arcade-status{font-size:10px;color:var(--dim);margin-top:4px;min-height:14px}
.arcade-status.err{color:var(--r)}
.arcade-status.ok{color:var(--g)}
.arcade-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;max-height:200px;overflow-y:auto}
.arcade-player{display:flex;align-items:center;justify-content:space-between;font-size:10px;padding:5px 7px;border-radius:4px;background:var(--bg);border:1px solid transparent}
.arcade-player.me{border-color:var(--g);background:var(--gd)}
.arcade-player-name{color:var(--hi);font-family:var(--sans);font-size:11px}
.arcade-player-stack{color:var(--dim);font-size:10px}
.arcade-player-state{color:var(--a);font-size:9px}
.arcade-table{flex:1;min-height:0}
.arcade-table-status{font-size:10px;color:var(--dim);margin-bottom:4px}
.arcade-table-view{flex:1;min-height:0;border-radius:6px;background:radial-gradient(circle at top,var(--bd),var(--bg));border:1px solid var(--border);padding:10px;display:flex;flex-direction:column;gap:8px;overflow:hidden}
.arcade-table-placeholder{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:var(--dim)}
.arcade-table-logo{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 0,var(--g),var(--bd));color:#05060a;font-family:var(--sans);font-weight:800;font-size:15px;box-shadow:0 0 18px #00e5a044}
.arcade-howto{font-size:10px;color:var(--dim);line-height:1.75}
.arcade-howto ol{padding-left:17px;margin:4px 0}
.arcade-howto li{margin-bottom:2px}

.bored-table-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr);gap:10px;align-items:flex-start;min-height:0}
.arcade-community{background:color-mix(in srgb,var(--border) 55%,transparent);border-radius:5px;padding:8px;display:flex;flex-direction:column;gap:6px}
.arcade-section-label{font-size:9px;color:var(--dim);letter-spacing:.5px;text-transform:uppercase}
.arcade-cards{display:flex;gap:4px;flex-wrap:wrap}
.card{width:32px;height:44px;border-radius:4px;background:linear-gradient(135deg,#141824,#1f2432);border:1px solid #444b5e;display:flex;align-items:center;justify-content:center;font-size:14px;font-family:var(--sans);color:#f5f6fb;box-shadow:0 8px 18px rgba(0,0,0,.55)}
.card:nth-child(odd){transform:translateY(-1px)}
.card:nth-child(even){transform:translateY(1px)}
.bored-seats{background:color-mix(in srgb,var(--bg) 85%,transparent);border-radius:5px;padding:8px;display:flex;flex-direction:column;gap:6px;overflow-y:auto;max-height:220px}
.bored-seat{border-radius:4px;padding:5px 7px;display:flex;flex-direction:column;gap:3px;border:1px solid transparent;background:rgba(0,0,0,.25)}
.bored-seat.me{border-color:var(--g);background:color-mix(in srgb,var(--gd) 65%, transparent)}
.bored-seat-head{display:flex;align-items:center;justify-content:space-between;font-size:10px}
.seat-name{font-family:var(--sans);font-size:11px;color:var(--hi)}
.seat-meta{font-size:9px;color:var(--dim)}
.bored-seat-cards{display:flex;gap:4px}
.bored-seat-cards .card{width:30px;height:40px}
.bored-actions{margin-top:4px;display:flex;gap:8px;justify-content:flex-start}
.bored-actions-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.bored-actions button{font-size:10px;padding:5px 11px;border-radius:4px;border:1px solid var(--bhi);background:var(--border);color:var(--hi);cursor:pointer;letter-spacing:.4px;text-transform:uppercase;transition:all .15s}
.bored-actions button:hover{background:var(--bhi);border-color:var(--a);color:var(--hi)}
.bored-actions button:last-child{border-color:var(--g);color:var(--g)}
.bored-actions button:last-child:hover{background:var(--gd)}
.bored-actions-amount{width:70px;font-size:10px;padding:4px 6px;border-radius:3px;border:1px solid var(--bhi);background:var(--bg);color:var(--hi);outline:none}
.bored-actions-amount:focus{border-color:var(--g)}
.bored-timer{font-size:9px;color:var(--dim);margin-left:auto;min-width:70px;text-align:right}
.bored-actions-muted{font-size:9px;color:var(--dim);opacity:.8;align-items:center}
.bored-log{margin-top:4px;padding:6px 8px;border-radius:4px;background:rgba(0,0,0,.35);border:1px solid var(--border);font-size:9px;color:var(--dim);max-height:80px;overflow-y:auto}
.bored-log-line{margin-bottom:2px}
.bored-log-line:last-child{margin-bottom:0}
.bored-log-line.muted{opacity:.6}
.bored-mode-toggle{display:flex;gap:4px;margin-top:2px}
.bored-mode-toggle button{font-size:9px;padding:3px 7px;border-radius:3px;border:1px solid var(--bhi);background:var(--border);color:var(--dim);text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .15s}
.bored-mode-toggle button.on{color:var(--g);border-color:var(--g);background:var(--gd)}
.card.hidden{background:linear-gradient(135deg,#20263a,#101320);color:transparent;border-style:dashed}
#bored-graph{margin-top:6px;height:130px;min-height:90px;background:rgba(0,0,0,.35);border-radius:4px;border:1px solid var(--border);position:relative;overflow:hidden}
.bored-graph-label{position:absolute;top:4px;left:8px;font-size:9px;color:var(--dim);letter-spacing:.4px;text-transform:uppercase;z-index:2}

/* ── GAME PICKER ── */
.arcade-picker{display:flex;gap:16px;justify-content:center;padding:40px 16px;flex-wrap:wrap}
.arcade-pick-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:32px 28px;text-align:center;cursor:pointer;transition:all .2s;width:220px}
.arcade-pick-card:hover{border-color:var(--g);background:var(--gd);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.4)}
.arcade-pick-icon{font-size:36px;margin-bottom:12px;letter-spacing:4px}
.arcade-pick-name{font-family:var(--sans);font-size:16px;font-weight:700;color:var(--hi);margin-bottom:6px}
.arcade-pick-desc{font-size:10px;color:var(--dim);line-height:1.5}
.arcade-back-btn{margin-left:auto;font-size:9px;padding:3px 10px;border-radius:3px;border:1px solid var(--border);background:none;color:var(--dim);cursor:pointer;letter-spacing:.3px;transition:all .15s}
.arcade-back-btn:hover{color:var(--hi);border-color:var(--bhi)}

/* ── CHESS ── */
.chess-layout{display:grid;grid-template-columns:minmax(320px,480px) 240px;gap:14px;padding:0 16px;justify-content:center;align-items:start}
@media(max-width:720px){.chess-layout{grid-template-columns:1fr;max-width:480px;margin:0 auto}}
.chess-board-wrap{aspect-ratio:1;max-width:480px;width:100%}
.chess-board{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);width:100%;height:100%;border:2px solid var(--border);border-radius:4px;overflow:hidden;user-select:none}
.chess-sq{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .1s}
.chess-sq.light{background:#b8c0a8}
.chess-sq.dark{background:#6d8a4e}
.chess-sq.selected{background:#f6f668 !important}
.chess-sq.legal::after{content:'';position:absolute;width:30%;height:30%;border-radius:50%;background:rgba(0,0,0,.25)}
.chess-sq.legal:hover{background:rgba(246,246,104,.5) !important}
.chess-sq.last-move{background:rgba(246,246,104,.3) !important}
.chess-piece{font-size:clamp(24px,5vw,42px);line-height:1;pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.3)}
.chess-piece.black{filter:brightness(.15)}
.chess-rank{position:absolute;top:2px;left:3px;font-size:9px;color:rgba(0,0,0,.45);pointer-events:none;font-weight:700}
.chess-file{position:absolute;bottom:1px;right:3px;font-size:9px;color:rgba(0,0,0,.45);pointer-events:none;font-weight:700}
.chess-sidebar{display:flex;flex-direction:column;gap:10px}
.chess-status-text{font-size:12px;color:var(--hi);margin-bottom:8px;font-weight:600}
.chess-new-btn{font-size:10px;padding:6px 14px;border-radius:4px;border:1px solid var(--border);background:var(--surface);color:var(--dim);cursor:pointer;transition:all .15s;letter-spacing:.3px}
.chess-new-btn:hover{color:var(--hi);border-color:var(--g);background:var(--gd)}
.chess-moves-list{font-size:10px;color:var(--dim);max-height:200px;overflow-y:auto;white-space:pre-wrap;font-family:'IBM Plex Mono',monospace;line-height:1.7}

/* ── SUDOKU ── */
.sudoku-layout{display:grid;grid-template-columns:200px 1fr;gap:14px;padding:0 16px;align-items:start}
@media(max-width:640px){.sudoku-layout{grid-template-columns:1fr}}
.sudoku-sidebar{display:flex;flex-direction:column;gap:10px}
.sudoku-board-wrap{display:flex;justify-content:center}
.sudoku-board{display:grid;grid-template-columns:repeat(9,1fr);width:min(100%,396px);aspect-ratio:1;border:2px solid var(--hi);border-radius:4px;overflow:hidden;user-select:none}
.sudoku-cell{display:flex;align-items:center;justify-content:center;font-size:clamp(14px,3vw,20px);font-family:var(--sans);font-weight:600;color:var(--b);cursor:pointer;border:1px solid var(--border);transition:background .1s;aspect-ratio:1}
.sudoku-cell.given{color:var(--hi);font-weight:800}
.sudoku-cell.selected{background:rgba(0,229,160,.22) !important}
.sudoku-cell.zone{background:rgba(255,255,255,.025)}
.sudoku-cell.highlight{background:rgba(77,166,255,.14)}
.sudoku-cell.error{color:var(--r) !important;background:rgba(255,60,60,.08)}
.sudoku-cell.box-left{border-left:2px solid var(--hi)}
.sudoku-cell.box-top{border-top:2px solid var(--hi)}
.sudoku-cell:hover{background:rgba(255,255,255,.04)}
.sudoku-diff-btns{display:flex;gap:4px;flex-wrap:wrap}
.sudoku-diff-btns button{font-size:9px;padding:3px 7px;border-radius:3px;border:1px solid var(--bhi);background:var(--border);color:var(--dim);text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .15s}
.sudoku-diff-btns button.on{color:var(--g);border-color:var(--g);background:var(--gd)}
.sudoku-new-btn{font-size:10px;padding:6px 14px;border-radius:4px;border:1px solid var(--border);background:var(--surface);color:var(--dim);cursor:pointer;transition:all .15s;letter-spacing:.3px;margin-top:6px}
.sudoku-new-btn:hover{color:var(--hi);border-color:var(--g);background:var(--gd)}
.sudoku-timer{font-size:14px;color:var(--hi);font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums;margin-top:4px}
.sudoku-numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.sudoku-numpad button{font-size:14px;padding:8px;border-radius:4px;border:1px solid var(--border);background:var(--surface);color:var(--hi);cursor:pointer;transition:all .15s;font-family:var(--sans);font-weight:600}
.sudoku-numpad button:hover{border-color:var(--g);background:var(--gd);color:var(--g)}
.sudoku-erase-btn{font-size:9px;padding:5px 10px;border-radius:3px;border:1px solid var(--border);background:none;color:var(--dim);cursor:pointer;margin-top:4px;transition:all .15s}
.sudoku-erase-btn:hover{color:var(--r);border-color:var(--r)}
.sudoku-msg{font-size:11px;color:var(--dim);padding:6px 0}
.sudoku-msg.sudoku-win{color:var(--g);font-weight:700;font-size:12px}

/* ── MONDRIAN BLOCKS ── */
.mondrian-layout{display:grid;grid-template-columns:1fr 240px;gap:14px;padding:0 16px;align-items:start}
@media(max-width:640px){.mondrian-layout{grid-template-columns:1fr}}
.mondrian-board-wrap{display:flex;justify-content:center}
.mondrian-board{display:grid;width:min(100%,420px);aspect-ratio:1;border:2.5px solid var(--hi);border-radius:4px;overflow:hidden;user-select:none;background:var(--bg)}
.mondrian-cell{border:1px solid rgba(255,255,255,.07);cursor:pointer;transition:background .12s;position:relative;box-sizing:border-box}
.mondrian-cell:hover{background:rgba(255,255,255,.05)}
.mondrian-cell.mondrian-start{background:rgba(0,229,160,.28) !important;box-shadow:inset 0 0 0 2px var(--g)}
.mondrian-cell.mondrian-preview{background:rgba(77,166,255,.16) !important}
.mondrian-sidebar{display:flex;flex-direction:column;gap:10px}
.mondrian-score{font-size:13px;color:var(--hi);font-weight:600}
.mondrian-score.mondrian-win{color:var(--g)}
.mondrian-score.mondrian-err{color:var(--r)}
.mondrian-filled{font-size:10px;color:var(--dim);margin-top:2px}
.mondrian-blocks{display:flex;flex-direction:column;gap:3px;max-height:180px;overflow-y:auto}
.mondrian-block-tag{font-size:10px;color:var(--dim);padding:3px 8px;background:rgba(0,0,0,.25);border-radius:3px}
.mondrian-action-btn{font-size:10px;padding:6px 14px;border-radius:4px;border:1px solid var(--border);background:var(--surface);color:var(--dim);cursor:pointer;transition:all .15s;letter-spacing:.3px}
.mondrian-action-btn:hover{color:var(--a);border-color:var(--a)}
.mondrian-action-btn.mondrian-reset:hover{color:var(--r);border-color:var(--r)}

/* ── CALENDAR VIEW ── */
.cal-wrap{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:10px 12px;gap:10px}
.cal-inner{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;width:100%;gap:10px}

/* map */
.cal-map-wrap{flex-shrink:0;position:relative;border:1px solid var(--border);border-radius:6px;overflow:hidden}
.cal-map{height:42vh;min-height:220px;max-height:420px;width:100%;background:#0b0d12}
.cal-map-hint{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);z-index:600;font-size:9px;color:var(--dim);background:rgba(0,0,0,.7);padding:3px 10px;border-radius:3px;pointer-events:none;opacity:.8}

/* map dot markers */
.cal-map-icon{background:none !important;border:none !important}
.cal-map-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff;cursor:pointer;transition:transform .15s}
.cal-map-dot:hover{transform:scale(1.3)}

/* marker clusters */
.cal-cluster{border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;border:2px solid rgba(255,255,255,.25)}
.cal-cluster-small{background:rgba(40,200,100,.85);width:32px;height:32px}
.cal-cluster-medium{background:rgba(255,180,40,.85);width:38px;height:38px}
.cal-cluster-large{background:rgba(255,60,60,.85);width:44px;height:44px}
.cal-cluster span{display:block;text-align:center;line-height:1}

/* leaflet popup override for dark theme */
.cal-popup-container .leaflet-popup-content-wrapper{background:var(--surface,#0b0d12);color:var(--hi,#dde2f0);border:1px solid var(--border,#181c24);border-radius:6px;box-shadow:0 8px 32px rgba(0,0,0,.6);font-family:'IBM Plex Mono',monospace}
.cal-popup-container .leaflet-popup-tip{background:var(--surface,#0b0d12);border:1px solid var(--border,#181c24)}
.cal-popup-container .leaflet-popup-close-button{color:var(--dim,#3d4455)}
.cal-popup-container .leaflet-popup-close-button:hover{color:var(--hi,#dde2f0)}
.cal-popup-container .leaflet-popup-content{margin:10px 14px;font-size:11px}
.cal-popup-head{font-size:13px;font-weight:700;margin-bottom:8px;letter-spacing:.3px}
.cal-popup-section{font-size:9px;text-transform:uppercase;letter-spacing:.6px;color:var(--dim,#3d4455);margin:8px 0 4px;padding-top:6px;border-top:1px solid var(--border,#181c24)}
.cal-popup-section:first-of-type{border-top:none;margin-top:0;padding-top:0}
.cal-popup-row{display:flex;align-items:center;gap:8px;padding:2px 0;font-size:10px}
.cal-popup-date{min-width:72px;font-variant-numeric:tabular-nums;font-weight:600}
.cal-popup-ev{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-popup-val{color:var(--dim,#3d4455);font-size:9px;flex-shrink:0}
.cal-popup-more{font-size:9px;color:var(--dim);margin-top:4px;opacity:.7}

/* 3-column grid */
.cal-grid{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;overflow:hidden}
@media(max-width:900px){.cal-grid{grid-template-columns:1fr;overflow-y:auto}}
.cal-col{display:flex;flex-direction:column;min-height:0;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:6px}
.cal-col-head{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--border);flex-shrink:0}
.cal-col-icon{font-size:13px}
.cal-col-label{font-size:11px;font-weight:700;color:var(--hi);letter-spacing:.3px;text-transform:uppercase}
.cal-col-body{flex:1;min-height:0;overflow-y:auto;padding:10px 12px}

/* list items */
.cal-list{list-style:none;margin:0;padding:0}
.cal-item{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;padding:5px 6px;border-bottom:1px solid var(--border);font-size:11px;border-radius:3px;border-left:3px solid transparent;transition:background .15s,border-color .15s}
.cal-item:last-child{border-bottom:none}
.cal-item:hover{background:rgba(255,255,255,.02)}
.cal-date{font-size:10px;min-width:82px;font-variant-numeric:tabular-nums}
.cal-title{color:var(--hi);flex:1;min-width:0}
.cal-meta{color:var(--dim);font-size:10px}
.cal-empty,.cal-loading{color:var(--dim);font-size:11px;padding:12px 0}

/* heat classes */
.cal-item.cal-hot{border-left-color:var(--r);background:rgba(255,60,60,.06)}
.cal-item.cal-hot .cal-date{color:var(--r);font-weight:700}
.cal-item.cal-warm{border-left-color:var(--a);background:rgba(255,180,40,.04)}
.cal-item.cal-warm .cal-date{color:var(--a)}
.cal-item.cal-cool{border-left-color:var(--g);background:rgba(40,200,100,.04)}
.cal-item.cal-cool .cal-date{color:var(--g)}
.cal-item.cal-past{border-left-color:var(--border);opacity:.5}
.cal-item.cal-past .cal-date{color:var(--dim)}

/* legend bar */
.cal-legend{display:flex;align-items:center;gap:8px;padding:4px 4px 0;font-size:9px;color:var(--dim);flex-shrink:0}
.cal-legend-dot{width:8px;height:8px;border-radius:2px;display:inline-block}
.cal-legend-dot.cal-hot{background:var(--r)}
.cal-legend-dot.cal-warm{background:var(--a)}
.cal-legend-dot.cal-cool{background:var(--g)}
.cal-legend-dot.cal-past{background:var(--border)}

/* SEC sub-sections */
.cal-sec-company{margin-bottom:12px}
.cal-sec-name{font-size:10px;font-weight:700;color:var(--hi);margin-bottom:4px;letter-spacing:.3px}
.cal-link{font-size:10px;color:var(--b);text-decoration:none}
.cal-link:hover{text-decoration:underline}

/* ── STUDY VIEW (injected from pmt-study.html, themed with terminal vars) ── */
#sv { flex-direction: column; }
.study-wrap{flex:1;min-height:0;overflow-y:auto;padding:20px 24px 40px;max-width:1120px;margin:0 auto;width:100%}
.study-wrap header h1{font-family:'Syne',sans-serif;font-size:24px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--hi);margin-bottom:6px}
.study-wrap header p{color:var(--dim);font-size:12px;max-width:640px;line-height:1.6}
.study-wrap .grid{margin-top:20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.study-wrap .study-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:14px 14px 12px;display:flex;flex-direction:column;gap:8px;width:auto;height:auto;box-shadow:none}
.study-wrap .study-card h2{font-family:'Syne',sans-serif;font-size:13px;letter-spacing:.8px;text-transform:uppercase;color:var(--hi);display:flex;align-items:center;gap:8px}
.study-wrap .tag{font-size:9px;padding:2px 7px;border-radius:999px;border:1px solid var(--border);color:var(--dim)}
.study-wrap .study-card ul{list-style:none;display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--dim)}
.study-wrap .study-card li span.label{font-weight:700;color:var(--hi)}
.study-wrap .pill-links{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
.study-wrap .pill-links a{font-size:10px;padding:3px 8px;border-radius:999px;border:1px solid var(--border);background:var(--bg);color:var(--dim);text-decoration:none;transition:all .15s}
.study-wrap .pill-links a:hover{border-color:var(--bhi);color:var(--hi);background:var(--surface)}
.study-wrap .note{margin-top:14px;font-size:10px;color:var(--dim);opacity:.7}

/* ── ORDER BOOK ── */
.ob-panel{display:flex;flex-direction:column;gap:8px}
.ob-tabs{display:flex;gap:4px;flex-wrap:wrap}
.ob-tab{font-size:9px;padding:3px 10px;border-radius:3px;border:1px solid var(--border);background:none;color:var(--dim);cursor:pointer;letter-spacing:.3px;transition:all .15s}
.ob-tab:hover{color:var(--hi);border-color:var(--bhi)}
.ob-tab.on{color:var(--hi);border-color:var(--bhi);background:var(--surface)}
.ob-body{display:flex;flex-direction:column;gap:8px}
.ob-stats{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:10px;color:var(--dim)}
.ob-stat{display:flex;align-items:center;gap:4px}
.ob-stat-label{color:var(--dim);font-size:9px;text-transform:uppercase;letter-spacing:.4px}
.ob-stat-val{color:var(--hi);font-weight:600;font-variant-numeric:tabular-nums}
.ob-stat-val.up{color:var(--g)}
.ob-stat-val.dn{color:var(--r)}
.ob-depth-wrap{border:1px solid var(--border);border-radius:4px;overflow:hidden;background:rgba(0,0,0,.25)}
#ob-depth-canvas{display:block;width:100%;height:180px}
.ob-book-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
@media(max-width:600px){.ob-book-grid{grid-template-columns:1fr}}
.ob-side{border:1px solid var(--border);border-radius:4px;overflow:hidden}
.ob-side-head{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:5px 8px;border-bottom:1px solid var(--border);color:var(--dim)}
.ob-bid-head{background:rgba(40,200,100,.06)}
.ob-ask-head{background:rgba(255,60,60,.06)}
.ob-rows{max-height:200px;overflow-y:auto}
.ob-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;padding:2px 8px;font-size:10px;font-variant-numeric:tabular-nums;position:relative;border-left:2px solid transparent;transition:all .15s}
.ob-row:hover{background:rgba(255,255,255,.03);border-left-color:var(--bhi)}
.ob-row:nth-child(even){background:rgba(255,255,255,.01)}
.ob-row-bar{position:absolute;top:0;bottom:0;opacity:.08;pointer-events:none;border-radius:1px}
.ob-bids .ob-row-bar{right:0;background:var(--g)}
.ob-asks .ob-row-bar{left:0;background:var(--r)}
.ob-row .ob-price{font-weight:600}
.ob-bids .ob-price{color:var(--g)}
.ob-asks .ob-price{color:var(--r)}
.ob-row .ob-qty{color:var(--dim)}
.ob-row .ob-total{color:var(--dim);text-align:right;font-size:9px}
.ob-note{font-size:9px;color:var(--dim);opacity:.6;padding:4px 0}

/* ══════════════════ COMMAND BAR ══════════════════ */
#cmd-bar{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-start;justify-content:center;padding-top:18vh}
.cmd-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(4px)}
.cmd-box{position:relative;width:100%;max-width:520px;background:color-mix(in srgb, var(--surface) 85%, transparent);backdrop-filter:blur(12px);border:1px solid var(--bhi);border-radius:12px;box-shadow:0 25px 50px -12px rgba(0,0,0,0.5);overflow:hidden}
#cmd-input{width:100%;padding:14px 18px;font-size:14px;font-family:'IBM Plex Mono',monospace;background:transparent;border:none;color:var(--hi);outline:none;box-sizing:border-box}
#cmd-input::placeholder{color:var(--dim);opacity:.7}
.cmd-results{max-height:320px;overflow-y:auto;border-top:1px solid var(--border)}
.cmd-results:empty{border-top:none}
.cmd-item{display:flex;align-items:center;gap:10px;padding:10px 18px;cursor:pointer;transition:background .1s;font-size:12px;font-family:'IBM Plex Mono',monospace;color:var(--dim)}
.cmd-item:hover,.cmd-item.sel{background:var(--bhi);color:var(--hi)}
.cmd-item .cmd-label{flex:1;color:inherit}
.cmd-item .cmd-hint{font-size:9px;color:var(--dim);opacity:.7;text-transform:uppercase;letter-spacing:.4px}
.cmd-item .cmd-icon{font-size:14px;width:22px;text-align:center;opacity:.7}

/* ── CMD INFO ICON next to search ── */
#cmd-info{position:relative;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--border);background:none;color:var(--dim);cursor:pointer;font-size:10px;font-weight:700;font-family:var(--sans);flex-shrink:0;transition:all .15s}
#cmd-info:hover{border-color:var(--bhi);color:var(--hi)}
.cmd-info-icon{pointer-events:none}
.cmd-info-tip{display:none;position:absolute;top:calc(100% + 8px);right:-10px;width:240px;padding:10px 12px;border-radius:6px;background:var(--surface);border:1px solid var(--bhi);box-shadow:0 8px 24px rgba(0,0,0,.5);font-size:10px;color:var(--dim);line-height:1.6;z-index:100;white-space:normal;text-align:left}
.cmd-info-tip kbd{display:inline-block;padding:1px 5px;border-radius:3px;border:1px solid var(--border);background:var(--bg);font-size:9px;color:var(--hi);font-family:'IBM Plex Mono',monospace}
#cmd-info:hover .cmd-info-tip{display:block}

/* ══════════════════ HOTKEY CHEAT SHEET ══════════════════ */
#hotkey-sheet{position:fixed;inset:0;z-index:9998;display:flex;align-items:center;justify-content:center}
.hk-box{position:relative;background:var(--surface);border:1px solid var(--bhi);border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.6);padding:24px 28px;min-width:300px}
.hk-title{font-family:var(--sans);font-size:14px;font-weight:800;color:var(--hi);letter-spacing:.5px;text-transform:uppercase;margin-bottom:16px}
.hk-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px}
.hk-row{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--dim);padding:4px 0}
.hk-row kbd{display:inline-block;min-width:28px;padding:3px 8px;border-radius:4px;border:1px solid var(--border);background:var(--bg);font-size:10px;color:var(--hi);font-family:'IBM Plex Mono',monospace;text-align:center}
.hk-hint{margin-top:16px;font-size:9px;color:var(--dim);opacity:.6;text-align:center}
.hk-hint kbd{display:inline-block;padding:1px 5px;border-radius:3px;border:1px solid var(--border);background:var(--bg);font-size:9px;color:var(--hi);font-family:'IBM Plex Mono',monospace}

/* ══════════════════ YIELD CURVE ══════════════════ */
.yield-panel{display:flex;flex-direction:column;gap:8px}
.yield-chart{height:180px;border-radius:4px;overflow:hidden;background:rgba(0,0,0,.2);border:1px solid var(--border);position:relative}
.yield-table{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:4px}
.yield-cell{text-align:center;padding:6px 4px;border-radius:4px;background:rgba(0,0,0,.2);border:1px solid var(--border)}
.yield-cell .yield-tenor{font-size:8px;color:var(--dim);text-transform:uppercase;letter-spacing:.4px}
.yield-cell .yield-val{font-size:13px;font-weight:700;color:var(--hi);font-variant-numeric:tabular-nums;margin-top:2px}
.yield-cell .yield-chg{font-size:9px;margin-top:1px}
.yield-cell .yield-chg.up{color:var(--g)}
.yield-cell .yield-chg.dn{color:var(--r)}
.yield-cell.inverted{border-color:var(--r);background:rgba(255,60,60,.06)}
.yield-cell.inverted .yield-val{color:var(--r)}
.yield-inversion-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:9px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;background:rgba(255,60,60,.15);color:var(--r);border:1px solid rgba(255,60,60,.3);margin-bottom:6px}

/* ══════════════════ ECONOMIC INDICATORS ══════════════════ */
.econ-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.econ-card{padding:10px;border-radius:6px;background:rgba(0,0,0,.2);border:1px solid var(--border);display:flex;flex-direction:column;gap:4px}
.econ-card .econ-name{font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.4px}
.econ-card .econ-row{display:flex;align-items:center;gap:6px}
.econ-card .econ-val{font-size:16px;font-weight:700;color:var(--hi);font-variant-numeric:tabular-nums}
.econ-card .econ-arrow{font-size:12px}
.econ-card .econ-arrow.up{color:var(--g)}
.econ-card .econ-arrow.dn{color:var(--r)}
.econ-card .econ-arrow.flat{color:var(--dim)}
.econ-card .econ-spark{height:24px;flex-shrink:0}
.econ-card .econ-sub{font-size:8px;color:var(--dim);opacity:.7}

