/* ══════════════════════════════════════════════════════════════════════
   components.css — reusable UI component styles
   ══════════════════════════════════════════════════════════════════════ */

/* ── noUiSlider theme ── */
.noUi-target{background:var(--bg5,#e8e6de);border-radius:4px;border:1px solid var(--border,#ddd);box-shadow:none;height:5px}
.noUi-connect{background:var(--indigo,#4f46e5)}
.noUi-handle{width:14px!important;height:14px!important;right:-7px!important;top:-5px!important;background:var(--indigo,#4f46e5);border:2px solid #fff;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.22);cursor:grab}
.noUi-handle:active{cursor:grabbing}
.noUi-handle::before,.noUi-handle::after{display:none}

/* ── Custom select (csel) — dropdown uses position:fixed so it always overflows containers ── */
.csel{position:relative;width:100%}
.csel-btn{display:flex;align-items:center;width:100%;padding:.42rem 2rem .42rem .75rem;background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2);color:var(--t1);font-size:13px;font-family:'DM Sans',sans-serif;cursor:pointer;outline:none;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;box-sizing:border-box}
.csel-btn:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow,rgba(79,70,229,.14))}
.csel-arr{font-family:'Material Icons Round';font-size:16px;color:var(--t4);position:absolute;right:8px;top:50%;transform:translateY(-50%);pointer-events:none}
/* pill variant for .is selects (auto-refresh) */
.csel-pill .csel-btn{border-radius:20px;padding:.25rem 1.8rem .25rem .65rem;font-size:12px;height:auto}
.csel-drop{position:fixed;background:var(--bg3,#fff);border:1px solid var(--border,#ddd);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.13);z-index:9999;display:none;min-width:120px;max-height:320px;overflow-y:auto;padding:4px}
.csel-drop.open{display:block}
.csel-drop.has-search{overflow-y:hidden;display:none;flex-direction:column;padding:0}
.csel-drop.has-search.open{display:flex}
.csel-search-wrap{padding:6px 6px 4px;border-bottom:1px solid var(--border,#ddd);flex-shrink:0;background:var(--bg3,#fff);border-radius:10px 10px 0 0;position:sticky;top:0}
.csel-search-inp{width:100%;box-sizing:border-box;padding:.32rem .65rem;font-size:12px;font-family:'DM Sans',sans-serif;border:1px solid var(--border,#ddd);border-radius:6px;background:var(--bg2,#f8f8f8);color:var(--t1);outline:none}
.csel-search-inp:focus{border-color:var(--indigo);box-shadow:0 0 0 2px var(--indigo-glow,rgba(79,70,229,.14))}
.csel-opts-list{overflow-y:auto;max-height:260px;padding:4px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
.csel-drop{touch-action:pan-y}
.csel-opt{padding:.36rem .65rem;font-size:13px;font-family:'DM Sans',sans-serif;color:var(--t1);cursor:pointer;border-radius:6px;transition:background .12s}
.csel-opt:hover{background:var(--indigo-soft,rgba(79,70,229,.07))}
.csel-opt.csel-active{background:var(--indigo-mid,rgba(79,70,229,.12));color:var(--indigo,#4f46e5);font-weight:500}
.csel-no-results{padding:.5rem .65rem;font-size:12px;color:var(--t4);font-style:italic}
select.fsel-backing,select.is-backing{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important;overflow:hidden!important}

/* ── Go-to-top rocket button (spsGoTop style) ── */
#go-top-btn{
  position:fixed;bottom:2.8rem;right:2.8rem;z-index:9000;
  width:46px;height:46px;border-radius:50%;border:2px solid var(--fg-on-accent);cursor:pointer;
  background:var(--indigo);color:var(--fg-on-accent);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 20px rgba(79,70,229,.45), 0 2px 8px rgba(0,0,0,.18);
  opacity:0;pointer-events:none;
  transition:opacity .28s ease, transform .28s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease;
  font-size:22px;line-height:1;
}
#go-top-btn.visible{opacity:1;pointer-events:auto;}
#go-top-btn:hover{
  transform:translateY(-4px) scale(1.1);
  background:var(--indigo-dim);
  box-shadow:0 8px 28px rgba(79,70,229,.55), 0 2px 8px rgba(0,0,0,.2);
}
#go-top-btn:active{transform:scale(.92);}

/* ── Right Controlbar ─────────────────────────────────────────────── */
#ctrlbar-overlay{
  position:fixed;inset:0;z-index:1100;background:rgba(0,0,0,.0);pointer-events:none;
  transition:background .25s ease;
}
#ctrlbar-overlay.open{background:rgba(0,0,0,.28);pointer-events:auto;}
#ctrlbar{
  position:fixed;top:0;right:0;bottom:0;width:300px;z-index:1101;
  background:var(--bg3);border-left:1px solid var(--border);
  box-shadow:-6px 0 32px rgba(0,0,0,.14);
  display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
#ctrlbar.open{transform:translateX(0);}
.cb-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:.9rem 1.1rem .75rem;border-bottom:1px solid var(--border);
  flex-shrink:0;
}
.cb-head-title{font-weight:600;font-size:14px;color:var(--t1);display:flex;align-items:center;gap:.45rem;}
.cb-close{width:30px;height:30px;border:none;background:none;cursor:pointer;
  color:var(--t3);display:flex;align-items:center;justify-content:center;border-radius:6px;}
.cb-close:hover{background:var(--bg4);color:var(--t1);}
/* pill tabs */
.cb-tabs{display:flex;gap:.35rem;padding:.65rem .9rem .55rem;border-bottom:1px solid var(--border);flex-shrink:0;}
.cb-tab{flex:1;padding:.35rem .5rem;border:1px solid var(--border);border-radius:20px;
  background:none;cursor:pointer;font-size:12px;font-weight:500;color:var(--t3);
  transition:all .15s;text-align:center;}
.cb-tab.active{background:var(--indigo);color:#fff;border-color:var(--indigo);}
.cb-tab:not(.active):hover{background:var(--bg4);color:var(--t1);}
/* colored active states for named pill tabs */
.cb-tab--alerts{position:relative;}
.cb-tab--alerts.active{background:var(--rose);border-color:var(--rose);}
.cb-tab--tools.active{background:var(--amber);border-color:var(--amber);}
.cb-tab--info.active{background:var(--rose);border-color:var(--rose);}
/* notification badge dot */
.cb-notif-dot{position:absolute;top:5px;right:5px;width:7px;height:7px;border-radius:50%;background:var(--rose);display:none;}
.cb-notif-dot.active{display:block;}
/* section separator inside panes */
.cb-sep{height:1px;background:var(--border);margin:.6rem 0;}
/* body */
.cb-body{flex:1;overflow-y:auto;padding:1rem 1.1rem;display:flex;flex-direction:column;gap:1.1rem;}
.cb-pane{display:none;flex-direction:column;gap:1.1rem;}
.cb-pane.active{display:flex;}
/* section */
.cb-section{}
.cb-label{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--t4);margin-bottom:.55rem;}
/* accent swatches */
.accent-grid{display:flex;gap:.5rem;flex-wrap:nowrap;align-items:center;}
.accent-swatch{width:32px;height:32px;border-radius:50%;cursor:pointer;border:3px solid transparent;
  transition:transform .15s,border-color .15s;flex-shrink:0;}
.accent-swatch:hover{transform:scale(1.12);}
.accent-swatch.active{border-color:var(--t1);}
/* density pills */
.density-pills{display:flex;gap:.4rem;}
.d-pill{flex:1;padding:.38rem .5rem;border:1px solid var(--border);border-radius:20px;
  background:none;cursor:pointer;font-size:12px;color:var(--t3);text-align:center;
  transition:all .15s;}
.d-pill.active{background:var(--indigo);color:#fff;border-color:var(--indigo);}
.d-pill:not(.active):hover{background:var(--bg4);color:var(--t1);}
/* notification panel */
.notif-section-head{font-size:10.5px;font-weight:700;color:var(--t4);text-transform:uppercase;
  letter-spacing:.07em;margin-bottom:.3rem;}
.notif-wl-chip{font-size:10.5px;padding:2px 7px;border-radius:20px;
  background:var(--indigo-soft);color:var(--indigo);border:1px solid var(--indigo-mid);}
.notif-test-btn{margin-left:auto;font-size:10.5px;color:var(--indigo);
  border:1px solid var(--indigo-mid);border-radius:4px;padding:1px 6px;cursor:pointer;
  background:none;font-family:inherit;flex-shrink:0;}
.notif-test-btn:hover{background:var(--indigo-soft);}
/* utility buttons in cb */
.cb-btn{width:100%;padding:.5rem .75rem;border-radius:8px;border:1px solid var(--border);
  background:var(--bg4);cursor:pointer;font-size:13px;color:var(--t1);font-weight:500;
  display:flex;align-items:center;gap:.5rem;transition:all .15s;}
.cb-btn:hover{background:var(--indigo-soft);border-color:var(--indigo-mid);color:var(--indigo);}
.cb-btn .mi{font-size:16px;}
/* density CSS hooks */
body[data-density="compact"]  table.dt tbody td,
body[data-density="compact"]  table.dt thead th { padding:.28rem .6rem; }
body[data-density="comfortable"] table.dt tbody td,
body[data-density="comfortable"] table.dt thead th { padding:.8rem 1.1rem; }

/* ── About modal ── */
#about-modal{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;}
#about-modal.open{display:flex;}
#about-overlay{position:absolute;inset:0;background:rgba(0,0,0,.35);}
#about-box{position:relative;z-index:1;background:var(--bg3);border-radius:var(--r);
  border:1px solid var(--border);box-shadow:var(--sh3);width:min(440px,92vw);padding:1.5rem 1.6rem;}
.about-title{font-size:15px;font-weight:700;color:var(--t1);margin-bottom:1rem;
  display:flex;align-items:center;gap:.5rem;}
.about-close{position:absolute;top:.85rem;right:.9rem;width:28px;height:28px;border:none;
  background:none;cursor:pointer;color:var(--t3);border-radius:6px;display:flex;align-items:center;justify-content:center;}
.about-close:hover{background:var(--bg4);color:var(--t1);}
.kb-grid{display:grid;grid-template-columns:auto 1fr;gap:.35rem .9rem;font-size:12.5px;}
.kb-key{background:var(--bg4);border:1px solid var(--border);border-radius:5px;
  padding:.15rem .45rem;font-family:'DM Mono',monospace;font-size:11px;color:var(--t2);white-space:nowrap;justify-self:start;}
.kb-desc{color:var(--t3);align-self:center;}
.about-sep{height:1px;background:var(--border);margin:.75rem 0;}

/* ── Keyboard shortcut row focus ── */
table.dt tbody tr.kb-focused{background:var(--indigo-soft)!important;outline:2px solid var(--indigo);outline-offset:-2px;}

/* ── Chord leader hint (bottom-center) ── */
#kb-chord-hint{
  position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(12px);
  z-index:9950;opacity:0;pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;
  display:flex;align-items:stretch;border-radius:10px;overflow:hidden;
  background:var(--bg3);border:1px solid var(--border2);
  box-shadow:0 8px 32px rgba(0,0,0,.2);
}
#kb-chord-hint.visible{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto;}
.kch-leader{background:var(--indigo);color:#fff;padding:.5rem .85rem;
  font-size:12px;font-weight:600;display:flex;align-items:center;gap:.4rem;
  font-family:'DM Mono',monospace;white-space:nowrap;}
.kch-grid{display:grid;grid-template-columns:repeat(4,auto);padding:.3rem .5rem;gap:0;}
.kch-item{display:flex;align-items:center;gap:.3rem;padding:.22rem .45rem;border-radius:6px;}
.kch-key{font-family:'DM Mono',monospace;font-size:11px;font-weight:600;
  background:var(--indigo-soft);color:var(--indigo);border:1px solid var(--indigo-mid);
  border-radius:4px;padding:.08rem .35rem;min-width:17px;text-align:center;}
.kch-lbl{font-size:11.5px;color:var(--t3);white-space:nowrap;}

/* ── Action feedback toast (bottom-right) ── */
#kb-action-toast{
  position:fixed;bottom:1.5rem;right:5rem;z-index:9950;
  display:flex;align-items:center;gap:.55rem;
  background:var(--bg3);border:1px solid var(--border2);border-radius:8px;
  padding:.42rem .8rem;box-shadow:0 4px 18px rgba(0,0,0,.15);
  opacity:0;transform:translateY(6px);pointer-events:none;
  transition:opacity .16s ease,transform .16s ease;
}
#kb-action-toast.visible{opacity:1;transform:translateY(0);}
.kba-icon{width:20px;height:20px;border-radius:5px;background:var(--indigo-soft);
  color:var(--indigo);display:flex;align-items:center;justify-content:center;font-size:13px;}
.kba-msg{font-size:12px;font-weight:500;color:var(--t1);}

/* ── Keyboard help modal ── */
#kbd-help-modal{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;}
#kbd-help-modal.open{display:flex;}
#kbd-help-overlay{position:absolute;inset:0;background:rgba(0,0,0,.4);}
#kbd-help-box{
  position:relative;z-index:1;background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--r);box-shadow:var(--sh3);width:min(560px,94vw);
  max-height:88vh;overflow-y:auto;
}
.kbh-head{display:flex;align-items:center;justify-content:space-between;
  padding:1rem 1.25rem;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg3);z-index:1;}
.kbh-title{display:flex;align-items:center;gap:.55rem;font-size:14px;font-weight:700;color:var(--t1);}
.kbh-badge{font-size:11px;background:var(--indigo-soft);color:var(--indigo);
  border:1px solid var(--indigo-mid);border-radius:4px;padding:.1rem .4rem;font-family:'DM Mono',monospace;font-weight:700;}
.kbh-close{width:28px;height:28px;border:none;border-radius:6px;background:none;
  cursor:pointer;color:var(--t3);display:flex;align-items:center;justify-content:center;}
.kbh-close:hover{background:var(--bg4);color:var(--t1);}
.kbh-body{padding:1.1rem 1.25rem;display:flex;flex-direction:column;gap:1.1rem;}
.kbh-section-title{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--indigo);margin-bottom:.55rem;display:flex;align-items:center;gap:.5rem;}
.kbh-section-title::after{content:'';flex:1;height:1px;background:linear-gradient(to right,var(--indigo-mid),transparent);}
.kbh-rows{display:grid;grid-template-columns:auto 1fr;gap:.32rem .9rem;}
.kbh-keys{display:flex;align-items:center;gap:.28rem;justify-self:start;}
.kbhk{font-family:'DM Mono',monospace;font-size:11px;background:var(--bg4);
  border:1px solid var(--border);border-radius:5px;padding:.1rem .4rem;
  color:var(--t2);white-space:nowrap;line-height:1.5;}
.kbhk.ac{background:var(--indigo-soft);border-color:var(--indigo-mid);color:var(--indigo);font-weight:700;}
.kbh-then{font-size:10px;color:var(--t4);font-style:italic;margin:0 .05rem;}
.kbh-desc{font-size:12.5px;color:var(--t3);align-self:center;line-height:1.5;}
.kbh-desc b{color:var(--t1);font-weight:500;}
.kbh-tag{display:inline-flex;padding:.04rem .38rem;border-radius:4px;font-size:10px;font-weight:600;margin-left:.3rem;}
.kbh-tag.nav{background:rgba(59,130,246,.1);color:#3b82f6;}
.kbh-tag.data{background:rgba(5,150,105,.1);color:#059669;}
.kbh-tag.ui{background:var(--indigo-soft);color:var(--indigo);}
.kbh-foot{padding:.75rem 1.25rem;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;}
.kbh-foot-tip{font-size:11px;color:var(--t4);}

/* ── Market Status Pill ── */
#mkt-pill{
  display:inline-flex;align-items:center;gap:.38rem;
  padding:.26rem .72rem .26rem .52rem;
  border-radius:20px;border:1px solid var(--border);
  background:var(--bg3);box-shadow:var(--sh1);
  font-size:11.5px;font-weight:600;color:var(--t2);
  cursor:pointer;user-select:none;white-space:nowrap;
  transition:border-color .15s,box-shadow .15s;
}
#mkt-pill:hover{border-color:var(--border2);box-shadow:var(--sh2)}
#mkt-pill .mp-dot{
  width:7px;height:7px;border-radius:50%;flex-shrink:0;
  transition:background .3s;
}
/* state classes */
#mkt-pill.pill--open   { border-color:var(--emerald-glow) }
#mkt-pill.pill--open   .mp-dot { background:var(--emerald);box-shadow:0 0 0 2px var(--emerald-glow),0 0 6px var(--emerald-pulse);animation:pulse 2.5s ease infinite }
#mkt-pill.pill--pre    { border-color:var(--amber-glow) }
#mkt-pill.pill--pre    .mp-dot { background:var(--amber);box-shadow:0 0 0 2px var(--amber-glow) }
#mkt-pill.pill--post   { border-color:var(--indigo-border) }
#mkt-pill.pill--post   .mp-dot { background:var(--indigo);box-shadow:0 0 0 2px var(--indigo-glow) }
#mkt-pill.pill--closed { border-color:var(--border) }
#mkt-pill.pill--closed .mp-dot { background:var(--t5) }
@media(max-width:600px){#mkt-pill .mp-label{display:none}}

/* ── Column Visibility Toggle ── */
.col-vis-btn{
  display:inline-flex;align-items:center;gap:.28rem;
  padding:.32rem .65rem;border-radius:var(--r3);
  border:1px solid var(--border);background:var(--bg3);
  color:var(--t3);font-size:12px;font-weight:500;
  font-family:'DM Sans',sans-serif;cursor:pointer;
  white-space:nowrap;transition:all .13s;
}
.col-vis-btn:hover{border-color:var(--border2);color:var(--indigo);background:var(--indigo-soft)}
.col-vis-btn .mi{font-size:13px}
.col-vis-btn.active{background:var(--indigo-soft);border-color:var(--indigo-mid);color:var(--indigo)}
.col-vis-btn.tx-on{background:var(--indigo-soft);border-color:var(--indigo-mid);color:var(--indigo)}

/* ── Unified period-pill row (F2/F3/F4) ─────────────────────────────── */
/* Override .sv-pill's flex:1 so each pill sizes to its content, on one line, with the date inline. */
.sym-period-pills{display:flex;gap:.25rem;align-items:center;flex-wrap:nowrap;overflow-x:auto}
.sym-period-pills .sv-pill{flex:0 0 auto;white-space:nowrap;padding:4px 9px;font-size:11px;line-height:1.35;letter-spacing:.01em}
.sym-period-pills .sv-pill[disabled]{opacity:.45;cursor:not-allowed}
/* Thin vertical separator between period pills and the Peers toggle-pill */
.sym-pill-sep{display:inline-block;width:1px;height:16px;background:var(--border2);margin:0 .4rem;align-self:center;flex:0 0 auto}
/* Peers pill — identical shape to period pills; .active gets indigo fill from base .sv-pill.active rule */
.sym-peers-pill{font-weight:600}
.sym-peers-pill::before{content:"✓\00a0";opacity:0;transition:opacity .12s}
.sym-peers-pill.active::before{opacity:1}

#col-vis-panel{
  position:fixed;z-index:600;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--r2);box-shadow:var(--sh3);
  width:210px;max-height:340px;
  display:none;flex-direction:column;
}
#col-vis-panel.open{display:flex}
.cvp-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:.55rem .75rem .45rem;border-bottom:1px solid var(--border);
  flex-shrink:0;
}
.cvp-title{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t4)}
.cvp-reset{font-size:11px;font-weight:600;color:var(--indigo);background:none;border:none;cursor:pointer;padding:0;font-family:inherit}
.cvp-reset:hover{text-decoration:underline}
.cvp-list{overflow-y:auto;flex:1;padding:.35rem .4rem}
.cvp-row{
  display:flex;align-items:center;gap:.5rem;
  padding:.28rem .45rem;border-radius:var(--r3);cursor:pointer;
}
.cvp-row:hover{background:var(--bg4)}
.cvp-row.pinned{opacity:.45;cursor:not-allowed}
.cvp-row input[type=checkbox]{
  accent-color:var(--indigo);width:13px;height:13px;
  flex-shrink:0;cursor:pointer;
}
.cvp-row.pinned input{cursor:not-allowed}
.cvp-lbl{font-size:12.5px;color:var(--t2);user-select:none}
.cvp-group-hdr{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:var(--t4);padding:.4rem .45rem .2rem;margin-top:.25rem}
.cvp-group-hdr:first-child{margin-top:0}
.cvp-group-row{display:flex;align-items:center;gap:.4rem;padding:.28rem .45rem;
  border-radius:var(--r3);cursor:pointer;user-select:none}
.cvp-group-row:hover{background:var(--bg4)}
.cvp-group-row input[type=checkbox]{accent-color:var(--indigo);width:13px;height:13px;flex-shrink:0;cursor:pointer}
.cvp-lbl-group{font-size:12.5px;font-weight:600;color:var(--t1);flex:1;user-select:none}
.cvp-grp-count{font-size:10px;color:var(--t4);background:var(--bg3);border:1px solid var(--border);
  border-radius:9px;padding:1px 5px;flex-shrink:0}
.cvp-grp-arrow{font-size:10px;color:var(--t4);flex-shrink:0;transition:transform .15s}
.cvp-grp-arrow.open{transform:rotate(180deg)}
.cvp-child-wrap{display:none;padding-left:1.5rem}
.cvp-child-wrap.open{display:block}
.cvp-child-row{display:flex;align-items:center;gap:.4rem;padding:.22rem .45rem;
  border-radius:var(--r3);cursor:pointer}
.cvp-child-row:hover{background:var(--bg4)}
.cvp-child-row input[type=checkbox]{accent-color:var(--indigo);width:13px;height:13px;flex-shrink:0;cursor:pointer}
.cvp-child-lbl{font-size:11.5px;color:var(--t3);user-select:none}

/* ── Row Action Bar (symbol propagation hover) ── */
#row-action-bar{
  position:fixed;z-index:500;
  display:none;align-items:center;gap:2px;
  padding:3px 5px;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--r2);box-shadow:var(--sh2);
  pointer-events:auto;
}
#row-action-bar.visible{display:flex}
.rab-btn{
  width:26px;height:26px;display:flex;align-items:center;justify-content:center;
  border:none;background:none;border-radius:var(--r3);
  color:var(--t4);cursor:pointer;padding:0;
  transition:background .12s,color .12s;
}
.rab-btn:hover{background:var(--indigo-soft);color:var(--indigo)}
.rab-btn .mi{font-size:15px;pointer-events:none}
.rab-sep{width:1px;height:16px;background:var(--border);margin:0 2px;flex-shrink:0}
/* IVs split button — visually joined pair, same height as other rab-btns */
.rab-btn-ivs{border-radius:var(--r3) 0 0 var(--r3);width:26px}
.rab-btn-ivs-drop{
  border-radius:0 var(--r3) var(--r3) 0;
  width:14px;min-width:14px;padding:0;
  border-left:1px solid var(--border);
}
.rab-btn-ivs-drop .mi{font-size:10px}
.rab-btn-ivs:hover,.rab-btn-ivs-drop:hover{background:var(--indigo-soft);color:var(--indigo)}
/* Keep joined pair visually connected on hover of either half */
.rab-btn-ivs:hover + .rab-btn-ivs-drop,
.rab-btn-ivs-drop:hover{background:var(--indigo-soft);color:var(--indigo)}
/* Item 4 (Path 1) — Symbol Stats split button — visually joined pair, mirrors .rab-btn-ivs* */
.rab-btn-symstats{border-radius:var(--r3) 0 0 var(--r3);width:26px}
.rab-btn-symstats-drop{
  border-radius:0 var(--r3) var(--r3) 0;
  width:14px;min-width:14px;padding:0;
  border-left:1px solid var(--border);
}
.rab-btn-symstats-drop .mi{font-size:10px}
.rab-btn-symstats:hover,.rab-btn-symstats-drop:hover{background:var(--indigo-soft);color:var(--indigo)}
/* Keep joined pair visually connected on hover of either half */
.rab-btn-symstats:hover + .rab-btn-symstats-drop,
.rab-btn-symstats-drop:hover{background:var(--indigo-soft);color:var(--indigo)}
/* Hide the chevron whenever the main button is hidden by the _TAB_TO_RAB logic in ui.js */
.rab-btn-symstats[style*="display: none"] + .rab-btn-symstats-drop,
.rab-btn-symstats[style*="display:none"]  + .rab-btn-symstats-drop{display:none}

/* ── FORM CONTROLS ── */
.sel-wrap{position:relative}
.sel-wrap::after{content:'expand_more';font-family:'Material Icons Round';position:absolute;right:9px;top:50%;
  transform:translateY(-50%);font-size:16px;color:var(--t4);pointer-events:none}
select.fsel{width:100%;padding:.42rem 2rem .42rem .75rem;background:var(--bg2);border:1px solid var(--border);
  border-radius:var(--r2);color:var(--t1);font-size:13px;font-family:'DM Sans',sans-serif;
  outline:none;appearance:none;cursor:pointer}
select.fsel:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)}
/* ── MULTI-PICKER ── */
.mpk{display:flex;flex-direction:column;gap:.35rem}
/* ── News symbol searchable multi-select ── */
.news-sym-box{border:1px solid var(--border);border-radius:8px;background:var(--bg2);overflow:hidden;position:relative}
.news-sym-chips{display:flex;flex-wrap:wrap;gap:.3rem;padding:.5rem .6rem .35rem;min-height:2rem;border-bottom:1px solid var(--border)}
.news-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.18rem .55rem;border-radius:20px;font-size:11px;font-weight:600;background:var(--bg3);border:1px solid var(--border);color:var(--t3);cursor:pointer;user-select:none;white-space:nowrap}
.news-chip:hover{border-color:var(--indigo);color:var(--indigo)}
.news-chip.on{background:var(--indigo);border-color:var(--indigo);color:#fff}
.news-chip-all{font-size:11px}
.news-chip .chip-x{font-size:10px;opacity:.7;margin-left:.1rem;line-height:1}
.news-chip .chip-x:hover{opacity:1}
.news-sym-search-wrap{display:flex;align-items:center;gap:.4rem;padding:.35rem .6rem;background:var(--bg2)}
.news-sym-input{flex:1;border:none;outline:none;background:transparent;font-size:12px;color:var(--t1);font-family:inherit}
.news-sym-input::placeholder{color:var(--t5)}
.news-sym-drop{position:absolute;left:0;right:0;top:100%;z-index:120;background:var(--bg1);border:1px solid var(--border);border-radius:0 0 8px 8px;box-shadow:0 6px 20px var(--shadow);max-height:180px;overflow-y:auto}
.news-sym-opt{padding:.38rem .75rem;font-size:12px;color:var(--t2);cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:background .1s}
.news-sym-opt:hover{background:var(--indigo);color:#fff}
.news-sym-opt.sel{color:var(--indigo);font-weight:600}
.news-sym-opt.sel::after{content:'✓';margin-left:auto;font-size:10px}
.news-sym-opt:hover.sel::after{color:#fff}
.mpk-acts{display:flex;gap:.4rem;margin-bottom:.1rem}
.mpk-act{font-size:10.5px;font-weight:600;padding:.18rem .6rem;border-radius:20px;border:1px solid var(--border);
  background:var(--bg3);color:var(--t3);cursor:pointer;letter-spacing:.02em;transition:all .12s}
.mpk-act:hover{background:var(--indigo);border-color:var(--indigo);color:#fff}
.mpk-tags{display:flex;flex-wrap:wrap;gap:.3rem}
.mpk-tag{display:inline-flex;align-items:center;gap:.3rem;padding:.22rem .65rem;border-radius:20px;
  font-size:12px;font-weight:500;cursor:pointer;user-select:none;transition:all .12s;
  border:1px solid var(--border);background:var(--bg3);color:var(--t3)}
.mpk-tag:hover{border-color:var(--indigo);color:var(--indigo)}
.mpk-tag.on{background:var(--indigo);border-color:var(--indigo);color:#fff}
.mpk-tag.on::before{content:'✓ ';font-size:10px;font-weight:700}
#stats-interval:not(:has(.mpk-tag.on ~ .mpk-tag.on)) .mpk-act:last-child{display:none}
#sig-intervals:not(:has(.mpk-tag.on)) .mpk-act:last-child{display:none}

.slider-wrap{margin-bottom:.85rem}
.slider-hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:.4rem}
.slider-badge{font-family:'DM Mono',monospace;font-size:11px;font-weight:500;color:var(--teal);
  background:rgba(13,148,136,.08);border:1px solid rgba(13,148,136,.2);padding:1px 8px;border-radius:20px}
input[type=range].frange{-webkit-appearance:none;width:100%;height:4px;background:var(--bg5);border-radius:3px;outline:none;cursor:pointer}
input[type=range].frange::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;
  background:var(--indigo);cursor:pointer;box-shadow:0 0 0 3px rgba(79,70,229,.2),0 2px 6px rgba(0,0,0,.2)}
.slider-ticks{display:flex;justify-content:space-between;font-size:9.5px;color:var(--t5);margin-top:.2rem}

/* checkboxes / toggles */
.toggle-list{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.85rem}
/* Remove extra gap when toggle-list is inside a .cond wrapper — prevents double spacing */
.cond>.toggle-list,.cond-inner>.toggle-list{margin-bottom:.4rem}
.cond+.toggle-list,.toggle-list+.cond{margin-top:0}
.cond>.cond>.toggle-list{margin-bottom:.4rem}
.tog-item{display:flex;align-items:center;gap:.6rem;padding:.3rem .4rem;border-radius:var(--r3);
  color:var(--t2);cursor:pointer;font-size:12.5px}
.tog-item:hover{background:var(--bg4)}
input.ti{display:none}
.tog{width:30px;height:17px;background:var(--bg3);border:1px solid var(--border);
  border-radius:20px;position:relative;cursor:pointer;flex-shrink:0;transition:background .15s,border-color .15s}
.tog::after{content:'';position:absolute;top:2px;left:2px;width:11px;height:11px;
  border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .15s}
input.ti:checked+.tog{background:var(--indigo);border-color:var(--indigo)}
input.ti:checked+.tog::after{transform:translateX(13px);background:var(--fg-on-accent)}

/* date inputs */
input[type=date].fdate,input[type=text].ftxt{width:100%;padding:.42rem .75rem;background:var(--bg2);
  border:1px solid var(--border);border-radius:var(--r2);color:var(--t1);font-size:13px;
  font-family:'DM Sans',sans-serif;outline:none}
input[type=date].fdate:focus,input[type=text].ftxt:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)}

/* action pill */
.action-pill{display:flex;align-items:center;gap:.75rem;padding:.65rem 1.1rem;
  background:var(--bg2);border:1px solid var(--border);border-radius:40px;margin-top:.5rem;
  flex-wrap:wrap;box-shadow:var(--sh1)}
.btn-fetch{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem 1.15rem;
  background:linear-gradient(135deg,var(--indigo),var(--indigo-dim));color:#fff;border:none;border-radius:30px;
  font-size:13px;font-family:'DM Sans',sans-serif;font-weight:600;cursor:pointer;
  box-shadow:0 2px 12px rgba(79,70,229,.35);letter-spacing:-.01em}
.btn-fetch:hover{transform:translateY(-1px);box-shadow:0 4px 20px rgba(79,70,229,.45)}
.btn-fetch:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn-fetch .mi{font-size:15px}
.btn-secondary{display:inline-flex;align-items:center;gap:.4rem;padding:.42rem 1rem;
  background:var(--bg3);border:1px solid var(--border);border-radius:30px;
  font-size:12.5px;font-family:'DM Sans',sans-serif;font-weight:500;color:var(--t2);cursor:pointer}
.btn-secondary:hover{border-color:var(--border2);color:var(--indigo);background:var(--indigo-soft)}
.btn-secondary .mi{font-size:14px}
.pill-divider{width:1px;height:20px;background:var(--border);flex-shrink:0}

/* cdown */
.cdown-wrap{display:none;align-items:center;gap:.5rem;font-size:12px;color:var(--t3)}
.cdown-wrap.on{display:flex}
.fetch-st{font-size:11.5px;color:var(--t4);font-family:'DM Mono',monospace}
select.is{background:var(--bg3);border:1px solid var(--border);border-radius:20px;
  color:var(--t2);font-size:12px;font-family:'DM Sans',sans-serif;padding:.25rem .6rem;outline:none;cursor:pointer}

/* ── TABLE ── */
.tw{overflow-x:auto;overflow-y:auto;max-height:72vh;border-radius:var(--r2);border:1px solid var(--border);box-shadow:var(--sh1)}
table.dt{width:max-content;min-width:100%;border-collapse:collapse;font-size:13px}
table.dt thead th{background:var(--bg2);color:var(--t4);font-size:10px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;padding:.65rem .9rem;text-align:left;
  white-space:nowrap;border-bottom:1px solid var(--border);border-right:1px solid var(--border3);
  cursor:pointer;user-select:none;
  position:sticky;top:0;z-index:10;box-shadow:0 1px 0 var(--border);}
table.dt thead tr.col-filters th{position:sticky;z-index:9;background:var(--bg2);}
table.dt thead th:last-child{border-right:none}
table.dt thead th:hover{color:var(--t1);background:var(--bg4)}
table.dt tbody tr{border-bottom:1px solid var(--border3)}
table.dt tbody tr:hover{background:rgba(79,70,229,.04)}
table.dt tbody tr.hover-highlight{background:rgba(79,70,229,.08)!important;outline:1px solid var(--indigo-mid)}
/* Change 4: more visible alternating stripes (was 0.012, invisible) */
table.dt tbody tr:nth-child(even){background:rgba(0,0,0,.03)}
[data-theme="dark"] table.dt tbody tr:nth-child(even){background:rgba(255,255,255,.022)}
table.dt tbody tr:nth-child(even):hover{background:rgba(79,70,229,.04)}
table.dt tbody td{padding:.52rem .9rem;color:var(--t2);border-right:1px solid var(--border3);
  white-space:nowrap;min-width:60px}
/* Glossary tables: full container width, columns share space, text wraps freely — popup shows full content on click */
table.dt-glossary{width:100%;table-layout:fixed}
table.dt-glossary tbody td{white-space:normal;overflow:visible;text-overflow:clip;word-break:break-word}
/* Width-locked table: column widths frozen after first render, ellipsis for overflow */
table.dt.col-locked{table-layout:fixed}
table.dt.col-locked th,
table.dt.col-locked td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
table.dt td.extreme-type-cell{min-width:220px;max-width:320px;white-space:normal;overflow:visible;text-overflow:clip}
/* Values and Name columns need extra width — Values holds space-separated numbers, Name holds ticker descriptions */
table.dt td.wide-col{min-width:220px}
table.dt th.wide-col{min-width:220px}
table.dt th.extreme-type-th{min-width:220px;white-space:nowrap}
table.dt tbody td:last-child{border-right:none}
/* Change 6: unified font-size 12.5px across all numeric cell types */
td.num{font-family:'DM Mono',monospace;font-size:12.5px;text-align:right;color:var(--t3)}
td.pos{font-family:'DM Mono',monospace;font-size:12.5px;text-align:right;color:var(--emerald);font-weight:500}
td.neg{font-family:'DM Mono',monospace;font-size:12.5px;text-align:right;color:var(--rose);font-weight:500}
/* Change 1+7: NA/empty placeholder — centered, monospace, clearly distinct from data */
td.td-na{font-family:'DM Mono',monospace;font-size:12px;text-align:center;color:var(--t5)}
td.rn{font-family:'DM Mono',monospace;font-size:10.5px;color:var(--t5);text-align:center;width:44px;min-width:44px;max-width:44px}
th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
th.sortable:hover{color:var(--indigo);background:var(--indigo-soft)}
th.sortable::after{content:'';display:inline-block;width:12px;text-align:center;opacity:.35;font-size:10px;margin-left:3px}
/* Change 5: active sort column header gets tinted background for clear visibility */
th.sasc,th.sdesc{background:var(--indigo-soft);color:var(--indigo)}
th.smag{background:rgba(217,119,6,.07);color:var(--amber)}
th.sasc::after{content:'▲';opacity:1;color:var(--indigo);animation:sortFlyIn .22s cubic-bezier(.34,1.56,.64,1) both}
th.sdesc::after{content:'▼';opacity:1;color:var(--indigo);animation:sortFlyIn .22s cubic-bezier(.34,1.56,.64,1) both}
th.smag::after{content:'◆';opacity:1;color:var(--amber);animation:sortFlyIn .22s cubic-bezier(.34,1.56,.64,1) both}
@keyframes sortFlyIn{from{opacity:0;transform:translateY(-7px) scale(.5)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes chartWiggle{
  0%  {transform:scale(1)     rotate(0)}
  20% {transform:scale(1.013) rotate(.45deg)}
  45% {transform:scale(.989)  rotate(-.3deg)}
  65% {transform:scale(1.006) rotate(.18deg)}
  82% {transform:scale(.997)  rotate(-.08deg)}
  100%{transform:scale(1)     rotate(0)}
}
.chart-wiggle{animation:chartWiggle .6s cubic-bezier(.34,1.56,.64,1);transform-origin:center}
/* Change 2: numeric column headers right-aligned to match their data cells */
table.dt thead th.th-num{text-align:right}
table.dt thead th.th-time{text-align:center}
td.td-time{text-align:center}
/* Change 10: all-NA columns de-emphasised — users can skip them at a glance */
th.th-all-na{color:var(--t5)!important;opacity:.5}
/* Change 8: skeleton shimmer for loading state */
.skel-row td{padding:.52rem .9rem;border-right:1px solid var(--border3)}
.skel-bar{display:inline-block;border-radius:4px;height:10px;
  background:linear-gradient(90deg,var(--bg4) 25%,var(--bg5) 50%,var(--bg4) 75%);
  background-size:200% 100%;animation:skelShimmer 1.5s ease infinite}
@keyframes skelShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ── Chart skeleton: shimmer placeholder shaped like a chart ── */
.chart-skel{
  display:flex;flex-direction:column;width:100%;
  height:calc(100vh - 220px);min-height:600px;
  background:var(--bg2);border-radius:0 0 var(--r) var(--r);
  padding:1.5rem 1.25rem 1.25rem;box-sizing:border-box;overflow:hidden;
}
.chart-skel-inner{
  flex:1;display:flex;gap:1rem;min-height:0;
}
/* Y-axis shimmer labels on the left */
.chart-skel-yaxis{
  display:flex;flex-direction:column;justify-content:space-between;
  width:48px;flex-shrink:0;padding-bottom:32px;
}
.chart-skel-ylabel{
  height:10px;border-radius:4px;
  background:linear-gradient(90deg,var(--bg4) 25%,var(--bg5) 50%,var(--bg4) 75%);
  background-size:200% 100%;animation:skelShimmer 1.5s ease infinite;
}
/* Main plot area */
.chart-skel-plot{
  flex:1;display:flex;flex-direction:column;min-width:0;
}
.chart-skel-area{
  flex:1;position:relative;border-left:2px solid var(--border);
  border-bottom:2px solid var(--border);overflow:hidden;
}
/* Horizontal grid lines */
.chart-skel-hline{
  position:absolute;left:0;right:0;height:1px;background:var(--border3);
}
/* Shimmer bars representing candles / a chart */
.chart-skel-bars{
  position:absolute;bottom:0;left:0;right:0;top:0;
  display:flex;align-items:flex-end;gap:3px;padding:8px 12px 0;
}
.chart-skel-bar{
  flex:1;border-radius:3px 3px 0 0;min-width:6px;max-width:22px;
  background:linear-gradient(90deg,var(--bg4) 25%,var(--bg5) 50%,var(--bg4) 75%);
  background-size:200% 100%;animation:skelShimmer 1.5s ease infinite;
}
/* Simulate a rising line by having bars at varied heights */
.chart-skel-bar:nth-child(1){height:28%}
.chart-skel-bar:nth-child(2){height:35%}
.chart-skel-bar:nth-child(3){height:31%}
.chart-skel-bar:nth-child(4){height:42%}
.chart-skel-bar:nth-child(5){height:38%}
.chart-skel-bar:nth-child(6){height:50%}
.chart-skel-bar:nth-child(7){height:45%}
.chart-skel-bar:nth-child(8){height:55%}
.chart-skel-bar:nth-child(9){height:48%}
.chart-skel-bar:nth-child(10){height:60%}
.chart-skel-bar:nth-child(11){height:54%}
.chart-skel-bar:nth-child(12){height:65%}
.chart-skel-bar:nth-child(13){height:58%}
.chart-skel-bar:nth-child(14){height:72%}
.chart-skel-bar:nth-child(15){height:67%}
.chart-skel-bar:nth-child(16){height:75%}
.chart-skel-bar:nth-child(17){height:70%}
.chart-skel-bar:nth-child(18){height:80%}
.chart-skel-bar:nth-child(19){height:74%}
.chart-skel-bar:nth-child(20){height:68%}
.chart-skel-bar:nth-child(21){height:78%}
.chart-skel-bar:nth-child(22){height:72%}
.chart-skel-bar:nth-child(23){height:82%}
.chart-skel-bar:nth-child(24){height:76%}
.chart-skel-bar:nth-child(n+25){height:70%}
/* X-axis shimmer labels */
.chart-skel-xaxis{
  display:flex;justify-content:space-between;padding:6px 0 0 50px;
}
.chart-skel-xlabel{
  height:9px;border-radius:4px;
  background:linear-gradient(90deg,var(--bg4) 25%,var(--bg5) 50%,var(--bg4) 75%);
  background-size:200% 100%;animation:skelShimmer 1.5s ease infinite;
}
/* Title shimmer at top */
.chart-skel-title{
  height:14px;border-radius:5px;width:220px;margin-bottom:1rem;
  background:linear-gradient(90deg,var(--bg4) 25%,var(--bg5) 50%,var(--bg4) 75%);
  background-size:200% 100%;animation:skelShimmer 1.5s ease infinite;
}
/* Tooltip hint for three-state sort */
.sym-badge{display:inline-block;padding:2px 7px;background:var(--indigo-soft);border:1px solid var(--indigo-mid);
  border-radius:5px;font-family:'DM Mono',monospace;font-size:11px;color:var(--indigo);font-weight:500}

/* clickable news rows */
table.dt.news-tbl{width:max-content;min-width:100%}
table.dt.news-tbl tbody tr{cursor:pointer}
table.dt.news-tbl tbody tr:hover{background:rgba(79,70,229,.07)!important}
/* all cells: single line, no wrap */
table.dt.news-tbl td{white-space:nowrap;overflow:hidden;text-overflow:clip;height:36px;vertical-align:middle}
/* Stocks only gets ellipsis */
table.dt.news-tbl td:nth-child(4){text-overflow:ellipsis;color:var(--t3);font-size:11.5px}

/* ── NEWS POPUP ── */
.npop-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);
  backdrop-filter:blur(4px);z-index:9500;align-items:center;justify-content:center;padding:1.5rem;
  overscroll-behavior:contain}
.npop-overlay.open{display:flex}
.npop{background:var(--bg2);border:1px solid var(--border);border-radius:14px;
  box-shadow:0 24px 60px rgba(0,0,0,.22),0 4px 16px rgba(0,0,0,.12);
  width:100%;max-width:560px;max-height:82vh;display:flex;flex-direction:column;
  overflow:hidden;animation:npopIn .2s cubic-bezier(.34,1.3,.64,1) both}
@keyframes npopIn{from{opacity:0;transform:scale(.93) translateY(8px)}to{opacity:1;transform:none}}
.npop-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;
  padding:1.25rem 1.4rem 1rem;border-bottom:1px solid var(--border);flex-shrink:0}
.npop-headline{font-size:15px;font-weight:600;color:var(--t1);line-height:1.45;flex:1}
.npop-close{width:28px;height:28px;border-radius:8px;border:1px solid var(--border);
  background:var(--bg3);color:var(--t3);cursor:pointer;display:flex;align-items:center;
  justify-content:center;flex-shrink:0;transition:all .12s;margin-top:-2px}
.npop-close:hover{background:var(--rose);border-color:var(--rose);color:#fff}
.npop-close .mi{font-size:16px}
.npop-body{padding:1.1rem 1.4rem 1.4rem;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem;flex:1;min-height:0}
.npop-row{display:flex;align-items:flex-start;gap:.75rem}
.npop-lbl{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--t5);min-width:78px;flex-shrink:0;padding-top:2px}
.npop-val{font-size:13px;color:var(--t2);line-height:1.5;flex:1;word-break:break-word}
.npop-val.mono{font-family:'DM Mono',monospace;font-size:12px;color:var(--t3)}
.npop-val a{color:var(--indigo);text-decoration:none}
.npop-val a:hover{text-decoration:underline}
.npop-sent{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .75rem;
  border-radius:20px;font-size:12px;font-weight:600}
.npop-sent.bull{background:rgba(5,150,105,.1);border:1px solid rgba(5,150,105,.25);color:var(--emerald)}
.npop-sent.bear{background:rgba(225,29,72,.08);border:1px solid rgba(225,29,72,.2);color:var(--rose)}
.npop-sent.neut{background:var(--bg4);border:1px solid var(--border);color:var(--t4)}
.npop-divider{height:1px;background:var(--border);margin:.1rem 0}

/* ── Signals Values hover tooltip ── */
#sig-val-tooltip{position:fixed;z-index:9000;pointer-events:none;display:none;
  background:var(--bg3);border:1px solid var(--border);border-radius:10px;
  box-shadow:0 8px 32px rgba(0,0,0,.55);padding:.4rem 0;min-width:220px;max-width:465px}
#sig-val-tooltip table{border-collapse:collapse;table-layout:auto}
#sig-val-tooltip td{padding:.25rem .8rem;font-size:12px;line-height:1.5;white-space:normal;word-break:break-word}
#sig-val-tooltip td:first-child{width:80%;color:var(--t3);font-family:'DM Mono',monospace;font-size:11px;border-right:1px solid var(--border)}
#sig-val-tooltip td:last-child{width:20%;color:var(--t1);font-weight:500;font-family:'DM Mono',monospace;text-align:right}
#sig-val-tooltip tr:not(:last-child) td{border-bottom:1px solid var(--border)}

/* ── News popup: keyword filter bar + card feed ── */
.npop-search-wrap{display:flex;align-items:center;gap:.5rem;padding:.6rem 1.4rem;
  border-bottom:1px solid var(--border);flex-shrink:0;background:var(--bg2)}
.npop-search-icon{font-size:16px;color:var(--t5);flex-shrink:0}
.npop-search-input{flex:1;background:var(--bg3);border:1px solid var(--border);border-radius:8px;
  padding:.32rem .65rem;font-size:13px;color:var(--t1);outline:none;min-width:0;
  font-family:inherit;transition:border-color .12s,box-shadow .12s}
.npop-search-input::placeholder{color:var(--t5)}
.npop-search-input:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)}
.npop-search-count{font-size:11px;font-weight:600;color:var(--t4);white-space:nowrap;
  font-family:'DM Mono',monospace;flex-shrink:0;min-width:3.5rem;text-align:right}
.npop-news-list{display:flex;flex-direction:column;gap:2px;padding:.5rem .6rem}
.npop-news-item{display:flex;align-items:flex-start;gap:.65rem;padding:.5rem .65rem;
  border-radius:8px;transition:background .1s;cursor:default}
.npop-news-item:hover{background:var(--bg3)}
.npop-news-ts{font-family:'DM Mono',monospace;font-size:11px;font-weight:600;
  color:var(--indigo);background:var(--indigo-soft);border:1px solid var(--indigo-mid);
  border-radius:6px;padding:2px 7px;white-space:nowrap;flex-shrink:0;margin-top:1px;line-height:1.7}
.npop-news-headline{font-size:13px;color:var(--t2);line-height:1.55;flex:1}
.npop-news-empty{text-align:center;padding:2.5rem 1rem;color:var(--t4);font-style:italic;font-size:13px}
```

/* ── MOCK CHART/TABLE placeholders ── */
.mock-output{border-radius:var(--r2);border:1px solid var(--border);overflow:hidden;background:var(--bg2)}
.mock-table-wrap{overflow-x:auto}
.mock-chart{height:380px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.6rem;color:var(--t4);background:var(--bg2);border-radius:var(--r2);border:1px solid var(--border)}
.mock-chart .mi{font-size:42px;opacity:.18}
.mock-chart p{font-size:13px}
.mock-chart strong{color:var(--t3)}
.mock-embed{width:100%;height:560px;border:none;border-radius:var(--r2);
  border:1px solid var(--border);background:var(--bg4)}

/* ── Time slider column filter ── */
.rf-cell-time{min-width:220px}
.rf-time-vals{font-size:10.5px;font-family:'DM Mono',monospace;color:var(--indigo);margin-bottom:.35rem;text-align:center;font-weight:500}
.rf-time-slider{margin:.2rem .25rem .15rem}
.rf-time-bounds{display:flex;justify-content:space-between;margin-top:3px}
.rf-time-bounds span{font-size:9px;color:var(--t5);font-family:'DM Mono',monospace}
/* noUiSlider overrides inside rf panel */
.rf-collapse .noUi-target{height:4px;margin:4px 0}
.rf-collapse .noUi-handle{width:12px!important;height:12px!important;right:-6px!important;top:-5px!important}

/* filter panel */
.fp{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2);margin-bottom:1rem;overflow:hidden;display:none}
.fp-head{display:flex;align-items:center;justify-content:space-between;
  padding:.55rem 1rem;cursor:pointer;font-size:12.5px;font-weight:600;color:var(--t2)}
.fp-head:hover{background:var(--bg4)}
.fp-left{display:flex;align-items:center;gap:.4rem}
.fp-left .mi{font-size:15px;color:var(--indigo)}
.fp-right{display:flex;align-items:center;gap:.5rem}
.clr-btn{font-size:10.5px;color:var(--rose);background:rgba(225,29,72,.07);border:1px solid rgba(225,29,72,.18);
  border-radius:4px;padding:2px 7px;cursor:pointer}
.clr-btn:hover{background:rgba(225,29,72,.13)}
.fp-chev{font-size:15px!important;color:var(--t4)}
.fp-body{display:none;padding:.75rem 1rem 1rem;border-top:1px solid var(--border)}
.fp-body.open{display:block}
.fg{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:.85rem}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:.6rem}
.chip{display:inline-flex;align-items:center;gap:.25rem;padding:2px 9px;
  background:var(--indigo-soft);border:1px solid var(--indigo-mid);border-radius:20px;
  font-size:10.5px;color:var(--indigo);font-family:'DM Mono',monospace}
.chip-x{cursor:pointer;opacity:.45}
.chip-x:hover{opacity:1}

/* tbar */
.tbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;gap:.5rem;flex-wrap:wrap}
.sbox{display:flex;align-items:center;gap:.4rem;background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--r2);padding:.35rem .75rem;box-shadow:var(--sh1)}
.sbox:focus-within{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)}
.sbox .mi{font-size:16px;color:var(--t4)}
.sbox input{background:none;border:none;outline:none;color:var(--t1);font-size:13px;font-family:'DM Sans',sans-serif;width:180px}
.sbox input::placeholder{color:var(--t5)}
.rbadge{display:none;align-items:center;padding:3px 10px;
  background:rgba(5,150,105,.08);border:1px solid rgba(5,150,105,.2);
  border-radius:20px;font-size:10.5px;font-family:'DM Mono',monospace;color:var(--emerald)}
.rbadge.on{display:inline-flex}
.exp-btn{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .8rem;
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r2);
  color:var(--t3);font-size:12px;cursor:pointer;font-family:'DM Sans',sans-serif;box-shadow:var(--sh1)}
.exp-btn:hover{border-color:var(--border2);color:var(--indigo);background:var(--indigo-soft)}
.exp-btn .mi{font-size:13px}

/* pagination */
.pgrow{display:flex;align-items:center;justify-content:space-between;padding:.75rem 0 0;flex-wrap:wrap;gap:.5rem}
.pgi{font-size:11.5px;color:var(--t4);font-family:'DM Mono',monospace}
.pgb{display:flex;gap:.25rem;flex-wrap:wrap}
.pg{min-width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  padding:0 .5rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r3);
  color:var(--t3);font-size:12px;cursor:pointer;font-family:'DM Sans',sans-serif}
.pg:hover:not(:disabled){border-color:var(--indigo-mid);color:var(--indigo);background:var(--indigo-soft)}
.pg.a{background:var(--indigo);border-color:var(--indigo);color:#fff;box-shadow:0 2px 8px rgba(79,70,229,.35)}
.pg:disabled{opacity:.3;cursor:not-allowed}

/* states */
.stb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;padding:4rem 2rem;color:var(--t4)}
.stb .mi{font-size:38px;opacity:.18}
.stb p{font-size:13px}
/* Compact diagnostic empty-state — used by rfDiagnoseEmpty when filters
   reduce a non-empty dataset to zero rows. The full-size .stb is reserved
   for first-paint welcome placeholders. */
.stb.rf-diagnose{padding:1.25rem 2rem;gap:.4rem}
.stb.rf-diagnose .mi{font-size:26px}
.stb.rf-diagnose p{font-size:12.5px;margin:0}
.spin{width:22px;height:22px;border:2px solid var(--border);border-top-color:var(--indigo);
  border-radius:50%;animation:sp .7s linear infinite;display:inline-block;vertical-align:middle;margin-right:.4rem}
@keyframes sp{to{transform:rotate(360deg)}}
.errbanner{display:none;align-items:center;gap:.6rem;padding:.6rem 1rem;
  background:rgba(225,29,72,.05);border:1px solid rgba(225,29,72,.18);
  border-radius:var(--r2);color:var(--rose);font-size:12.5px;margin-bottom:.75rem}
.errbanner.on{display:flex}
.errbanner .mi{font-size:15px;flex-shrink:0}

/* ── DATE RANGE PICKER ── */
.drp{position:relative;user-select:none}
.drp-input{display:flex;align-items:center;gap:0;background:var(--bg2);border:1px solid var(--border);
  border-radius:var(--r2);cursor:pointer;transition:border-color .15s,box-shadow .15s;overflow:hidden}
.drp-input:focus-within,.drp-input.open{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)}
.drp-seg{display:flex;align-items:center;gap:.5rem;padding:.42rem .7rem;flex:1;min-width:0}
.drp-seg .mi{font-size:14px;color:var(--t4);flex-shrink:0}
.drp-range-txt{font-size:12.5px;color:var(--t2);font-family:'DM Mono',monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drp-range-txt.placeholder{color:var(--t5);font-family:'DM Sans',sans-serif;font-size:12.5px}
.drp-hint{font-size:10.5px;color:var(--t5);font-family:'DM Sans',sans-serif;flex-shrink:0}
.drp-clear{width:28px;height:100%;display:flex;align-items:center;justify-content:center;
  color:var(--t5);flex-shrink:0;border-left:1px solid var(--border);background:none;border-top:none;border-right:none;border-bottom:none;cursor:pointer}
.drp-clear:hover{color:var(--rose);background:rgba(225,29,72,.05)}
.drp-clear .mi{font-size:14px}

.drp-step-bar{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;padding:.35rem .5rem;
  background:var(--bg4);border-radius:var(--r3);border:1px solid var(--border)}
.drp-step{font-size:11px;font-weight:500;color:var(--t4);padding:.15rem .5rem;border-radius:4px;transition:all .15s}
.drp-step.drp-step-active{color:var(--indigo);background:var(--indigo-soft);font-weight:700}
.drp-step.drp-step-done{color:var(--emerald)}
.drp-step-arrow{font-size:11px;color:var(--t5)}

.drp-popup{position:fixed;top:0;left:0;z-index:9000;
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);
  box-shadow:var(--sh3);padding:1rem;display:none;min-width:300px}
.drp-popup.open{display:block}

.drp-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}
.drp-cal-nav{width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--border);border-radius:var(--r3);background:none;cursor:pointer;color:var(--t3)}
.drp-cal-nav:hover{background:var(--bg4);color:var(--t1)}
.drp-cal-nav .mi{font-size:16px}
.drp-cal-title{font-size:13px;font-weight:600;color:var(--t1);font-family:'Sora',sans-serif}

.drp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:.5rem}
.drp-dow{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--t5);text-align:center;padding:.2rem 0}
.drp-day{height:30px;display:flex;align-items:center;justify-content:center;
  font-size:12.5px;color:var(--t2);border-radius:var(--r3);cursor:pointer;transition:all .1s;position:relative}
.drp-day:hover:not(.drp-day-empty):not(.drp-day-disabled){background:var(--bg4);color:var(--t1)}
.drp-day-empty{pointer-events:none}
.drp-day-disabled{
  color:var(--t4);
  opacity:.32;
  pointer-events:none;
  cursor:not-allowed;
  text-decoration:line-through;
  text-decoration-thickness:.5px;
}
.drp-day-today{font-weight:700;color:var(--indigo)}
.drp-day-today::after{content:'';position:absolute;bottom:3px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;border-radius:50%;background:var(--indigo)}
.drp-day-start,.drp-day-end{background:var(--indigo)!important;color:#fff!important;font-weight:600}
.drp-day-start{border-radius:var(--r3) 0 0 var(--r3)}
.drp-day-end{border-radius:0 var(--r3) var(--r3) 0}
.drp-day-start.drp-day-end{border-radius:var(--r3)!important}
.drp-day-in-range{background:var(--indigo-soft);color:var(--indigo);border-radius:0}
.drp-day-start.drp-day-in-range{border-radius:var(--r3) 0 0 var(--r3)}
.drp-day-end.drp-day-in-range{border-radius:0 var(--r3) var(--r3) 0}

.drp-footer{display:flex;align-items:center;justify-content:space-between;
  padding-top:.65rem;border-top:1px solid var(--border);margin-top:.25rem;gap:.5rem}
.drp-presets{display:flex;gap:.3rem;flex-wrap:wrap}
.drp-preset{font-size:11px;padding:3px 8px;border-radius:20px;cursor:pointer;
  background:var(--bg4);border:1px solid var(--border);color:var(--t3);font-family:'DM Sans',sans-serif}
.drp-preset:hover{background:var(--indigo-soft);border-color:var(--indigo-mid);color:var(--indigo)}
.drp-apply{font-size:12px;padding:.3rem .8rem;border-radius:20px;cursor:pointer;
  background:var(--indigo);border:none;color:#fff;font-family:'DM Sans',sans-serif;font-weight:600}
.drp-apply:hover{background:var(--indigo-dim)}

/* ── TABLE FIXED FIRST COLUMNS — JS-driven offsets (applyStickyOffsets) ── */
/* All tables: position:sticky is set by JS after render; CSS only provides fallback bg */

/* Sticky header for all named table containers */
#sig-tc .dt thead th,
#ivs-tc .dt thead th,
#lists-tc .dt thead th,
#news-tc .dt thead th,
#tc .dt thead th { position:sticky!important; top:0; z-index:10; background:var(--bg2); box-shadow:0 1px 0 var(--border); }
/* Filter rows sit flush below header row */
#sig-tc .dt thead tr.col-filters th,
#ivs-tc .dt thead tr.col-filters th { position:sticky!important; z-index:9; background:var(--bg2); }

/* Statistics — border-collapse:separate needed for sticky to work correctly */
#stats-tc .dt { border-collapse:separate;border-spacing:0 }
/* Fund table */
#fund-tc .dt { border-collapse: separate; border-spacing: 0; }
/* SearchBuilder rule row */
.sb-rule { display: flex; gap: .4rem; align-items: center; margin-bottom: .35rem; flex-wrap: wrap; }
.sb-rule select, .sb-rule input { font-size: 12px; padding: .25rem .45rem; border: 1px solid var(--border); border-radius: var(--r3); background: var(--bg3); color: var(--t1); font-family: inherit; }
.sb-rule select:focus, .sb-rule input:focus { outline: none; border-color: var(--indigo-mid); }
.sb-rule .sb-del { width:22px;height:22px;display:flex;align-items:center;justify-content:center;background:none;border:1px solid var(--border);border-radius:var(--r3);color:var(--rose);cursor:pointer;font-size:13px; }
.sb-rule .sb-del:hover { background:var(--rose);color:#fff; }
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bg5);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--t5)}

/* ── OPT STRATEGIES / OPT CHAIN: JS-driven sticky (applyStickyOffsets) ── */
/* Static size hints so JS measure is stable */
#opt-strat-tc .dt thead th:nth-child(1),
#opt-strat-tc .dt tbody td:nth-child(1),
#opt-chain-tc .dt thead th:nth-child(1),
#opt-chain-tc .dt tbody td:nth-child(1){ min-width:36px;max-width:36px }
#opt-strat-tc .dt thead th:nth-child(2),
#opt-strat-tc .dt tbody td:nth-child(2),
#opt-chain-tc .dt thead th:nth-child(2),
#opt-chain-tc .dt tbody td:nth-child(2){ min-width:120px }

/* ── .sc / .sc-last — universal sticky-column helper classes ─────────── */
/* Applied by applyStickyOffsets() to every frozen thead-th and tbody-td  */
.dt thead th.sc,
.dt thead th.sc-last {
  position: sticky !important;
  background: var(--bg2);
  z-index: 11;
}
.dt thead th.sc-last { z-index: 12; border-right: 2px solid var(--border2); box-shadow: 2px 0 8px rgba(0,0,0,.08); }

/* tbody frozen cells — always fully opaque so scrolled content never bleeds through */
.dt tbody td.sc,
.dt tbody td.sc-last {
  position: sticky !important;
  z-index: 1;
  background: var(--bg3);
}
.dt tbody td.sc-last { border-right: 2px solid var(--border2); box-shadow: 2px 0 8px rgba(0,0,0,.08); }

/* even-row tint: pre-blended rgba(0,0,0,.03) over theme bg */
.dt tbody tr:nth-child(even) td.sc,
.dt tbody tr:nth-child(even) td.sc-last {
  background: var(--sc-even);
}

/* hover: pre-blended rgba(79,70,229,.04) over theme bg */
.dt tbody tr:hover td.sc,
.dt tbody tr:hover td.sc-last {
  background: var(--sc-hover) !important;
}

/* hover-highlight / row-highlight: pre-blended rgba(79,70,229,.08) */
.dt tbody tr.hover-highlight td.sc,
.dt tbody tr.hover-highlight td.sc-last,
.dt tbody tr.row-highlight td.sc,
.dt tbody tr.row-highlight td.sc-last {
  background: var(--sc-hi) !important;
}

/* ── Mobile: compact tables + sticky col caps ───────────────────────── */
@media (max-width: 768px) {
  /* Tighter cells so more data columns are visible */
  .tw .dt thead th,
  .tw .dt tbody td { font-size: 11px !important; padding: 3px 5px !important; }

  /* Symbol badge narrower — prevents it from swallowing the sticky zone */
  .sym-badge { font-size: 10px; padding: .04rem .28rem;
    max-width: 60px; overflow: hidden; text-overflow: ellipsis;
    display: inline-block; vertical-align: middle; }

  /* Hard cap on sticky cell width — last resort if JS clamp wasn't enough */
  .dt thead th.sc, .dt thead th.sc-last,
  .dt tbody  td.sc, .dt tbody  td.sc-last {
    max-width: 80px; overflow: hidden; text-overflow: ellipsis;
  }

  /* Smooth momentum scroll on iOS */
  .tw { -webkit-overflow-scrolling: touch; }
}

/* ── OPT TABLE scroll wrapper ── */
.opt-tw{overflow-x:auto;overflow-y:auto;max-height:700px;border-radius:var(--r2)}
.opt-tw table.dt{min-width:100%;white-space:nowrap}
.opt-tw table.dt thead th{position:sticky;top:0;z-index:4;background:var(--bg3)}
/* searchHighlight */
mark.sh{background:var(--amber-soft);color:inherit;border-radius:2px;padding:0 1px}
/* factor pill for categorical columns */
span.fct{display:inline-block;padding:.08rem .45rem;border-radius:20px;font-size:11px;
  background:var(--indigo-soft);border:1px solid var(--indigo-mid);color:var(--indigo);font-family:'DM Mono',monospace}
/* row hover highlight (mirrors DT hover callback) */
.dt tbody tr.hover-highlight td{background:var(--indigo-soft)!important}
/* Touch devices: hover-highlight is a no-op — mouseleave never fires reliably on touch */
@media (hover: none) {
  .dt tbody tr.hover-highlight,
  .dt tbody tr.hover-highlight td,
  .dt tbody tr.hover-highlight td.sc,
  .dt tbody tr.hover-highlight td.sc-last { background: inherit !important; outline: none !important; }
}
/* ── SYM STATS: JS-driven sticky columns (applyStickyOffsets) ── */
/* Size hints only — left values set by JS */
#sym-tc .dt thead th:nth-child(1),#sym-filtered-tc .dt thead th:nth-child(1),
#sym-tc .dt tbody td:nth-child(1),#sym-filtered-tc .dt tbody td:nth-child(1){ min-width:36px;max-width:36px }
@media(max-width:1400px){.ctrl-grid{grid-template-columns:1fr 1fr 1fr!important}}
@media(max-width:1100px){.ctrl-grid{grid-template-columns:1fr 1fr!important}}
@media(max-width:900px){.ctrl-grid{grid-template-columns:1fr!important}.ctrl-col{border-right:none!important;border-bottom:1px solid var(--border);padding:.85rem 0!important}.ctrl-col:last-child{border-bottom:none}}
@media(max-width:768px){
  .ctrl-col{padding:.85rem .75rem!important}
  .ctrl-col:first-child,.ctrl-col:last-child{padding-left:.75rem!important;padding-right:.75rem!important}
  /* Search input: fixed 180px overflows on narrow screens */
  .sbox input{width:80px}
  /* tbar right group: allow buttons to wrap onto a second line */
  .tbar > div{flex-wrap:wrap}
  /* action-pill: tighter so it doesn't push the panel width */
  .action-pill{gap:.4rem;padding:.55rem .75rem}
  .btn-fetch,.btn-secondary{font-size:12px;padding:.38rem .75rem}
  /* Hard stop — nothing escapes the panel on mobile */
  .panel,.panel-body{overflow-x:hidden;max-width:100%}
}
@media(max-width:600px){
  .main{padding:.85rem .75rem}
  .panel-body{padding:.9rem .9rem .5rem}
  .brand-name{display:none}
  .user-chip span:not(.live-dot){display:none}
  .user-chip{padding:.28rem .55rem}
  .topbar-right .tbtn:nth-child(n+3){display:none}
}
@media(max-width:400px){.brand-pill{display:none}}

/* ── TABLE RANGE FILTER ROW ── */
.rf-wrap{margin-bottom:.85rem}
.rf-toggle-bar{display:flex;align-items:center;gap:.5rem;padding:.3rem 1rem .25rem;background:var(--bg2);border-top:1px solid var(--border);margin-bottom:.35rem}
.rf-toggle{display:inline-flex;align-items:center;gap:.3rem;cursor:pointer;font-size:11.5px;color:var(--t3);padding:.2rem .5rem;border-radius:var(--r3);border:none;background:transparent;transition:background .15s}
.rf-toggle:hover{background:var(--bg3)}
.rf-toggle .chev{font-size:14px;transition:transform .22s ease}
.rf-toggle.open .chev{transform:rotate(180deg)}
.rf-collapse{overflow:hidden;max-height:0;transition:max-height .25s ease}
.rf-collapse.open{max-height:4000px}
.rf-row{display:flex;flex-wrap:wrap;gap:.5rem 1rem;padding:.6rem 1rem .9rem;background:var(--bg2);border-bottom:1px solid var(--border);align-items:flex-end}
#rfrow-fund{display:grid;grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:.5rem 1rem;max-height:272px;overflow-y:auto;padding-right:.25rem}
.rf-cell{display:flex;flex-direction:column;gap:.18rem;min-width:80px;max-width:135px;flex:1 1 80px}
.rf-cell.wide{min-width:115px;max-width:190px}
.rf-lbl{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rf-val{font-size:10px;font-family:'DM Mono',monospace;color:var(--teal);text-align:center;line-height:1.2}
.rf-dual{position:relative;height:22px;display:flex;align-items:center}
.rf-track{position:absolute;left:0;right:0;height:3px;background:var(--bg5);border-radius:2px}
.rf-fill{position:absolute;height:3px;background:linear-gradient(90deg,var(--indigo),var(--teal));border-radius:2px;left:0;width:100%}
.rf-dual input[type=range]{position:absolute;width:100%;pointer-events:none;background:transparent;height:3px;-webkit-appearance:none;outline:none}
.rf-dual input[type=range]::-webkit-slider-thumb{pointer-events:all;width:12px;height:12px;border-radius:50%;background:var(--indigo);border:2px solid var(--bg1);cursor:pointer;-webkit-appearance:none;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.rf-dual input[type=range]::-moz-range-thumb{pointer-events:all;width:10px;height:10px;border-radius:50%;background:var(--indigo);border:2px solid var(--bg1);cursor:pointer}
.rf-dual input[type=range]:first-of-type{z-index:3}
.rf-dual input[type=range]:last-of-type{z-index:4}
/* Per-column filter clear button — shown via .rf-active class when a range is active */
.rf-clr{display:none;background:none;border:none;color:var(--rose);cursor:pointer;font-size:13px;line-height:1;padding:0 .2rem;opacity:.75;margin-left:auto;flex-shrink:0}
.rf-clr:hover{opacity:1}
.rf-cell.rf-active .rf-clr{display:block}
/* Sort badge — shown in toolbar when a column sort is active */
.sort-badge{display:none;align-items:center;gap:.28rem;padding:.18rem .4rem .18rem .55rem;background:var(--indigo-soft);border:1px solid var(--indigo-mid);border-radius:var(--r3);font-size:11px;color:var(--indigo);font-weight:500;white-space:nowrap;vertical-align:middle}
.sort-badge.active{display:inline-flex}
.sb-lbl{color:var(--t4);font-weight:400;font-size:10.5px}
.sb-dir{font-size:10px}
.sb-x{background:none;border:none;color:var(--indigo);cursor:pointer;padding:0 .15rem;font-size:14px;line-height:1;margin-left:.1rem;opacity:.65}
.sb-x:hover{color:var(--rose);opacity:1}
.rf-txt{width:100%;padding:.22rem .45rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r3);color:var(--t1);font-size:11.5px;outline:none;box-sizing:border-box}
.rf-txt:focus{border-color:var(--indigo)}
/* ── rf factor multi-select dropdown ── */
.rf-fct-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.22rem .4rem .22rem .45rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r3);color:var(--t1);font-size:11.5px;font-family:'DM Sans',sans-serif;cursor:pointer;outline:none;text-align:left;box-sizing:border-box;gap:2px}
.rf-fct-btn:hover{border-color:var(--indigo-mid)}
.rf-fct-btn:focus{border-color:var(--indigo)}
.rf-fct-btn--active{border-color:var(--indigo-mid);background:var(--indigo-soft);color:var(--indigo)}
.rf-fct-lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.rf-fct-arr{font-family:'Material Icons Round';font-size:14px;color:var(--t4);flex-shrink:0;line-height:1}
.rf-fct-drop{position:fixed;z-index:9999;background:var(--bg3);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.13);display:none;flex-direction:column;min-width:140px;max-width:260px;opacity:0;transition:opacity .12s;overflow:hidden}
.rf-fct-drop.open{display:flex;opacity:1}
.rf-fct-opts{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
.rf-fct-drop.open{display:flex;opacity:1}
.rf-fct-search-wrap{padding:6px 6px 4px;border-bottom:1px solid var(--border);flex-shrink:0}
.rf-fct-search{width:100%;box-sizing:border-box;padding:.28rem .55rem;font-size:12px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:6px;background:var(--bg2);color:var(--t1);outline:none}
.rf-fct-search:focus{border-color:var(--indigo)}
.rf-fct-opts{overflow-y:auto;max-height:220px;padding:4px}
.rf-fct-opt{display:flex;align-items:center;gap:7px;padding:.3rem .55rem;border-radius:6px;cursor:pointer;font-size:12.5px;color:var(--t1)}
.rf-fct-opt:hover{background:var(--indigo-soft)}
.rf-fct-opt input[type=checkbox]{accent-color:var(--indigo);width:13px;height:13px;flex-shrink:0;cursor:pointer}
.rf-fct-footer{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 6px;border-top:1px solid var(--border);flex-shrink:0}
.rf-fct-clear{background:none;border:none;color:var(--t4);font-size:11px;cursor:pointer;font-family:'DM Sans',sans-serif;padding:0}
.rf-fct-clear:hover{color:var(--rose)}
.rf-fct-count{font-size:10.5px;color:var(--indigo);font-weight:500}
.rf-fct-opt--dead{opacity:.5;font-style:italic}
.rf-fct-opt--dead input[type=checkbox]{opacity:.6}
.rf-fct-dead-mark{color:var(--amber);font-size:10px;margin-left:3px}
/* ── Tier-1 filter UX ── */
.rf-th-active{border-bottom:2px solid var(--indigo)!important;color:var(--indigo)!important}
.rf-cnt-badge{font-size:11px;font-weight:700;color:var(--indigo);letter-spacing:.02em}
.rf-zero-state{margin:.5rem 1rem}
.rf-zero-clr{background:none;border:1px solid var(--rose);color:var(--rose);border-radius:var(--r3);font-size:11px;padding:.15rem .5rem;cursor:pointer;margin-left:.5rem;font-family:'DM Sans',sans-serif}
.rf-zero-clr:hover{background:var(--rose);color:#fff}
.rf-fct-selall{display:flex;gap:4px;padding:3px 0 0}
.rf-fct-selall-btn{flex:1;padding:.2rem 0;background:var(--bg2);border:1px solid var(--border);border-radius:var(--r3);color:var(--t3);font-size:11px;cursor:pointer;font-family:'DM Sans',sans-serif}
.rf-fct-selall-btn:hover{border-color:var(--indigo);color:var(--indigo)}
/* ── Tier-2 filter UX ── */
.rf-chips-bar{display:flex;flex-wrap:wrap;gap:4px;padding:4px 0 6px}
.rf-chip{display:inline-flex;align-items:center;gap:4px;background:var(--indigo-muted,rgba(79,70,229,.12));color:var(--indigo);border:1px solid var(--indigo);border-radius:20px;padding:2px 8px 2px 10px;font-size:11px;font-family:'DM Sans',sans-serif;white-space:nowrap}
.rf-chip-x{background:none;border:none;color:var(--indigo);cursor:pointer;font-size:13px;padding:0;line-height:1;margin-left:2px}
.rf-chip-x:hover{color:var(--rose)}
.rf-fct-hit{font-size:10px;color:var(--t4);margin-left:auto;padding-left:6px;flex-shrink:0}
.rf-fct-hit--zero{color:var(--t5,#bbb)}
.rf-fct-opt{display:flex;align-items:center;gap:0}
.rf-srch-ind{display:inline-flex;align-items:center;padding:2px 8px;background:var(--indigo-muted,rgba(79,70,229,.12));color:var(--indigo);border:1px solid var(--indigo);border-radius:20px;font-size:11px;font-family:'DM Sans',sans-serif;cursor:pointer;white-space:nowrap;flex-shrink:0}
.rf-srch-ind:hover{background:var(--indigo);color:#fff}
/* ── Tier-3 filter UX ── */
.rf-diagnose p button{margin-left:.5rem}
.rf-preset-wrap{display:flex;align-items:center;gap:4px;margin-left:auto}
.rf-preset-inp{padding:.2rem .5rem;font-size:11px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:var(--r3);background:var(--bg2);color:var(--t1);width:110px;outline:none}
.rf-preset-inp:focus{border-color:var(--indigo)}
.rf-preset-btn{padding:.2rem .55rem;font-size:11px;font-family:'DM Sans',sans-serif;background:var(--indigo);color:#fff;border:none;border-radius:var(--r3);cursor:pointer}
.rf-preset-btn:hover{opacity:.85}
.rf-preset-sel{padding:.2rem .4rem;font-size:11px;font-family:'DM Sans',sans-serif;border:1px solid var(--border);border-radius:var(--r3);background:var(--bg2);color:var(--t1);cursor:pointer;max-width:140px}
.rf-preset-del{background:none;border:1px solid var(--border);color:var(--t4);border-radius:var(--r3);font-size:13px;padding:.1rem .45rem;cursor:pointer}
.rf-preset-del:hover{border-color:var(--rose);color:var(--rose)}
@keyframes rfFlashNew{0%{background:rgba(16,185,129,.35)}100%{background:transparent}}
@keyframes rfFlashGone{0%{background:rgba(239,68,68,.25)}100%{background:transparent;opacity:0}}
.rf-flash-new{animation:rfFlashNew 1.5s ease-out forwards}
.rf-flash-gone{animation:rfFlashGone .9s ease-out forwards;pointer-events:none}
/* ── Tier-1 filter UX additions ── */
.rf-th-active{border-bottom:2px solid var(--indigo)!important;color:var(--indigo)!important}
.rf-cnt-badge{font-size:11px;font-weight:700;color:var(--indigo);letter-spacing:.02em}
.rf-zero-state{margin:.5rem 1rem}
.rf-zero-clr{background:none;border:1px solid var(--rose);color:var(--rose);border-radius:var(--r3);font-size:11px;padding:.15rem .5rem;cursor:pointer;margin-left:.5rem;font-family:'DM Sans',sans-serif}
.rf-zero-clr:hover{background:var(--rose);color:#fff}
.rf-fct-selall{display:flex;gap:4px;padding:3px 0 0}
.rf-fct-selall-btn{flex:1;padding:.2rem 0;background:var(--bg2);border:1px solid var(--border);border-radius:var(--r3);color:var(--t3);font-size:11px;cursor:pointer;font-family:'DM Sans',sans-serif}
.rf-fct-selall-btn:hover{border-color:var(--indigo);color:var(--indigo)}
.rf-fct-btn--has-dead{border-color:var(--amber)!important;color:var(--amber)}
.rf-cell-factor{min-width:140px;max-width:280px}
.rf-chips{display:flex;flex-wrap:wrap;gap:3px;margin-top:2px}
.rf-chip{padding:1px 7px;border-radius:20px;font-size:10.5px;font-weight:500;cursor:pointer;border:1px solid var(--border);background:transparent;color:var(--t3);white-space:nowrap;user-select:none;transition:background .12s,color .12s,border-color .12s}
.rf-chip:hover{border-color:var(--indigo-mid);color:var(--indigo)}
.rf-chip.on{background:var(--indigo-soft);border-color:var(--indigo-mid);color:var(--indigo);font-weight:600}
.rf-date{width:100%;padding:.2rem .35rem;background:var(--bg3);border:1px solid var(--border);border-radius:var(--r3);color:var(--t1);font-size:11px;outline:none;box-sizing:border-box}
.rf-date:focus{border-color:var(--indigo)}
.rf-num-inp{
  flex:1;min-width:0;padding:.18rem .35rem;
  background:var(--bg3);border:1px solid var(--border);border-radius:var(--r3);
  color:var(--t1);font-size:10.5px;font-family:'DM Mono',monospace;
  outline:none;box-sizing:border-box;
  /* Hide browser spinner arrows — they waste space and we have the slider */
  -moz-appearance:textfield;
}
.rf-num-inp::-webkit-outer-spin-button,
.rf-num-inp::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.rf-num-inp:focus{border-color:var(--indigo)}

/* ── dt-styled: applied by applyInitializeTables, replaces per-cell border JS ── */
.dt-styled thead { background:var(--indigo-soft); color:var(--t1); border:2px solid var(--border2); }
.dt-styled thead th { font-weight:400; border-right:1px solid white; }
.dt-styled thead th:last-child { border-right:none; }
.dt-styled tbody { border-top:2px solid var(--border2); }
.dt-styled tbody td { border-right:1px solid white; }
.dt-styled tbody td:last-child { border-right:none; }
/* ── Sticky table header — stays visible when page scrolls ── */
.dt thead th { position:sticky;top:0;z-index:10;background:var(--bg2);box-shadow:0 1px 0 var(--border); }
.dt thead tr.col-filters th { position:sticky;top:var(--thead-h,33px);z-index:9;background:var(--bg2); }

/* ── API Error Toasts ── */
#api-toast-stack{position:fixed;bottom:18px;right:18px;z-index:9999;display:flex;flex-direction:column-reverse;gap:8px;pointer-events:none}
.api-toast{pointer-events:auto;display:flex;flex-direction:column;gap:4px;min-width:280px;max-width:380px;
  background:var(--bg3);border:1px solid var(--rose);border-left:4px solid var(--rose);
  border-radius:var(--r2);box-shadow:0 6px 28px rgba(0,0,0,.35);padding:10px 12px 10px 12px;
  animation:toast-in .2s ease;position:relative}
@keyframes toast-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.api-toast.toast-out{animation:toast-out .25s ease forwards}
@keyframes toast-out{to{opacity:0;transform:translateY(10px)}}
.api-toast-head{display:flex;align-items:center;gap:7px}
.api-toast-icon{font-size:17px;color:var(--rose);flex-shrink:0}
.api-toast-title{font-size:12.5px;font-weight:600;color:var(--t1);flex:1}
.api-toast-close{background:none;border:none;cursor:pointer;color:var(--t4);font-size:16px;line-height:1;padding:0 2px;margin-left:4px}
.api-toast-close:hover{color:var(--t1)}
.api-toast-reason{font-size:11.5px;color:var(--t3);margin-left:24px}
.api-toast-detail{font-size:10.5px;color:var(--t4);font-family:'DM Mono',monospace;
  margin-left:24px;word-break:break-all;cursor:pointer;user-select:none}
.api-toast-detail summary{list-style:none;outline:none;color:var(--t4)}
.api-toast-detail summary::-webkit-details-marker{display:none}
.api-toast-detail summary::before{content:'▸ ';font-size:9px}
details.api-toast-detail[open] summary::before{content:'▾ '}
.api-toast-detail .dt-url{color:var(--t3);font-size:10px;margin-top:2px;padding-left:10px}
.api-toast-bar{position:absolute;bottom:0;left:0;height:2px;background:var(--rose);border-radius:0 0 0 var(--r2);
  animation:toast-bar linear forwards}
@keyframes toast-bar{from{width:100%}to{width:0%}}
.api-toast.ok{border-color:var(--emerald);border-left-color:var(--emerald)}
.api-toast.ok .api-toast-icon{color:var(--emerald)}
.api-toast.ok .api-toast-bar{background:var(--emerald)}

/* ── Zoom Widget ── */
#zoom-bar{
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  z-index:8000;
  display:flex;align-items:center;gap:.5rem;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:12px 12px 0 0;
  padding:.35rem .75rem .3rem;
  box-shadow:0 -2px 12px rgba(0,0,0,.08);
  font-family:'DM Sans',sans-serif;
  opacity:.55;transition:opacity .2s;
}
#zoom-bar:hover{opacity:1;}
.zb-btn{
  width:22px;height:22px;border:1px solid var(--border);border-radius:6px;
  background:var(--bg4);color:var(--t2);font-size:15px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:background .12s,color .12s;
  font-weight:500;padding-bottom:1px;
}
.zb-btn:hover{background:var(--indigo-soft);color:var(--indigo);border-color:var(--indigo-mid);}
#zoom-slider{
  -webkit-appearance:none;appearance:none;
  width:110px;height:4px;border-radius:2px;
  background:var(--bg5);outline:none;cursor:pointer;
}
#zoom-slider::-webkit-slider-thumb{
  -webkit-appearance:none;width:13px;height:13px;border-radius:50%;
  background:var(--indigo);border:2px solid #fff;
  box-shadow:0 1px 4px rgba(0,0,0,.2);cursor:grab;
}
#zoom-slider::-moz-range-thumb{
  width:13px;height:13px;border-radius:50%;
  background:var(--indigo);border:2px solid #fff;
  box-shadow:0 1px 4px rgba(0,0,0,.2);cursor:grab;border:none;
}
#zoom-label{
  font-size:11px;font-weight:600;color:var(--t3);
  min-width:33px;text-align:center;font-family:'DM Mono',monospace;
}

/* ── Ideas Journal Panel ─────────────────────────────────────────────── */
#journal-overlay{
  position:fixed;inset:0;z-index:1095;background:rgba(0,0,0,.0);pointer-events:none;
  transition:background .25s ease;
}
#journal-overlay.open{background:rgba(0,0,0,.22);pointer-events:auto;}
#journal-panel{
  position:fixed;top:0;right:0;bottom:0;width:440px;max-width:96vw;z-index:1096;
  background:var(--bg3);border-left:1px solid var(--border);
  box-shadow:-6px 0 32px rgba(0,0,0,.14);
  display:flex;flex-direction:column;
  transform:translateX(100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
#journal-panel.open{transform:translateX(0);}
.journal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:.9rem 1.1rem .75rem;border-bottom:1px solid var(--border);flex-shrink:0;
}
.journal-head-title{
  font-weight:600;font-size:14px;color:var(--t1);
  display:flex;align-items:center;gap:.45rem;
}
.journal-body{
  flex:1;display:flex;flex-direction:column;padding:.75rem;overflow:hidden;
}
#journal-textarea{
  flex:1;width:100%;box-sizing:border-box;min-height:0;
  background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2);
  color:var(--t1);font-family:'DM Mono',monospace;font-size:12.5px;
  line-height:1.75;padding:.75rem .85rem;resize:none;outline:none;
  transition:border-color .15s,box-shadow .15s;
}
#journal-textarea:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow);}
.journal-footer{
  display:flex;align-items:center;justify-content:space-between;
  padding:.6rem 1.1rem;border-top:1px solid var(--border);flex-shrink:0;
  gap:.5rem;flex-wrap:wrap;
}
@media(max-width:600px){
  #journal-panel{width:100vw;}
}

/* ── Market Intel Modal ─────────────────────────────────────────────── */
.brief-overlay{
  position:fixed;inset:0;z-index:1200;
  background:rgba(0,0,0,.52);backdrop-filter:blur(6px);
  display:none;
}
.brief-overlay.open{display:block;}
.brief-modal{
  position:fixed;z-index:1201;
  top:50%;left:50%;
  transform:translate(-50%,-50%) scale(.94);
  opacity:0;pointer-events:none;
  width:min(780px,94vw);max-height:87vh;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--r);
  box-shadow:0 28px 80px rgba(0,0,0,.38),0 4px 20px rgba(0,0,0,.18);
  display:flex;flex-direction:column;overflow:hidden;
  transition:transform .32s cubic-bezier(.34,1.2,.64,1),opacity .22s ease;
}
.brief-modal.open{
  transform:translate(-50%,-50%) scale(1);
  opacity:1;pointer-events:auto;
}
/* Header */
.brief-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.1rem 1.4rem .9rem;
  background:linear-gradient(135deg,var(--indigo-soft) 0%,transparent 60%);
  border-bottom:1px solid var(--border);flex-shrink:0;
}
.brief-header-left{display:flex;align-items:center;gap:.85rem;}
.brief-logo{
  width:42px;height:42px;border-radius:11px;
  background:linear-gradient(135deg,var(--indigo),var(--indigo-dim));
  display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;
  box-shadow:0 4px 14px rgba(79,70,229,.3);
}
.brief-title{
  font-family:'Sora',sans-serif;font-size:16px;font-weight:700;
  color:var(--t1);letter-spacing:-.02em;
}
.brief-subtitle{font-size:11.5px;color:var(--t4);margin-top:2px;}
.brief-close{
  width:30px;height:30px;border:1px solid var(--border);
  background:var(--bg3);border-radius:var(--r3);
  color:var(--t3);cursor:pointer;display:flex;align-items:center;
  justify-content:center;flex-shrink:0;transition:all .12s;
}
.brief-close:hover{background:var(--rose);border-color:var(--rose);color:#fff;}
.brief-close .mi{font-size:16px;}
/* Tabs */
.brief-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--border);
  padding:0 1.4rem;flex-shrink:0;background:var(--bg2);
}
.brief-tab{
  display:flex;align-items:center;gap:.35rem;
  padding:.55rem .9rem;font-size:13px;font-weight:500;
  color:var(--t4);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:all .15s;white-space:nowrap;
}
.brief-tab:hover{color:var(--t2);}
.brief-tab.active{color:var(--indigo);border-bottom-color:var(--indigo);font-weight:600;}
.brief-tab-badge{
  display:inline-flex;align-items:center;
  padding:1px 6px;border-radius:20px;
  background:var(--indigo-soft);border:1px solid var(--indigo-mid);
  color:var(--indigo);font-size:10px;font-weight:700;
  font-family:'DM Mono',monospace;
}

/* ── Morning Brief search bar ── */
.brief-search-wrap{
  display:flex;align-items:center;gap:.5rem;
  padding:.55rem 1.25rem;
  border-bottom:1px solid var(--border);
  flex-shrink:0;background:var(--bg2);
  position:sticky;top:0;z-index:2;
}
.brief-search-wrap .npop-search-icon{font-size:16px;color:var(--t5);flex-shrink:0}
.brief-search-wrap .npop-search-input{
  flex:1;background:var(--bg3);border:1px solid var(--border);border-radius:8px;
  padding:.32rem .65rem;font-size:13px;color:var(--t1);outline:none;min-width:0;
  font-family:inherit;transition:border-color .12s,box-shadow .12s;
}
.brief-search-wrap .npop-search-input::placeholder{color:var(--t5)}
.brief-search-wrap .npop-search-input:focus{
  border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-glow)
}
.brief-search-wrap .npop-search-count{
  font-size:11px;font-weight:600;color:var(--t4);white-space:nowrap;
  font-family:'DM Mono',monospace;flex-shrink:0;min-width:3.5rem;text-align:right;
}

/* Body */
.brief-body{flex:1;overflow:hidden;min-height:0;display:flex;flex-direction:column;}
.brief-panel{display:none;flex-direction:column;flex:1;min-height:0;overflow:hidden;}
.brief-panel.active{display:flex;}
.brief-loading{
  display:flex;align-items:center;justify-content:center;
  gap:.75rem;padding:3rem 2rem;color:var(--t4);font-size:13px;flex-shrink:0;
}
.brief-empty{
  display:none;flex-direction:column;align-items:center;
  justify-content:center;gap:.75rem;padding:3rem 2rem;color:var(--t4);flex-shrink:0;
}
.brief-empty .mi{font-size:36px;opacity:.2;}
.brief-empty p{font-size:13px;}
.brief-news-list{
  overflow-y:auto;flex:1;min-height:0;
  padding:.65rem .85rem;
  display:none;flex-direction:column;
}
/* ── Economic event cards ── */
.brief-eco-card{
  display:flex;flex-direction:column;gap:.22rem;
  padding:.55rem .8rem;
  border-radius:var(--r3);
  background:var(--bg2);
  border:1px solid var(--border3);
  margin-bottom:.3rem;
  transition:background .1s,border-color .1s;
}
.brief-eco-card:hover{background:var(--bg3);border-color:var(--border);}
.brief-eco-row{
  display:flex;align-items:center;gap:.45rem;overflow:hidden;
}
.brief-eco-time{
  font-family:'DM Mono',monospace;font-size:11px;font-weight:600;
  color:var(--indigo);background:var(--indigo-soft);
  border:1px solid var(--indigo-mid);border-radius:5px;
  padding:1px 7px;white-space:nowrap;flex-shrink:0;
}
.brief-eco-flag{font-size:14px;flex-shrink:0;}
.brief-eco-curr{
  font-size:10.5px;font-weight:700;color:var(--t3);
  font-family:'DM Mono',monospace;flex-shrink:0;
}
.brief-eco-name{
  font-size:12.5px;color:var(--t1);font-weight:500;
  flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.brief-eco-imp{
  font-size:9px;letter-spacing:2px;flex-shrink:0;
}
.brief-eco-data{
  display:flex;gap:.5rem;flex-wrap:wrap;padding-left:.15rem;
}
.brief-eco-val{
  font-family:'DM Mono',monospace;font-size:11px;color:var(--t4);
  background:var(--bg4);border-radius:4px;padding:1px 6px;
}
.brief-eco-val.actual strong{color:var(--t1);}
.brief-eco-val.muted{opacity:.7;}
/* ── Earnings cards ── */
.brief-earn-group{
  margin-bottom:.85rem;
}
.brief-earn-label{
  display:flex;align-items:center;gap:.4rem;
  font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.07em;color:var(--t3);
  padding:.3rem .2rem .4rem;border-bottom:1px solid var(--border3);
  margin-bottom:.45rem;
}
.brief-earn-count{
  margin-left:auto;font-size:10px;font-weight:600;
  color:var(--t4);background:var(--bg4);border-radius:20px;
  padding:1px 7px;font-family:'DM Mono',monospace;
}
.brief-earn-grid{
  display:flex;flex-direction:column;gap:.25rem;
}
.brief-earn-card{
  display:flex;align-items:center;gap:.6rem;
  padding:.4rem .65rem;
  background:var(--bg2);border:1px solid var(--border3);
  border-radius:var(--r3);
  transition:background .1s;
}
.brief-earn-card:hover{background:var(--bg3);}
.brief-earn-name{
  font-size:12.5px;color:var(--t2);flex:1;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.brief-earn-eps{
  font-family:'DM Mono',monospace;font-size:11px;
  color:var(--teal);background:rgba(13,148,136,.07);
  border:1px solid rgba(13,148,136,.18);border-radius:4px;
  padding:1px 7px;white-space:nowrap;flex-shrink:0;
}
/* ── Watchlist cards ── */
.brief-wl-card{
  display:flex;align-items:center;gap:.7rem;
  padding:.5rem .65rem;
  background:var(--bg2);border:1px solid var(--border3);
  border-radius:var(--r3);margin-bottom:.3rem;
  transition:background .1s;
}
.brief-wl-card:hover{background:var(--bg3);}
/* Footer */
.brief-footer{
  display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1.4rem;border-top:1px solid var(--border);
  background:var(--bg2);flex-shrink:0;gap:1rem;flex-wrap:wrap;
}
.brief-footer-left{font-size:11.5px;color:var(--t4);font-family:'DM Mono',monospace;}
.brief-cta{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.5rem 1.4rem;
  background:linear-gradient(135deg,var(--indigo),var(--indigo-dim));
  color:#fff;border:none;border-radius:30px;
  font-size:13px;font-family:'DM Sans',sans-serif;font-weight:600;
  cursor:pointer;letter-spacing:-.01em;
  box-shadow:0 2px 14px rgba(79,70,229,.4);
  transition:all .15s;
}
.brief-cta:hover{transform:translateY(-1px);box-shadow:0 4px 22px rgba(79,70,229,.52);}
.brief-cta .mi{font-size:16px;}
@media(max-width:600px){
  .brief-header{padding:.9rem 1rem .8rem;}
  .brief-tabs{padding:0 .75rem;}
  .brief-footer{padding:.7rem 1rem;}
}

/* Ensure the calendar is above all sidebars and topbars */
.flatpickr-calendar {
    z-index: 99999 !important;
    position: absolute;
}

/* IMPORTANT: Ensure your tab pages don't clip the dropdown */
.tab-page, .tab-container {
    overflow: visible !important;
}

/* ── Filter group containers ── */
.filter-group {
  background: var(--indigo-soft);
  border: 1px solid var(--border2);
  border-radius: var(--r3);
  padding: .55rem .7rem .5rem;
  margin-bottom: .35rem;
}

.filter-group-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--t4);
  margin-bottom: .45rem;
}

/* ── Spread / Volume pill switcher ── */
.spread-vol-switch {
  display: flex;
  gap: .3rem;
  margin-bottom: .6rem;
  background: var(--indigo-soft);
  border: 1px solid var(--border2);
  border-radius: var(--r3);
  padding: .4rem .5rem;
}
.filter-group .spread-vol-switch {
  background: none;
  border: none;
  border-radius: 0;
  padding: 0;
  margin-bottom: .5rem;
}

.sv-pill {
  flex: 1;
  padding: .28rem .5rem;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--bg3);
  color: var(--t4);
  font-size: 11.5px;
  font-family: 'DM Sans', sans-serif;
  font-weight: 500;
  cursor: pointer;
  text-align: center;
  transition: all .13s;
}
.sv-pill:hover { border-color: var(--indigo-mid); color: var(--indigo); }
.sv-pill.active {
  background: var(--indigo);
  border-color: var(--indigo);
  color: #fff;
}

/* ── Child indent for revealed sub-options ── */
.child-indent {
  padding-left: .85rem;
  border-left: 2px solid var(--border);
  margin-left: .2rem;
  margin-top: .25rem;
}

/* Tighten toggle-list when inside a filter-group */
.filter-group .toggle-list { margin-bottom: .25rem; }
.filter-group + .filter-group { margin-top: .5rem; }

.corp-type-warn {
  display: none;
  font-size: 11px;
  color: var(--amber, #f59e0b);
  font-weight: 500;
  margin-top: .35rem;
}
.corp-type-warn.on { display: block; }

.ptool .mi{font-size:14px}
.ptool.wl-active{
  color:var(--indigo)!important;
  border-color:var(--indigo-mid)!important;
  background:var(--indigo-soft)!important;
  box-shadow:0 0 0 2px var(--indigo-glow);
}
.ptool.wl-highlight{
  color:var(--teal)!important;
  border-color:var(--teal-mid)!important;
  background:var(--teal-soft)!important;
}
.dt tbody tr.wl-row-hl > td{background:var(--indigo-soft)!important}

/* ── Panel resize handle ── */
.panel-resize-handle{
  height:7px;
  cursor:row-resize;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  opacity:0;
  transition:opacity .15s;
  border-top:1px solid transparent;
  background:var(--bg3);
}
.panel-resize-handle::after{
  content:'';
  width:36px;
  height:3px;
  border-radius:2px;
  background:var(--border2);
}
.panel:hover .panel-resize-handle,
.panel-resize-handle.dragging{
  opacity:1;
  border-top-color:var(--border);
}

/* ══════════════════════════════════════════════════════════════════════
   ONBOARDING — demo modal + tour overrides
   ══════════════════════════════════════════════════════════════════════ */

/* ── Overlay + modal ─────────────────────────────────────────────────── */
#demo-overlay {
  position: fixed;
  inset: 0;
  z-index: 9100;
  background: rgba(0, 0, 0, 0.86);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  transition: opacity 0.42s ease;
}
#demo-overlay.demo-visible { opacity: 1; }
#demo-overlay.demo-hidden  { display: none; }

/* Onboarding-active: set on <html> by the inline <head> script for first-visit
   users. Forces overlay visible from first paint (overrides .demo-hidden) and
   hides app chrome so there's no flash of underlying content before the popup. */
html.onboarding-active #demo-overlay {
  display: flex !important;
  opacity: 1 !important;
}
html.onboarding-active body > *:not(#demo-overlay) {
  visibility: hidden;
}

.demo-modal {
  background: #0f1117;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 18px;
  padding: 1.85rem 2.1rem 1.5rem;
  max-width: 540px;
  width: 100%;
  max-height: 92vh;
  overflow-y: auto;
  box-shadow:
    0 40px 100px rgba(0, 0, 0, 0.7),
    0 0 0 1px rgba(99, 102, 241, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  position: relative;
  transform: translateY(28px) scale(0.97);
  transition: transform 0.44s cubic-bezier(0.16, 1, 0.3, 1);
  font-family: 'DM Sans', sans-serif;
}
#demo-overlay.demo-visible .demo-modal { transform: translateY(0) scale(1); }

/* ── Live badge ──────────────────────────────────────────────────────── */
.demo-live-badge {
  position: absolute;
  top: 1.1rem;
  right: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.32);
  transition: color 0.4s;
  font-family: 'DM Mono', monospace;
}
.demo-live-badge.demo-badge-ready    { color: #34d399; }
.demo-live-badge.demo-badge-offline  { color: #fbbf24; }
.demo-live-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.35;
  transition: opacity 0.4s, box-shadow 0.4s;
}
.demo-live-badge.demo-badge-ready    .demo-live-dot,
.demo-live-badge.demo-badge-offline  .demo-live-dot {
  opacity: 1;
  animation: demoPulse 1.6s ease-in-out infinite;
}
@keyframes demoPulse {
  0%, 100% { transform: scale(1);   box-shadow: 0 0 0 0   currentColor; opacity: 1;   }
  70%      { transform: scale(1.4); box-shadow: 0 0 0 6px transparent;  opacity: 0.5; }
}

/* ── Header copy ─────────────────────────────────────────────────────── */
.demo-eyebrow {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(129, 140, 248, 0.85);
  margin-bottom: 0.55rem;
  font-family: 'DM Mono', monospace;
}
.demo-headline {
  font-family: 'Sora', sans-serif;
  font-size: 1.55rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin: 0 0 0.55rem;
}
.demo-headline em {
  font-style: italic;
  font-weight: 500;
  color: var(--t2);
  font-family: 'Source Serif 4', 'Iowan Old Style', 'Apple Garamond',
               'Charter', Georgia, 'Times New Roman', serif;
  letter-spacing: 0;
}
.demo-headline .demo-n {
  font-variant-numeric: tabular-nums;
  display: inline-block;
  min-width: 1.5ch;
}
.demo-headline .demo-n-accent { color: var(--indigo); }
.demo-sub {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.55;
  margin: 0 0 1.3rem;
}

/* ── Funnel ──────────────────────────────────────────────────────────── */
.demo-funnel { display: flex; flex-direction: column; gap: 0.85rem; margin-bottom: 1.3rem; }
.demo-stage {
  opacity: 0;
  transform: translateX(-4px);
  animation: demoStageIn 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.demo-stage[data-stage="1"] { animation-delay: 0.05s; }
.demo-stage[data-stage="2"] { animation-delay: 0.30s; }
.demo-stage[data-stage="3"] { animation-delay: 0.55s; }
@keyframes demoStageIn { to { opacity: 1; transform: translateX(0); } }

.demo-stage-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.35rem;
}
.demo-stage-label {
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.demo-stage-num {
  font-style: italic;
  font-weight: 600;
  color: #818cf8;
  font-family: 'DM Sans', sans-serif;
  text-transform: lowercase;
  letter-spacing: 0;
  font-size: 0.85rem;
}
.demo-stage-val {
  font-family: 'Sora', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: #f0f2f8;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.demo-stage-val-accent { color: #34d399; }
.demo-stage-unit {
  font-family: 'DM Mono', monospace;
  font-size: 0.6rem;
  color: rgba(255, 255, 255, 0.32);
  margin-left: 0.4rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 500;
}
.demo-stage-unit-accent { color: rgba(52, 211, 153, 0.7); }

.demo-bar { height: 4px; background: rgba(255, 255, 255, 0.05); border-radius: 99px; overflow: hidden; }
.demo-bar-fill {
  height: 100%;
  width: var(--w, 0%);
  background: linear-gradient(90deg, #6366f1, #818cf8);
  border-radius: 99px;
  transition: width 1.0s cubic-bezier(0.65, 0, 0.35, 1);
}
.demo-bar-fill-accent {
  background: linear-gradient(90deg, #059669, #34d399);
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.4);
}

/* ── Ticker ──────────────────────────────────────────────────────────── */
.demo-ticker {
  background: rgba(255, 255, 255, 0.025);
  border-top:    1px solid rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  padding: 0.55rem 0;
  overflow: hidden;
  white-space: nowrap;
  margin: 0 -2.1rem 1.15rem;
  font-family: 'DM Mono', monospace;
  font-size: 0.7rem;
}
.demo-ticker-inner {
  display: inline-flex;
  gap: 1.6rem;
  animation: demoTickerScroll 38s linear infinite;
  padding-left: 100%;
}
@keyframes demoTickerScroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.demo-tk { display: inline-flex; align-items: center; gap: 0.45rem; color: rgba(255, 255, 255, 0.55); }
.demo-tk-m { font-size: 0.58rem; letter-spacing: 0.06em; color: rgba(255, 255, 255, 0.35); }
.demo-tk-s { font-weight: 700; color: #f0f2f8; font-family: 'DM Sans', sans-serif; }
.demo-tk-v { color: #34d399; font-weight: 500; }
.demo-tk-flag {
  display: inline-flex;
  align-items: center;
  color: #fb7185;
  font-weight: 700;
  font-size: 0.64rem;
  letter-spacing: 0.04em;
}

/* ── Cards ───────────────────────────────────────────────────────────── */
#demo-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.7rem; margin-bottom: 1.25rem; }
.demo-card {
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 11px;
  padding: 0.75rem 0.75rem 0.7rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  opacity: 0;
  transform: translateY(8px);
  animation: demoCardIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes demoCardIn { to { opacity: 1; transform: translateY(0); } }

.demo-skel {
  background: linear-gradient(90deg,
    rgba(255,255,255,0.025) 0%,
    rgba(255,255,255,0.06)  50%,
    rgba(255,255,255,0.025) 100%);
  background-size: 200% 100%;
  animation:
    demoCardIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards,
    demoSkel   1.4s ease infinite;
  animation-delay: var(--d, 0s), 0s;
  min-height: 110px;
}
@keyframes demoSkel {
  0%   { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

.demo-card-top { display: flex; justify-content: space-between; align-items: baseline; }
.demo-card-sym {
  font-family: 'Sora', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.02em;
}
.demo-card-rank {
  font-family: 'Sora', sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.demo-card-rank .demo-pct { font-size: 0.62rem; font-weight: 600; opacity: 0.7; margin-left: 1px; }

.demo-rank-track { height: 3px; border-radius: 99px; background: rgba(255, 255, 255, 0.07); overflow: hidden; }
.demo-rank-fill {
  height: 100%;
  border-radius: 99px;
  background: var(--rank-color, #818cf8);
  width: 0;
  animation: demoBarGrow 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes demoBarGrow { to { width: var(--rank-w, 0%); } }

.demo-card-metrics {
  display: flex;
  justify-content: space-between;
  font-family: 'DM Mono', monospace;
  font-size: 0.64rem;
  color: rgba(255, 255, 255, 0.6);
}
.demo-card-metrics b { color: rgba(255, 255, 255, 0.35); font-weight: 500; margin-right: 0.2em; }

.demo-earn-row { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.demo-safe-chip {
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #34d399;
  background: rgba(52, 211, 153, 0.10);
  border: 1px solid rgba(52, 211, 153, 0.22);
  border-radius: 99px;
  padding: 0.15em 0.5em;
  white-space: nowrap;
}

/* ── CTA row ─────────────────────────────────────────────────────────── */
.demo-cta-row { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; }
.demo-cta-btn {
  position: relative;
  overflow: hidden;
  background: var(--indigo, #6366f1);
  color: #fff;
  border: none;
  border-radius: 9px;
  padding: 0.78rem 1.35rem;
  font-size: 0.87rem;
  font-weight: 700;
  cursor: pointer;
  transition: filter 0.2s, transform 0.15s, box-shadow 0.2s;
  flex: 1 1 240px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  box-shadow: 0 8px 24px rgba(99, 102, 241, 0.28);
  font-family: 'DM Sans', sans-serif;
}
.demo-cta-btn::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
  animation: demoShine 2.8s ease-in-out 1.4s infinite;
}
@keyframes demoShine {
  0%   { left: -100%; }
  40%  { left: 140%;  }
  100% { left: 140%;  }
}
.demo-cta-btn:hover  { filter: brightness(1.12); transform: translateY(-1px); }
.demo-cta-btn:active { transform: translateY(0); }
.demo-cta-arrow      { font-size: 1.05rem; font-weight: 400; font-style: italic; }

.demo-cta-btn-ghost {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.78);
  border-radius: 9px;
  padding: 0.72rem 1.05rem;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  font-family: 'DM Sans', sans-serif;
  flex-shrink: 0;
}
.demo-cta-btn-ghost:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }

.demo-skip-link {
  font-size: 0.76rem;
  color: rgba(255, 255, 255, 0.32);
  cursor: pointer;
  background: none;
  border: none;
  padding: 0.3rem 0.4rem;
  transition: color 0.2s;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-family: 'DM Sans', sans-serif;
}
.demo-skip-link:hover { color: rgba(255, 255, 255, 0.65); }

/* ── driver.js tour popover overrides ────────────────────────────────── */
.quasar-tour-pop .driver-popover-title {
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  color: var(--indigo, #6366f1) !important;
  margin-bottom: 0.5rem !important;
}
.quasar-tour-pop .driver-popover-description { font-size: 0.82rem !important; line-height: 1.6 !important; }
.quasar-tour-pop .driver-popover-footer button {
  background: var(--indigo, #6366f1) !important;
  border-color: var(--indigo, #6366f1) !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
}
.quasar-tour-pop .driver-popover-footer .driver-popover-btn-disabled { opacity: 0.4 !important; }
.quasar-tour-pop .driver-popover-progress-text { color: rgba(255, 255, 255, 0.4) !important; font-size: 0.72rem !important; }

/* ── Mobile ──────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  .demo-modal      { padding: 1.4rem 1.25rem 1.1rem; max-height: 94vh; }
  .demo-headline   { font-size: 1.22rem; }
  .demo-sub        { font-size: 0.8rem; margin-bottom: 1.05rem; }
  .demo-funnel     { gap: 0.7rem; margin-bottom: 1.05rem; }
  .demo-ticker     { margin: 0 -1.25rem 1rem; }
  #demo-cards      { grid-template-columns: 1fr; gap: 0.55rem; margin-bottom: 1rem; }
  .demo-card       { padding: 0.7rem 0.85rem; }
  .demo-cta-row    { gap: 0.5rem; }
  .demo-cta-btn    { font-size: 0.82rem; padding: 0.72rem 1rem; flex-basis: 100%; }
  .demo-cta-btn-ghost { flex: 1 1 auto; font-size: 0.78rem; padding: 0.65rem 0.8rem; }
  .demo-skip-link  { padding: 0.3rem 0.6rem; }
}

/* ── Video modal button (preserved — used elsewhere) ─────────────────── */
.demo-video-btn {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.75);
  border-radius: 9px;
  padding: 0.72rem 1.2rem;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  flex-shrink: 0;
}
.demo-video-btn:hover { background: rgba(255, 255, 255, 0.13); color: #fff; }

/* ── Welcome popup: light-mode overrides ─────────────────────────────
   The demo-overlay block above is dark-anchored (hardcoded #fff text,
   rgba(255,255,255,*) on backgrounds, etc.). These rules re-paint only
   the surface, text, borders, and tracks for light mode via tokens —
   accent colors (indigo, emerald, amber, rose) stay the same in both
   themes. Triggered when [data-theme="dark"] is absent from <html>.   */
html:not([data-theme="dark"]) #demo-overlay {
  background: rgba(245, 244, 240, 0.96);
  backdrop-filter: blur(14px) saturate(120%);
  -webkit-backdrop-filter: blur(14px) saturate(120%);
}
html:not([data-theme="dark"]) .demo-modal {
  background: var(--bg3);
  border: 1px solid var(--border);
  box-shadow:
    0 40px 100px rgba(0, 0, 0, 0.18),
    0 0 0 1px var(--indigo-border),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
}
html:not([data-theme="dark"]) .demo-live-badge   { color: var(--t4); }
html:not([data-theme="dark"]) .demo-headline     { color: var(--t1); }
html:not([data-theme="dark"]) .demo-sub          { color: var(--t3); }
html:not([data-theme="dark"]) .demo-stage-label  { color: var(--t3); }
html:not([data-theme="dark"]) .demo-stage-val    { color: var(--t1); }
html:not([data-theme="dark"]) .demo-stage-unit   { color: var(--t4); }
html:not([data-theme="dark"]) .demo-bar          { background: rgba(26, 25, 23, 0.06); }
html:not([data-theme="dark"]) .demo-ticker {
  background: rgba(26, 25, 23, 0.025);
  border-top:    1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
html:not([data-theme="dark"]) .demo-tk   { color: var(--t3); }
html:not([data-theme="dark"]) .demo-tk-m { color: var(--t4); }
html:not([data-theme="dark"]) .demo-tk-s { color: var(--t1); }
html:not([data-theme="dark"]) .demo-card {
  background: rgba(26, 25, 23, 0.025);
  border: 1px solid var(--border);
}
html:not([data-theme="dark"]) .demo-skel {
  background: linear-gradient(90deg,
    rgba(26, 25, 23, 0.025) 0%,
    rgba(26, 25, 23, 0.07)  50%,
    rgba(26, 25, 23, 0.025) 100%);
  background-size: 200% 100%;
}
html:not([data-theme="dark"]) .demo-card-sym       { color: var(--t1); }
html:not([data-theme="dark"]) .demo-card-metrics   { color: var(--t3); }
html:not([data-theme="dark"]) .demo-card-metrics b { color: var(--t4); }
html:not([data-theme="dark"]) .demo-rank-track     { background: rgba(26, 25, 23, 0.07); }
html:not([data-theme="dark"]) .demo-cta-btn-ghost {
  background: var(--indigo-soft);
  border: 1px solid var(--indigo-mid);
  color: var(--t2);
}
html:not([data-theme="dark"]) .demo-cta-btn-ghost:hover {
  background: var(--indigo-mid);
  color: var(--t1);
}
html:not([data-theme="dark"]) .demo-skip-link       { color: var(--t4); }
html:not([data-theme="dark"]) .demo-skip-link:hover { color: var(--t2); }
html:not([data-theme="dark"]) .demo-video-btn {
  background: var(--indigo-soft);
  border: 1px solid var(--indigo-mid);
  color: var(--t2);
}
html:not([data-theme="dark"]) .demo-video-btn:hover {
  background: var(--indigo-mid);
  color: var(--t1);
}
html:not([data-theme="dark"]) .quasar-tour-pop .driver-popover-progress-text {
  color: var(--t4) !important;
}

/* ── Net connection banner ─────────────────────────────────────────── */
.net-banner{
  position:fixed;top:0;left:0;right:0;z-index:10000;
  height:32px;padding:0 16px;
  display:none;align-items:center;justify-content:center;gap:10px;
  font-size:12.5px;font-weight:500;
  transition:background .3s,color .3s;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
}
.net-banner--offline{background:var(--amber);color:#1a1a1a;}
.net-banner--online {background:var(--emerald);color:#fff;}
.net-banner .mi{font-size:16px;line-height:1;}
.net-banner-btn{
  margin-left:12px;padding:2px 10px;border-radius:var(--r1);
  border:1px solid rgba(0,0,0,.22);background:rgba(0,0,0,.1);
  cursor:pointer;font-size:11.5px;font-weight:600;
  color:inherit;transition:background .15s;
}
.net-banner-btn:hover{background:rgba(0,0,0,.22);}

/* ── Stale nav dot ───────────────────────────────────────────────────── */
.nav-item.stale::after{content:'';position:absolute;top:6px;right:6px;
  width:6px;height:6px;border-radius:50%;background:var(--amber);}
/* ── Stale fetch-st ─────────────────────────────────────────────────── */
.fetch-st--stale{color:var(--amber)!important;}

/* ── SYMBOL STATS: Confirmation / Full-history sub-pages (mirrors .opt-sub-page) ── */
.sym-sub-page{display:none}
.sym-sub-page.active{display:flex;flex-direction:column;gap:.75rem}
.sym-page-switch{display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:1rem}
.sym-page-tab{font-size:13px;font-weight:500;color:var(--t4);cursor:pointer;
  padding:.6rem 1rem;border-bottom:2px solid transparent;margin-bottom:-1px;
  display:flex;align-items:center;gap:.4rem;transition:all .15s;white-space:nowrap}
.sym-page-tab:hover{color:var(--t2)}
.sym-page-tab.active{color:var(--indigo);border-bottom-color:var(--indigo)}
/* ── Scorecard: even, breathing cards ── */
.sym-sc-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.6rem;align-items:stretch}
.sym-sc-card{background:var(--bg2);border-radius:var(--r2);padding:.75rem .85rem;border:1px solid var(--border);
  display:flex;flex-direction:column;min-height:92px;position:relative;overflow:hidden}
.sym-sc-card.comp{border-color:var(--indigo-mid);background:linear-gradient(160deg,var(--bg2),rgba(99,102,241,.05))}
.sym-sc-label{font-size:9.5px;font-weight:700;color:var(--t4);text-transform:uppercase;letter-spacing:.06em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.sym-sc-value{font-size:24px;font-weight:600;line-height:1;margin-top:.5rem;letter-spacing:-.5px}
.sym-sc-sub{font-size:10px;color:var(--t3);margin-top:auto;padding-top:.5rem;line-height:1.4;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sym-sc-card .sym-bar{margin-top:auto}
.sym-sc-card .sym-bar+.sym-sc-sub{margin-top:.4rem;padding-top:0}
@media(max-width:920px){.sym-sc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ══ Alignment hero — full width, top, priority quant read ══ */
.sym-hero{background:var(--bg2);border:1px solid var(--border);border-left:3px solid var(--indigo);
  border-radius:var(--r2);padding:.9rem 1rem 1rem;margin-bottom:1.25rem}
.sym-hero-hd{display:flex;align-items:center;gap:.5rem;font-size:13px;font-weight:600;color:var(--t1);
  padding-bottom:.7rem;margin-bottom:.55rem;border-bottom:1px solid var(--border)}
.sym-hero-q{font-size:11.5px;font-weight:400;color:var(--t4);font-style:italic}
.sym-align-tbl{width:100%;border-collapse:collapse;font-size:12px}
.sym-align-tbl th{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--t4);
  text-align:right;padding:.4rem .55rem;border-bottom:1px solid var(--border)}
.sym-align-tbl th:first-child{text-align:left}
.sym-align-tbl td{text-align:right;padding:.45rem .55rem;border-bottom:1px solid var(--border);
  color:var(--t2);font-weight:500;font-variant-numeric:tabular-nums}
.sym-align-tbl td:first-child{text-align:left}
.sym-align-tbl tr:last-child td{border-bottom:none}
.sym-align-tbl tbody tr:hover td{background:var(--bg3)}

/* ══ 12-column span grid ══ */
.sym-cc-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:.75rem;align-items:start}
.sym-cc-card{grid-column:span 4}                 /* default standard width */
.sym-cc-card[data-span="3"]{grid-column:span 3}
.sym-cc-card[data-span="4"]{grid-column:span 4}
.sym-cc-card[data-span="6"]{grid-column:span 6}
.sym-cc-card[data-span="12"]{grid-column:span 12}
@media(max-width:1100px){
  .sym-cc-card[data-span="3"],.sym-cc-card[data-span="4"]{grid-column:span 6}
  .sym-cc-card[data-span="6"]{grid-column:span 12}
}
@media(max-width:680px){.sym-cc-card{grid-column:span 12 !important}}

/* ══ Tier divider — deliberately quiet, defers to the panel header ══ */
.sym-tier-sep{grid-column:1/-1;display:flex;align-items:center;gap:.55rem;
  margin:.6rem 0 -.1rem;padding:0}
.sym-tier-sep:first-child{margin-top:0}
.sym-tier-n{width:17px;height:17px;border-radius:5px;display:flex;align-items:center;justify-content:center;
  font-size:9.5px;font-weight:700;color:#fff;flex-shrink:0}
.sym-tier-t{font-size:10px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:.07em}
.sym-tier-q{font-size:10.5px;color:var(--t4);font-style:italic}
.sym-tier-sep .rule{flex:1;height:1px;background:var(--border);margin-left:.3rem}
.sym-tier-2 .sym-tier-n{background:var(--indigo)} .sym-tier-3 .sym-tier-n{background:var(--amber)}
.sym-tier-4 .sym-tier-n{background:var(--emerald)} .sym-tier-5 .sym-tier-n{background:var(--t3)}

/* ══ Card ══ */
.sym-cc-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r2);
  padding:.8rem .9rem;display:flex;flex-direction:column;min-width:0}
.sym-cc-card.edge-A,.sym-cc-card.edge-B,.sym-cc-card.edge-C{border-left:3px solid var(--indigo)}
.sym-cc-card.edge-G,.sym-cc-card.edge-H{border-left:3px solid var(--amber)}
.sym-cc-card.edge-D,.sym-cc-card.edge-J,.sym-cc-card.edge-I{border-left:3px solid var(--emerald)}
.sym-cc-card.edge-F{border-left:3px solid var(--t3);border-style:dashed}
.sym-cc-hd{display:flex;align-items:center;gap:.4rem;font-size:11.5px;font-weight:600;color:var(--t1);
  padding-bottom:.5rem;margin-bottom:.5rem;border-bottom:1px solid var(--border);line-height:1.25;white-space:nowrap}
.sym-cc-hd .sym-mock-tag{margin-left:auto}
.sym-kv{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;padding:.22rem 0;font-size:11.5px}
.sym-kv .k{color:var(--t3);white-space:nowrap}
.sym-kv .v{font-weight:600;color:var(--t1);text-align:right;font-variant-numeric:tabular-nums}
.sym-kv .v.hi{color:var(--rose)} .sym-kv .v.lo{color:var(--emerald)} .sym-kv .v.mid{color:var(--amber)}

.sym-hero-ctl{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.sym-seg{display:flex;background:var(--bg3);border-radius:7px;padding:2px;gap:2px;border:1px solid var(--border)}
.sym-seg span{font-size:10.5px;font-weight:600;padding:3px 10px;border-radius:5px;cursor:pointer;color:var(--t3)}
.sym-seg span.on{background:var(--indigo-soft);color:var(--indigo)}
.sym-fromchip{font-family:var(--mono,monospace);font-size:10px;color:var(--t3);background:var(--bg3);border:1px solid var(--border);padding:3px 8px;border-radius:6px}
.sym-fromchip b{color:var(--t2)}
.sym-peerchk,.sym-f1-colbtn{font-size:10px;padding:3px 8px;border-radius:6px;border:1px solid var(--border2);background:var(--bg3);color:var(--t3);cursor:pointer;display:flex;align-items:center;gap:3px}
/* ══ Mode toggle (Scorecard panel header) ══ */
.sym-mode-toggle{display:flex;background:var(--bg3);border:1px solid var(--border);border-radius:7px;padding:2px;gap:2px}
.sym-mode-opt{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:4px 10px;border-radius:5px;cursor:pointer;color:var(--t3);white-space:nowrap;transition:all .15s}
.sym-mode-opt.on{background:var(--indigo-soft);color:var(--indigo)}
.sym-mode-opt.soon{cursor:default;opacity:.5}
.sym-mode-opt .material-icons-round{font-size:14px!important;line-height:1}
/* ══ CF1 table sticky column sizing (mirrors sym-tc / sym-filtered-tc) ══ */
#sym-cf1-tc .dt thead th:nth-child(1),#sym-cf1-filt-tc .dt thead th:nth-child(1),
#sym-cf1-tc .dt tbody td:nth-child(1),#sym-cf1-filt-tc .dt tbody td:nth-child(1){min-width:36px;max-width:36px}
/* ══ CF2 table sticky column sizing (mirrors CF1) ══ */
#sym-cf2-stats-tc .dt thead th:nth-child(1),#sym-cf2-sig-tc .dt thead th:nth-child(1),
#sym-cf2-stats-tc .dt tbody td:nth-child(1),#sym-cf2-sig-tc .dt tbody td:nth-child(1){min-width:36px;max-width:36px}
/* ══ CF4 table sticky column sizing (mirrors CF2) ══ */
#sym-cf4-rev-tc .dt thead th:nth-child(1),#sym-cf4-guid-tc .dt thead th:nth-child(1),#sym-cf4-evt-tc .dt thead th:nth-child(1),
#sym-cf4-rev-tc .dt tbody td:nth-child(1),#sym-cf4-guid-tc .dt tbody td:nth-child(1),#sym-cf4-evt-tc .dt tbody td:nth-child(1){min-width:36px;max-width:36px}
/* ══ Symbol Statistics Controls — compact single-row layout in Confirmation ══ */
.panel.sym-compact .panel-body            { padding:.55rem .9rem }
.panel.sym-compact .ctrl-grid             { display:flex; gap:0; align-items:center; padding:0; margin:0 }
.panel.sym-compact .ctrl-col              { display:flex; flex-direction:row; align-items:center; gap:.75rem; padding:0 .9rem; margin:0; border-right:1px solid var(--border) }
.panel.sym-compact .ctrl-col:first-child  { padding-left:0 }
.panel.sym-compact .ctrl-col:last-child   { border-right:none; padding-right:0 }
.panel.sym-compact .section-head          { display:none }
.panel.sym-compact .field                 { margin:0; padding:0 .65rem; display:flex; align-items:center; gap:.4rem }
.panel.sym-compact .field + .field        { border-left:1px solid var(--border) }
.panel.sym-compact .field-label           { display:inline-block; margin:0; font-size:9.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--indigo); line-height:1; white-space:nowrap }
.panel.sym-compact .toggle-list           { margin:0 }
.panel.sym-compact .action-pill           { padding:.45rem .9rem; margin:0 0 0 auto; display:flex; align-items:center; gap:.5rem; flex:0 0 auto }
.panel.sym-compact .panel-body            { display:flex; flex-direction:row; align-items:center; gap:.75rem; flex-wrap:wrap }
.panel.sym-compact .panel-resize-handle   { display:none }

.panel-header{user-select:none}
/* ══ CF3/CF4 period pill disabled state ══ */
#sym-cf3-period-pills .sv-pill:disabled,#sym-cf3-period-pills .sv-pill[disabled],
#sym-cf4-rev-period-pills .sv-pill:disabled,#sym-cf4-rev-period-pills .sv-pill[disabled],
#sym-cf4-evt-window-pills .sv-pill:disabled,#sym-cf4-evt-window-pills .sv-pill[disabled]{opacity:.42;cursor:not-allowed;pointer-events:none}
/* ══ CF3 clickable news cards ══ */
#sym-cf3-bz-list .npop-news-item,#sym-cf3-pr-list .npop-news-item{cursor:pointer}
/* ══ CF4 clickable revision/event rows ══ */
#sym-cf4-rev-tc table.dt tbody tr,#sym-cf4-evt-tc table.dt tbody tr{cursor:pointer}

.sym-peerchk.on{background:var(--emerald-soft,rgba(61,220,151,.14));border-color:var(--emerald);color:var(--emerald)}
.sym-f1-cols{display:flex;flex-wrap:wrap;gap:4px;padding:.5rem 0 .2rem}
.sym-f1-col{font-size:10px;padding:2px 8px;border-radius:12px;border:1px solid var(--border2);background:var(--bg3);color:var(--t3);cursor:pointer}
.sym-f1-col.on{background:var(--indigo-soft);border-color:var(--indigo-mid);color:var(--indigo)}

/* ── Floor 1 controls ── */
.sym-hero-ctl{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.sym-seg{display:flex;background:var(--bg3);border-radius:7px;padding:2px;gap:2px;border:1px solid var(--border)}
.sym-seg span{font-size:10.5px;font-weight:600;padding:3px 10px;border-radius:5px;cursor:pointer;color:var(--t3)}
.sym-seg span.on{background:rgba(111,141,255,.16);color:var(--indigo)}
.sym-peerchk,.sym-f1-colbtn,.sym-f1-funnel{font-size:10px;padding:3px 8px;border-radius:6px;border:1px solid var(--border2);background:var(--bg3);color:var(--t3);cursor:pointer;display:flex;align-items:center;gap:3px}
.sym-peerchk.on{background:rgba(61,220,151,.14);border-color:rgba(61,220,151,.4);color:var(--emerald)}
.sym-f1-funnel.dim{opacity:.35;cursor:not-allowed}
.sym-f1-cols{display:flex;flex-wrap:wrap;gap:4px;padding:.5rem .9rem;border-bottom:1px solid var(--border)}
.sym-f1-col{font-size:10px;padding:2px 8px;border-radius:12px;border:1px solid var(--border2);background:var(--bg3);color:var(--t3);cursor:pointer}
.sym-f1-col.on{background:rgba(111,141,255,.14);border-color:rgba(111,141,255,.4);color:var(--indigo)}
/* funnel popover */
.sym-funnel-pop{margin:.5rem .9rem;background:var(--bg3);border:1px solid var(--border2);border-radius:8px;padding:.6rem .8rem}
.sym-pop-hd{display:flex;align-items:center;font-size:10.5px;font-weight:700;color:var(--t2);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.6rem;padding-bottom:.4rem;border-bottom:1px solid var(--border)}
.sym-pop-bd{display:flex;flex-direction:column;gap:.55rem}
.sym-pop-row{display:flex;align-items:center;gap:.6rem}
.sym-pop-lbl{flex:0 0 150px;font-size:11px;color:var(--t3)}
.sym-pop-range{flex:1;height:4px}
.sym-pop-val{font-family:var(--mono,monospace);font-size:11px;color:var(--indigo);width:50px;text-align:right}
.sym-pop-tags{display:flex;flex-wrap:wrap;gap:4px;flex:1}
.sym-pop-tag{font-size:10px;padding:2px 8px;border-radius:6px;border:1px solid var(--border2);background:var(--bg2);color:var(--t3);cursor:pointer}
.sym-pop-tag.on{background:rgba(111,141,255,.14);border-color:rgba(111,141,255,.4);color:var(--indigo);font-weight:500}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* ── Co-Captain dock — Phase 2 live ──────────────── */
.cocap-dock {
  position: fixed;
  top: 56px;
  right: 0;
  bottom: 0;
  width: 360px;
  background: var(--bg2);
  border-left: 1px solid var(--cocap-mid);
  box-shadow: -2px 0 16px var(--cocap-glow);
  z-index: 950;
  display: flex;
  flex-direction: column;
  transition: width .18s ease;
  overflow: hidden;
}
.cocap-dock[hidden] { display: none !important; }
.cocap-dock.cocap-collapsed { width: 32px; }
.cocap-dock.cocap-collapsed .cocap-body { display: none; }
.cocap-dock.cocap-collapsed .cocap-rail {
  flex: 1;
  writing-mode: vertical-rl;
  letter-spacing: 4px;
  border-bottom: none;
  border-left: 1px solid var(--cocap-mid);
}
.cocap-dock:not(.cocap-collapsed) .cocap-rail { display: none; }
.cocap-close {
  background: transparent; border: none; cursor: pointer;
  color: var(--t3); font-size: 22px; line-height: 1;
  width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  transition: background .12s, color .12s;
}
.cocap-close:hover { background: var(--cocap-soft); color: var(--cocap); }
.cocap-clear {
  background: transparent; border: none; cursor: pointer;
  color: var(--t3); font-size: 11px; font-weight: 500;
  padding: 4px 10px; border-radius: 999px;
  transition: color .12s, background .12s;
}
.cocap-clear:hover { color: var(--cocap); background: var(--cocap-soft); }
.cocap-dock:not(:has(.cocap-msg)) .cocap-clear { display: none; }

.cocap-empty { font-size: 12.5px; color: var(--t3); line-height: 1.5; padding: 6px 2px; }
.cocap-empty p { margin: 0 0 8px; }
.cocap-empty em { color: var(--cocap); font-style: normal; font-weight: 600; }
.cocap-dock:has(.cocap-msg) .cocap-empty { display: none; }

.cocap-rail {
  width: 32px;
  background: var(--cocap-soft);
  border-bottom: 1px solid var(--cocap-mid);
  color: var(--cocap);
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.cocap-body { flex: 1; padding: 12px; overflow-y: auto; }
.cocap-head {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px;
}
.cocap-brand {
  flex: 1;
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  color: var(--cocap);
  letter-spacing: .02em;
}
.cocap-mode {
  background: transparent;
  border: 1px solid var(--cocap-mid);
  color: var(--t2);
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 11px;
  cursor: pointer;
}
.cocap-mode[data-active="1"] {
  background: var(--cocap-soft);
  color: var(--cocap);
  border-color: var(--cocap);
}

/* ── Co-Captain — Phase 2 (active dock + tooltips + right-click menu) ── */
.cocap-chip {
  display:inline-block; padding:2px 10px; margin:2px 4px 2px 0;
  background:var(--cocap-soft); border:1px solid var(--cocap-mid);
  border-radius:999px; font-size:11px; color:var(--cocap);
  font-family:'DM Mono', monospace;
}
.cocap-context  { margin-bottom:8px; }
.cocap-answer   { margin-top:8px; }
.cocap-title    { font-family:'Sora',sans-serif; font-weight:700; font-size:13px;
                  color:var(--cocap); margin:8px 0 6px; letter-spacing:.02em;
                  word-break:break-word; }
.cocap-loading  { font-style:italic; color:var(--t3); padding:8px 0; }
.cocap-summary  { font-size:13px; line-height:1.55; color:var(--t1); margin:6px 0 10px; }
.cocap-bullets  { padding-left:18px; margin:6px 0; font-size:12.5px; color:var(--t2); }
.cocap-bullets li { margin:4px 0; line-height:1.45; }
.cocap-related  { display:flex; flex-wrap:wrap; gap:6px; align-items:center;
                  margin:10px 0 4px; padding-top:8px;
                  border-top:1px dashed var(--cocap-soft); }
.cocap-related-lbl { font-size:11px; font-weight:600; color:var(--t3);
                     text-transform:uppercase; letter-spacing:.04em; margin-right:2px; }
.cocap-related-chip { padding:3px 10px; font:inherit; font-size:12px; line-height:1.4;
                      border:1px solid var(--cocap-soft); border-radius:999px;
                      background:transparent; color:var(--cocap); cursor:pointer;
                      transition:background .12s, color .12s, border-color .12s; }
.cocap-related-chip:hover  { background:var(--cocap-soft); border-color:var(--cocap); }
.cocap-related-chip:active { background:var(--cocap); color:#fff; }
.cocap-err      { font-size:12px; color:var(--rose); padding:8px;
.cocap-explain-menu div:hover { background:var(--cocap-soft) !important; }

.cocap-thread          { display:flex; flex-direction:column; gap:8px; margin-top:8px; }
.cocap-msg             { padding:8px 10px; border-radius:8px; }
.cocap-msg-user        { background:var(--cocap-soft); align-self:flex-end; max-width:90%; }
.cocap-msg-assistant   { background:transparent; }
.cocap-msg-loading     { opacity:0.6; font-style:italic; }
.cocap-omnibox         { display:flex; gap:8px; margin-top:16px; padding-top:12px; border-top:1px solid var(--cocap-soft); }
.cocap-omnibox-input   { flex:1; padding:6px 12px; border:1px solid var(--cocap-mid); border-radius:999px; background:transparent; color:inherit; font:inherit; }
.cocap-omnibox-input:focus { outline:2px solid var(--cocap); outline-offset:1px; border-color:var(--cocap); }
.cocap-omnibox-send    { padding:6px 12px; border:1px solid var(--cocap-mid); border-radius:999px; background:var(--cocap-soft); color:var(--cocap); cursor:pointer; transition:background .12s, color .12s, border-color .12s; }
.cocap-omnibox-send:hover { background:var(--cocap); color:#fff; border-color:var(--cocap); }

.cocap-rail-alert { position:relative; }
.cocap-rail-alert::after {
  content:''; position:absolute; top:6px; right:6px;
  width:8px; height:8px; border-radius:50%;
  background:var(--cocap-accent, #e8a33d); box-shadow:0 0 0 2px var(--bg3);
}
.cocap-msg-nudge { background:var(--cocap-soft); border-left:3px solid var(--cocap-accent, #e8a33d); }
.cocap-nudge-x {
  margin-top:6px; padding:3px 8px; font-size:11px; border:none; border-radius:5px;
  background:transparent; color:var(--t3); cursor:pointer; text-decoration:underline;
}
.cocap-nudge-x:hover { color:var(--t2); }