@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700;800&display=swap');

:root {
  
  --bg: #0a0b0f;
  --panel: #101219;
  --card: #161923;
  --border: #1f2334;
  --border-hi: #2c3049;
  --grid: #171b2a;

  
  --text: #d0d4e2;
  --text-bright: #e8ebf4;
  --text-dim: #8a90ab;
  --text-muted: #5c6180;
  --text-faint: #6b7194;
  --text-soft: #b8bdd4;

  
  --green: #26d97f;
  --green-dim: rgba(38, 217, 127, .12);
  --red: #f0506e;
  --red-dim: rgba(240, 80, 110, .12);
  --blue: #4da6ff;
  --blue-dim: rgba(77, 166, 255, .12);
  --blue-hover: #3d96f0;
  --amber: #ffb833;
  --amber-dim: rgba(255, 184, 51, .12);
  --purple: #a78bfa;
  --purple-dim: rgba(167, 139, 250, .12);

  
  --z1: #4C9BDE;
  --z2: #16A468;
  --z3: #BE8318;
  --z4: #DE4C64;

  
  --green-subtle: rgba(38, 217, 127, .06);
  --green-med: rgba(38, 217, 127, .15);
  --green-strong: rgba(38, 217, 127, .18);
  --red-subtle: rgba(240, 80, 110, .06);
  --red-med: rgba(240, 80, 110, .15);
  --red-strong: rgba(240, 80, 110, .18);
  --blue-med: rgba(77, 166, 255, .15);
  --blue-strong: rgba(77, 166, 255, .22);
  --blue-focus: rgba(77, 166, 255, .3);
  --amber-light: rgba(255, 184, 51, .12);
  --amber-med: rgba(255, 184, 51, .15);
  --purple-med: rgba(167, 139, 250, .15);

  
  --label-bg: rgba(19, 23, 34, .85);
  --chart-tooltip-bg: rgba(16, 18, 25, .96);
  --chart-tooltip-border: rgba(77, 166, 255, .25);

  
  --toolbar-active: #1e2136;
  --toolbar-w: 52px;
  --topbar-h: 46px;
  --rsb-strip-w: 52px;
  --rsb-panel-w: 400px;

  

  
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;

  
  --overlay-bg: rgba(0, 0, 0, .65);
  --overlay-blur: 4px;
  --overlay-shadow: 0 16px 48px rgba(0, 0, 0, .55);

  
  --ease: .15s ease;

  
  --hover-subtle: rgba(255, 255, 255, .05);
  --hover-medium: rgba(255, 255, 255, .08);

  
  --scrollbar-thumb: rgba(255, 255, 255, .35);
  --scrollbar-thumb-hover: rgba(255, 255, 255, .5);

  
  --surface-veil:            rgba(255, 255, 255, .02);
  --surface-raised:          rgba(255, 255, 255, .06);
  --surface-border:          rgba(255, 255, 255, .08);
  --surface-border-hi:       rgba(255, 255, 255, .12);
  --surface-border-strong:   rgba(255, 255, 255, .18);
  --divider-soft:            rgba(255, 255, 255, .04);

  
  --shadow-soft:    rgba(0, 0, 0, .15);
  --shadow-strong:  rgba(0, 0, 0, .35);

  
  --pill-active-bg: #fff;
  --pill-active-color: #111;

  
  --font-ui: 'AstroGlifi', 'Outfit', sans-serif;
  --font-data: 'AstroGlifi', 'JetBrains Mono', monospace;
}


@font-face {
  font-family: 'AstroGlifi';
  src: url('../js/vendor/fonts/noto-sans-symbols.woff2') format('woff2');
  font-display: swap;
  unicode-range: U+2600-26FF, U+2295;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: 'AstroGlifi', 'Outfit', sans-serif;
  background: var(--bg);
  color: var(--text);
  display: flex;
  height: 100vh;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  user-select: none;
}

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover); }


:root[data-theme="light"] body {
  color: var(--text);
}


:root[data-theme="techShadows"] body {
  background:
    radial-gradient(46vw 46vw at 14vw 4vh,  oklch(58% .26 292 / .34), oklch(58% .26 292 / .10) 46%, transparent 72%),
    radial-gradient(44vw 44vw at 86vw 12vh, oklch(63% .22 252 / .30), oklch(63% .22 252 / .09) 46%, transparent 72%),
    radial-gradient(42vw 42vw at 46vw 104vh, oklch(68% .18 200 / .20), oklch(68% .18 200 / .06) 46%, transparent 72%),
    var(--bg);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

:root[data-theme="techShadows"] #chartWrap { background: transparent; }

:root[data-theme="techShadows"] #chartWrap::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  opacity: .04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 140px;
}

:root[data-theme="techShadows"] .chart-loading { background: var(--bg); }


:root[data-theme="techShadows"] .toolbar,
:root[data-theme="techShadows"] .topbar,
:root[data-theme="techShadows"] .rsb-strip,
:root[data-theme="techShadows"] .rsb-panel { background: transparent; }
:root[data-theme="techShadows"] .toolbar    { border-right: 1px solid var(--surface-border); }
:root[data-theme="techShadows"] .topbar     { border-bottom: 1px solid var(--surface-border); }
:root[data-theme="techShadows"] .rsb-strip  { border-left: 1px solid var(--surface-border); }

:root[data-theme="techShadows"] .rsb-panel.open {
  border-left: 3px solid var(--surface-border-hi);
  box-shadow: none;
}

:root[data-theme="techShadows"] .rsb-icon { background: transparent; }
:root[data-theme="techShadows"] .rsb-icon:hover,
:root[data-theme="techShadows"] .rsb-icon.active:hover { background: var(--card); }


#appToastContainer {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  z-index: 100000;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  pointer-events: none;
}
.app-toast {
  font-family: var(--font-ui);
  font-size: 0.95rem;
  line-height: 1.35;
  color: #fff;
  background: rgba(22, 22, 28, .97);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: var(--radius-md);
  box-shadow: var(--overlay-shadow);
  padding: 13px 20px;
  max-width: min(90vw, 460px);
  text-align: center;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--ease), transform var(--ease);
  pointer-events: auto;
}
.app-toast--show { opacity: 1; transform: translateY(0); }
.app-toast--warn  { border-color: rgba(240, 185, 60, .55); }
.app-toast--error { border-color: rgba(240, 90, 90, .55); }




.dh-modal-overlay {
  position: fixed; inset: 0; z-index: 4000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(6, 7, 11, .62);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  opacity: 0; transition: opacity .2s ease;
  padding: 20px;
}
.dh-modal-overlay--show { opacity: 1; }
.dh-modal {
  position: relative;
  width: min(92vw, 460px);
  background: var(--panel, #101219);
  border: 1px solid var(--border-hi, #2c3049);
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .55);
  padding: 26px 26px 22px;
  text-align: center;
  transform: translateY(10px) scale(.98);
  transition: transform .22s cubic-bezier(.2, .8, .2, 1);
}
.dh-modal-overlay--show .dh-modal { transform: translateY(0) scale(1); }
.dh-modal--warn  { border-top: 3px solid #f0b93c; }
.dh-modal--error { border-top: 3px solid var(--red, #f0506e); }
.dh-modal-close {
  position: absolute; top: 10px; right: 12px;
  background: none; border: none; cursor: pointer;
  font-size: 26px; line-height: 1; color: var(--text-muted, #5c6180);
  transition: color .15s;
}
.dh-modal-close:hover { color: var(--text-bright, #e8ebf4); }
.dh-modal-icon {
  width: 54px; height: 54px; margin: 4px auto 14px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
}
.dh-modal--warn  .dh-modal-icon { background: rgba(240, 185, 60, .14); color: #f0b93c; }
.dh-modal--error .dh-modal-icon { background: var(--red-med, rgba(240, 80, 110, .15)); color: var(--red, #f0506e); }
.dh-modal-icon svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.dh-modal-title {
  margin: 0 0 10px; font-family: var(--font-ui);
  font-size: 1.25rem; font-weight: 700; color: var(--text-bright, #e8ebf4);
}
.dh-modal-body { font-size: .96rem; line-height: 1.55; color: var(--text, #d0d4e2); }
.dh-modal-body p { margin: 0 0 10px; }
.dh-modal-body b { color: var(--text-bright, #e8ebf4); font-weight: 600; }
.dh-modal-note {
  margin-top: 14px !important; padding-top: 12px;
  border-top: 1px solid var(--border, #1f2334);
  font-size: .88rem; color: var(--text-dim, #8a90ab);
}
.dh-modal-actions { margin-top: 20px; }

.dh-modal-ok {
  font-family: var(--font-ui); font-size: .98rem; font-weight: 700;
  color: #fff !important; background: #4da3ff;
  border: none; border-radius: 9px; padding: 11px 26px; cursor: pointer;
  transition: filter .15s, transform .1s;
}
.dh-modal-ok:hover { filter: brightness(1.08); }
.dh-modal-ok:active { transform: scale(.97); }


.dh-chart-badge {
  position: absolute; top: 10px; right: 64px; z-index: 40;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-ui); font-size: .78rem; font-weight: 600;
  color: #f0b93c;
  background: rgba(20, 16, 6, .92);
  border: 1px solid rgba(240, 185, 60, .55);
  border-radius: 7px; padding: 5px 10px; cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .35);
  transition: background .15s, transform .1s;
}
.dh-chart-badge:hover { background: rgba(40, 32, 10, .96); }
.dh-chart-badge:active { transform: scale(.96); }
.dh-chart-badge svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }


.dh-chart-overlay {
  position: absolute; inset: 0; z-index: 60;
  display: flex; align-items: center; justify-content: center;
  background: rgba(8, 9, 13, .72);
  backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
  padding: 24px; text-align: center;
}
.dh-overlay-card { max-width: 440px; }
.dh-overlay-icon {
  width: 60px; height: 60px; margin: 0 auto 16px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--red-med, rgba(240, 80, 110, .15)); color: var(--red, #f0506e);
}
.dh-overlay-icon svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.dh-overlay-title { font-family: var(--font-ui); font-size: 1.35rem; font-weight: 700; color: var(--text-bright, #e8ebf4); margin-bottom: 10px; }
.dh-overlay-title b { color: var(--red, #f0506e); }
.dh-overlay-sub { font-size: .96rem; line-height: 1.6; color: var(--text-dim, #8a90ab); margin-bottom: 20px; }
.dh-overlay-sub b { color: var(--text, #d0d4e2); font-weight: 600; }
.dh-overlay-btn {
  font-family: var(--font-ui); font-size: .95rem; font-weight: 600;
  color: #0a0b0f; background: var(--text-bright, #e8ebf4);
  border: none; border-radius: 9px; padding: 11px 24px; cursor: pointer;
  transition: filter .15s, transform .1s;
}
.dh-overlay-btn:hover { filter: brightness(1.08); }
.dh-overlay-btn:active { transform: scale(.97); }


.dh-panel-banner {
  display: flex; align-items: flex-start; gap: 10px;
  font-family: var(--font-ui); font-size: .88rem; line-height: 1.5;
  color: #f0d79a;
  background: rgba(240, 185, 60, .1);
  border: 1px solid rgba(240, 185, 60, .38);
  border-radius: 9px; padding: 11px 14px; margin: 0 0 14px;
}
.dh-panel-banner b { color: #f5c452; font-weight: 700; }
.dh-panel-banner svg { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px; fill: none; stroke: #f0b93c; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.dh-panel-banner--float {
  position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
  z-index: 50; width: auto; max-width: min(90vw, 680px); margin: 0;
  background: rgba(30, 24, 6, .97);
  box-shadow: 0 6px 22px rgba(0, 0, 0, .5);
}


:root[data-theme="light"] .dh-modal { background: #fff; border-color: #e2e5ee; }
:root[data-theme="light"] .dh-chart-badge { background: rgba(255, 250, 240, .96); color: #b8860b; }
:root[data-theme="light"] .dh-chart-overlay { background: rgba(245, 246, 250, .8); }


.rpt-teaser { position: relative; margin-top: 4px; overflow: hidden; min-height: 132px; }
.rpt-teaser-fade {
  filter: blur(3.5px); -webkit-filter: blur(3.5px);
  user-select: none; pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,.85) 28%, rgba(0,0,0,0) 92%);
          mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,.85) 28%, rgba(0,0,0,0) 92%);
}
.rpt-teaser-fade p { margin: .55em 0; color: var(--text-muted); line-height: 1.55; }
.rpt-teaser-cta {
  position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); z-index: 2;
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  padding: 10px 18px; border-radius: 10px;
  background: #4da3ff; color: #fff !important; font-weight: 700; font-size: .92rem;
  text-decoration: none; box-shadow: 0 8px 24px rgba(77,163,255,.4); transition: background .15s ease;
}
.rpt-teaser-cta:hover { background: #6fb8ff; }
.rpt-teaser-ico { font-size: 1.05em; line-height: 1; }


.rpt-locked { position: relative; margin-top: 22px; min-height: 560px; }
.rpt-locked-blur {
  filter: blur(7px); -webkit-filter: blur(7px);
  opacity: .42; pointer-events: none; user-select: none;
}
.rpt-sk-card {
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: 18px 18px 16px; margin-bottom: 18px;
}
.rpt-sk-title {
  width: 42%; height: 14px; border-radius: 6px; margin-bottom: 20px;
  background: rgba(255,255,255,.13);
}
.rpt-sk-chart { display: flex; align-items: flex-end; gap: 6px; height: 190px; }
.rpt-sk-bar {
  flex: 1 1 0; min-width: 4px; border-radius: 4px 4px 0 0;
  background: linear-gradient(to top, rgba(77,163,255,.45), rgba(77,163,255,.12));
}
.rpt-sk-lines { margin: 4px 2px 0; }
.rpt-sk-lines span { display: block; height: 11px; border-radius: 6px; margin: 9px 0; background: rgba(255,255,255,.08); }
.rpt-sk-lines span:nth-child(1) { width: 92%; }
.rpt-sk-lines span:nth-child(2) { width: 78%; }
.rpt-sk-lines span:nth-child(3) { width: 85%; }
.rpt-sk-lines span:nth-child(4) { width: 64%; }
.rpt-locked-cta {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; text-align: center; padding: 30px 24px;
  background: linear-gradient(to bottom, rgba(10,11,15,0) 0%, rgba(10,11,15,.72) 26%, rgba(10,11,15,.86) 100%);
}
.rpt-locked-ico { font-size: 2.4rem; line-height: 1; filter: drop-shadow(0 4px 16px rgba(0,0,0,.5)); }
.rpt-locked-h { font-size: 1.32rem; font-weight: 800; color: var(--text-bright, #e8ebf4); }
.rpt-locked-sub { max-width: 520px; font-size: .96rem; line-height: 1.55; color: var(--text-dim, #8a90ab); }
.rpt-locked-btn {
  margin-top: 6px; display: inline-flex; align-items: center; gap: 9px; white-space: nowrap;
  padding: 13px 24px; border-radius: 12px;
  background: #4da3ff; color: #fff !important; font-weight: 700; font-size: 1rem;
  text-decoration: none; box-shadow: 0 10px 30px rgba(77,163,255,.42); transition: background .15s ease;
}
.rpt-locked-btn:hover { background: #6fb8ff; }
.ws-nav-locked { opacity: .7; }
.ws-nav-locked .ws-nav-num { font-size: .9em; }


.main { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-width: 0; }

.topbar {
  height: var(--topbar-h);
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center;
  padding: 0 14px; gap: 10px;
  background: var(--panel); flex-shrink: 0;
}

.symbol-wrap { position: relative; display: flex; align-items: center; }
.symbol-input {
  position: absolute; top: 50%; left: 0; transform: translateY(-50%);
  font-family: var(--font-ui); font-weight: 700; font-size: 1.13rem;
  background: var(--card); color: var(--text); border: 1px solid var(--blue);
  border-radius: var(--radius-sm); padding: 2px 8px; width: 140px; outline: none;
  display: none; z-index: 5;
}
.symbol-input.visible { display: block; }
.pair {
  font-family: var(--font-ui); font-weight: 700; font-size: 1.13rem;
  cursor: pointer; transition: color .15s;
}
.pair:hover { color: var(--blue); }
.pair.loading { color: var(--text-muted); animation: pulse-text 1s ease-in-out infinite; }
@keyframes pulse-text { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }
.price { font-family: var(--font-ui); font-size: 1.07rem; font-weight: 600; }
.price.up { color: var(--green); }
.price.down { color: var(--red); }

.badge { font-family: var(--font-ui); font-size: .85rem; font-weight: 600; padding: 3px 7px; border-radius: var(--radius-sm); }
.badge.up { background: var(--green-dim); color: var(--green); }
.badge.down { background: var(--red-dim); color: var(--red); }

.spacer { flex: 1; }
.stat { text-align: right; }
.stat .lbl { font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); }
.stat .val { font-family: var(--font-ui); font-size: .85rem; font-weight: 500; color: var(--text-dim); }
.stat .val.up { color: var(--green); }
.stat .val.down { color: var(--red); }
.stat .val.flat { color: var(--text-dim); }

#chartArea { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-height: 0; position: relative; }
#chartWrap { flex: 1; position: relative; background: var(--bg); overflow: hidden; min-height: 0; }
#optProfileCanvas, .vol-profile-canvas, .vol-profile-range-canvas { position: absolute; top: 0; left: 0; pointer-events: none; z-index: 5; }
#chartLogo { position: absolute; bottom: 8px; left: 12px; display: flex; align-items: center; gap: 8px; opacity: 1; pointer-events: none; z-index: 10; }
#chartLogo img { width: 32px; height: 32px; flex-shrink: 0; }
#chartLogo span { font-family: var(--font-ui); font-size: 22px; font-weight: 600; color: var(--text-bright); white-space: nowrap; letter-spacing: 0.02em; }
.chart-loading {
  position: absolute; inset: 0; z-index: 50;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg);
  transition: opacity .3s ease;
}
.chart-loading.hidden { opacity: 0; pointer-events: none; }
.cl-inner { display: flex; flex-direction: column; align-items: center; gap: 16px; }

.cl-stars { position: relative; width: 96px; height: 96px; }
.cl-star { fill: #e7c989; filter: drop-shadow(0 0 5px rgba(227,201,137,.55)) drop-shadow(0 0 13px rgba(195,160,95,.45)); }
.cl-star-big { position: absolute; inset: 0; margin: auto; width: 42px; height: 42px; animation: cl-pulse2 1.6s ease-in-out infinite; }
.cl-orbit { position: absolute; inset: 0; animation: cl-spin linear infinite; }
.cl-orbit-a { animation-duration: 3.2s; }
.cl-orbit-b { animation-duration: 4.5s; animation-direction: reverse; }
.cl-orbit-c { animation-duration: 5.8s; }
.cl-orbit svg { position: absolute; animation: cl-twinkle 1.6s ease-in-out infinite; }
.cl-orbit-a svg { top: 0; left: 50%; margin-left: -8px; width: 16px; height: 16px; }
.cl-orbit-b svg { bottom: 4px; left: 50%; margin-left: -6px; width: 13px; height: 13px; animation-delay: -.5s; }
.cl-orbit-c svg { right: 4px; top: 50%; margin-top: -5px; width: 11px; height: 11px; animation-delay: -1s; }
.cl-text {
  font-family: var(--font-ui);
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--text-muted);
  animation: cl-pulse 1.6s ease-in-out infinite;
}
@keyframes cl-pulse2 { 0%,100% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.14); opacity: 1; } }
@keyframes cl-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes cl-twinkle { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes cl-pulse { 0%,100% { opacity: .4; } 50% { opacity: 1; } }

.ohlc-bar {
  position: absolute; top: 8px; left: 12px; z-index: 10;
  pointer-events: none;
  display: flex; gap: 12px;
  font-family: var(--font-ui); font-size: .87rem;
}
.ohlc-bar .item { display: flex; gap: 4px; }
.ohlc-bar .lbl { color: var(--text-muted); }
.ohlc-bar .val { color: var(--text-dim); font-weight: 500; }


.perf-bar {
  position: absolute; top: 30px; left: 12px; z-index: 10;
  pointer-events: none;
  display: flex; gap: 12px;
  font-family: var(--font-ui); font-size: .87rem;
}
.perf-bar .item { display: flex; gap: 4px; }
.perf-bar .lbl { color: var(--text-muted); }
.perf-bar .val { color: var(--text-dim); font-weight: 500; }
.perf-bar .val.up { color: var(--green); }
.perf-bar .val.down { color: var(--red); }
.perf-bar .val.flat { color: var(--text-dim); }


.topbar-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px; height: 24px;
  flex-shrink: 0;
  margin-left: 4px;
}
.topbar-logo img {
  width: 24px; height: 24px;
  border-radius: 5px;
  object-fit: contain;
  background: rgba(255,255,255,.05);
}

.topbar-logo img.topbar-logo-idx {
  object-fit: cover;
  background: none;
}

.topbar-logo.topbar-logo-lt img { background: var(--wlg-tile-onlight); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
.topbar-logo.topbar-logo-dk img { background: var(--wlg-tile-ondark);  box-shadow: inset 0 0 0 1px rgba(15,23,42,.14); }
.topbar-logo-fb {
  width: 24px; height: 24px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #6b7280, #374151);
  color: #fff;
  font: 600 .82rem/1 var(--font-ui);
  text-transform: uppercase;
  letter-spacing: -.01em;
  user-select: none;
}


.topbar-market {
  font-family: var(--font-ui);
  font-size: .95rem;
  font-weight: 600;
  color: var(--text-bright);
  letter-spacing: .01em;
  padding: 0 8px;
  max-width: 420px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.draw-banner {
  position: absolute; top: 8px; left: 50%; transform: translateX(-50%);
  z-index: 20;
  background: var(--blue-dim);
  border: 1px solid var(--blue-focus);
  color: var(--blue);
  font-size: .93rem; font-weight: 600;
  padding: 5px 14px; border-radius: var(--radius-sm);
  display: none;
  font-family: var(--font-ui);
  pointer-events: none;
}
.draw-banner.visible { display: block; }


.ss-copyright-toast {
  position: fixed;
  bottom: 32px; left: 50%;
  transform: translateX(-50%) translateY(10px);
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  padding: 8px 18px;
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 500;
  color: var(--text-dim);
  box-shadow: 0 8px 24px var(--shadow-strong);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
  z-index: 9999;
  white-space: nowrap;
}
.ss-copyright-toast.visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}



.toolbar {
  width: var(--toolbar-w);
  min-width: var(--toolbar-w);
  background: var(--panel);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6px 0;
  gap: 2px;
  z-index: 60;
}

.tb-btn {
  width: 42px; height: 42px;
  border: none; background: none;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: var(--text-dim);
  font-size: 1.1rem;
  transition: all var(--ease);
  position: relative;
}
.tb-btn:hover { background: var(--hover-subtle); color: var(--text); }
.tb-btn.active { background: var(--blue-dim); color: var(--blue); }
.tb-btn.active::after {
  content: '';
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 2.5px; height: 55%;
  background: var(--blue);
  border-radius: 0 2px 2px 0;
}

.tb-sep { width: 26px; height: 1px; background: var(--border); margin: 4px 0; }

.tb-btn svg {
  width: 20px; height: 20px;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.tb-group[data-group="volProfile"] .tb-btn svg { width: 24px; height: 24px; fill: currentColor; stroke: none; }

.tb-btn[data-tip]:hover::before {
  content: attr(data-tip);
  position: absolute; left: calc(100% + 8px); top: 50%; transform: translateY(-50%);
  background: var(--toolbar-active); color: var(--text);
  font-size: .93rem; font-weight: 500;
  padding: 4px 10px; border-radius: var(--radius-sm);
  white-space: nowrap; z-index: 999;
  border: 1px solid var(--border);
  pointer-events: none;
}


.tb-group { position: relative; }

.tb-group-btn { position: relative; }


.tb-group-expand {
  position: absolute;
  right: 1px; bottom: 1px;
  width: 14px; height: 12px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  z-index: 2;
  border-radius: 3px;
  transition: background .12s;
}
.tb-group-expand:hover { background: var(--hover-medium); }
.tb-group-expand svg {
  width: 6px; height: 4px;
  fill: currentColor;
  color: var(--text-muted);
  opacity: .6;
}
.tb-group-expand:hover svg { opacity: 1; color: var(--text); }

.tb-group-panel {
  display: none;
  position: absolute;
  left: calc(100% + 4px); top: -4px;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: 8px;
  padding: 6px;
  min-width: 170px;
  z-index: 100;
  box-shadow: 0 4px 20px var(--overlay-shadow, rgba(0,0,0,.5));
  animation: ddFadeIn .12s ease;
}
.tb-group-panel.visible { display: block; }

.tb-group-title {
  color: var(--text-muted);
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 4px 8px 6px;
}

.tb-group-panel .tb-btn {
  width: 100%;
  height: 34px;
  justify-content: flex-start;
  gap: 10px;
  padding: 0 8px;
  border-radius: 6px;
}
.tb-group-panel .tb-btn span {
  font-size: .88rem;
  color: var(--text-dim);
  white-space: nowrap;
}
.tb-group-panel .tb-btn:hover span { color: var(--text-bright); }
.tb-group-panel .tb-btn.active span { color: var(--blue); }


.tb-group-panel .tb-btn[data-tip]:hover::before { display: none; }

.tb-group-panel .tb-btn.active::after { display: none; }



.tb-vsep { width: 1px; height: 20px; background: var(--border); flex-shrink: 0; }


.cm-add-btn {
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border: 1px dashed var(--surface-border-strong);
  border-radius: var(--radius-sm);
  background: none; color: var(--text-dim);
  font-family: var(--font-ui); font-size: 1rem; font-weight: 500;
  cursor: pointer; transition: all var(--ease); flex-shrink: 0;
}
.cm-add-btn:hover { border-color: var(--blue); color: var(--blue); }


.cm-expr-overlay {
  position: fixed; inset: 0; z-index: 9999;
  display: none; align-items: center; justify-content: center;
  background: rgba(0,0,0,.6); backdrop-filter: blur(4px);
}
.cm-expr-overlay.open { display: flex; }
.cm-expr-modal {
  background: var(--card); border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg); padding: 20px 24px;
  box-shadow: 0 12px 48px rgba(0,0,0,.6);
  min-width: 360px; max-width: 480px;
}
.cm-expr-title {
  font-family: var(--font-ui); font-size: 1rem; font-weight: 600;
  color: var(--text); margin-bottom: 12px;
}
.cm-expr-input {
  width: 100%; padding: 10px 12px;
  background: var(--surface-raised); border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm); color: var(--text);
  font-family: var(--font-ui); font-size: .95rem;
  outline: none; transition: border-color var(--ease);
}
.cm-expr-input:focus { border-color: var(--blue); }
.cm-expr-hint {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-dim); margin-top: 8px;
}
.cm-expr-btns {
  display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px;
}
.cm-expr-cancel, .cm-expr-ok {
  font-family: var(--font-ui); font-size: .88rem; font-weight: 500;
  padding: 6px 16px; border: none; border-radius: var(--radius-sm);
  cursor: pointer; transition: all var(--ease);
}
.cm-expr-cancel { background: var(--surface-raised); color: var(--text-dim); }
.cm-expr-cancel:hover { background: var(--surface-border); color: var(--text); }
.cm-expr-ok { background: var(--blue); color: var(--text-bright); }
.cm-expr-ok:hover { background: var(--blue-hover); }


#ddTimeframe .tb-dd-panel { min-width: auto; }

.tb-dd-tf {
  display: block; width: 100%;
  padding: 5px 14px; border: none; background: none;
  color: var(--text-dim); font-family: var(--font-ui);
  font-size: .90rem; font-weight: 500;
  cursor: pointer; transition: all var(--ease); text-align: left;
  white-space: nowrap;
}
.tb-dd-tf:hover { background: var(--hover-subtle); color: var(--text); }
.tb-dd-tf.active { color: var(--blue); }


.tb-dropdown { position: relative; }

.tb-dd-trigger {
  display: flex; align-items: center; gap: 5px;
  padding: 5px 8px; border: none; background: none;
  color: var(--text-dim); border-radius: var(--radius-sm);
  cursor: pointer; font-family: var(--font-ui);
  font-size: .97rem; font-weight: 500;
  transition: all var(--ease);
}
.tb-dd-trigger:hover { background: var(--surface-raised); color: var(--text); }
.tb-dd-trigger.open { background: var(--surface-border); color: var(--text); }

.tb-dd-trigger svg {
  width: 16px; height: 16px;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0;
}

.dd-chev { width: 10px !important; height: 10px !important; opacity: .5; transition: transform .15s; }
.tb-dd-trigger.open .dd-chev { transform: rotate(180deg); }

.dd-label { margin-left: 1px; }


.tb-dd-panel {
  position: absolute; top: calc(100% + 6px); left: 0;
  min-width: 180px;
  background: var(--card); border: 1px solid var(--border-hi);
  border-radius: 8px; padding: 4px 0;
  box-shadow: 0 10px 36px rgba(0, 0, 0, .55);
  z-index: 100; display: none;
}
.tb-dd-panel.open { display: block; animation: ddFadeIn .12s ease; }
@keyframes ddFadeIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.tb-dd-wide { min-width: 210px; }


.tb-dd-item {
  display: flex; align-items: center; gap: 10px;
  width: 100%; padding: 7px 14px;
  border: none; background: none;
  color: var(--text-dim);
  font-family: var(--font-ui); font-size: .99rem; font-weight: 450;
  cursor: pointer; transition: all var(--ease); text-align: left;
}
.tb-dd-item:hover { background: var(--hover-subtle); color: var(--text); }
.tb-dd-item.active { color: var(--blue); }

.tb-dd-item svg {
  width: 18px; height: 18px;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0;
}


.tb-dd-ind {
  display: flex; align-items: center; justify-content: space-between;
  padding: 7px 14px; cursor: pointer; transition: background .12s;
}
.tb-dd-ind:hover { background: var(--divider-soft); }

.tb-dd-ind-name {
  display: flex; align-items: center; gap: 8px;
  font-size: .99rem; color: var(--text-dim); font-weight: 450;
}

.ind-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; }

.tb-dd-sep { height: 1px; background: var(--border); margin: 4px 10px; }



.tgl {
  width: 30px; height: 16px; border-radius: 8px;
  background: var(--border); position: relative;
  transition: background .2s; flex-shrink: 0;
}
.tgl.on { background: var(--green); }
.tgl::after {
  content: '';
  position: absolute; width: 12px; height: 12px;
  border-radius: 50%; background: #fff;
  top: 2px; left: 2px;
  transition: transform .2s;
}
.tgl.on::after { transform: translateX(14px); }




.sb-overlay {
  position: fixed; inset: 0;
  background: var(--overlay-bg);
  backdrop-filter: blur(8px);
  display: none; align-items: center; justify-content: center;
  
  z-index: 6000;
}
.sb-overlay.open { display: flex; animation: sbFadeIn .15s ease; }
@keyframes sbFadeIn { from { opacity: 0; } to { opacity: 1; } }


.sb-modal {
  width: 860px; height: 75vh; max-height: 75vh;
  background: var(--panel);
  backdrop-filter: blur(40px) saturate(1.2);
  border: 1px solid var(--surface-raised);
  border-radius: 20px;
  box-shadow: 0 40px 120px rgba(0,0,0,.65), 0 0 0 1px var(--hover-subtle);
  display: flex; flex-direction: column;
  overflow: hidden;
}


.sb-tabs {
  display: flex; gap: 0; margin-bottom: 0; flex-shrink: 0;
}
.sb-tab {
  font-family: var(--font-ui); font-size: .88rem; font-weight: 500;
  padding: 6px 14px; border: none; background: none;
  color: var(--text-dim); cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all var(--ease); white-space: nowrap;
}
.sb-tab:hover { color: var(--text); }
.sb-tab.active { color: var(--text-bright); border-bottom-color: var(--text-bright); }


.sb-header {
  padding: 16px 24px 8px;
  display: flex; align-items: center; gap: 0;
}

.sb-searchrow {
  padding: 0 24px 14px;
  display: flex; align-items: stretch; gap: 10px;
}

.sb-fx-calc {
  flex-shrink: 0;
  display: flex; align-items: center;
  padding: 0 20px;
  font-family: var(--font-ui); font-size: .95rem; font-weight: 600;
  border-radius: var(--radius-md);
  background: rgba(195,160,95,.16); border: 1px solid #c3a05f; color: #c3a05f;
  cursor: pointer; white-space: nowrap;
  transition: background var(--ease), color var(--ease);
}
.sb-fx-calc:hover { background: rgba(195,160,95,.28); color: #d4b57a; }
.sb-search-box {
  flex: 1; display: flex; align-items: center; gap: 12px;
  background: var(--divider-soft);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-md); padding: 12px 16px;
  transition: border-color .15s ease;
}
.sb-search-box:focus-within { border-color: var(--surface-border-strong); }
.sb-search-box svg {
  width: 20px; height: 20px; stroke: var(--text-dim); fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0;
}
.sb-input {
  flex: 1; background: none; border: none; outline: none;
  font-family: var(--font-ui); font-size: 1.15rem; font-weight: 400;
  color: var(--text-bright); letter-spacing: -.01em; caret-color: var(--blue);
}
.sb-input::placeholder { color: var(--text-muted); font-weight: 300; font-size: 1rem; }
.sb-close {
  width: 28px; height: 28px; border-radius: var(--radius-sm);
  background: none; border: none; cursor: pointer;
  font-size: 1.3rem; line-height: 1; color: var(--text-muted);
  display: flex; align-items: center; justify-content: center;
  transition: background var(--ease), color var(--ease); flex-shrink: 0;
  margin-left: 12px;
}
.sb-close:hover { background: var(--hover-medium); color: var(--text-bright); }


.sb-filters {
  display: block;
  overflow: visible; 
}
.sb-spacer { flex: 1; }


.sb-toolbar {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 24px 4px; flex-wrap: wrap;
}
.sb-source { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; }
.sb-source-label {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted);
}


.sb-fg { position: relative; }
.sb-fg-trigger {
  display: flex; align-items: center; gap: 6px;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  padding: 7px 14px; border-radius: var(--radius-md);
  border: 1px solid var(--border-hi); background: none;
  color: var(--text-soft); cursor: pointer;
  transition: all .12s ease; white-space: nowrap;
}
.sb-fg-trigger:hover { border-color: var(--text-muted); color: var(--text-bright); }
.sb-fg-trigger.has-value { border-color: var(--surface-border-strong); color: var(--text-bright); background: var(--surface-raised); }
.sb-fg-trigger svg {
  width: 12px; height: 12px; stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; flex-shrink: 0; opacity: .5;
}


.sb-fg-panel {
  position: absolute; top: calc(100% + 6px); left: 0;
  width: 480px; max-height: 440px; overflow-y: auto;
  background: var(--card); border: 1px solid var(--surface-raised);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0,0,0,.5);
  z-index: 510; display: none;
  padding: 6px 0;
}
.sb-fg-panel.open { display: block; animation: ddFadeIn .12s ease; }
.sb-fg-panel::-webkit-scrollbar { width: 5px; }
.sb-fg-panel::-webkit-scrollbar-thumb { background: var(--border-hi); border-radius: 3px; }

.sb-fg-section-label {
  font-size: .82rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em;
  color: var(--text-muted); padding: 8px 16px 6px;
}


.sb-rg-header {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 16px; cursor: pointer;
  transition: background .1s;
  font-size: .92rem; color: var(--text);
}
.sb-rg-header:hover { background: var(--divider-soft); }

.sb-rg-chev {
  width: 12px; height: 12px; stroke: var(--text-muted); fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0; transition: transform .15s ease;
}
.sb-rg-chev.sb-chev-open { transform: rotate(90deg); }

.sb-rg-cb {
  width: 16px; height: 16px; accent-color: var(--blue); cursor: pointer; margin: 0; flex-shrink: 0;
}
.sb-rg-name { flex: 1; font-weight: 500; }
.sb-rg-count { font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted); }


.sb-rg-children {
  padding: 2px 0 8px;
  border-bottom: 1px solid var(--divider-soft);
}
.sb-rg-ex {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 16px 7px 50px; cursor: pointer;
  font-size: .85rem; color: var(--text-dim);
  transition: background .1s;
}
.sb-rg-ex:hover { background: var(--hover-subtle); color: var(--text-soft); }
.sb-rg-ex input[type="checkbox"] {
  width: 15px; height: 15px; accent-color: var(--blue); cursor: pointer; margin: 0; flex-shrink: 0;
}
.sb-rg-ex-code {
  font-family: var(--font-ui); font-weight: 700; min-width: 36px;
  color: var(--text-soft); font-size: .82rem;
}
.sb-rg-ex-name {
  flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: var(--font-ui); font-size: .82rem;
}
.sb-rg-ex-count {
  font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted);
  min-width: 50px; text-align: right;
}


.sb-ct-header {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 16px 8px 40px; cursor: pointer;
  transition: background .1s;
  font-size: .88rem; color: var(--text-soft);
}
.sb-ct-header:hover { background: var(--hover-subtle); }
.sb-ct-expandable { cursor: pointer; }
.sb-ct-chev {
  width: 10px; height: 10px; stroke: var(--text-muted); fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0; transition: transform .15s ease;
}
.sb-ct-chev.sb-chev-open { transform: rotate(90deg); }
.sb-ct-spacer { width: 10px; flex-shrink: 0; }
.sb-ct-name { flex: 1; font-weight: 500; }
.sb-ct-count { font-family: var(--font-ui); font-size: .7rem; color: var(--text-muted); }


.sb-gp-header {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 16px 6px 64px; cursor: default;
  font-size: .82rem; color: var(--text-dim);
}
.sb-gp-name { flex: 1; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; font-size: .82rem; color: var(--text-muted); }
.sb-gp-count { font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted); }


.sb-ex-row {
  display: flex; align-items: center; gap: 10px;
  padding: 5px 16px 5px 80px; cursor: pointer;
  font-size: .82rem; color: var(--text-dim);
  transition: background .1s;
}
.sb-ct-children > .sb-ex-row { padding-left: 64px; }
.sb-ex-row:hover { background: var(--hover-subtle); color: var(--text-soft); }
.sb-ex-cb {
  width: 14px; height: 14px; accent-color: var(--blue); cursor: pointer; margin: 0; flex-shrink: 0;
}
.sb-ex-code {
  font-family: var(--font-ui); font-weight: 700; min-width: 36px;
  color: var(--text-soft); font-size: .82rem;
}
.sb-ex-name {
  flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: var(--font-ui); font-size: .82rem;
}
.sb-ex-count {
  font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted);
  min-width: 50px; text-align: right;
}
.sb-ct-children {
  padding: 2px 0 6px;
  border-bottom: 1px solid var(--hover-subtle);
}


.sb-types {
  display: flex; gap: 0;
  padding: 0 16px;
  border-bottom: 1px solid var(--surface-border);
  overflow-x: auto;
}
.sb-types::-webkit-scrollbar { height: 0; }
.sb-type-pill {
  font-family: var(--font-ui); font-size: .9rem; font-weight: 500;
  padding: 11px 13px;
  border: none; background: none;
  color: var(--text-dim); cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color var(--ease), border-color var(--ease);
  white-space: nowrap; flex-shrink: 0;
}
.sb-type-pill:hover { color: var(--text-soft); }
.sb-type-pill.active { color: var(--text-bright); border-bottom-color: var(--text-bright); }


.sb-provider-filter {
  display: inline-flex; gap: 2px;
  background: var(--surface-veil); border: 1px solid var(--surface-border);
  border-radius: 999px; padding: 3px;
}
.sb-provider-pill {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  padding: 5px 12px; border-radius: 999px;
  border: none; background: none;
  color: var(--text-dim); cursor: pointer;
  transition: all var(--ease); letter-spacing: .02em;
}
.sb-provider-pill:hover { color: var(--text-soft); }
.sb-provider-pill.active { background: var(--surface-raised); color: var(--text-bright); }


.sb-bubbles {
  display: inline-flex; flex-wrap: wrap; gap: 6px;
  min-height: 0;
}
.sb-bubbles:empty { display: none; }
.sb-bubble {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 8px 4px 10px; border-radius: 20px;
  background: var(--surface-raised); border: 1px solid var(--surface-border);
  font-family: var(--font-ui); font-size: .7rem; font-weight: 600;
  color: var(--text-soft); white-space: nowrap;
  transition: background var(--ease);
}
.sb-bubble:hover { background: var(--surface-border); }
.sb-bubble-x {
  width: 14px; height: 14px; border-radius: 50%; border: none;
  background: var(--surface-border); color: var(--text-muted);
  font-size: .82rem; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--ease), color var(--ease);
  padding: 0;
}
.sb-bubble-x:hover { background: var(--surface-border-strong); color: var(--text-bright); }

.sb-divider { height: 1px; background: var(--hover-subtle); }


.sb-loading {
  display: none; align-items: center; justify-content: center; gap: 6px;
  padding: 16px; font-size: .85rem; color: var(--text-muted);
}
.sb-loading svg {
  width: 18px; height: 18px; animation: sbSpin .8s linear infinite;
}
@keyframes sbSpin { to { transform: rotate(360deg); } }


.sb-results {
  flex: 1; overflow-y: auto; padding: 4px 8px 8px;
}
.sb-results::-webkit-scrollbar { width: 5px; }
.sb-results::-webkit-scrollbar-thumb { background: var(--border-hi); border-radius: 3px; }

.sb-row {
  display: flex; align-items: center; gap: 0;
  padding: 10px 20px;
  cursor: pointer; border-radius: 12px;
  transition: background .1s ease;
}
.sb-row:hover { background: var(--hover-subtle); }
.sb-row-hl { background: var(--surface-raised); }


.sb-row-logo { margin-right: 12px; }
.sb-row-logo.wl-logo { width: 24px; height: 24px; }
.sb-row-logo.wl-logo img { width: 24px; height: 24px; }
.sb-row-logo.wl-logo .wl-logo-fb { width: 24px; height: 24px; font-size: .72rem; }

.sb-row-sym {
  font-family: var(--font-ui); font-weight: 700; font-size: .88rem; color: var(--text-bright);
  min-width: 130px; flex-shrink: 0;
}
.sb-row-sym b { color: var(--blue); }

.sb-row-company {
  flex: 1; min-width: 0;
  font-family: var(--font-ui); font-size: .88rem; color: var(--text-soft); font-weight: 400;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 0 16px;
}

.sb-row-right {
  display: flex; flex-direction: column; align-items: flex-end; gap: 2px;
  flex-shrink: 0; min-width: 140px;
}
.sb-row-exch {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 450;
  color: var(--text-muted);
}
.sb-row-type {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  padding: 2px 7px; border-radius: 4px; letter-spacing: .03em;
}
.sb-row-type-stock { background: var(--hover-subtle); color: var(--text-dim); }
.sb-row-type-etf { background: var(--purple-dim); color: var(--purple); }
.sb-row-type-index { background: var(--blue-dim); color: var(--blue); }
.sb-row-type-crypto { background: var(--amber-dim); color: var(--amber); }
.sb-row-type-forex { background: var(--green-dim); color: var(--green); }
.sb-row-type-futures { background: var(--red-dim); color: var(--red); }
.sb-row-type-vlt { background: rgba(195,160,95,.18); color: #c3a05f; }

.sb-row-type-delisted {
  background: var(--hover-subtle);
  color: var(--text);
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.55);
}



.vlt-disabled,
.breadth-disabled {
  opacity: .35 !important;
  cursor: not-allowed !important;
  pointer-events: auto !important;
  filter: grayscale(.6);
}
.vlt-disabled:hover,
.breadth-disabled:hover {
  background: transparent !important;
}


.sb-row-provider {
  font-family: var(--font-ui); font-size: .72rem; font-weight: 700;
  padding: 1px 5px; border-radius: 3px; letter-spacing: .04em; text-transform: uppercase;
}
.sb-provider-delayed { background: rgba(77,166,255,.12); color: #4da6ff; }
.sb-provider-eod { background: rgba(255,184,51,.12); color: #ffb833; }

.sb-empty {
  padding: 40px 20px; text-align: center;
  font-size: .9rem; color: var(--text-muted);
}


.sb-top-label {
  font-family: var(--font-ui); font-size: .7rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--text-muted); padding: 12px 20px 4px;
}
.sb-top-cat {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-dim); padding: 10px 20px 2px;
  border-top: 1px solid var(--hover-subtle);
}
.sb-top-cat:first-of-type { border-top: none; }
.sb-top-row { opacity: .85; }
.sb-top-row:hover { opacity: 1; }




.sb-fx-toggles {
  display: flex; gap: 10px;
  padding: 12px 20px 8px;
}
.sb-fx-toggle {
  flex: 1;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 14px 10px 12px;
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: all var(--ease);
}
.sb-fx-toggle:hover {
  background: var(--surface-raised);
  border-color: var(--surface-border-hi);
}
.sb-fx-toggle-active {
  background: var(--surface-raised);
  border-color: var(--macro-accent);
  box-shadow: 0 0 0 1px var(--macro-accent), 0 2px 12px rgba(0,0,0,.2);
}
.sb-fx-toggle-icon {
  font-family: var(--font-ui); font-size: 1.3rem; font-weight: 700;
  color: var(--macro-accent);
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  background: var(--hover-subtle);
  border-radius: var(--radius-sm);
}
.sb-fx-toggle-active .sb-fx-toggle-icon {
  background: var(--surface-border);
}
.sb-fx-toggle-label {
  font-family: var(--font-ui); font-size: .93rem; font-weight: 600;
  color: var(--text);
}
.sb-fx-toggle-desc {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-muted); text-align: center;
}


.sb-fx-legend { padding: 10px 20px 8px; }
.sb-fx-legend-ops { font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted); }
.sb-fx-legend-ops b { color: var(--text-soft); font-weight: 600; letter-spacing: .04em; }
.sb-fx-ex-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sb-fx-ex {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  padding: 4px 11px; border-radius: 999px;
  background: var(--surface-veil); border: 1px solid var(--surface-border);
  color: var(--text-soft); cursor: pointer;
  transition: background var(--ease), color var(--ease);
}
.sb-fx-ex:hover { background: var(--surface-raised); color: var(--text-bright); }


.sb-fx-live-status {
  margin: 4px 20px 8px; padding: 8px 12px; border-radius: var(--radius-sm);
  font-family: var(--font-ui); font-size: .88rem; font-weight: 500;
}
.sb-fx-ok  { color: var(--green); background: var(--green-dim); }
.sb-fx-err { color: var(--red);   background: var(--red-dim); }
.sb-fx-run { color: var(--amber); background: var(--amber-dim); }
.sb-fx-live-syms { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 20px 10px; }
.sb-fx-sym {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px;
  background: var(--surface-veil); border: 1px solid var(--surface-border);
}
.sb-fx-sym-code { font-family: var(--font-ui); font-size: .82rem; font-weight: 700; color: var(--text-soft); }
.sb-fx-sym-name {
  font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted);
  max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sb-fx-sym-known .sb-fx-sym-code { color: var(--green); }



.sb-fx-sub {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em;
  color: #c3a05f;
  padding: 10px 20px 2px;
  border-top: 1px solid var(--hover-subtle);
}
.sb-fx-sub:first-of-type { border-top: none; }


.sb-fx-preset {
  display: flex; flex-direction: column; gap: 1px;
  padding: 8px 20px 8px 28px; cursor: pointer;
  transition: background var(--ease);
}
.sb-fx-preset:hover { background: var(--surface-raised); }
.sb-fx-preset-name {
  font-family: var(--font-ui); font-size: .93rem; font-weight: 500;
  color: var(--text);
}
.sb-fx-preset-expr {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-muted);
}


.sb-fx-suggest {
  padding: 0 28px;
  max-height: 220px; overflow-y: auto;
}
.sb-fx-suggest:empty { display: none; }
.sb-fx-sg-row {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 12px; cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background var(--ease);
}
.sb-fx-sg-row:hover { background: var(--surface-border); }
.sb-fx-sg-sym {
  font-family: var(--font-ui); font-size: .88rem; font-weight: 600;
  color: var(--blue); min-width: 70px;
}
.sb-fx-sg-name {
  font-family: var(--font-ui); font-size: .84rem;
  color: var(--text-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}


.sb-fx-ophint { font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted); padding: 6px 12px 4px; }
.sb-fx-ops { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 12px 8px; }
.sb-fx-op {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  padding: 5px 11px; border-radius: var(--radius-sm);
  background: var(--surface-veil); border: 1px solid var(--surface-border);
  color: var(--text-soft); cursor: pointer; transition: background var(--ease), color var(--ease);
}
.sb-fx-op b { color: var(--text-bright); font-weight: 700; margin-right: 3px; }
.sb-fx-op:hover { background: var(--surface-raised); color: var(--text-bright); }

.sb-fx-fix {
  margin-left: 10px; font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  padding: 2px 10px; border-radius: 999px;
  background: var(--red-dim); border: 1px solid var(--red); color: var(--red); cursor: pointer;
}
.sb-fx-fix:hover { background: var(--red); color: #fff; }


.sb-status {
  padding: 8px 28px;
  border-top: 1px solid var(--hover-subtle);
  display: flex; align-items: center; gap: 6px;
  font-size: .82rem; font-family: var(--font-ui); color: var(--text-muted);
}
.sb-status-dot {
  width: 5px; height: 5px; border-radius: 50%; background: var(--green); flex-shrink: 0;
}


.ctx-gann-grid {
  display: flex; flex-direction: column;
  gap: 5px; padding: 4px 0;
}
.ctx-gann-cb {
  display: flex; align-items: center; gap: 6px;
  cursor: pointer; font-size: .82rem; color: var(--text-dim);
}
.ctx-gann-cb input[type="checkbox"] {
  width: 14px; height: 14px;
  accent-color: var(--blue); cursor: pointer; margin: 0;
}
.ctx-gann-cb span {
  font-family: var(--font-ui); font-weight: 500; flex: 1;
}
.ctx-gann-dir {
  font-size: .82rem; padding: 1px 3px;
  background: var(--bg-card); color: var(--text); border: 1px solid var(--border);
  border-radius: 3px; cursor: pointer;
}



.ctx-menu {
  position: fixed; z-index: 5000;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg);
  min-width: 300px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, .6);
  display: none;
  font-family: var(--font-ui);
  user-select: none;
  overflow: hidden;
}
.ctx-menu.visible { display: block; }
.ctx-menu.dragging { user-select: none; }


.ctx-tabs {
  display: flex;
  border-bottom: 1px solid var(--border);
}
.ctx-tab {
  flex: 1;
  padding: 10px 0;
  border: none;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .87rem;
  font-weight: 500;
  cursor: pointer;
  position: relative;
  transition: color var(--ease);
  text-align: center;
}
.ctx-tab:hover { color: var(--text); }
.ctx-tab.active { color: var(--blue); }
.ctx-tab.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 16px;
  right: 16px;
  height: 2px;
  background: var(--blue);
  border-radius: 1px 1px 0 0;
}


.ctx-body {
  height: 400px;
  overflow-y: auto;
}
.ctx-tab-pane { display: none; }
.ctx-tab-pane.active { display: block; }


.ctx-style-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  cursor: pointer;
  border-radius: var(--radius-sm);
  transition: opacity var(--ease);
}
.ctx-style-row:hover { opacity: .8; }
.ctx-style-row label {
  font-size: .86rem;
  font-weight: 450;
  color: var(--text-dim);
  margin-left: auto;
  pointer-events: none;
}


.ctx-swatch {
  width: 28px; height: 28px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border-hi);
  flex-shrink: 0;
  cursor: pointer;
  transition: transform var(--ease), box-shadow var(--ease);
}
.ctx-swatch:hover { transform: scale(1.08); box-shadow: 0 0 0 2px var(--blue-focus); }


.ctx-line-preview { flex-shrink: 0; display: block; }


.ctx-prop-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0;
}
.ctx-prop-row > label {
  font-size: .82rem; font-weight: 500;
  color: var(--text-muted);
  min-width: 64px; flex-shrink: 0;
}


.ctx-fib-level {
  display: flex; align-items: center; gap: 10px;
  padding: 5px 0;
}
.ctx-fib-swatch { width: 24px; height: 24px; border-radius: var(--radius-sm); flex-shrink: 0; cursor: pointer; }
.ctx-fib-val {
  font-family: var(--font-ui);
  font-size: .88rem; font-weight: 500;
  color: var(--text);
  min-width: 52px;
}
.ctx-fib-spacer { flex: 1; }
.ctx-fib-del {
  background: none; border: none;
  color: var(--text-muted); cursor: pointer;
  width: 24px; height: 24px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm); flex-shrink: 0;
  transition: all var(--ease);
}
.ctx-fib-del:hover { background: var(--surface-border); color: var(--red); }
.ctx-fib-del svg {
  width: 14px; height: 14px;
  stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.ctx-fib-picker { padding-left: 34px; }
.ctx-fib-add-row {
  display: flex; align-items: center; gap: 8px;
}
.ctx-fib-add-input {
  flex: 1; padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .88rem;
  outline: none;
  transition: border-color .15s;
}
.ctx-fib-add-input:focus { border-color: var(--blue); }
.ctx-fib-add-input::placeholder { color: var(--text-muted); }
.ctx-fib-add-btn { flex-shrink: 0; padding: 6px 12px !important; }
.ctx-fib-uniform-row {
  display: flex; align-items: center; gap: 10px; padding: 2px 0;
}
.ctx-fib-uniform-swatch {
  width: 24px; height: 24px; border-radius: var(--radius-sm); flex-shrink: 0; cursor: pointer;
}
.ctx-fib-uniform-label {
  font-size: .85rem; color: var(--text-dim);
}
.ctx-fib-uniform-picker { padding-left: 34px; }
.ctx-fib-divide-label {
  font-size: .85rem; color: var(--text-dim); white-space: nowrap; flex-shrink: 0;
}
.ctx-select {
  width: 100%; padding: 6px 8px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--bg); color: var(--text);
  font-family: var(--font-ui); font-size: .85rem;
  outline: none; cursor: pointer;
  transition: border-color .15s;
}
.ctx-select:focus { border-color: var(--blue); }


.ctx-picker {
  display: none;
  padding: 10px 0 4px;
}
.ctx-picker.visible { display: block; }


.ctx-palette {
  display: grid;
  grid-template-columns: repeat(8, 22px);
  gap: 2px;
  margin-bottom: 8px;
}
.ctx-pc {
  width: 22px; height: 22px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  border: 2px solid transparent;
  transition: transform .08s, border-color .08s;
}
.ctx-pc:hover { transform: scale(1.15); z-index: 1; }
.ctx-pc.active { border-color: #fff; }


.ctx-pc-add {
  width: 22px; height: 22px;
  border-radius: var(--radius-sm);
  border: 1px dashed var(--border-hi);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .82rem; color: var(--text-muted);
  cursor: pointer; background: none;
  transition: all var(--ease);
  margin-top: 2px;
}
.ctx-pc-add:hover { border-color: var(--text-dim); color: var(--text); }


.ctx-picker-sep { height: 1px; background: var(--border); margin: 8px 0; }
.ctx-picker-row {
  display: flex; align-items: center; gap: 8px; padding: 4px 0;
}
.ctx-picker-row > label {
  font-size: .82rem; font-weight: 500;
  color: var(--text-muted);
  min-width: 58px; flex-shrink: 0;
}


.ctx-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--border);
  cursor: grab;
}
.ctx-menu.dragging .ctx-hdr { cursor: grabbing; }
.ctx-hdr-title {
  font-family: var(--font-ui);
  font-size: .97rem; font-weight: 600;
  color: var(--text-bright); letter-spacing: .02em;
}
.ctx-hdr-close {
  background: none; border: none;
  color: var(--text-muted); cursor: pointer;
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  font-size: 1.2rem; font-weight: 400; line-height: 1;
  transition: all var(--ease);
}
.ctx-hdr-close:hover { background: var(--hover-medium); color: #fff; }


.ctx-section {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}
.ctx-section:last-of-type { border-bottom: none; }

.ctx-section-label {
  font-size: .82rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 10px;
}


.ctx-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 5px 0; gap: 12px;
}
.ctx-row label {
  font-size: .88rem; font-weight: 450;
  color: var(--text-dim); flex-shrink: 0;
  min-width: 56px;
}


.ctx-colors { display: flex; gap: 6px; align-items: center; }
.ctx-colors .cm-dot {
  width: 20px; height: 20px;
  border-radius: 50%; cursor: pointer;
  border: 2px solid transparent;
  transition: transform var(--ease), border-color var(--ease);
}
.ctx-colors .cm-dot:hover { transform: scale(1.15); }
.ctx-colors .cm-dot.active { border-color: #fff; }
.ctx-colors .cm-dot.custom {
  background: conic-gradient(red, yellow, lime, aqua, blue, magenta, red);
}


.ctx-styles { display: flex; gap: 4px; }
.ctx-style-btn {
  width: 42px; height: 30px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-dim);
  transition: all var(--ease);
}
.ctx-style-btn:hover { border-color: var(--border-hi); background: var(--divider-soft); }
.ctx-style-btn.active { border-color: var(--blue); background: var(--blue-dim); color: var(--blue); }
.ctx-style-btn svg { overflow: visible; }


.ctx-widths { display: flex; gap: 4px; }
.ctx-w {
  width: 34px; height: 30px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ease);
}
.ctx-w:hover { border-color: var(--border-hi); background: var(--divider-soft); }
.ctx-w.active { border-color: var(--blue); background: var(--blue-dim); }
.ctx-w svg { overflow: visible; }


.ctx-range-wrap {
  display: flex; align-items: center; gap: 10px;
  flex: 1; justify-content: flex-end;
}
.ctx-range-wrap input[type="range"] {
  width: 100px;
  -webkit-appearance: none; appearance: none;
  height: 4px;
  background: var(--border);
  border-radius: 2px;
  outline: none;
}
.ctx-range-wrap input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--blue);
  cursor: pointer;
  border: none;
}
.ctx-range-val {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim);
  min-width: 36px;
  text-align: right;
}


.ctx-row input[type="number"] {
  width: 72px; padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .88rem;
  outline: none;
  text-align: right;
  transition: border-color .15s;
}
.ctx-row input[type="number"]:focus { border-color: var(--blue); }


.ctx-row select {
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .88rem;
  outline: none;
  cursor: pointer;
  transition: border-color .15s;
}
.ctx-row select option {
  font-family: var(--font-ui);
  background: var(--card); color: var(--text);
}
.ctx-row select:focus { border-color: var(--blue); }


.ctx-style-divider {
  font-size: .72rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted);
  margin: 14px 0 8px; padding-top: 12px;
  border-top: 1px solid var(--border);
}
.ctx-style-divider:first-child { margin-top: 0; padding-top: 2px; border-top: none; }
.ctx-row-compact { padding: 6px 0; }
.ctx-sel-compact { width: 132px; }


.ctx-row input[type="color"] {
  width: 30px; height: 30px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  cursor: pointer; padding: 3px;
}
.ctx-row input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.ctx-row input[type="color"]::-webkit-color-swatch { border: none; border-radius: var(--radius-sm); }


.ctx-dim-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 5px 0; gap: 10px;
}
.ctx-dim-row label {
  font-size: .85rem; font-weight: 450;
  color: var(--text-dim); flex-shrink: 0;
  white-space: nowrap;
}
.ctx-dim-input {
  width: 100px; padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .88rem;
  outline: none;
  text-align: right;
  transition: border-color .15s;
}
.ctx-dim-input:focus { border-color: var(--blue); }
.ctx-dim-hint {
  font-size: .82rem; color: var(--text-muted);
  line-height: 1.4; margin-bottom: 8px;
}


.comp-panel {
  position:fixed; top:0; left:var(--toolbar-w); bottom:0;
  z-index:900; width:280px;
  background:var(--panel); border-right:1px solid var(--border);
  display:flex; flex-direction:column;
}
.comp-panel-right {
  position:fixed; top:0; right:var(--rsb-strip-w, 52px); bottom:0;
  z-index:900; width:280px;
  background:var(--panel); border-left:1px solid var(--border);
  display:flex; flex-direction:column;
}
.comp-hdr {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 18px 12px; border-bottom:1px solid var(--border);
}
.comp-title {
  font-size:.85rem; font-weight:700; color:var(--text);
  letter-spacing:.02em;
}
.comp-close {
  background:none; border:none; color:var(--text-dim);
  font-size:1.1rem; cursor:pointer; padding:0 2px; line-height:1;
}
.comp-close:hover { color:var(--text); }
.comp-desc {
  padding:12px 18px; font-size:.82rem; line-height:1.55;
  color:var(--text-muted); border-bottom:1px solid var(--border);
}
.comp-cols {
  display:flex; align-items:center; gap:8px;
  padding:8px 18px 4px; font-size:.82rem; font-weight:600;
  color:var(--text-muted); text-transform:uppercase; letter-spacing:.04em;
}
.comp-col-label { flex:1; }
.comp-col-r { flex:none; width:50px; text-align:center; }
.comp-list {
  flex:1; overflow-y:auto; padding:2px 0;
}
.comp-empty {
  padding:24px 18px; text-align:center;
  color:var(--text-muted); font-size:.82rem; line-height:1.6;
}
.comp-row {
  display:flex; align-items:center; gap:8px;
  padding:7px 18px; transition:background .1s;
}
.comp-row:hover { background:var(--hover-subtle); }
.comp-harm-row { padding-left:28px; opacity:.85; }
.comp-harm-indent { flex:none; width:10px; border-left:1px solid var(--border); height:16px; margin-left:2px; }
.comp-harm-spacer { flex:none; width:26px; }
.comp-harm-name { font-style:italic; }
.comp-info { flex:1; display:flex; flex-direction:column; gap:1px; min-width:0; }
.comp-name { font-size:.82rem; color:var(--text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.comp-meta { font-size:.82rem; color:var(--text-muted); font-family:var(--font-ui); }
.comp-eye {
  flex:none; width:26px; height:26px; padding:0;
  background:none; border:1px solid transparent; border-radius:var(--radius-sm);
  color:var(--text-dim); cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.comp-eye svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.6; }
.comp-eye:hover { border-color:var(--border); color:var(--text); }
.comp-eye.off { color:var(--text-muted); opacity:.45; }
.comp-inv {
  flex:none; width:26px; height:26px; padding:0;
  background:none; border:1px solid transparent; border-radius:var(--radius-sm);
  color:var(--text-muted); cursor:pointer; font-size:.82rem; font-weight:700;
  font-family:var(--font-ui);
  display:flex; align-items:center; justify-content:center;
  transition:all .15s;
}
.comp-inv:hover { border-color:var(--border); color:var(--text); }
.comp-inv.on { background:var(--blue); border-color:var(--blue); color:#fff; }
.comp-btn {
  padding:7px 20px; border-radius:var(--radius-sm); font-size:.82rem; font-weight:600;
  cursor:pointer; border:1px solid var(--border);
  background:transparent; color:var(--text); transition:all .15s;
}
.comp-btn:hover { border-color:var(--text-dim); }
.comp-btn.create-btn { background:var(--blue); border-color:var(--blue); color:#fff; }
.comp-btn.create-btn:hover { opacity:.85; }

.comp-body { flex:1; overflow-y:auto; }

.comp-section-label {
  padding:10px 18px 6px; font-size:.82rem; font-weight:700;
  color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em;
}
.comp-section-composites {
  display:flex; align-items:center; justify-content:space-between;
  border-top:1px solid var(--border); margin-top:4px; padding-top:12px;
}
.comp-add-btn {
  background:none; border:1px solid var(--border); color:var(--text-dim);
  width:22px; height:22px; border-radius:var(--radius-sm); cursor:pointer;
  font-size:.85rem; font-weight:600; display:flex; align-items:center;
  justify-content:center; transition:all var(--ease);
}
.comp-add-btn:hover { border-color:var(--text-dim); color:var(--text); }

.comp-sine-item {
  display:flex; align-items:center; gap:8px; padding:5px 18px;
}
.comp-sine-label { font-size:.82rem; color:var(--text-dim); }

.comp-acc { border-bottom:1px solid var(--border); }
.comp-acc:last-child { border-bottom:none; }
.comp-acc-hdr {
  display:flex; align-items:center; gap:8px; padding:9px 18px;
  cursor:pointer; transition:background var(--ease);
}
.comp-acc-hdr:hover { background:var(--hover-subtle); }
.comp-acc-hdr.open { background:var(--surface-veil); }
.comp-acc-arrow {
  font-size:.82rem; color:var(--text-muted); width:10px; flex-shrink:0;
  transition:color var(--ease);
}
.comp-acc-label {
  font-size:.82rem; font-weight:600; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.comp-frozen-badge {
  font-size:.82rem; font-weight:700; color:var(--green);
  text-transform:uppercase; letter-spacing:.04em; flex-shrink:0;
}
.comp-acc-body { padding:0 0 8px; }
.comp-row-divider { border-top:1px solid var(--border); margin:4px 18px; }
.comp-acc-actions { padding:8px 18px 4px; }

.comp-ctx-menu {
  background:var(--overlay-bg); backdrop-filter:var(--overlay-blur);
  border:1px solid var(--border); border-radius:var(--radius-sm);
  box-shadow:var(--overlay-shadow); padding:4px 0; min-width:170px;
}
.comp-ctx-item {
  padding:7px 14px; font-size:.82rem; color:var(--text); cursor:pointer;
  transition:background var(--ease);
}
.comp-ctx-item:hover { background:rgba(255,255,255,var(--hover-medium)); }
.comp-ctx-sep { border-top:1px solid var(--border); margin:4px 0; }
.comp-ctx-danger { color:var(--red, #e55); }
.comp-style-dot { transition:transform var(--ease),box-shadow var(--ease); }
.comp-style-dot:hover { transform:scale(1.3); box-shadow:0 0 6px var(--surface-border-strong); }
.comp-frozen-msg {
  padding:10px 18px; font-size:.7rem; color:var(--text-muted); line-height:1.5;
}

.comp-del-btn {
  flex-shrink:0; background:none; border:none; color:var(--text-muted);
  font-size:1rem; cursor:pointer; padding:0 2px; line-height:1; opacity:.4;
  transition:all var(--ease);
}
.comp-del-btn:hover { color:var(--red); opacity:1; }

.comp-drag-handle {
  flex-shrink:0; width:14px; color:var(--text-muted); font-size:.7rem;
  cursor:grab; opacity:.35; transition:opacity var(--ease); user-select:none;
}
.comp-drag-handle:hover { opacity:.8; }
.comp-row-dragging { opacity:.35; }

.comp-acc-drop { outline:1px dashed var(--blue); outline-offset:-1px; background:var(--blue-dim); }
.comp-acc-drop > .comp-acc-hdr { background:var(--blue-dim); }

.comp-acc-unassigned { border-top:1px solid var(--border); margin-top:4px; padding-top:2px; }
.comp-row-unassigned { opacity:.7; }
.comp-row-unassigned:hover { opacity:1; }


.ctx-multicolor { }
.ctx-color-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 5px 0; gap: 12px;
}
.ctx-color-row label {
  font-size: .88rem; font-weight: 450; color: var(--text-dim);
}
.ctx-color-row input[type="color"] {
  width: 28px; height: 24px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--bg); cursor: pointer; padding: 2px;
}
.ctx-color-row input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.ctx-color-row input[type="color"]::-webkit-color-swatch { border: none; border-radius: 2px; }


.ctx-footer {
  display: flex; align-items: center; gap: 6px;
  padding: 12px 16px;
  border-top: 1px solid var(--border);
}
.ctx-footer-spacer { flex: 1; }
.ctx-footer-btn {
  padding: 7px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
}
.ctx-footer-btn:hover { background: var(--surface-raised); color: var(--text); border-color: var(--border-hi); }
.ctx-footer-btn.danger { color: var(--red); border-color: rgba(240,80,110,.25); }
.ctx-footer-btn.danger:hover { background: var(--red-dim); }
.ctx-footer-btn.primary {
  background: var(--blue); color: #fff;
  border-color: var(--blue); font-weight: 600;
}
.ctx-footer-btn.primary:hover { background: var(--blue-hover); }


.cs-overlay {
  position: fixed; inset: 0; z-index: 5000;
  background: var(--overlay-bg);
  backdrop-filter: blur(var(--overlay-blur, 6px));
  -webkit-backdrop-filter: blur(var(--overlay-blur, 6px));
  display: none;
  align-items: center;
  justify-content: center;
  font-family: var(--font-ui);
  animation: csOverlayFade .15s ease;
}
.cs-overlay.visible { display: flex; }
@keyframes csOverlayFade { from { opacity: 0; } to { opacity: 1; } }

.cs-modal {
  width: min(820px, 92vw);
  height: min(560px, 88vh);
  background: var(--panel);
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-lg);
  box-shadow: 0 24px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.03) inset;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: csModalIn .18s cubic-bezier(.2,.8,.3,1);
}
@keyframes csModalIn { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }

.cs-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 22px;
  border-bottom: 1px solid var(--surface-border);
  background: var(--surface-veil);
}
.cs-modal-header h2 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-bright);
  letter-spacing: -.01em;
}
.cs-modal-close {
  width: 28px; height: 28px;
  border: none;
  background: transparent;
  color: var(--text-dim);
  font-size: 1.4rem;
  line-height: 1;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: var(--ease);
  display: inline-flex; align-items: center; justify-content: center;
}
.cs-modal-close:hover { background: var(--hover-medium); color: var(--text-bright); }

.cs-modal-body {
  flex: 1;
  display: grid;
  grid-template-columns: 200px 1fr;
  min-height: 0;
}

.cs-modal-nav {
  border-right: 1px solid var(--surface-border);
  padding: 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--surface-veil);
  overflow-y: auto;
}
.cs-nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 9px 12px;
  border: none;
  background: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.9rem;
  font-weight: 500;
  text-align: left;
  transition: var(--ease);
}
.cs-nav-item:hover { background: var(--hover-subtle); color: var(--text); }
.cs-nav-item.active {
  background: var(--surface-raised);
  color: var(--text-bright);
}
.cs-nav-icon {
  width: 18px; height: 18px;
  flex-shrink: 0;
  opacity: .9;
}

.cs-modal-content {
  padding: 26px 32px;
  overflow-y: auto;
  background: var(--panel);
}

.cs-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 16px 0;
  border-bottom: 1px solid var(--divider-soft);
}
.cs-row:last-child { border-bottom: none; }
.cs-row-info { min-width: 0; }
.cs-row-title {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--text-bright);
  margin-bottom: 3px;
}
.cs-row-desc {
  font-size: 0.82rem;
  color: var(--text-muted);
  line-height: 1.45;
}
.cs-row-control { flex-shrink: 0; }


.cs-segment {
  display: inline-flex;
  background: var(--surface-raised);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 3px;
  gap: 2px;
}
.cs-segment-btn {
  padding: 6px 14px;
  border: none;
  background: none;
  border-radius: 4px;
  cursor: pointer;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.86rem;
  font-weight: 500;
  transition: var(--ease);
  white-space: nowrap;
}
.cs-segment-btn:hover { color: var(--text); }
.cs-segment-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  font-weight: 600;
}


.cs-section-label {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-dim);
  margin: 4px 0 8px;
}


.cs-theme-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding-top: 6px;
}
.cs-theme-card {
  position: relative;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-md);
  padding: 14px;
  background: var(--surface-veil);
  cursor: pointer;
  transition: var(--ease);
  text-align: left;
  font-family: var(--font-ui);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cs-theme-card:hover {
  border-color: var(--surface-border-strong);
  background: var(--surface-raised);
}
.cs-theme-card.active {
  border-color: var(--blue);
  background: var(--blue-dim);
  box-shadow: 0 0 0 1px var(--blue) inset;
}
.cs-theme-preview {
  height: 56px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  position: relative;
  overflow: hidden;
}
.cs-theme-sw {
  width: 12px; height: 12px;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(255,255,255,.15);
}
.cs-theme-name {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-bright);
}
.cs-theme-check {
  position: absolute;
  top: 20px; right: 20px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--blue);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .7rem;
  font-weight: 700;
  z-index: 2;
  box-shadow: 0 0 0 2px var(--surface-veil);
}


.ctx-abis-opt {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.ctx-abis-opt-btns {
  display: flex; gap: 8px; margin-top: 8px;
}
.ctx-abis-opt-btn {
  flex: 1; padding: 8px 0;
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: var(--ease);
}
.ctx-abis-opt-btn:hover { background: rgba(255,255,255, var(--hover-medium)); }
.ctx-abis-opt-btn:disabled { opacity: .5; cursor: wait; }
.ctx-abis-opt-btn.loading { color: var(--text-dim); }

.ctx-abis-results-title {
  margin-top: 12px; margin-bottom: 6px;
  font-size: 0.85rem; font-weight: 600;
  color: var(--text-bright);
}
.ctx-abis-table {
  width: 100%; border-collapse: collapse;
  font-size: 0.82rem; font-family: var(--font-ui);
}
.ctx-abis-table th {
  padding: 4px 5px;
  text-align: right;
  color: var(--text-dim);
  font-weight: 500;
  border-bottom: 1px solid var(--border);
}
.ctx-abis-table th:first-child { text-align: left; }
.ctx-abis-table td {
  padding: 4px 5px;
  text-align: right;
  color: var(--text);
}
.ctx-abis-table td:first-child { text-align: left; }
.ctx-abis-table td.pos { color: var(--green); }
.ctx-abis-table td.neg { color: var(--red); }

.ctx-abis-row {
  cursor: pointer;
  transition: var(--ease);
}
.ctx-abis-row:hover { background: rgba(255,255,255, var(--hover-subtle)); }
.ctx-abis-row.selected { background: rgba(77,166,255,.12); }


.ctx-abis-no-results {
  margin-top: 10px;
  font-size: 0.85rem;
  color: var(--text-dim);
  text-align: center;
}




.drawings-panel {
  position: fixed; top: 0; left: var(--toolbar-w);
  width: 230px; height: 100vh;
  background: var(--panel);
  border-right: 1px solid var(--border);
  z-index: 55;
  display: none; flex-direction: column;
  box-shadow: 4px 0 16px rgba(0, 0, 0, .3);
  border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
}
.drawings-panel.open { display: flex; }

.dp-header {
  padding: 12px 14px 10px;
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
  flex-shrink: 0;
}
.dp-header h3 { font-family: var(--font-ui); font-size: 1.07rem; font-weight: 700; color: var(--text-bright); }

.dp-header-actions { display: flex; align-items: center; gap: 2px; }

.dp-global-eye {
  background: none; border: none;
  color: var(--text-dim); cursor: pointer;
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
}
.dp-global-eye:hover { background: var(--hover-medium); color: var(--text-bright); }
.dp-global-eye svg {
  width: 15px; height: 15px; stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

.dp-close {
  background: none; border: none;
  color: var(--text-dim); cursor: pointer;
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm); font-size: 1.2rem; font-weight: 700;
}
.dp-close:hover { background: var(--hover-medium); color: var(--text-bright); }

.dp-body { flex: 1; overflow-y: auto; padding: 6px 0; }

.dp-footer {
  flex-shrink: 0;
  border-top: 1px solid var(--border);
  padding: 8px 12px;
}
.dp-foot-del {
  width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 9px 0;
  background: none;
  border: 1px solid rgba(240, 80, 110, .28);
  border-radius: var(--radius-sm);
  color: var(--red, #e5566f);
  font-family: var(--font-ui);
  font-size: .86rem; font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
}
.dp-foot-del:hover { background: var(--red-dim, rgba(240, 80, 110, .12)); border-color: rgba(240, 80, 110, .5); }
.dp-foot-del svg {
  width: 15px; height: 15px; stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

.dp-cat {
  font-size: .83rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-dim);
  padding: 10px 14px 8px;
  display: flex; align-items: center; gap: 6px;
  cursor: pointer;
  user-select: none;
  transition: background var(--ease), color var(--ease);
}
.dp-cat:hover { background: var(--hover-subtle); color: var(--text); }
.dp-cat:hover .dp-cat-caret { color: var(--text); }
.dp-cat-caret {
  flex-shrink: 0; color: var(--text-faint);
  transition: transform .18s ease;
}
.dp-cat.collapsed .dp-cat-caret { transform: rotate(-90deg); }
.dp-cat-label { flex: 1; min-width: 0; }
.dp-cat-count {
  font-size: .83rem; color: var(--text-faint); font-weight: 500;
  background: var(--surface-raised);
  padding: 1px 7px; border-radius: 10px;
  min-width: 20px; text-align: center;
}
.dp-cat-del {
  background: none; border: none;
  color: var(--text-faint); cursor: pointer;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  flex-shrink: 0; padding: 0;
  opacity: 0;
  transition: opacity var(--ease), background var(--ease), color var(--ease);
}
.dp-cat:hover .dp-cat-del { opacity: 1; }
.dp-cat-del:hover { background: var(--red-dim); color: var(--red); }
.dp-cat-eye {
  background: none; border: none;
  color: var(--text-faint); cursor: pointer;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  flex-shrink: 0; padding: 0;
  opacity: 0;
  transition: opacity var(--ease), background var(--ease), color var(--ease);
}
.dp-cat:hover .dp-cat-eye { opacity: 1; }
.dp-cat.cat-hidden .dp-cat-eye { opacity: 1; color: var(--text-dim); }
.dp-cat-eye:hover { background: var(--surface-border); color: var(--text-bright); }
.dp-cat-eye svg {
  width: 13px; height: 13px; stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.dp-cat-items {
  overflow: hidden;
  transition: max-height .22s ease, opacity .18s ease;
  max-height: 2000px; opacity: 1;
}
.dp-cat-items.collapsed {
  max-height: 0; opacity: 0;
  pointer-events: none;
}

.dp-item {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 14px; cursor: pointer;
  transition: background var(--ease);
}
.dp-item:hover { background: var(--hover-subtle); }
.dp-item.selected { background: var(--blue-dim); }
.dp-item.hidden-item { opacity: .35; }
.dp-comp-parent { font-weight: 600; }
.dp-comp-child { padding-left: 28px; font-size: .82rem; opacity: .75; }
.dp-comp-child:hover { opacity: 1; }

.dp-dot {
  width: 10px; height: 10px;
  border-radius: 50%; flex-shrink: 0;
  cursor: pointer; transition: transform .15s;
}
.dp-dot:hover { transform: scale(1.5); }

.dp-name {
  flex: 1; font-size: .99rem; font-weight: 500;
  color: var(--text-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dp-item:hover .dp-name { color: var(--text-bright); }
.dp-item.selected .dp-name { color: var(--blue); }

.dp-act {
  background: none; border: none;
  color: var(--text-faint); cursor: pointer;
  width: 24px; height: 24px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm); flex-shrink: 0; padding: 0;
}
.dp-act:hover { background: var(--surface-border); color: var(--text-bright); }
.dp-act.del:hover { color: var(--red); }
.dp-act.lock[title="Unlock"] { color: var(--red); }
.dp-act.lock[title="Unlock"]:hover { color: var(--red); }
.dp-act svg {
  width: 14px; height: 14px;
  stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

.dp-empty { padding: 20px 14px; text-align: center; font-size: .97rem; color: var(--text-faint); }


.dp-cm-val {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-faint); margin-left: auto; white-space: nowrap;
}
.dp-cm-expr-name {
  font-style: italic; max-width: 100px; overflow: hidden; text-overflow: ellipsis;
}
.dp-cm-scale-row {
  display: flex; align-items: center; gap: 4px;
  padding: 4px 14px 6px; font-family: var(--font-ui);
}
.dp-cm-scale-label {
  font-size: .82rem; color: var(--text-dim); margin-right: 2px;
}
.dp-cm-scale-opt {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  padding: 2px 7px; border: none; background: none;
  color: var(--text-dim); border-radius: var(--radius-sm);
  cursor: pointer; transition: all var(--ease);
}
.dp-cm-scale-opt:hover { background: var(--surface-raised); color: var(--text); }
.dp-cm-scale-opt.active { background: var(--blue-dim); color: var(--blue); }



.tb-dd-ind-panel {
  min-width: 240px !important;
  overflow: visible !important;
}

.ind-search-wrap { padding: 6px 10px 4px; }

.ind-search {
  width: 100%;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .97rem;
  outline: none;
  transition: border-color .15s;
}
.ind-search::placeholder { color: var(--text-muted); }
.ind-search:focus { border-color: var(--blue); }


.ind-cat-row {
  position: relative;
  display: flex; align-items: center; gap: 8px;
  padding: 7px 14px;
  cursor: default;
  transition: background var(--ease);
}
.ind-cat-row:hover { background: var(--surface-raised); }

.ind-cat-row-label {
  flex: 1;
  font-size: .92rem; font-weight: 600;
  color: var(--text-dim);
  letter-spacing: .02em;
}
.ind-cat-row:hover .ind-cat-row-label { color: var(--text); }

.ind-cat-count {
  font-size: .7rem; font-weight: 600;
  font-family: var(--font-ui);
  color: var(--text-muted);
  background: var(--surface-raised);
  border-radius: 8px;
  padding: 1px 7px;
  line-height: 1.4;
}

.ind-cat-arrow {
  width: 10px; height: 10px;
  fill: none; stroke: currentColor; stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round;
  color: var(--text-muted);
  flex-shrink: 0;
}
.ind-cat-row:hover .ind-cat-arrow { color: var(--text-dim); }


.ind-flyout {
  display: none;
  position: absolute;
  left: 100%;
  top: -4px;
  min-width: 220px;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  box-shadow: 0 10px 36px rgba(0, 0, 0, .55);
  padding: 4px 0;
  z-index: 1100;
}
.ind-cat-row:hover > .ind-flyout { display: block; }


.ind-flyout::before {
  content: '';
  position: absolute;
  left: -10px; top: 0;
  width: 10px; height: 100%;
}

.ind-flyout-title {
  padding: 6px 14px 5px;
  font-size: .82rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted);
  border-bottom: 1px solid var(--hover-subtle);
  margin-bottom: 2px;
}


.ind-cat-item {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 14px; cursor: pointer;
  transition: background .12s;
}
.ind-cat-item:hover { background: var(--surface-raised); }

.ind-cat-item-name {
  font-size: .92rem; font-weight: 500;
  color: var(--text-dim);
}
.ind-cat-item:hover .ind-cat-item-name { color: var(--text); }

.ind-cat-item-full {
  font-size: .82rem;
  color: var(--text-muted);
  margin-left: auto;
  white-space: nowrap;
}


.ind-flat-item { padding: 6px 14px; }

.ind-display-section { margin-top: 2px; }

.ind-display-title {
  padding: 8px 14px 4px;
  font-size: .82rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted);
}


.ind-pane {
  position: relative;
  border-top: 1px solid var(--border);
  background: var(--bg);
  flex-shrink: 0;
}

.ind-pane-header {
  position: absolute; top: 0; left: 0; right: 0;
  height: 24px; z-index: 10;
  display: flex; align-items: center; gap: 0;
  padding: 0 10px;
  pointer-events: none;
}
.ind-pane-header .ind-pane-close {
  margin-left: auto;
}

.ind-pane-label {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  color: var(--text-muted);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ind-pane-close {
  pointer-events: auto;
  background: none; border: none;
  color: var(--text-muted); cursor: pointer;
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  font-size: 1.05rem; font-weight: 700;
  transition: all var(--ease);
}
.ind-pane-close:hover { background: var(--hover-medium); color: var(--red); }


.ind-pane-header-overlay {
  position: absolute; top: 0; left: 0; right: 0;
  height: 24px; z-index: 20;   
  display: flex; align-items: center; gap: 0;
  padding: 0 10px;
  pointer-events: none;
}
.ind-pane-header-overlay .ind-pane-close {
  margin-left: auto;
}

.ind-pane-chart {
  width: 100%;
  height: calc(100% - 26px);
  margin-top: 26px;
}


.sbt-pane-stats {
  pointer-events: none;
  display: flex; gap: 10px; align-items: center;
  font-family: var(--font-ui);
  font-size: .82rem;
  margin-left: 12px;
}
.sbt-pane-btn {
  pointer-events: auto;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  margin-left: 6px;
  transition: all var(--ease);
}
.sbt-pane-btn:hover {
  border-color: var(--blue);
  color: var(--blue);
}
.sbt-pane-btn:disabled {
  opacity: .5;
  cursor: default;
}
.sbt-opt-wrap {
  pointer-events: auto;
}
.sbt-opt-menu {
  pointer-events: auto;
}




.rsb-icon[data-tab="zigzag"] svg { fill: none; stroke: none; }


.zz-empty {
  color: var(--text-muted);
  font-size: 0.94rem;
  text-align: center;
  padding: 32px 16px;
}


.zz-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px;
}


.zz-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.zz-threshold-badge {
  font-family: var(--font-ui);
  font-size: 1.0rem;
  font-weight: 700;
  color: var(--blue);
}
.zz-pivot-count {
  font-size: 0.91rem;
  color: var(--text-dim);
  font-weight: 500;
}
.zz-header-actions {
  display: flex;
  gap: 6px;
}
.zz-action-btn {
  padding: 4px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border);
  background: var(--hover-subtle);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.91rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
}
.zz-action-btn:hover {
  background: var(--surface-border);
  color: var(--text);
}
.zz-action-btn.zz-danger {
  border-color: rgba(240,80,110,.25);
  color: var(--red);
}
.zz-action-btn.zz-danger:hover {
  background: var(--red-dim);
}


.zz-section { position: relative; }
.zz-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin: -12px -14px 10px;
  padding: 10px 14px;
  background: var(--divider-soft);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  border-bottom: 1px solid var(--surface-raised);
  transition: background .12s;
  user-select: none;
}
.zz-section-header:hover { background: var(--surface-raised); }
.zz-chevron {
  width: 12px; height: 12px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .2s;
}
.zz-section.collapsed .zz-chevron { transform: rotate(-90deg); }
.zz-section.collapsed .zz-section-header {
  margin-bottom: -12px;
  border-bottom: none;
  border-radius: var(--radius-lg);
}


.zz-sub-title {
  font-size: 0.84rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 10px 0 4px;
  padding-top: 6px;
  border-top: 1px solid var(--hover-subtle);
}


.zz-current-swing {
  text-align: center;
  font-size: 0.97rem;
  font-weight: 600;
  color: var(--green);
  margin-top: 8px;
  padding: 6px;
  background: var(--green-subtle);
  border-radius: 10px;
}
.zz-current-swing.down {
  color: var(--red);
  background: var(--red-subtle);
}


.zz-fib-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
}
.zz-fib-label {
  font-family: var(--font-ui);
  font-size: 0.88rem;
  color: var(--text-dim);
  min-width: 70px;
  flex-shrink: 0;
}
.zz-fib-bar-wrap {
  flex: 1;
  height: 6px;
  background: var(--surface-raised);
  border-radius: 3px;
  overflow: hidden;
}
.zz-fib-bar {
  height: 100%;
  background: var(--blue);
  border-radius: 3px;
  min-width: 2px;
  transition: width .3s;
}
.zz-fib-val {
  font-family: var(--font-ui);
  font-size: 0.91rem;
  color: var(--text-bright);
  min-width: 20px;
  text-align: right;
}


.zz-pivot-table-wrap {
  max-height: 320px;
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0 -8px;
}
.zz-pivot-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.89rem;
}
.zz-pivot-table thead th {
  position: sticky;
  top: 0;
  background: var(--card);
  padding: 6px 4px;
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  text-align: right;
  border-bottom: 1px solid var(--surface-border);
  z-index: 1;
}
.zz-pivot-table thead th:first-child,
.zz-pivot-table thead th:nth-child(2) { text-align: left; }
.zz-pivot-table tbody tr {
  cursor: pointer;
  transition: background .1s;
}
.zz-pivot-table tbody tr:hover { background: var(--blue-dim); }
.zz-pivot-table tbody td {
  padding: 5px 4px;
  border-bottom: 1px solid var(--hover-subtle);
  font-family: var(--font-ui);
  font-size: 0.89rem;
  color: var(--text);
  text-align: right;
  white-space: nowrap;
}
.zz-pivot-table tbody td:first-child {
  text-align: left;
  color: var(--text-dim);
  font-size: 0.84rem;
}
.zz-pivot-table tbody td:nth-child(2) {
  text-align: left;
}
.zz-type-high { color: var(--green); font-weight: 600; }
.zz-type-low { color: var(--red); font-weight: 600; }


.zz-popover {
  position: fixed;
  z-index: 300;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
  min-width: 200px;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  animation: ddFadeIn .15s ease;
}
.zz-pop-title {
  font-size: 0.91rem;
  font-weight: 700;
  color: var(--text-bright);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 10px;
}
.zz-pop-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}
.zz-pop-label {
  font-size: 0.82rem;
  color: var(--text-dim);
  min-width: 68px;
}
.zz-pop-hint {
  font-size: .82rem;
  color: var(--text-dim);
  opacity: 0.6;
  margin-bottom: 10px;
}
.zz-pop-input {
  flex: 1;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-hi);
  background: var(--bg);
  color: var(--text-bright);
  font-family: var(--font-ui);
  font-size: 1.04rem;
  font-weight: 600;
  outline: none;
  transition: border-color .15s;
}
.zz-pop-input:focus { border-color: var(--blue); }
.zz-pop-unit {
  font-size: 1.0rem;
  color: var(--text-dim);
  font-weight: 600;
}
.zz-pop-actions {
  display: flex;
  gap: 6px;
}
.zz-pop-btn {
  flex: 1;
  padding: 6px 0;
  border-radius: var(--radius-sm);
  border: none;
  font-family: var(--font-ui);
  font-size: 0.94rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  text-align: center;
}
.zz-pop-apply {
  background: var(--blue);
  color: #fff;
}
.zz-pop-apply:hover { background: var(--blue-hover); }
.zz-pop-cancel {
  background: var(--surface-raised);
  color: var(--text-dim);
}
.zz-pop-cancel:hover { background: var(--surface-border); color: var(--text); }


.zz-threshold-control {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0 4px;
}
.zz-threshold-control input[type="number"] {
  width: 52px;
  padding: 4px 6px;
  background: var(--surface-raised);
  border: 1px solid var(--surface-border-hi);
  border-radius: 4px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 13px;
  outline: none;
  -moz-appearance: textfield;
}
.zz-threshold-control input[type="number"]::-webkit-outer-spin-button,
.zz-threshold-control input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.zz-threshold-control input[type="number"]:focus {
  border-color: var(--blue);
}
.zz-threshold-control .zz-pop-unit {
  color: var(--text-dim);
  font-size: 13px;
  margin-right: 2px;
}
.zz-threshold-control button {
  padding: 4px 10px;
  background: var(--blue);
  color: #fff;
  border: none;
  border-radius: 4px;
  font-family: var(--font-ui);
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s;
}
.zz-threshold-control button:hover {
  background: var(--blue-hover);
}


.zz-chart-wrap {
  height: 160px;
  margin: 8px 0;
  border-radius: var(--radius-sm);
  background: rgba(0,0,0,.15);
  padding: 6px 4px 2px;
  position: relative;
}


.zz-summary-nums {
  margin-bottom: 2px;
}
.zz-summary-nums .st-stat-row {
  padding: 2px 0;
}


.zz-proj-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2px 0 6px;
}
.zz-proj-toggle-row > span {
  font-size: 0.85rem;
  color: var(--text-dim);
}
.zz-proj-empty {
  text-align: center;
  color: var(--text-dim);
  font-size: 0.8rem;
  padding: 8px 0;
  opacity: 0.7;
}
.zz-proj-meta {
  text-align: center;
  font-size: .82rem;
  color: var(--text-dim);
  margin: 4px 0 8px;
  opacity: 0.7;
}
.zz-proj-levels {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin-bottom: 8px;
}
.zz-proj-level {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 6px;
  border-radius: var(--radius-sm);
  background: var(--surface-veil);
  transition: background var(--ease);
}
.zz-proj-level:hover {
  background: rgba(255,255,255, var(--hover-subtle));
}
.zz-proj-median {
  background: var(--hover-subtle);
  font-weight: 600;
}
.zz-proj-level-label {
  font-size: 0.8rem;
  color: var(--text-dim);
  min-width: 48px;
  font-family: var(--font-ui);
}
.zz-proj-level-price {
  font-family: var(--font-ui);
  font-size: 0.85rem;
  color: var(--text);
}
.zz-proj-level-pct {
  font-family: var(--font-ui);
  font-size: 0.8rem;
  min-width: 68px;
  text-align: right;
}
.zz-proj-level-pct.up { color: var(--green); }
.zz-proj-level-pct.down { color: var(--red); }
.zz-proj-subtitle {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text);
  padding: 8px 0 2px;
  border-top: 1px solid var(--surface-raised);
  margin-top: 6px;
}
.zz-proj-subtitle:first-child {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}



.zz-proj-colors-row {
  display: flex;
  gap: 16px;
  padding: 6px 0;
  border-bottom: 1px solid var(--surface-raised);
  margin-bottom: 4px;
}
.zz-proj-color-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .82rem;
  color: var(--text-dim);
  cursor: pointer;
}
.zz-proj-color-label input[type="color"] {
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-sm);
  background: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  flex-shrink: 0;
}
.zz-proj-color-label input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 1px;
}
.zz-proj-color-label input[type="color"]::-webkit-color-swatch {
  border: none;
  border-radius: 3px;
}
.zz-proj-layers {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 6px 0 8px;
  border-bottom: 1px solid var(--surface-raised);
  margin-bottom: 4px;
}
.zz-proj-layer-item {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  font-size: .82rem;
  color: var(--text-dim);
  padding: 2px 0;
}
.zz-proj-layer-item input[type="checkbox"] {
  width: 13px;
  height: 13px;
  accent-color: var(--blue);
  cursor: pointer;
  margin: 0;
}
.zz-proj-layer-item span {
  user-select: none;
}

.zz-proj-autohide-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 0 2px;
  font-size: .82rem;
  color: var(--text-dim);
}

.zz-adaptive-info {
  font-size: .82rem;
  color: var(--text-dim);
  padding: 2px 0 4px;
  opacity: 0.8;
}

.zz-sample-warn {
  color: var(--yellow, #eab308);
  font-size: .82rem;
  padding: 2px 0;
}

.zz-help-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  font-size: .7rem;
  font-weight: 700;
  color: var(--text-dim);
  border: 1px solid var(--surface-border-hi);
  border-radius: 50%;
  cursor: pointer;
  margin-left: 4px;
  vertical-align: middle;
  transition: var(--ease);
}
.zz-help-btn:hover {
  color: var(--text);
  border-color: rgba(255,255,255,.3);
}

.zz-help-modal-overlay {
  position: fixed;
  inset: 0;
  background: var(--overlay-bg, rgba(0,0,0,.6));
  backdrop-filter: var(--overlay-blur, blur(4px));
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.zz-help-modal {
  background: var(--bg-card, #1a1e2e);
  border-radius: var(--radius-lg);
  box-shadow: var(--overlay-shadow, 0 8px 32px rgba(0,0,0,.5));
  max-width: 420px;
  width: 90%;
  overflow: hidden;
}
.zz-help-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--surface-raised);
  font-weight: 600;
  font-size: .95rem;
  color: var(--text);
}
.zz-help-modal-close {
  width: 26px;
  height: 26px;
  font-size: 1.2rem;
  border-radius: var(--radius-sm);
  background: none;
  border: none;
  color: var(--text-dim);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.zz-help-modal-close:hover {
  background: rgba(255,255,255, var(--hover-medium, .08));
}
.zz-help-modal-body {
  padding: 16px;
  font-size: .88rem;
  line-height: 1.5;
  color: var(--text-dim);
}
.zz-proj-dur-row {
  padding-top: 2px;
}
.zz-proj-dur-row .st-stat-row {
  padding: 1px 0;
}


.zz-ins-sec {
  padding: 16px 18px 20px;
  border-bottom: 1px solid var(--border);
  background: transparent;
}
.zz-ins-sec:last-of-type {
  border-bottom: none;
}
.zz-ins-head {
  margin-bottom: 14px;
}
.zz-ins-title-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.zz-ins-num {
  font-family: var(--font-ui);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--text-bright);
  line-height: 1.15;
  letter-spacing: -.01em;
}
.zz-ins-title {
  font-family: var(--font-ui);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--text-bright);
  line-height: 1.15;
  letter-spacing: -.01em;
}
.zz-ins-sub {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-muted);
  margin-top: 4px;
}
.zz-ins-pill {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  font-family: var(--font-ui);
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.zz-ins-pill.up { background: var(--green-dim); color: var(--green); }
.zz-ins-pill.down { background: var(--red-dim); color: var(--red); }
.zz-ins-pill .zz-ins-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  animation: zzInsPulse 1.6s infinite;
}
@keyframes zzInsPulse { 0%,100%{opacity:1} 50%{opacity:.4} }


.zz-ins-prose {
  font-family: var(--font-ui);
  font-size: .93rem;
  line-height: 1.65;
  color: var(--text);
  margin-bottom: 12px;
}
.zz-ins-prose:last-child { margin-bottom: 0; }
.zz-ins-prose strong { color: var(--text-bright); font-weight: 600; }
.zz-ins-prose .hl-green { color: var(--green); font-weight: 600; }
.zz-ins-prose .hl-red { color: var(--red); font-weight: 600; }
.zz-ins-prose .hl-amber { color: var(--amber); font-weight: 600; }
.zz-ins-prose .hl-blue { color: var(--blue); font-weight: 600; }
.zz-ins-prose .hl-white { color: var(--text-bright); font-weight: 600; }


.zz-ins-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px;
  margin-bottom: 12px;
}
.zz-ins-metric {
  padding: 8px 9px;
  background: var(--surface-veil);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  text-align: left;
}
.zz-ins-metric-lbl {
  font-family: var(--font-ui);
  font-size: .6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.zz-ins-metric-val {
  font-family: var(--font-data);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text-bright);
  line-height: 1.15;
  letter-spacing: -.02em;
}
.zz-ins-metric-val.txt { font-family: var(--font-ui); font-size: .98rem; }
.zz-ins-metric-val.up { color: var(--green); }
.zz-ins-metric-val.down { color: var(--red); }
.zz-ins-metric-val.warn { color: var(--amber); }
.zz-ins-metric-val.info { color: var(--blue); }
.zz-ins-metric-sub {
  font-family: var(--font-data);
  font-size: .68rem;
  color: var(--text-muted);
  margin-top: 3px;
}


.zz-ins-subt {
  font-family: var(--font-ui);
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--text-muted);
  margin: 14px 0 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.zz-ins-subt .zz-ins-hint {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  font-size: .74rem;
  color: var(--text-muted);
  opacity: .85;
}


.zz-ins-distbar {
  display: flex;
  height: 30px;
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin: 8px 0 4px;
  border: 1px solid var(--surface-border);
}
.zz-ins-distbar-up,
.zz-ins-distbar-dn {
  display: flex;
  align-items: center;
  padding: 0 10px;
  font-family: var(--font-data);
  font-weight: 700;
  font-size: .78rem;
  color: var(--bg);
}
.zz-ins-distbar-up { background: var(--green); justify-content: flex-start; }
.zz-ins-distbar-dn { background: var(--red); justify-content: flex-end; }
.zz-ins-distbar-lbl {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-ui);
  font-size: .68rem;
  color: var(--text-muted);
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 600;
}


.zz-ins-chartwrap {
  position: relative;
  background: var(--surface-veil);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  margin: 6px 0 14px;
}
.zz-ins-chartwrap.zz-ins-static { padding: 8px 10px; }
.zz-ins-hcwrap { width: 100%; min-height: 160px; }

.zz-ins-toggle {
  position: absolute;
  top: 8px;
  right: 10px;
  display: inline-flex;
  background: var(--surface-raised);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  z-index: 2;
}
.zz-ins-toggle button {
  background: transparent;
  border: none;
  color: var(--text-muted);
  padding: 5px 8px;
  cursor: pointer;
  transition: var(--ease);
  display: flex;
  align-items: center;
  justify-content: center;
}
.zz-ins-toggle button svg { width: 14px; height: 14px; display: block; }
.zz-ins-toggle button:hover {
  color: var(--text-bright);
  background: var(--hover-subtle);
}
.zz-ins-toggle button.active {
  background: var(--blue);
  color: var(--pill-active-color);
}


.zz-ins-pvtbl {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-data);
  font-size: .8rem;
}
.zz-ins-pvtbl th {
  text-align: left;
  padding: 6px 8px;
  color: var(--text-muted);
  font-weight: 700;
  font-size: .65rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-bottom: 1px solid var(--surface-border);
}
.zz-ins-pvtbl td {
  padding: 7px 8px;
  color: var(--text);
  border-bottom: 1px solid var(--divider-soft);
}
.zz-ins-pvtbl tr:hover {
  background: var(--hover-subtle);
  cursor: pointer;
}
.zz-ins-pvtbl tr.now {
  background: var(--green-subtle);
}
.zz-ins-pvtbl .h { color: var(--green); font-weight: 700; }
.zz-ins-pvtbl .l { color: var(--red); font-weight: 700; }
.zz-ins-pvtbl .pct-pos { color: var(--green); }
.zz-ins-pvtbl .pct-neg { color: var(--red); }
.zz-ins-pv-now {
  background: var(--green);
  color: var(--bg);
  font-size: .58rem;
  padding: 1px 5px;
  border-radius: 3px;
  font-weight: 800;
  text-transform: uppercase;
  margin-left: 4px;
  letter-spacing: .04em;
  font-family: var(--font-ui);
}



.range-bar {
  height: 26px;
  border-top: 1px solid var(--border);
  background: var(--panel);
  display: flex; align-items: center; justify-content: flex-start;
  gap: 2px; flex-shrink: 0;
  padding: 0 8px;
}
.rb-btn {
  background: none; border: none; color: var(--text-dim);
  font-family: var(--font-ui); font-size: .87rem; font-weight: 500;
  padding: 4px 8px; border-radius: var(--radius-sm); cursor: pointer;
  transition: background .15s, color .15s;
}
.rb-btn:hover { color: var(--text); background: var(--hover-subtle); }
.rb-btn.active { color: var(--blue); background: var(--blue-dim); }


.rb-xaxis-dropdown { position: relative; }
.rb-xaxis-btn {
  background: none; border: 1px solid var(--border); color: var(--text-dim);
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  padding: 2px 10px; border-radius: var(--radius-sm); cursor: pointer;
  transition: all var(--ease);
}
.rb-xaxis-btn:hover { color: var(--text); border-color: var(--text-muted); }
.rb-xaxis-btn::after { content: ' ▴'; font-size: .6rem; opacity: .5; }
.rb-xaxis-menu {
  display: none; position: absolute; bottom: calc(100% + 4px); right: 0;
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius-sm); overflow: hidden; min-width: 130px;
  box-shadow: 0 4px 16px rgba(0,0,0,.4); z-index: 50;
}
.rb-xaxis-menu.open { display: block; }

.rb-tz-left .rb-xaxis-menu { right: auto; left: 0; }
.rb-tz-left { margin: 0 4px 0 6px; }

#rangeBar.intraday .rb-daily-only { display: none; }

#rangeBar:not(.intraday) .rb-tz-left { display: none; }
.rb-xaxis-opt {
  padding: 6px 12px; font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-dim); cursor: pointer; transition: all var(--ease);
}
.rb-xaxis-opt:hover { background: rgba(255,255,255, var(--hover-medium)); color: var(--text); }
.rb-xaxis-opt.active { color: var(--blue); }


.so-controls {
  display: flex; align-items: center; gap: 0;
  margin-right: 8px;
}
.so-pm-btn {
  width: 22px; height: 22px; display: flex; align-items: center; justify-content: center;
  background: none; border: 1px solid var(--border); color: var(--text-dim);
  font-family: var(--font-ui); font-size: .9rem; cursor: pointer;
  transition: all var(--ease);
}
#soMinus { border-radius: var(--radius-sm) 0 0 var(--radius-sm); border-right: none; }
#soPlus { border-radius: 0; }
.so-pm-btn:hover { color: var(--text); border-color: var(--text-muted); }
.so-amount {
  width: 32px; height: 22px; text-align: center;
  background: var(--card); border: 1px solid var(--border); border-left: none;
  color: var(--text); font-family: var(--font-ui); font-size: .82rem;
  outline: none; -moz-appearance: textfield;
}
.so-amount::-webkit-inner-spin-button,
.so-amount::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.so-unit-dropdown { position: relative; }
.so-unit-btn {
  height: 22px; min-width: 28px; padding: 0 6px;
  background: none; border: 1px solid var(--border); border-left: none;
  color: var(--amber); font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  cursor: pointer; transition: all var(--ease);
}
.so-unit-btn:hover { color: var(--text); border-color: var(--text-muted); }
.so-unit-btn::after { content: ' ▾'; font-size: .55rem; opacity: .5; }
.so-unit-menu {
  display: none; position: absolute; bottom: calc(100% + 4px); right: 0;
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius-sm); overflow: hidden; min-width: 60px;
  box-shadow: 0 4px 16px rgba(0,0,0,.4); z-index: 50;
}
.so-unit-menu.open { display: block; }
.so-unit-opt {
  padding: 6px 12px; font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-dim); cursor: pointer; transition: all var(--ease);
}
.so-unit-opt:hover { background: rgba(255,255,255, var(--hover-medium)); color: var(--text); }
.so-unit-opt.active { color: var(--amber); }
.so-add-btn {
  height: 22px; padding: 0 10px; margin-left: 0;
  background: none; border: 1px solid var(--border);
  border-left: none; border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--text-dim); font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  cursor: pointer; transition: all var(--ease);
}
.so-add-btn:hover { color: var(--text); border-color: var(--text-muted); background: var(--hover-subtle); }
.so-date {
  height: 22px; padding: 0 6px;
  background: var(--card); border: 1px solid var(--border); border-left: none; border-right: none;
  color: var(--text); font-family: var(--font-ui); font-size: .82rem;
  outline: none; color-scheme: dark;
}
.so-tags {
  display: flex; align-items: center; gap: 4px; margin-right: 6px;
}
.so-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 6px; background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-sm); font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-dim);
}
.so-tag.hidden-item { opacity: .45; }
.so-tag-eye {
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--text-muted); flex-shrink: 0;
  transition: color var(--ease);
}
.so-tag-eye svg {
  width: 12px; height: 12px; fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.so-tag-eye:hover { color: var(--text); }
.so-tag-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  cursor: pointer; transition: transform var(--ease);
}
.so-tag-dot:hover { transform: scale(1.35); }
.so-tag-x {
  cursor: pointer; margin-left: 2px; font-size: .9rem; color: var(--text-muted);
  transition: color var(--ease);
}
.so-tag-x:hover { color: var(--red); }


#chartWrap[data-so-cursor="drag"] { cursor: ew-resize; }


.statusbar {
  height: 26px;
  border-top: 1px solid var(--border);
  background: var(--panel);
  display: flex; align-items: center;
  padding: 0 14px;
  font-family: var(--font-ui);
  font-size: .82rem; color: var(--text-muted);
  gap: 14px; flex-shrink: 0;
}
.dot { width: 5px; height: 5px; border-radius: 50%; background: var(--green); animation: pulse 2s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }


.st-spacer { flex: 1; }

.st-user {
  display: flex; align-items: center;
  gap: 8px;
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim, #9aa3b8);
  letter-spacing: .01em;
  max-width: 360px;
  overflow: hidden;
}
.st-user-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #ef4444;
  flex-shrink: 0;
  box-shadow: 0 0 0 2px rgba(239,68,68,.22);
}
.st-user[data-tier="guest"]   .st-user-dot { background: #ef4444; box-shadow: 0 0 0 2px rgba(239,68,68,.22); }
.st-user[data-tier="free"]    .st-user-dot { background: #facc15; box-shadow: 0 0 0 2px rgba(250,204,21,.28); }
.st-user[data-tier="basic"]   .st-user-dot { background: #22c55e; box-shadow: 0 0 0 2px rgba(34,197,94,.22); }
.st-user[data-tier="premium"] .st-user-dot { background: #22c55e; box-shadow: 0 0 0 2px rgba(34,197,94,.22); }

.st-user-name {
  font-weight: 500;
  color: var(--text, #e8ebf4);
  max-width: 200px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.st-user-sep { opacity: .5; }
.st-user-tier {
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .78rem;
}
.st-user[data-tier="guest"]   .st-user-tier { color: #fca5a5; }
.st-user[data-tier="free"]    .st-user-tier { color: #ffd85a; }
.st-user[data-tier="basic"]   .st-user-tier { color: #c0c6d4; }
.st-user[data-tier="premium"] .st-user-tier { color: #c3a05f; letter-spacing: .06em; font-weight: 700; }


.live-bar {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 1px 9px; border-radius: 999px;
  
  background: var(--card);
  border: 1px solid var(--border-hi);
  font-family: var(--font-ui); font-size: .78rem;
  color: var(--text-soft);
  cursor: default; user-select: none;
  transition: border-color .15s ease, background .15s ease;
}
.live-bar[hidden] { display: none; }

.lv-dot {
  width: 8px; height: 8px; border-radius: 50%; flex: none;
  background: var(--green);
  animation: lv-pulse 1.8s ease-out infinite;
}
@keyframes lv-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(38, 217, 127, .5); }
  70%  { box-shadow: 0 0 0 7px rgba(38, 217, 127, 0); }
  100% { box-shadow: 0 0 0 0 rgba(38, 217, 127, 0); }
}

.lv-state { font-weight: 700; letter-spacing: .06em; font-size: .72rem; color: var(--green); }
.lv-count { color: var(--text-soft); }


.live-bar.refreshing .lv-dot { animation: lv-pulse .6s ease-out infinite; }


.live-bar.paused .lv-dot   { background: var(--text-dim); animation: none; box-shadow: none; }
.live-bar.paused .lv-state { color: var(--text-dim); }


.live-bar.flash { animation: lv-flash .9s ease-out; }
@keyframes lv-flash {
  0%   { background: var(--green-strong); border-color: var(--green); }
  100% { background: var(--card); }
}


.lv-delayed {
  display: inline-flex; align-items: center;
  padding: 1px 9px; border-radius: 999px;
  background: var(--amber-dim);
  border: 1px solid var(--border);
  font-family: var(--font-ui); font-size: .72rem; font-weight: 600;
  letter-spacing: .03em;
  color: var(--amber);
  cursor: pointer; user-select: none;
  transition: border-color .15s ease, background .15s ease;
}
.lv-delayed:hover { border-color: var(--amber); }
.lv-delayed[hidden] { display: none; }


.lv-delayed-ov {
  position: fixed; inset: 0; z-index: 300;
  background: var(--overlay-bg);
  display: flex; align-items: center; justify-content: center;
}
.lv-delayed-ov[hidden] { display: none; }
.lv-delayed-modal {
  width: min(440px, calc(100vw - 32px));
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg);
  box-shadow: var(--overlay-shadow);
  font-family: var(--font-ui);
  color: var(--text);
  padding: 18px 20px 20px;
}
.lv-delayed-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.lv-delayed-title { font-size: 1rem; font-weight: 700; color: var(--text-bright); }
.lv-delayed-close {
  background: none; border: none; color: var(--text-dim);
  font-size: 1rem; cursor: pointer; padding: 2px 6px; border-radius: 6px;
}
.lv-delayed-close:hover { color: var(--text-bright); background: var(--toolbar-active); }
.lv-delayed-body p { margin: 0 0 12px; font-size: .88rem; line-height: 1.55; color: var(--text-soft); }
.lv-delayed-body p:last-child { margin-bottom: 0; }
.lv-delayed-body .lv-delayed-cta { color: var(--blue); font-weight: 600; }







#oprRoot{
  --ws-nav-w:248px;
  --font-mono:'JetBrains Mono', monospace;   
  --font-tbl:'Inter', -apple-system, sans-serif;
}


#oprRoot, #oprRoot *, #oprRoot *::before, #oprRoot *::after{ box-sizing:border-box; }
#oprRoot *{ margin:0; padding:0; }


#oprRoot, #oprRoot *, #oprHelpDrawer, #oprHelpDrawer *{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) transparent;}
#oprRoot::-webkit-scrollbar, #oprRoot *::-webkit-scrollbar, #oprHelpDrawer::-webkit-scrollbar, #oprHelpDrawer *::-webkit-scrollbar{width:8px;height:8px;}
#oprRoot::-webkit-scrollbar-thumb, #oprRoot *::-webkit-scrollbar-thumb, #oprHelpDrawer::-webkit-scrollbar-thumb, #oprHelpDrawer *::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:4px;}
#oprRoot::-webkit-scrollbar-thumb:hover, #oprRoot *::-webkit-scrollbar-thumb:hover, #oprHelpDrawer::-webkit-scrollbar-thumb:hover, #oprHelpDrawer *::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover);}


#oprRoot .ws-frame{
  display:flex; width:100%; height:100vh; min-width:0;
  transition:padding-right .28s var(--ease);
}
body.opr-help-open #oprRoot .ws-frame{ padding-right:var(--ws-help-w); }


#oprRoot .ws-nav{
  width:var(--ws-nav-w); flex:0 0 var(--ws-nav-w); display:flex; flex-direction:column;
  background:var(--panel); border-right:1px solid var(--border);
  font-family:var(--font-ui); overflow-y:auto;
}
#oprRoot .ws-nav-head{ padding:14px 16px 10px; border-bottom:1px solid var(--border); }
#oprRoot .ws-nav-title{ font-size:1.05rem; font-weight:700; color:var(--text-bright); display:flex; align-items:center; gap:8px; }
#oprRoot .ws-nav-sym{ font-size:.85rem; color:var(--text-dim); margin-top:2px; }
#oprRoot .ws-nav-body{ flex:1; padding:6px 8px 12px; }
#oprRoot .ws-nav-group{ margin-top:14px; }
#oprRoot .ws-nav-group:first-child{ margin-top:6px; }
#oprRoot .ws-nav-group-label{
  font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--text-muted); padding:0 10px 5px;
}
#oprRoot .ws-nav-item{
  display:flex; align-items:center; gap:9px; width:100%;
  padding:7px 12px; border:none; background:transparent; cursor:pointer;
  border-radius:var(--radius-sm); font-family:var(--font-ui);
  font-size:.92rem; font-weight:500; color:var(--text-dim); text-align:left;
  position:relative; transition:background var(--ease), color var(--ease);
}
#oprRoot .ws-nav-item:hover{ background:var(--hover-subtle); color:var(--text); }
#oprRoot .ws-nav-item.active{ color:var(--text-bright); font-weight:600; }
#oprRoot .ws-nav-item.active::before{
  content:""; position:absolute; left:0; top:5px; bottom:5px; width:2.5px;
  background:var(--text-bright); border-radius:2px;
}
#oprRoot .ws-nav-num{
  flex:0 0 22px; font-size:.72rem; font-weight:600; letter-spacing:.04em;
  color:var(--text-muted); font-variant-numeric:tabular-nums;
}
#oprRoot .ws-nav-item.active .ws-nav-num{ color:var(--text-bright); }
#oprRoot .ws-nav-foot{ border-top:1px solid var(--border); padding:10px 12px; font-size:.74rem; color:var(--text-muted); line-height:1.55; }

#oprRoot .ws-nav-mode{ padding:10px 12px 4px; }
#oprRoot .ws-nav-mode-lbl{ font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); padding:0 2px 6px; }
#oprRoot .stm-range-mode-switch{
  display:flex; gap:2px; padding:3px; background:var(--hover-subtle);
  border-radius:var(--radius-sm); border:1px solid var(--hover-subtle); width:100%;
}
#oprRoot .stm-range-mode-btn{
  flex:1; padding:6px 10px; border:none; border-radius:4px;
  background:transparent; color:var(--text-dim);
  font-family:var(--font-ui); font-size:.85rem; font-weight:600;
  cursor:pointer; transition:all var(--ease);
}
#oprRoot .stm-range-mode-btn:hover{ background:var(--hover-subtle); color:var(--text); }
#oprRoot .stm-range-mode-btn.active{ background:var(--blue-dim); color:var(--blue); }


#oprRoot .ws-main{ flex:1; min-width:0; display:flex; flex-direction:column; }
#oprRoot .ws-topbar{
  height:var(--topbar-h); flex:0 0 var(--topbar-h);
  display:flex; align-items:center; gap:14px; padding:0 20px;
  background:var(--panel); border-bottom:1px solid var(--border);
}
#oprRoot .tb-symbol select{
  background:var(--card); border:1px solid var(--border-hi); border-radius:var(--radius-sm);
  color:var(--text-bright); font-family:var(--font-ui); font-size:.95rem; font-weight:700;
  padding:4px 8px; cursor:pointer; outline:none;
}
#oprRoot .tb-spot{ font-family:var(--font-data); font-size:.95rem; font-weight:600; color:var(--text-bright); }
#oprRoot .tb-sep{ width:1px; height:20px; background:var(--border-hi); flex:0 0 1px; }
#oprRoot .tb-spacer{ flex:1; min-width:8px; }
#oprRoot .tb-icon-btn{
  background:var(--surface-veil); border:1px solid var(--surface-border); color:var(--text-dim);
  width:28px; height:28px; border-radius:var(--radius-sm); cursor:pointer;
  font-size:.85rem; display:inline-flex; align-items:center; justify-content:center;
  transition:background var(--ease), color var(--ease);
}
#oprRoot .tb-icon-btn:hover{ background:var(--hover-medium); color:var(--text-bright); }


#oprRoot .ws-scroll{ flex:1; overflow-y:auto; }
#oprRoot .ws-page{ max-width:1280px; margin:0 auto; padding:22px 26px 40px; }
#oprRoot .ws-report{ max-width:1020px; margin:0 auto; }


#oprRoot .ws-range-ctrls{
  position:sticky; top:0; z-index:30;
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  margin:0 0 18px; padding:12px 16px;
  background:var(--card); border:1px solid var(--border-hi);
  border-radius:var(--radius-md); box-shadow:0 8px 20px -8px rgba(0,0,0,.55);
}
#oprRoot .ws-ctrl-group{ display:flex; align-items:center; gap:7px; }
#oprRoot .ws-ctrl-label{ font-size:.84rem; font-weight:600; color:var(--text-dim); }
#oprRoot .ws-ctrl-note{ margin-left:auto; font-size:.78rem; color:var(--text-muted); }



#oprRoot .ws-chap{ scroll-margin-top:88px; padding:26px 0 30px; border-bottom:1px solid var(--border); }
#oprRoot .ws-chap:last-child{ border-bottom:none; }
#oprRoot .ws-ov-head{ padding:6px 0 4px; }
#oprRoot .ws-ov-titlerow{ display:flex; align-items:center; gap:11px; }
#oprRoot .ws-ov-title{ font-size:1.7rem; font-weight:700; color:var(--text-bright); line-height:1.15; letter-spacing:.01em; }
#oprRoot .ws-ov-sub{ font-size:1.05rem; color:var(--text-dim); margin-top:9px; max-width:760px; line-height:1.5; }
#oprRoot .ws-tool-head{ margin-bottom:14px; }
#oprRoot .ws-tool-title-row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
#oprRoot .ws-tool-title{ font-size:1.1rem; font-weight:600; color:var(--text-dim); line-height:1.15; letter-spacing:.01em; }
#oprRoot .ws-tool-question{ font-size:1.55rem; font-weight:700; color:var(--text-bright); line-height:1.25; margin-top:8px; max-width:900px; }
#oprRoot .ws-tool-sample{ font-size:.9rem; font-weight:500; color:var(--text-dim); margin-top:7px; }
#oprRoot .ws-tool-sample b{ color:var(--text); font-weight:600; }

#oprRoot .ws-view-label{
  display:flex; align-items:center; gap:9px; margin:32px 0 10px;
  font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted);
}
#oprRoot .ws-view-label::before{ content:""; width:14px; height:1.5px; background:currentColor; opacity:.55; }
#oprRoot .ws-view-help{
  width:18px; height:18px; border-radius:50%; border:1px solid var(--border-hi);
  background:transparent; color:var(--text-dim); cursor:pointer;
  font-family:var(--font-ui); font-size:.72rem; font-weight:700; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
  transition:background var(--ease), color var(--ease);
}
#oprRoot .ws-view-help:hover{ background:var(--hover-medium); color:var(--text-bright); }


#oprRoot .ws-chart-card{
  margin:18px 0 6px; border:1px solid var(--border); border-radius:var(--radius-lg);
  background:var(--surface-veil); overflow:hidden;
}


#oprRoot .ws-chart-card.opr-synth{
  background:var(--amber-dim);
  border-color:var(--amber-med);
  margin-top:10px;
}
#oprRoot .opr-synth .ws-chart-card-head{ border-bottom-color:var(--amber-med); }
#oprRoot .opr-synth .ws-chart-card-title{ color:var(--amber); }
#oprRoot .opr-synth .ws-chart-card-title .opr-synth-kicker{
  font-weight:600; letter-spacing:.02em; text-transform:none; color:var(--text-dim);
}

#oprRoot .opr-synth .tile{ background:var(--surface-veil); border-color:var(--surface-border); }

#oprRoot .opr-synth .ws-fig-cap{
  text-align:left; margin:0; padding:11px 14px 13px; color:var(--text-dim);
  border-top:1px solid var(--amber-med);
}
#oprRoot .opr-synth .ws-fig-cap b{ color:var(--amber); }

#oprRoot .ws-chart-card-head{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:9px 12px 9px 14px; border-bottom:1px solid var(--border);
}
#oprRoot .ws-chart-card-title{ font-size:.82rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--text-muted); }
#oprRoot .ws-chart-card-title .sub{ font-weight:600; letter-spacing:.02em; text-transform:none; color:var(--text-faint); margin-left:8px; }
#oprRoot .ws-chart-card-tools{ margin-left:auto; display:flex; align-items:center; gap:8px; }
#oprRoot .ws-chart-body{ padding:14px; }
#oprRoot .ws-chart-body .ws-fig-cap{ margin-top:12px; }
#oprRoot .ws-fig-cap{ font-size:.82rem; font-weight:600; color:var(--text-muted); margin:8px 2px 0; text-align:center; line-height:1.5; }
#oprRoot .ws-fig-cap b{ color:var(--text-dim); }
#oprRoot .hc{ width:100%; height:300px; }


#oprRoot .stm-ins-prose{ font-family:var(--font-ui); font-size:.93rem; line-height:1.65; color:var(--text); margin-bottom:10px; }
#oprRoot .stm-ins-prose:last-child{ margin-bottom:0; }
#oprRoot .stm-ins-prose strong{ color:var(--text-bright); }
#oprRoot .stm-ins-prose .hl-green{ color:var(--green); font-weight:600; }
#oprRoot .stm-ins-prose .hl-red{ color:var(--red); font-weight:600; }
#oprRoot .stm-ins-prose .hl-amber{ color:var(--amber); font-weight:600; }
#oprRoot .stm-ins-prose .hl-blue{ color:var(--blue); font-weight:600; }
#oprRoot .stm-ins-prose .hl-purple{ color:var(--purple); font-weight:600; }
#oprRoot .stm-ins-prose .hl-white{ color:var(--text-bright); font-weight:600; }
#oprRoot .stm-ins-prose .hl{ color:var(--text-bright); }
#oprRoot .stm-ins-prose .num{ font-family:var(--font-ui); font-weight:700; }
#oprRoot .hl-green, .as-rpt .hl-green{ color:var(--green); font-weight:600; }
#oprRoot .hl-red, .as-rpt .hl-red{ color:var(--red); font-weight:600; }
#oprRoot .hl-amber, .as-rpt .hl-amber{ color:var(--amber); font-weight:600; }
#oprRoot .hl-purple, .as-rpt .hl-purple{ color:var(--purple); font-weight:600; }
#oprRoot .hl-white, .as-rpt .hl-white{ color:var(--text-bright); font-weight:600; }
#oprRoot .hl, .as-rpt .hl{ color:var(--text-bright); font-weight:600; }

#oprRoot .narr{ margin:18px 0 24px; }
#oprRoot .narr p{ font-family:var(--font-ui); font-size:.98rem; line-height:1.6; color:var(--text); margin:0 0 11px; }
#oprRoot .narr p:last-child{ margin-bottom:0; }
#oprRoot .narr .lead{ font-size:1.05rem; color:var(--text-bright); font-weight:500; line-height:1.55; }
#oprRoot .narr .meta-note{ font-size:.85rem; color:var(--text-dim); }
#oprRoot .ws-ai-note{ margin:18px 0 24px; }
#oprRoot .ws-ai-note .stm-ins-prose{ margin:0 0 11px; font-size:.98rem; line-height:1.6; }
#oprRoot .ws-ai-note .stm-ins-prose:last-child{ margin-bottom:0; }

#oprRoot .ws-ai-note .stm-ins-prose .lead{ font-size:1.05rem; color:var(--text-bright); font-weight:500; line-height:1.55; }
#oprRoot .ws-ai-note .stm-ins-prose .meta-note{ font-size:.85rem; color:var(--text-dim); }

#oprRoot .chat .ws-ai-note{ margin:0; }
#oprRoot .ws-dd-label{
  font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--purple); margin:0 0 7px; display:flex; align-items:center; gap:7px;
}

#oprRoot .chat, .as-rpt .chat{ margin:18px 0 24px; }
#oprRoot .chat .chat-head, .as-rpt .chat .chat-head{ display:flex; align-items:center; gap:7px; margin-bottom:7px; }
#oprRoot .chat .chat-stars, .as-rpt .chat .chat-stars{ color:var(--purple); font-size:.8rem; letter-spacing:.08em; }
#oprRoot .chat .chat-name, .as-rpt .chat .chat-name{ font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--purple); }
#oprRoot .chat p, .as-rpt .chat p{ font-family:var(--font-ui); font-size:.98rem; line-height:1.6; color:var(--text); margin:0 0 11px; }
#oprRoot .chat p:last-child, .as-rpt .chat p:last-child{ margin-bottom:0; }
#oprRoot .chat em, .as-rpt .chat em{ color:var(--text-dim); }
#oprRoot .ins-list, .as-rpt .ins-list{ list-style:none; margin:6px 0 0; padding:0; font-size:.98rem; line-height:1.6; color:var(--text); }
#oprRoot .ins-wide, .as-rpt .ins-wide{ columns:2; column-gap:30px; margin-top:10px; }
#oprRoot .ins-wide li, .as-rpt .ins-wide li{ break-inside:avoid; }
#oprRoot .ins-list li, .as-rpt .ins-list li{ position:relative; padding:0 0 0 16px; margin:0 0 11px; }
#oprRoot .ins-list li::before, .as-rpt .ins-list li::before{ content:''; position:absolute; left:2px; top:9px; width:5px; height:5px; border-radius:50%; background:var(--text-muted); }
#oprRoot .ins-list li.on::before, .as-rpt .ins-list li.on::before{ background:var(--blue); }
#oprRoot .ins-list li.on, .as-rpt .ins-list li.on{ color:var(--text-bright); }
#oprRoot .ins-list li.off{ color:var(--text-muted); font-size:.9rem; }
@media(max-width:1180px){ #oprRoot .ins-wide{ columns:1; } }


#oprRoot .tiles, .as-rpt .tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; margin:14px 0 20px; }
#oprRoot .tile, .as-rpt .tile{
  background:var(--surface-veil); border:1px solid var(--border);
  border-radius:var(--radius-md); padding:14px 14px 12px; text-align:center; min-width:0;
  transition:border-color var(--ease), background var(--ease);
}
#oprRoot .tile:hover, .as-rpt .tile:hover{ border-color:var(--border-hi); background:var(--divider-soft); }
#oprRoot .tile-label, .as-rpt .tile-label{ font-size:.82rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); margin-bottom:6px; }
#oprRoot .tile-value, .as-rpt .tile-value{ font-family:var(--font-ui); font-size:1.27rem; font-weight:700; color:var(--text-bright); line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#oprRoot .tile-sub, .as-rpt .tile-sub{ font-family:var(--font-ui); font-size:.9rem; color:var(--text-dim); margin-top:3px; }
#oprRoot .tile-value.green, .as-rpt .tile-value.green{ color:var(--green); }
#oprRoot .tile-value.red, .as-rpt .tile-value.red{ color:var(--red); }
#oprRoot .tile-value.amber{ color:var(--amber); }
#oprRoot .tile-value.purple{ color:var(--purple); }


#oprRoot .synth{ margin:18px 0 2px; }
#oprRoot .synth p{ margin:0 0 13px; }
#oprRoot .synth p:last-child{ margin-bottom:2px; }


#oprRoot .fmt-toggle{
  display:inline-flex; gap:2px; padding:3px;
  background:var(--hover-subtle); border-radius:8px; border:1px solid var(--hover-subtle);
}
#oprRoot .fmt-toggle button{
  padding:6px 11px; border:none; border-radius:var(--radius-sm); background:none;
  color:var(--text-muted); font-family:var(--font-ui); font-size:.85rem; font-weight:600;
  cursor:pointer; transition:all var(--ease); text-align:center;
}
#oprRoot .fmt-toggle button:hover:not(:disabled):not(.active){ color:var(--text); background:var(--divider-soft); }
#oprRoot .fmt-toggle button.active{ background:var(--blue-dim); color:var(--blue); box-shadow:0 1px 4px rgba(0,0,0,.2); }
#oprRoot .fmt-toggle button:disabled{ opacity:.35; cursor:default; }
#oprRoot .fmt-toggle button[data-z]{ font-family:var(--font-data); font-size:.95rem; font-weight:700; padding:3px 11px; }
#oprRoot select.mini{
  background:var(--card); border:1px solid var(--border); border-radius:var(--radius-sm);
  color:var(--text-bright); font-family:var(--font-ui); font-size:.85rem; font-weight:600;
  padding:5px 9px; cursor:pointer; outline:none;
}
#oprRoot .cc-lbl{ font-size:.82rem; font-weight:600; color:var(--text-dim); }
#oprRoot .stm-chart-help-btn{
  width:22px; height:22px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--surface-border); background:var(--surface-veil); color:var(--text-muted);
  border-radius:50%; font-family:var(--font-ui); font-size:.82rem; font-weight:700;
  cursor:pointer; line-height:1; transition:all var(--ease);
}
#oprRoot .stm-chart-help-btn:hover{ background:var(--purple-med); border-color:var(--purple); color:var(--text-bright); }
#oprRoot .stm-chart-help-btn.active{ background:var(--purple-med); border-color:var(--purple); color:var(--text-bright); box-shadow:0 0 0 3px var(--purple-dim); }


#oprRoot .bl{ padding:0; }
#oprRoot .bl-spot{
  position:relative; display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  padding:0 2px 10px; margin-bottom:10px; border-bottom:1px solid var(--border);
}
#oprRoot .bl-spot .lbl{ font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em; color:var(--text-muted); }
#oprRoot .bl-spot .v{ font-family:var(--font-data); font-size:1rem; font-weight:700; color:var(--blue); }
#oprRoot .bl-spot .note{ font-size:.78rem; color:var(--text-muted); }
#oprRoot .bl-tools{ margin-left:auto; display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:8px 12px; }
#oprRoot .bl-head{
  display:grid; grid-template-columns:64px 1fr 70px 1fr;
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  color:var(--text-muted); padding:0 4px 6px;
}
#oprRoot .bl-head .l{ text-align:right; }
#oprRoot .bl-head .c{ text-align:center; }
#oprRoot .bl-head .r{ text-align:left; }
#oprRoot .bl-chart{ display:flex; flex-direction:column; gap:2px; }
#oprRoot .bl-row{ display:grid; grid-template-columns:64px 1fr 70px 1fr; align-items:center; padding:1px 4px; border-radius:4px; }
#oprRoot .bl-tags{ display:flex; align-items:center; justify-content:flex-end; gap:4px; padding-right:10px; }
#oprRoot .bl-dot{ width:8px; height:8px; flex:0 0 auto; transform:rotate(45deg); border-radius:1.5px; }
#oprRoot .bl-dot.d-spot{ background:var(--blue); }
#oprRoot .bl-dot.d-cw{ background:var(--green); }
#oprRoot .bl-dot.d-pw{ background:var(--red); }
#oprRoot .bl-dot.d-mp{ background:var(--amber); }
#oprRoot .bl-dot.d-flip{ background:var(--purple); }
#oprRoot .bl-dot.d-mag{ background:transparent; box-shadow:inset 0 0 0 2px var(--purple); }
#oprRoot .bl-legend i.dia{ width:8px; height:8px; border-radius:1.5px; transform:rotate(45deg); }
#oprRoot .bl-legend i.dia.hollow{ background:transparent; box-shadow:inset 0 0 0 2px var(--purple); }
#oprRoot .bl-row.r-spot{ background:var(--blue-med); }
#oprRoot .bl-row.r-spot .bl-strike{ color:var(--blue); font-weight:700; box-shadow:inset 0 0 0 1.5px var(--blue); border-radius:5px; }
#oprRoot .bl-row.r-mp{ background:var(--amber-light); }
#oprRoot .bl-row.r-cw{ background:var(--green-med); }
#oprRoot .bl-row.r-pw{ background:var(--red-med); }
#oprRoot .bl-row.r-flip{ background:var(--purple-med); }
#oprRoot .bl-left{ display:flex; align-items:center; justify-content:flex-end; gap:6px; }
#oprRoot .bl-right{ display:flex; align-items:center; gap:6px; }
#oprRoot .bl-val{ font-family:var(--font-data); font-size:.68rem; color:var(--text-dim); white-space:nowrap; }
#oprRoot .bl-bar{ height:11px; border-radius:2px; }
#oprRoot .bl-bar-grp{ display:flex; align-items:center; }
#oprRoot .bl-bar-grp>.bl-bar{ border-radius:0; }
#oprRoot .bl-bar-grp>.bl-bar:first-child{ border-top-left-radius:2px; border-bottom-left-radius:2px; }
#oprRoot .bl-bar-grp>.bl-bar:last-child{ border-top-right-radius:2px; border-bottom-right-radius:2px; }
#oprRoot .bl-bar-c{ background:var(--green); }
#oprRoot .bl-bar-p{ background:var(--red); }
#oprRoot .bl-strike{ font-family:var(--font-data); font-size:.75rem; font-weight:600; color:var(--text-bright); text-align:center; }
#oprRoot .bl-scroll{ max-height:520px; min-height:90px; overflow-y:auto; resize:vertical; padding-right:3px; }
#oprRoot .bl.z0 .bl-row{ padding:0 4px; }
#oprRoot .bl.z0 .bl-bar{ height:7px; }
#oprRoot .bl.z0 .bl-strike{ font-size:.68rem; }
#oprRoot .bl.z0 .bl-val{ font-size:.6rem; }
#oprRoot .bl.z0 .bl-dot{ width:7px; height:7px; }
#oprRoot .bl.z0 .bl-tags{ gap:3px; }
#oprRoot .bl.z2 .bl-row{ padding:3px 4px; }
#oprRoot .bl.z2 .bl-bar{ height:16px; }
#oprRoot .bl.z2 .bl-strike{ font-size:.88rem; }
#oprRoot .bl.z2 .bl-val{ font-size:.74rem; }
#oprRoot .bl.z2 .bl-dot{ width:10px; height:10px; }
#oprRoot .bl-count{ margin-left:auto; color:var(--text-muted); font-size:.72rem; }
#oprRoot .bl-legend, .as-rpt .bl-legend{ display:flex; gap:16px; font-size:.78rem; color:var(--text-dim); margin-top:10px; padding-top:9px; border-top:1px solid var(--border); flex-wrap:wrap; }
#oprRoot .bl-legend span, .as-rpt .bl-legend span{ display:inline-flex; align-items:center; gap:6px; }
#oprRoot .bl-legend i, .as-rpt .bl-legend i{ width:10px; height:10px; border-radius:3px; }
#oprRoot .bl-legend-lv{ border-top:0; padding-top:0; margin-top:8px; gap:14px; }
#oprRoot .bl-legend-foot{ border-top:0; padding-top:0; margin-top:5px; }
#oprRoot .chart-ctrls{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin:0 0 10px; }


#oprRoot .expc, .as-rpt .expc{ padding:0; }
#oprRoot .exp-row, .as-rpt .exp-row{ display:grid; grid-template-columns:56px 34px 1fr auto; align-items:center; gap:10px; padding:5px 6px; border-radius:var(--radius-sm); }
#oprRoot .exp-label, .as-rpt .exp-label{ font-family:var(--font-data); font-size:.76rem; color:var(--text-bright); font-weight:600; }
#oprRoot .exp-dte, .as-rpt .exp-dte{ font-family:var(--font-data); font-size:.7rem; color:var(--text-muted); }
#oprRoot .exp-bars, .as-rpt .exp-bars{ display:flex; flex-direction:column; gap:3px; }
#oprRoot .exp-bar, .as-rpt .exp-bar{ height:9px; border-radius:2px; min-width:1px; }
#oprRoot .exp-bar.c, .as-rpt .exp-bar.c{ background:var(--green); }
#oprRoot .exp-bar.p, .as-rpt .exp-bar.p{ background:var(--red); }
#oprRoot .exp-vals, .as-rpt .exp-vals{ font-family:var(--font-data); font-size:.72rem; white-space:nowrap; text-align:right; }
#oprRoot .exp-vals .c, .as-rpt .exp-vals .c{ color:var(--green); }
#oprRoot .exp-vals .p, .as-rpt .exp-vals .p{ color:var(--red); }
#oprRoot .exp-vals .sep, .as-rpt .exp-vals .sep{ color:var(--text-muted); margin:0 3px; }
#oprRoot .exp-ratio, .as-rpt .exp-ratio{ font-family:var(--font-data); font-size:.72rem; font-weight:700; width:40px; text-align:right; }
#oprRoot #expOIWrap .exp-row{ cursor:pointer; }
#oprRoot #expOIWrap .exp-row:hover{ background:var(--hover-subtle); }



#oprRoot .donut-card, .as-rpt .donut-card{ padding:0; }
#oprRoot .donut-card-head, .as-rpt .donut-card-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--border); }
#oprRoot .donut-card-title, .as-rpt .donut-card-title{ font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); }
#oprRoot .donut-card-sub, .as-rpt .donut-card-sub{ font-size:.72rem; color:var(--text-faint); }
#oprRoot .donut-wrap, .as-rpt .donut-wrap{ position:relative; height:180px; }
#oprRoot .donut-center, .as-rpt .donut-center{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; }
#oprRoot .donut-val, .as-rpt .donut-val{ font-family:var(--font-ui); font-size:1.9rem; font-weight:700; line-height:1; }
#oprRoot .donut-cap, .as-rpt .donut-cap{ font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); margin-top:5px; }
#oprRoot .donut-legend, .as-rpt .donut-legend{ display:flex; flex-direction:column; gap:5px; margin-top:6px; }
#oprRoot .donut-li, .as-rpt .donut-li{ display:flex; align-items:center; gap:7px; font-size:.82rem; }
#oprRoot .donut-li .d, .as-rpt .donut-li .d{ width:9px; height:9px; border-radius:3px; }
#oprRoot .donut-li .nm, .as-rpt .donut-li .nm{ color:var(--text-dim); flex:1; }
#oprRoot .donut-li .vv, .as-rpt .donut-li .vv{ font-family:var(--font-ui); font-weight:700; color:var(--text-bright); }
#oprRoot .donut-mini-insight, .as-rpt .donut-mini-insight{ font-size:.85rem; color:var(--text-muted); line-height:1.55; margin-top:12px; }
#oprRoot .split-oi{ display:grid; grid-template-columns:300px minmax(0,1fr); gap:22px; align-items:start; }
#oprRoot .split-oi .split-side{ position:sticky; top:78px; }

#oprRoot .split-oi .donut-card-head{ display:none; }
#oprRoot .split-oi .split-main{ min-width:0; }
@media (max-width:1080px){ #oprRoot .split-oi{ grid-template-columns:1fr; gap:14px; } #oprRoot .split-oi .split-side{ position:static; max-width:440px; } }
#oprRoot .pc-seg{ margin-left:auto; }


#oprRoot .tbl-wrap, .as-rpt .tbl-wrap{ overflow-x:auto; }
#oprRoot table.dtl, .as-rpt table.dtl{ width:100%; border-collapse:collapse; font-family:var(--font-tbl); font-size:.82rem; }
#oprRoot table.dtl thead th, .as-rpt table.dtl thead th{
  padding:5px 7px; font-size:.82rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:var(--text-muted); border-bottom:1px solid var(--border); white-space:nowrap; text-align:right;
}
#oprRoot table.dtl tbody td, .as-rpt table.dtl tbody td{ padding:4px 7px; border-bottom:1px solid var(--divider-soft); white-space:nowrap; text-align:right; color:var(--text); }
#oprRoot table.dtl tbody tr:hover, .as-rpt table.dtl tbody tr:hover{ background:var(--hover-subtle); }
#oprRoot .th-call{ text-align:center; color:var(--text-bright); background:var(--green-strong); border-bottom:2px solid var(--green)!important; }
#oprRoot .th-put{ text-align:center; color:var(--text-bright); background:var(--red-strong); border-bottom:2px solid var(--red)!important; }
#oprRoot .th-strike{ text-align:center; color:var(--text); width:65px; }
#oprRoot .td-strike{
  text-align:center; font-weight:700; color:var(--text-bright); background:var(--surface-raised);
  border-left:2px solid var(--border-hi); border-right:2px solid var(--border-hi);
}
#oprRoot .td-itm{ background:var(--surface-veil); }
#oprRoot .tr-cur td{ border-top:1px solid var(--blue); border-bottom:1px solid var(--blue); }
#oprRoot .tr-cur .td-strike, .as-rpt .tr-cur .td-strike{ color:var(--blue)!important; background:var(--blue-med)!important; border-left-color:var(--blue)!important; border-right-color:var(--blue)!important; }
#oprRoot .ua-c, .as-rpt .ua-c{ color:var(--green); font-weight:600; }
#oprRoot .ua-p, .as-rpt .ua-p{ color:var(--red); font-weight:600; }
#oprRoot .ua-ratio{ color:var(--amber); font-weight:700; }
#oprRoot td.lft,#oprRoot th.lft,.as-rpt td.lft,.as-rpt th.lft{ text-align:left; }
#oprRoot .card{ background:var(--surface-veil); border:1px solid var(--border); border-radius:var(--radius-md); padding:16px 18px; margin:14px 0; font-size:.93rem; line-height:1.6; }
#oprRoot .ws-stub{ margin-top:8px; padding:26px; text-align:center; border:1px dashed var(--border-hi); border-radius:var(--radius-md); color:var(--text-dim); font-size:.95rem; }


#oprRoot .fig-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:stretch; margin:18px 0 6px; }
#oprRoot .fig-row .ws-chart-card{ margin:0; min-width:0; display:flex; flex-direction:column; }
#oprRoot .fig-row .ws-chart-card .ws-chart-body{ flex:1; }
@media(max-width:1180px){ #oprRoot .fig-row{ grid-template-columns:1fr; } }


#oprRoot .help-term{ color:var(--purple); font-weight:600; cursor:pointer; border-bottom:1px dashed color-mix(in srgb, var(--purple) 65%, transparent); border-radius:3px; padding:0 2px; margin:0 -2px; transition:background var(--ease); }
#oprRoot .help-term:hover{ background:color-mix(in srgb, var(--purple) 16%, transparent); border-bottom-style:solid; }


#oprHelpDrawer{
  position:fixed; top:0; right:0; height:100%; width:var(--ws-help-w); z-index:100003;
  background:var(--panel); border-left:1px solid var(--border); box-shadow:-8px 0 24px rgba(0,0,0,.18);
  display:flex; flex-direction:column; font-family:var(--font-ui);
  transform:translateX(100%); transition:transform .28s var(--ease);
}
#oprHelpDrawer.open{ transform:translateX(0); }
#oprHelpDrawer .ws-help-head{ display:flex; align-items:flex-start; gap:11px; padding:16px 16px 14px; border-bottom:1px solid var(--border); }
#oprHelpDrawer .ws-help-head-text{ min-width:0; flex:1; }
#oprHelpDrawer .ws-help-kicker{ display:flex; align-items:center; gap:7px; font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--purple); margin-bottom:5px; }
#oprHelpDrawer .ws-help-title{ font-size:1.08rem; font-weight:700; color:var(--text-bright); line-height:1.2; }
#oprHelpDrawer .ws-help-sub{ font-size:.85rem; color:var(--text-dim); margin-top:3px; line-height:1.35; }
#oprHelpDrawer .ws-help-close{ flex:0 0 auto; width:28px; height:28px; font-size:1.3rem; line-height:1; border:none; background:transparent; color:var(--text-dim); border-radius:var(--radius-sm); cursor:pointer; }
#oprHelpDrawer .ws-help-close:hover{ background:var(--hover-medium); color:var(--text-bright); }
#oprHelpDrawer .ws-help-body{ flex:1; overflow-y:auto; padding:18px 18px 30px; }
#oprHelpDrawer .ws-help-section{ margin-bottom:18px; }

#oprHelpDrawer .ws-help-chap{ margin-bottom:6px; }
#oprHelpDrawer .ws-help-chap>summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; gap:7px;
  padding:7px 0; font-size:.74rem; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--text-muted);
}
#oprHelpDrawer .ws-help-chap>summary::-webkit-details-marker{ display:none; }
#oprHelpDrawer .ws-help-chap>summary::before{
  content:'\203A'; font-size:1.05rem; line-height:1; color:var(--text-faint);
  transition:transform var(--ease);
}
#oprHelpDrawer .ws-help-chap[open]>summary::before{ transform:rotate(90deg); }
#oprHelpDrawer .ws-help-chap>summary:hover{ color:var(--text-bright); }
#oprHelpDrawer .ws-help-chap-body{ padding-top:6px; border-top:1px solid var(--border); margin-bottom:14px; }
#oprHelpDrawer .ws-help-chap-body .ws-help-section:last-child{ margin-bottom:0; }
#oprHelpDrawer .ws-help-section:last-child{ margin-bottom:0; }
#oprHelpDrawer .ws-help-label{ display:block; font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--purple); margin-bottom:6px; }
#oprHelpDrawer .ws-help-body .stm-ins-prose{ font-size:.96rem; line-height:1.58; color:var(--text); }

#oprHelpDrawer .ws-help-block{
  margin-top:16px; padding:12px 13px; border-radius:var(--radius-md);
  border:1px solid transparent; opacity:.5;
  transition:opacity var(--ease), background var(--ease), border-color var(--ease);
}
#oprHelpDrawer .ws-help-block.active{
  opacity:1; background:var(--surface-veil);
  border-color:color-mix(in srgb, var(--purple) 35%, transparent);
}
#oprHelpDrawer .ws-help-block-title{
  font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--text-muted); margin-bottom:8px;
}
#oprHelpDrawer .ws-help-block.active .ws-help-block-title{ color:var(--purple); }
#oprHelpDrawer .ws-help-block .stm-ins-prose{ font-size:.92rem; line-height:1.55; }
#oprHelpDrawer .ws-help-block-read{ margin-top:8px; color:var(--text-dim); }

#oprHelpDrawer .ws-help-def{ margin:12px 0 0; }
#oprHelpDrawer .ws-help-def dt{
  display:flex; align-items:center; gap:8px; margin-top:15px;
  font-size:.88rem; font-weight:700; color:var(--text-bright);
}
#oprHelpDrawer .ws-help-def dt::before{
  content:''; flex:0 0 8px; width:8px; height:8px;
  transform:rotate(45deg); border-radius:1.5px; background:var(--text-muted);
}
#oprHelpDrawer .ws-help-def dt.d-cw::before{ background:var(--green); }
#oprHelpDrawer .ws-help-def dt.d-pw::before{ background:var(--red); }
#oprHelpDrawer .ws-help-def dt.d-mp::before{ background:var(--amber); }
#oprHelpDrawer .ws-help-def dt.d-flip::before{ background:var(--purple); }
#oprHelpDrawer .ws-help-def dt.d-mag::before{ background:transparent; box-shadow:inset 0 0 0 2px var(--purple); }
#oprHelpDrawer .ws-help-def dt.d-spot::before{ background:var(--blue); }

#oprHelpDrawer .ws-help-def dt .help-term{ color:inherit; font-weight:inherit; padding:0; margin:0;
  border-bottom-color:color-mix(in srgb, var(--text-dim) 70%, transparent); }
#oprHelpDrawer .ws-help-def dt .help-term:hover{ background:color-mix(in srgb, var(--text-bright) 12%, transparent); }
#oprHelpDrawer .ws-help-def dd{ margin:5px 0 0 16px; font-size:.9rem; line-height:1.55; color:var(--text-dim); }
#oprHelpDrawer .ws-help-def dd b{ color:var(--text); font-weight:600; }
#oprHelpDrawer .ws-help-def dd i{ color:var(--text); font-style:normal; font-weight:600; }
#oprHelpDrawer .help-term-demo{ color:var(--purple); font-weight:600; border-bottom:1px dashed color-mix(in srgb, var(--purple) 65%, transparent); }


.highcharts-tooltip-container:has(.opr-hc){ z-index:100010 !important; }
.highcharts-tooltip-container .highcharts-tooltip.opr-hc>span{ font-family:var(--font-ui); }

#oprRoot .donut-center, .as-rpt .donut-center{ z-index:0; }
#oprHelpDrawer .ws-help-block.active .ws-help-block-read{ color:var(--text); }
#oprHelpDrawer .ws-help-body .stm-ins-prose b{ color:var(--text-bright); }
#oprHelpDrawer .ws-help-foot{ border-top:1px solid var(--border); padding:10px 16px; font-size:.76rem; color:var(--text-muted); display:flex; align-items:center; gap:8px; }
#oprHelpDrawer .ws-help-auto{ display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
#oprHelpDrawer .ws-help-auto input{ accent-color:var(--purple); cursor:pointer; margin:0; }
#oprHelpDrawer .ws-help-collapse{
  position:absolute; left:-16px; top:50%; transform:translateY(-50%);
  width:28px; height:52px; border:1px solid var(--border); border-right:none;
  border-radius:9px 0 0 9px; background:var(--panel); color:var(--text-dim);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; font-weight:700; line-height:1; box-shadow:-4px 0 12px rgba(0,0,0,.12);
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease), color var(--ease), background var(--ease);
}
#oprHelpDrawer .ws-help-collapse:hover{ color:var(--text-bright); background:var(--hover-medium); }
body.opr-scrolled #oprHelpDrawer.open .ws-help-collapse{ opacity:1; pointer-events:auto; }

#oprHelpReopen{
  position:fixed; right:0; top:50%; transform:translateY(-50%); z-index:100002;
  width:26px; height:56px; border:1px solid var(--border); border-right:none;
  border-radius:10px 0 0 10px; background:var(--panel); color:var(--text-dim);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; font-weight:700; line-height:1; box-shadow:-4px 0 12px rgba(0,0,0,.14);
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease), color var(--ease), background var(--ease);
}
#oprHelpReopen:hover{ color:var(--text-bright); background:var(--hover-medium); }
body.opr-help-closed #oprHelpReopen{ opacity:1; pointer-events:auto; }

@media(max-width:1200px){
  body.opr-help-open #oprRoot .ws-frame{ padding-right:0; }
}
@media(max-width:920px){
  #oprRoot .ws-nav{ display:none; }
  #oprRoot .ws-page{ padding:16px 14px 60px; }
  #oprHelpDrawer{ width:100vw; }
  #oprRoot .tiles{ grid-template-columns:repeat(2,1fr); }
}


.opr-overlay{
  position:fixed; inset:0; z-index:100000;
  background:var(--bg); display:none;
}
.opr-overlay.open{ display:block; }
#oprRoot{
  position:absolute; inset:0;
  font-family:var(--font-ui); color:var(--text); background:var(--bg);
  font-size:16px; line-height:1.5;
}

body:not(.opr-open) #oprHelpDrawer,
body:not(.opr-open) #oprHelpReopen{ display:none; }


#oprRoot .tb-symbol{
  font-family:var(--font-ui); font-size:.95rem; font-weight:700;
  color:var(--text-bright); display:flex; align-items:center; gap:8px;
}
#oprRoot .tb-proxy{
  font-size:.76rem; font-weight:600; color:var(--text-muted);
  border:1px solid var(--border); border-radius:999px; padding:2px 8px;
}
#oprRoot .tb-plot-btn{
  font-family:var(--font-ui); font-size:.8rem; font-weight:600;
  color:var(--text-dim); background:transparent;
  border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:5px 11px; cursor:pointer; white-space:nowrap;
  transition:background var(--ease), color var(--ease), border-color var(--ease);
}
#oprRoot .tb-plot-btn:hover{ background:var(--hover-medium); color:var(--text-bright); }
#oprRoot .tb-plot-btn.active{
  background:var(--blue-dim); border-color:var(--blue); color:var(--blue);
}


#oprRoot .opr-slot:empty{ margin:0; }


.tb-opt-btn {
  display: flex; align-items: center; gap: 5px;
  padding: 5px 8px; border: none; background: none;
  color: var(--text-dim); border-radius: var(--radius-sm);
  cursor: pointer; font-family: var(--font-ui);
  font-size: .92rem; font-weight: 450;
  transition: background var(--ease), color var(--ease);
}
.tb-opt-btn:hover { background: var(--surface-raised); color: var(--text); }
.tb-opt-btn svg {
  width: 16px; height: 16px; stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}


#oprClose{
  position:static; margin:0 0 0 4px; box-shadow:none;
  font-size:.86rem; padding:6px 12px 6px 10px;
}


#oprRoot .ws-ov-titlerow .stm-ai-header{
  flex:1; min-width:0;
  padding:14px 18px;
  border:1px solid rgba(167,139,250,.22);
  border-radius:var(--radius-md);
}
#oprRoot .stm-ai-header::after{ display:none; }
#oprRoot .stm-ai-title{ font-size:1.05rem; letter-spacing:.1em; white-space:normal; }
#oprRoot .stm-ai-sub{ font-size:.86rem; white-space:normal; }
#oprRoot .stm-ai-text{ min-width:0; }


#oprRoot .rpt-loading-section{ padding:8px 0 4px; }
#oprRoot .rpt-loading-section .aiTt-wrap{ min-height:0; padding:10px 8px; gap:10px; }


.as-rpt .ins-wide{ columns:1; }


:root[data-theme="light"] #oprRoot .ws-chart-card,
:root[data-theme="light"] #oprRoot .tile,
:root[data-theme="light"] #oprRoot .card{
  background:var(--card);
  box-shadow:0 1px 3px rgba(0, 0, 0, .06),
             0 1px 2px rgba(0, 0, 0, .03);
}


#oprRoot .ws-topbar .ws-range-ctrls{
  position:static; z-index:auto; margin:0; padding:0; min-width:0;
  background:none; border:none; border-radius:0; box-shadow:none;
  gap:10px; flex-wrap:nowrap;
}
#oprRoot .ws-topbar .ws-ctrl-label{ white-space:nowrap; }
#oprRoot .ws-topbar .ws-ctrl-note{ margin-left:6px; white-space:nowrap; }




.dl-overlay {
  position: fixed;
  inset: 0;
  z-index: 9200;
  display: none;
  align-items: center;
  justify-content: center;
  background: var(--overlay-bg);
  backdrop-filter: blur(var(--overlay-blur));
  font-family: var(--font-ui);
}
.dl-overlay.open { display: flex; }


.dl-panel {
  width: min(900px, 96vw);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg);
  box-shadow: var(--overlay-shadow);
  color: var(--text);
  overflow: hidden;
}


.dl-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 18px 22px 16px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--surface-veil) 0%, transparent 100%);
}
.dl-head-info { display: flex; align-items: center; gap: 12px; }
.dl-head-icon {
  width: 34px; height: 34px;
  background: var(--blue-dim);
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; color: var(--blue); flex-shrink: 0;
}
.dl-title { font-size: 1.05rem; font-weight: 700; color: var(--text-bright); }
.dl-sub { font-size: 0.82rem; color: var(--text-dim); margin-top: 2px; }


.dl-close {
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border: none; background: transparent; color: var(--text-dim);
  font-size: 1.2rem; border-radius: var(--radius-sm); cursor: pointer;
  transition: background var(--ease), color var(--ease); flex-shrink: 0;
}
.dl-close:hover { background: var(--hover-medium); color: var(--text-bright); }


.dl-body { padding: 20px 22px 4px; overflow-y: auto; flex: 1; }
.dl-body::-webkit-scrollbar { width: 5px; }
.dl-body::-webkit-scrollbar-thumb { background: var(--border-hi); border-radius: 2px; }

.dl-section { margin-bottom: 22px; }
.dl-label {
  font-size: 0.76rem; font-weight: 700; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 10px;
}
.dl-top-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }


.dl-empty-notice {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; background: var(--amber-dim);
  border: 1px solid rgba(255, 184, 51, .2); border-radius: var(--radius-sm);
  font-size: 0.90rem; color: var(--amber); margin-bottom: 18px; line-height: 1.45;
}
.dl-empty-icon { font-size: 1rem; flex-shrink: 0; margin-top: 1px; }


.dl-input {
  width: 100%; padding: 9px 12px;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-sm); color: var(--text-bright);
  font-family: var(--font-ui); font-size: 0.95rem; color-scheme: dark;
  transition: border-color var(--ease), box-shadow var(--ease); box-sizing: border-box;
}
.dl-input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 2px var(--blue-dim); }
.dl-input:disabled { opacity: 0.4; cursor: not-allowed; }


.dl-dates-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: end; }
.dl-date-field { display: flex; flex-direction: column; gap: 5px; }
.dl-date-lbl { font-size: 0.82rem; color: var(--text-muted); font-weight: 600; letter-spacing: .03em; }


.dl-slider-wrap { display: flex; flex-direction: column; gap: 6px; user-select: none; }
.dl-slider-labels { display: flex; justify-content: space-between; padding: 0 2px; }
.dl-slider-lbl-val { font-size: 0.92rem; font-weight: 700; color: var(--blue); min-width: 40px; }
.dl-slider-labels .dl-slider-lbl-val:last-child { text-align: right; }
.dl-slider-track-wrap { position: relative; height: 24px; display: flex; align-items: center; }
.dl-slider-rail { position: absolute; left: 0; right: 0; height: 4px; background: var(--border-hi); border-radius: 2px; pointer-events: none; z-index: 0; }
.dl-slider-fill { position: absolute; height: 4px; background: var(--blue); border-radius: 2px; pointer-events: none; z-index: 1; }
.dl-range {
  position: absolute; left: 0; right: 0; width: 100%; height: 4px;
  background: transparent; -webkit-appearance: none; appearance: none;
  outline: none; border: none; pointer-events: none; z-index: 2; margin: 0;
}

#dlSliderFrom { z-index: 3; }
.dl-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--blue); border: 2px solid var(--panel); cursor: pointer;
  pointer-events: all; transition: background var(--ease), transform var(--ease);
  box-shadow: 0 1px 4px rgba(0, 0, 0, .4);
}
.dl-range::-webkit-slider-thumb:hover { background: var(--blue-hover); transform: scale(1.15); }
.dl-range::-moz-range-thumb {
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--blue); border: 2px solid var(--panel); cursor: pointer;
  pointer-events: all; transition: background var(--ease), transform var(--ease);
  box-shadow: 0 1px 4px rgba(0, 0, 0, .4);
}
.dl-range::-moz-range-thumb:hover { background: var(--blue-hover); transform: scale(1.15); }
.dl-range:disabled::-webkit-slider-thumb { opacity: 0.35; cursor: not-allowed; }
.dl-range:disabled::-moz-range-thumb { opacity: 0.35; cursor: not-allowed; }
.dl-range::-moz-range-track { background: transparent; }
.dl-slider-bounds { display: flex; justify-content: space-between; padding: 0 2px; margin-top: 2px; }
.dl-slider-bound-lbl { font-size: 0.82rem; color: var(--text-muted); }


.dl-mixed {
  display: flex; gap: 12px; padding: 13px 15px;
  background: var(--amber-dim); border: 1px solid rgba(255, 184, 51, .22);
  border-radius: var(--radius-md); align-items: flex-start;
}
.dl-mixed-ic { font-size: 1.05rem; color: var(--amber); flex-shrink: 0; margin-top: 1px; }
.dl-mixed-body { flex: 1; }
.dl-mixed-title { font-size: 0.92rem; font-weight: 700; color: var(--amber); margin-bottom: 3px; }
.dl-mixed-txt { font-size: 0.86rem; color: var(--text-soft); line-height: 1.5; }
.dl-mixed-txt b { color: var(--text-bright); }
.dl-mixed-toggle { display: flex; align-items: center; gap: 9px; margin-top: 11px; cursor: pointer; user-select: none; }
.dl-sw { width: 38px; height: 21px; border-radius: 11px; background: var(--border-hi); position: relative; transition: background var(--ease); flex-shrink: 0; }
.dl-sw::after { content: ''; position: absolute; width: 15px; height: 15px; border-radius: 50%; background: #fff; top: 3px; left: 3px; transition: left var(--ease); }
.dl-mixed-toggle.on .dl-sw { background: var(--amber); }
.dl-mixed-toggle.on .dl-sw::after { left: 20px; }
.dl-sw-lbl { font-size: 0.88rem; font-weight: 600; color: var(--text-bright); }


.dl-mixed-info { background: var(--blue-dim); border-color: rgba(77, 166, 255, .25); }
.dl-mixed-info .dl-mixed-ic, .dl-mixed-info .dl-mixed-title { color: var(--blue); }


.dl-mixed-lock { background: var(--red-subtle); border-color: var(--red-strong); }
.dl-mixed-lock .dl-mixed-ic, .dl-mixed-lock .dl-mixed-title { color: var(--red); }


.dl-terms-overlay {
  position: absolute; inset: 0; z-index: 9400;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, .58); backdrop-filter: blur(2px);
}
.dl-terms-card {
  width: min(560px, 92vw); max-height: 86vh; overflow-y: auto;
  background: var(--panel); border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg); box-shadow: 0 18px 50px rgba(0, 0, 0, .6);
  padding: 24px; color: var(--text); font-family: var(--font-ui);
}
.dl-terms-title {
  display: flex; align-items: center; gap: 9px;
  font-size: 1.05rem; font-weight: 700; color: var(--text-bright);
  margin-bottom: 14px;
}
.dl-terms-txt { font-size: 0.89rem; color: var(--text-soft); line-height: 1.6; margin-bottom: 12px; }
.dl-terms-txt b { color: var(--text-bright); }
.dl-terms-err { font-size: 0.84rem; color: var(--red); min-height: 1.2em; margin-top: 4px; }
.dl-terms-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; }
.dl-terms-accept {
  display: flex; align-items: center; gap: 8px; padding: 11px 18px; border: none; cursor: pointer;
  background: var(--blue); color: #fff; font-family: var(--font-ui); font-size: 0.95rem; font-weight: 600;
  border-radius: var(--radius-md); transition: background var(--ease);
}
.dl-terms-accept:hover { background: var(--blue-hover); }


.dl-mixed-plain { background: var(--panel); border-color: var(--border); }
.dl-mixed-plain .dl-mixed-ic { color: var(--text-dim); }
.dl-mixed-plain .dl-mixed-title { color: var(--text-bright); }


.dl-cprt-faq { margin-top: 2px; }
.dl-cprt-q {
  display: inline-flex; align-items: center; gap: 8px;
  background: none; border: none; padding: 4px 0; cursor: pointer;
  font-family: inherit; font-size: 0.87rem; font-weight: 600;
  color: var(--text-muted); transition: color var(--ease);
}
.dl-cprt-q:hover { color: var(--text-bright); }
.dl-cprt-qmark {
  width: 18px; height: 18px; border-radius: 50%; flex-shrink: 0;
  border: 1px solid var(--border-hi);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.72rem; font-weight: 700;
}
.dl-cprt-q .dl-chev { font-size: 0.7rem; transition: transform var(--ease); }
.dl-cprt-q.open .dl-chev { transform: rotate(180deg); }
.dl-cprt-a { display: none; margin-top: 8px; }
.dl-cprt-a.open { display: block; }


.dl-label-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dl-daymode { text-transform: none; letter-spacing: 0; }

.dl-va-hint { font-size: 0.8rem; color: var(--text-muted); margin-bottom: 8px; line-height: 1.5; }
.dl-va-hint b { color: var(--text-soft); }
.dl-arrow-hint { color: var(--blue); }

.dl-sheet-wrap { border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; background: var(--card); }
.dl-sheet { border-collapse: collapse; width: 100%; font-size: 0.82rem; table-layout: fixed; }
.dl-sheet th, .dl-sheet td {
  padding: 7px 9px; text-align: right;
  border-bottom: 1px solid var(--border); border-right: 1px solid var(--border);
  font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dl-sheet th:last-child, .dl-sheet td:last-child { border-right: none; }
.dl-sheet td:first-child, .dl-sheet th:first-child { text-align: left; color: var(--text-soft); }
.dl-sheet tbody tr:last-child td { border-bottom: none; }
.dl-sheet tbody tr:nth-child(even) td { background: rgba(255, 255, 255, .015); }
.dl-sheet-empty { text-align: center !important; color: var(--text-muted); padding: 22px !important; }
.dl-col-off { opacity: 0.26; text-decoration: line-through; text-decoration-color: var(--text-muted); }

.dl-sheet th {
  position: relative; background: var(--panel); cursor: pointer; user-select: none;
  transition: background var(--ease);
}
.dl-sheet th:hover { background: var(--toolbar-active); }
.dl-th-inner { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.dl-sheet th:first-child .dl-th-inner { justify-content: flex-start; }
.dl-th-chk { width: 12px; height: 12px; accent-color: var(--blue); pointer-events: none; flex-shrink: 0; }
.dl-th-name { font-weight: 700; color: var(--text-bright); letter-spacing: .01em; }
.dl-sheet th.off .dl-th-name { color: var(--text-muted); text-decoration: line-through; }
.dl-sheet th.off .dl-th-chk { opacity: 0.4; }
.dl-sort-arrow { color: var(--blue); font-size: 0.9rem; padding: 0 1px; }

.dl-sheet-foot {
  padding: 7px 12px; font-size: 0.78rem; color: var(--text-muted);
  border-top: 1px solid var(--border); background: var(--surface-veil);
  display: flex; justify-content: space-between; align-items: center;
}
.dl-sheet-foot b { color: var(--text-bright); }


.dl-foot {
  padding: 14px 22px; border-top: 1px solid var(--border);
  display: flex; align-items: center; gap: 12px; flex-shrink: 0; position: relative;
}
.dl-info {
  flex: 1; font-size: 0.86rem; color: var(--text-dim); min-height: 1.1em;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.dl-info b { color: var(--text-bright); font-weight: 600; }
.dl-info .dl-sep { color: var(--border-hi); }
.dl-info.ok { color: var(--green); } .dl-info.ok b { color: var(--green); }
.dl-info.err { color: var(--red); } .dl-info.err b { color: var(--red); }
.dl-info-locked { color: var(--amber); font-weight: 600; }


.dl-ghost {
  display: flex; align-items: center; gap: 7px; padding: 10px 15px;
  border: 1px solid var(--border); border-radius: var(--radius-md);
  background: var(--card); color: var(--text-soft);
  font-family: var(--font-ui); font-size: 0.9rem; font-weight: 600; cursor: pointer;
  transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.dl-ghost:hover { background: var(--hover-subtle); color: var(--text-bright); border-color: var(--border-hi); }
.dl-ghost.active { border-color: var(--blue); color: var(--blue); }
.dl-chev { font-size: 0.7rem; transition: transform var(--ease); }
.dl-ghost.active .dl-chev { transform: rotate(180deg); }


.dl-split { display: flex; align-items: stretch; }
.dl-split .dl-main {
  display: flex; align-items: center; gap: 8px; padding: 11px 18px; border: none; cursor: pointer;
  background: var(--blue); color: #fff; font-family: var(--font-ui); font-size: 0.98rem; font-weight: 600;
  border-radius: var(--radius-md) 0 0 var(--radius-md); transition: background var(--ease);
}
.dl-split .dl-caret {
  display: flex; align-items: center; padding: 0 13px; border: none; cursor: pointer;
  background: var(--blue); color: #fff; border-left: 1px solid rgba(255, 255, 255, .22);
  border-radius: 0 var(--radius-md) var(--radius-md) 0; font-size: 0.7rem; transition: background var(--ease);
}
.dl-split .dl-main:hover:not(:disabled), .dl-split .dl-caret:hover:not(:disabled) { background: var(--blue-hover); }
.dl-split .dl-main:disabled, .dl-split .dl-caret:disabled { opacity: .4; cursor: default; }


.dl-scrim { position: absolute; inset: 0; z-index: 40; display: none; }
.dl-scrim.show { display: block; }


.dl-pop {
  position: absolute; bottom: calc(100% + 8px);
  background: var(--panel); border: 1px solid var(--border-hi);
  border-radius: var(--radius-md); box-shadow: 0 10px 34px rgba(0, 0, 0, .6);
  padding: 8px; z-index: 50; display: none;
}
.dl-pop.open { display: block; animation: dlPopIn .14s ease; }
@keyframes dlPopIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }


.dl-fmt-menu { right: 22px; width: 320px; padding: 6px; }
.dl-fmt-item { display: flex; align-items: center; gap: 12px; padding: 10px 11px; border-radius: var(--radius-sm); cursor: pointer; transition: background var(--ease); }
.dl-fmt-item:hover { background: var(--hover-medium); }
.dl-fmt-ic {
  width: 38px; height: 38px; flex-shrink: 0; border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.72rem; font-weight: 800; letter-spacing: .02em;
}
.dl-ic-csv { background: rgba(38, 217, 127, .14); color: var(--green); }
.dl-ic-json { background: rgba(167, 139, 250, .16); color: var(--purple); }
.dl-ic-txt { background: rgba(138, 144, 171, .16); color: var(--text-dim); }
.dl-ic-xls { background: rgba(38, 217, 127, .12); color: #1e9e63; border: 1px solid rgba(38, 217, 127, .3); }
.dl-fmt-meta { flex: 1; min-width: 0; }
.dl-fmt-name { font-size: 0.94rem; font-weight: 600; color: var(--text-bright); }
.dl-fmt-desc { font-size: 0.78rem; color: var(--text-muted); margin-top: 1px; }
.dl-fmt-ext {
  font-family: var(--font-data); font-size: 0.74rem; color: var(--text-dim);
  background: var(--card); border: 1px solid var(--border); border-radius: 4px; padding: 2px 6px;
}
.dl-fmt-sep { height: 1px; background: var(--border); margin: 5px 8px; }


.dl-adv-pop { right: 22px; width: 340px; padding: 14px; }
.dl-adv-row { margin-bottom: 14px; }
.dl-adv-row:last-child { margin-bottom: 0; }
.dl-adv-lbl {
  font-size: 0.78rem; font-weight: 700; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .05em; margin-bottom: 7px;
  display: flex; justify-content: space-between; align-items: center;
}
.dl-adv-note { font-size: 0.72rem; color: var(--text-faint); text-transform: none; letter-spacing: 0; font-weight: 500; }

.dl-seg { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; }
.dl-seg button {
  border: none; background: var(--card); color: var(--text-dim);
  padding: 7px 12px; font-family: var(--font-ui); font-size: 0.83rem; font-weight: 600;
  cursor: pointer; transition: background var(--ease), color var(--ease);
}
.dl-seg button + button { border-left: 1px solid var(--border); }
.dl-seg button.active { background: var(--blue-dim); color: var(--blue); }


@media (max-width: 720px) {
  .dl-top-grid { grid-template-columns: 1fr; gap: 18px; }
  .dl-foot { flex-wrap: wrap; }
  .dl-info { flex-basis: 100%; order: -1; margin-bottom: 4px; }
}


.dl-dlg-overlay {
  position: absolute;
  inset: 0;
  z-index: 9300;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .58);
  backdrop-filter: blur(2px);
}
.dl-dlg {
  width: min(420px, 92vw);
  background: var(--panel);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .6);
  padding: 22px 22px 18px;
  color: var(--text);
  font-family: var(--font-ui);
}
.dl-dlg-head { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.dl-dlg-title { font-size: 1.02rem; font-weight: 700; color: var(--text-bright); }
.dl-dlg-sub { font-size: 0.82rem; color: var(--text-dim); margin-top: 2px; }


.dl-dlg-spin {
  width: 30px; height: 30px; flex-shrink: 0; border-radius: 50%;
  border: 3px solid var(--border-hi); border-top-color: var(--blue);
  animation: dlDlgSpin .8s linear infinite;
}
@keyframes dlDlgSpin { to { transform: rotate(360deg); } }
.dl-dlg-spin.done {
  border-color: var(--green); animation: none; position: relative;
}
.dl-dlg-spin.done::after {
  content: '✓'; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--green); font-size: 1rem; font-weight: 700;
}
.dl-dlg-spin.err {
  border-color: var(--red); animation: none; position: relative;
}
.dl-dlg-spin.err::after {
  content: '✕'; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--red); font-size: 1rem; font-weight: 700;
}


.dl-dlg-bar {
  height: 8px; border-radius: 4px; background: var(--border-hi);
  overflow: hidden; margin-bottom: 6px;
}
.dl-dlg-fill {
  height: 100%; width: 0%; background: var(--blue); border-radius: 4px;
  transition: width .35s ease;
}
.dl-dlg-pct {
  font-size: 0.8rem; font-weight: 700; color: var(--blue);
  text-align: right; margin-bottom: 12px;
  font-variant-numeric: tabular-nums;
}

.dl-dlg-status {
  font-size: 0.86rem; color: var(--text-soft); line-height: 1.5;
  min-height: 2.4em; margin-bottom: 10px;
}
.dl-dlg-status.ok { color: var(--green); font-weight: 600; }
.dl-dlg-status.err { color: var(--red); font-weight: 600; }

.dl-dlg-meta {
  display: flex; justify-content: space-between;
  font-size: 0.78rem; color: var(--text-muted);
  font-variant-numeric: tabular-nums; margin-bottom: 18px;
}

.dl-dlg-actions { display: flex; justify-content: flex-end; gap: 10px; }
.dl-dlg-btn {
  padding: 9px 18px; border-radius: var(--radius-md); cursor: pointer;
  font-family: var(--font-ui); font-size: 0.9rem; font-weight: 600;
  border: 1px solid var(--border); background: var(--card); color: var(--text-soft);
  transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.dl-dlg-btn:hover { background: var(--hover-medium); color: var(--text-bright); border-color: var(--border-hi); }
.dl-dlg-cancel:hover { border-color: var(--red); color: var(--red); }
.dl-dlg-retry, .dl-dlg-close {
  background: var(--blue); color: #fff; border-color: var(--blue);
}
.dl-dlg-retry:hover, .dl-dlg-close:hover { background: var(--blue-hover); color: #fff; border-color: var(--blue-hover); }




.rsb-strip {
  width: var(--rsb-strip-w);
  min-width: var(--rsb-strip-w);
  background: var(--panel);
  border-left: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding: 6px 0;
  gap: 2px;
  z-index: 50;
  overflow: visible;
}

.rsb-icon {
  max-width: 42px; height: 38px;
  display: flex; align-items: center;
  flex-direction: row-reverse;
  gap: 0;
  background: var(--panel); border: none;
  color: var(--text-dim); cursor: pointer;
  border-radius: var(--radius-sm) 0 0 var(--radius-sm);
  transition: max-width .35s cubic-bezier(.4,0,.2,1),
              background .15s ease,
              color .15s ease,
              box-shadow .3s ease;
  position: relative;
  padding: 0 11px;
  overflow: hidden;
  white-space: nowrap;
}
.rsb-icon svg {
  width: 22px; height: 22px;
  min-width: 22px;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.rsb-icon .rsb-label {
  font: 13px/1 var(--font-ui);
  letter-spacing: .02em;
  opacity: 0;
  overflow: hidden;
  transition: opacity .2s ease .1s;
  margin-right: 8px;
  pointer-events: none;
}
.rsb-icon:hover {
  max-width: 180px;
  background: var(--panel);
  color: var(--text);
  box-shadow: -4px 0 16px var(--shadow-strong, rgba(0,0,0,.3));
  z-index: 51;
}
.rsb-icon:hover svg {
  transform: scale(1.15);
}
.rsb-icon:hover .rsb-label {
  opacity: 1;
}
.rsb-icon.active {
  color: var(--blue);
  background: var(--blue-dim);
}
.rsb-icon.active:hover {
  color: var(--blue);
  background: var(--panel);
}


.rsb-icon-ai { color: #c4b5fd; }
.rsb-icon-ai:hover { color: #e9d5ff; }
.rsb-icon-ai.active { color: #a78bfa; background: rgba(167,139,250,.14); }
.rsb-icon-ai.active:hover { color: #c4b5fd; background: var(--panel); }
.rsb-icon-ai svg { fill: currentColor !important; stroke: none !important; }
.rsb-ai-stars .rsb-ai-star-big {
  transform-origin: center; transform-box: fill-box;
  animation: rsbAiSparkle 2.4s ease-in-out infinite;
}
.rsb-ai-stars .rsb-ai-star-small {
  transform-origin: center; transform-box: fill-box;
  animation: rsbAiSparkle 2.4s ease-in-out infinite .6s;
}
@keyframes rsbAiSparkle {
  0%,100% { transform: scale(.85) rotate(-8deg); filter: drop-shadow(0 0 3px rgba(196,181,253,.55)); }
  50%     { transform: scale(1.15) rotate(8deg);  filter: drop-shadow(0 0 8px rgba(196,181,253,1)); }
}


.rsb-panel {
  width: 0;
  min-width: 0;
  overflow: hidden;
  background: var(--panel);
  border-left: 1px solid transparent;
  display: flex;
  flex-direction: column;
  position: relative;
  isolation: isolate;
  transition: width .3s ease, min-width .3s ease, border-color .3s ease;
}

.rsb-panel::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: var(--wlg-ambient);
}

.rsb-panel::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 140px;
}
:root[data-theme="light"] .rsb-panel::after { opacity: .025; mix-blend-mode: multiply; }
.rsb-panel.open {
  width: var(--rsb-panel-w);
  min-width: var(--rsb-panel-w);
  border-left: 2px solid var(--border-hi);
  box-shadow: -4px 0 12px var(--shadow-strong, rgba(0,0,0,.35));
}
.rsb-panel.resizing { transition: none !important; }


.rsb-resize {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 6px;
  cursor: ew-resize;
  z-index: 60;
  background: transparent;
  transition: background .15s ease;
}
.rsb-panel:not(.open) .rsb-resize { display: none; }
.rsb-resize:hover,
.rsb-resize.active { background: var(--blue); opacity: .6; }
body.rsb-resizing,
body.rsb-resizing * { cursor: ew-resize !important; user-select: none !important; }

.rsb-header {
  position: relative; z-index: 1;   
  height: 38px;
  padding: 0 14px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}
.rsb-title {
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-bright);
  letter-spacing: .03em;
  text-transform: uppercase;
  white-space: nowrap;
}
.rsb-close {
  background: none; border: none;
  color: var(--text-muted); cursor: pointer;
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  font-size: 1.2rem; font-weight: 700;
  transition: all var(--ease);
}
.rsb-close:hover { background: var(--hover-medium); color: var(--text-bright); }


.rsb-panel.rsb-noheader .rsb-header { display: none; }

.rsb-body {
  position: relative; z-index: 1;   
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  min-width: var(--rsb-panel-w);
  padding: 0 14px;
  
  container-type: inline-size;
  container-name: wlpane;
}
.rsb-body.rsb-body-split {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}




:root {
  --wlg-surf:  linear-gradient(158deg, rgba(255,255,255,.065) 0%, rgba(255,255,255,.018) 45%,
               rgba(255,255,255,.012) 70%, rgba(255,255,255,.04) 100%);
  --wlg-surf-hi: linear-gradient(158deg, rgba(255,255,255,.11) 0%, rgba(255,255,255,.035) 45%,
               rgba(255,255,255,.022) 70%, rgba(255,255,255,.07) 100%);
  --wlg-rim:   linear-gradient(158deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,.05) 34%,
               rgba(255,255,255,.018) 62%, rgba(255,255,255,.10) 100%);
  --wlg-rim-hi: linear-gradient(158deg, rgba(255,255,255,.50) 0%, rgba(255,255,255,.09) 34%,
               rgba(255,255,255,.035) 62%, rgba(255,255,255,.20) 100%);
  --wlg-spec:  linear-gradient(90deg, transparent, rgba(255,255,255,.60) 30%,
               rgba(255,255,255,.16) 62%, transparent);
  --wlg-spec-op: .7;
  --wlg-sh:    0 1px 2px var(--shadow-soft), 0 8px 20px -12px var(--shadow-strong);
  --wlg-sh-hi: 0 1px 2px var(--shadow-soft), 0 14px 32px -16px var(--shadow-strong);
  --wlg-tile:  linear-gradient(155deg, rgba(255,255,255,.13), rgba(255,255,255,.03));
  --wlg-tile-in: inset 0 1px 0 rgba(255,255,255,.30), inset 0 0 0 1px rgba(255,255,255,.08);
  --wlg-gloss: linear-gradient(150deg, rgba(255,255,255,.30) 0%, rgba(255,255,255,.05) 38%, transparent 55%);
  --wlg-pill:  linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.025));
  --wlg-pill-in: inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1px rgba(255,255,255,.06);
  --wlg-rule: var(--surface-border-hi);
  
  --wlg-ambient:
    radial-gradient(125% 42% at 18% 0%,   oklch(58% .24 292 / .22), transparent 70%),
    radial-gradient(115% 38% at 88% 22%,  oklch(63% .20 252 / .18), transparent 70%),
    radial-gradient(125% 45% at 40% 100%, oklch(68% .16 200 / .12), transparent 70%);
  
  --wlg-card-bg: color-mix(in srgb, var(--card) 76%, transparent);
  
  --wlg-tile-onlight: linear-gradient(155deg, #32384a, #1d2230);  
  --wlg-tile-ondark:  linear-gradient(155deg, #ffffff, #eceff5);  
  
  --wlg-r: 0px;
  --wlg-ease: cubic-bezier(.165,.84,.44,1);
  --wlg-spring: linear(0, .229 2.3%, .81 6.9%, 1.036 9.4%, 1.111 10.6%, 1.135,
                1.128 12.6%, 1.037 16%, 1.007 18%, .998, .996 22.5%, 1.001 26.6%, 1);
}


:root[data-theme="techShadows"] {
  --wlg-surf: linear-gradient(158deg, rgba(255,255,255,.075) 0%, rgba(255,255,255,.022) 42%,
              rgba(255,255,255,.012) 68%, rgba(255,255,255,.045) 100%);
  --wlg-surf-hi: linear-gradient(158deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,.04) 42%,
              rgba(255,255,255,.025) 68%, rgba(255,255,255,.075) 100%);
  --wlg-rim: linear-gradient(158deg, rgba(255,255,255,.30) 0%, rgba(255,255,255,.055) 34%,
              rgba(255,255,255,.02) 62%, rgba(255,255,255,.11) 100%);
  --wlg-rim-hi: linear-gradient(158deg, rgba(255,255,255,.52) 0%, rgba(255,255,255,.10) 34%,
              rgba(255,255,255,.04) 62%, rgba(255,255,255,.22) 100%);
  --wlg-spec: linear-gradient(90deg, transparent, rgba(255,255,255,.65) 30%,
              rgba(255,255,255,.18) 62%, transparent);
  --wlg-spec-op: .7;
  --wlg-sh:    0 1px 2px rgba(0,0,0,.35), 0 10px 26px -14px rgba(0,0,0,.85);
  --wlg-sh-hi: 0 1px 2px rgba(0,0,0,.40), 0 18px 40px -18px rgba(0,0,0,.95);
  --wlg-tile: linear-gradient(155deg, rgba(255,255,255,.14), rgba(255,255,255,.03));
  --wlg-tile-in: inset 0 1px 0 rgba(255,255,255,.34), inset 0 0 0 1px rgba(255,255,255,.08),
              0 3px 10px -3px rgba(0,0,0,.7);
  --wlg-gloss: linear-gradient(150deg, rgba(255,255,255,.34) 0%, rgba(255,255,255,.06) 38%, transparent 55%);
  --wlg-pill: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.028));
  --wlg-pill-in: inset 0 1px 0 rgba(255,255,255,.16), inset 0 0 0 1px rgba(255,255,255,.06);
  
  --wlg-ambient: none;
  --wlg-card-bg: color-mix(in srgb, var(--card) 70%, transparent);
}


:root[data-theme="goldLuxe"] {
  --wlg-surf: linear-gradient(158deg, rgba(255,242,220,.08) 0%, rgba(255,244,225,.022) 45%,
              rgba(255,255,255,.01) 70%, rgba(195,160,95,.05) 100%);
  --wlg-surf-hi: linear-gradient(158deg, rgba(255,242,220,.13) 0%, rgba(255,244,225,.04) 45%,
              rgba(255,255,255,.02) 70%, rgba(195,160,95,.09) 100%);
  --wlg-rim: linear-gradient(158deg, rgba(232,205,155,.40) 0%, rgba(195,160,95,.09) 34%,
              rgba(255,255,255,.025) 62%, rgba(195,160,95,.19) 100%);
  --wlg-rim-hi: linear-gradient(158deg, rgba(245,224,180,.70) 0%, rgba(195,160,95,.19) 34%,
              rgba(255,255,255,.05) 62%, rgba(212,177,112,.38) 100%);
  --wlg-spec: linear-gradient(90deg, transparent, rgba(248,230,190,.70) 30%,
              rgba(195,160,95,.22) 62%, transparent);
  --wlg-spec-op: .8;
  --wlg-tile: linear-gradient(155deg, rgba(255,240,214,.15), rgba(195,160,95,.045));
  --wlg-tile-in: inset 0 1px 0 rgba(250,232,196,.40), inset 0 0 0 1px rgba(195,160,95,.15);
  --wlg-gloss: linear-gradient(150deg, rgba(255,246,226,.38) 0%, rgba(255,240,214,.07) 38%, transparent 55%);
  --wlg-pill: linear-gradient(180deg, rgba(255,244,225,.10), rgba(195,160,95,.03));
  --wlg-pill-in: inset 0 1px 0 rgba(250,232,196,.18), inset 0 0 0 1px rgba(195,160,95,.11);
  
  --wlg-rule: rgba(195,160,95,.30);
  
  --wlg-ambient:
    radial-gradient(110% 30% at 18% 0%,   oklch(66% .12 78 / .09), transparent 72%),
    radial-gradient(105% 30% at 88% 22%,  oklch(56% .11 52 / .07), transparent 72%),
    radial-gradient(125% 45% at 40% 100%, oklch(48% .08 32 / .12), transparent 70%);
  --wlg-card-bg: color-mix(in srgb, var(--card) 74%, transparent);
}


:root[data-theme="light"] {
  --wlg-cel: 116, 174, 226;
  --wlg-cel-dp: 74, 146, 212;
  --wlg-surf: linear-gradient(158deg, #ffffff 0%, #fdfeff 52%, #f1f7fe 100%);
  --wlg-surf-hi: linear-gradient(158deg, #ffffff 0%, #fbfdff 52%, #e9f3fd 100%);
  --wlg-rim: linear-gradient(158deg, rgba(var(--wlg-cel), .58) 0%, rgba(var(--wlg-cel), .17) 34%,
              rgba(15,23,42,.08) 62%, rgba(var(--wlg-cel), .44) 100%);
  --wlg-rim-hi: linear-gradient(158deg, rgba(var(--wlg-cel-dp), .90) 0%, rgba(var(--wlg-cel), .36) 34%,
              rgba(15,23,42,.10) 62%, rgba(var(--wlg-cel), .72) 100%);
  --wlg-spec: linear-gradient(90deg, transparent, rgba(var(--wlg-cel-dp), .75) 28%,
              rgba(var(--wlg-cel), .24) 62%, transparent);
  --wlg-spec-op: .85;
  --wlg-sh:    0 1px 1px rgba(28,58,96,.05), 0 4px 12px -6px rgba(28,58,96,.20);
  --wlg-sh-hi: 0 1px 2px rgba(28,58,96,.08), 0 14px 30px -14px rgba(34,72,120,.30);
  --wlg-tile: linear-gradient(155deg, #ffffff, #eef6fd);
  --wlg-tile-in: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(var(--wlg-cel), .32);
  --wlg-gloss: linear-gradient(150deg, rgba(255,255,255,.85) 0%, rgba(238,247,255,.28) 34%, transparent 52%);
  --wlg-pill: linear-gradient(180deg, #ffffff, #f3f9fe);
  --wlg-pill-in: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(var(--wlg-cel), .30);
  --wlg-ambient:
    radial-gradient(115% 38% at 88% 22%, oklch(88% .040 250 / .34), transparent 70%);
  
  --wlg-card-bg: var(--card);
}


.wl-tabs {
  display: flex; gap: 2px; padding: 2px; margin: 0 0 10px;
  border-radius: 10px; background: var(--surface-raised);
  border: 1px solid var(--surface-border);
}
.wl-tabs button {
  flex: 1; font-family: var(--font-ui); font-size: 14px; font-weight: 600;
  padding: 7px 8px; border: 0; border-radius: 8px; cursor: pointer;
  background: transparent; color: var(--text-soft); transition: all .2s var(--wlg-ease);
}
.wl-tabs button:hover { color: var(--text-bright); background: var(--hover-subtle); }

.wl-tabs button.active {
  color: var(--text-bright);
  background: linear-gradient(180deg,
    color-mix(in oklch, var(--blue) 32%, transparent),
    color-mix(in oklch, var(--blue) 16%, transparent));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 0 0 1px color-mix(in oklch, var(--blue) 46%, transparent),
    0 3px 12px -5px color-mix(in oklch, var(--blue) 70%, transparent),
    0 2px 6px -2px var(--shadow-strong);
}

:root[data-theme="light"] .wl-tabs button.active {
  background: linear-gradient(180deg,
    color-mix(in oklch, var(--blue) 26%, #fff),
    color-mix(in oklch, var(--blue) 14%, #fff));
  box-shadow:
    inset 0 0 0 1px color-mix(in oklch, var(--blue) 55%, transparent),
    0 1px 3px rgba(15,23,42,.12);
}


.rsb-body-split > .wl-tabs { flex-shrink: 0; margin: 10px 0; }
.wl-tabbody {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}


.wl-list { padding: 4px 10px 10px; }
.wl-grid { display: grid; gap: 7px; grid-template-columns: 1fr; }
@container wlpane (min-width: 300px) { .wl-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@container wlpane (min-width: 490px) { .wl-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@container wlpane (min-width: 680px) { .wl-grid { grid-template-columns: repeat(4, minmax(0,1fr)); } }


.wl-item {
  position: relative; isolation: isolate;
  display: block;                      
  padding: 10px 11px 11px;
  border: 0; border-left: 0; border-radius: var(--wlg-r);
  background: var(--wlg-surf), var(--wlg-card-bg);
  box-shadow: var(--wlg-sh);
  cursor: pointer;
  transition: background .24s var(--wlg-ease), box-shadow .24s var(--wlg-ease), scale .36s var(--wlg-spring);
}

.wl-item::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  pointer-events: none; background: var(--wlg-rim);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  transition: background .24s var(--wlg-ease);
}

.wl-item::after {
  content: ""; position: absolute; left: 12%; right: 12%; top: 0; height: 1px;
  pointer-events: none; background: var(--wlg-spec); opacity: var(--wlg-spec-op);
  transition: opacity .24s var(--wlg-ease);
}
.wl-item:hover { background: var(--wlg-surf-hi), var(--wlg-card-bg); box-shadow: var(--wlg-sh-hi); }
.wl-item:hover::before { background: var(--wlg-rim-hi); }
.wl-item:hover::after { opacity: 1; }
.wl-item:active { scale: .985; }
.wl-item.active {
  background: var(--wlg-surf-hi), var(--wlg-card-bg);
  box-shadow: var(--wlg-sh-hi), 0 0 30px -12px var(--blue-focus);
}
.wl-item.active::before {
  background: linear-gradient(158deg,
    color-mix(in oklch, var(--blue) 85%, transparent) 0%,
    color-mix(in oklch, var(--blue) 20%, transparent) 38%,
    rgba(255,255,255,.04) 66%,
    color-mix(in oklch, var(--blue) 42%, transparent) 100%);
}

.wl-item .wl-top { display: flex; align-items: center; gap: 9px; min-width: 0; }
.wl-item .wl-info { min-width: 0; display: flex; flex-direction: column; gap: 1px; }

.wl-item .wl-name { font-size: 12.5px; font-weight: 600; letter-spacing: .015em; color: var(--text-bright); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl-item .wl-sym { font-size: 10.5px; color: var(--text-muted); white-space: nowrap; }
.wl-item .wl-px { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 11px; }
.wl-item .wl-price {
  font-family: var(--font-data); font-variant-numeric: tabular-nums;
  font-size: 17px; font-weight: 500; letter-spacing: -.04em; color: var(--text-bright); white-space: nowrap;
}

.wl-item .wl-price small {
  font-size: 12.5px; color: var(--text-muted); letter-spacing: -.01em; font-weight: 500;
}

.wl-item .wl-change {
  font-family: var(--font-data); font-variant-numeric: tabular-nums;
  font-size: 11px; font-weight: 500; letter-spacing: -.01em; white-space: nowrap;
  display: inline-flex; align-items: center; padding: 3.5px 8px; border-radius: 999px;
  background: var(--wlg-pill); box-shadow: var(--wlg-pill-in);
}
.wl-item .wl-change::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%; margin-right: 5px;
  background: currentColor; box-shadow: 0 0 8px currentColor;
}
.wl-change.up { color: var(--green); }
.wl-change.down { color: var(--red); }
.wl-change.flat { color: var(--text-dim); }


.wl-item .wl-remove {
  position: absolute; top: 6px; right: 6px; width: 19px; height: 19px;
  display: grid; place-items: center; border: 0; border-radius: 6px;
  background: var(--surface-raised); color: var(--text-muted);
  font-size: 13px; line-height: 1; cursor: pointer; opacity: 0;
  transition: opacity .18s var(--wlg-ease), background .18s var(--wlg-ease), color .18s var(--wlg-ease);
}
.wl-item:hover .wl-remove, .wl-item:focus-within .wl-remove { opacity: 1; }
.wl-item .wl-remove:hover { background: var(--red-dim); color: var(--red); }


.wl-logo {
  position: relative; width: 30px; height: 30px; flex: none; border-radius: 9px;
  overflow: hidden; display: grid; place-items: center;
  background: var(--wlg-tile); box-shadow: var(--wlg-tile-in);
  transition: scale .38s var(--wlg-spring);
}
.wl-item:hover .wl-logo, .wl-screener-item:hover .wl-logo { scale: 1.06; }
.wl-logo::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: var(--wlg-gloss); }

.wl-logo.wl-logo-lt { background: var(--wlg-tile-onlight); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
.wl-logo.wl-logo-dk { background: var(--wlg-tile-ondark);  box-shadow: inset 0 0 0 1px rgba(15,23,42,.14); }
.wl-logo img { width: 21px; height: 21px; object-fit: contain; display: block; border-radius: 0; background: none; }

.wl-logo img.wl-logo-idx { width: 100%; height: 100%; object-fit: cover; border-radius: 7px; }
.wl-logo-fb {
  width: 100%; height: 100%; display: grid; place-items: center; border-radius: 0;
  font-family: var(--font-data); font-size: 10px; font-weight: 600; color: var(--text-soft); letter-spacing: -.03em;
}


.wl-grid.wl-view-list { grid-template-columns: 1fr; gap: 4px; }
.wl-view-list .wl-item {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 28px 7px 11px;   
  border-radius: var(--wlg-r);
}
.wl-view-list .wl-item .wl-top { flex: 1; min-width: 0; gap: 10px; }
.wl-view-list .wl-item .wl-logo { width: 26px; height: 26px; border-radius: 8px; }
.wl-view-list .wl-item .wl-logo img { width: 18px; height: 18px; }
.wl-view-list .wl-item .wl-logo img.wl-logo-idx { width: 100%; height: 100%; border-radius: 6px; }
.wl-view-list .wl-item .wl-info { gap: 0; }
.wl-view-list .wl-item .wl-name { font-size: 14px; line-height: 1.25; }
.wl-view-list .wl-item .wl-sym { font-size: 12px; line-height: 1.3; }
.wl-view-list .wl-item .wl-px { margin-top: 0; flex: none; justify-content: flex-end; gap: 9px; }
.wl-view-list .wl-item .wl-price { font-size: 16px; letter-spacing: -.03em; }
.wl-view-list .wl-item .wl-price small { font-size: 13px; }
.wl-view-list .wl-item .wl-change { font-size: 12.5px; padding: 2px 7px; }
.wl-view-list .wl-item .wl-change::before { width: 4px; height: 4px; margin-right: 4px; }
.wl-view-list .wl-item .wl-remove { top: 50%; right: 5px; transform: translateY(-50%); }


.wl-viewbar { display: flex; justify-content: flex-end; padding: 2px 10px 0; }
.wl-viewseg {
  display: inline-flex; gap: 2px; padding: 2px;
  border-radius: 8px; background: var(--surface-raised);
  border: 1px solid var(--surface-border);
}
.wl-viewseg button {
  display: grid; place-items: center; width: 26px; height: 21px;
  border: 0; border-radius: 6px; cursor: pointer;
  background: transparent; color: var(--text-dim); transition: all .2s var(--wlg-ease);
}
.wl-viewseg button:hover { color: var(--text-bright); }
.wl-viewseg button.active {
  color: var(--text-bright);
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.05));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 2px 6px -2px var(--shadow-strong);
}
:root[data-theme="light"] .wl-viewseg button.active {
  background: #fff; box-shadow: inset 0 0 0 1px rgba(15,23,42,.12), 0 1px 2px rgba(15,23,42,.10);
}
.wl-viewseg svg { width: 13px; height: 13px; display: block; }


.wl-rows { display: grid; grid-template-columns: 1fr; gap: 4px; }
.wl-screener-item {
  position: relative; isolation: isolate;
  display: grid; grid-template-columns: 26px minmax(0,1fr) auto;
  align-items: center; gap: 10px; padding: 7px 11px;
  border: 0; border-left: 0; border-radius: var(--wlg-r);
  background: var(--wlg-surf), var(--wlg-card-bg);
  box-shadow: var(--wlg-sh); cursor: pointer;
  transition: background .24s var(--wlg-ease), box-shadow .24s var(--wlg-ease);
}
.wl-screener-item::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  pointer-events: none; background: var(--wlg-rim);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  transition: background .24s var(--wlg-ease);
}
.wl-screener-item::after {
  content: ""; position: absolute; left: 12%; right: 12%; top: 0; height: 1px;
  pointer-events: none; background: var(--wlg-spec); opacity: var(--wlg-spec-op);
}
.wl-screener-item:hover { background: var(--wlg-surf-hi), var(--wlg-card-bg); box-shadow: var(--wlg-sh-hi); }
.wl-screener-item:hover::before { background: var(--wlg-rim-hi); }
.wl-screener-item .wl-logo { width: 26px; height: 26px; border-radius: 8px; }
.wl-screener-item .wl-logo img { width: 18px; height: 18px; }
.wl-screener-item .wl-logo img.wl-logo-idx { width: 100%; height: 100%; border-radius: 6px; }
.wl-screener-item .wl-info { min-width: 0; display: flex; flex-direction: column; gap: 0; }

.wl-screener-item .wl-name { font-size: 14px; font-weight: 600; line-height: 1.25; color: var(--text-bright); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wl-screener-item .wl-sym { font-size: 12px; line-height: 1.3; color: var(--text-muted); white-space: nowrap; }

.wl-screener-item .wl-px {
  display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 9px;
}
.wl-screener-item .wl-price {
  font-family: var(--font-data); font-variant-numeric: tabular-nums;
  font-size: 16px; font-weight: 500; letter-spacing: -.03em; color: var(--text-bright); white-space: nowrap;
}
.wl-screener-item .wl-price small {
  font-size: 13px; color: var(--text-muted); letter-spacing: -.01em; font-weight: 500;
}
.wl-screener-item .wl-change {
  font-family: var(--font-data); font-variant-numeric: tabular-nums;
  font-size: 12.5px; font-weight: 500; white-space: nowrap;
  display: inline-flex; align-items: center; padding: 2px 7px; border-radius: 999px;
  background: var(--wlg-pill); box-shadow: var(--wlg-pill-in);
}
.wl-screener-item .wl-change::before {
  content: ""; width: 4px; height: 4px; border-radius: 50%; margin-right: 4px;
  background: currentColor; box-shadow: 0 0 6px currentColor;
}


.wl-screener-item .wl-score { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 9px; }
.wl-score-val {
  font-family: var(--font-data); font-variant-numeric: tabular-nums;
  font-size: 16px; font-weight: 500; letter-spacing: -.03em; color: var(--text-bright);
}
.wl-score-val small { font-size: 11.5px; color: var(--text-muted); letter-spacing: 0; }
.wl-score-val.high { color: var(--green); }
.wl-score-val.mid  { color: var(--amber); }
.wl-score-val.low  { color: var(--text-dim); }
.wl-score-win { font-family: var(--font-data); font-variant-numeric: tabular-nums;
  font-size: 11.5px; color: var(--text-faint); white-space: nowrap; }


.wl-screener-tabs { display: flex; gap: 5px; padding: 0 10px 8px; }
.wl-screener-tab {
  font-family: var(--font-ui); font-size: 13px; font-weight: 500;
  padding: 5px 12px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--wlg-pill); box-shadow: var(--wlg-pill-in); color: var(--text-dim);
  display: inline-flex; align-items: center; gap: 6px; transition: all .2s var(--wlg-ease);
}
.wl-screener-tab::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor;
  opacity: .45; transition: opacity .2s var(--wlg-ease), box-shadow .2s var(--wlg-ease);
}
.wl-screener-tab:hover { color: var(--text-soft); }
.wl-screener-tab.active { color: var(--text-bright); }
.wl-screener-tab.active::before { opacity: 1; box-shadow: 0 0 8px currentColor; }
.wl-screener-tab[data-scr="day_gainers"].active { color: var(--green);
  box-shadow: var(--wlg-pill-in), 0 0 0 1px var(--green-med), 0 0 16px -8px var(--green); }
.wl-screener-tab[data-scr="day_losers"].active { color: var(--red);
  box-shadow: var(--wlg-pill-in), 0 0 0 1px var(--red-med), 0 0 16px -8px var(--red); }
.wl-screener-tab[data-scr="most_actives"].active { color: var(--blue);
  box-shadow: var(--wlg-pill-in), 0 0 0 1px var(--blue-med), 0 0 16px -8px var(--blue); }


.wl-group-label {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 4px 7px;
}
.wl-group-label:first-child { padding-top: 4px; }
.wl-group-name {
  font-size: 9.5px; font-weight: 600; letter-spacing: .18em;
  text-transform: uppercase; color: var(--text-muted);
  flex: 0 1 auto;
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.wl-group-rule {
  flex: 1; height: 1px; border: 0; margin: 0; min-width: 12px;
  background: linear-gradient(90deg, var(--wlg-rule), transparent);
}
.wl-group-actions {
  display: flex;
  gap: 2px;
  flex-shrink: 0;
  opacity: .5;
  transition: opacity var(--ease);
}
.wl-group-label:hover .wl-group-actions { opacity: 1; }
.wl-cat-add, .wl-cat-del {
  background: transparent;
  border: none;
  color: var(--text-muted);
  width: 22px; height: 22px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--ease), color var(--ease);
}
.wl-cat-add:hover { background: var(--hover-medium); color: var(--blue); }
.wl-cat-del:hover { background: var(--red-dim); color: var(--red); }

@media (prefers-reduced-motion: reduce) {
  .wl-item, .wl-screener-item, .wl-logo { transition-duration: .01ms !important; }
}


.wl-group-label[draggable="true"] { cursor: grab; }
.wl-group-label[draggable="true"]:active { cursor: grabbing; }
.wl-item[draggable="true"] { cursor: grab; }
.wl-item[draggable="true"]:active { cursor: grabbing; }
.wl-dragging { opacity: .4; }
.wl-drop-before { box-shadow: inset 0 2px 0 0 var(--blue) !important; }
.wl-drop-after  { box-shadow: inset 0 -2px 0 0 var(--blue) !important; }
.wl-drop-into   { background: var(--hover-medium) !important; outline: 1px dashed var(--blue); outline-offset: -2px; }

.wl-empty-cat {
  padding: 6px 14px 10px;
  font-size: .78rem;
  color: var(--text-muted);
  font-style: italic;
}


.wl-footer {
  padding: 10px 4px 14px;
}
.wl-footer-btn {
  width: 100%;
  padding: 8px 12px;
  background: transparent;
  border: 1px dashed var(--border-hi);
  border-radius: 12px;   
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
}
.wl-footer-btn:hover {
  border-color: var(--blue);
  color: var(--blue);
  background: var(--hover-subtle);
}




.wl-add-input {
  width: 100%;
  padding: 8px 12px;
  border-radius: var(--radius-md);
  border: 1px solid var(--surface-border);
  background: var(--divider-soft);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .84rem;
  outline: none;
  transition: border-color var(--ease);
}
.wl-add-input:focus { border-color: var(--blue); }
.wl-add-input::placeholder { color: var(--text-muted); }

.wl-loading {
  padding: 24px;
  text-align: center;
  color: var(--text-muted);
  
  font-size: calc(.82rem + 2px);
}





.wl-season-select-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 10px;
}
.wl-season-dd { position: relative; flex: 1.1 1 0; min-width: 0; }
.wl-season-dd-btn {
  width: 100%;
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border-hi);
  background: var(--surface-raised);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  outline: none;
  text-align: left;
  transition: border-color var(--ease), background var(--ease);
}
.wl-season-dd-btn:hover { border-color: var(--surface-border-strong); }
.wl-season-dd-btn:focus-visible { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-focus); }
.wl-season-dd-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wl-season-dd-caret {
  width: 12px; height: 12px; flex: none; color: var(--text-muted);
  transition: transform .18s var(--wlg-ease);
}
.wl-season-dd.open .wl-season-dd-btn { border-color: var(--surface-border-strong); }
.wl-season-dd.open .wl-season-dd-caret { transform: rotate(180deg); }


.wl-season-dd-menu {
  position: fixed; z-index: 3000;
  display: flex; flex-direction: column; gap: 1px;
  padding: 5px;
  border-radius: 10px;
  border: 1px solid var(--surface-border-hi);
  background: var(--panel);
  box-shadow: 0 18px 40px -14px var(--shadow-strong), 0 2px 8px -4px var(--shadow-strong);
}
.wl-season-dd-menu[hidden] { display: none; }
.wl-season-dd-opt {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 9px;
  border: 0; border-radius: 7px;
  background: transparent;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background .16s var(--wlg-ease), color .16s var(--wlg-ease);
}
.wl-season-dd-opt:hover { background: var(--hover-medium); color: var(--text-bright); }
.wl-season-dd-opt-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wl-season-dd-check { width: 13px; height: 13px; flex: none; opacity: 0; color: var(--blue); }
.wl-season-dd-opt.active { color: var(--text-bright); font-weight: 600; background: var(--blue-dim); }
:root[data-theme="light"] .wl-season-dd-check { color: color-mix(in oklch, var(--blue) 60%, #000); }
.wl-season-dd-opt.active .wl-season-dd-check { opacity: 1; }
.wl-season-dd-sep {
  height: 1px; margin: 5px 4px;
  background: linear-gradient(90deg, transparent, var(--surface-border-strong) 18%, var(--surface-border-strong) 82%, transparent);
}

.wl-season-dd-scanner {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 9px;
  border: 0; border-radius: 7px;
  background: color-mix(in oklch, var(--blue) 16%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--blue) 34%, transparent);
  color: var(--blue);
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  transition: background .16s var(--wlg-ease), box-shadow .16s var(--wlg-ease);
}
.wl-season-dd-scanner:hover {
  background: color-mix(in oklch, var(--blue) 26%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--blue) 52%, transparent);
}

:root[data-theme="light"] .wl-season-dd-scanner {
  color: color-mix(in oklch, var(--blue) 55%, #000);
  background: color-mix(in oklch, var(--blue) 20%, #fff);
  box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--blue) 50%, transparent);
}
:root[data-theme="light"] .wl-season-dd-scanner:hover {
  background: color-mix(in oklch, var(--blue) 32%, #fff);
}
.wl-season-dd-scanner .wl-season-dd-scanner-label { flex: 1; min-width: 0; }
.wl-season-dd-scanner svg { width: 14px; height: 14px; flex: none; }



.wl-season-dd-sort { flex: 1 1 0; min-width: 0; }
.wl-season-dd-sort .wl-season-dd-btn {
  font-size: 13px;
  font-weight: 500;
  padding: 6px 9px;
  gap: 6px;
  color: var(--text-soft);
}
.wl-season-dd-sort.open .wl-season-dd-btn,
.wl-season-dd-sort .wl-season-dd-btn:hover { color: var(--text-bright); }
.wl-season-dd-sorticon { width: 13px; height: 13px; flex: none; color: var(--text-muted); }
.wl-season-dd-head {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 5px 10px 6px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 3px;
}

.wl-season-list-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 8px 14px 6px;
  border-bottom: 1px solid var(--border);
  margin: 0 0 4px;
}
.wl-season-list-header .wl-season-list-title {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
}
.wl-season-list-header .wl-season-list-month {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
}




.cp-loading {
  padding: 24px;
  text-align: center;
  color: var(--text-muted);
  font-size: .82rem;
}

.cp-company-name {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-bright);
  margin-bottom: 6px;
}
.cp-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 8px;
}
.cp-tag {
  padding: 3px 9px;
  border-radius: var(--radius-sm);
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .04em;
  background: var(--surface-raised);
  color: var(--text-dim);
  text-transform: uppercase;
}
.cp-tag a {
  color: var(--blue);
  text-decoration: none;
}
.cp-tag a:hover { text-decoration: underline; }


.cp-desc {
  font-size: .87rem;
  line-height: 1.5;
  color: var(--text-dim);
  max-height: 60px;
  overflow: hidden;
  position: relative;
  transition: max-height .3s ease;
}
.cp-desc.expanded {
  max-height: 800px;
}
.cp-desc:not(.expanded)::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 24px;
  background: linear-gradient(transparent, var(--card));
}

.cp-toggle-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 20px;
  margin: 6px auto 2px;
  background: none;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-md);
  color: var(--text-muted);
  cursor: pointer;
  transition: color .15s, border-color .15s, background .15s;
}
.cp-toggle-btn svg {
  width: 14px;
  height: 14px;
  transition: transform .25s ease;
}
.cp-toggle-btn.open svg {
  transform: rotate(180deg);
}
.cp-toggle-btn:hover {
  color: var(--text);
  border-color: var(--text-muted);
  background: var(--divider-soft);
}


.cp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px 12px;
}
.cp-stat {
  padding: 5px 0;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid var(--divider-soft);
}
.cp-stat-label {
  font-size: .87rem;
  color: var(--text-dim);
  font-weight: 500;
}
.cp-stat-value {
  font-family: var(--font-ui);
  font-size: .92rem;
  font-weight: 600;
  color: var(--text-bright);
}


.cp-analyst-bar-wrap {
  margin-top: 6px;
}
.cp-analyst-bar {
  display: flex;
  height: 20px;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 6px;
}
.cp-analyst-bar > div {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .82rem;
  font-weight: 700;
  color: #fff;
  min-width: 0;
  transition: flex .3s ease;
}
.cp-analyst-bar .cp-ab-sb { background: var(--green); }
.cp-analyst-bar .cp-ab-b  { background: var(--green); }
.cp-analyst-bar .cp-ab-h  { background: var(--amber); }
.cp-analyst-bar .cp-ab-s  { background: var(--red); }
.cp-analyst-bar .cp-ab-ss { background: var(--red); }

.cp-analyst-labels {
  display: flex;
  justify-content: space-between;
  font-size: .82rem;
  color: var(--text-muted);
}

.cp-error {
  padding: 16px 12px;
  text-align: center;
  color: var(--red);
  font-size: .82rem;
}


.cp-insights-strip {
  padding: 12px !important;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cp-ins-group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.cp-ins-label {
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.cp-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}


.cp-ins-signals {
  display: flex;
  gap: 6px;
}
.cp-signal {
  flex: 1;
  padding: 7px 9px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface-veil);
  transition: border-color .15s;
}
.cp-signal:hover {
  border-color: var(--border-hi);
}
.cp-signal-label {
  display: block;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 3px;
}
.cp-signal-value {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
}
.cp-signal-red .cp-signal-value { color: var(--red); }
.cp-signal-green .cp-signal-value { color: var(--green); }
.cp-signal-amber .cp-signal-value { color: var(--amber); }


.cp-levels {
  display: flex;
  gap: 1px;
  background: var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.cp-level {
  flex: 1;
  padding: 7px 6px;
  background: var(--card);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.cp-level:first-child { border-radius: 6px 0 0 6px; }
.cp-level:last-child  { border-radius: 0 6px 6px 0; }
.cp-level-label {
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.cp-level-value {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text);
}


.cp-sigdev {
  padding: 8px 10px;
  border-radius: 6px;
  border-left: 3px solid var(--amber);
  background: var(--amber-dim);
  font-size: .82rem;
  line-height: 1.5;
  color: var(--text-dim);
}


.cp-events {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cp-event {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  border-bottom: 1px solid var(--divider-soft);
}
.cp-event:last-child { border-bottom: none; }
.cp-event-icon {
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 6px;
  font-size: .82rem;
  font-weight: 700;
  background: var(--blue-dim);
  color: var(--blue);
  flex-shrink: 0;
}
.cp-event-label {
  font-size: .87rem;
  color: var(--text-dim);
  font-weight: 500;
  flex: 1;
}
.cp-event-date {
  font-family: var(--font-ui);
  font-size: .92rem;
  color: var(--text-bright);
  font-weight: 600;
}


.cp-ud-list {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cp-ud-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: .87rem;
  padding: 5px 0;
  border-bottom: 1px solid var(--divider-soft);
}
.cp-ud-item:last-child { border-bottom: none; }
.cp-ud-action {
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 6px;
  font-size: .82rem;
  font-weight: 700;
  flex-shrink: 0;
}
.cp-ud-up { color: var(--green); background: var(--green-dim); }
.cp-ud-down { color: var(--red); background: var(--red-dim); }
.cp-ud-init { color: var(--text-muted); background: var(--surface-raised); }
.cp-ud-firm {
  color: var(--text-dim);
  font-weight: 500;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.cp-ud-grade {
  font-family: var(--font-ui);
  font-size: .92rem;
  font-weight: 600;
  color: var(--text-bright);
  white-space: nowrap;
}
.cp-ud-date {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-muted);
  flex-shrink: 0;
}


.cp-info-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
  align-items: center;
}
.cp-info-link {
  font-size: .82rem;
  color: var(--blue);
  text-decoration: none;
}
.cp-info-link:hover { text-decoration: underline; }
.cp-info-item {
  font-size: .82rem;
  color: var(--text-dim);
}
.cp-info-item::before {
  content: '\00b7';
  margin-right: 6px;
  color: var(--text-muted);
}


.cp-stats-extra {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
}
.cp-stats-extra.open {
  max-height: 400px;
}
.cp-acc-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: default;
}
.cp-acc-arrow {
  font-size: .7rem;
  transition: transform .2s;
}
.cp-acc-trigger.expanded .cp-acc-arrow {
  transform: rotate(180deg);
}


.cp-div-wrap {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 4px 0;
}
.cp-div-donut {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
}
.cp-div-metrics {
  flex: 1;
  min-width: 0;
}
.cp-div-yield {
  font-family: var(--font-ui);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text-bright);
  margin-bottom: 1px;
}
.cp-div-yield-label {
  font-size: .82rem;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.cp-div-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
  border-bottom: 1px solid var(--divider-soft);
}
.cp-div-row:last-child { border-bottom: none; }
.cp-div-label {
  font-size: .87rem;
  color: var(--text-dim);
  font-weight: 500;
}
.cp-div-val {
  font-family: var(--font-ui);
  font-size: .92rem;
  font-weight: 600;
  color: var(--text-bright);
}


.cp-fin-controls {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}
.cp-fin-select {
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font-size: .82rem;
  font-family: var(--font-ui);
  cursor: pointer;
  outline: none;
  flex: 1;
  min-width: 0;
}
.cp-fin-select:focus { border-color: var(--blue); }
.cp-fin-toggle {
  display: flex;
  gap: 3px;
  flex: 1;
}
.cp-fin-btn {
  flex: 1;
  padding: 5px 0;
  border-radius: var(--radius-sm);
  border: none;
  background: var(--surface-raised);
  color: var(--text-muted);
  font-size: .82rem;
  font-family: var(--font-ui);
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all var(--ease);
}
.cp-fin-btn:hover { color: var(--text); }
.cp-fin-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
}


.cp-analyst-summary {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 8px;
}
.cp-analyst-val {
  font-family: var(--font-ui);
  font-size: 1.3rem;
  font-weight: 700;
}
.cp-analyst-label {
  font-size: .84rem;
  font-weight: 600;
}
.cp-analyst-total {
  font-size: .82rem;
  color: var(--text-muted);
  margin-left: auto;
}
.cp-analyst-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
}
.cp-analyst-row-label {
  font-size: .82rem;
  color: var(--text-dim);
  font-weight: 500;
  min-width: 68px;
  flex-shrink: 0;
  text-align: right;
}
.cp-analyst-bar-track {
  flex: 1;
  height: 8px;
  background: var(--surface-raised);
  border-radius: 4px;
  overflow: hidden;
}
.cp-analyst-bar-fill {
  height: 100%;
  border-radius: 4px;
  min-width: 2px;
  transition: width 0.3s ease;
}
.cp-analyst-row-val {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  width: 20px;
  text-align: right;
  flex-shrink: 0;
}



.rsb-user-badge {
  width: 34px; height: 34px;
  margin: 4px 4px 8px auto;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: linear-gradient(135deg, #6b7280, #374151);
  color: #fff;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  padding: 0;
  position: relative;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  flex-shrink: 0;
}
.rsb-user-badge:hover {
  transform: scale(1.05);
  border-color: rgba(255,255,255,.2);
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.rsb-user-badge[data-tier="guest"]   { background: linear-gradient(135deg, #ef4444, #991b1b); }
.rsb-user-badge[data-tier="free"]    { background: linear-gradient(135deg, #facc15, #ca8a04); }
.rsb-user-badge[data-tier="basic"]   { background: linear-gradient(135deg, #22c55e, #15803d); }
.rsb-user-badge[data-tier="premium"] { background: linear-gradient(135deg, #22c55e, #15803d); }

.rsb-user-initial {
  font: 600 .95rem/1 var(--font-ui);
  letter-spacing: -.01em;
  text-transform: uppercase;
  user-select: none;
}


.rsb-user-pop {
  position: absolute;
  top: 6px;
  right: calc(var(--rsb-strip-w) + 6px);
  width: 240px;
  background: var(--card);
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 40px var(--shadow-strong, rgba(0,0,0,.35));
  padding: 14px;
  z-index: 100;
  font-family: var(--font-ui);
}
.rsb-user-pop[hidden] { display: none; }

.rsb-user-pop-head {
  display: flex; align-items: center;
  gap: 12px;
  padding-bottom: 12px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.rsb-user-pop-avatar {
  width: 44px; height: 44px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font: 600 1.1rem/1 var(--font-ui);
  color: #fff;
  background: linear-gradient(135deg, #6b7280, #374151);
  flex-shrink: 0;
  text-transform: uppercase;
}
.rsb-user-pop-avatar[data-tier="guest"]   { background: linear-gradient(135deg, #ef4444, #991b1b); }
.rsb-user-pop-avatar[data-tier="free"]    { background: linear-gradient(135deg, #facc15, #ca8a04); }
.rsb-user-pop-avatar[data-tier="basic"]   { background: linear-gradient(135deg, #22c55e, #15803d); }
.rsb-user-pop-avatar[data-tier="premium"] { background: linear-gradient(135deg, #22c55e, #15803d); }

.rsb-user-pop-meta { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rsb-user-pop-name {
  font-size: .95rem; font-weight: 600; color: var(--text, #e8ebf4);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rsb-user-pop-tier {
  font-size: .82rem; font-weight: 600;
  padding: 2px 8px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.08);
  color: var(--text-dim, #9aa3b8);
  width: fit-content;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.rsb-user-pop-tier[data-tier="guest"]   { background: rgba(239,68,68,.18);  color: #fca5a5; }
.rsb-user-pop-tier[data-tier="free"]    { background: rgba(250,204,21,.16); color: #ffd85a; }
.rsb-user-pop-tier[data-tier="basic"]   { background: rgba(192,198,212,.12); color: #c0c6d4; }
.rsb-user-pop-tier[data-tier="premium"] { background: rgba(195,160,95,.16); color: #c3a05f; letter-spacing: .06em; }

.rsb-user-pop-action {
  display: flex; align-items: center; justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text, #e8ebf4);
  font: 500 .9rem/1 var(--font-ui);
  cursor: pointer;
  transition: background var(--ease, .15s ease), color var(--ease, .15s ease);
}
.rsb-user-pop-action:hover {
  background: var(--hover-medium, rgba(255,255,255,.08));
}
.rsb-user-pop-action + .rsb-user-pop-action { margin-top: 6px; }
.rsb-user-pop-settings svg { width: 16px; height: 16px; flex-shrink: 0; opacity: .85; }


.rsb-user-pop-sec {
  border-top: 1px solid var(--surface-border);
  padding-top: 10px;
  margin-top: 8px;
}
.rsb-user-pop-sec[hidden] { display: none; }
.rsb-user-pop-seclabel {
  font-size: .72rem; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; color: var(--text-muted);
  margin: 0 2px 8px;
}
.rsb-user-pop-subline {
  font-size: .9rem; line-height: 1.35; color: var(--text);
  padding: 0 2px 8px;
}
.rsb-user-pop-subline .rsb-sub-muted { color: var(--text-muted); }
.rsb-user-pop-subline.rsb-sub-warn { color: var(--amber); font-weight: 600; }
.rsb-user-pop-link {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; padding: 8px 12px; margin-bottom: 2px;
  border-radius: var(--radius-sm); text-decoration: none;
  font-size: .9rem; font-weight: 600;
  color: var(--blue); background: var(--blue-dim);
}
.rsb-user-pop-link[hidden] { display: none; }
.rsb-user-pop-link:hover { background: var(--blue-med); }
.rsb-user-pop-link.rsb-cta-upgrade { color: var(--amber); background: var(--amber-dim); }
.rsb-user-pop-link.rsb-cta-upgrade:hover { background: var(--amber-light); }


.acct-modal-ov {
  position: fixed; inset: 0; z-index: 4000;
  background: var(--overlay-bg, rgba(0,0,0,.65));
  display: flex; align-items: center; justify-content: center; padding: 20px;
  animation: acctFade .12s ease-out; font-family: var(--font-ui, sans-serif);
}
@keyframes acctFade { from { opacity: 0; } to { opacity: 1; } }
.acct-modal-ov[hidden] { display: none; }
.acct-modal {
  width: 100%; max-width: 470px; box-sizing: border-box;
  background: var(--panel); color: var(--text);
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-md); overflow: hidden;
  box-shadow: var(--overlay-shadow);
}
.acct-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--surface-border);
}
.acct-modal-title { font-size: .8rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--text-dim); }
.acct-modal-close { background: none; border: none; color: var(--text-dim); font-size: 1.2rem; line-height: 1; cursor: pointer; padding: 3px 5px; border-radius: var(--radius-sm); }
.acct-modal-close:hover { color: var(--text-bright); background: var(--hover-medium); }


.acct-hero { display: flex; align-items: center; gap: 15px; padding: 20px 18px; }
.acct-avatar {
  width: 62px; height: 62px; border-radius: 50%; flex-shrink: 0;
  background-size: cover; background-position: center;
  display: flex; align-items: center; justify-content: center;
  font: 700 1.6rem/1 var(--font-ui); color: #fff;
  border: 1px solid var(--surface-border-hi);
  background-image: linear-gradient(135deg, #3a4055, #232838);
  position: relative; overflow: hidden; text-decoration: none;
}
.acct-avatar-cam {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.5); color: #fff; opacity: 0; transition: opacity .12s ease;
}
.acct-avatar:hover .acct-avatar-cam, .acct-avatar:focus-visible .acct-avatar-cam { opacity: 1; }
.acct-avatar[data-tier="premium"], .acct-avatar[data-tier="admin"] { background-image: linear-gradient(135deg, #c9a765, #7d6329); }
.acct-avatar[data-tier="basic"]  { background-image: linear-gradient(135deg, #22c55e, #15803d); }
.acct-avatar[data-tier="free"]   { background-image: linear-gradient(135deg, #f0c419, #b7860b); }
.acct-hero-meta { min-width: 0; }
.acct-hero-name { font-size: 1.32rem; font-weight: 700; line-height: 1.2; color: var(--text-bright); display: flex; align-items: center; gap: 9px; }
.acct-hero-name span:first-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 236px; }
.acct-hero-email { font-size: .9rem; color: var(--text-dim); margin-top: 4px; word-break: break-all; }
.acct-hero-since { font-size: .8rem; color: var(--text-muted); margin-top: 5px; }
.acct-chip { font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; padding: 3px 8px; border-radius: var(--radius-sm); background: var(--amber-dim); color: var(--amber); flex-shrink: 0; }
.acct-chip[data-tier="basic"] { background: var(--surface-raised); color: var(--text-soft); }

.acct-sec { padding: 16px 18px; border-top: 1px solid var(--surface-border); }
.acct-sec-label { font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 12px; }
.acct-field-label { display: block; font-size: .82rem; color: var(--text-dim); margin-bottom: 8px; }
.acct-row { display: flex; gap: 8px; }
.acct-name-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.acct-input {
  width: 100%; box-sizing: border-box; padding: 10px 12px;
  background: var(--bg); border: 1px solid var(--border-hi); border-radius: var(--radius-sm);
  color: var(--text-bright); font-size: .95rem; font-family: var(--font-ui); outline: none;
}
.acct-input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-dim); }
.acct-note { font-size: .8rem; color: var(--text-muted); margin-top: 8px; }
.acct-btn {
  padding: 10px 16px; border: none; border-radius: var(--radius-sm); white-space: nowrap;
  font-size: .92rem; font-weight: 600; font-family: var(--font-ui); cursor: pointer;
  background: var(--blue); color: #fff;
}
.acct-btn:hover { background: var(--blue-hover); }
.acct-btn:disabled { opacity: .55; cursor: default; }
.acct-btn-ghost { background: transparent; border: 1px solid var(--border-hi); color: var(--text); }
.acct-btn-ghost:hover { border-color: var(--blue); background: var(--hover-subtle); }
.acct-secrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.acct-secrow-txt { font-size: .95rem; color: var(--text); }
.acct-secrow-txt small { display: block; color: var(--text-muted); font-size: .8rem; margin-top: 3px; }
.acct-sublink { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-size: .9rem; font-weight: 600; color: var(--blue); text-decoration: none; }
.acct-sublink:hover { text-decoration: underline; }
.acct-sublink[hidden] { display: none; }
.acct-msg { font-size: .88rem; padding: 0 18px 16px; }
.acct-msg:empty { display: none; }
.acct-msg.ok { color: var(--green); }
.acct-msg.err { color: var(--red); }


@media (max-width: 900px) {
  .dd-label { display: none; }
  .stat { display: none; }
  .tb-tf-group { gap: 1px; }
  .tb-tf { padding: 4px 5px; }
  .opt-main { flex-direction: column; }
  .opt-metric-area { border-right: none; border-bottom: 1px solid var(--border); }
  .opt-insight-area { max-width: none; max-height: 40vh; }
  .opt-cards { grid-template-columns: repeat(3, 1fr); }
  .rsb-panel.open { width: 260px; min-width: 260px; }
  .rsb-body { min-width: 260px; }
}
@media (max-width: 600px) {
  .toolbar { width: 40px; min-width: 40px; }
  .tb-btn { width: 34px; height: 34px; font-size: 1rem; }
  .tb-tf-group { display: none; }
  .opt-cards { grid-template-columns: repeat(2, 1fr); }
  .opt-panel { height: 95vh; width: 100vw; border-radius: 0; }
  .rsb-strip { display: none; }
  .rsb-panel { display: none; }
}



.rsb-user-pop-foot {
  border-top: 1px solid var(--surface-border);
  padding-top: 10px;
  margin-top: 10px;
}


.rsb-user-pop-confirm-q {
  font-size: .82rem;
  color: var(--text-dim);
  text-align: center;
  margin: 2px 0 8px;
}
.rsb-user-pop-confirm-row { display: flex; gap: 6px; }
.rsb-user-pop-confirm-row .rsb-user-pop-action { margin-top: 0; }
.rsb-pop-btn-danger {
  border-color: var(--red-dim);
  color: var(--red);
}
.rsb-pop-btn-danger:hover { background: var(--red-subtle); }




.rsb-icon[data-tab="stats"] svg { fill: none; stroke: currentColor; }
.rsb-icon[data-tab="stats"] svg rect { fill: currentColor; stroke: none; }

.st-empty {
  padding: 32px 16px;
  text-align: center;
  color: var(--text-muted);
  font-size: 1.07rem;
}


.st-header {
  padding: 14px 8px 0;
  flex-shrink: 0;
}
.st-header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.st-header .sn-dash-open-btn {
  margin: 10px 0 8px;
}
.st-title {
  font-size: 1.1rem;
  font-weight: 600;
  font-family: var(--font-ui);
  letter-spacing: -.01em;
  color: var(--text-bright);
}
.st-title span { color: var(--blue); }


.st-glass-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px;
}
.st-glass {
  background: var(--hover-subtle);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-lg);
  padding: 12px 14px;
}


.st-tf-tabs {
  display: flex;
  gap: 4px;
}
.st-tf-tab {
  flex: 1;
  padding: 7px 0;
  border-radius: var(--radius-md);
  border: none;
  background: var(--surface-raised);
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .84rem;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all var(--ease);
}
.st-tf-tab:hover { color: var(--text); }
.st-tf-tab.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
}


.st-lookback-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
}
.st-lookback-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  flex-shrink: 0;
}
.st-lookback-opts {
  display: flex;
  gap: 3px;
  flex: 1;
}
.st-lb-btn {
  flex: 1;
  padding: 3px 0;
  border-radius: var(--radius-sm);
  border: none;
  background: var(--surface-raised);
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all var(--ease);
}
.st-lb-btn:hover { color: var(--text); }
.st-lb-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
}

.st-ai-wrap .st-compute-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 6px;
  font-family: var(--font-ui);
  font-size: .9rem;
  color: var(--text);
  line-height: 1.5;
  padding: 14px 18px;
  background: rgba(255,255,255,.025);
  border-bottom: 1px solid var(--border);
}
.st-compute-text {
  color: var(--text);
}
.st-compute-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: rgba(255,255,255,.06);
  color: var(--text-bright, var(--text));
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--radius-sm);
  padding: 3px 22px 3px 9px;
  font-family: var(--font-ui);
  font-size: .9rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color var(--ease), border-color var(--ease);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 4l3 3 3-3' fill='none' stroke='white' stroke-opacity='0.85' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 6px center;
}
.st-compute-select:hover {
  background-color: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.18);
}
.st-compute-select:focus {
  outline: none;
  background-color: rgba(255,255,255,.1);
  border-color: var(--blue, rgba(255,255,255,.25));
}
.st-compute-select option {
  background: var(--card, #181a23);
  color: var(--text);
  font-weight: 500;
}

#stmActionBox:empty {
  display: none;
}

.stm-action-box.stm-actionbox-compute {
  display: block !important;
  grid-template-columns: none !important;
  padding: 14px 18px !important;
  background: rgba(255,255,255,.025) !important;
}
.stm-actionbox-compute .st-compute-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 6px;
  font-family: var(--font-ui);
  font-size: .9rem;
  color: var(--text);
  line-height: 1.5;
}




.st-vol-chart-glass { padding: 10px 10px 0; overflow: hidden; }
.st-vol-chart-glass .st-section-title { margin-bottom: 4px; }
.st-vol-chart-wrap {
  position: relative;
  height: 110px;
  margin: 0 -10px;
}
.st-vol-chart-wrap canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}


.st-ai-wrap {
  background: var(--card); border-radius: var(--radius-md);
  border: 1px solid var(--border); overflow: hidden; margin-bottom: 10px;
}
.st-ai-wrap .stm-ai-header { border-radius: var(--radius-md) var(--radius-md) 0 0; }
.st-ai-content { padding: 14px 0 4px; }
.st-ai-content .stm-ins-chapter { padding: 0 18px; margin-bottom: 18px; }
.st-ai-content .stm-ins-chapter:last-child { margin-bottom: 0; }
.st-ai-content .stm-ins-chapter-title {
  padding: 0 0 8px;
  margin-bottom: 14px;
}
.st-ai-content .stm-ins-section {
  padding: 14px 0 16px;
  border-bottom: 1px solid var(--border);
}
.st-ai-content .stm-ins-section:last-child {
  padding-bottom: 4px;
  border-bottom: none;
}
.st-ai-wrap .stm-reveal { animation: none; opacity: 1; transform: none; }


.st-section-title {
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .1em;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: -12px -14px 10px;
  padding: 10px 14px;
  background: var(--divider-soft);
  border-radius: 14px 14px 0 0;
  border-bottom: 1px solid var(--surface-raised);
}


.st-expand-btn {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  width: 20px; height: 20px;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ease);
  flex-shrink: 0;
  padding: 0;
  border-radius: 4px;
}
.st-expand-btn:hover {
  color: var(--blue);
  background: var(--blue-dim);
}


.st-stat-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 5px 0;
  border-bottom: 1px solid var(--divider-soft);
}
.st-stat-row:last-child { border-bottom: none; }

.st-lbl {
  font-size: .87rem;
  color: var(--text-dim);
  font-weight: 500;
}
.st-vals {
  display: flex;
  gap: 14px;
}
.st-val {
  font-family: var(--font-ui);
  font-size: .92rem;
  font-weight: 600;
  color: var(--text-bright);
}
.st-val.dim { color: var(--text-dim); }
.st-val.up { color: var(--green); }
.st-val.down { color: var(--red); }


.st-kv-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2px 0;
}


.st-dir-bar {
  display: flex;
  height: 10px;
  border-radius: 5px;
  overflow: hidden;
  gap: 3px;
  margin: 6px 0 8px;
}
.st-dir-bull {
  background: var(--green);
  border-radius: 5px 0 0 5px;
}
.st-dir-bear {
  background: var(--red);
  border-radius: 0 5px 5px 0;
}
.st-dir-labels {
  display: flex;
  justify-content: space-between;
  font-size: .82rem;
  font-weight: 600;
  margin-bottom: 10px;
}
.st-dir-labels .up { color: var(--green); }
.st-dir-labels .down { color: var(--red); }


.st-streak {
  text-align: center;
  font-size: .85rem;
  font-weight: 600;
  color: var(--green);
  margin-top: 8px;
  padding: 6px;
  background: var(--green-subtle);
  border-radius: var(--radius-md);
}
.st-streak.bear {
  color: var(--red);
  background: var(--red-subtle);
}


.st-ext-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.st-ext-controls .st-lookback-opts { flex: 1; }
.st-ext-controls .st-unit-toggle { margin-bottom: 0; }


.st-unit-toggle {
  display: flex;
  gap: 3px;
  margin-bottom: 8px;
  flex-shrink: 0;
}
.st-unit-btn {
  padding: 3px 10px;
  border-radius: var(--radius-sm);
  border: none;
  background: var(--surface-raised);
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  transition: all var(--ease);
}
.st-unit-btn:hover { color: var(--text); }
.st-unit-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
}


.st-extreme-label {
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 8px 0 3px;
}
.st-extreme-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 6px;
  border-radius: 6px;
  cursor: pointer;
  transition: background .1s;
}
.st-extreme-row:hover { background: var(--surface-raised); }
.st-extreme-date {
  font-size: .87rem;
  color: var(--text-dim);
}
.st-extreme-val {
  font-family: var(--font-ui);
  font-size: .92rem;
  font-weight: 600;
  color: var(--text-bright);
}


.tr-controls {
  border: 1px solid var(--purple-med);
}
.tr-controls .st-section-title {
  background: var(--purple-dim);
  border-bottom-color: var(--purple-dim);
  color: var(--purple);
}
.tr-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 0;
}
.tr-row + .tr-row {
  border-top: 1px solid var(--divider-soft);
}
.tr-label {
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-dim);
}
.tr-btn-group {
  display: flex;
  gap: 3px;
}
.tr-btn {
  padding: 4px 10px;
  border-radius: var(--radius-sm);
  border: none;
  background: var(--surface-raised);
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
}
.tr-btn:hover { color: var(--text); }
.tr-btn.active {
  background: var(--purple);
  color: #fff;
}
.tr-toggle {
  width: 36px;
  height: 20px;
  border-radius: 10px;
  background: var(--surface-border-hi);
  cursor: pointer;
  position: relative;
  transition: background .2s;
}
.tr-toggle.on {
  background: var(--purple);
}
.tr-toggle-knob {
  position: absolute;
  top: 2px; left: 2px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: #fff;
  transition: transform .2s;
}
.tr-toggle.on .tr-toggle-knob {
  transform: translateX(16px);
}
.tr-info {
  font-size: .82rem;
  color: var(--text-muted);
  text-align: center;
  padding: 4px 0 0;
  font-style: italic;
}


.pc-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pc-header-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.pc-expand-btn {
  background: none;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  cursor: pointer;
  padding: 4px 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--ease);
}
.pc-expand-btn:hover { color: var(--text); border-color: var(--surface-border-strong); }
.pc-expand-btn svg { transition: transform .2s ease; }
.pc-expand-btn.expanded svg { transform: rotate(180deg); }
.pc-settings {
  margin-top: 8px;
  border-top: 1px solid var(--divider-soft);
  padding-top: 4px;
}
.pc-select {
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  padding: 4px 8px;
  outline: none;
  cursor: pointer;
  transition: border-color var(--ease);
}
.pc-select:focus { border-color: var(--blue-focus); }
.pc-select option { background: var(--panel); color: var(--text); }
.pc-layer-row { margin-top: 2px; }
.pc-layer-row .tr-label { font-size: .82rem; opacity: .7; }
.pc-explanation {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--divider-soft);
  font-family: var(--font-ui);
  font-size: .82rem;
  line-height: 1.45;
  color: rgba(255,255,255,.35);
}


.stm-overlay {
  position: fixed; inset: 0;
  background: var(--overlay-bg);
  z-index: 200; display: none;
  align-items: center; justify-content: center;
  backdrop-filter: blur(var(--overlay-blur));
}
.stm-overlay.open { display: flex; animation: optFadeIn .2s ease; }

.stm-panel {
  width: 100vw; max-width: 100vw;
  height: 100vh; max-height: 100vh;
  background: var(--panel);
  border: none;
  border-radius: 0;
  display: flex; flex-direction: row;
  box-shadow: var(--overlay-shadow);
  overflow: hidden;
  animation: optSlideIn .2s ease;
  font-family: var(--font-ui);
}


.stm-left-nav {
  width: 56px; flex-shrink: 0;
  display: flex; flex-direction: column; gap: 2px;
  padding: 16px 6px;
  background: var(--surface-veil);
  border-right: 1px solid var(--border);
}
.stm-nav-btn {
  padding: 10px 4px;
  border: none;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .62rem;
  font-weight: 700;
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap;
  text-align: center;
  letter-spacing: .03em;
  text-transform: uppercase;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
}
.stm-nav-btn svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.5; flex-shrink: 0; }
.stm-nav-btn:hover { color: var(--text); background: var(--divider-soft); }
.stm-nav-btn.active {
  background: var(--blue-dim);
  color: var(--blue);
}


.stm-right-content {
  flex: 1; display: flex; flex-direction: column;
  min-width: 0; overflow: hidden;
}

.stm-header {
  padding: 0;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--surface-veil) 0%, transparent 100%);
}
.stm-header-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 24px;
  gap: 16px;
}
.stm-header h3 {
  font-family: var(--font-ui);
  font-size: 1.2rem; font-weight: 700;
  color: var(--text-bright); white-space: nowrap;
  margin: 0;
  display: flex; align-items: center; gap: 10px;
}
.stm-header h3::before {
  content: '';
  display: inline-block;
  width: 3px; height: 18px;
  background: var(--blue);
  border-radius: 2px;
}
.stm-header-controls {
  display: flex; align-items: center; gap: 14px;
  margin-left: auto;
}
.stm-nav-tf {
  display: flex; gap: 2px;
  background: var(--surface-raised);
  border-radius: 10px;
  padding: 3px;
}
.stm-tf-btn {
  padding: 5px 0;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  min-width: 28px;
  text-align: center;
}
.stm-tf-btn:hover { color: var(--text); background: var(--surface-raised); }
.stm-tf-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}
.stm-lookback-row {
  display: flex; align-items: center; gap: 6px;
}
.stm-lookback-label {
  font-size: .7rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  white-space: nowrap;
}
.stm-nav-lb {
  display: flex; gap: 3px;
}
.stm-nav-lb .stm-lb-btn {
  padding: 4px 8px;
  border: none;
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  text-align: center;
}
.stm-nav-lb .stm-lb-btn:hover { color: var(--text); background: var(--surface-border); }
.stm-nav-lb .stm-lb-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}


.stm-main {
  flex: 1; display: flex; overflow: hidden;
}
.stm-metric-area {
  flex: 1; display: flex; flex-direction: column; overflow: hidden;
  border-right: 1px solid var(--border);
  min-width: 0;
}
.stm-insight-area {
  width: 440px; min-width: 380px; max-width: 480px;
  display: flex; flex-direction: column;
  background: var(--card);
  flex-shrink: 0;
  overflow: hidden;
}


.stm-ai-header {
  display: flex; align-items: center; gap: 14px;
  padding: 16px 18px; border-bottom: 1px solid rgba(167,139,250,.22);
  flex-shrink: 0;
  background:
    linear-gradient(135deg, rgba(88,28,135,.45) 0%, rgba(109,40,217,.28) 45%, rgba(30,64,175,.18) 100%),
    radial-gradient(120% 140% at 0% 0%, rgba(196,181,253,.15), transparent 60%);
  position: relative;
}
.stm-ai-header::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(167,139,250,.6), transparent);
}
.stm-ai-stars { width: 28px; height: 28px; flex-shrink: 0; fill: #f3e8ff; }
.stm-ai-stars .stm-star-big {
  fill: #f3e8ff; transform-origin: center; transform-box: fill-box;
  animation: stmPulseStar 5s ease-in-out infinite;
}
.stm-ai-stars .stm-star-small {
  fill: #f3e8ff; transform-origin: center; transform-box: fill-box;
  animation: stmPulseStar 5s ease-in-out infinite .5s;
}
@keyframes stmPulseStar {
  0%,100% { transform: rotate(-18deg) scale(1); filter: drop-shadow(0 0 4px rgba(216,180,254,.8)); }
  50%     { transform: rotate(18deg) scale(1.35); filter: drop-shadow(0 0 10px rgba(216,180,254,1)); }
}
.stm-ai-text { display: flex; flex-direction: column; gap: 2px; }
.stm-ai-title {
  font-family: var(--font-ui); font-size: .92rem; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase;
  background: linear-gradient(135deg, #d8b4fe, #a78bfa 40%, #7dd3fc);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  white-space: nowrap;
  line-height: 1.15;
}
.stm-ai-sub {
  font-family: var(--font-ui); font-size: .82rem;
  color: rgba(216,180,254,.75); font-weight: 400; white-space: nowrap;
  letter-spacing: .02em;
}


.stm-action-box {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px;
  padding: 12px 18px; border-bottom: 1px solid var(--border);
  background: var(--surface-veil);
}
.stm-action-item { text-align: center; padding: 8px 4px; background: var(--surface-veil); border-radius: var(--radius-sm); }
.stm-action-label { font-family: var(--font-ui); font-size: .6rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); margin-bottom: 3px; }
.stm-action-value { font-family: var(--font-ui); font-size: 1.1rem; font-weight: 700; line-height: 1.2; }
.stm-action-sub { font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted); margin-top: 1px; }


.stm-insight-scroll { flex: 1; overflow-y: auto; padding: 0; }
.stm-insight-scroll::-webkit-scrollbar { width: 5px; }
.stm-insight-scroll::-webkit-scrollbar-track { background: transparent; }
.stm-insight-scroll::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.stm-ins-section { padding: 16px 18px 20px; border-bottom: 1px solid var(--border); }
.stm-ins-section:last-child { border-bottom: none; }
.stm-ins-section-header { margin-bottom: 14px; }
.stm-ins-title-row { display: flex; align-items: baseline; gap: 8px; }
.stm-ins-num {
  font-family: var(--font-ui); font-size: 1.4rem; font-weight: 700;
  color: var(--text-bright); line-height: 1.15; letter-spacing: -.01em;
}
.stm-ins-title {
  font-family: var(--font-ui); font-size: 1.4rem; font-weight: 700;
  color: var(--text-bright); line-height: 1.15; letter-spacing: -.01em;
}
.stm-ins-subtitle { font-family: var(--font-ui); font-size: .82rem; font-weight: 500; color: var(--text-muted); margin-top: 4px; }


.stm-ins-prose { font-family: var(--font-ui); font-size: .93rem; line-height: 1.65; color: var(--text); margin-bottom: 10px; }
.stm-ins-prose:last-child { margin-bottom: 0; }
.stm-ins-prose strong { color: var(--text-bright); }
.stm-ins-prose .hl-green { color: var(--green); font-weight: 600; }
.stm-ins-prose .hl-red { color: var(--red); font-weight: 600; }
.stm-ins-prose .hl-amber { color: var(--amber); font-weight: 600; }
.stm-ins-prose .hl-blue { color: var(--blue); font-weight: 600; }
.stm-ins-prose .hl-white { color: var(--text-bright); font-weight: 600; }
.stm-ins-prose .hl { color: var(--text-bright); }
.stm-ins-prose .num { font-family: var(--font-ui); font-weight: 700; }


.stm-ins-widget {
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 14px;
}
.stm-ins-widget-title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 10px;
}


.stm-now-marker {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 8px; border-radius: 4px; font-size: .82rem; font-weight: 700;
  background: var(--blue-dim); border: 1px solid var(--blue-strong); color: var(--blue);
}
.stm-now-marker::before {
  content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--blue); animation: stmNowPulse 1.5s ease-in-out infinite;
}
@keyframes stmNowPulse { 0%,100%{opacity:.5;transform:scale(.8)} 50%{opacity:1;transform:scale(1.2)} }


.stm-streak-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: var(--radius-sm);
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
}
.stm-streak-badge.bull { background: var(--green-dim); color: var(--green); }
.stm-streak-badge.bear { background: var(--red-dim); color: var(--red); }


.stm-ins-metrics {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 2px; margin-bottom: 10px;
}
.stm-ins-metric { padding: 5px 6px; background: var(--surface-veil); border-radius: 4px; text-align: center; }
.stm-ins-metric-label { font-family: var(--font-ui); font-size: .6rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); margin-bottom: 2px; }
.stm-ins-metric-val { font-family: var(--font-ui); font-size: .82rem; font-weight: 700; }


.stm-ins-bell-wrap { position: relative; height: 62px; margin-bottom: 2px; }
.stm-ins-bell-svg { width: 100%; height: 62px; display: block; overflow: visible; }
.stm-ins-bell-labels {
  display: flex; justify-content: space-between; font-size: .82rem;
  color: var(--text-muted); margin-bottom: 8px; position: relative;
}
.stm-ins-bell-mu {
  position: absolute; transform: translateX(-50%);
  color: var(--text-bright); font-weight: 700;
}


.stm-ins-summary { margin-top: 16px; }
.stm-ins-summary-title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--text-dim); margin-bottom: 8px;
}
.stm-ins-summary-tbl {
  width: 100%; border-collapse: collapse;
  font-size: .82rem;
}
.stm-ins-summary-tbl td { padding: 7px 4px; border-bottom: 1px solid var(--divider-soft); }
.stm-ins-summary-tbl td:first-child { padding-left: 0; }
.stm-ins-summary-tbl td:last-child { padding-right: 0; }
.stm-ins-tbl-lbl {
  font-family: var(--font-ui); font-weight: 600;
  color: var(--text-muted); width: 38%;
}
.stm-ins-tbl-val {
  font-family: var(--font-ui); font-weight: 700;
  color: var(--text-bright); text-align: right; width: 32%;
}
.stm-ins-tbl-sub {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-dim); text-align: right; width: 30%;
}
.stm-ins-tbl-sep td {
  border-bottom: 1px solid var(--surface-border) !important;
  padding: 0 !important; height: 1px;
}


.stm-ins-regime-bar { position: relative; height: 24px; border-radius: 4px; overflow: hidden; margin: 8px 0; }
.stm-ins-regime-zone { position: absolute; top: 0; height: 100%; }
.stm-ins-regime-needle { position: absolute; top: -3px; width: 3px; height: 30px; background: #fff; border-radius: 2px; z-index: 5; transition: left .5s ease; }
.stm-ins-regime-labels { display: flex; justify-content: space-between; font-size: .82rem; color: var(--text-muted); }


.stm-ins-dir-bar { display: flex; height: 8px; border-radius: 4px; overflow: hidden; }
.stm-ins-dir-bull { background: var(--green); }
.stm-ins-dir-bear { background: var(--red); }
.stm-ins-dir-labels { display: flex; justify-content: space-between; margin-top: 5px; font-size: .82rem; font-weight: 600; }
.stm-ins-dir-labels .up { color: var(--green); }
.stm-ins-dir-labels .down { color: var(--red); }


.stm-collapse-trigger {
  display: flex; align-items: center; gap: 6px; cursor: pointer; padding: 6px 0; user-select: none;
}
.stm-collapse-trigger:hover .stm-ins-title { color: var(--blue); }
.stm-collapse-trigger .stm-caret { font-size: .6rem; color: var(--text-muted); transition: transform .2s ease; }
.stm-collapse-trigger.open .stm-caret { transform: rotate(90deg); }
.stm-collapse-body { display: none; }
.stm-collapse-body.open { display: block; }
.stm-glossary-item { margin-bottom: 8px; }
.stm-glossary-term { font-family: var(--font-ui); font-size: .88rem; font-weight: 700; color: var(--text-bright); margin-bottom: 1px; }
.stm-glossary-desc { font-family: var(--font-ui); font-size: .84rem; color: var(--text-dim); line-height: 1.45; }


.stm-hero-bar {
  display: flex; align-items: center; gap: 14px;
  padding: 6px 14px; margin-bottom: 16px;
  background: var(--blue-dim); border: 1px solid var(--blue-dim);
  border-radius: var(--radius-sm); font-family: var(--font-ui); font-size: .82rem;
}
.stm-hero-item { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.stm-hero-label { color: var(--text-muted); font-weight: 600; font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; }
.stm-hero-val { font-family: var(--font-ui); font-weight: 700; font-size: .82rem; }
.stm-hero-sep { width: 1px; height: 14px; background: var(--surface-border); flex-shrink: 0; }


.stm-ins-top-table { width: 100%; font-size: .82rem; border-collapse: collapse; margin-bottom: 10px; }
.stm-ins-top-table th { font-family: var(--font-ui); font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); text-align: left; padding: 4px 6px; border-bottom: 1px solid var(--border); }
.stm-ins-top-table td { font-family: var(--font-ui); padding: 5px 6px; border-bottom: 1px solid var(--hover-subtle); color: var(--text); }
.stm-ins-top-table tr:hover td { background: var(--hover-subtle); }
.stm-ins-top-table .up { color: var(--green); }
.stm-ins-top-table .down { color: var(--red); }


.stm-insight-scroll { position: relative; }
.stm-insight-scroll::after {
  content: ''; position: sticky; bottom: 0; left: 0; right: 0; height: 24px; display: block;
  background: linear-gradient(transparent, var(--card)); pointer-events: none;
}


.stm-reveal { opacity: 0; transform: translateY(12px); animation: stmReveal 1.2s ease forwards; }
@keyframes stmReveal { to { opacity: 1; transform: translateY(0); } }


.stm-bottom-charts {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 1px;
  border-top: 1px solid var(--border);
  background: var(--border);
}
.stm-bottom-chart {
  position: relative; height: 140px;
  background: var(--card);
  overflow: hidden;
  padding: 24px 6px 6px;
}
.stm-bottom-chart canvas { width: 100% !important; height: 100% !important; }
.stm-bottom-chart-label {
  position: absolute; top: 6px; left: 10px; z-index: 2;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted);
  opacity: .7;
}


.stm-bottom-chart--pct { padding: 24px 14px 8px; }
.stm-bottom-pct-wrap { height: 100%; display: flex; align-items: center; }
.stm-pct-gauges { width: 100%; }
.stm-pct-gauge-row {
  display: flex; align-items: center; gap: 8px; padding: 6px 0;
}
.stm-pct-gauge-row + .stm-pct-gauge-row { border-top: 1px solid var(--divider-soft); }
.stm-pct-gauge-label {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  color: var(--text-dim); width: 62px; flex-shrink: 0;
}
.stm-pct-gauge-track {
  flex: 1; height: 7px; border-radius: 4px; position: relative;
  background: linear-gradient(90deg, #3b82f6 0%, #60a5fa 15%, #a3a3a3 40%, #a3a3a3 60%, #f59e0b 85%, #ef4444 100%);
}
.stm-pct-gauge-marker {
  position: absolute; top: -4px; width: 3px; height: 15px;
  border-radius: 1px; transform: translateX(-50%);
  background: #fff;
  box-shadow: 0 0 6px rgba(0,0,0,.5);
}
.stm-pct-gauge-val {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  width: 28px; text-align: right; flex-shrink: 0;
}
.stm-pct-gauge-zone {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  width: 100px; text-align: right; flex-shrink: 0; text-transform: uppercase;
  letter-spacing: .03em;
}
.stm-pct-gauge-active {
  background: var(--divider-soft); border-radius: 4px;
  margin: 0 -4px; padding: 6px 4px !important;
}
.stm-pct-gauge-active .stm-pct-gauge-label { color: var(--text-bright); font-weight: 700; }
.stm-pct-gauge-active .stm-pct-gauge-marker {
  width: 4px; height: 16px; top: -5px;
  box-shadow: 0 0 8px rgba(255,255,255,.4);
}


.stm-insight-area .insight-header {
  font-family: var(--font-ui);
  font-size: 0.84rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--surface-raised);
}
.stm-insight-content { display: flex; flex-direction: column; gap: 12px; padding: 0 18px 18px; }


.stm-insight-view-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--blue);
  background: var(--blue-dim);
  padding: 4px 10px;
  border-radius: 4px;
  margin-bottom: 8px;
  display: inline-block;
  letter-spacing: .04em;
}

.stm-body {
  flex: 1;
  overflow-y: auto;
  padding: 24px 28px;
  scroll-behavior: smooth;
}
.stm-body::-webkit-scrollbar { width: 6px; }
.stm-body::-webkit-scrollbar-track { background: transparent; }
.stm-body::-webkit-scrollbar-thumb {
  background: var(--surface-border);
  border-radius: 3px;
}
.stm-body::-webkit-scrollbar-thumb:hover { background: var(--surface-border-strong); }


.stm-cards-grid {
  display: grid;
  gap: 10px;
  margin-bottom: 20px;
}
.stm-cards-6 { grid-template-columns: repeat(6, 1fr); }
.stm-cards-8 { grid-template-columns: repeat(8, 1fr); gap: 6px; margin-bottom: 14px; }
.stm-cards-8 .stm-card { padding: 8px 6px 7px; border-radius: 8px; }
.stm-cards-8 .stm-card-label { font-size: .82rem; margin-bottom: 3px; letter-spacing: .06em; }
.stm-cards-8 .stm-card-val { font-size: 1rem; }
.stm-cards-8 .stm-card-sub { font-size: .82rem; margin-top: 2px; }
.stm-cards-5 { grid-template-columns: repeat(5, 1fr); }
.stm-cards-4 { grid-template-columns: repeat(4, 1fr); }
.stm-cards-3 { grid-template-columns: repeat(3, 1fr); }
.stm-cards-2 { grid-template-columns: repeat(2, 1fr); }

.stm-card {
  background: var(--surface-veil);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px 14px 12px;
  text-align: center;
  min-width: 0;
  transition: border-color .15s, background .15s;
}
.stm-card:hover {
  border-color: var(--border-hi);
  background: var(--divider-soft);
}
.stm-card-label {
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.stm-card-val {
  font-family: var(--font-ui);
  font-size: 1.27rem;
  font-weight: 700;
  color: var(--text-bright);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}
.stm-card-sub {
  font-family: var(--font-ui);
  font-size: 0.9rem;
  color: var(--text-dim);
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stm-card-hint {
  font-size: .82rem;
  color: var(--text-faint);
  margin-top: 5px;
  font-style: italic;
  line-height: 1.4;
  white-space: normal;
  opacity: .8;
}


.stm-atr-row {
  font-size: 1.0rem;
  color: var(--text-dim);
  padding: 10px 16px;
  background: var(--surface-veil);
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 20px;
  font-family: var(--font-ui);
  display: flex;
  align-items: center;
  gap: 8px;
}
.stm-atr-row strong {
  font-family: var(--font-ui);
  color: var(--text-bright);
  font-weight: 700;
}


.stm-section {
  margin-bottom: 24px;
}
.stm-section-title {
  font-size: 0.89rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted);
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--surface-raised);
  display: flex;
  align-items: center;
  gap: 8px;
}
.stm-section-subtitle {
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.stm-section-subtitle .stm-section-badge {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  background: var(--surface-raised);
  padding: 2px 6px;
  border-radius: 3px;
}
.stm-section-title .stm-section-badge {
  font-size: .82rem;
  font-weight: 600;
  color: var(--blue);
  background: var(--blue-dim);
  padding: 2px 8px;
  border-radius: 3px;
  letter-spacing: .03em;
  text-transform: none;
}


.stm-chart-tabs {
  display: flex;
  gap: 2px;
  margin-bottom: 12px;
  padding: 3px;
  background: var(--hover-subtle);
  border-radius: 8px;
  border: 1px solid var(--hover-subtle);
}
.stm-chart-tab {
  flex: 1;
  padding: 7px 12px;
  border: none;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 0.94rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  text-align: center;
}
.stm-chart-tab:hover { color: var(--text); background: var(--divider-soft); }
.stm-chart-tab.active {
  background: var(--blue-dim);
  color: var(--blue);
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}


.stm-chart-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.stm-chart-toolbar .stm-chart-tabs {
  margin-bottom: 0;
  flex: 1;
}


.stm-overlay-btn {
  padding: 5px 12px;
  border: 1px solid var(--blue-strong);
  border-radius: 6px;
  background: var(--blue-dim);
  color: var(--blue);
  font-family: var(--font-ui);
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap;
  flex-shrink: 0;
}
.stm-overlay-btn:hover { background: var(--blue-dim); }
.stm-overlay-btn.active {
  background: var(--red-dim);
  border-color: var(--red-med);
  color: var(--red);
}
.stm-overlay-btn.active:hover { background: var(--red-strong); }


.stm-range-mode-switch {
  display: flex; gap: 2px; margin-bottom: 16px;
  padding: 3px; background: var(--hover-subtle);
  border-radius: var(--radius-sm); border: 1px solid var(--hover-subtle);
  width: fit-content;
}
.stm-range-mode-btn {
  padding: 6px 16px; border: none; border-radius: 4px;
  background: transparent; color: var(--text-dim);
  font-family: var(--font-ui); font-size: 0.85rem; font-weight: 600;
  cursor: pointer; transition: all var(--ease);
}
.stm-range-mode-btn:hover { background: var(--hover-subtle); color: var(--text); }
.stm-range-mode-btn.active {
  background: var(--blue-dim); color: var(--blue);
}


.stm-section-sticky-header,
.stm-ret-controls {
  display: flex; gap: 20px; flex-wrap: wrap; align-items: center;
  position: sticky;
  top: -24px;
  z-index: 100;
  background: var(--card); 
  margin: -24px -28px 16px;
  padding: 24px 28px 14px;
  border-bottom: 1px solid var(--border);
  box-shadow: 0 8px 14px -4px rgba(0, 0, 0, 0.6);
  isolation: isolate;
}
.stm-section-sticky-header .stm-range-mode-switch,
.stm-section-sticky-header .stm-compute-wrap { margin: 0; }
.stm-section-sticky-header .st-compute-row { flex-wrap: wrap; }
.stm-ret-control-group {
  display: flex; align-items: center; gap: 8px;
}
.stm-ret-control-label {
  font-family: var(--font-ui); font-size: 0.85rem; font-weight: 600;
  color: var(--text-dim); white-space: nowrap;
}
.stm-ret-pills {
  display: flex; gap: 2px; padding: 3px;
  background: var(--hover-subtle); border-radius: var(--radius-sm);
  border: 1px solid var(--hover-subtle);
}
.stm-ret-period-btn,
.stm-ret-lb-btn {
  padding: 5px 14px; border: none; border-radius: 4px;
  background: transparent; color: var(--text-dim);
  font-family: var(--font-ui); font-size: 0.85rem; font-weight: 600;
  cursor: pointer; transition: all var(--ease);
}
.stm-ret-period-btn:hover,
.stm-ret-lb-btn:hover { background: var(--hover-subtle); color: var(--text); }
.stm-ret-period-btn.active,
.stm-ret-lb-btn.active {
  background: var(--blue-dim); color: var(--blue);
}


.stm-ret-spinner {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 16px; padding: 80px 20px; color: var(--text-dim);
}
.stm-ret-spinner-ring {
  width: 36px; height: 36px; border: 3px solid var(--surface-border);
  border-top-color: var(--blue); border-radius: 50%;
  animation: stRetSpin 0.8s linear infinite;
}
@keyframes stRetSpin { to { transform: rotate(360deg); } }
.stm-ret-spinner-text {
  font-family: var(--font-ui); font-size: 0.92rem; font-weight: 500;
}


.stm-ret-custom-wrap {
  display: flex; align-items: center; gap: 2px;
  margin-left: 4px;
}
.stm-ret-custom-input {
  width: 48px; padding: 5px 6px; border: 1px solid var(--surface-border-hi);
  border-radius: 4px; background: var(--divider-soft);
  color: var(--text); font-family: var(--font-ui); font-size: 0.85rem;
  font-weight: 600; text-align: center; outline: none;
  transition: border-color var(--ease), color var(--ease);
  -moz-appearance: textfield;
}
.stm-ret-custom-input::-webkit-outer-spin-button,
.stm-ret-custom-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.stm-ret-custom-input:focus {
  border-color: var(--blue); color: var(--blue);
}
.stm-ret-custom-input::placeholder { color: var(--text-muted); font-weight: 500; }
.stm-ret-custom-label {
  font-family: var(--font-ui); font-size: 0.82rem; font-weight: 600;
  color: var(--text-dim);
}


.stm-rethist-section { position: relative; }
.stm-rethist-bin {
  position: absolute;
  top: 44px; left: 12px;
  z-index: 3;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0;
  pointer-events: auto;
}
.stm-rethist-bin .stm-ret-control-label { font-size: 0.82rem; color: var(--text-muted); }
.stm-rethist-bin .stm-ret-custom-input {
  width: 46px; height: 22px; padding: 2px 6px;
  font-size: 0.82rem;
  background: rgba(16,18,25,0.7);
  backdrop-filter: blur(4px);
}
.stm-rethist-bin .stm-ret-custom-label { font-size: 0.82rem; color: var(--text-muted); }


.stm-ret-fwd-summary {
  display: flex; gap: 6px; margin: 12px 0 16px; flex-wrap: wrap;
}
.stm-ret-fwd-card {
  flex: 1; min-width: 80px; padding: 10px 8px;
  background: var(--surface-veil); border: 1px solid var(--surface-raised);
  border-radius: var(--radius-sm); text-align: center;
}
.stm-ret-fwd-horizon {
  font-family: var(--font-ui); font-size: 0.82rem; font-weight: 700;
  color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.05em;
  margin-bottom: 4px;
}
.stm-ret-fwd-mean {
  font-family: var(--font-ui); font-size: 1.15rem; font-weight: 700;
}
.stm-ret-fwd-sub {
  font-family: var(--font-ui); font-size: 0.82rem; color: var(--text-dim);
  margin-top: 2px;
}
.stm-ret-fwd-wr {
  font-family: var(--font-ui); font-size: 0.82rem; font-weight: 600;
  margin-top: 2px;
}


.stm-grid-ret-fwd { grid-template-columns: 32px 110px repeat(6, 1fr); }


.stm-ins-chapter { margin-bottom: 20px; }
.stm-ins-chapter-title {
  font-family: var(--font-ui); font-size: 0.82rem; font-weight: 700;
  color: var(--blue); text-transform: uppercase; letter-spacing: 0.08em;
  padding: 8px 0 6px; margin-bottom: 8px;
  border-bottom: 1px solid rgba(77,166,255,.15);
}


.stm-ret-lwc-wrap {
  width: 100%; height: 280px;
  border-radius: var(--radius-sm);
  margin: 8px 0;
}


.stm-canvas-section {
  position: relative;
  background: var(--surface-veil);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-md);
  margin-bottom: 12px;
}
.stm-chart-type-toggle {
  position: absolute; top: 8px; right: 8px; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: var(--radius-sm);
  background: var(--divider-soft); border: 1px solid var(--surface-border);
  color: var(--text-dim); cursor: pointer;
  transition: all var(--ease);
}
.stm-chart-type-toggle:hover {
  background: rgba(255,255,255, var(--hover-medium));
  color: var(--text);
}


.stm-chart-overlays {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 8px 14px 8px;
}
.stm-cov-label {
  display: flex; align-items: center; gap: 6px;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  color: var(--text-dim); cursor: pointer;
  transition: color var(--ease);
}
.stm-cov-label:hover { color: var(--text); }
.stm-cov-cb {
  width: 14px; height: 14px; accent-color: var(--blue);
  cursor: pointer; margin: 0;
}
.stm-cov-swatch {
  width: 14px; height: 3px; border-radius: 2px; flex-shrink: 0;
}


.stm-chart-pane { display: none; }
.stm-chart-pane.active { display: block; }


.stm-canvas-wrap {
  width: 100%;
  position: relative;
  background: var(--surface-veil);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-md);
  padding: 16px 14px 12px;
  box-sizing: border-box;
}
.stm-canvas-section .stm-canvas-wrap {
  background: none;
  border: none;
  border-radius: 0;
  padding: 4px 14px 12px;
}
.stm-canvas-wrap canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.stm-canvas-tall {
  min-height: 380px;
  height: 380px;
}
.stm-chart-hist {
  height: 380px;
  position: relative;
}
.stm-chart-spark {
  height: 300px;
  position: relative;
}
.stm-chart-line {
  height: 320px;
  position: relative;
}
.stm-chart-donut {
  height: 220px;
  width: 220px;
  position: relative;
  margin: 0 auto;
}
.stm-chart-hbar {
  height: 200px;
  position: relative;
}


.stm-canvas-wrap:has(.stm-boxplot) {
  display: flex;
  align-items: center;
  justify-content: center;
}
.stm-boxplot {
  padding: 8px 0;
  width: 100%;
}
.stm-bp-stats {
  display: flex;
  align-items: baseline;
  gap: 20px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.stm-bp-stat {
  font-size: 0.84rem;
  color: var(--text-faint);
}
.stm-bp-stat b {
  font-family: var(--font-ui);
  color: var(--text-muted);
  font-weight: 600;
}
.stm-bp-container {
  position: relative;
  height: 100px;
  margin: 0 40px;
}
.stm-bp-labels {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 30px;
}
.stm-bp-label {
  position: absolute;
  transform: translateX(-50%);
  text-align: center;
  line-height: 1.2;
}
.stm-bp-tag {
  display: block;
  font-size: 0.7rem;
  color: var(--text-faint);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.stm-bp-val {
  display: block;
  font-family: var(--font-ui);
  font-size: 0.8rem;
  color: var(--text-bright);
  font-weight: 600;
}
.stm-bp-label.median .stm-bp-val { color: var(--blue); }
.stm-bp-label.median .stm-bp-tag { color: var(--blue); }

.stm-bp-track {
  position: absolute;
  top: 38px;
  left: 0;
  right: 0;
  height: 48px;
}
.stm-bp-whisker {
  position: absolute;
  top: 23px;
  height: 2px;
  background: var(--surface-border-strong);
}
.stm-bp-cap {
  position: absolute;
  width: 2px;
  height: 18px;
  top: 15px;
  background: rgba(255,255,255,.3);
  transform: translateX(-50%);
}
.stm-bp-box {
  position: absolute;
  top: 7px;
  height: 34px;
  background: var(--blue-dim);
  border: 1.5px solid var(--blue-focus);
  border-radius: 4px;
}
.stm-bp-median {
  position: absolute;
  top: 3px;
  height: 42px;
  width: 2.5px;
  background: var(--blue);
  border-radius: 2px;
  transform: translateX(-50%);
}
.stm-bp-dot {
  position: absolute;
  top: 21px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--blue);
  transform: translateX(-50%);
  opacity: .5;
}
.stm-bp-current {
  position: absolute;
  top: 17px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  border: 2.5px solid var(--blue);
  transform: translateX(-50%);
  z-index: 3;
  box-shadow: 0 0 10px var(--blue-focus);
}
.stm-bp-current-label {
  position: absolute;
  top: -6px;
  transform: translateX(-50%);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-bright);
  background: rgba(77,166,255,.9);
  padding: 2px 8px;
  border-radius: 4px;
  white-space: nowrap;
  z-index: 4;
}
.stm-bp-current-label::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(77,166,255,.9);
}
.stm-bp-kv {
  display: flex;
  gap: 20px;
  margin-top: 14px;
  flex-wrap: wrap;
}
.stm-bp-kv-item {
  font-size: .82rem;
}
.stm-bp-kv-item .k {
  color: var(--text-faint);
  margin-right: 6px;
}
.stm-bp-kv-item .v {
  font-family: var(--font-ui);
  color: var(--text-muted);
  font-weight: 600;
}
.stm-bp-kv-item .v.pos { color: var(--green); }
.stm-bp-kv-item .v.neg { color: var(--red); }
.stm-bp-kv-item .v.warn { color: var(--amber); }


.stm-chart-inner-title {
  text-align: center;
  font-family: var(--font-ui);
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: .01em;
  padding: 10px 0 4px;
}


.stm-chart-desc {
  font-size: 0.82rem;
  color: var(--text-faint);
  line-height: 1.45;
  margin-top: 10px;
  padding: 8px 12px;
  background: var(--surface-veil);
  border-left: 2px solid var(--blue);
  border-radius: 0 6px 6px 0;
}
.stm-canvas-section .stm-chart-desc {
  margin-top: 0;
  padding: 6px 14px 10px;
  background: none;
  border-left: none;
  border-radius: 0;
}


.stm-two-col {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 24px;
  margin-bottom: 24px;
  align-items: start;
}
.stm-two-col-streak {
  grid-template-columns: 1fr 1fr;
}
.stm-col {
  min-width: 0;
}


.stm-donut-wrap {
  display: flex;
  justify-content: center;
  padding: 12px;
}
.stm-donut-wrap canvas {
  display: block;
}


.stm-streak-stats {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 0;
}
.stm-streak-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: var(--hover-subtle);
  border: 1px solid var(--divider-soft);
  border-radius: 8px;
  transition: background .1s;
}
.stm-streak-row:hover { background: var(--hover-subtle); }
.stm-streak-lbl {
  font-size: 0.97rem;
  color: var(--text-dim);
  font-weight: 500;
}
.stm-streak-val {
  font-family: var(--font-ui);
  font-size: 1.07rem;
  font-weight: 700;
}
.stm-streak-val.up { color: var(--green); }
.stm-streak-val.down { color: var(--red); }


.stm-percentiles { display: flex; flex-direction: column; gap: 6px; }
.stm-pct-row {
  display: flex; align-items: center; gap: 10px;
  padding: 4px 0;
  transition: background .1s;
  border-radius: 4px;
}
.stm-pct-row:hover { background: var(--hover-subtle); }
.stm-pct-label {
  font-size: 0.9rem;
  color: var(--text-dim);
  width: 100px;
  text-align: right;
  flex-shrink: 0;
  font-family: var(--font-ui);
  font-weight: 500;
}
.stm-pct-bar-wrap {
  flex: 1;
  height: 22px;
  background: var(--divider-soft);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}
.stm-pct-bar {
  height: 100%;
  border-radius: 4px;
  transition: width .4s cubic-bezier(.25,.46,.45,.94);
  position: relative;
}
.stm-pct-bar::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 60%, var(--surface-border) 100%);
  border-radius: 4px;
}
.stm-pct-val {
  font-family: var(--font-ui);
  font-size: 1.0rem;
  font-weight: 700;
  color: var(--text);
  width: 52px;
  text-align: right;
  flex-shrink: 0;
}
.stm-pct-count {
  font-family: var(--font-ui);
  font-size: 0.91rem;
  color: var(--text-muted);
  width: 32px;
  text-align: right;
  flex-shrink: 0;
}


.stm-ext-year-filter {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  padding: 10px 14px;
  background: var(--hover-subtle);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-md);
}
.stm-ext-filter-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  flex-shrink: 0;
}
.stm-ext-slider-val {
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 700;
  color: var(--text-bright);
  min-width: 36px;
  text-align: center;
  flex-shrink: 0;
}
.stm-ext-slider-wrap {
  flex: 1;
  position: relative;
  height: 20px;
  display: flex;
  align-items: center;
  border-radius: 3px;
  background: var(--surface-border);
}
.stm-ext-slider {
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  left: 0; right: 0;
  width: 100%;
  height: 4px;
  background: transparent;
  pointer-events: none;
  outline: none;
}
.stm-ext-slider::-webkit-slider-runnable-track {
  height: 4px;
  background: transparent;
  border-radius: 2px;
}
.stm-ext-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 4px; height: 16px;
  border-radius: 2px;
  background: #fff;
  border: none;
  cursor: pointer;
  pointer-events: auto;
  margin-top: -6px;
  position: relative;
  z-index: 2;
}
.stm-ext-slider::-moz-range-track {
  height: 4px;
  background: transparent;
  border-radius: 2px;
  border: none;
}
.stm-ext-slider::-moz-range-thumb {
  width: 4px; height: 16px;
  border-radius: 2px;
  background: #fff;
  border: none;
  cursor: pointer;
  pointer-events: auto;
}
.stm-ext-filter-count {
  margin-left: auto;
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-faint);
  flex-shrink: 0;
}


.stm-sub-tabs-wrap { margin-bottom: 20px; }
.stm-sub-tabs {
  display: flex; gap: 2px;
  padding: 3px;
  background: var(--hover-subtle);
  border-radius: 8px;
  border: 1px solid var(--hover-subtle);
}
.stm-sub-tab {
  padding: 8px 18px;
  border-radius: var(--radius-sm);
  border: none;
  background: none;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 1.0rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
}
.stm-sub-tab:hover { color: var(--text); background: var(--divider-soft); }
.stm-sub-tab.active {
  background: var(--blue-dim);
  color: var(--blue);
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}


.stm-pane { display: none; }
.stm-pane.active { display: block; }


.stm-grid-wrap {
  max-height: 420px;
  overflow-y: auto;
  border: 1px solid var(--surface-raised);
  border-radius: 10px;
  background: var(--surface-veil);
}
.stm-grid-wrap::-webkit-scrollbar { width: 5px; }
.stm-grid-wrap::-webkit-scrollbar-track { background: transparent; }
.stm-grid-wrap::-webkit-scrollbar-thumb { background: var(--surface-border-hi); border-radius: 3px; }

.stm-grid {
  display: grid;
}
.stm-grid-8 { grid-template-columns: 46px 110px repeat(6, 1fr); }
.stm-grid-7 { grid-template-columns: 46px 110px repeat(5, 1fr); }


.stm-gh {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--panel);
  padding: 10px 12px;
  font-size: 0.84rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-muted);
  border-bottom: 2px solid var(--border);
  text-align: right;
  cursor: pointer;
  user-select: none;
  transition: color .12s;
  white-space: nowrap;
}
.stm-gh:hover { color: var(--blue); }
.stm-gh.sort-asc::after  { content: ' \u25B2'; font-size: .82rem; color: var(--blue); }
.stm-gh.sort-desc::after { content: ' \u25BC'; font-size: .82rem; color: var(--blue); }
.stm-gh.gc { text-align: center; }
.stm-gh.gl { text-align: left; }


.stm-gd {
  padding: 8px 12px;
  font-family: var(--font-ui);
  font-size: 0.94rem;
  color: var(--text);
  text-align: right;
  white-space: nowrap;
  border-bottom: 1px solid var(--hover-subtle);
}


.stm-grow {
  display: contents;
  cursor: pointer;
}
.stm-grow:hover > .stm-gd { background: var(--blue-dim); }
.stm-grow:nth-child(even) > .stm-gd { background: var(--surface-veil); }
.stm-grow:hover > .stm-gd { background: var(--blue-dim); }


.stm-gd.gc {
  text-align: center;
  color: var(--text-muted);
  font-size: 0.88rem;
  font-weight: 600;
}
.stm-gd.gl {
  text-align: left;
  color: var(--text-soft);
  font-family: var(--font-ui);
  font-size: 0.96rem;
  font-weight: 500;
}


.stm-grow:nth-child(-n+3) > .stm-gd.gc {
  color: var(--amber);
  font-weight: 700;
}


.stm-grow.st-ext-bull > .stm-gd { background: rgba(38,217,127,.08); }
.stm-grow.st-ext-bear > .stm-gd { background: rgba(240,80,110,.08); }
.stm-grow.st-ext-bull:hover > .stm-gd { background: rgba(38,217,127,.16); }
.stm-grow.st-ext-bear:hover > .stm-gd { background: rgba(240,80,110,.16); }
.stm-grow.st-ext-bull > .stm-gd:last-child { color: var(--green); font-weight: 600; }
.stm-grow.st-ext-bear > .stm-gd:last-child { color: var(--red); font-weight: 600; }


.stm-summary { display: flex; gap: 12px; margin-bottom: 20px; }
.stm-summary .stm-card { flex: 1; }
.stm-dist { margin-bottom: 20px; }
.stm-dist-title {
  font-size: 0.91rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted);
  margin-bottom: 8px;
}


.stm-ai-tabs {
  display: flex;
  gap: 4px;
  padding: 8px 18px 0;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.stm-ai-tab {
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 8px 14px;
  font-family: var(--font-ui);
  font-size: .88rem;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  letter-spacing: .04em;
  transition: var(--ease);
  margin-bottom: -1px;
}
.stm-ai-tab:hover { color: var(--text); background: rgba(255,255,255,var(--hover-subtle)); border-radius: var(--radius-sm) var(--radius-sm) 0 0; }
.stm-ai-tab.active { color: #fff; border-bottom-color: #fff; background: transparent; border-radius: 0; }

.stm-ai-pane { display: none; flex: 1; flex-direction: column; min-height: 0; }
.stm-ai-pane.active { display: flex; }


.stm-help-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}
.stm-help-scroll::-webkit-scrollbar { width: 5px; }
.stm-help-scroll::-webkit-scrollbar-track { background: transparent; }
.stm-help-scroll::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }
.stm-help-content {
  padding: 18px;
  font-family: var(--font-ui);
  font-size: .93rem;
  line-height: 1.65;
  color: var(--text);
}
.stm-help-content .stm-help-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text-bright);
  margin-bottom: 10px;
  letter-spacing: -.005em;
}
.stm-help-content .stm-help-section { margin-bottom: 14px; }
.stm-help-content .stm-help-section:last-child { margin-bottom: 0; }
.stm-help-content .stm-help-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-bright);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 4px;
  display: block;
}
.stm-help-content p { margin: 0 0 10px; }
.stm-help-content p:last-child { margin-bottom: 0; }
.stm-help-content strong { color: var(--text-bright); }
.stm-help-content code {
  background: var(--surface-veil);
  padding: 1px 6px;
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: .88rem;
  color: var(--blue);
}
.stm-help-tip {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  background: var(--surface-veil);
  border-left: 2px solid var(--blue);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin-bottom: 14px;
  font-size: .9rem;
  line-height: 1.5;
}
.stm-help-tip-icon {
  font-size: 1.1rem;
  line-height: 1;
  flex-shrink: 0;
}
.stm-help-tip-strong {
  background: linear-gradient(135deg, rgba(167,139,250,.12), rgba(125,211,252,.06));
  border-left-color: #a78bfa;
  border-left-width: 3px;
  padding: 12px 14px;
}
.stm-help-tip-strong strong {
  display: inline-block;
  color: #d8b4fe;
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 4px;
}


.stm-direction-trio { margin-top: 12px; align-items: stretch; }
.stm-direction-card {
  display: flex;
  flex-direction: column;
  padding: 14px 16px;
  text-align: left;
}
.stm-direction-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--surface-raised);
}
.stm-direction-card-head .stm-card-label {
  margin: 0;
  flex: 1;
  text-align: left;
}
.stm-direction-card-head .stm-section-badge {
  font-size: .72rem;
  font-weight: 600;
  color: var(--blue);
  background: rgba(77,166,255,.12);
  padding: 2px 6px;
  border-radius: 3px;
}
.stm-direction-card .stm-direction-donut-mini {
  position: relative;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stm-direction-card .stm-direction-donut-mini canvas {
  max-width: 100% !important;
  max-height: 100% !important;
}
.stm-direction-card .stm-streak-stats {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  padding: 0;
}
.stm-direction-card .stm-streak-stats .stm-streak-row {
  padding: 6px 12px;
}
.stm-direction-card .stm-canvas-wrap.stm-chart-hbar {
  height: 150px !important;
  min-height: 0;
  padding: 8px 10px;
}


.stm-ret-cards-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 4px 8px;
  gap: 8px;
}
.stm-ret-cards-title {
  font-family: var(--font-ui);
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: .01em;
}


.stm-chart-inner-title-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 0 4px;
}
.stm-chart-inner-title-wrap .stm-chart-inner-title { padding: 0; }

.stm-chart-inner-title-wrap:has(.stm-section-title) {
  justify-content: flex-start;
  padding: 0 0 8px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--surface-raised);
}
.stm-chart-inner-title-wrap .stm-section-title {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
  flex: 1;
}
.stm-chart-help-btn {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--surface-border);
  background: var(--surface-veil);
  color: var(--text-muted);
  border-radius: 50%;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
  line-height: 1;
  padding: 0;
  transition: var(--ease);
}
.stm-chart-help-btn:hover {
  background: rgba(167,139,250,.18);
  border-color: rgba(167,139,250,.6);
  color: #d8b4fe;
}
.stm-chart-help-btn.active {
  background: rgba(167,139,250,.28);
  border-color: rgba(167,139,250,.8);
  color: #f3e8ff;
  box-shadow: 0 0 0 3px rgba(167,139,250,.12);
}


@media (max-width: 1100px) {
  .stm-insight-area { width: 340px; min-width: 300px; }
}
@media (max-width: 900px) {
  .stm-panel { flex-direction: column; }
  .stm-left-nav {
    width: auto; flex-direction: row; gap: 2px;
    padding: 8px 12px; border-right: none;
    border-bottom: 1px solid var(--border);
  }
  .stm-main { flex-direction: column; }
  .stm-metric-area { border-right: none; border-bottom: 1px solid var(--border); }
  .stm-insight-area { width: auto; max-width: none; max-height: 40vh; min-width: auto; }
}
@media (max-width: 700px) {
  .stm-cards-5 { grid-template-columns: repeat(3, 1fr); }
  .stm-cards-4 { grid-template-columns: repeat(2, 1fr); }
  .stm-cards-3 { grid-template-columns: repeat(2, 1fr); }
  .stm-two-col { grid-template-columns: 1fr; }
  .stm-panel { width: 100vw; height: 100vh; }
  .stm-body { padding: 14px 16px; }
  .stm-chart-hist, .stm-canvas-tall { height: 280px; min-height: 280px; }
  .stm-chart-spark { height: 220px; }
  .stm-header-controls { gap: 8px; }
  .stm-header-top { padding: 10px 14px; gap: 10px; }
}




:root { --ws-help-w: 430px; }
.ws-frame { display: flex; width: 100%; height: 100%; min-width: 0; }
.ws-nav {
  width: 248px; flex: 0 0 248px; display: flex; flex-direction: column;
  background: var(--panel); border-right: 1px solid var(--border);
  font-family: var(--font-ui); overflow-y: auto;
}
.ws-nav-head { padding: 14px 16px 10px; border-bottom: 1px solid var(--border); }

.ws-close-btn {
  position: fixed; top: 14px; right: 16px; z-index: 100050;
  display: inline-flex; align-items: center; gap: 7px;
  padding: 8px 16px 8px 12px;
  font-family: var(--font-ui); font-size: .95rem; font-weight: 600; line-height: 1;
  color: var(--text-bright);
  background: color-mix(in srgb, var(--purple) 18%, var(--panel));
  border: 1px solid color-mix(in srgb, var(--purple) 45%, transparent);
  border-radius: var(--radius-sm); cursor: pointer;
  box-shadow: 0 4px 14px rgba(0,0,0,.22);
  transition: background var(--ease), border-color var(--ease), right .28s var(--ease);
}
.ws-close-btn:hover { background: color-mix(in srgb, var(--purple) 30%, var(--panel)); border-color: var(--purple); }
.ws-close-btn svg { flex: 0 0 15px; }
.stm-overlay.ws-help-shift .ws-close-btn { right: calc(var(--ws-help-w) + 16px); }
.ws-nav-title { font-size: 1.05rem; font-weight: 700; color: var(--text-bright); display: flex; align-items: center; gap: 8px; }
.ws-nav-sym { font-size: .85rem; color: var(--text-dim); margin-top: 2px; }
.ws-nav-search {
  margin: 10px 12px; padding: 7px 10px; display: flex; align-items: center; gap: 8px;
  border: 1px solid var(--border-hi); border-radius: var(--radius-sm);
  color: var(--text-dim); font-size: .88rem; cursor: pointer; background: var(--surface-veil);
}
.ws-nav-search:hover { background: var(--hover-subtle); }
.ws-nav-search kbd {
  margin-left: auto; font-family: var(--font-ui); font-size: .74rem; font-weight: 600;
  border: 1px solid var(--border-hi); border-radius: 4px; padding: 1px 5px; color: var(--text-muted);
}
.ws-nav-body { flex: 1; padding: 6px 8px 12px; }
.ws-nav-group { margin-top: 14px; }
.ws-nav-group-label {
  font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted); padding: 0 10px 5px;
}
.ws-nav-group-label-other { color: var(--purple); }
.ws-nav-item {
  display: flex; align-items: center; gap: 9px; width: 100%;
  padding: 7px 12px; border: none; background: transparent; cursor: pointer;
  border-radius: var(--radius-sm); font-family: var(--font-ui);
  font-size: .92rem; font-weight: 500; color: var(--text-dim); text-align: left;
  position: relative; transition: background var(--ease), color var(--ease);
}
.ws-nav-item:hover { background: var(--hover-subtle); color: var(--text); }
.ws-nav-item.active { color: var(--text-bright); font-weight: 600; }
.ws-nav-item.active::before {
  content: ""; position: absolute; left: 0; top: 5px; bottom: 5px; width: 2.5px;
  background: var(--text-bright); border-radius: 2px;
}
.ws-nav-num {
  flex: 0 0 22px; font-size: .72rem; font-weight: 600; letter-spacing: .04em;
  color: var(--text-muted); font-variant-numeric: tabular-nums;
}
.ws-nav-item.active .ws-nav-num { color: var(--text-bright); }
.ws-nav-foot { border-top: 1px solid var(--border); padding: 10px 12px; }
.ws-nav-report-btn {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 8px 10px; border: 1px solid color-mix(in srgb, var(--purple) 35%, transparent); border-radius: var(--radius-sm);
  background: linear-gradient(120deg, color-mix(in srgb, var(--purple) 10%, transparent), transparent);
  font-family: var(--font-ui); font-size: .9rem; font-weight: 600; color: var(--text-bright);
  cursor: pointer; transition: background var(--ease);
}
.ws-nav-report-btn:hover { background: color-mix(in srgb, var(--purple) 16%, transparent); }
.ws-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ws-scroll { flex: 1; overflow-y: auto; }
.ws-page { max-width: 1280px; margin: 0 auto; padding: 22px 26px 40px; }
.ws-report { max-width: 1020px; margin: 0 auto; }
.ws-view-label {
  display: flex; align-items: center; gap: 9px; margin: 32px 0 10px;
  font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted);
}
.ws-view-label::before { content: ""; width: 14px; height: 1.5px; background: currentColor; opacity: .55; }
.ws-view-help {
  width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--border-hi);
  background: transparent; color: var(--text-dim); cursor: pointer;
  font-family: var(--font-ui); font-size: .72rem; font-weight: 700; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background var(--ease), color var(--ease);
}
.ws-view-help:hover { background: var(--hover-medium); color: var(--text-bright); }
.ws-ov-head { padding: 6px 0 4px; }
.ws-ov-titlerow { display: flex; align-items: center; gap: 11px; }
.ws-ov-title { font-size: 1.7rem; font-weight: 700; color: var(--text-bright); line-height: 1.15; letter-spacing: .01em; }
.ws-ov-sub { font-size: 1.05rem; color: var(--text-dim); margin-top: 9px; max-width: 760px; line-height: 1.5; }
.ws-intro { max-width: 780px; margin-top: 6px; }
.ws-intro .stm-ins-prose { font-size: .98rem; line-height: 1.6; margin-bottom: 10px; }
.ws-intro kbd {
  font-family: var(--font-ui); font-size: .76rem; font-weight: 600; vertical-align: 1px;
  border: 1px solid var(--border-hi); border-radius: 4px; padding: 1px 5px; color: var(--text-muted);
}
.ws-tool-head { margin-bottom: 14px; }
.ws-tool-title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ws-tool-ico { font-size: 1.15rem; opacity: .8; }
.ws-tool-title { font-size: 1.1rem; font-weight: 600; color: var(--text-dim); line-height: 1.15; letter-spacing: .01em; }
.ws-tool-cat {
  font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  color: var(--text-muted); border: 1px solid var(--border-hi); border-radius: 999px; padding: 1px 9px;
}
.ws-tool-hot {
  font-size: .72rem; font-weight: 700; letter-spacing: .05em;
  color: var(--purple); background: color-mix(in srgb, var(--purple) 14%, transparent); border-radius: 999px; padding: 1px 8px;
}
.ws-tool-question { font-size: 1.55rem; font-weight: 700; color: var(--text-bright); line-height: 1.25; margin-top: 8px; max-width: 900px; }
.ws-tool-sample { font-size: .9rem; font-weight: 500; color: var(--text-dim); margin-top: 7px; }
.ws-tool-sample b { color: var(--text); font-weight: 600; }
.ws-ai-note { margin: 18px 0 24px; }
.ws-ai-note .stm-ins-prose { margin: 0 0 11px; font-size: .98rem; line-height: 1.6; }
.ws-ai-note .stm-ins-prose:last-child { margin-bottom: 0; }
.ws-ai-note .stm-ins-metrics { margin-bottom: 12px; }
.ws-fig { margin-bottom: 8px; }
.ws-fig-cap { font-size: .82rem; font-weight: 600; color: var(--text-muted); margin: 8px 2px 0; text-align: center; }
.ws-controls { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 0 0 12px; }
.ws-ctrl-group { display: flex; align-items: center; gap: 7px; }
.ws-ctrl-label { font-size: .84rem; font-weight: 600; color: var(--text-dim); }
.ws-deep { margin-top: 30px; border-top: 1px solid var(--border); padding-top: 16px; }
.ws-deep-title {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-muted); margin-bottom: 12px;
}
.ws-deep-title::before { content: ""; width: 16px; height: 1.5px; background: currentColor; opacity: .55; }
.ws-dd-label {
  font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--purple); margin: 14px 0 5px;
}
.ws-dd-label:first-of-type { margin-top: 0; }
.ws-deep .stm-ins-prose { max-width: 900px; }
.ws-deep-links { margin-top: 16px; }
.ws-deep-links a {
  display: inline-block; font-size: .9rem; font-weight: 600; color: var(--purple);
  cursor: pointer; margin-right: 18px; text-decoration: none;
}
.ws-deep-links a:hover { text-decoration: underline; }
.ws-chip {
  display: inline-block; margin-left: 8px; padding: 2px 9px;
  border-radius: 999px; font-size: .82rem; font-weight: 700;
  letter-spacing: .03em; vertical-align: 1px; white-space: nowrap;
}
.ws-stub {
  margin-top: 8px; padding: 26px; text-align: center;
  border: 1px dashed var(--border-hi); border-radius: var(--radius-md); color: var(--text-dim);
  font-size: .95rem;
}
.ws-palette-overlay {
  display: none; position: fixed; inset: 0; z-index: 100000;
  background: rgba(0,0,0,.35); backdrop-filter: blur(2px);
}
.ws-palette-overlay.open { display: block; }
.ws-palette {
  width: 560px; max-width: 92vw; margin: 12vh auto 0;
  background: var(--panel); border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg); box-shadow: var(--overlay-shadow); overflow: hidden;
  font-family: var(--font-ui);
}
.ws-palette input {
  width: 100%; padding: 14px 16px; border: none; outline: none;
  background: transparent; color: var(--text-bright);
  font-family: var(--font-ui); font-size: 1rem; border-bottom: 1px solid var(--border);
}
.ws-palette-results { max-height: 320px; overflow-y: auto; padding: 6px; }
.ws-palette-item {
  display: flex; align-items: baseline; gap: 10px; padding: 9px 12px;
  border-radius: var(--radius-sm); cursor: pointer;
}
.ws-palette-item:hover, .ws-palette-item.sel { background: color-mix(in srgb, var(--purple) 12%, transparent); }
.ws-palette-item .nm { font-size: .95rem; font-weight: 700; color: var(--text-bright); white-space: nowrap; }
.ws-palette-item .qq { font-size: .85rem; color: var(--text-dim); }
.ws-palette-empty { padding: 16px; text-align: center; color: var(--text-muted); font-size: .9rem; }
.stm-ins-ref {
  color: var(--purple); font-weight: 600; cursor: pointer;
  border-bottom: 1px dashed color-mix(in srgb, var(--purple) 65%, transparent);
  border-radius: 3px; padding: 0 2px; margin: 0 -2px;
  transition: background var(--ease), color var(--ease);
}
:root:not([data-theme="light"]) .stm-ins-ref { color: var(--purple); }
.stm-ins-ref:hover { background: color-mix(in srgb, var(--purple) 16%, transparent); border-bottom-style: solid; }
.stm-hl-flash { animation: sectionFlash 1.4s ease-out 1; border-radius: var(--radius-md); }
.stm-grow.stm-row-hl { background: color-mix(in srgb, var(--purple) 18%, transparent) !important; }
.stm-rpt-yearpanel {
  margin: 12px 0 0; padding: 0 16px;
  max-height: 0; overflow: hidden; opacity: 0;
  border-radius: var(--radius-md);
  background: var(--surface-veil);
  border: 1px solid transparent;
  transition: max-height .35s var(--ease), opacity .25s var(--ease), padding .35s var(--ease), border-color .25s var(--ease);
}
.stm-rpt-yearpanel.open { max-height: 1100px; opacity: 1; padding: 16px; border-color: color-mix(in srgb, var(--purple) 30%, transparent); }
.stm-rpt-yearpanel-close {
  float: right; width: 26px; height: 26px; font-size: 1.2rem; line-height: 1;
  border-radius: var(--radius-sm); border: none; background: transparent;
  color: var(--text-dim); cursor: pointer;
}
.stm-rpt-yearpanel-close:hover { background: var(--hover-medium); color: var(--text-bright); }
.stm-yr-hero { display: flex; align-items: baseline; gap: 12px; margin: 4px 0 4px; }
.stm-yr-hero-year { font-size: 2rem; font-weight: 700; color: var(--text-bright); }
.stm-yr-hero-ret { font-size: 1.5rem; font-weight: 700; }
.stm-yr-hero-rank { font-size: .9rem; color: var(--text-dim); margin-bottom: 8px; }
.ws-leg-label {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted); margin: 12px 0 5px;
}
.ws-leg-label::before { content: ""; width: 14px; height: 1.5px; background: currentColor; opacity: .55; }
.stm-rpt { font-family: var(--font-ui); max-width: 1080px; margin: 0 auto; }
.stm-rpt-chapter { padding: 24px 0 28px; border-bottom: 1px solid var(--border); }
.stm-rpt-chapter:last-child { border-bottom: none; }
.stm-rpt-chapter-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 3px; }
.stm-rpt-chapter-num { font-size: 1.5rem; font-weight: 700; color: var(--purple); line-height: 1.1; }
.stm-rpt-chapter-title { font-size: 1.4rem; font-weight: 700; color: var(--text-bright); line-height: 1.15; }
.stm-rpt-chapter-sub { font-size: .85rem; font-weight: 500; color: var(--text-muted); margin: 0 0 16px; }
.stm-rpt-leg { margin: 14px 0; }
.stm-rpt-leg-label {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-muted); margin-bottom: 6px;
}
.stm-rpt-leg-label::before { content: ""; width: 14px; height: 1.5px; background: currentColor; opacity: .55; }
.stm-rpt-leg-today .stm-rpt-leg-label { color: var(--purple); }
.stm-rpt-leg-today {
  border-left: 2px solid color-mix(in srgb, var(--purple) 45%, transparent);
  padding: 4px 0 4px 14px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--purple) 6%, transparent), transparent 60%);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.stm-rpt-verdict {
  margin: 20px 0; padding: 16px 18px;
  border-radius: var(--radius-md);
  background: linear-gradient(120deg, color-mix(in srgb, var(--purple) 10%, transparent), color-mix(in srgb, var(--purple) 3%, transparent) 55%, transparent);
  border: 1px solid color-mix(in srgb, var(--purple) 28%, transparent);
}
.stm-rpt-verdict-label {
  display: flex; align-items: center; gap: 8px;
  font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--purple); margin-bottom: 9px;
}
.stm-rpt-verdict-label svg { width: 16px; height: 16px; }
.stm-rpt-verdict-label svg path { fill: var(--purple); }
.stm-rpt-verdict .stm-ins-prose { font-size: 1rem; margin: 0 0 8px; }
.stm-rpt-verdict .stm-ins-prose:last-child { margin-bottom: 0; }
.stm-rpt-fig { margin: 16px 0 4px; }
.stm-rpt-fig-cap { font-size: .82rem; font-weight: 600; color: var(--text-muted); margin: 8px 2px 2px; text-align: center; }
.ws-substrip {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  margin: 0 0 8px; padding: 10px 4px;
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(8px); border-bottom: 1px solid var(--border);
}
.ws-substrip-sym { font-size: .92rem; font-weight: 700; color: var(--text-bright); }
.ws-substrip-sym span { color: var(--text-dim); font-weight: 500; margin-left: 6px; }
.ws-chap { scroll-margin-top: 64px; padding: 26px 0 30px; border-bottom: 1px solid var(--border); }
.ws-chap:last-child { border-bottom: none; }
.ws-chap-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px; }
.ws-chap-num {
  flex: 0 0 auto; font-size: 1.35rem; font-weight: 700; line-height: 1;
  color: var(--text-muted); font-variant-numeric: tabular-nums; padding-top: 3px;
}
.ws-chap-head-main { min-width: 0; }
.ws-chap-titlerow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ws-chap-title { font-size: 1.35rem; font-weight: 700; color: var(--text-bright); line-height: 1.15; }
.ws-chap-q { font-size: 1.02rem; font-weight: 500; color: var(--text-dim); margin-top: 5px; max-width: 880px; line-height: 1.4; }
.ws-chap-intro .ws-chap-title { font-size: 1.55rem; }
.ws-chart-card {
  margin: 18px 0 6px; border: 1px solid var(--border); border-radius: var(--radius-lg);
  background: var(--surface-veil); overflow: hidden;
}
.ws-chart-card-head {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px 9px 14px; border-bottom: 1px solid var(--border);
}
.ws-chart-card-title { font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.ws-chart-card-tools { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.ws-chart-expand-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 11px; border: 1px solid var(--border-hi); border-radius: var(--radius-sm);
  background: transparent; color: var(--text-dim); cursor: pointer;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600; transition: background var(--ease), color var(--ease);
}
.ws-chart-expand-btn:hover { background: var(--hover-subtle); color: var(--text-bright); }
.ws-chart-expand-btn svg { width: 14px; height: 14px; }
.ws-chart-body { padding: 14px; }
.ws-chart-body .ws-fig-cap { margin-top: 12px; }
.ws-chart-body .stm-canvas-wrap.stm-chart-hist { height: 260px; }
.ws-chart-body .stm-ret-lwc-wrap { height: 260px; }
.ws-chart-card-head .stm-ret-custom-input { width: 64px; }
.ws-chart-modal {
  display: none; position: fixed; inset: 0; z-index: 100001;
  background: rgba(0,0,0,.55); backdrop-filter: blur(4px);
}
.ws-chart-modal.open { display: flex; }
.ws-chart-modal-inner {
  margin: auto; width: min(1240px, 94vw); height: min(86vh, 860px);
  display: flex; flex-direction: column;
  background: var(--panel); border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg); box-shadow: var(--overlay-shadow); overflow: hidden;
}
.ws-chart-modal-head {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; border-bottom: 1px solid var(--border);
}
.ws-chart-modal-title { font-size: 1rem; font-weight: 700; color: var(--text-bright); }
.ws-chart-modal-close {
  margin-left: auto; width: 30px; height: 30px; font-size: 1.3rem; line-height: 1;
  border: none; background: transparent; color: var(--text-dim);
  border-radius: var(--radius-sm); cursor: pointer;
}
.ws-chart-modal-close:hover { background: var(--hover-medium); color: var(--text-bright); }
.ws-chart-modal-body { flex: 1; min-height: 0; padding: 16px; display: flex; overflow: auto; }
.ws-chart-modal-body > * { flex: 1; min-width: 0; }
.ws-help-btn { margin-left: 8px; vertical-align: middle; }
.stm-overlay.ws-help-shift .stm-panel { padding-right: var(--ws-help-w); }
.ws-help-drawer {
  position: fixed; top: 0; right: 0; height: 100%; width: var(--ws-help-w); z-index: 100003;
  background: var(--panel); border-left: 1px solid var(--border); box-shadow: -8px 0 24px rgba(0,0,0,.18);
  display: flex; flex-direction: column; font-family: var(--font-ui);
  transform: translateX(100%); transition: transform .28s var(--ease);
}
.ws-help-drawer.open { transform: translateX(0); }
.ws-help-head { display: flex; align-items: flex-start; gap: 11px; padding: 16px 16px 14px; border-bottom: 1px solid var(--border); }
.ws-help-head-text { min-width: 0; flex: 1; }
.ws-help-title { font-size: 1.08rem; font-weight: 700; color: var(--text-bright); line-height: 1.2; }
.ws-help-sub { font-size: .85rem; color: var(--text-dim); margin-top: 3px; line-height: 1.35; }
.ws-help-close { flex: 0 0 auto; width: 28px; height: 28px; font-size: 1.3rem; line-height: 1; border: none; background: transparent; color: var(--text-dim); border-radius: var(--radius-sm); cursor: pointer; }
.ws-help-close:hover { background: var(--hover-medium); color: var(--text-bright); }
.ws-help-body { flex: 1; overflow-y: auto; padding: 18px 18px 30px; }
.ws-help-section { margin-bottom: 18px; }
.ws-help-section:last-child { margin-bottom: 0; }
.ws-help-label { display: block; font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--purple); margin-bottom: 6px; }
.ws-help-body .stm-ins-prose { font-size: .96rem; line-height: 1.58; color: var(--text); }
.ws-help-collapse {
  position: absolute; left: -16px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 52px; border: 1px solid var(--border); border-right: none;
  border-radius: 9px 0 0 9px; background: var(--panel); color: var(--text-dim);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; font-weight: 700; line-height: 1; box-shadow: -4px 0 12px rgba(0,0,0,.12);
  opacity: 0; pointer-events: none; transition: opacity .25s var(--ease), color var(--ease), background var(--ease);
}
.ws-help-collapse:hover { color: var(--text-bright); background: var(--hover-medium); }
body.ws-scrolled .ws-help-drawer.open .ws-help-collapse { opacity: 1; pointer-events: auto; }
.ws-help-reopen {
  position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 100002;
  width: 26px; height: 56px; border: 1px solid var(--border); border-right: none;
  border-radius: 10px 0 0 10px; background: var(--panel); color: var(--text-dim);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; font-weight: 700; line-height: 1; box-shadow: -4px 0 12px rgba(0,0,0,.14);
  opacity: 0; pointer-events: none; transition: opacity .25s var(--ease), color var(--ease), background var(--ease);
}
.ws-help-reopen:hover { color: var(--text-bright); background: var(--hover-medium); }
body.ws-help-closed .ws-help-reopen { opacity: 1; pointer-events: auto; }
.ws-deep-extra { margin-top: 6px; }
.ws-deep-links-lbl { font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); margin-right: 4px; }
.ws-yr-cards { margin-top: 10px; }
.ws-yr-narrative { margin-top: 6px; }
.ws-chap .stm-insight-content .stm-section:first-child { margin-top: 4px; }
.ws-yr-cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 4px; }
.ws-yr-cta-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border: 1px solid color-mix(in srgb, var(--purple) 35%, transparent); border-radius: var(--radius-md);
  background: linear-gradient(120deg, color-mix(in srgb, var(--purple) 10%, transparent), transparent);
  font-family: var(--font-ui); font-size: .92rem; font-weight: 600; color: var(--text-bright);
  cursor: pointer; transition: background var(--ease);
}
.ws-yr-cta-btn:hover { background: color-mix(in srgb, var(--purple) 16%, transparent); }
.ws-yr-cta-btn svg { width: 16px; height: 16px; opacity: .85; flex: 0 0 16px; }
.ws-yr-modal .ws-chart-modal-inner { width: min(1180px, 95vw); height: min(88vh, 900px); }
.ws-yr-modal-body { flex: 1; min-height: 0; overflow-y: auto; padding: 16px 20px 24px; display: block; }
.ws-yr-modal-body .yr-root { width: 100%; }
.ws-range-ctrls {
  position: sticky; top: 0; z-index: 30;
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
  margin: 0 0 18px; padding: 12px 16px;
  background: var(--card);                 
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  box-shadow: 0 8px 20px -8px rgba(0,0,0,.55);
}
.ws-range-ctrls .stm-range-mode-switch { margin: 0; }
.ws-range-ctrls .stm-compute-wrap { margin: 0; }
.ws-range-ctrls .st-compute-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 7px 6px;
  font-family: var(--font-ui); font-size: .92rem; color: var(--text); line-height: 1.5;
}
.ws-range-main { margin-bottom: 6px; }
.ws-range-main .stm-canvas-wrap.stm-chart-hist { height: 360px; }
.ws-range-main .stm-chart-inner-title-wrap { padding: 12px 14px 0; }
.ws-range-deep { padding: 0; }
.ws-range-deep .stm-ins-section { padding: 18px 0 20px; }
.ws-range-deep .stm-ins-section:first-child { padding-top: 4px; }
.ws-range-deep .stm-ins-num { display: none; }
.ws-bp-howto { margin-top: 14px; font-size: .9rem; line-height: 1.55; color: var(--text-dim); }
.ws-bp-howto b { color: var(--text); font-weight: 600; }
.ws-range-boxplot-top { margin: 4px 0 22px; }
.ws-range-boxplot-top .ws-leg-label { margin-top: 0; }
.ws-donut-wrap { position: relative; width: 150px; height: 150px; margin: 4px auto 0; }
.ws-donut-wrap canvas { display: block; }
.ws-donut-inner { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.ws-donut-pct { font-family: var(--font-ui); font-size: 1.85rem; font-weight: 700; line-height: 1; }
.ws-donut-pct.bull { color: var(--green); }
.ws-donut-pct.bear { color: var(--red); }
.ws-donut-side { font-size: .72rem; font-weight: 700; letter-spacing: .14em; color: var(--text-dim); margin-top: 4px; }
.ws-donut-tip { text-align: center; font-size: .82rem; font-weight: 600; margin-top: 10px; }
.ws-donut-tip .pos { color: var(--green); }
.ws-donut-tip .neg { color: var(--red); }
.ws-donut-tip .sep { color: var(--text-muted); margin: 0 7px; }


@keyframes brickPulse {
  0%,100% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--purple) 35%, transparent); }
  50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--purple) 15%, transparent); }
}
@keyframes sectionFlash {
  0% { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--purple) 70%, transparent), 0 0 0 3px color-mix(in srgb, var(--purple) 25%, transparent); }
  100% { box-shadow: inset 0 0 0 2px transparent, 0 0 0 3px transparent; }
}


.st-side-report-wrap { display: flex; flex-direction: column; min-height: 0; }

.st-side-report-head {
  position: sticky; top: 0; z-index: 8;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 0 10px; margin: 0 0 6px;
  background: var(--panel);
  border-bottom: 1px solid var(--border-hi);
}
.st-side-report-head .st-title { font-size: 1.05rem; }
.st-side-expand-btn {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 11px; border-radius: var(--radius-sm);
  background: var(--hover-subtle, rgba(255,255,255,.05));
  border: 1px solid var(--border-hi);
  color: var(--text-bright); cursor: pointer;
  font-family: var(--font-ui); font-size: .85rem; font-weight: 600;
  transition: background var(--ease);
}
.st-side-expand-btn:hover { background: var(--hover-medium, rgba(255,255,255,.08)); }
.st-side-expand-btn svg { width: 12px; height: 12px; }


.ws-report-narrow { container-type: inline-size; }

.ws-report-narrow .ws-report { max-width: none; margin: 0; }
.ws-report-narrow .ws-page { max-width: none; margin: 0; padding: 0; }
.ws-report-narrow .ws-chap { padding-left: 0; padding-right: 0; }


.ws-report-narrow .ws-range-ctrls {
  position: sticky; top: 46px; z-index: 6;
  box-shadow: 0 6px 14px -10px rgba(0, 0, 0, .45);
}

.ws-report-narrow .stm-insight-area { width: auto; max-width: none; min-width: 0; }


.stm-ret-select {
  display: none;
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  background-color: rgba(255,255,255,.06);
  color: var(--text-bright, var(--text));
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-sm);
  padding: 8px 32px 8px 12px;
  font-family: var(--font-ui); font-size: .92rem; font-weight: 700;
  cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 4l3 3 3-3' fill='none' stroke='white' stroke-opacity='0.85' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat; background-position: right 11px center;
}
.stm-ret-select option { background: var(--card, #181a23); color: var(--text); font-weight: 500; }


.ws-report-narrow .ws-controls { flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 12px; }
.ws-report-narrow .ws-ctrl-group { flex-direction: column; align-items: stretch; gap: 5px; flex: 1 1 140px; min-width: 0; width: auto; }
.ws-report-narrow .ws-ctrl-label { align-self: flex-start; }

.ws-report-narrow .stm-ret-pills { display: none; }
.ws-report-narrow .stm-ret-select { display: block; width: 100%; }


@container (max-width: 460px) {
  .ws-report-narrow .stm-cards-3,
  .ws-report-narrow .stm-cards-4,
  .ws-report-narrow .stm-cards-5,
  .ws-report-narrow .stm-cards-6,
  .ws-report-narrow .stm-cards-8 { grid-template-columns: repeat(2, 1fr); }
  .ws-report-narrow .stm-two-col,
  .ws-report-narrow .stm-two-col-streak,
  .ws-report-narrow .stm-direction-trio { grid-template-columns: 1fr; }
  
  .ws-report-narrow .ws-range-main .stm-canvas-wrap.stm-chart-hist { height: 280px; }
}
@container (max-width: 340px) {
  .ws-report-narrow .stm-cards-3,
  .ws-report-narrow .stm-cards-4,
  .ws-report-narrow .stm-cards-5,
  .ws-report-narrow .stm-cards-6,
  .ws-report-narrow .stm-cards-8 { grid-template-columns: 1fr; }
  .ws-report-narrow .stm-ret-period-btn,
  .ws-report-narrow .stm-ret-lb-btn { padding: 6px 6px; font-size: .82rem; }
}


.ws-report-narrow .stm-grid-wrap { overflow-x: auto; }
.ws-report-narrow .stm-grid-7,
.ws-report-narrow .stm-grid-8 { min-width: 520px; }
.ws-report-narrow .stm-grid-ret-fwd { min-width: 480px; }


.ws-report-narrow .stm-range-mode-switch { width: 100%; }
.ws-report-narrow .stm-range-mode-btn { flex: 1 1 0; min-width: 0; }
.ws-report-narrow .st-compute-row { flex-wrap: wrap; }
.ws-report-narrow .st-compute-select { max-width: 100%; }


.ws-report-narrow .stm-ret-fwd-summary { flex-wrap: wrap; }
.ws-report-narrow .stm-ret-fwd-card { flex: 1 1 80px; }


.ws-report-narrow .ws-yr-cta { flex-wrap: wrap; }
.ws-report-narrow .ws-yr-cta-btn { flex: 1 1 auto; justify-content: center; }


.ws-report-narrow .yr-ins-grid { grid-template-columns: 1fr; }
.ws-report-narrow .yr-ins-card { container-type: inline-size; }
.ws-report-narrow .yr-ins-card .yr-ins-prob-num { font-size: clamp(1.6rem, 17cqi, 3.2rem); }
.ws-report-narrow .yr-ins-card.yr-ins-hero .yr-ins-prob-num { font-size: clamp(1.7rem, 18cqi, 3.6rem); }
.ws-report-narrow .yr-ins-card .yr-ins-period { font-size: clamp(1.05rem, 9.5cqi, 1.7rem); }
.ws-report-narrow .yr-ins-card.yr-ins-hero .yr-ins-period { font-size: clamp(1.1rem, 11cqi, 2rem); }
.ws-report-narrow .yr-ins-card .yr-ins-prob-num,
.ws-report-narrow .yr-ins-card .yr-ins-period,
.ws-report-narrow .yr-ins-card .yr-ins-question { overflow-wrap: anywhere; }
.ws-report-narrow .yr-ins-foot strong { font-size: clamp(.84rem, 4.6cqi, .95rem); }
.ws-report-narrow .yr-ins-foot-lbl { font-size: clamp(.74rem, 3.6cqi, .78rem); }


.ws-ov-expand-btn {
  display: flex; align-items: center; gap: 7px;
  width: fit-content; margin: 14px auto 2px;
  padding: 8px 18px;
  border-radius: var(--radius-sm);
  background: linear-gradient(120deg, rgba(201,162,79,.18), rgba(201,162,79,.06));
  border: 1px solid rgba(201,162,79,.55);
  color: #d8b56a;
  font-family: var(--font-ui); font-size: .9rem; font-weight: 700;
  cursor: pointer; transition: background var(--ease), border-color var(--ease);
}
.ws-ov-expand-btn:hover {
  background: linear-gradient(120deg, rgba(201,162,79,.28), rgba(201,162,79,.10));
  border-color: rgba(201,162,79,.85);
}
.ws-ov-expand-btn svg { stroke: currentColor; flex: 0 0 13px; }


.yr-root {
  font-family: var(--font-ui);
  color: var(--text);
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 100%;
}


.yr-subtabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--border);
  padding: 0 4px;
}
.yr-tab {
  background: transparent;
  border: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.92rem;
  font-weight: 500;
  padding: 10px 18px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color var(--ease), border-color var(--ease);
}
.yr-tab:hover { color: var(--text-bright); }
.yr-tab.active {
  color: var(--text-bright);
  border-bottom-color: var(--text-bright);
}

.yr-body { flex: 1; display: flex; flex-direction: column; gap: 14px; }

.yr-loading,
.yr-empty {
  padding: 28px 16px;
  text-align: center;
  color: var(--text-dim);
  font-size: 0.9rem;
  background: var(--hover-subtle);
  border-radius: var(--radius-md);
}

.yr-up   { color: var(--green) !important; }
.yr-dn   { color: var(--red)   !important; }
.yr-neu  { color: var(--blue)  !important; }
.yr-b    { font-weight: 600; }


.yr-insights-head { padding: 4px 2px 8px; }
.yr-insights-title { font-size: 1.05rem; font-weight: 600; color: var(--text-bright); letter-spacing: 0.01em; }

.yr-ins-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 900px) {
  .yr-ins-grid { grid-template-columns: 1fr; }
}

.yr-ins-card {
  background: var(--hover-subtle);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.yr-ins-card.yr-ins-hero {
  background:
    radial-gradient(120% 100% at 0% 0%, var(--green-subtle), transparent 55%),
    var(--hover-subtle);
  border-color: var(--green-strong);
}

.yr-ins-period {
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--text-bright);
  margin-bottom: 4px;
}
.yr-ins-card.yr-ins-hero .yr-ins-period { font-size: 2rem; }

.yr-ins-period-sub {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--text-dim);
  font-weight: 600;
  margin-bottom: 14px;
}

.yr-ins-question {
  font-size: 0.88rem;
  color: var(--text-dim);
  line-height: 1.45;
  margin-bottom: 22px;
}

.yr-ins-prob-num {
  font-size: 3.2rem;
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.04em;
  margin-bottom: 6px;
}
.yr-ins-card.yr-ins-hero .yr-ins-prob-num { font-size: 3.6rem; }

.yr-ins-prob-lbl {
  font-size: 0.82rem;
  color: var(--text-dim);
  margin-bottom: 22px;
}

.yr-ins-foot {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid var(--border);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.yr-ins-foot > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.yr-ins-foot-lbl {
  font-size: 0.78rem;
  color: var(--text-dim);
  line-height: 1.2;
}
.yr-ins-foot strong {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-bright);
  font-variant-numeric: tabular-nums;
}


.yr-ins-narrative {
  margin: 12px 0 2px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--text-dim);
}
.yr-ins-narrative p { margin: 0; }
.yr-ins-narrative b { color: var(--text-bright); font-weight: 600; }
.yr-ins-narrative .yr-up { color: var(--green); }
.yr-ins-narrative .yr-dn { color: var(--red); }

.yr-ins-empty {
  font-size: 0.85rem;
  color: var(--text-dim);
  font-style: italic;
  padding: 18px 8px;
  text-align: center;
}

.yr-insights-narr {
  background: var(--hover-subtle);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px 18px;
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--text);
}
.yr-insights-narr p { margin: 0 0 10px 0; }
.yr-insights-narr p:last-child { margin-bottom: 0; }
.yr-insights-narr b { color: var(--text-bright); }


.yr-form {
  display: grid;
  grid-template-columns: repeat(5, minmax(140px, 1fr)) auto;
  gap: 12px;
  align-items: end;
  padding: 14px 16px;
  background: var(--hover-subtle);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  margin-bottom: 8px;
}
@media (max-width: 1100px) {
  .yr-form { grid-template-columns: repeat(2, 1fr); }
  .yr-form .yr-field-action { grid-column: 1 / -1; }
}
.yr-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.yr-field label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-mute, var(--text-dim));
  font-weight: 600;
}
.yr-field select,
.yr-input {
  background: rgba(255, 255, 255, .04);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  color: var(--text-bright);
  padding: 0 10px;
  height: 36px;
  font-family: var(--font-ui);
  font-size: 0.9rem;
  outline: none;
  transition: border-color var(--ease), background var(--ease);
}
.yr-field select {
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path fill='%238a90ab' d='M6 9L1 4h10z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 28px;
}
.yr-field select:focus, .yr-field select:hover,
.yr-input:focus, .yr-input:hover {
  border-color: var(--border-hi, var(--border-strong, var(--border)));
  background: rgba(255, 255, 255, .06);
}
.yr-field select option {
  background-color: #1a1d2a !important;
  color: #e8ebf4 !important;
  font-family: var(--font-ui);
  padding: 6px 10px;
}
.yr-field select option:checked {
  background: #2a2f42 !important;
  color: #e8ebf4 !important;
  font-weight: 600;
}

.yr-ref-extra-wrap,
.yr-cond-extra-wrap { display: contents; }

.yr-field-action { justify-content: flex-end; align-self: end; }
.yr-btn-primary {
  background: var(--pill-active-bg, var(--gold, #c9a25d));
  color: var(--pill-active-color, #1a1a1a);
  border: none;
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0 18px;
  cursor: pointer;
  transition: filter var(--ease);
  height: 36px;
}
.yr-btn-primary:hover { filter: brightness(1.05); }


.yr-autofill {
  font-size: 0.82rem;
  color: var(--text-dim);
  padding: 6px 16px;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  line-height: 1.4;
}
.yr-autofill:empty { display: none; }
.yr-autofill-lbl {
  display: inline-block;
  padding: 3px 9px;
  background: var(--hover-medium);
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--text-bright);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.yr-autofill b { color: var(--text-bright); font-weight: 600; }


.yr-answer {
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(38, 217, 127, .06), transparent 55%),
    var(--bg-card, var(--hover-subtle));
  border: 1px solid rgba(38, 217, 127, .18);
  border-radius: var(--radius-lg);
  padding: 26px 28px;
  margin-bottom: 14px;
}
.yr-answer-neu {
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(201, 162, 93, .06), transparent 55%),
    var(--bg-card, var(--hover-subtle));
  border-color: rgba(201, 162, 93, .18);
}
.yr-answer-neg {
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(240, 80, 110, .06), transparent 55%),
    var(--bg-card, var(--hover-subtle));
  border-color: rgba(240, 80, 110, .18);
}
.yr-answer-question {
  font-size: 1.6rem;
  color: var(--text-bright);
  line-height: 1.35;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin-bottom: 28px;
  max-width: 900px;
}
.yr-answer-body {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 1.4fr;
  gap: 32px;
  align-items: center;
}
@media (max-width: 1100px) {
  .yr-answer-body { grid-template-columns: 1fr; }
}
.yr-prob-block {
  display: flex;
  align-items: center;
  gap: 22px;
}
.yr-donut {
  width: 130px;
  height: 130px;
  flex-shrink: 0;
  display: block;
}
.yr-prob-num {
  font-size: 4.2rem;
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.04em;
}
.yr-prob-pos { color: var(--green); }
.yr-prob-neu { color: var(--gold, #c9a25d); }
.yr-prob-neg { color: var(--red); }
.yr-prob-lbl {
  font-size: 0.85rem;
  color: var(--text-dim);
  margin-top: 6px;
  max-width: 220px;
}
.yr-sample {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 22px;
  padding-left: 28px;
  border-left: 1px solid var(--border);
}
@media (max-width: 1100px) {
  .yr-sample { padding-left: 0; border-left: none; padding-top: 18px; border-top: 1px solid var(--border); }
}
.yr-sample-cell { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.yr-sample-lbl {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-mute, var(--text-dim));
  font-weight: 600;
}
.yr-sample-val {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-bright);
  line-height: 1;
}
.yr-sample-val small { font-size: 0.85rem; color: var(--text-dim); font-weight: 400; }
.yr-sample-sub { font-size: 0.78rem; color: var(--text-dim); }


.yr-perf-strip {
  background: var(--bg-card, var(--hover-subtle));
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 18px 24px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  align-items: center;
  margin-bottom: 22px;
}
.yr-perf-strip:empty { display: none; }
@media (max-width: 1100px) {
  .yr-perf-strip { grid-template-columns: 1fr 1fr; }
}
.yr-perf-cell { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.yr-perf-lbl { font-size: 0.78rem; color: var(--text-dim); }
.yr-perf-val {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}


.yr-detail-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
@media (max-width: 1100px) {
  .yr-detail-grid { grid-template-columns: 1fr; }
}
.yr-panel {
  background: var(--bg-card, var(--hover-subtle));
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.yr-panel:empty { display: none; }
.yr-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 16px 22px 0;
}
.yr-panel-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-bright);
  letter-spacing: 0.01em;
}
.yr-panel-meta {
  font-size: 0.72rem;
  color: var(--text-mute, var(--text-dim));
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
}
.yr-panel-body { padding: 18px 22px 20px; flex: 1; }


.yr-chart {
  position: relative;
  margin-bottom: 18px;
}
.yr-chart-yhint {
  position: absolute;
  left: 0;
  top: 0;
  height: 220px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-right: 12px;
  font-size: 0.7rem;
  color: var(--text-mute, var(--text-dim));
  pointer-events: none;
  font-variant-numeric: tabular-nums;
}
.yr-chart-plot, .yr-trend-plot {
  position: relative;
  margin-left: 36px;
  height: 220px;
}
.yr-grid-h {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.yr-grid-h::before, .yr-grid-h::after, .yr-grid-h > span {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(255, 255, 255, .05);
}
.yr-grid-h::before { top: 25%; }
.yr-grid-h::after { top: 50%; }
.yr-grid-h > span { top: 75%; }

.yr-marker {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  pointer-events: none;
}
.yr-marker.zero { background: rgba(255, 255, 255, .18); }
.yr-marker.median { border-left: 1px dashed var(--blue); width: 0; }
.yr-marker.mean { border-left: 1px dashed var(--gold, #c9a25d); width: 0; }
.yr-marker-lbl {
  position: absolute;
  top: -16px;
  transform: translateX(-50%);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.yr-marker.median .yr-marker-lbl { color: var(--blue); }
.yr-marker.mean .yr-marker-lbl { color: var(--gold, #c9a25d); }

.yr-histo {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  gap: 4px;
}
.yr-histo-bar {
  flex: 1;
  border-radius: 2px 2px 0 0;
  min-height: 2px;
  transition: opacity var(--ease), filter var(--ease);
}
.yr-histo-bar.pos { background: var(--green); opacity: .9; }
.yr-histo-bar.neg { background: var(--red); opacity: .85; }
.yr-histo-bar:hover { opacity: 1; filter: brightness(1.1); }
.yr-bar-up { background: var(--green); }
.yr-bar-dn { background: var(--red); }

.yr-trend-axis {
  position: relative;
  margin-left: 36px;
  height: 22px;
  border-top: 1px solid var(--border);
  margin-top: 4px;
}
.yr-axis-tick {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  font-size: 0.7rem;
  color: var(--text-mute, var(--text-dim));
  font-variant-numeric: tabular-nums;
  padding-top: 6px;
}
.yr-axis-tick::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 4px;
  background: var(--border-strong, var(--border));
}


.yr-trend-bars {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: stretch;
  gap: 4px;
}
.yr-trend-bars::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: rgba(255, 255, 255, .18);
  pointer-events: none;
}
.yr-trend-bar {
  flex: 1;
  height: 100%;
  position: relative;
}
.yr-trend-bar-fill {
  position: absolute;
  left: 0;
  right: 0;
  border-radius: 2px 2px 0 0;
  min-height: 2px;
  transition: opacity var(--ease), filter var(--ease);
}
.yr-trend-bar-fill.pos { background: var(--green); opacity: .9; bottom: 50%; }
.yr-trend-bar-fill.neg { background: var(--red); opacity: .85; top: 50%; border-radius: 0 0 2px 2px; }
.yr-trend-bar:hover .yr-trend-bar-fill { opacity: 1; filter: brightness(1.1); }
.yr-trend-mean {
  position: absolute;
  left: 0;
  right: 0;
  border-top: 1px dashed var(--gold, #c9a25d);
  opacity: .55;
  pointer-events: none;
}


.yr-detail-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  padding: 14px 0 0;
  border-top: 1px solid var(--border);
  font-size: 0.85rem;
  color: var(--text-dim);
}
.yr-legend {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
}
.yr-legend-item {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.yr-legend-item strong { color: var(--text-bright); font-weight: 600; }
.yr-swatch {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  vertical-align: -1px;
  margin-right: 4px;
}
.yr-swatch.yr-bar-up { background: var(--green); }
.yr-swatch.yr-bar-dn { background: var(--red); }
.yr-swatch.yr-swatch-median { background: var(--blue); }
.yr-swatch.yr-swatch-mean { background: var(--gold, #c9a25d); }


.yr-data-panel {
  background: var(--bg-card, var(--hover-subtle));
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-bottom: 22px;
}
.yr-data-panel:empty { display: none; }
.yr-data-panel .yr-panel-head {
  padding: 16px 22px 12px;
  border-bottom: 1px solid var(--border);
}
.yr-data-table-wrap {
  max-height: 360px;
  overflow-y: auto;
}
.yr-data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}
.yr-data-table thead th {
  position: sticky;
  top: 0;
  background: var(--bg-card, var(--hover-subtle));
  text-align: left;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-mute, var(--text-dim));
  font-weight: 600;
  padding: 10px 22px;
  border-bottom: 1px solid var(--border);
}
.yr-data-table thead th.num { text-align: right; }
.yr-data-table tbody td {
  padding: 10px 22px;
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  color: var(--text);
  font-variant-numeric: tabular-nums;
}
.yr-data-table tbody td.num { text-align: right; }
.yr-data-table tbody tr:hover { background: var(--hover-subtle); }
.yr-data-table tbody tr:last-child td { border-bottom: none; }
.yr-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.yr-pill-pos { background: rgba(38, 217, 127, .12); color: var(--green); }
.yr-pill-neg { background: rgba(240, 80, 110, .12); color: var(--red); }

.yr-loading {
  font-size: 0.9rem;
  color: var(--text-dim);
  font-style: italic;
  padding: 30px;
  text-align: center;
}


.yr-pred-head {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px 4px;
}
.yr-pred-modes { display: flex; gap: 4px; border-bottom: 1px solid var(--border); }
.yr-pred-desc { font-size: 0.85rem; color: var(--text-dim); line-height: 1.4; }
.yr-pred-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.yr-pred-body {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 14px;
  min-height: 420px;
}
@media (max-width: 1100px) {
  .yr-pred-body { grid-template-columns: 1fr; }
}

.yr-pred-table {
  background: var(--hover-subtle);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.yr-pred-grid-head,
.yr-pred-row {
  display: grid;
  grid-template-columns: 50px 1fr 100px 70px 110px;
  align-items: center;
  padding: 10px 14px;
  font-size: 0.88rem;
}
.yr-pred-grid-head {
  background: var(--hover-medium);
  font-size: 0.8rem;
  color: var(--text-dim);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.yr-pred-row {
  border-top: 1px solid var(--border);
  cursor: pointer;
  transition: background var(--ease);
}
.yr-pred-row:hover { background: var(--hover-subtle); }
.yr-pred-row.active {
  background: var(--hover-medium);
  border-left: 3px solid var(--text-bright);
  padding-left: 11px;
}
.yr-pred-period { font-weight: 600; color: var(--text-bright); }

.yr-pred-side {
  background: var(--hover-subtle);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.yr-pred-side-head {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-bright);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}
.yr-side-equity {
  width: 100%;
  height: 240px;
  background: transparent;
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.yr-side-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.yr-side-kpi {
  background: var(--hover-medium);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.yr-side-kpi-lbl { font-size: 0.78rem; color: var(--text-dim); }
.yr-side-kpi-val { font-size: 1rem; font-weight: 600; color: var(--text-bright); }


.yr-side-loading { color: var(--text-dim); font-size: 0.85rem; padding: 10px; }
.yr-side-block {
  padding: 10px 12px;
  background: var(--hover-subtle);
  border-radius: var(--radius-sm);
  margin-bottom: 10px;
}
.yr-side-head {
  font-size: 0.85rem;
  color: var(--text-bright);
  font-weight: 600;
  margin-bottom: 6px;
}
.yr-side-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.88rem;
}
.yr-side-row span { color: var(--text-dim); }
.yr-side-hint {
  font-size: 0.8rem;
  color: var(--text-muted);
  margin-top: 10px;
  padding: 8px;
  border-top: 1px solid var(--border);
  line-height: 1.4;
}


.yr-side-predictors {
  padding: 4px 0;
}
.yr-side-predictors-title {
  font-family: var(--font-ui);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text-bright);
  letter-spacing: 0.6px;
  text-transform: uppercase;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}
.yr-side-predictors-body {
  font-size: 0.86rem;
  line-height: 1.55;
  color: var(--text);
}
.yr-side-predictors-body p { margin: 0 0 10px 0; }
.yr-side-predictors-body p:last-child { margin-bottom: 0; }
.yr-side-predictors-body b { font-weight: 700; }
.yr-side-predictors-body .yr-up { color: var(--green, #26d97f); font-weight: 700; }
.yr-side-predictors-body .yr-dn { color: var(--red, #f0506e); font-weight: 700; }


.yr-sb-predictors-wrap .yr-sb-predictors-body {
  font-size: 0.86rem;
  line-height: 1.5;
  color: var(--text);
}
.yr-sb-predictors-wrap .yr-sb-predictors-body p {
  margin: 0 0 8px 0;
}
.yr-sb-predictors-wrap .yr-sb-predictors-body p:last-child { margin-bottom: 0; }
.yr-sb-predictors-wrap .yr-sb-predictors-body b { font-weight: 700; }
.yr-sb-predictors-wrap .yr-sb-predictors-body .yr-up { color: var(--green, #26d97f); font-weight: 700; }
.yr-sb-predictors-wrap .yr-sb-predictors-body .yr-dn { color: var(--red, #f0506e); font-weight: 700; }
.yr-sb-predictors-wrap .yr-side-loading {
  font-size: 0.84rem;
  color: var(--text-dim);
  padding: 8px 4px;
  text-align: center;
}



.stm-bricks-section {
  margin: 0 0 18px;
  position: relative;
  z-index: 101; 
}


.stm-bricks-section + .stm-section-sticky-header,
.stm-bricks-section + .stm-ret-controls {
  margin-top: 0;
  top: 0;
}

.yr-bricks-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 18px 22px 26px;
  position: relative;
  overflow: hidden;
}


.yr-bricks-chart-area {
  position: relative;
}


.yr-bricks-brand {
  position: absolute;
  top: 6px;
  left: 8px;
  display: flex;
  align-items: center;
  gap: 12px;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  opacity: 0.16;
}
.yr-bricks-brand img {
  width: 42px;
  height: 42px;
  flex-shrink: 0;
}
.yr-bricks-brand span {
  font-family: var(--font-ui);
  font-size: 30px;
  font-weight: 700;
  color: var(--text-bright);
  letter-spacing: 0.02em;
  white-space: nowrap;
}
@media (max-width: 800px) {
  .yr-bricks-brand img { width: 28px; height: 28px; }
  .yr-bricks-brand span { font-size: 20px; }
}


.yr-bricks-tooltip {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  background: rgba(20, 22, 28, 0.96);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--radius-sm);
  padding: 6px 10px;
  font-family: var(--font-ui);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.08s ease;
  z-index: 10;
  white-space: nowrap;
  min-width: 70px;
}
.yr-bricks-tooltip.show { opacity: 1; }
.yr-tip-year {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: 0.3px;
  margin-bottom: 2px;
  font-variant-numeric: tabular-nums;
}
.yr-tip-ret {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.2px;
}
.yr-tip-ret.yr-up { color: var(--green, #26d97f); }
.yr-tip-ret.yr-dn { color: var(--red, #f0506e); }
.yr-bricks-head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  min-height: 32px;
}
.yr-bricks-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-bright);
  letter-spacing: 0.3px;
  text-align: center;
}
.yr-bricks-sort-selector,
.yr-bricks-bin-selector {
  display: flex;
  align-items: center;
  gap: 4px;
  background: rgba(255, 255, 255, 0.04);
  padding: 3px 4px 3px 8px;
  border-radius: var(--radius-sm);
}


.yr-bricks-options-toggle {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  padding: 5px 10px;
  cursor: pointer;
  transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.yr-bricks-options-toggle:hover {
  color: var(--text-bright);
  background: rgba(255, 255, 255, 0.08);
}
.yr-bricks-options-toggle.open {
  color: var(--pill-active-color, var(--text-bright));
  background: var(--pill-active-bg, rgba(255, 255, 255, 0.14));
  border-color: transparent;
}
.yr-bricks-options-toggle svg { display: block; }


.yr-bricks-options-panel {
  display: none;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  padding: 10px 14px;
  margin: -6px 0 14px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  position: relative;
  z-index: 2;
}
.yr-bricks-options-panel.open { display: flex; }
.yr-bricks-options-panel .yr-bricks-slider-row {
  flex: 1;
  min-width: 220px;
  margin: 0;
  padding: 0;
}
.yr-bricks-pill-label {
  font-family: var(--font-ui);
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding-right: 2px;
}
.yr-bricks-pill-btn {
  background: transparent;
  border: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  transition: background var(--ease), color var(--ease);
}
.yr-bricks-pill-btn:hover { color: var(--text-bright); }
.yr-bricks-pill-btn.active {
  background: var(--pill-active-bg, rgba(255, 255, 255, 0.14));
  color: var(--pill-active-color, var(--text-bright));
}

.yr-bricks-stacks {
  display: grid;
  align-items: end;
  gap: 3px;
  min-height: 240px;
  max-height: 650px;
  padding: 4px 0;
  position: relative;
  z-index: 1;
  container-type: inline-size; 
}
.yr-bricks-stack {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-height: 0;
}
.yr-brick {
  height: 22px;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  
  font-size: min(var(--brick-fs, 0.72rem), calc(30cqw / var(--nb, 10)));
  font-weight: 700;
  color: rgba(0, 0, 0, 0.85);
  font-family: var(--font-ui);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.2px;
  cursor: pointer;
  transition: transform var(--ease), filter var(--ease), box-shadow var(--ease);
  user-select: none;
  flex-shrink: 0;
}


.yr-bricks-slider-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: -4px 0 14px;
  padding: 6px 4px 0;
  font-family: var(--font-ui);
}
.yr-bricks-slider-label {
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: 0.4px;
  text-transform: uppercase;
}
.yr-bricks-slider-value {
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--text-bright);
  font-variant-numeric: tabular-nums;
  min-width: 32px;
  text-align: right;
}
.yr-bricks-slider-max {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-dim);
  font-variant-numeric: tabular-nums;
  min-width: 32px;
}
.yr-bricks-slider-container {
  position: relative;
  flex: 1;
  height: 22px;
  cursor: pointer;
}
.yr-bricks-slider-track {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  height: 6px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.08);
}
.yr-bricks-slider-fill {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  height: 6px;
  border-radius: 3px;
  background: #d9b66a;
  pointer-events: none;
}
.yr-bricks-slider-handle {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
  cursor: grab;
  z-index: 2;
}
.yr-bricks-slider-handle:hover {
  transform: translate(-50%, -50%) scale(1.12);
}
.yr-bricks-slider-handle:active { cursor: grabbing; }
.yr-brick:hover {
  transform: scale(1.08);
  filter: brightness(1.18);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
  z-index: 2;
  position: relative;
}

.yr-brick-current {
  outline: 2.5px solid var(--blue);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--blue) 30%, transparent);
  font-weight: 800;
  position: relative;
  z-index: 3;
}


.yr-bricks-axis-track {
  position: relative;
  margin-top: 10px;
  padding-top: 14px;
  height: 42px;
}
.yr-bricks-axis-line {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: var(--border);
}
.yr-bricks-tick {
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translateX(-50%);
  pointer-events: none;
}
.yr-bricks-tick-first { transform: translateX(0); align-items: flex-start; }
.yr-bricks-tick-last  { transform: translateX(-100%); align-items: flex-end; }
.yr-bricks-tick-mark {
  width: 1px;
  height: 6px;
  background: var(--border);
  margin-bottom: 4px;
}
.yr-bricks-tick-label {
  font-size: 0.78rem;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  letter-spacing: 0.2px;
}

@media (max-width: 1100px) {
  .yr-brick { height: 19px; font-size: 0.66rem; }
  .yr-bricks-tick-label { font-size: 0.72rem; }
}
@media (max-width: 800px) {
  .yr-bricks-stacks { gap: 2px; min-height: 180px; }
  .yr-brick { height: 16px; font-size: 0.6rem; border-radius: 2px; }
  .yr-bricks-tick-label { font-size: 0.66rem; }
}



.yr-brick-hl {
  outline: 2px solid var(--purple); outline-offset: 1px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--purple) 35%, transparent);
  z-index: 3; position: relative;
  animation: brickPulse 1.1s ease-in-out 2;
}




.sn-vision {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}


.sn-v-header {
  padding: 16px 16px 12px;
  flex-shrink: 0;
}
.sn-v-header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.sn-v-title {
  font-size: 1.1rem;
  font-weight: 600;
  font-family: var(--font-ui);
  letter-spacing: -0.3px;
  color: var(--text-bright);
}
.sn-v-title span { color: var(--blue); }


.sn-gear-btn {
  background: var(--hover-medium);
  border: 1px solid var(--border-hi);
  border-radius: 50%;
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  color: var(--text);
  cursor: pointer;
  transition: all .2s ease;
  position: relative;
}
.sn-gear-btn:hover {
  background: var(--surface-border-hi);
  transform: scale(1.05);
}
.sn-gear-btn.active {
  background: var(--blue-med);
  border-color: var(--blue-focus);
  color: var(--blue);
}


.sn-settings-pop {
  position: absolute;
  top: 56px; right: 16px;
  width: 200px;
  background: var(--card);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  box-shadow: 0 12px 28px rgba(0,0,0,.45), inset 0 1px 0 var(--surface-raised);
  opacity: 0;
  transform: scale(0.95) translateY(-8px);
  pointer-events: none;
  transition: all .25s cubic-bezier(.2,.8,.2,1);
  z-index: 100;
}
.sn-settings-pop.show {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}
.sn-pop-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--surface-raised);
}
.sn-pop-row:last-child { border-bottom: none; padding-bottom: 0; }
.sn-pop-row span {
  font-size: .82rem;
  font-weight: 500;
  color: var(--text);
}


.sn-ios-toggle {
  width: 38px; height: 20px;
  background: var(--surface-border-hi);
  border-radius: 10px;
  position: relative;
  cursor: pointer;
  transition: background .3s ease;
  flex-shrink: 0;
}
.sn-ios-toggle.on { background: var(--green); }
.sn-ios-toggle::after {
  content: '';
  position: absolute;
  top: 2px; left: 2px;
  width: 16px; height: 16px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(0,0,0,.3);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
}
.sn-ios-toggle.on::after { transform: translateX(18px); }


.sn-v-tabs {
  display: flex;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  padding: 3px;
  position: relative;
  border: 1px solid var(--divider-soft);
}
.sn-v-pill {
  position: absolute;
  top: 3px; bottom: 3px;
  background: var(--surface-border-hi);
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
  transition: all .3s cubic-bezier(.2,.8,.2,1);
  z-index: 1;
}
.sn-v-tab-btn {
  flex: 1; background: none; border: none;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 500;
  padding: 5px 0; cursor: pointer;
  position: relative; z-index: 2;
  transition: color .2s;
}
.sn-v-tab-btn:not(.active) { color: var(--text-dim); }


.sn-v-content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0 14px 14px;
}
.sn-v-content::-webkit-scrollbar { width: 3px; }
.sn-v-content::-webkit-scrollbar-track { background: transparent; }
.sn-v-content::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }

.sn-tab-pane {
  display: none;
  animation: snFadeIn .3s ease;
}
.sn-tab-pane.active { display: block; }

@keyframes snFadeIn {
  from { opacity: 0; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}


.sn-glass {
  background: var(--divider-soft);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  padding: 12px;
  margin-bottom: 12px;
}


.sn-v-label {
  font-size: .82rem; font-weight: 500;
  color: var(--text-dim);
  margin-bottom: 10px; display: block;
}
.sn-section-label {
  font-size: .82rem; font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: var(--text-muted);
  margin-bottom: 8px;
}


.sn-chip-grid { display: flex; gap: 6px; flex-wrap: wrap; }
.sn-v-chip {
  padding: 6px 12px; border-radius: 16px;
  background: var(--divider-soft);
  border: 1px solid var(--border-hi);
  color: var(--text);
  font-size: .82rem; font-weight: 500;
  cursor: pointer; transition: all .2s;
  font-family: var(--font-ui);
}
.sn-v-chip:hover { background: var(--surface-border); }
.sn-v-chip.active {
  background: var(--pill-active-bg, #d9b66a);
  border-color: var(--pill-active-bg, #d9b66a);
  color: var(--pill-active-color, #0f1115);
  font-weight: 700;
  box-shadow: 0 0 0 1px rgba(217,182,106,.35), 0 2px 10px rgba(217,182,106,.25);
}
.sn-v-chip.active:hover { background: var(--pill-active-bg, #d9b66a); }


.sn-chip-grid-sm { margin-top: 12px; gap: 4px; }
.sn-v-chip-sm { padding: 3px 9px; font-size: .82rem; border-radius: 12px; }


.sn-range-header {
  display: flex; justify-content: space-between;
  margin-bottom: 12px; font-size: .85rem; font-weight: 600;
  font-family: var(--font-ui);
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
.sn-slider-container {
  position: relative;
  height: 24px;
  margin-bottom: 6px;
}
.sn-slider-track {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  width: 100%; height: 8px;
  border-radius: 4px;
  background: var(--surface-border);
}
.sn-slider-fill {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  height: 8px;
  border-radius: 4px;
  background: #d9b66a;
}
.sn-slider-handle {
  position: absolute;
  top: 50%; transform: translate(-50%, -50%);
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.35);
  cursor: grab;
  z-index: 2;
}
.sn-slider-handle:hover {
  transform: translate(-50%, -50%) scale(1.1);
}
.sn-slider-handle:active { cursor: grabbing; }


.sn-legend { display: flex; flex-direction: column; gap: 4px; }
.sn-legend-item {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  transition: all .2s ease;
  cursor: pointer;
}
.sn-legend-item:hover { background: var(--hover-medium); }
.sn-legend-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.sn-legend-name {
  font-size: .82rem; font-weight: 500;
  flex: 1; color: var(--text);
}
.sn-legend-range {
  font-size: .82rem;
  color: var(--text-muted);
  font-family: var(--font-ui);
}
.sn-legend-action {
  width: 20px; height: 20px;
  border-radius: var(--radius-sm);
  background: var(--divider-soft);
  border: none;
  color: var(--text-muted);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: .82rem;
  opacity: 0;
  transition: all var(--ease);
}
.sn-legend-item:hover .sn-legend-action { opacity: 1; }
.sn-legend-action:hover { background: var(--red-med); color: var(--red); }


.sn-color-palette {
  display: flex; gap: 3px; flex-wrap: wrap;
  padding: 4px 0; max-width: 120px;
}
.sn-palette-swatch {
  width: 13px; height: 13px; border-radius: 50%;
  cursor: pointer; border: 1.5px solid transparent;
  transition: transform .12s, border-color .12s;
}
.sn-palette-swatch:hover { transform: scale(1.3); }
.sn-palette-swatch.active { border-color: #fff; }
.sn-dot-btn {
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
}
.sn-dot-btn:hover {
  transform: scale(1.4);
  box-shadow: 0 0 6px currentColor;
}


.sn-legend-actions {
  display: flex; gap: 2px; flex-shrink: 0;
}
.sn-legend-btn {
  background: none;
  border: 1px solid var(--surface-raised);
  color: var(--text-dim);
  font-size: .82rem;
  width: 20px; height: 20px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  padding: 0; line-height: 1;
  transition: all var(--ease);
}
.sn-legend-btn:hover {
  background: var(--surface-raised);
  color: var(--text-soft);
}
.sn-legend-btn.active {
  background: var(--surface-border);
  color: #fff;
  border-color: var(--surface-border-hi);
}
.sn-legend-remove { color: var(--text-dim) !important; font-size: .85rem !important; }
.sn-legend-remove:hover { color: var(--red) !important; background: var(--red-dim) !important; }


.sn-dash-open-btn {
  width: 100%;
  padding: 10px;
  margin: 10px 0 16px;
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, var(--blue-med), var(--purple-dim));
  border: 1px solid var(--blue-strong);
  color: var(--text-bright);
  font-size: .82rem;
  font-weight: 600;
  font-family: var(--font-ui);
  cursor: pointer;
  transition: all .25s ease;
}
.sn-dash-open-btn:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, var(--blue-strong), var(--purple-dim));
  box-shadow: 0 4px 14px var(--blue-med);
}


.sn-glass-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.sn-plus-btn {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--blue-dim);
  border: 1px solid var(--blue-strong);
  color: var(--blue);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: .82rem; font-weight: 700;
  transition: all .2s ease;
  line-height: 1;
}
.sn-plus-btn:hover {
  background: var(--blue-strong);
  transform: scale(1.08);
  box-shadow: 0 2px 8px var(--blue-strong);
}


.sn-legend-item.sn-pinned-year {
  border-left: 3px solid;
  padding-left: 7px;
}


.sn-year-picker {
  position: absolute;
  top: 36px; right: 6px;
  width: 195px;
  background: rgba(22,25,35,.96);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 28px rgba(0,0,0,.5), inset 0 1px 0 var(--divider-soft);
  opacity: 0;
  transform: scale(0.95) translateY(-6px);
  pointer-events: none;
  transition: all .25s cubic-bezier(.2,.8,.2,1);
  z-index: 100;
  overflow: hidden;
}
.sn-year-picker.show {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}
.sn-yp-header {
  padding: 8px 10px 6px;
  border-bottom: 1px solid var(--divider-soft);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sn-yp-title {
  font-size: .7rem; font-weight: 600;
  color: var(--text-dim);
}
.sn-yp-close {
  background: none; border: none;
  color: var(--text-muted); cursor: pointer;
  font-size: .82rem; width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 3px;
  transition: all var(--ease);
}
.sn-yp-close:hover { color: var(--text-bright); background: var(--surface-raised); }

.sn-yp-search {
  margin: 5px 8px;
  padding: 4px 7px;
  width: calc(100% - 16px);
  border-radius: var(--radius-sm);
  background: var(--divider-soft);
  border: 1px solid var(--border);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  outline: none;
  transition: border-color .2s;
}
.sn-yp-search:focus { border-color: var(--blue-focus); }
.sn-yp-search::placeholder { color: var(--text-muted); }

.sn-yp-list {
  max-height: 220px;
  overflow-y: auto;
  padding: 3px 0;
}
.sn-yp-list::-webkit-scrollbar { width: 3px; }
.sn-yp-list::-webkit-scrollbar-thumb { background: var(--surface-raised); border-radius: 3px; }

.sn-yp-item {
  display: flex; align-items: center; gap: 7px;
  padding: 5px 10px;
  cursor: pointer;
  transition: background var(--ease);
}
.sn-yp-item:hover { background: var(--divider-soft); }
.sn-yp-item.added, .sn-yp-item.active { background: var(--blue-dim); }
.sn-yp-check {
  font-size: .7rem; color: var(--blue); font-weight: 700;
  width: 16px; text-align: center; flex-shrink: 0;
}
.sn-yp-cb {
  width: 13px; height: 13px;
  accent-color: rgba(255,255,255,.45);
  cursor: pointer;
  flex-shrink: 0;
}
.sn-yp-year {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  color: var(--text); flex: 1;
}
.sn-yp-perf {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
}
.sn-yp-pos { color: var(--green); }
.sn-yp-neg { color: var(--red); }


.sn-year-list-card { padding-bottom: 6px; }
.sn-sb-year-list { display: flex; flex-direction: column; }
.sn-sb-year-list .sn-yl-rows { max-height: 280px; overflow-y: auto; }
.sn-yl-count {
  font-size: .82rem; font-weight: 700;
  background: var(--blue-dim); color: var(--blue);
  padding: 2px 8px; border-radius: var(--radius-sm);
  font-family: var(--font-ui);
}
.sn-yl-header {
  display: flex; align-items: center;
  padding: 4px 4px 6px;
  border-bottom: 1px solid var(--surface-raised);
  font-size: .82rem; font-weight: 600;
  color: var(--text-muted); text-transform: uppercase;
  letter-spacing: .4px;
}
.sn-yl-cb-col { width: 24px; flex-shrink: 0; }
.sn-yl-year-col { width: 40px; flex-shrink: 0; }
.sn-yl-bar-col { flex: 1; text-align: center; }
.sn-yl-ytd-col { width: 54px; flex-shrink: 0; text-align: right; padding-right: 6px; }
.sn-yl-eye-col { width: 22px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.sn-yl-eye {
  color: var(--text-dim);
  opacity: .2;
  cursor: pointer;
  transition: all var(--ease);
  display: flex; align-items: center; justify-content: center;
  padding: 2px;
  border-radius: var(--radius-sm);
}
.sn-yl-eye:hover { opacity: .6; }
.sn-yl-eye.on { opacity: 1; color: var(--accent); }
.sn-dash-year-list-card {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.sn-yl-rows {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.sn-yl-rows::-webkit-scrollbar { width: 3px; }
.sn-yl-rows::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }
.sn-yl-footer {
  flex-shrink: 0;
  padding: 5px 8px;
  border-top: 1px solid var(--surface-raised);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sn-yl-footer .sn-dash-filter-wrap {
  position: relative;
}
.sn-yl-footer .sn-dash-filter-menu {
  bottom: 100%;
  top: auto;
  margin-bottom: 4px;
  margin-top: 0;
}
.sn-yl-row {
  display: flex; align-items: center;
  padding: 4px 4px;
  cursor: pointer;
  transition: background var(--ease);
  border-radius: 3px;
}
.sn-yl-row:hover { background: var(--divider-soft); }
.sn-yl-row.pinned { background: var(--blue-dim); }
.sn-yl-row.inverted { background: rgba(255,235,59,.08); }
.sn-yl-row.inverted.pinned { background: rgba(255,235,59,.1); }
.sn-yl-row.sparse { opacity: .55; }
.sn-yl-row.sparse.checked { opacity: 1; background: rgba(255,184,51,.10); border-left: 2px solid rgba(255,184,51,.55); }
.sn-yl-row.sparse:hover { opacity: .85; background: var(--divider-soft); }
.sn-yl-row.sparse .sn-yl-year-col { color: var(--text-dim); }
.sn-yl-row.sparse.checked .sn-yl-year-col { color: #ffb833; }
.sn-yl-sparse-icon { display: inline-block; margin-right: 4px; color: #ffb833; font-size: 0.85rem; vertical-align: -1px; }
.sn-yl-sparse-shortcut:hover { background: rgba(255,184,51,.16) !important; border-color: rgba(255,184,51,.7) !important; }
.sn-yl-sparse-shortcut:focus { outline: 2px solid rgba(255,184,51,.45); outline-offset: 2px; }


.sn-ext-toggle-row {
  display: flex; align-items: center; justify-content: space-between;
  margin: 10px 0 0; padding: 6px 2px;
  font-family: var(--font-ui);
}
.sn-ext-toggle-label {
  font-size: 0.86rem;
  color: var(--text);
  opacity: .9;
  flex: 1;
  padding-right: 10px;
}
.sn-ext-toggle-row .sn-ios-toggle { flex-shrink: 0; cursor: pointer; }
.sn-ext-toggle-row .sn-ios-toggle:focus { outline: 2px solid rgba(255,184,51,.45); outline-offset: 2px; }


.sn-section-divider {
  height: 1px;
  background: var(--surface-border-hi, rgba(255,255,255,.08));
  margin: 12px 0;
}


.sn-use-last-label {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  color: var(--text);
  opacity: .65;
  margin: 0 0 6px;
  letter-spacing: .02em;
}


.sn-dash-comp-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 10px;
}
.sn-dash-comp-left {
  display: flex; align-items: center; gap: 8px;
}
.sn-dash-comp-swatch {
  width: 14px; height: 14px;
  border-radius: 50%;
  cursor: pointer;
  border: 1.5px solid var(--surface-border-hi);
  transition: all var(--ease);
  flex-shrink: 0;
}
.sn-dash-comp-swatch:hover {
  transform: scale(1.2);
  border-color: rgba(255,255,255,.4);
}
.sn-dash-comp-name {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  color: var(--text);
}
.sn-dash-comp-right {
  display: flex; align-items: center; gap: 4px;
}
.sn-dash-comp-btn {
  background: none; border: none; cursor: pointer;
  color: var(--text-dim); opacity: .3;
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px;
  border-radius: var(--radius-sm);
  transition: all var(--ease);
}
.sn-dash-comp-btn:hover { opacity: .6; background: var(--surface-raised); }
.sn-dash-comp-btn.on { opacity: 1; color: var(--accent); }


.sn-dash-bh-layout {
  display: flex;
  gap: 16px;
}
.sn-dash-bh-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 140px;
}
.sn-dash-bh-donut-wrap {
  position: relative;
  width: 110px;
  height: 110px;
  margin: 8px 0 10px;
}
.sn-dash-bh-donut-label {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
}
.sn-dash-bh-donut-pct {
  font-family: var(--font-ui);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
}
.sn-dash-bh-donut-sub {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-muted);
  margin-top: 1px;
}
.sn-dash-bh-legend {
  display: flex;
  gap: 12px;
}
.sn-dash-bh-legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: var(--font-ui);
  font-size: .6rem;
  color: var(--text-dim);
}
.sn-dash-bh-legend-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  display: inline-block;
}
.sn-dash-bh-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sn-dash-bh-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 12px;
  background: var(--hover-subtle);
  border-radius: var(--radius-sm);
  border: 1px solid var(--divider-soft);
}
.sn-dash-bh-row-lbl {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim);
}
.sn-dash-bh-row-val {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  color: var(--text);
}
.sn-dash-bh-row-val.pos { color: var(--green); }
.sn-dash-bh-row-val.neg { color: var(--red); }


.sn-dash-slider-card {
  margin: 6px 0;
  padding: 10px 14px 8px;
}
.sn-dash-yl-slider-labels {
  display: flex; justify-content: space-between; padding: 0 2px;
  margin-bottom: 6px;
}
.sn-dash-yl-header-right {
  display: flex; align-items: center; gap: 8px;
}
.sn-dash-filters-btn {
  font-family: var(--font-ui);
  font-size: .6rem; font-weight: 600;
  padding: 3px 8px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border-hi);
  background: none;
  color: var(--text-dim);
  cursor: pointer;
  transition: all var(--ease);
  display: flex; align-items: center; gap: 4px;
}
.sn-dash-filters-btn:hover {
  background: var(--surface-raised);
  border-color: var(--surface-border-strong);
  color: var(--text);
}
.sn-dash-filters-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  border-color: transparent;
}


.sn-dash-filter-wrap {
  position: relative;
}
.sn-dash-filter-menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 4px;
  min-width: 180px;
  padding: 6px 0;
  border-radius: var(--radius-md);
  background: #1c1c20;
  backdrop-filter: var(--overlay-blur, blur(20px));
  border: 1px solid var(--surface-border);
  box-shadow: var(--overlay-shadow, 0 8px 32px rgba(0,0,0,.5));
  z-index: 100;
}
.sn-dash-filter-menu.open {
  display: block;
}
.sn-dash-fm-group {
  padding: 2px 0;
}
.sn-dash-fm-group + .sn-dash-fm-group {
  border-top: 1px solid var(--surface-raised);
}
.sn-dash-fm-title {
  font-family: var(--font-ui);
  font-size: .65rem;
  font-weight: 700;
  color: var(--text-faint);
  text-transform: uppercase;
  letter-spacing: .6px;
  padding: 8px 12px 4px;
  pointer-events: none;
  user-select: none;
}
.sn-dash-fm-item {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text);
  padding: 6px 12px 6px 16px;
  cursor: pointer;
  transition: all var(--ease);
  border-radius: 4px;
  margin: 1px 6px;
}
.sn-dash-fm-item:hover {
  background: var(--surface-border);
  color: #fff;
}
.sn-dash-fm-topn {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sn-dash-fm-input {
  width: 28px;
  text-align: center;
  background: var(--surface-raised);
  border: 1px solid var(--surface-border);
  border-radius: 4px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  padding: 1px 2px;
  -moz-appearance: textfield;
}
.sn-dash-fm-input::-webkit-outer-spin-button,
.sn-dash-fm-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.sn-dash-fm-reset {
  color: var(--text-muted);
  font-weight: 600;
  text-align: center;
}


.sn-dash-filter-tag {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: var(--font-ui);
  font-size: .6rem; font-weight: 600;
  padding: 2px 6px 2px 8px;
  border-radius: var(--radius-sm);
  background: rgba(255,235,59,.12);
  color: rgba(255,235,59,.95);
  border: 1px solid rgba(255,235,59,.25);
  white-space: nowrap;
}
.sn-dash-filter-tag-x {
  cursor: pointer;
  font-size: .82rem;
  line-height: 1;
  opacity: .7;
  transition: opacity var(--ease);
  padding: 0 2px;
}
.sn-dash-filter-tag-x:hover { opacity: 1; }


.sn-dash-filters {
  display: flex; flex-direction: column; gap: 6px;
}
.sn-dash-filter-row {
  display: flex; align-items: center; gap: 8px;
}
.sn-dash-filter-label {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .4px;
  width: 52px; flex-shrink: 0;
}
.sn-dash-filter-btns {
  display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
}
.sn-dash-pill {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  padding: 3px 8px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border);
  background: none;
  color: var(--text-dim);
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap;
}
.sn-dash-pill:hover {
  background: var(--surface-raised);
  border-color: var(--surface-border-strong);
  color: var(--text);
}
.sn-dash-pill:active,
.sn-dash-pill.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  border-color: transparent;
}
.sn-dash-pill-disabled {
  opacity: .25;
  cursor: not-allowed;
}
.sn-dash-pill-disabled:hover {
  background: none;
  border-color: var(--surface-border);
  color: var(--text-dim);
}
.sn-dash-cycle-input {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  width: 34px; padding: 3px 4px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border);
  background: var(--hover-subtle);
  color: var(--text);
  text-align: center;
  outline: none;
  transition: border-color var(--ease);
}
.sn-dash-cycle-input:focus {
  border-color: rgba(255,255,255,.3);
}
.sn-dash-cycle-input::placeholder { color: var(--text-dim); opacity: .5; }

.sn-dash-cycle-input::-webkit-inner-spin-button,
.sn-dash-cycle-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.sn-dash-cycle-input { -moz-appearance: textfield; }




.sn-yl-inv-count {
  text-align: center;
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  color: rgba(255,235,59,.6);
  padding: 4px 0 0;
}


.sn-yl-reset {
  display: block; width: calc(100% - 12px); margin: 6px auto 8px;
  padding: 5px 0;
  border: 1px solid rgba(255,235,59,.25);
  border-radius: var(--radius-sm);
  background: none; cursor: pointer;
  font-family: var(--font-ui);
  font-size: .7rem; font-weight: 600;
  color: rgba(255,235,59,.7);
  transition: all var(--ease);
}
.sn-yl-reset:hover { background: rgba(255,235,59,.08); color: rgba(255,235,59,.95); border-color: rgba(255,235,59,.4); }


.sn-yl-cb {
  width: 14px; height: 14px;
  border-radius: 3px;
  border: 1.5px solid var(--border-hi);
  background: transparent;
  transition: all var(--ease);
  position: relative;
  cursor: pointer;
}
.sn-yl-cb.on {
  background: transparent;
  border-color: rgba(255,255,255,.45);
}
.sn-yl-cb.on::after {
  content: '';
  position: absolute;
  top: 1px; left: 4px;
  width: 4px; height: 7px;
  border: solid rgba(255,255,255,.9);
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
}


.sn-yl-row .sn-yl-year-col {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  color: var(--text);
}
.sn-yl-row:not(.checked) .sn-yl-year-col { color: var(--text-dim); }


.sn-yl-bar-track {
  position: relative;
  height: 8px;
  border-radius: 4px;
  background: var(--hover-subtle);
  width: 100%;
}
.sn-yl-bar {
  position: absolute; top: 0; height: 100%;
  border-radius: 4px;
  min-width: 2px;
}
.sn-yl-bar-zero {
  position: absolute; top: -1px; bottom: -1px;
  left: 50%; width: 1px;
  background: var(--surface-border-hi);
}


.sn-yl-row .sn-yl-ytd-col {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
}


.sn-sort-pills { display: flex; gap: 6px; margin-bottom: 8px; }
.sn-sort-pill {
  padding: 5px 12px; border-radius: 16px;
  border: 1px solid var(--border-hi);
  background: var(--divider-soft);
  color: var(--text);
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  cursor: pointer; transition: all .2s ease;
}
.sn-sort-pill:hover { background: var(--surface-border); }
.sn-sort-pill.active {
  background: linear-gradient(135deg, var(--blue-strong), var(--purple-dim));
  border-color: var(--blue-strong);
  color: #fff;
}


.sn-search-config {
  display: flex; gap: 6px; align-items: flex-end;
  margin-bottom: 12px;
}
.sn-config-field {
  flex: 1;
  display: flex; flex-direction: column; gap: 2px;
}
.sn-config-field span {
  font-size: .6rem;
  color: var(--text-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .4px;
}
.sn-config-input {
  padding: 5px 8px;
  border-radius: var(--radius-sm);
  background: var(--divider-soft);
  border: 1px solid var(--border-hi);
  color: var(--text);
  font-size: .82rem; font-weight: 500;
  font-family: var(--font-ui);
  text-align: center;
  width: 100%;
  outline: none;
  transition: border-color .2s;
}
.sn-config-input:focus { border-color: var(--blue-focus); }
.sn-config-dash {
  color: var(--text-muted);
  font-size: .82rem;
  margin-bottom: 6px;
}
.sn-analyze-btn {
  padding: 6px 14px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--blue-focus), var(--purple-med));
  border: 1px solid var(--blue-strong);
  color: #fff;
  font-size: .82rem; font-weight: 600;
  font-family: var(--font-ui);
  cursor: pointer;
  margin-bottom: 2px;
  flex-shrink: 0;
  transition: all .2s ease;
  box-shadow: 0 2px 8px var(--blue-med);
}
.sn-analyze-btn:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, var(--blue-focus), var(--purple-med));
  box-shadow: 0 4px 12px var(--blue-strong);
}


.sn-auto-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 10px;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 12px;
}
.sn-auto-row-left {
  display: flex; align-items: center; gap: 5px;
}
.sn-auto-label {
  font-size: .82rem; color: var(--text-dim);
}
.sn-threshold-badge {
  padding: 1px 7px;
  border-radius: var(--radius-sm);
  background: var(--green-dim);
  color: var(--green);
  font-size: .82rem; font-weight: 700;
  font-family: var(--font-ui);
}
.sn-auto-links { display: flex; gap: 8px; }
.sn-auto-link {
  font-size: .82rem; color: var(--blue);
  background: none; border: none;
  cursor: pointer; font-family: var(--font-ui);
  font-weight: 600;
  transition: color .15s;
}
.sn-auto-link:hover { color: var(--text-bright); }


.sn-opp-section { margin-bottom: 12px; }
.sn-opp-header {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 8px;
}
.sn-opp-header-line {
  flex: 1; height: 2px; border-radius: 1px;
}
.sn-opp-header-line.long { background: linear-gradient(90deg, var(--green), transparent); }
.sn-opp-header-line.short { background: linear-gradient(90deg, var(--red), transparent); }
.sn-opp-header-text {
  font-size: .82rem; font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  white-space: nowrap;
}
.sn-opp-header-text.long { color: var(--green); }
.sn-opp-header-text.short { color: var(--red); }
.sn-opp-count {
  font-size: .82rem;
  color: var(--text-muted);
  white-space: nowrap;
  font-family: var(--font-ui);
}


.sn-period-card {
  background: var(--divider-soft);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  padding: 10px 12px;
  margin-bottom: 6px;
  transition: all .25s cubic-bezier(.4,0,.2,1);
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.sn-period-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--surface-raised), transparent);
}
.sn-period-card:hover {
  background: var(--hover-medium);
  border-color: var(--surface-border-hi);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.sn-period-card.sn-period-active {
  border-color: var(--blue-focus);
  background: var(--blue-dim);
}

.sn-period-card-inner {
  display: flex; align-items: center; gap: 10px;
}


.sn-ring-container {
  width: 38px; height: 38px;
  flex-shrink: 0;
  position: relative;
}
.sn-ring-container svg {
  width: 38px; height: 38px;
  transform: rotate(-90deg);
}
.sn-ring-bg {
  fill: none;
  stroke: var(--surface-raised);
  stroke-width: 3.5;
}
.sn-ring-progress {
  fill: none;
  stroke-width: 3.5;
  stroke-linecap: round;
  transition: stroke-dashoffset 1s cubic-bezier(.4,0,.2,1);
}
.sn-ring-progress.green { stroke: var(--green); }
.sn-ring-progress.red { stroke: var(--red); }
.sn-ring-text {
  position: absolute;
  inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: .82rem; font-weight: 800;
  font-family: var(--font-ui);
}

.sn-period-card-info {
  flex: 1; min-width: 0;
}
.sn-period-dates {
  font-size: .82rem; font-weight: 500;
  color: var(--text);
}
.sn-period-meta {
  display: flex; align-items: center; gap: 5px;
  margin-top: 2px;
}
.sn-gain-pill {
  padding: 1px 7px;
  border-radius: var(--radius-sm);
  font-size: .82rem; font-weight: 700;
  font-family: var(--font-ui);
}
.sn-gain-pill.positive {
  background: var(--green-dim);
  color: var(--green);
}
.sn-gain-pill.negative {
  background: var(--red-dim);
  color: var(--red);
}
.sn-days-badge {
  padding: 1px 6px;
  border-radius: var(--radius-sm);
  background: var(--divider-soft);
  font-size: .82rem; font-weight: 500;
  color: var(--text-muted);
  font-family: var(--font-ui);
}

.sn-play-btn {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--divider-soft);
  border: 1px solid var(--border-hi);
  color: var(--text-dim);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all .2s ease;
  flex-shrink: 0;
  font-size: .6rem;
}
.sn-play-btn:hover {
  background: var(--blue-dim);
  border-color: var(--blue-focus);
  color: var(--blue);
}


.sn-panel-footer {
  padding: 8px 14px 12px;
  text-align: center;
  font-size: .82rem;
  color: var(--text-muted);
  flex-shrink: 0;
  border-top: 1px solid var(--hover-subtle);
  font-family: var(--font-ui);
}
.sn-panel-footer strong { color: var(--text-dim); font-weight: 600; }


@keyframes snCardIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.sn-period-card {
  animation: snCardIn .35s cubic-bezier(.4,0,.2,1) backwards;
}
.sn-period-card:nth-child(2) { animation-delay: .04s; }
.sn-period-card:nth-child(3) { animation-delay: .08s; }
.sn-period-card:nth-child(4) { animation-delay: .12s; }


.sn-v-loading {
  text-align: center;
  padding: 18px 12px;
  color: var(--text-dim);
  font-size: .82rem;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.sn-spinner {
  width: 14px; height: 14px;
  border: 2px solid var(--surface-border);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: sn-spin .6s linear infinite;
  flex-shrink: 0;
}
@keyframes sn-spin { to { transform: rotate(360deg); } }



.sn-bt-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--overlay-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(var(--overlay-blur));
}
.sn-dash-modal {
  background: var(--panel);
  border: none;
  border-radius: 0;
  width: 100vw;
  max-width: none;
  height: 100vh;
  max-height: none;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  box-shadow: none;
}


.sn-dash-header {
  display: flex;
  align-items: center;
  padding: 10px 20px;
  gap: 12px;
  border-bottom: 1px solid var(--surface-raised);
  background: var(--surface-veil);
}
.sn-dash-symbol {
  font-family: var(--font-ui);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text-bright);
  background: var(--hover-subtle);
  padding: 5px 14px;
  border-radius: var(--radius-sm);
}
.sn-dash-divider {
  width: 1px;
  height: 20px;
  background: var(--surface-border);
}
.sn-dash-title {
  font-size: .95rem;
  font-weight: 500;
  color: var(--text-dim);
  flex: 1;
}

.sn-dash-close-btn {
  background: var(--surface-raised);
  border: 1px solid var(--surface-border);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  padding: 5px 16px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--ease), color var(--ease);
}
.sn-dash-close-btn:hover {
  background: rgba(255,255,255, var(--hover-medium));
  color: var(--text-bright);
}

.sn-dash-ctrl-block {
  padding: 10px 12px;
  border-bottom: 1px solid var(--surface-raised);
}
.sn-dash-ctrl-title {
  display: block;
  font-size: .7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-muted);
  margin-bottom: 8px;
}
.sn-dash-range {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sn-dash-range-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.sn-dash-slider-container {
  position: relative;
  height: 24px;
  flex: 1;
}
.sn-dash-date-controls {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.sn-dash-kpis {
  display: flex;
  gap: 20px;
}
.sn-dash-kpi { text-align: center; }
.sn-dash-kpi-label {
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-muted);
}
.sn-dash-kpi-val {
  font-family: var(--font-ui);
  font-size: .9rem;
  font-weight: 600;
}
.sn-dash-kpi-pos { color: var(--green); }
.sn-dash-kpi-neg { color: var(--red); }
.sn-dash-kpi-acc { color: var(--blue); }
.sn-bt-close {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 1.2rem;
  cursor: pointer;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  transition: all var(--ease);
}
.sn-bt-close:hover { color: var(--text-bright); background: var(--hover-medium); }


.sn-dash-columns {
  flex: 1;
  display: flex;
  min-height: 0;
}


.sn-dash-left-sb {
  flex: 0 0 330px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--surface-raised);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}


.sn-dash-sn-controls {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--surface-raised);
  flex-shrink: 0;
}
.sn-dash-sn-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.sn-dash-date-pair {
  display: flex;
  gap: 8px;
}
.sn-dash-date-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.sn-dash-date-selects {
  display: flex;
  gap: 4px;
}
.sn-dash-date-selects .sn-bt-day,
.sn-dash-date-selects .sn-bt-month {
  width: auto;
  flex: 1;
  min-width: 0;
}
.sn-dash-sn-range {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
}
.sn-dash-sn-range .sn-dash-slider-container { flex: 1; min-width: 60px; margin-left: 5px; margin-right: 5px; }
.sn-dash-gear-row-inline {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
}
.sn-dash-gear-row-inline .sn-dash-rc-label {
  font-size: .82rem;
}


.sn-dash-charts-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}


.sn-dash-metrics-sb {
  flex: 0 0 20%;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--surface-raised);
  min-width: 0;
  overflow-y: auto;
}


.sn-dash-chart-top {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.sn-dash-chart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  border-bottom: 1px solid var(--divider-soft);
}
.sn-dash-chart-label {
  font-size: .95rem;
  font-weight: 600;
  color: var(--text);
}
.sn-dash-hint {
  font-size: .82rem;
  color: var(--text-muted);
  font-style: italic;
}
.sn-dash-clean-btn {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  padding: 2px 8px;
  margin-left: 8px;
  background: none;
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  cursor: pointer;
  pointer-events: auto;
  transition: var(--ease);
}
.sn-dash-clean-btn:hover {
  background: rgba(255,255,255, var(--hover-medium));
  border-color: var(--surface-border-strong);
  color: var(--text);
}

.sn-dash-chart-inlay {
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 3;
  pointer-events: none;
}
.sn-dash-chart-inlay-title {
  font-size: .95rem;
  font-weight: 600;
  color: var(--text);
}
.sn-dash-chart-inlay-event {
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-dim);
  margin-top: 20px;
  display: none;
}
.sn-dash-chart-inlay-event.visible {
  display: block;
}
.sn-dash-chart-toggle {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  cursor: pointer;
  padding: 6px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
  transition: var(--ease);
}
.sn-dash-chart-toggle:hover {
  background: rgba(255,255,255, var(--hover-medium));
  border-color: var(--surface-border-strong);
  color: var(--text);
}
.sn-dash-chart-toggle.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  border-color: transparent;
}


.sn-dash-gear-wrap {
  position: absolute;
  left: 46px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: auto;
}
.sn-dash-gear-btn { position: static !important; transform: none !important; }
.sn-dash-gear-popup {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 160px;
  background: var(--overlay-bg);
  backdrop-filter: var(--overlay-blur);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  box-shadow: var(--overlay-shadow);
  padding: 8px 12px;
  display: none;
  z-index: 50;
}
.sn-dash-gear-popup.visible { display: block; }
.sn-dash-gear-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-muted);
}
.sn-dash-gear-row + .sn-dash-gear-row {
  border-top: 1px solid var(--hover-subtle);
}

.sn-dash-chart-inlay-bottom {
  position: absolute;
  bottom: 8px;
  right: 16px;
  z-index: 3;
  pointer-events: none;
}

.sn-dash-chart {
  flex: 1;
  min-height: 0;
  padding: 8px 12px;
  position: relative;
}
.sn-dash-chart canvas {
  width: 100%;
  height: 100%;
}



.sn-dash-divider-h {
  height: 7px;
  cursor: row-resize;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  background: var(--hover-subtle);
  border-top: 1px solid var(--surface-raised);
  border-bottom: 1px solid var(--surface-raised);
  transition: background var(--ease);
}
.sn-dash-divider-h:hover {
  background: var(--surface-raised);
}
.sn-dash-divider-h-grip {
  width: 36px;
  height: 3px;
  border-radius: 2px;
  background: var(--surface-border-hi);
}
.sn-dash-divider-h:hover .sn-dash-divider-h-grip {
  background: rgba(255,255,255,.3);
}

.sn-dash-bt-area {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.sn-dash-bt-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 16px;
  border-bottom: 1px solid var(--divider-soft);
  flex-shrink: 0;
  flex-wrap: wrap;
}
.sn-dash-bt-title {
  font-size: .95rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
}
.sn-dash-bt-controls {
  display: flex;
  align-items: center;
  gap: 4px;
}
.sn-dash-bt-controls .sn-bt-input {
  padding: 2px 4px;
  font-size: .82rem;
}
.sn-dash-bt-controls .sn-dash-rc-go {
  padding: 3px 12px;
  font-size: .82rem;
}
.sn-dash-bt-slider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  min-width: 140px;
  flex: 0 1 220px;
}
.sn-dash-bt-tag {
  font-size: .82rem;
  padding: 2px 10px;
  border-radius: 20px;
  font-weight: 500;
  background: var(--green-dim);
  color: var(--green);
}
.sn-dash-bt-tag.sn-dash-bt-tag-bear {
  background: var(--red-dim);
  color: var(--red);
}
.sn-dash-bt-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sn-dash-bt-ev-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border-bottom: 1px solid var(--divider-soft);
  flex-shrink: 0;
}
.sn-dash-bt-ev-hint-text {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-dim);
}

.sn-dash-bt-controls-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 7px 16px;
  border-bottom: 1px solid var(--divider-soft);
  flex-shrink: 0;
}
.sn-dash-bt-controls-row .sn-dash-date-controls {
  flex-shrink: 0;
}
.sn-dash-bt-controls-row .sn-dash-range {
  max-width: 300px;
  flex: 1;
  min-width: 120px;
}
.sn-dash-bt-body {
  flex: 1;
  display: flex;
  gap: 10px;
  padding: 8px 12px;
  min-height: 0;
}
.sn-bt-chart-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  position: relative;
}
.sn-bt-chart-title {
  position: absolute;
  top: 8px;
  left: 12px;
  z-index: 2;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-muted);
  pointer-events: none;
  font-family: var(--font-ui);
}

.sn-dash-bt-tooltip {
  position: absolute;
  z-index: 10;
  background: rgba(16, 18, 25, .92);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 6px 10px;
  font-family: var(--font-ui);
  font-size: .82rem;
  line-height: 1.4;
  pointer-events: none;
  white-space: nowrap;
  backdrop-filter: blur(8px);
}

.sn-bt-chart {
  flex: 1;
  min-height: 0;
  border-radius: var(--radius-sm);
  position: relative;
  overflow: hidden;
}


.sn-dash-sidebar {
  flex: 20;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--surface-raised);
  min-width: 0;
  overflow: hidden;
}


.sn-dash-sb-tabs {
  display: flex;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  padding: 3px;
  position: relative;
  border: 1px solid var(--divider-soft);
  flex-shrink: 0;
  margin: 8px 10px;
}
.sn-dash-sb-pill {
  position: absolute;
  top: 3px; bottom: 3px;
  background: var(--surface-border-hi);
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
  transition: all .3s cubic-bezier(.2,.8,.2,1);
  z-index: 1;
}
.sn-dash-sb-tab {
  flex: 1;
  border: none;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .905rem;
  font-weight: 500;
  padding: 5px 0;
  cursor: pointer;
  position: relative; z-index: 2;
  transition: color .2s;
}
.sn-dash-sb-tab:hover { color: var(--text); }
.sn-dash-sb-tab.active {
  color: var(--text);
}


.sn-dash-sb-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
  overflow: hidden;
}
#snDashSbMetrics {
  overflow-y: auto;
  padding: 12px 14px;
}
#snDashSbMetrics::-webkit-scrollbar { width: 3px; }
#snDashSbMetrics::-webkit-scrollbar-thumb { background: var(--surface-raised); border-radius: 3px; }
#snDashSbYears {
  overflow: hidden;
}
#snDashYearList::-webkit-scrollbar { width: 3px; }
#snDashYearList::-webkit-scrollbar-thumb { background: var(--surface-raised); border-radius: 3px; }


#snDashYearList .sn-dash-tab { font-size: .945rem; }
#snDashYearList .sn-v-label { font-size: .905rem; }
#snDashYearList .sn-dash-comp-name { font-size: .905rem; }
#snDashYearList .sn-yl-count { font-size: .775rem; }
#snDashYearList .sn-yl-header { font-size: .745rem; }
#snDashYearList .sn-yl-row .sn-yl-year-col { font-size: .82rem; }
#snDashYearList .sn-yl-row .sn-yl-ytd-col { font-size: .805rem; }
#snDashYearList .sn-dash-bh-donut-pct { font-size: 1.225rem; }
#snDashYearList .sn-dash-bh-donut-sub { font-size: .675rem; }
#snDashYearList .sn-dash-bh-legend-item { font-size: .725rem; }
#snDashYearList .sn-dash-bh-row-lbl { font-size: .845rem; }
#snDashYearList .sn-dash-bh-row-val { font-size: .925rem; }
#snDashYearList .sn-dash-filters-btn { font-size: .725rem; }
#snDashYearList .sn-dash-filter-tag { font-size: .725rem; }
#snDashYearList .sn-dash-filter-label { font-size: .775rem; }
#snDashYearList .sn-dash-pill { font-size: .775rem; }
#snDashYearList .sn-dash-cycle-input { font-size: .775rem; }

.sn-dash-rail-header {
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-bottom: 1px solid var(--hover-subtle);
}
.sn-dash-rail-title {
  font-size: .92rem;
  font-weight: 600;
  color: var(--text);
}
.sn-dash-rail-controls {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
}
.sn-dash-rc-label {
  font-size: .82rem;
  color: var(--text-muted);
  text-transform: uppercase;
}
.sn-dash-rc-input {
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  border-radius: 4px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  padding: 5px 8px;
  width: 46px;
  text-align: center;
  outline: none;
  transition: border-color var(--ease);
}
.sn-dash-rc-input:focus { border-color: var(--blue-focus); }
.sn-dash-rc-input.sn-dash-rc-wide { width: 62px; }
.sn-dash-rc-go {
  background: var(--surface-raised);
  color: var(--text);
  border: 1px solid var(--surface-border-hi);
  border-radius: 4px;
  padding: 5px 12px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  margin-left: auto;
  transition: all var(--ease);
}
.sn-dash-rc-go:hover { background: var(--surface-border-hi); border-color: rgba(255,255,255,.3); }
.sn-dash-bh-btn {
  background: none;
  color: var(--text-dim);
  border: 1px solid var(--surface-border-hi);
  border-radius: 4px;
  padding: 5px 10px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap;
}
.sn-dash-bh-btn:hover {
  background: var(--surface-raised);
  border-color: var(--surface-border-strong);
  color: var(--text);
}


.sn-bp-container {
  border-radius: var(--radius-md);
  border: 1px solid var(--border-hi);
  background: var(--divider-soft);
  padding: 16px;
  margin: 10px;
  overflow: hidden;
}


.sn-bp-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.sn-bp-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.sn-bp-icon {
  width: 20px; height: 20px;
  color: var(--blue);
  flex-shrink: 0;
}
.sn-bp-title {
  font-family: var(--font-ui);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-bright);
  letter-spacing: -.02em;
}


.sn-bp-sort-bar {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 6px 12px;
}


.sn-bp-sort-pill {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: 100px;
  cursor: pointer;
  transition: all var(--ease);
  position: relative;
}
.sn-bp-sort-pill:hover { background: var(--hover-medium); }
.sn-bp-sort-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-dim);
  letter-spacing: .03em;
}
.sn-bp-sort-chevron {
  width: 14px; height: 14px;
  color: var(--text-dim);
}


.sn-bp-sort-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: 160px;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 28px rgba(0,0,0,.45);
  z-index: 50;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: all .15s ease;
}
.sn-bp-sort-dropdown.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.sn-bp-sort-opt {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 16px;
  border: none;
  background: none;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-dim);
  cursor: pointer;
  transition: all var(--ease);
}
.sn-bp-sort-opt:hover { background: var(--hover-subtle); }
.sn-bp-sort-opt.active { color: var(--blue); background: var(--blue-dim); }


.sn-bp-inputs {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 16px;
}
.sn-bp-input-group { flex: 1; }
.sn-bp-input-label {
  display: block;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .03em;
  margin-bottom: 4px;
}
.sn-bp-input {
  width: 100%;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 5px 8px;
  font-family: var(--font-ui);
  font-size: .90rem;
  font-weight: 500;
  color: var(--text);
  outline: none;
  transition: border-color var(--ease);
}
.sn-bp-input:focus { border-color: var(--blue-focus); }

.sn-bp-input::-webkit-inner-spin-button,
.sn-bp-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.sn-bp-input { -moz-appearance: textfield; }

.sn-bp-run-btn {
  background: var(--surface-raised);
  color: var(--text);
  border: 1px solid var(--surface-border-hi);
  padding: 6px 14px;
  border-radius: 4px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap;
  flex-shrink: 0;
}
.sn-bp-run-btn:hover { background: var(--surface-border-hi); border-color: rgba(255,255,255,.3); }



.sn-bp-mode-wrap {
  display: flex;
  gap: 0;
  margin: 0 10px 8px;
  background: rgba(0,0,0,.35);
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-raised);
  padding: 3px;
}
.sn-bp-mode {
  flex: 1;
  border: none;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 600;
  padding: 7px 0;
  cursor: pointer;
  border-radius: 4px;
  transition: all var(--ease);
  letter-spacing: .02em;
}
.sn-bp-mode:hover { color: var(--text); }
.sn-bp-mode.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  box-shadow: 0 2px 10px rgba(0,0,0,.3);
}
.sn-bp-mode-desc {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim);
  padding: 0 12px 8px;
  line-height: 1.3;
  opacity: .7;
}

.sn-bp-toggle-wrap {
  display: flex;
  gap: 8px;
  padding: 3px;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  border: 1px solid var(--divider-soft);
  margin-bottom: 4px;
}
.sn-bp-toggle {
  flex: 1;
  border: none;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  padding: 5px 0;
  cursor: pointer;
  border-radius: 4px;
  transition: all .2s;
}
.sn-bp-toggle:hover { color: var(--text); }
.sn-bp-toggle.active {
  background: var(--surface-border-hi);
  color: var(--text);
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
}
.sn-bp-toggle.sn-bp-toggle-bull.active {
  background: rgba(38, 217, 127, .20);
  color: #26d97f;
}
.sn-bp-toggle.sn-bp-toggle-bear.active {
  background: rgba(240, 80, 110, .20);
  color: #f0506e;
}

.sn-bp-select {
  appearance: auto;
  cursor: pointer;
  background: var(--surface-raised);
}
.sn-bp-select option {
  background: #1e1e1e;
  color: var(--text);
}

.sn-bp-show-toggle {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border);
  background: var(--surface-raised);
  cursor: pointer;
  color: rgba(255,255,255,.4);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  transition: all var(--ease);
  flex-shrink: 0;
}
.sn-bp-show-toggle:hover { border-color: var(--surface-border-strong); }
.sn-bp-show-toggle.active {
  color: var(--blue);
  border-color: var(--blue);
  background: var(--blue-dim);
}
.sn-bp-show-toggle span:empty { display: none; }


.sn-bp-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sn-bp-list::-webkit-scrollbar { width: 3px; }
.sn-bp-list::-webkit-scrollbar-track { background: transparent; }
.sn-bp-list::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.sn-bp-card {
  padding: 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--divider-soft);
  background: var(--hover-subtle);
  cursor: pointer;
  transition: all var(--ease);
  animation: snCardIn .35s cubic-bezier(.4,0,.2,1) backwards;
}
.sn-bp-card:nth-child(2) { animation-delay: .05s; }
.sn-bp-card:nth-child(3) { animation-delay: .1s; }
.sn-bp-card:nth-child(4) { animation-delay: .15s; }
.sn-bp-card:nth-child(5) { animation-delay: .2s; }
.sn-bp-card:hover {
  background: var(--hover-medium);
}
.sn-bp-card.sn-bp-active {
  border-color: var(--blue-focus);
  background: var(--blue-dim);
}
.sn-bp-degraded { opacity: .65; }


.sn-bp-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.sn-bp-card-left {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.sn-bp-dot { display: none; }


.sn-bp-bull.sn-bp-card {
  border-left: 3px solid var(--green);
}
.sn-bp-bear.sn-bp-card {
  border-left: 3px solid var(--red);
}

.sn-bp-rank {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  color: rgba(255,255,255,.45);
  flex-shrink: 0;
  min-width: 22px;
}
.sn-bp-card-dates {
  font-family: var(--font-ui);
  font-size: .90rem;
  font-weight: 600;
  color: var(--text);
}
.sn-bp-card-wr {
  font-family: var(--font-ui);
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -.02em;
  flex-shrink: 0;
}
.sn-bp-bull .sn-bp-card-wr { color: var(--green); }
.sn-bp-bear .sn-bp-card-wr { color: var(--red); }


.sn-bp-badge {
  font-size: .82rem;
  flex-shrink: 0;
  cursor: default;
  line-height: 1;
}
.sn-bp-badge-warn { color: var(--amber); }
.sn-bp-badge-star { color: var(--green); }


.sn-bp-card-stats {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.sn-bp-stats-left {
  display: flex;
  gap: 20px;
}
.sn-bp-stat { text-align: left; }
.sn-bp-stat-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .03em;
  margin-bottom: 2px;
}
.sn-bp-stat-value {
  font-family: var(--font-ui);
  font-size: .90rem;
  font-weight: 600;
  color: var(--text-soft);
}
.sn-bp-bull .sn-bp-stat-gain { color: var(--green); }
.sn-bp-bear .sn-bp-stat-gain { color: var(--red); }

.sn-bp-days-badge {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-muted);
  background: var(--hover-subtle);
  padding: 4px 12px;
  border-radius: var(--radius-sm);
}


.sn-bp-card-eye {
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  color: var(--surface-border-strong);
  cursor: pointer;
  transition: all var(--ease);
  flex-shrink: 0;
}
.sn-bp-card-eye:hover {
  color: rgba(255,255,255,.5);
  background: var(--hover-medium);
}
.sn-bp-card-eye.on {
  color: var(--blue);
}
.sn-bp-bull .sn-bp-card-eye.on { color: var(--green); }
.sn-bp-bear .sn-bp-card-eye.on { color: var(--red); }


.sn-bp-card.sn-bp-on-chart {
  border-color: var(--blue-focus);
}
.sn-bp-bull.sn-bp-on-chart {
  border-color: var(--green-med);
}
.sn-bp-bear.sn-bp-on-chart {
  border-color: var(--red-med);
}



.sn-bp-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 18px 0;
}
.sn-bp-loading-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--text-muted);
  animation: snBpPulse 1s ease-in-out infinite;
}
.sn-bp-loading-dot:nth-child(2) { animation-delay: 0.15s; }
.sn-bp-loading-dot:nth-child(3) { animation-delay: 0.3s; }
@keyframes snBpPulse {
  0%, 80%, 100% { opacity: 0.2; transform: scale(0.8); }
  40% { opacity: 1; transform: scale(1.2); }
}


.sn-bp-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: var(--overlay-bg);
  backdrop-filter: var(--overlay-blur);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sn-bp-modal {
  background: #1e1e2a;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 40px rgba(0,0,0,.6);
  padding: 28px 32px 24px;
  width: 380px;
  max-width: 90vw;
}
.sn-bp-modal-title {
  font-family: var(--font-ui);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 8px;
}
.sn-bp-modal-desc {
  font-family: var(--font-ui);
  font-size: 0.88rem;
  color: var(--text-muted);
  margin: 0 0 18px;
  line-height: 1.45;
}
.sn-bp-modal-label {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  display: block;
  margin-bottom: 6px;
}
.sn-bp-modal-input {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 14px;
  font-family: var(--font-ui);
  font-size: 0.95rem;
  color: var(--text);
  background: var(--hover-subtle);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-sm);
  outline: none;
  transition: border-color var(--ease);
}
.sn-bp-modal-input:focus {
  border-color: var(--blue);
}
.sn-bp-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
}
.sn-bp-modal-cancel,
.sn-bp-modal-confirm {
  font-family: var(--font-ui);
  font-size: 0.88rem;
  font-weight: 600;
  padding: 9px 20px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  border: none;
  transition: all var(--ease);
}
.sn-bp-modal-cancel {
  background: var(--surface-raised);
  color: var(--text-muted);
}
.sn-bp-modal-cancel:hover {
  background: var(--surface-border);
  color: var(--text);
}
.sn-bp-modal-confirm {
  background: var(--blue);
  color: #fff;
}
.sn-bp-modal-confirm:hover {
  filter: brightness(1.15);
}



.sn-dash-rr-title {
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-muted);
  margin-bottom: 10px;
}


.sn-bt-donut-wrap {
  position: relative;
  width: 90px;
  height: 90px;
  margin: 0 auto 10px;
}
.sn-bt-donut-wrap canvas { width: 100%; height: 100%; }
.sn-bt-donut-label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.sn-bt-donut-pct {
  font-family: var(--font-ui);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-bright);
}
.sn-bt-donut-sub {
  font-size: .82rem;
  color: var(--text-dim);
  text-transform: uppercase;
}


.sn-bt-stat-list { width: 100%; }
.sn-bt-stat-row {
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
  font-size: .82rem;
  border-bottom: 1px solid var(--hover-subtle);
}
.sn-bt-stat-row:last-child { border-bottom: none; }
.sn-bt-stat-label { color: var(--text-dim); }
.sn-bt-stat-val { font-family: var(--font-ui); font-weight: 600; color: var(--text); }
.sn-bt-val-pos { color: var(--green); }
.sn-bt-val-neg { color: var(--red); }


.sn-bt-input {
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  border-radius: 4px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  padding: 5px 8px;
  outline: none;
  transition: border-color var(--ease);
}
.sn-bt-input:focus { border-color: var(--blue-focus); }
.sn-bt-input option { background: var(--panel); color: var(--text); }
.sn-bt-day { width: 52px; text-align: center; }
.sn-bt-month { width: 66px; }


.sn-bt-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(18, 18, 30, 0.85);
  color: var(--text-dim);
  font-size: .85rem;
  z-index: 10;
}

.sn-dash-spinner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  z-index: 5;
  border-radius: var(--radius-sm);
}
.sn-dash-spinner .sn-spinner {
  width: 22px;
  height: 22px;
}


.sn-bt-icon {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: .7rem;
  cursor: pointer;
  padding: 0 2px;
  opacity: 0.4;
  transition: opacity .15s, color .15s;
  flex-shrink: 0;
}
.sn-period-card:hover .sn-bt-icon { opacity: 0.8; }
.sn-bt-icon:hover {
  opacity: 1 !important;
  color: var(--blue);
}

.rsb-icon[data-tab="seasonality"] svg { fill: none; stroke: currentColor; }


.sn-comp-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 10px !important;
}
.sn-comp-left { display: flex; align-items: center; gap: 8px; }
.sn-comp-swatch {
  width: 18px; height: 18px;
  border-radius: 50%;
  border: 1.5px solid var(--surface-border-hi);
  cursor: pointer;
  transition: transform var(--ease), box-shadow var(--ease);
  flex-shrink: 0;
}
.sn-comp-swatch:hover { transform: scale(1.12); box-shadow: 0 0 0 2px var(--blue-focus); }
.sn-comp-name {
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
  color: var(--text-dim);
  letter-spacing: .02em;
}
.sn-comp-right { display: flex; align-items: center; gap: 4px; }
.sn-comp-btn {
  width: 28px; height: 26px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-dim);
  transition: all var(--ease);
  padding: 0;
}
.sn-comp-btn:hover { border-color: var(--border-hi); background: var(--divider-soft); }
.sn-comp-btn.on { border-color: var(--blue); background: var(--blue-dim); color: var(--blue); }
.sn-comp-btn svg { overflow: visible; }
.sn-comp-eye { color: var(--text-muted); opacity: .45; }
.sn-comp-eye.on { opacity: 1; color: var(--accent); border-color: transparent; background: none; }
.sn-comp-eye.on:hover { background: var(--divider-soft); }
.sn-comp-close { color: var(--text-muted); border-color: transparent; background: none; }
.sn-comp-close:hover { color: var(--red, #e0625b); background: var(--divider-soft); border-color: transparent; }


.sn-comp-removed .sn-comp-swatch { opacity: .35; filter: grayscale(1); cursor: default; }
.sn-comp-removed .sn-comp-swatch:hover { transform: none; box-shadow: none; }
.sn-comp-removed .sn-comp-name { opacity: .55; }
.sn-comp-restore {
  width: auto; gap: 6px; padding: 0 12px;
  color: var(--blue);
  border-color: var(--blue);
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600;
}
.sn-comp-restore .sn-comp-restore-label { line-height: 1; }
.sn-comp-restore:hover {
  background: var(--blue-dim);
  color: var(--blue);
  border-color: var(--blue);
}


.sn-view-wrap { position: relative; }
.sn-view-drop {
  position: absolute; top: calc(100% + 4px); right: 0; z-index: 100;
  background: var(--card);
  border: 1px solid var(--border-hi); border-radius: var(--radius-sm);
  box-shadow: 0 12px 28px rgba(0,0,0,.45);
  padding: 4px 0; min-width: 120px;
}
.sn-view-opt {
  display: flex; align-items: center; gap: 8px;
  width: 100%; padding: 6px 12px;
  background: none; border: none; cursor: pointer;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  color: var(--text-dim); text-align: left;
  transition: background var(--ease);
}
.sn-view-opt:hover { background: rgba(255,255,255, var(--hover-medium)); }
.sn-view-opt.on { color: var(--blue); }
.sn-view-opt.on::before {
  content: '✓'; font-size: .75rem; color: var(--blue); margin-right: 2px;
}


.sn-line-ctx { z-index: 10000; min-width: 280px; background: var(--panel); }
.sn-line-ctx .ctx-body { height: auto; max-height: 420px; }
.sn-lctx-custom-input {
  position: absolute; opacity: 0; width: 0; height: 0; pointer-events: auto;
}
.sn-lctx-area-color {
  width: 28px; height: 22px;
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-sm);
  background: none;
  cursor: pointer;
  padding: 0;
}
.sn-lctx-area-btn {
  width: auto !important;
  padding: 0 10px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  white-space: nowrap;
}


.sn-bt-metrics-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 24px;
}
.sn-bt-wr-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 14px;
}
.sn-bt-wr-donut-wrap {
  position: relative;
  width: 130px;
  height: 130px;
  cursor: default;
}
.sn-bt-wr-tip {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) scale(.92);
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: rgba(20,20,24,.92);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s ease, transform .15s ease;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 16px rgba(0,0,0,.4);
}
.sn-bt-wr-tip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: rgba(20,20,24,.92);
}
.sn-bt-wr-donut-wrap:hover .sn-bt-wr-tip {
  opacity: 1;
  transform: translateX(-50%) scale(1);
}
.sn-bt-wr-tip .pos { color: var(--green); }
.sn-bt-wr-tip .neg { color: var(--red); }
.sn-bt-wr-tip .sep { color: var(--text-dim); }
.sn-bt-wr-inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.sn-bt-wr-pct {
  font-family: var(--font-ui);
  font-size: 2.8rem;
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1;
  color: var(--text);
}
.sn-bt-wr-pct.long { color: var(--green); }
.sn-bt-wr-pct.short { color: #ff2255; }
.sn-bt-wr-side {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--green);
  margin-top: 4px;
  line-height: 1;
}
.sn-bt-wr-side.short { color: #ff2255; }
.sn-bt-wr-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-top: 6px;
}
.sn-bt-metrics-rows {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.sn-bt-metric-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid var(--hover-subtle);
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .3s ease, transform .3s ease;
}
.sn-bt-metric-row:last-child { border-bottom: none; }
.sn-bt-metric-row.visible {
  opacity: 1;
  transform: translateY(0);
}
.sn-bt-metric-val {
  font-family: var(--font-ui);
  font-size: 1.13rem;
  font-weight: 700;
  color: var(--text);
}
.sn-bt-metric-val.pos { color: var(--green); }
.sn-bt-metric-val.neg { color: var(--red); }


.sn-bt-oos-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: 10px;
}
.sn-bt-oos-text {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  white-space: nowrap;
}


.sn-bt-oos-line {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0;
  border-left: 2px dashed rgba(255,170,51,0.6);
  pointer-events: none;
  z-index: 4;
}


.sn-bt-oos-zone-label {
  position: absolute;
  top: 26px;
  font-family: var(--font-ui);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: rgba(255,255,255,0.3);
  pointer-events: none;
  z-index: 4;
  text-transform: uppercase;
}
.sn-bt-oos-zone-label-oos {
  color: rgba(255,170,51,0.50);
}


.sn-bt-oos-card {
  padding: 10px 14px 8px;
}
.sn-bt-oos-card-header {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 8px;
}
.sn-bt-oos-card-title {
  font-family: var(--font-ui);
  font-size: .90rem;
  font-weight: 700;
  color: var(--text-bright);
}
.sn-bt-oos-card-years {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-dim);
}
.sn-bt-oos-cmp-header {
  display: grid;
  grid-template-columns: 1fr 76px 76px;
  gap: 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--surface-border);
  margin-bottom: 2px;
}
.sn-bt-oos-cmp-header .sn-bt-oos-cmp-col {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-muted);
  text-align: right;
  white-space: nowrap;
}
.sn-bt-oos-cmp-col-oos {
  color: #FFAA33 !important;
}
.sn-bt-oos-cmp-row {
  display: grid;
  grid-template-columns: 1fr 76px 76px;
  gap: 10px;
  padding: 4px 0;
  border-bottom: 1px solid var(--divider-soft);
  align-items: baseline;
}
.sn-bt-oos-cmp-lbl {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-muted);
  white-space: nowrap;
}
.sn-bt-oos-cmp-val {
  font-family: var(--font-ui);
  font-size: .86rem;
  font-weight: 600;
  text-align: right;
  color: var(--text);
  white-space: nowrap;
}
.sn-bt-oos-cmp-val.pos { color: var(--green); }
.sn-bt-oos-cmp-val.neg { color: var(--red); }
.sn-bt-oos-val-oos {
  opacity: 0.9;
}

.sn-bt-metric-lbl {
  font-family: var(--font-ui);
  font-size: .97rem;
  font-weight: 500;
  color: var(--text-muted);
}
.sn-bt-series-controls {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 4px 14px;
}

.sn-dash-cycle-btn {
  background: var(--surface-raised);
  border: 1px solid var(--surface-border);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all var(--ease);
}
.sn-dash-cycle-btn:hover {
  background: var(--surface-border);
  color: var(--text);
}
.sn-dash-cycle-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  border-color: var(--surface-border-hi);
}
.sn-dash-cycle-custom-wrap {
  display: flex;
  align-items: center;
  gap: 2px;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  border: 1px solid var(--surface-border);
  transition: all var(--ease);
}
.sn-dash-cycle-custom-wrap.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  border-color: var(--surface-border-hi);
}
.sn-dash-cycle-custom-wrap .sn-dash-cycle-input {
  width: 22px;
  text-align: center;
  background: transparent;
  border: none;
  color: inherit;
  font: inherit;
  padding: 0;
  -moz-appearance: textfield;
}
.sn-dash-cycle-custom-wrap .sn-dash-cycle-input::placeholder { color: var(--text-faint); }
.sn-dash-cycle-custom-wrap .sn-dash-cycle-input::-webkit-outer-spin-button,
.sn-dash-cycle-custom-wrap .sn-dash-cycle-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.sn-bt-series-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0;
  border-bottom: 1px solid var(--hover-subtle);
}
.sn-bt-series-row:last-child { border-bottom: none; }


.sn-toggle {
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.sn-toggle input { display: none; }
.sn-toggle-track {
  display: block;
  width: 30px;
  height: 16px;
  border-radius: 8px;
  background: var(--surface-border);
  transition: background .2s ease;
  position: relative;
}
.sn-toggle-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,.35);
  transition: transform .2s ease, background .2s ease;
}
.sn-toggle input:checked + .sn-toggle-track {
  background: var(--green);
}
.sn-toggle input:checked + .sn-toggle-track .sn-toggle-thumb {
  transform: translateX(14px);
  background: #fff;
}




.sn-ev-mode-toggle {
  display: flex;
  gap: 8px;
  padding: 3px;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  border: 1px solid var(--divider-soft);
  margin-bottom: 8px;
}
.sn-ev-mode-btn {
  flex: 1;
  border: none;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  padding: 5px 0;
  cursor: pointer;
  border-radius: 4px;
  transition: all .2s;
}
.sn-ev-mode-btn:hover { color: var(--text); }
.sn-ev-mode-btn.active {
  background: var(--surface-border-hi);
  color: var(--text);
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
}


.sn-ev-preset-wrap {
  position: relative;
  margin-bottom: 10px;
}
.sn-ev-preset-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 6px 10px;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
}
.sn-ev-preset-btn:hover { background: var(--hover-medium); border-color: var(--border-hi); color: var(--text); }
.sn-ev-preset-btn.active { background: var(--hover-medium); border-color: var(--border-hi); color: var(--text); }
.sn-ev-preset-chev {
  margin-left: auto;
  color: var(--text-muted);
  transition: transform .2s ease;
}
.sn-ev-preset-btn.open .sn-ev-preset-chev { transform: rotate(180deg); }
.sn-ev-preset-panel {
  display: none;
  position: absolute;
  left: 0; right: 0;
  top: calc(100% + 4px);
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 28px rgba(0,0,0,.45);
  z-index: 50;
  overflow: hidden;
  padding: 4px;
}
.sn-ev-preset-panel.visible { display: block; }
.sn-ev-preset-panel .sn-ev-dd-option { justify-content: space-between; }
.sn-ev-preset-freq {
  font-size: .82rem;
  color: var(--text-muted);
  font-weight: 400;
}


.sn-ev-ctrl-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.sn-ev-ctrl-row:last-child { margin-bottom: 0; }
.sn-ev-ctrl-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  width: 50px;
  flex-shrink: 0;
}
.sn-ev-ctrl-unit {
  font-size: .82rem;
  color: var(--text-dim);
}
.sn-ev-num {
  width: 48px;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 4px 6px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text);
  text-align: center;
  outline: none;
  transition: border-color var(--ease);
}
.sn-ev-num:focus { border-color: var(--blue-focus); }
.sn-ev-num::-webkit-inner-spin-button,
.sn-ev-num::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.sn-ev-num { -moz-appearance: textfield; }


.sn-ev-dd {
  position: relative;
  z-index: 10;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  transition: all var(--ease);
}
.sn-ev-dd:hover { background: var(--hover-medium); border-color: var(--border-hi); }
.sn-ev-dd.open { z-index: 1000; }
.sn-ev-dd-trigger {
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  user-select: none;
  flex: 1;
}
.sn-ev-dd-value {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  flex: 1;
}
.sn-ev-dd-chevron {
  width: 10px; height: 10px;
  color: var(--text-muted);
  flex-shrink: 0;
  transition: transform .2s ease, color var(--ease);
}
.sn-ev-dd.open .sn-ev-dd-chevron { transform: rotate(180deg); color: var(--text-dim); }


.sn-ev-dd-panel {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  min-width: 100%;
  max-height: 220px;
  overflow-y: auto;
  background: #1e2136;
  border-radius: var(--radius-md);
  border: .5px solid var(--surface-border-hi);
  box-shadow: 0 16px 48px rgba(0,0,0,.6), 0 2px 8px rgba(0,0,0,.3);
  padding: 4px;
  z-index: 1001;
}
.sn-ev-dd.open .sn-ev-dd-panel { display: block; }
.sn-ev-dd-panel::-webkit-scrollbar { width: 4px; }
.sn-ev-dd-panel::-webkit-scrollbar-track { background: transparent; }
.sn-ev-dd-panel::-webkit-scrollbar-thumb { background: var(--surface-border-hi); border-radius: 4px; }

.sn-ev-dd-option {
  padding: 7px 10px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 400;
  color: var(--text);
  border-radius: var(--radius-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: background .1s ease;
  display: flex;
  align-items: center;
  gap: 7px;
}
.sn-ev-dd-option:hover { background: var(--surface-border); color: var(--text-bright); }
.sn-ev-dd-option.selected { color: var(--text-bright); font-weight: 500; }
.sn-ev-dd-option.selected::before {
  content: '';
  width: 4px; height: 4px;
  background: var(--text-bright);
  border-radius: 50%;
  flex-shrink: 0;
}
.sn-ev-dd-option:not(.selected)::before {
  content: '';
  width: 4px; height: 4px;
  flex-shrink: 0;
}
.sn-ev-dd-sep {
  height: .5px;
  background: var(--surface-border);
  margin: 4px 8px;
}
.sn-ev-dd-group-label {
  padding: 5px 10px 3px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  cursor: default;
}


.sn-ev-dd-panel.sn-ev-grid-panel {
  max-height: none;
  padding: 6px;
  min-width: 190px;
}
.sn-ev-dd-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}
.sn-ev-dd-grid .sn-ev-dd-option {
  padding: 5px 0;
  text-align: center;
  justify-content: center;
  font-family: var(--font-ui);
  font-size: .82rem;
}
.sn-ev-dd-grid .sn-ev-dd-option::before { display: none; }
.sn-ev-dd-grid .sn-ev-dd-option.selected {
  background: var(--surface-border-hi);
  font-weight: 600;
}


.sn-ev-textarea {
  width: 100%;
  min-height: 80px;
  resize: none;
  background: var(--divider-soft);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 8px 10px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  line-height: 1.6;
  outline: none;
  margin-top: 6px;
  transition: border-color var(--ease);
}
.sn-ev-textarea::placeholder { color: var(--surface-border-strong); }
.sn-ev-textarea:focus { border-color: var(--blue-focus); }


.sn-ev-list-card {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  margin-bottom: 0;
}


.sn-ev-header {
  display: flex;
  align-items: center;
  padding: 4px 4px 6px;
  border-bottom: 1px solid var(--surface-raised);
  font-size: .745rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .4px;
}
.sn-ev-date-hcol { width: 80px; flex-shrink: 0; }
.sn-ev-bar-hcol { flex: 1; text-align: center; }
.sn-ev-ret-hcol { width: 56px; flex-shrink: 0; text-align: right; padding-right: 6px; }


.sn-ev-rows {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.sn-ev-rows::-webkit-scrollbar { width: 3px; }
.sn-ev-rows::-webkit-scrollbar-track { background: transparent; }
.sn-ev-rows::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.sn-ev-row {
  display: flex;
  align-items: center;
  padding: 4px 4px;
  cursor: pointer;
  transition: background var(--ease);
  border-radius: 3px;
}
.sn-ev-row:hover { background: var(--divider-soft); }
.sn-ev-row:not(.checked) { opacity: .4; }
.sn-ev-row:not(.checked) .sn-yl-cb { opacity: 1; }


.sn-ev-row .sn-ev-date-hcol {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text);
}
.sn-ev-row:not(.checked) .sn-ev-date-hcol { color: var(--text-dim); }


.sn-ev-bar-track {
  position: relative;
  height: 8px;
  border-radius: 4px;
  background: var(--hover-subtle);
  width: 100%;
}
.sn-ev-bar {
  position: absolute; top: 0; height: 100%;
  border-radius: 4px;
  min-width: 2px;
}
.sn-ev-bar-zero {
  position: absolute; top: -1px; bottom: -1px;
  left: 50%; width: 1px;
  background: var(--surface-border-hi);
}


.sn-ev-row .sn-ev-ret-hcol {
  font-family: var(--font-ui);
  font-size: .805rem;
  font-weight: 600;
}


.sn-ev-footer {
  flex-shrink: 0;
  padding: 5px 8px;
  border-top: 1px solid var(--surface-raised);
  display: flex;
  align-items: center;
  justify-content: space-between;
}


.sn-skel-shimmer {
  color: transparent !important;
  background: linear-gradient(90deg, var(--divider-soft) 25%, var(--surface-border) 50%, var(--divider-soft) 75%);
  background-size: 200% 100%;
  animation: snSkelShimmer 1.5s ease infinite;
  border-radius: 4px;
}
.sn-skel-counter {
  opacity: .3;
}
@keyframes snSkelShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}




.itd-tz-badge {
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: .62rem; font-weight: 700;
  letter-spacing: .08em;
  padding: 2px 7px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border-hi);
  color: var(--text-dim);
  background: var(--surface-veil);
  margin-left: 8px;
}


.itd-banner {
  position: absolute;
  top: 44px; left: 14px; right: 14px;
  z-index: 4;
  padding: 6px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(255, 184, 51, .35);
  background: rgba(255, 184, 51, .08);
  color: var(--amber);
  font-family: var(--font-ui);
  font-size: .78rem;
}


.itd-banner-lag {
  top: auto;
  bottom: 44px;
  right: auto;
  max-width: 62%;
  border-color: rgba(77, 166, 255, .35);
  background: rgba(77, 166, 255, .08);
  color: var(--blue);
}


.itd-empty {
  position: absolute; inset: 0;
  z-index: 5;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 6px;
  text-align: center;
  padding: 24px;
}
.itd-empty-title {
  font-family: var(--font-ui);
  font-size: 1rem; font-weight: 600;
  color: var(--text);
}
.itd-empty-detail {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim);
  max-width: 420px;
  line-height: 1.5;
}



.itd-modal .sn-dash-title { flex: 0 0 auto; }

.sn-dash-modal.itd-switch-on .sn-dash-title { flex: 0 0 auto; }
.itd-view-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.itd-view-bar .sn-v-chip.itd-view-btn {
  font-size: .88rem;
  font-weight: 600;
  padding: 6px 18px;
  border-radius: var(--radius-md);
}

.itd-view-bar .sn-dash-cycle-custom-wrap {
  padding: 6px 12px;
  gap: 5px;
  border-radius: var(--radius-md);
  border: 1px solid var(--border-hi);
  font-size: .85rem;
}
.itd-view-bar .sn-dash-cycle-custom-wrap .sn-dash-cycle-input {
  width: 32px;
  font-size: .9rem;
  padding: 2px 4px;
  border-radius: var(--radius-sm);
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  transition: border-color var(--ease);
}
.itd-view-bar .sn-dash-cycle-custom-wrap .sn-dash-cycle-input:focus {
  border-color: var(--surface-border-strong);
}

.itd-view-bar .sn-dash-cycle-custom-wrap.active .sn-dash-cycle-input {
  background: rgba(0, 0, 0, .14);
  border-color: rgba(0, 0, 0, .30);
}
.itd-view-bar .sn-dash-cycle-custom-wrap.active .sn-dash-cycle-input:focus {
  border-color: rgba(0, 0, 0, .55);
}

.itd-view-bar .itd-basis-wrap {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  overflow: hidden;
  flex: 0 0 auto;
}
.itd-view-bar .itd-basis-btn {
  font-family: var(--font-ui);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .02em;
  padding: 6px 10px;
  background: transparent;
  border: none;
  color: var(--text-dim);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--ease), color var(--ease);
}
.itd-view-bar .itd-basis-btn + .itd-basis-btn {
  border-left: 1px solid var(--border-hi);
}
.itd-view-bar .itd-basis-btn:hover { color: var(--text); }
.itd-view-bar .itd-basis-btn.active {
  background: var(--hover-subtle);
  color: var(--text-bright);
}


.itd-chip-locked {
  opacity: .45;
  cursor: not-allowed;
}


.itd-month-row {
  display: flex; align-items: center;
  gap: 6px;
  padding: 6px 4px 4px;
  margin-top: 4px;
  cursor: pointer;
  border-radius: 3px;
  transition: background var(--ease);
  border-bottom: 1px solid var(--divider-soft);
}
.itd-month-row:hover { background: var(--hover-subtle); }
.itd-month-label {
  font-family: var(--font-ui);
  font-size: .74rem; font-weight: 600;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.itd-month-count {
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: .66rem;
  color: var(--text-muted);
  margin-left: auto;
}
.itd-month-chev {
  color: var(--text-muted);
  transition: transform var(--ease);
  flex-shrink: 0;
}
.itd-month-row.collapsed .itd-month-chev { transform: rotate(-90deg); }


.sn-yl-cb.itd-cb-partial {
  background: var(--blue-dim);
  border-color: var(--blue);
}
.sn-yl-cb.itd-cb-partial::after {
  content: '';
  display: block;
  width: 6px; height: 2px;
  background: var(--blue);
  margin: 4px auto 0;
}


.itd-sd-col { display: flex; align-items: center; gap: 4px; white-space: nowrap; }


.itd-flag {
  font-size: .58rem;
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  padding: 0 4px;
  border-radius: 3px;
  line-height: 1.5;
  flex-shrink: 0;
}
.itd-flag-half { color: var(--blue); background: var(--blue-dim); }
.itd-flag-qual { color: var(--amber); background: var(--amber-dim); }
.itd-flag-split { color: var(--purple); background: var(--purple-dim); }


.itd-dow-chips {
  display: flex; gap: 4px;
  padding: 4px 12px 6px;
  flex-wrap: wrap;
}


.itd-filter-menu { min-width: 230px; }
.itd-cond-tag {
  font-size: .56rem; font-weight: 700;
  color: var(--amber);
  border: 1px solid rgba(255, 184, 51, .4);
  border-radius: 3px;
  padding: 0 4px;
  margin-left: 4px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.itd-cond-note {
  padding: 4px 12px 6px;
  font-family: var(--font-ui);
  font-size: .64rem;
  line-height: 1.45;
  color: var(--text-muted);
}


.itd-filter-tag {
  display: flex; align-items: center; gap: 6px;
  margin: 8px 0 0;
  padding: 5px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--blue-dim);
  background: var(--blue-dim);
  color: var(--blue);
  font-family: var(--font-ui);
  font-size: .74rem;
}
.itd-filter-tag.conditional {
  border-color: rgba(255, 184, 51, .4);
  background: var(--amber-dim);
  color: var(--amber);
}
.itd-filter-tag-x {
  margin-left: auto;
  cursor: pointer;
  font-size: .9rem;
  line-height: 1;
  opacity: .7;
}
.itd-filter-tag-x:hover { opacity: 1; }


#itdTodayRefresh { left: 46px; }

#itdChartToggle,
#itdTodayRefresh {
  background: var(--panel);
}
#itdChartToggle:hover,
#itdTodayRefresh:hover {
  background: linear-gradient(var(--hover-medium), var(--hover-medium)), var(--panel);
}
.itd-interval-chips {
  position: absolute;
  left: 84px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  gap: 4px;
  align-items: center;
  pointer-events: auto;
}


.itd-stats-tabs {
  display: flex;
  gap: 4px;
  margin: 10px 10px 0;
  padding: 3px;
  border-radius: var(--radius-sm);
  background: var(--surface-veil);
  border: 1px solid var(--surface-border);
  flex-shrink: 0;
}
.itd-stats-tab {
  flex: 1;
  padding: 5px 0;
  border: none;
  border-radius: calc(var(--radius-sm) - 2px);
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .74rem;
  font-weight: 600;
  cursor: pointer;
  transition: var(--ease);
}
.itd-stats-tab:hover { color: var(--text); background: var(--hover-subtle); }
.itd-stats-tab.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
}




.itd-bt-cond-tag {
  font-family: var(--font-ui);
  font-size: .62rem; font-weight: 700;
  color: var(--amber);
  border: 1px solid rgba(255, 184, 51, .4);
  background: var(--amber-dim);
  border-radius: 3px;
  padding: 1px 6px;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
}


.itd-bt-hint {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  font-family: var(--font-ui);
  font-size: .78rem;
  color: var(--text-muted);
  background: var(--label-bg);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 6px 14px;
  pointer-events: none;
}


.itd-bt-stats-title {
  font-family: var(--font-ui);
  font-size: .78rem; font-weight: 700;
  color: var(--text);
  margin-bottom: 6px;
}
.itd-bt-stats-cond {
  font-family: var(--font-ui);
  font-size: .64rem;
  line-height: 1.4;
  color: var(--amber);
  border: 1px solid rgba(255, 184, 51, .3);
  background: var(--amber-dim);
  border-radius: var(--radius-sm);
  padding: 4px 8px;
  margin-bottom: 8px;
}
.itd-bt-split-row {
  display: flex; justify-content: space-between;
  gap: 8px;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid var(--divider-soft);
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: .66rem;
  color: var(--text-dim);
}
.itd-bt-split-row.oos { color: var(--amber); border-top: none; padding-top: 0; }


.itd-stats-note {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--divider-soft);
  font-family: var(--font-ui);
  font-size: .66rem;
  line-height: 1.5;
  color: var(--text-muted);
}




.itd-gap-wrap { display: none; }
.sn-dash-chart-top.itd-gap-on { flex-direction: row; }
.sn-dash-chart-top.itd-gap-on .sn-dash-chart { min-width: 0; }
.sn-dash-chart-top.itd-gap-on .itd-gap-wrap {
  display: block;
  flex: 0 0 32%;
  min-width: 220px;
  position: relative;
  padding: 8px 12px;
  border-left: 1px solid var(--surface-raised);
  overflow: hidden;
}
.itd-gap-wrap canvas { max-width: 100%; max-height: 100%; }


.itd-banner-ev {
  top: 72px;
  border-color: rgba(77, 166, 255, .35);
  background: rgba(77, 166, 255, .08);
  color: var(--blue);
}


.itd-ev-active {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 4px;
  padding: 6px 10px;
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm);
  background: var(--hover-medium);
}
.itd-ev-active-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.itd-ev-clear {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
}
.itd-ev-clear:hover { color: var(--text-bright); }

.itd-ev-gate-hint,
.itd-ev-hint {
  font-family: var(--font-ui);
  font-size: .72rem;
  line-height: 1.5;
  color: var(--text-muted);
  margin-top: 8px;
}


.itd-anch-ctrls {
  margin-top: 10px;
}
.itd-anch-ta {
  min-height: 110px;
  font-family: var(--font-data);
  font-size: .74rem;
  line-height: 1.5;
}
.itd-anch-info {
  font-family: var(--font-ui);
  font-size: .72rem;
  color: var(--text-muted);
  margin: 4px 0 8px;
}

.itd-anch-info.warn { color: color-mix(in srgb, var(--amber, #ffb833) 70%, var(--text)); }
.itd-anch-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.itd-anch-lab {
  font-family: var(--font-ui);
  font-size: .75rem;
  color: var(--text-dim);
}
.itd-anch-row .sn-dash-cycle-input {
  width: 6ch;
}
.itd-anch-row .sn-bp-run-btn {
  padding: 4px 12px;
}
.itd-anch-hint {
  font-family: var(--font-ui);
  font-size: .72rem;
  line-height: 1.5;
  color: var(--text-muted);
  margin-top: 6px;
}
.itd-ev-gate-hint { color: var(--amber); }


.itd-da-step {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
}
.itd-da-btn {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border);
  background: var(--hover-subtle);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .85rem;
  line-height: 1;
  cursor: pointer;
  transition: border-color var(--ease), color var(--ease);
}
.itd-da-btn:hover:not(:disabled) {
  border-color: var(--surface-border-strong);
  color: var(--text-bright);
}
.itd-da-btn:disabled { opacity: .35; cursor: default; }
.itd-da-input {
  width: 34px;
  padding: 1px 4px;
  text-align: center;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-border);
  background: var(--hover-subtle);
  color: var(--text);
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: .8rem;
  transition: border-color var(--ease);
}
.itd-da-input:focus { outline: none; border-color: var(--surface-border-strong); }

.itd-da-input::-webkit-outer-spin-button,
.itd-da-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.itd-da-input { -moz-appearance: textfield; appearance: textfield; }




.cy-vision {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}


.cy-v-header {
  padding: 16px 16px 12px;
  flex-shrink: 0;
}
.cy-v-header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.cy-v-title {
  font-size: 1.1rem;
  font-weight: 600;
  font-family: var(--font-ui);
  letter-spacing: -0.3px;
  color: var(--text-bright);
}
.cy-v-title span { color: var(--blue); }





.cy-help-tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 5px;
  border-radius: 50%;
  background: var(--surface-border);
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-muted);
  cursor: pointer;
  transition: var(--ease);
  vertical-align: middle;
}
.cy-help-tip:hover { background: var(--surface-border-hi); color: var(--text); }


.cy-tooltip-box {
  position: fixed;
  z-index: 9999;
  max-width: 280px;
  padding: 12px 14px;
  background: var(--card, #1a1f2a);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-md);
  box-shadow: var(--overlay-shadow, 0 8px 32px rgba(0,0,0,.5));
  font-size: .82rem;
  line-height: 1.5;
  color: var(--text-dim);
  animation: cyFadeInUp .15s var(--ease);
}
.cy-tooltip-box b { color: var(--text); }
.cy-tooltip-box i { color: var(--blue); }
@keyframes cyFadeInUp { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }


.cy-mode-toggle {
  display: flex;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  padding: 2px;
  border: 1px solid var(--divider-soft);
}
.cy-mode-btn {
  flex: 1;
  background: none; border: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 500;
  padding: 5px 8px; cursor: pointer;
  border-radius: var(--radius-sm);
  transition: all .2s;
}
.cy-mode-btn.active {
  background: var(--surface-border-hi);
  color: var(--text-bright);
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
}


.cy-v-tabs {
  display: flex;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  padding: 3px;
  position: relative;
  border: 1px solid var(--divider-soft);
}
.cy-v-pill {
  position: absolute;
  top: 3px; bottom: 3px;
  background: var(--surface-border-hi);
  border-radius: var(--radius-sm);
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
  transition: all .3s cubic-bezier(.2,.8,.2,1);
  z-index: 1;
}
.cy-v-tab-btn {
  flex: 1; background: none; border: none;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 500;
  padding: 5px 0; cursor: pointer;
  position: relative; z-index: 2;
  transition: color .2s;
}
.cy-v-tab-btn:not(.active) { color: var(--text-dim); }


.cy-v-content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0 14px 14px;
}
.cy-v-content::-webkit-scrollbar { width: 3px; }
.cy-v-content::-webkit-scrollbar-track { background: transparent; }
.cy-v-content::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }

.cy-tab-pane {
  display: none;
  animation: cyFadeIn .3s ease;
}
.cy-tab-pane.active { display: block; }

@keyframes cyFadeIn {
  from { opacity: 0; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}


.cy-glass {
  background: var(--surface-veil);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-md);
  padding: 12px;
  margin-bottom: 12px;
}
.cy-glass-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}


.cy-v-label {
  font-size: .82rem; font-weight: 500;
  color: var(--text-dim);
  margin-bottom: 10px; display: block;
}
.cy-section-label {
  font-size: .82rem; font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: var(--text-muted);
  margin-bottom: 8px;
}


.cy-chip-grid { display: flex; gap: 6px; flex-wrap: wrap; }
.cy-v-chip {
  padding: 6px 12px; border-radius: var(--radius-lg);
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  color: var(--text-dim);
  font-size: .82rem; font-weight: 500;
  cursor: pointer; transition: all var(--ease);
  font-family: var(--font-ui);
}
.cy-v-chip:hover { background: var(--surface-raised); }
.cy-v-chip.active {
  background: var(--surface-raised);
  border-color: var(--surface-border-hi);
  color: var(--text);
}
.cy-v-chip .cy-unit {
  font-size: .82rem;
  color: var(--text-dim);
  margin-left: 2px;
}
.cy-v-chip.active .cy-unit { color: rgba(255,255,255,.7); }


.cy-input-row {
  display: flex; gap: 8px; align-items: center;
  margin-bottom: 12px;
}
.cy-input-num {
  width: 70px;
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 6px 8px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  text-align: center;
  outline: none;
  transition: border-color var(--ease);
}
.cy-input-num:focus { border-color: rgba(255,255,255,.3); }


.cy-select {
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 5px 8px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  outline: none;
  cursor: pointer;
  transition: border-color var(--ease);
  -webkit-appearance: none;
  appearance: none;
}
.cy-select:focus { border-color: rgba(255,255,255,.3); }
.cy-select option {
  background: var(--card, #1a1f2a);
  color: var(--text);
}


.cy-range {
  -webkit-appearance: none;
  appearance: none;
  height: 4px;
  background: var(--surface-border);
  border-radius: 2px;
  outline: none;
  cursor: pointer;
}
.cy-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,.6);
  border: none;
  cursor: pointer;
}
.cy-range::-moz-range-thumb {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,.6);
  border: none;
  cursor: pointer;
}
.cy-range-val {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim);
  min-width: 24px;
  text-align: right;
}




.cy-cl-header {
  display: flex; align-items: center;
  padding: 4px 4px 6px;
  border-bottom: 1px solid var(--surface-raised);
  font-size: .82rem; font-weight: 600;
  color: var(--text-muted); text-transform: uppercase;
  letter-spacing: .4px;
}
.cy-cl-cb-col  { width: 24px; flex-shrink: 0; }
.cy-cl-date-col { flex: 1; }
.cy-cl-ret-col { width: 54px; flex-shrink: 0; text-align: right; padding-right: 6px; }
.cy-cl-inv-col { width: 22px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.cy-cl-wt-col  { width: 40px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }

.cy-cl-rows {
  max-height: 340px;
  overflow-y: auto;
}
.cy-cl-rows::-webkit-scrollbar { width: 3px; }
.cy-cl-rows::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }

.cy-cl-row {
  display: flex; align-items: center;
  padding: 4px 4px;
  cursor: pointer;
  transition: background var(--ease);
  border-radius: 3px;
}
.cy-cl-row:hover { background: var(--divider-soft); }
.cy-cl-row.checked { background: var(--blue-dim); }
.cy-cl-row.inverted { background: rgba(255,235,59,.08); }
.cy-cl-row.inverted.checked { background: rgba(255,235,59,.1); }
.cy-cl-row.selected { background: var(--blue-med); outline: 1px solid var(--blue-strong); }
.cy-cl-row.incomplete { opacity: .6; }


.cy-cl-cb {
  width: 14px; height: 14px;
  border-radius: 3px;
  border: 1px solid var(--surface-border-strong);
  position: relative;
  background: none;
  cursor: pointer;
  transition: all var(--ease);
}
.cy-cl-cb.on {
  background: transparent;
  border-color: rgba(255,255,255,.45);
}
.cy-cl-cb.on::after {
  content: '';
  position: absolute;
  left: 3px; top: 1px;
  width: 5px; height: 8px;
  border: solid var(--text); border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
}


.cy-cl-dates {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cy-cl-row.checked .cy-cl-dates { color: var(--text); }
.cy-cl-row:not(.checked) .cy-cl-dates { color: var(--text-dim); }


.cy-cl-return {
  font-family: var(--font-ui);
  font-variant-numeric: tabular-nums;
  font-size: .82rem; font-weight: 600;
  text-align: right; padding-right: 6px;
}
.cy-cl-return.pos { color: var(--green); }
.cy-cl-return.neg { color: var(--red); }


.cy-cl-inv {
  color: var(--text-dim);
  opacity: .2;
  cursor: pointer;
  transition: all var(--ease);
  display: flex; align-items: center; justify-content: center;
  padding: 2px;
  border-radius: var(--radius-sm);
  background: none; border: none;
  font-size: .82rem;
}
.cy-cl-inv:hover { opacity: .6; }
.cy-cl-inv.active {
  opacity: 1;
  color: var(--amber);
}


.cy-cl-wt-input {
  width: 32px; height: 20px;
  border-radius: 3px;
  background: var(--divider-soft);
  border: 1px solid var(--surface-raised);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  text-align: center;
  padding: 0 2px;
  transition: border-color var(--ease);
}
.cy-cl-wt-input:focus {
  outline: none;
  border-color: var(--blue-focus);
}


.cy-cl-count {
  font-size: .82rem; font-weight: 700;
  background: var(--blue-dim); color: var(--blue);
  padding: 2px 8px; border-radius: var(--radius-sm);
  font-family: var(--font-ui);
}


.cy-cl-reset {
  background: none;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  padding: 3px 8px;
  cursor: pointer;
  transition: all var(--ease);
  margin-left: 6px;
}
.cy-cl-reset:hover {
  background: var(--surface-raised);
  color: var(--text);
}


.cy-dash-open-btn {
  width: 100%;
  padding: 10px;
  margin: 10px 0 16px;
  border-radius: var(--radius-sm);
  background: linear-gradient(135deg, var(--blue-med), var(--purple-dim));
  border: 1px solid var(--blue-strong);
  color: var(--text-bright);
  font-size: .82rem;
  font-weight: 600;
  font-family: var(--font-ui);
  cursor: pointer;
  transition: all .25s ease;
}
.cy-dash-open-btn:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, var(--blue-strong), var(--purple-dim));
  box-shadow: 0 4px 14px var(--blue-med);
}


.cy-future-row {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px;
}
.cy-future-row label {
  font-size: .82rem; color: var(--text-dim);
  font-weight: 500; white-space: nowrap;
}


.cy-ios-toggle {
  width: 38px; height: 20px;
  background: var(--surface-border);
  border-radius: var(--radius-md);
  position: relative;
  cursor: pointer;
  transition: background var(--ease);
  flex-shrink: 0;
}
.cy-ios-toggle.on { background: var(--green); }
.cy-ios-toggle::after {
  content: '';
  position: absolute;
  top: 2px; left: 2px;
  width: 16px; height: 16px;
  background: var(--text-bright, #fff);
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(0,0,0,.3);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
}
.cy-ios-toggle.on::after { transform: translateX(18px); }


.cy-loading {
  display: flex; align-items: center; justify-content: center;
  padding: 32px 0;
  color: var(--text-dim);
  font-size: .82rem;
  gap: 8px;
}
.cy-loading::before {
  content: '';
  width: 16px; height: 16px;
  border: 2px solid var(--surface-border-hi);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: cySpinner .8s linear infinite;
}
@keyframes cySpinner {
  to { transform: rotate(360deg); }
}


.cy-info-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: var(--radius-md);
  background: var(--amber-dim);
  border: 1px solid var(--amber-dim);
  color: var(--amber);
  font-size: .82rem;
  font-weight: 500;
}


.cy-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.cy-stat-item {
  background: var(--hover-subtle);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-sm);
  padding: 8px;
  text-align: center;
}
.cy-stat-val {
  font-family: var(--font-ui);
  font-size: .92rem;
  font-weight: 600;
  color: var(--text-bright);
}
.cy-stat-lbl {
  font-size: .82rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-top: 2px;
}


.cy-bt-overlay {
  position: fixed;
  inset: 0;
  background: var(--overlay-bg);
  backdrop-filter: var(--overlay-blur);
  -webkit-backdrop-filter: var(--overlay-blur);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: cyFadeIn .25s ease;
}
.cy-bt-panel {
  width: 92vw; height: 88vh;
  max-width: 1400px;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg);
  box-shadow: var(--overlay-shadow);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.cy-bt-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.cy-bt-tabs {
  display: flex; gap: 4px;
}
.cy-bt-tab {
  background: none; border: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 500;
  padding: 6px 14px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all .2s;
}
.cy-bt-tab:hover { color: var(--text); background: var(--divider-soft); }
.cy-bt-tab.active {
  color: var(--text-bright);
  background: var(--surface-border);
}
.cy-bt-close {
  width: 26px; height: 26px;
  font-size: 1.2rem;
  border-radius: var(--radius-sm);
  background: none; border: none;
  color: var(--text-dim);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ease);
}
.cy-bt-close:hover {
  background: var(--hover-medium);
  color: var(--text);
}
.cy-bt-main {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
}

.cy-degree-axis {
  display: flex;
  justify-content: space-between;
  padding: 0 4px;
  margin-top: 4px;
}
.cy-degree-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-muted);
}




.cy-fh-menu {
  position: fixed;
  z-index: 6000;
  background: var(--overlay-bg, rgba(18,18,34,.92));
  backdrop-filter: var(--overlay-blur, blur(16px));
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-md);
  box-shadow: var(--overlay-shadow, 0 8px 32px rgba(0,0,0,.5));
  padding: 4px;
  display: none;
  min-width: 220px;
}
.cy-fh-menu.visible { display: block; }

.cy-fh-menu-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  background: none;
  border: none;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .82rem;
  text-align: left;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--ease);
  white-space: nowrap;
}
.cy-fh-menu-item:hover {
  background: rgba(255,255,255, var(--hover-medium, .08));
}
.cy-fh-menu-item.cy-fh-reset {
  color: rgba(255,184,51,.85);
}


.cy-fh-indicator {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}
.cy-fh-badge {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: var(--radius-sm);
  background: var(--hover-subtle);
  border: 1px solid var(--surface-raised);
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-dim);
}
.cy-fh-badge.active {
  border-color: rgba(255,184,51,.3);
  background: var(--amber-dim);
  color: rgba(255,184,51,.9);
}
.cy-fh-icon {
  font-size: .6rem;
}
.cy-fh-date {
  font-weight: 500;
  letter-spacing: .02em;
}


.cy-settings-gear {
  cursor: pointer;
  font-size: 1rem;
  color: var(--text-muted);
  transition: color var(--ease);
  padding: 2px;
  line-height: 1;
}
.cy-settings-gear:hover { color: var(--text-hi); }
.cy-settings-popup {
  background: var(--surface-veil);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  margin-bottom: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}


.cy-footer {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-top: 1px solid var(--border-hi);
  font-size: .82rem;
  font-family: var(--font-ui);
}
.cy-footer-label { color: var(--text-dim); }
.cy-footer-date {
  font-family: var(--font-ui);
  color: var(--text-hi);
  font-weight: 500;
}
.cy-footer-reset {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: .9rem;
  padding: 0 2px;
  line-height: 1;
  transition: color var(--ease);
}
.cy-footer-reset:hover { color: var(--text-hi); }


.cy-sep {
  height: 1px;
  background: var(--border-hi);
  margin: 10px 0;
}


.cy-apply-btn {
  padding: 5px 10px;
  border-radius: var(--radius-lg);
  background: var(--blue-dim);
  border: 1px solid var(--blue-strong);
  color: var(--blue);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all .2s;
}
.cy-apply-btn:hover { background: var(--blue-strong); }


.cy-seg {
  display: flex;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  padding: 2px;
  border: 1px solid var(--divider-soft);
}
.cy-seg-btn {
  flex: 1;
  height: 26px;
  border: none;
  background: transparent;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all .2s;
}
.cy-seg-btn.active {
  background: var(--surface-border-hi);
  color: var(--text-bright);
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
}


.cy-gear-disclosure {
  background: var(--divider-soft);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 12px;
}
.cy-gear-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  cursor: pointer;
  transition: .15s ease;
  user-select: none;
}
.cy-gear-header:hover { background: var(--divider-soft); }
.cy-gear-header .cy-gear-icon {
  font-size: .85rem;
  color: var(--text-muted);
  transition: transform .25s ease;
}
.cy-gear-header.open .cy-gear-icon { transform: rotate(90deg); color: var(--blue); }
.cy-gear-header .cy-gear-title {
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--text-muted);
}
.cy-gear-header.open .cy-gear-title { color: var(--text-dim); }
.cy-gear-header .cy-gear-arrow {
  margin-left: auto;
  font-size: .82rem;
  color: var(--text-muted);
  transition: transform .2s ease;
}
.cy-gear-header.open .cy-gear-arrow { transform: rotate(180deg); }
.cy-gear-body {
  padding: 0 12px 10px;
  border-top: 1px solid var(--border-hi);
}
.cy-gear-body .cy-future-row { margin-bottom: 10px; }
.cy-gear-body .cy-future-row:last-child { margin-bottom: 0; }


.cy-preset-btn {
  width: 30px; height: 30px;
  border-radius: var(--radius-sm);
  background: transparent;
  border: 1px solid var(--surface-border);
  color: var(--text-dim);
  font-size: 1rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ease);
  flex-shrink: 0;
}
.cy-preset-btn:hover { background: var(--hover-subtle); color: var(--text); }

.cy-preset-popup {
  max-height: 220px;
  overflow-y: auto;
  background: var(--hover-subtle);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  margin-top: 6px;
  padding: 4px 0;
}
.cy-preset-item {
  padding: 6px 12px;
  font-size: .82rem;
  color: var(--text-dim);
  cursor: pointer;
  transition: background var(--ease);
}
.cy-preset-item:hover { background: rgba(255,255,255,var(--hover-medium)); color: var(--text); }


.cy-add-cycle-btn {
  display: block;
  width: auto;
  padding: 10px 32px;
  margin: 0 auto 12px;
  border-radius: var(--radius-sm);
  background: var(--divider-soft);
  border: 1px solid var(--surface-border);
  color: var(--text);
  font-size: .82rem;
  font-weight: 600;
  font-family: var(--font-ui);
  cursor: pointer;
  transition: all var(--ease);
}
.cy-add-cycle-btn:hover {
  background: var(--surface-raised);
  border-color: var(--surface-border-hi);
}




.cy-ov-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 4px;
  border-radius: 3px;
  cursor: default;
  transition: background var(--ease);
}
.cy-ov-row:hover { background: var(--divider-soft); }
.cy-ov-row.hidden { opacity: .45; }
.cy-ov-row.editing { background: var(--blue-dim); border-left: 2px solid rgba(77,166,255,.6); }


.cy-editing-badge {
  display: inline-block;
  font-size: .6rem;
  font-weight: 500;
  color: var(--blue);
  background: var(--blue-dim);
  border: 1px solid var(--blue-strong);
  border-radius: var(--radius-sm);
  padding: 2px 8px;
  margin-left: 8px;
  letter-spacing: .3px;
  vertical-align: middle;
}


.cy-ov-color {
  width: 10px; height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  cursor: pointer;
  transition: transform var(--ease);
  border: 1px solid var(--surface-border-hi);
}
.cy-ov-color:hover { transform: scale(1.3); }


.cy-ov-label {
  flex: 1;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}
.cy-ov-row.hidden .cy-ov-label { color: var(--text-dim); }


.cy-ov-eye {
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  opacity: .2;
  color: var(--text-dim);
  cursor: pointer;
  transition: all var(--ease);
  border-radius: 3px;
}
.cy-ov-eye:hover { opacity: .6; }
.cy-ov-eye.on { opacity: 1; color: var(--text); }


.cy-ov-expand {
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  font-size: .82rem;
  color: var(--text-muted);
  cursor: pointer;
  transition: transform .2s ease, color .15s;
  border-radius: 3px;
}
.cy-ov-expand:hover { color: var(--text); }
.cy-ov-expand.open { transform: rotate(180deg); color: var(--text-dim); }


.cy-ov-delete {
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  font-size: .9rem;
  color: var(--text-muted);
  cursor: pointer;
  transition: all var(--ease);
  border-radius: 3px;
  opacity: .3;
}
.cy-ov-delete:hover { opacity: 1; color: var(--red); background: var(--red-dim); }


.cy-ov-detail {
  padding: 6px 4px 8px 18px;
  border-left: 2px solid var(--surface-raised);
  margin-left: 4px;
  margin-bottom: 6px;
}


.cy-ov-palette {
  display: flex;
  gap: 5px;
  margin-bottom: 8px;
}
.cy-ov-palette-dot {
  width: 16px; height: 16px;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid transparent;
  transition: all var(--ease);
}
.cy-ov-palette-dot:hover { transform: scale(1.2); }
.cy-ov-palette-dot.active {
  border-color: var(--text-bright);
  box-shadow: 0 0 6px var(--surface-border-strong);
}


.cy-ov-style-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}


.cy-ov-comp-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--surface-raised);
}


.cy-ov-comp-rows {
  max-height: 200px;
  overflow-y: auto;
}
.cy-ov-comp-rows::-webkit-scrollbar { width: 3px; }
.cy-ov-comp-rows::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.cy-ov-spinner {
  display: inline-block;
  width: 10px; height: 10px;
  border: 1.5px solid var(--surface-border-hi);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: cySpinner .8s linear infinite;
  vertical-align: middle;
  margin-left: 4px;
}


.cy-dim {
  color: var(--text-muted);
  font-size: .82rem;
}



.cy-dash-modal {
  background: var(--panel);
  border: 1px solid var(--surface-raised);
  border-radius: 18px;
  width: 98vw;
  max-width: none;
  height: 96vh;
  max-height: none;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  box-shadow: 0 32px 100px rgba(0,0,0,.7);
}


.cy-dash-header {
  display: flex;
  align-items: center;
  padding: 10px 20px;
  gap: 12px;
  border-bottom: 1px solid var(--surface-raised);
  background: var(--surface-veil);
}
.cy-dash-symbol {
  font-family: var(--font-ui);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text-bright);
  background: var(--hover-subtle);
  padding: 5px 14px;
  border-radius: var(--radius-sm);
}
.cy-dash-divider {
  width: 1px;
  height: 20px;
  background: var(--surface-border);
}
.cy-dash-title {
  font-size: .95rem;
  font-weight: 500;
  color: var(--text-dim);
  flex: 1;
}
.cy-dash-close-btn {
  background: var(--surface-raised);
  border: 1px solid var(--surface-border);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  padding: 5px 16px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--ease), color var(--ease);
}
.cy-dash-close-btn:hover {
  background: rgba(255,255,255, var(--hover-medium));
  color: var(--text-bright);
}


.cy-dash-columns {
  flex: 1;
  display: flex;
  min-height: 0;
}


.cy-dash-left-sb {
  flex: 0 0 320px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--surface-raised);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}


.cy-dash-sb-tabs {
  display: flex;
  background: rgba(0,0,0,.25);
  border-radius: var(--radius-sm);
  padding: 3px;
  position: relative;
  border: 1px solid var(--divider-soft);
  flex-shrink: 0;
  margin: 8px 10px;
}
.cy-dash-sb-pill {
  position: absolute;
  top: 3px; bottom: 3px;
  background: var(--surface-border-hi);
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
  transition: all .3s cubic-bezier(.2,.8,.2,1);
  z-index: 1;
}
.cy-dash-sb-tab {
  flex: 1;
  border: none;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .905rem;
  font-weight: 500;
  padding: 5px 0;
  cursor: pointer;
  position: relative; z-index: 2;
  transition: color .2s;
}
.cy-dash-sb-tab:hover { color: var(--text); }
.cy-dash-sb-tab.active { color: var(--text); }


.cy-dash-sb-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow-y: auto;
}
.cy-dash-sb-panel::-webkit-scrollbar { width: 3px; }
.cy-dash-sb-panel::-webkit-scrollbar-track { background: transparent; }
.cy-dash-sb-panel::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.cy-dash-charts-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}


.cy-dash-chart-top {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.cy-dash-chart {
  flex: 1;
  min-height: 0;
  padding: 8px 12px 24px;
  position: relative;
}


.cy-dash-chart-inlay {
  position: absolute;
  top: 8px;
  left: 12px;
  right: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 3;
  pointer-events: none;
}
.cy-dash-chart-inlay-title {
  font-size: .95rem;
  font-weight: 600;
  color: var(--text);
}

.cy-dash-cal-axis {
  position: absolute;
  bottom: 4px;
  left: 0;
  right: 60px;
  height: 16px;
  pointer-events: none;
  overflow: visible;
  z-index: 2;
}
.cy-dash-cal-tick {
  position: absolute;
  transform: translateX(-50%);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  color: rgba(255,255,255,.35);
  white-space: nowrap;
  line-height: 1;
}
.cy-dash-cal-tick.cy-dash-cal-year {
  color: rgba(255,255,255,.55);
  font-weight: 600;
}


.cy-dash-spinner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--overlay-bg);
  z-index: 10;
}
.cy-spinner {
  width: 24px;
  height: 24px;
  border: 2px solid var(--surface-border-hi);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: cySpinner .8s linear infinite;
}


.cy-dash-divider-h {
  height: 7px;
  cursor: row-resize;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  background: var(--hover-subtle);
  border-top: 1px solid var(--surface-raised);
  border-bottom: 1px solid var(--surface-raised);
  transition: background var(--ease);
}
.cy-dash-divider-h:hover {
  background: var(--surface-raised);
}
.cy-dash-divider-h-grip {
  width: 36px;
  height: 3px;
  border-radius: 2px;
  background: var(--surface-border-hi);
}
.cy-dash-divider-h:hover .cy-dash-divider-h-grip {
  background: rgba(255,255,255,.3);
}


.cy-dash-bt-area {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.cy-dash-bt-header {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border-bottom: 1px solid var(--divider-soft);
  flex-shrink: 0;
}
.cy-dash-bt-title {
  font-size: 1.21rem;
  font-weight: 600;
  color: var(--text);
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.cy-dash-show-chart-btn {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  padding: 3px 10px;
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 5px;
  background: none;
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap;
}
.cy-dash-show-chart-btn:hover {
  background: rgba(255,255,255, var(--hover-medium));
  border-color: var(--surface-border-strong);
  color: var(--text);
}
.cy-dash-show-chart-btn.active {
  background: rgba(38, 217, 127, .12);
  border-color: rgba(38, 217, 127, .35);
  color: #26d97f;
}
.cy-dash-show-chart-btn.active:hover {
  background: rgba(38, 217, 127, .18);
}
.cy-dash-bt-body {
  flex: 1;
  display: flex;
  gap: 10px;
  padding: 8px 12px;
  min-height: 0;
  position: relative;
}
.cy-bt-chart-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}
.cy-bt-chart-title {
  font-size: .82rem;
  font-family: var(--font-ui);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-muted);
  text-align: center;
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cy-bt-chart {
  flex: 1;
  min-height: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
}


.cy-dash-metrics-sb {
  flex: 0 0 15%;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--surface-raised);
  min-width: 0;
  overflow-y: auto;
}


.cy-bt-metrics-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 24px;
}


.cy-bt-wr-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 14px;
}
.cy-bt-wr-donut-wrap {
  position: relative;
  width: 130px;
  height: 130px;
  cursor: default;
}
.cy-bt-wr-tip {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) scale(.92);
  display: flex;
  align-items: center;
  gap: 5px;
  background: rgba(18,18,34,.95);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 5px 10px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  box-shadow: 0 4px 14px rgba(0,0,0,.4);
}
.cy-bt-wr-tip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: rgba(18,18,34,.95);
}
.cy-bt-wr-donut-wrap:hover .cy-bt-wr-tip {
  opacity: 1;
  transform: translateX(-50%) scale(1);
}
.cy-bt-wr-tip .pos { color: var(--green); }
.cy-bt-wr-tip .neg { color: var(--red); }
.cy-bt-wr-tip .sep { color: var(--text-dim); }
.cy-bt-wr-inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.cy-bt-wr-pct {
  font-family: var(--font-ui);
  font-size: 2.8rem;
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1;
  color: var(--text);
}
.cy-bt-wr-pct.long { color: var(--green); }
.cy-bt-wr-pct.short { color: #ff2255; }
.cy-bt-wr-side {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--green);
  margin-top: 4px;
  line-height: 1;
}
.cy-bt-wr-side.short { color: #ff2255; }
.cy-bt-wr-label {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 2px;
}


.cy-bt-metrics-rows {
  width: 100%;
}
.cy-bt-metric-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid var(--hover-subtle);
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .35s ease, transform .35s ease;
}
.cy-bt-metric-row:last-child { border-bottom: none; }
.cy-bt-metric-row.visible {
  opacity: 1;
  transform: translateY(0);
}
.cy-bt-metric-val {
  font-family: var(--font-ui);
  font-size: 1.13rem;
  font-weight: 700;
  color: var(--text);
}
.cy-bt-metric-val.pos { color: var(--green); }
.cy-bt-metric-val.neg { color: var(--red); }
.cy-bt-metric-lbl {
  font-family: var(--font-ui);
  font-size: .97rem;
  font-weight: 500;
  color: var(--text-muted);
}


.cy-skel-shimmer {
  animation: cySkelShimmer 1.5s ease-in-out infinite;
}
@keyframes cySkelShimmer {
  0%, 100% { opacity: .3; }
  50% { opacity: .7; }
}


.cy-dash-bt-tooltip {
  position: absolute;
  z-index: 20;
  background: rgba(18,18,34,.95);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  padding: 6px 10px;
  font-family: var(--font-ui);
  font-size: .82rem;
  pointer-events: none;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(0,0,0,.4);
}


.cy-dash-drag-canvas {
  cursor: crosshair;
}




.cy-dash-ai-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  background: rgba(167,139,250,.12);
  border: 1px solid rgba(167,139,250,.2);
  border-radius: var(--radius-sm);
  color: var(--purple);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  margin-right: 8px;
  white-space: nowrap;
}
.cy-dash-ai-btn:hover {
  background: rgba(167,139,250,.22);
  border-color: rgba(167,139,250,.35);
}
.cy-dash-ai-btn svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}


.cy-ai-subtabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 10px;
}
.cy-ai-subtabs .sn-dash-tab {
  flex: 1;
  text-align: center;
  font-size: 0.82rem;
}


.cy-ai-peak-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  background: var(--surface-veil);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 4px;
  transition: border-color var(--ease);
}
.cy-ai-peak-item:hover {
  border-color: var(--border-hi);
}
.cy-ai-peak-rank {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(77,166,255,.12);
  color: var(--blue);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 700;
  flex-shrink: 0;
}
.cy-ai-peak-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.cy-ai-peak-period {
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-bright);
}
.cy-ai-peak-years {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  color: var(--text-dim);
}
.cy-ai-peak-power {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--amber);
  flex-shrink: 0;
}
.cy-ai-peak-actions {
  display: flex;
  gap: 3px;
  flex-shrink: 0;
}
.cy-ai-peak-btn {
  padding: 2px 7px;
  border: none;
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
}
.cy-ai-peak-btn-wave {
  background: rgba(77,166,255,.12);
  color: var(--blue);
}
.cy-ai-peak-btn-wave:hover { background: rgba(77,166,255,.25); }
.cy-ai-peak-btn-cycle {
  background: rgba(255,184,51,.12);
  color: var(--amber);
}
.cy-ai-peak-btn-cycle:hover { background: rgba(255,184,51,.25); }


.cy-header-btns {
  display: flex;
  gap: 6px;
  margin: 10px 0 16px;
}
.cy-header-btns .cy-dash-open-btn {
  flex: 1;
  margin: 0;
}
.cy-ai-finder-btn {
  background: linear-gradient(135deg, rgba(167,139,250,.2), rgba(139,92,246,.3)) !important;
  border-color: rgba(167,139,250,.3) !important;
}
.cy-ai-finder-btn:hover {
  background: linear-gradient(135deg, rgba(167,139,250,.35), rgba(139,92,246,.45)) !important;
  box-shadow: 0 4px 14px rgba(167,139,250,.25) !important;
}


.cy-inline-peaks {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.cy-inline-peaks-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.cy-inline-peaks-count {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  color: var(--text-dim);
}
.cy-inline-peaks-status {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  color: var(--amber);
}
.cy-inline-peaks-loading {
  display: flex;
  justify-content: center;
  padding: 12px 0;
}
.cy-inline-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid var(--border);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: cy-spin .6s linear infinite;
}
@keyframes cy-spin { to { transform: rotate(360deg); } }


.cy-ip-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 6px;
  background: var(--surface-veil);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 3px;
  transition: border-color var(--ease);
}
.cy-ip-item:hover {
  border-color: var(--border-hi);
}
.cy-ip-rank {
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(77,166,255,.1);
  color: var(--blue);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 700;
  flex-shrink: 0;
}
.cy-ip-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cy-ip-top {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.cy-ip-period {
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-bright);
}
.cy-ip-years {
  font-family: var(--font-ui);
  font-size: 0.82rem;
  color: var(--text-dim);
}
.cy-ip-bar-bg {
  width: 100%;
  height: 3px;
  background: var(--divider-soft);
  border-radius: 2px;
  overflow: hidden;
}
.cy-ip-bar {
  height: 100%;
  border-radius: 2px;
  transition: width .3s ease;
}
.cy-ip-actions {
  display: flex;
  gap: 3px;
  flex-shrink: 0;
}


.cy-add-top3-btn {
  width: 100%;
  padding: 7px 0;
  margin-top: 6px;
  border: 1px dashed var(--border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
}
.cy-add-top3-btn:hover {
  border-color: var(--blue);
  color: var(--blue);
  background: rgba(77,166,255,.06);
}




.sbt-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: var(--overlay-bg);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(var(--overlay-blur));
}
.sbt-modal {
  background: var(--panel);
  border: 1px solid var(--surface-raised);
  border-radius: 18px;
  width: 98vw; max-width: none; height: 96vh;
  display: flex; flex-direction: column;
  overflow: hidden;
  box-shadow: 0 32px 100px rgba(0,0,0,.7);
}


.sbt-header {
  display: flex; align-items: center;
  padding: 10px 20px; gap: 12px;
  border-bottom: 1px solid var(--surface-raised);
  background: var(--surface-veil); flex-shrink: 0;
}
.sbt-symbol {
  font-family: var(--font-ui); font-size: 1.3rem;
  font-weight: 800; color: var(--text-bright);
}
.sbt-divider {
  width: 1px; height: 22px; background: var(--surface-border);
}
.sbt-title {
  font-family: var(--font-ui); font-size: 1rem;
  font-weight: 500; color: var(--text-dim);
}
.sbt-close-btn {
  margin-left: auto; padding: 6px 16px;
  border-radius: var(--radius-sm); border: 1px solid var(--border);
  background: transparent; color: var(--text-dim);
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  cursor: pointer; transition: all var(--ease);
}
.sbt-close-btn:hover { border-color: var(--text-dim); color: var(--text); }


.sbt-columns { flex: 1; display: flex; min-height: 0; }

.sbt-left-sb {
  flex: 0 0 320px; display: flex; flex-direction: column;
  border-right: 1px solid var(--surface-raised);
  min-width: 0; min-height: 0; overflow: hidden;
}
.sbt-charts-col {
  flex: 1; display: flex; flex-direction: column;
  min-width: 0; min-height: 0;
}
.sbt-metrics-sb {
  flex: 0 0 15%; display: flex; flex-direction: column;
  border-left: 1px solid var(--surface-raised);
  min-width: 0; overflow-y: auto;
}


.sbt-sb-tabs {
  display: flex; position: relative; flex-shrink: 0;
  border-bottom: 1px solid var(--surface-raised);
}
.sbt-sb-tab {
  flex: 1; padding: 11px 0; border: none; background: transparent;
  color: var(--text-dim); font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600; cursor: pointer;
  transition: color var(--ease); text-align: center;
}
.sbt-sb-tab:hover { color: var(--text); }
.sbt-sb-tab.active { color: var(--text-bright); }
.sbt-sb-pill {
  position: absolute; bottom: 0; height: 2px;
  background: var(--blue); border-radius: 1px;
  transition: left .25s ease, width .25s ease;
}
.sbt-sb-panel {
  flex: 1; display: flex; flex-direction: column;
  overflow: hidden; min-height: 0;
}


.sbt-bar-pair {
  display: flex; gap: 12px; padding: 14px 16px 10px;
}
.sbt-bar-col { flex: 1; }
.sbt-bar-label {
  font-family: var(--font-ui); font-size: .72rem; font-weight: 600;
  color: var(--text-muted); text-transform: uppercase;
  letter-spacing: .05em; margin-bottom: 4px;
}
.sbt-bar-input {
  width: 100%; padding: 6px 8px;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  font-family: var(--font-ui); font-size: .90rem; text-align: center;
}
.sbt-go-row {
  display: flex; gap: 6px; padding: 0 16px 12px;
}
.sbt-go-btn {
  flex: 1; padding: 8px 0; border: none;
  border-radius: var(--radius-sm);
  background: var(--blue); color: #fff;
  font-family: var(--font-ui); font-size: .85rem;
  font-weight: 700; cursor: pointer; transition: opacity var(--ease);
}
.sbt-go-btn:hover { opacity: .85; }
.sbt-fullcycle-btn {
  padding: 8px 14px; border: 1px solid var(--border);
  border-radius: var(--radius-sm); background: transparent;
  color: var(--text-dim); font-family: var(--font-ui);
  font-size: .82rem; font-weight: 600; cursor: pointer;
  white-space: nowrap; transition: all var(--ease);
}
.sbt-fullcycle-btn:hover { border-color: var(--text-dim); color: var(--text); }

.sbt-optimize-section {
  padding: 12px 16px; border-top: 1px solid var(--divider-soft);
}
.sbt-section-title {
  font-family: var(--font-ui); font-size: .82rem;
  font-weight: 600; color: var(--text); margin-bottom: 8px;
}


.sbt-chart-top {
  flex: 1; display: flex; flex-direction: column;
  min-height: 0; position: relative;
}
.sbt-chart-inlay {
  position: absolute; top: 8px; left: 14px; z-index: 2;
  display: flex; flex-direction: column; gap: 2px;
}
.sbt-chart-inlay-title {
  font-family: var(--font-ui); font-size: .90rem;
  font-weight: 600; color: var(--text);
}
.sbt-chart-inlay-bottom {
  position: absolute; bottom: 8px; left: 14px; right: 14px;
  z-index: 2; display: flex; justify-content: space-between;
  align-items: center;
}
.sbt-hint {
  font-family: var(--font-ui); font-size: .78rem;
  color: var(--text-muted); font-style: italic;
}
.sbt-clean-btn {
  padding: 3px 10px; border: 1px solid var(--border);
  border-radius: var(--radius-sm); background: transparent;
  color: var(--text-dim); font-family: var(--font-ui);
  font-size: .78rem; cursor: pointer; transition: all var(--ease);
}
.sbt-clean-btn:hover { border-color: var(--text-dim); color: var(--text); }

.sbt-chart-canvas {
  flex: 1; min-height: 0; width: 100%;
}


.sbt-divider-h {
  height: 7px; cursor: row-resize;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; background: var(--surface-veil);
  border-top: 1px solid var(--divider-soft);
  border-bottom: 1px solid var(--divider-soft);
  transition: background var(--ease);
}
.sbt-divider-h:hover { background: var(--surface-raised); }
.sbt-divider-h-grip {
  width: 36px; height: 3px; border-radius: 2px;
  background: var(--surface-border-hi);
}
.sbt-divider-h:hover .sbt-divider-h-grip { background: rgba(255,255,255,.3); }


.sbt-bt-area {
  flex: 1; min-height: 0;
  display: flex; flex-direction: column;
}
.sbt-bt-header {
  display: flex; align-items: center; justify-content: center;
  padding: 8px 16px;
  border-bottom: 1px solid var(--divider-soft);
  flex-shrink: 0;
}
.sbt-bt-title {
  font-family: var(--font-ui); font-size: 1.1rem;
  font-weight: 600; color: var(--text);
  display: flex; align-items: center; gap: 8px;
}
.sbt-bt-body {
  flex: 1; display: flex; gap: 10px;
  padding: 8px 12px; min-height: 0;
}
.sbt-bt-chart-wrap {
  flex: 1; display: flex; flex-direction: column;
  min-width: 0; min-height: 0;
}
.sbt-bt-chart-title {
  font-family: var(--font-ui); font-size: .82rem;
  text-transform: uppercase; letter-spacing: .04em;
  color: var(--text-muted); text-align: center; margin-bottom: 3px;
}
.sbt-bt-chart {
  flex: 1; min-height: 0;
  border-radius: var(--radius-sm); overflow: hidden;
}


.sbt-bt-tooltip {
  position: absolute; top: 6px; left: 12px;
  background: rgba(20,20,26,.92); padding: 8px 12px;
  border-radius: var(--radius-sm); border: 1px solid var(--surface-raised);
  font-family: var(--font-ui); font-size: .82rem;
  pointer-events: none; z-index: 5;
  backdrop-filter: blur(6px);
}




.sbt-toggle-wrap {
  display: flex;
  gap: 0;
  padding: 12px 16px 0;
  flex-shrink: 0;
}
.sbt-toggle {
  flex: 1;
  padding: 7px 0;
  border: none;
  background: transparent;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all var(--ease);
}
.sbt-toggle:hover { color: var(--text); }
.sbt-toggle.active {
  color: #fff;
  border-bottom-color: #fff;
}
.sbt-toggle-long.active { color: #26d97f; border-bottom-color: #26d97f; }
.sbt-toggle-short.active { color: #f0506e; border-bottom-color: #f0506e; }


.sbt-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px 8px;
  flex-shrink: 0;
}
.sbt-sort-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  color: var(--text-dim);
}
.sbt-sort-pill {
  position: relative;
  padding: 3px 10px;
  border-radius: var(--radius-sm);
  background: var(--divider-soft);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  border: 1px solid var(--border);
  transition: all var(--ease);
}
.sbt-sort-pill:hover { border-color: var(--text-dim); }
.sbt-sort-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  min-width: 130px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  box-shadow: var(--overlay-shadow);
  z-index: 10;
  padding: 4px 0;
  display: none;
}
.sbt-sort-dropdown.open { display: block; }
.sbt-sort-option {
  display: block;
  width: 100%;
  padding: 6px 12px;
  border: none;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  text-align: left;
  cursor: pointer;
  transition: background var(--ease);
}
.sbt-sort-option:hover { background: rgba(255,255,255, var(--hover-medium)); color: var(--text); }
.sbt-sort-option.active { color: var(--blue); font-weight: 600; }


.sbt-count {
  font-size: 0.78rem;
  color: var(--text-muted);
}


.sbt-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sbt-list::-webkit-scrollbar { width: 5px; }
.sbt-list::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.sbt-card {
  padding: 14px 16px;
  border-radius: var(--radius-md);
  border: 1px solid var(--hover-subtle);
  background: var(--surface-veil);
  cursor: pointer;
  transition: all var(--ease);
  animation: sbtCardIn 0.3s ease both;
}
.sbt-card:nth-child(2) { animation-delay: .04s; }
.sbt-card:nth-child(3) { animation-delay: .08s; }
.sbt-card:nth-child(4) { animation-delay: .12s; }
.sbt-card:nth-child(5) { animation-delay: .16s; }
.sbt-card:nth-child(6) { animation-delay: .20s; }
.sbt-card:nth-child(7) { animation-delay: .24s; }
@keyframes sbtCardIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.sbt-card:hover { background: #1e1e28; }
.sbt-card.sbt-active {
  border-color: var(--blue-focus);
  background: var(--blue-dim);
}


.sbt-card.sbt-long {
  border-bottom: 2px solid rgba(38,217,127,.4);
  box-shadow: 0 3px 10px -2px rgba(38,217,127,.12);
}
.sbt-card.sbt-short {
  border-bottom: 2px solid rgba(240,80,110,.4);
  box-shadow: 0 3px 10px -2px rgba(240,80,110,.12);
}


.sbt-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.sbt-card-range {
  font-family: var(--font-ui);
  font-size: 0.90rem;
  font-weight: 700;
  color: var(--text);
}
.sbt-card-range small {
  font-weight: 400;
  color: var(--text-muted);
  font-size: 0.82rem;
}
.sbt-card-return {
  font-family: var(--font-ui);
  font-size: 1.3rem;
  font-weight: 900;
}
.sbt-long .sbt-card-return { color: #26d97f; }
.sbt-short .sbt-card-return { color: #f0506e; }


.sbt-phase-bar {
  height: 5px;
  background: var(--hover-subtle);
  border-radius: 3px;
  position: relative;
  overflow: hidden;
  margin-bottom: 8px;
}
.sbt-phase-bar-fill {
  position: absolute;
  height: 100%;
  border-radius: 3px;
}
.sbt-long .sbt-phase-bar-fill { background: rgba(38,217,127,.45); }
.sbt-short .sbt-phase-bar-fill { background: rgba(240,80,110,.45); }


.sbt-card-stats {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.sbt-stats-left {
  display: flex;
  gap: 16px;
}
.sbt-stat {}
.sbt-stat-label {
  font-family: var(--font-ui);
  font-size: 0.72rem;
  font-weight: 500;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin: 0 0 2px;
}
.sbt-stat-value {
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
  margin: 0;
}


.sbt-card-flag {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  cursor: pointer;
  color: var(--surface-border-strong);
  transition: all var(--ease);
  flex-shrink: 0;
}
.sbt-card-flag:hover {
  color: rgba(255,255,255,.5);
  background: rgba(255,255,255, var(--hover-medium));
}
.sbt-card-flag.on {
  color: #ffb833;
}
.sbt-card.sbt-flagged {
  border-color: rgba(255,184,51,.35);
}




.sbt-strategy {
  border-top: 1px solid var(--border);
  padding: 12px 16px;
  flex-shrink: 0;
  background: var(--surface-veil);
}
.sbt-strategy-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.sbt-strategy-title {
  font-family: var(--font-ui);
  font-size: 0.90rem;
  font-weight: 700;
  color: var(--text);
}
.sbt-strategy-stats {
  display: flex;
  gap: 16px;
  font-family: var(--font-ui);
  font-size: 0.85rem;
}
.sbt-strategy-stat-val {
  font-weight: 700;
}


.sbt-timeline {
  height: 28px;
  background: var(--hover-subtle);
  border-radius: var(--radius-sm);
  position: relative;
  overflow: hidden;
  margin-bottom: 8px;
  border: 1px solid var(--surface-raised);
}
.sbt-timeline-seg {
  position: absolute;
  height: 100%;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-ui);
  font-size: 0.70rem;
  font-weight: 600;
  color: rgba(255,255,255,.8);
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
  transition: opacity var(--ease);
}
.sbt-timeline-seg:hover { opacity: .8; }
.sbt-timeline-seg.sbt-tl-long { background: rgba(38,217,127,.35); }
.sbt-timeline-seg.sbt-tl-short { background: rgba(240,80,110,.35); }


.sbt-strategy-phases {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.sbt-strategy-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--text);
  border: 1px solid var(--surface-border);
  background: var(--hover-subtle);
}
.sbt-strategy-chip.sbt-chip-long { border-color: rgba(38,217,127,.3); }
.sbt-strategy-chip.sbt-chip-short { border-color: rgba(240,80,110,.3); }
.sbt-strategy-chip-remove {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 0.90rem;
  cursor: pointer;
  padding: 0 2px;
  line-height: 1;
}
.sbt-strategy-chip-remove:hover { color: #f0506e; }




.sbt-overlap-warn {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  padding: 10px 20px;
  background: rgba(240,80,110,.15);
  border: 1px solid rgba(240,80,110,.4);
  border-radius: var(--radius-md);
  color: #f0506e;
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  z-index: 9999;
  animation: sbtWarnIn .3s ease;
  backdrop-filter: blur(8px);
}
@keyframes sbtWarnIn {
  from { opacity: 0; transform: translateX(-50%) translateY(10px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}


.mcl-overlay {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--overlay-bg);
  backdrop-filter: var(--overlay-blur);
}
.mcl-modal {
  background: var(--card);
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 40px var(--shadow-strong, rgba(0,0,0,.35));
  width: 300px;
  font-family: var(--font-ui);
}
.mcl-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--border);
}
.mcl-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-bright);
}
.mcl-body {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mcl-label {
  font-size: 0.84rem;
  color: var(--text-dim);
  font-weight: 500;
}
.mcl-input {
  background: var(--bg-input, var(--surface-raised));
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-bright);
  font-family: var(--font-ui);
  font-size: 0.90rem;
  padding: 8px 10px;
  outline: none;
  transition: border-color var(--ease);
}
.mcl-input:focus {
  border-color: var(--accent, #5b9cf6);
}

.mcl-input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.8);
  cursor: pointer;
}
.mcl-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 10px 16px 14px;
}
.mcl-btn {
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  padding: 7px 18px;
  border-radius: var(--radius-sm);
  border: none;
  cursor: pointer;
  transition: background var(--ease), opacity var(--ease);
}
.mcl-btn-cancel {
  background: var(--surface-border);
  color: var(--text-dim);
}
.mcl-btn-cancel:hover { background: var(--surface-border-hi); }
.mcl-btn-apply {
  background: var(--pill-active-bg, #5b9cf6);
  color: var(--pill-active-color, #fff);
}
.mcl-btn-apply:hover { opacity: .85; }
.mcl-mode-toggle {
  display: flex;
  gap: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
  border: 1px solid var(--border);
  margin: 4px 0 2px;
}
.mcl-mode-btn {
  flex: 1;
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  padding: 6px 0;
  border: none;
  cursor: pointer;
  background: transparent;
  color: var(--text-dim);
  transition: background var(--ease), color var(--ease);
}
.mcl-mode-btn:hover { background: rgba(255,255,255, var(--hover-subtle)); }
.mcl-mode-btn.active {
  background: var(--pill-active-bg, #5b9cf6);
  color: var(--pill-active-color, #fff);
}
.mcl-field { display: flex; flex-direction: column; gap: 6px; }




.cy-bp-container { display: flex; flex-direction: column; padding: 0 10px; flex: 1; min-height: 0; overflow: hidden; }
.cy-bp-settings-card { background: var(--hover-subtle); border: 1px solid var(--border, var(--surface-border)); border-radius: var(--radius-md); padding: 10px; margin-bottom: 8px; flex-shrink: 0; }
.cy-bp-title-row { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.cy-bp-icon { color: var(--text-dim); flex-shrink: 0; }
.cy-bp-title { font-family: var(--font-ui); font-size: .90rem; font-weight: 600; color: var(--text-bright); }
.cy-bp-inputs { display: flex; gap: 8px; align-items: flex-end; margin-top: 6px; }
.cy-bp-input-group { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.cy-bp-input-label { font-family: var(--font-ui); font-size: .72rem; font-weight: 600; color: var(--text-muted); letter-spacing: .03em; }
.cy-bp-input { font-family: var(--font-ui); font-size: .85rem; padding: 4px 8px; background: var(--hover-subtle); border: 1px solid var(--surface-border); border-radius: var(--radius-sm); color: var(--text); width: 100%; }
.cy-bp-input:focus { outline: none; border-color: var(--surface-border-strong); }
.cy-bp-run-btn { font-family: var(--font-ui); font-size: .82rem; font-weight: 600; padding: 5px 16px; background: var(--pill-active-bg); color: var(--pill-active-color); border: none; border-radius: var(--radius-sm); cursor: pointer; transition: var(--ease); flex-shrink: 0; }
.cy-bp-run-btn:hover { filter: brightness(1.1); }
.cy-bp-show-toggle { display: flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: var(--radius-sm); background: var(--divider-soft); border: 1px solid var(--surface-border); color: var(--text-dim); cursor: pointer; transition: var(--ease); flex-shrink: 0; }
.cy-bp-show-toggle:hover { background: var(--surface-border); }
.cy-bp-show-toggle.active { color: var(--green, #00ff88); border-color: rgba(0,200,100,.3); }


.cy-bp-toggle-wrap { display: flex; gap: 4px; margin-bottom: 6px; flex-shrink: 0; }
.cy-bp-toggle { font-family: var(--font-ui); font-size: .82rem; font-weight: 600; padding: 5px 0; flex: 1; border: none; border-radius: var(--radius-sm); cursor: pointer; transition: var(--ease); background: transparent; color: var(--text-dim); }
.cy-bp-toggle:hover { background: rgba(255,255,255, var(--hover-subtle)); }
.cy-bp-toggle-bull.active { background: rgba(38, 217, 127, .15); color: #26d97f; }
.cy-bp-toggle-bear.active { background: rgba(240, 80, 110, .15); color: #f0506e; }


.cy-bp-sort-bar { display: flex; gap: 6px; margin-bottom: 6px; flex-shrink: 0; }
.cy-bp-sort-pill { position: relative; display: flex; align-items: center; gap: 3px; padding: 3px 8px; background: var(--divider-soft); border: 1px solid var(--surface-border); border-radius: var(--radius-sm); cursor: pointer; transition: var(--ease); }
.cy-bp-sort-pill:hover { background: var(--surface-raised); }
.cy-bp-sort-label { font-family: var(--font-ui); font-size: .72rem; font-weight: 600; color: var(--text-muted); letter-spacing: .03em; white-space: nowrap; }
.cy-bp-sort-chevron { width: 12px; height: 12px; color: var(--text-muted); flex-shrink: 0; }
.cy-bp-sort-dropdown { display: none; position: absolute; top: 100%; left: 0; z-index: 50; background: var(--overlay-bg, rgba(30,30,40,.95)); border: 1px solid var(--surface-border); border-radius: var(--radius-sm); padding: 4px; min-width: 100%; backdrop-filter: blur(12px); }
.cy-bp-sort-dropdown.visible { display: flex; flex-direction: column; }
.cy-bp-sort-opt { font-family: var(--font-ui); font-size: .82rem; padding: 4px 10px; background: none; border: none; color: var(--text-dim); cursor: pointer; text-align: left; border-radius: 4px; transition: var(--ease); white-space: nowrap; }
.cy-bp-sort-opt:hover { background: rgba(255,255,255, var(--hover-medium)); color: var(--text); }
.cy-bp-sort-opt.active { color: var(--text-bright); font-weight: 600; }


.cy-bp-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow-y: auto;
  flex: 1;
  padding-right: 4px;
}


.cy-bp-card {
  background: var(--hover-subtle);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  cursor: pointer;
  transition: var(--ease);
}
.cy-bp-card:hover {
  background: var(--surface-raised);
  border-color: var(--surface-border);
}
.cy-bp-card.cy-bp-active {
  border-color: var(--surface-border-strong);
  background: var(--surface-raised);
}
.cy-bp-card.cy-bp-bull { border-left: 3px solid rgba(0,200,100,.5); }
.cy-bp-card.cy-bp-bear { border-left: 3px solid rgba(220,60,60,.5); }
.cy-bp-card.cy-bp-degraded { opacity: .7; }


.cy-bp-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.cy-bp-card-left {
  display: flex;
  align-items: center;
  gap: 6px;
}
.cy-bp-rank {
  font-size: .82rem;
  font-weight: 700;
  color: var(--text-muted);
  min-width: 22px;
}
.cy-bp-card-bars {
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 600;
  color: var(--text-bright);
}
.cy-bp-dur {
  font-weight: 400;
  color: var(--text-dim);
  font-size: .82rem;
}
.cy-bp-card-wr {
  font-family: var(--font-ui);
  font-size: .95rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: var(--radius-sm);
}
.cy-bp-bull .cy-bp-card-wr { background: rgba(0,200,100,.12); color: #4cdf90; }
.cy-bp-bear .cy-bp-card-wr { background: rgba(220,60,60,.12); color: #ef6b6b; }


.cy-bp-badge {
  font-size: .85rem;
  line-height: 1;
}
.cy-bp-badge-warn { color: #f5a623; }
.cy-bp-badge-star { color: #f5d623; }


.cy-bp-card.cy-bp-on-chart { border-color: var(--surface-border-strong); background: var(--hover-subtle); }


.cy-bp-card-stats {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.cy-bp-stats-left { display: flex; gap: 12px; }
.cy-bp-stat {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.cy-bp-stat-label {
  font-size: .75rem;
  color: var(--text-muted);
  font-weight: 500;
}
.cy-bp-stat-value {
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 600;
  color: var(--text);
}
.cy-bp-stat-gain {
  color: var(--green, #00ff88);
}
.cy-bp-bear .cy-bp-stat-gain {
  color: var(--red, #ff4466);
}


.cy-bp-band-outer {
  display: flex;
  align-items: stretch;
  flex-shrink: 0;
}

.cy-bp-band-wrap {
  flex: 1;
  min-width: 0;
  position: relative;
  width: 100%;
  min-height: 22px;
  background: var(--hover-subtle);
  border-top: 1px solid var(--surface-raised);
  flex-shrink: 0;
}
.cy-bp-band-loading {
  font-family: var(--font-ui);
  font-size: .75rem;
  color: var(--surface-border-strong);
  text-align: center;
  padding: 4px 0;
}
.cy-bp-band-row {
  position: relative;
  height: 16px;
}
.cy-bp-seg {
  position: absolute;
  top: 0;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  cursor: pointer;
  transition: filter var(--ease);
}
.cy-bp-seg:hover {
  filter: brightness(1.3);
}
.cy-bp-seg span {
  font-family: var(--font-ui);
  font-size: .65rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
}
.cy-bp-seg-bull { background: rgba(38, 217, 127, 0.25); border: 1px solid rgba(38, 217, 127, 0.40); }
.cy-bp-seg-bull span { color: rgba(38, 217, 127, 0.85); }
.cy-bp-seg-bear { background: rgba(240, 80, 110, 0.25); border: 1px solid rgba(240, 80, 110, 0.40); }
.cy-bp-seg-bear span { color: rgba(240, 80, 110, 0.85); }


.cy-bp-send-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
  background: var(--surface-raised);
  border: 1px solid var(--surface-border-hi);
  border-radius: var(--radius-sm);
  color: rgba(255,255,255,0.5);
  cursor: pointer;
  transition: var(--ease);
  margin-left: 4px;
}
.cy-bp-send-btn:hover { background: var(--surface-border); color: var(--text); }


.cy-bp-card-eye {
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: var(--radius-sm);
  color: var(--text-muted); cursor: pointer; transition: var(--ease);
  flex-shrink: 0; align-self: flex-end;
}
.cy-bp-card-eye:hover { background: rgba(255,255,255, var(--hover-medium)); color: var(--text); }
.cy-bp-card-eye.on { color: var(--green, #00ff88); }
.cy-bp-bear .cy-bp-card-eye.on { color: var(--red, #ff4466); }




.dd-glass-wrap { display: flex; flex-direction: column; gap: 8px; padding: 8px; }
.dd-header { padding: 8px 0 0; flex-shrink: 0; }
.dd-header-top { display: flex; justify-content: space-between; align-items: center; }
.dd-title {
  font-family: var(--font-ui); font-size: 1.1rem; font-weight: 600;
  letter-spacing: -.01em; color: var(--text-bright);
}
.dd-title span { color: var(--blue); }
.dd-header .sn-dash-open-btn { margin: 10px 0 8px; }
.dd-header .sn-dash-open-btn + .sn-dash-open-btn { margin-top: 0; }

.dd-empty { padding: 24px 12px; text-align: center; color: var(--text-muted); font-size: .82rem; }


.dd-sidebar-action-box { padding: 12px 10px; border-bottom: none; border-radius: var(--radius-md); background: var(--hover-subtle); border: 1px solid var(--surface-raised); }


.st-ai-content .ddm-ins-section { padding: 14px 14px 16px; }


.ddm-overlay {
  position: fixed; inset: 0;
  background: var(--overlay-bg);
  z-index: 200; display: none;
  align-items: center; justify-content: center;
  backdrop-filter: blur(var(--overlay-blur));
}
.ddm-overlay.open { display: flex; animation: optFadeIn .2s ease; }

.ddm-panel {
  width: 100vw; max-width: 100vw;
  height: 100vh; max-height: 100vh;
  background: var(--panel);
  border: none; border-radius: 0;
  display: flex; flex-direction: row;
  box-shadow: var(--overlay-shadow);
  overflow: hidden;
  animation: optSlideIn .2s ease;
  font-family: var(--font-ui);
}


.ddm-left-nav {
  width: 64px; flex-shrink: 0;
  display: flex; flex-direction: column; gap: 2px;
  padding: 16px 4px;
  background: var(--surface-veil);
  border-right: 1px solid var(--border);
}
.ddm-nav-btn {
  padding: 10px 2px; border: none; border-radius: var(--radius-sm);
  background: none; color: var(--text-muted);
  font-family: var(--font-ui); font-size: .7rem; font-weight: 700;
  cursor: pointer; transition: all var(--ease);
  white-space: nowrap; text-align: center;
  letter-spacing: .02em; text-transform: uppercase;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  overflow: hidden;
}
.ddm-nav-btn svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.5; flex-shrink: 0; }
.ddm-nav-btn:hover { color: var(--text); background: var(--divider-soft); }
.ddm-nav-btn.active { background: var(--red-dim); color: var(--red); }


.ddm-right-content { flex: 1; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }

.ddm-header { padding: 0; border-bottom: 1px solid var(--border); flex-shrink: 0; background: linear-gradient(180deg, var(--surface-veil) 0%, transparent 100%); }
.ddm-header-top { display: flex; align-items: center; justify-content: space-between; padding: 12px 24px 0; gap: 16px; }
.ddm-header h3 {
  font-family: var(--font-ui); font-size: 1.2rem; font-weight: 700;
  color: var(--text-bright); white-space: nowrap; margin: 0;
  display: flex; align-items: center; gap: 10px;
}
.ddm-header h3::before {
  content: ''; display: inline-block; width: 3px; height: 18px;
  background: var(--red); border-radius: 2px;
}


.ddm-controls-bar {
  display: flex; align-items: center; justify-content: center;
  gap: 20px; padding: 10px 24px 12px;
}
.ddm-ctrl-group {
  display: flex; align-items: center; gap: 8px;
}
.ddm-ctrl-label {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  color: var(--text-muted); text-transform: uppercase; letter-spacing: .06em;
  white-space: nowrap;
}
.ddm-ctrl-sep {
  width: 1px; height: 20px; background: var(--border); flex-shrink: 0;
}


.ddm-year-slider {
  -webkit-appearance: none; appearance: none;
  width: 120px; height: 4px; border-radius: 2px;
  background: var(--surface-border-hi); outline: none; cursor: pointer;
}
.ddm-year-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--text-bright); border: 2px solid var(--panel);
  box-shadow: 0 0 4px rgba(0,0,0,.4); cursor: pointer;
}
.ddm-year-slider::-moz-range-thumb {
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--text-bright); border: 2px solid var(--panel);
  box-shadow: 0 0 4px rgba(0,0,0,.4); cursor: pointer;
}

.ddm-nav-th { display: flex; gap: 3px; }
.ddm-nav-th .ddm-th-btn {
  padding: 4px 10px; border: none; border-radius: var(--radius-sm);
  background: var(--surface-raised); color: var(--text-muted);
  font-family: var(--font-ui); font-size: 0.8rem; font-weight: 600;
  cursor: pointer; transition: all var(--ease); text-align: center;
}
.ddm-nav-th .ddm-th-btn:hover { color: var(--text); background: var(--surface-border); }
.ddm-nav-th .ddm-th-btn.active { background: var(--pill-active-bg); color: var(--pill-active-color); box-shadow: 0 1px 4px rgba(0,0,0,.2); }


.ddm-main { flex: 1; display: flex; overflow: hidden; }
.ddm-metric-area { flex: 1; display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid var(--border); min-width: 0; }
.ddm-body { flex: 1; overflow-y: auto; padding: 20px 24px; }
.ddm-body::-webkit-scrollbar { width: 5px; }
.ddm-body::-webkit-scrollbar-track { background: transparent; }
.ddm-body::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }

.ddm-insight-area {
  width: 440px; min-width: 380px; max-width: 480px;
  display: flex; flex-direction: column;
  background: var(--card); flex-shrink: 0; overflow: hidden;
}


.ddm-ai-header { display: flex; align-items: center; gap: 10px; padding: 8px 18px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.ddm-ai-stars { width: 18px; height: 18px; flex-shrink: 0; }
.ddm-ai-stars .ddm-star-big { fill: var(--red); transform-origin: center; transform-box: fill-box; animation: stmPulseStar 2s ease-in-out infinite; }
.ddm-ai-stars .ddm-star-small { fill: var(--amber); transform-origin: center; transform-box: fill-box; animation: stmPulseStar 2s ease-in-out infinite .5s; }
.ddm-ai-text { display: flex; align-items: center; gap: 8px; }
.ddm-ai-title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  background: linear-gradient(135deg, var(--red), var(--amber));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  white-space: nowrap;
}
.ddm-ai-sub { font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted); font-weight: 400; white-space: nowrap; }


.ddm-ai-tabs {
  display: flex;
  gap: 4px;
  padding: 8px 18px 0;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.ddm-ai-tab {
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 8px 14px;
  font-family: var(--font-ui);
  font-size: .88rem;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  letter-spacing: .04em;
  transition: var(--ease);
  margin-bottom: -1px;
}
.ddm-ai-tab:hover { color: var(--text); background: var(--hover-subtle); border-radius: var(--radius-sm) var(--radius-sm) 0 0; }
.ddm-ai-tab.active { color: var(--text-bright); border-bottom-color: var(--text-bright); background: transparent; border-radius: 0; }

.ddm-ai-pane { display: none; flex: 1; flex-direction: column; min-height: 0; }
.ddm-ai-pane.active { display: flex; }


.ddm-help-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}
.ddm-help-scroll::-webkit-scrollbar { width: 5px; }
.ddm-help-scroll::-webkit-scrollbar-track { background: transparent; }
.ddm-help-scroll::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }
.ddm-help-content {
  padding: 18px;
  font-family: var(--font-ui);
  font-size: .93rem;
  line-height: 1.65;
  color: var(--text);
}
.ddm-help-content .ddm-help-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text-bright);
  margin-bottom: 10px;
  letter-spacing: -.005em;
}
.ddm-help-content .ddm-help-section { margin-bottom: 14px; }
.ddm-help-content .ddm-help-section:last-child { margin-bottom: 0; }
.ddm-help-content .ddm-help-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-bright);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 4px;
  display: block;
}
.ddm-help-content p { margin: 0 0 10px; }
.ddm-help-content p:last-child { margin-bottom: 0; }
.ddm-help-content strong { color: var(--text-bright); }
.ddm-help-content ul {
  margin: 0 0 10px;
  padding-left: 18px;
  list-style: disc;
}
.ddm-help-content ul:last-child { margin-bottom: 0; }
.ddm-help-content ul li { margin-bottom: 4px; }
.ddm-help-content ul li:last-child { margin-bottom: 0; }
.ddm-help-content ul li::marker { color: var(--text-dim); }
.ddm-help-tip {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  background: var(--surface-veil);
  border-left: 2px solid var(--blue);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin-bottom: 14px;
  font-size: .9rem;
  line-height: 1.5;
}
.ddm-help-tip-icon {
  font-size: 1.1rem;
  line-height: 1;
  flex-shrink: 0;
}
.ddm-help-tip-strong {
  background: linear-gradient(135deg, rgba(167,139,250,.12), rgba(125,211,252,.06));
  border-left-color: var(--purple);
  border-left-width: 3px;
  padding: 12px 14px;
}
.ddm-help-tip-strong strong {
  display: inline-block;
  color: var(--purple);
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 4px;
}


.ddm-chart-title-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.ddm-chart-title-wrap .ddm-chart-title { margin-bottom: 0; }
.ddm-chart-title-wrap-left { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ddm-chart-help-btn {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--surface-border);
  background: var(--surface-veil);
  color: var(--text-muted);
  border-radius: 50%;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  cursor: pointer;
  line-height: 1;
  padding: 0;
  transition: var(--ease);
  flex-shrink: 0;
}
.ddm-chart-help-btn:hover {
  background: var(--purple-dim);
  border-color: var(--purple);
  color: var(--purple);
}
.ddm-chart-help-btn.active {
  background: var(--purple-med);
  border-color: var(--purple);
  color: var(--purple);
  box-shadow: 0 0 0 3px rgba(167,139,250,.12);
}


.ddm-action-box {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px;
  padding: 12px 18px; border-bottom: 1px solid var(--border);
  background: var(--surface-veil);
}
.ddm-depth-bucket-row {
  grid-column: 1 / -1;
  display: flex; flex-wrap: wrap; gap: 6px;
}
.ddm-depth-bucket-row .ddm-th-btn {
  flex: 1 1 auto;
  min-width: 0;
  padding: 6px 10px;
  font-size: .82rem;
  white-space: nowrap;
}
.ddm-action-item { text-align: center; padding: 8px 4px; background: var(--surface-veil); border-radius: var(--radius-sm); }
.ddm-action-label { font-family: var(--font-ui); font-size: .6rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); margin-bottom: 3px; }
.ddm-action-value { font-family: var(--font-ui); font-size: 1.1rem; font-weight: 700; line-height: 1.2; }
.ddm-action-sub { font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted); margin-top: 1px; }


.ddm-insight-scroll { flex: 1; overflow-y: auto; padding: 0; }
.ddm-insight-scroll::-webkit-scrollbar { width: 5px; }
.ddm-insight-scroll::-webkit-scrollbar-track { background: transparent; }
.ddm-insight-scroll::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }

.ddm-insight-content {}


.ddm-ins-section { padding: 16px 18px 20px; border-bottom: 1px solid var(--border); }
.ddm-ins-section:last-child { border-bottom: none; }
.ddm-ins-section-header { margin-bottom: 14px; }
.ddm-ins-title-row { display: flex; align-items: baseline; gap: 8px; }
.ddm-ins-num { font-family: var(--font-ui); font-size: 1.4rem; font-weight: 700; color: var(--text-bright); line-height: 1.15; }
.ddm-ins-title { font-family: var(--font-ui); font-size: 1.4rem; font-weight: 700; color: var(--text-bright); line-height: 1.15; }
.ddm-ins-subtitle { font-family: var(--font-ui); font-size: .82rem; font-weight: 500; color: var(--text-muted); margin-top: 4px; }
.ddm-ins-prose { font-family: var(--font-ui); font-size: .93rem; line-height: 1.65; color: var(--text); margin-bottom: 10px; }
.ddm-ins-prose:last-child { margin-bottom: 0; }
.ddm-ins-prose strong { color: var(--text-bright); }
.ddm-ins-prose .hl-red { color: var(--red); font-weight: 600; }
.ddm-ins-prose .hl-green { color: var(--green); font-weight: 600; }
.ddm-ins-prose .hl-amber { color: var(--amber); font-weight: 600; }
.ddm-ins-prose .hl-blue { color: var(--blue); font-weight: 600; }
.ddm-ins-prose .hl-white { color: var(--text-bright); font-weight: 600; }
.ddm-ins-prose .num { font-family: var(--font-ui); font-weight: 700; }

.ddm-ins-widget {
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 14px;
}
.ddm-ins-widget-title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 10px;
}


.ddm-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
  margin-bottom: 16px;
}
.ddm-chart-wrap { position: relative; width: 100%; }
.ddm-card .ddm-chart-wrap { margin-bottom: 0; }
.ddm-chart-wrap canvas { width: 100% !important; }
.ddm-chart-title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted);
  margin-bottom: 12px;
}


.ddm-table-wrap {
  overflow: auto;
  max-height: 420px;
  margin-bottom: 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.ddm-table-wrap::-webkit-scrollbar { width: 8px; height: 8px; }
.ddm-table-wrap::-webkit-scrollbar-track { background: transparent; }
.ddm-table-wrap::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 4px; }
.ddm-table-wrap::-webkit-scrollbar-thumb:hover { background: var(--surface-border-strong); }

.ddm-stat-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.ddm-stat-card {
  background: var(--surface-veil);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 10px 14px;
  font-family: var(--font-ui);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ddm-stat-card-label {
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.ddm-stat-card-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
}
.ddm-stat-card-key {
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--text-muted);
}
.ddm-stat-card-val {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-bright);
  white-space: nowrap;
}
.ddm-stat-card-val.dd-depth { color: var(--red); }
.ddm-table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  font-family: var(--font-ui); font-size: .82rem;
}
.ddm-table th {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-muted); padding: 8px 10px;
  text-align: left; border-bottom: 1px solid var(--border);
  position: sticky; top: 0; background: var(--panel); z-index: 1;
  cursor: pointer; user-select: none; white-space: nowrap;
}
.ddm-table th:hover { color: var(--text); }
.ddm-table th[title] { cursor: help; }
.ddm-table th.sort-asc::after { content: ' \25B2'; font-size: .82rem; }
.ddm-table th.sort-desc::after { content: ' \25BC'; font-size: .82rem; }
.ddm-table td {
  padding: 6px 10px; border-bottom: 1px solid var(--hover-subtle);
  color: var(--text); white-space: nowrap;
}
.ddm-table tr:hover td { background: var(--surface-veil); }
.ddm-table .dd-depth { color: var(--red); font-weight: 600; }
.ddm-table .dd-recovered { color: var(--green); }
.ddm-table .dd-ongoing { color: var(--amber); font-weight: 600; }
.ddm-table tr.dd-row-ongoing td { background: var(--amber-dim); }
.ddm-table tr.dd-row-ongoing:hover td { background: var(--amber-dim); }


.ddm-peak-badge {
  display: inline-block; padding: 2px 6px; border-radius: 8px;
  font-family: var(--font-ui); font-size: .6rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
}
.ddm-peak-abs { background: var(--amber-dim); color: var(--amber); border: 1px solid rgba(255,184,51,.3); }
.ddm-peak-rel { background: var(--blue-dim); color: var(--blue); border: 1px solid var(--blue-focus); }


.ddm-scatter-controls {
  display: flex; flex-wrap: wrap; gap: 16px 22px; align-items: flex-start;
  padding: 14px 18px; margin-bottom: 12px;
  background: var(--surface-veil); border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.ddm-sc-group { display: flex; flex-direction: column; gap: 6px; min-height: 52px; justify-content: flex-start; }
.ddm-sc-group--display { flex: 1 1 auto; min-width: 200px; }
.ddm-sc-label {
  font-family: var(--font-ui); font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted);
  line-height: 1; height: 14px;
}
.ddm-sc-select {
  padding: 6px 10px; border-radius: var(--radius-sm);
  background: var(--panel, #1a1a2e); border: 1px solid var(--border);
  color: var(--text); font-family: var(--font-ui); font-size: .85rem; line-height: 1.2;
  height: 32px;
  cursor: pointer; transition: border-color var(--ease);
}
.ddm-sc-select option { background: var(--panel, #1a1a2e); color: var(--text); }
.ddm-sc-select:hover { border-color: var(--surface-border-strong); }
.ddm-sc-select:focus { outline: none; border-color: var(--blue); }
.ddm-sc-checks {
  display: flex; flex-wrap: wrap; gap: 8px 16px;
  height: 32px; align-items: center;
}
.ddm-sc-check {
  font-family: var(--font-ui); font-size: .85rem; color: var(--text);
  cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
  user-select: none;
}
.ddm-sc-check input { accent-color: var(--blue); width: 14px; height: 14px; margin: 0; }
.ddm-sc-check:hover { color: var(--text-bright); }


.ddm-scatter-corr {
  font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted);
  padding: 4px 0 8px; letter-spacing: .02em;
}


.ddm-scatter-wrap { position: relative; width: 100%; height: 450px; margin-bottom: 20px; }
.ddm-scatter-catalog { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--border); }


.ddm-stats-toggle-container {
  display: flex; align-items: center; justify-content: center;
  margin: 15px 0; gap: 10px;
}
.ddm-stats-toggle-label {
  font-family: var(--font-ui); color: var(--text-muted); font-size: .82rem;
}
.ddm-stats-toggle-option {
  font-family: var(--font-ui); color: var(--text-muted); cursor: pointer; font-size: .82rem;
}
.ddm-stats-toggle-option.ddm-selected-option {
  color: var(--text-bright); font-weight: bold;
}
.ddm-toggle-switch {
  position: relative; display: inline-block; width: 44px; height: 22px;
}
.ddm-toggle-switch input { opacity: 0; width: 0; height: 0; }
.ddm-toggle-slider {
  position: absolute; cursor: pointer; inset: 0;
  background-color: var(--surface-border); transition: .4s; border-radius: 22px;
}
.ddm-toggle-slider:before {
  position: absolute; content: ""; height: 16px; width: 16px;
  left: 3px; bottom: 3px; background-color: white;
  transition: .4s; border-radius: 50%;
}
.ddm-toggle-switch input:checked + .ddm-toggle-slider { background-color: var(--blue); }
.ddm-toggle-switch input:checked + .ddm-toggle-slider:before { transform: translateX(22px); }


.ddm-ins-metrics {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 2px; margin-bottom: 10px;
}
.ddm-ins-metric { padding: 5px 6px; background: var(--surface-veil); border-radius: 4px; text-align: center; }
.ddm-ins-metric-label { font-family: var(--font-ui); font-size: .6rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); margin-bottom: 2px; }
.ddm-ins-metric-val { font-family: var(--font-ui); font-size: .82rem; font-weight: 700; }


.ddm-ins-summary { margin-top: 16px; margin-bottom: 18px; }
.ddm-ins-summary-title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--text-dim); margin-bottom: 8px;
}
.ddm-ins-summary-tbl { width: 100%; border-collapse: collapse; font-size: .82rem; }
.ddm-ins-summary-tbl td { padding: 5px 0; border-bottom: 1px solid var(--divider-soft); }
.ddm-ins-tbl-lbl { font-family: var(--font-ui); font-weight: 600; color: var(--text-muted); width: 38%; }
.ddm-ins-tbl-val { font-family: var(--font-ui); font-weight: 600; color: var(--text); text-align: right; }


.ddm-ins-sev-tbl { width: 100%; border-collapse: collapse; font-size: .82rem; font-family: var(--font-ui); }
.ddm-ins-sev-tbl thead th {
  padding: 6px 8px; text-align: right;
  color: var(--text-muted); font-weight: 500; font-size: .82rem;
  text-transform: uppercase; letter-spacing: .04em;
  border-bottom: 1px solid var(--divider);
}
.ddm-ins-sev-tbl thead th:first-child { text-align: left; }
.ddm-ins-sev-tbl tbody td {
  padding: 7px 8px; border-bottom: 1px solid var(--divider-soft);
  text-align: right; font-weight: 600; color: var(--text);
}
.ddm-ins-sev-tbl tbody td:first-child {
  text-align: left; color: var(--text-muted);
}


.ddm-yearly-hero {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
  margin-bottom: 16px;
}
.ddm-yearly-hero-item {
  text-align: center; padding: 14px 8px;
  background: var(--surface-veil); border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.ddm-yearly-hero-item .ddm-action-label {
  font-family: var(--font-ui); font-size: .7rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted);
  margin-bottom: 4px;
}
.ddm-yearly-hero-item .ddm-action-value {
  font-family: var(--font-ui); font-size: 1.3rem; font-weight: 700; line-height: 1.2;
}
.ddm-yearly-filters {
  display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px;
  padding: 10px 12px; background: var(--surface-veil);
  border: 1px solid var(--border); border-radius: var(--radius-md);
}
.ddm-yearly-filters .ddm-th-btn {
  padding: 6px 14px; border: 1px solid var(--border);
  background: var(--divider-soft); color: var(--text-bright);
  font-size: .88rem;
}
.ddm-yearly-filters .ddm-th-btn:hover { background: var(--surface-border); color: var(--text-bright); }
.ddm-yearly-filters .ddm-th-btn.active {
  background: var(--pill-active-bg); color: var(--pill-active-color);
  border-color: transparent; box-shadow: 0 1px 4px rgba(0,0,0,.2);
}
.ddm-yearly-custom-row {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 14px;
}


.ci-controls {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 0 12px; border-bottom: 1px solid var(--border);
  margin-bottom: 14px;
}
.ci-ctrl-label {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted);
}
.ci-ctrl-sub {
  font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted);
  margin-left: auto;
}
.ci-status-box {
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: 14px; margin-bottom: 14px;
  text-align: center;
}
.ci-status {
  font-family: var(--font-ui); font-size: 1.1rem; font-weight: 800;
  letter-spacing: .08em;
}
.ci-status-active { color: #ff4444; }
.ci-status-recent { color: #f0a030; }
.ci-status-clear { color: var(--green); }
.ci-status-invalidated { color: var(--text-dim); }
.ci-status-sub {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-muted); margin-top: 4px;
}
.ci-summary {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
  margin-bottom: 16px;
}
.ci-metric {
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 10px 8px;
  text-align: center; display: flex; flex-direction: column; gap: 2px;
}
.ci-metric-val {
  font-family: var(--font-ui); font-size: 1.1rem; font-weight: 700;
  color: var(--text-bright);
}
.ci-metric-lbl {
  font-family: var(--font-ui); font-size: .72rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted);
}
.ci-section-title {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted);
  margin: 16px 0 8px; padding-top: 12px; border-top: 1px solid var(--border);
}
.ci-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-ui); font-size: .82rem;
}
.ci-table th {
  text-align: left; padding: 6px 8px;
  font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: var(--text-muted); font-size: .72rem;
  border-bottom: 1px solid var(--border);
}
.ci-table td {
  padding: 5px 8px; border-bottom: 1px solid var(--hover-subtle);
  color: var(--text);
}
.ci-table-scroll {
  max-height: 340px; overflow-y: auto;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
}
.ci-table-scroll .ci-table th { position: sticky; top: 0; background: var(--bg); z-index: 1; }
.ci-neg { color: var(--red); font-weight: 600; }
.ci-neg-strong { color: #ff3333; font-weight: 700; }
.ci-pos { color: var(--green); font-weight: 600; }
.ci-na { color: var(--text-muted); }
.ci-horizon { font-weight: 600; color: var(--text-bright); }
.ci-row-num { color: var(--text-muted); }
.ci-date { white-space: nowrap; }
.ci-params-info {
  font-family: var(--font-ui); font-size: .72rem; color: var(--text-muted);
  padding: 8px 0; margin-top: 8px;
}


.ddm-ins-supertitle {
  font-family: var(--font-ui);
  font-size: 1.05rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--text-bright);
  padding: 18px 18px 12px;
  border-bottom: 2px solid var(--border);
  margin: 24px 0 0;
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,.02), transparent);
}
.ddm-ins-supertitle:first-child { margin-top: 0; }
.ddm-ins-supertitle::before {
  content: '';
  display: block;
  width: 32px;
  height: 3px;
  background: var(--blue);
  position: absolute;
  bottom: -2px;
  left: 18px;
}

.st-ai-content .ddm-ins-supertitle { padding-left: 14px; padding-right: 14px; }
.st-ai-content .ddm-ins-supertitle::before { left: 14px; }


.dd-fas-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 4px;
}

.dd-fas-card {
  position: relative;
  background: var(--hover-subtle);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px 24px 18px;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
}
.dd-fas-card::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--fas-tone, var(--blue));
  opacity: .85;
}


.dd-fas-head {
  margin-bottom: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}
.dd-fas-depth {
  font-size: 1.55rem; font-weight: 800; line-height: 1;
  letter-spacing: -0.02em; color: var(--text-bright);
  font-variant-numeric: tabular-nums;
  margin-bottom: 8px;
}
.dd-fas-q {
  font-size: 1.02rem; font-weight: 600; line-height: 1.4;
  color: var(--text-soft);
}


.dd-fas-sub {
  font-size: 0.76rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.07em;
  color: var(--text-dim);
  margin-bottom: 16px;
}


.dd-fas-hero {
  font-size: 3rem; font-weight: 800; line-height: 0.95;
  letter-spacing: -0.04em; font-variant-numeric: tabular-nums;
  margin-bottom: 6px;
}
.dd-fas-hero.dd-up { color: var(--green); }
.dd-fas-hero.dd-dn { color: var(--red); }
.dd-fas-hero.dd-na { color: var(--text-muted); }
.dd-fas-hero-lbl {
  font-size: 0.82rem; color: var(--text-dim);
  line-height: 1.35;
}


.dd-fas-fwd {
  display: flex; flex-direction: column; gap: 6px;
  margin-top: 18px; padding-top: 16px;
  border-top: 1px solid var(--border);
}
.dd-fas-fwd-row {
  display: grid;
  grid-template-columns: 84px repeat(5, minmax(0, 1fr));
  gap: 5px; align-items: center;
}
.dd-fas-fwd-lbl {
  font-size: 0.78rem; font-weight: 600; color: var(--text-dim);
  white-space: nowrap;
}
.dd-fas-fwd-hdr .dd-fas-fwd-lbl { color: var(--text-muted); }
.dd-fas-fwd-hdr .dd-fas-fwd-h {
  text-align: center; font-size: 0.7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text-muted);
}
.dd-fas-fwd-cell {
  text-align: center;
  font-size: 0.9rem; font-weight: 700;
  padding: 7px 4px; border-radius: var(--radius-sm);
  font-variant-numeric: tabular-nums;
  background: rgba(255,255,255,.03);
  color: var(--text-muted);
}
.dd-fas-fwd-cell.dd-fwd-pos {
  color: var(--green);
  background: color-mix(in srgb, var(--green) calc(var(--fwd-a, .1) * 100%), transparent);
}
.dd-fas-fwd-cell.dd-fwd-neg {
  color: var(--red);
  background: color-mix(in srgb, var(--red) calc(var(--fwd-a, .1) * 100%), transparent);
}
.dd-fas-fwd-cell.dd-fwd-na { color: var(--text-muted); background: rgba(255,255,255,.02); }


.dd-eq-ctrl-lbl {
  font-size: 0.74rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text-muted); margin-right: 8px; align-self: center;
}
.dd-eq-stats {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px;
  margin: 2px 0 12px;
  font-size: 0.86rem; color: var(--text-dim);
}
.dd-eq-leg { display: inline-flex; align-items: center; gap: 7px; }
.dd-eq-leg i { width: 14px; height: 3px; border-radius: 2px; display: inline-block; }
.dd-eq-leg b { font-variant-numeric: tabular-nums; color: var(--text-bright); }
.dd-eq-note { color: var(--text-muted); }
.dd-bt-wrap { width: 100%; }

stm-* vive in statistics.css;
   le tabelle ddm-* in drawdown.css. Qui SOLO: spinner, tweaks tabelle del
   report, KPI/insight (ddm-ins-*), card "Comprare sui cali" (dd-fas-*),
   backtest modal (dd-bt-*), filtri annate (ddm-yearly-*).
   Reso adattivo al tema: i fondi card usano i token (var(--card)/var(--panel))
   invece dell'#fff hardcoded del mockup (theme-light.css fa il resto su light).
   Tutto è prefissato .ws-page / #ddrRoot per non sporcare il resto dell'app.
   ═══════════════════════════════════════════════════════════════════ */



.ws-spinner { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; min-height:70vh; color:var(--text-dim); font-family:var(--font-ui); }
.ws-spinner-ring { width:38px; height:38px; border:3px solid var(--border-hi); border-top-color:#a78bfa; border-radius:50%; animation:wsSpin .8s linear infinite; }
@keyframes wsSpin { to { transform: rotate(360deg); } }
.ws-page .ddm-table-wrap { max-height: 460px; }
.ws-page .ddm-scatter-wrap { height: 440px; }
.ws-tool-sample .ws-win-emoji { margin-right: 5px; }


.ws-page .ddm-ins-prose { font-family:var(--font-ui); font-size:.98rem; line-height:1.6; color:var(--text); margin:0 0 11px; }
.ws-page .ddm-ins-prose:last-child { margin-bottom:0; }


.ws-page .ddm-ins-metrics { gap:10px; margin:0 0 16px; }
.ws-page .ddm-ins-metric { padding:12px 12px; background:var(--hover-subtle); border:1px solid var(--border); border-radius:var(--radius-md); }
.ws-page .ddm-ins-metric-label { font-family:var(--font-ui); font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.07em; color:var(--text-muted); margin-bottom:6px; }
.ws-page .ddm-ins-metric-val { font-family:var(--font-ui); font-size:1.3rem; font-weight:700; line-height:1.1; color:var(--text-bright); font-variant-numeric:tabular-nums; }


.ws-page .ddm-ins-summary { margin:18px 0; background:var(--hover-subtle); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.ws-page .dd-rec-tbl { width:100%; border-collapse:collapse; font-family:var(--font-ui); font-size:.95rem; }
.ws-page .dd-rec-tbl th { text-align:left; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--text-muted); padding:14px 18px 9px; border-bottom:1px solid var(--border); }
.ws-page .dd-rec-tbl td { padding:11px 18px; border-bottom:1px solid var(--border); color:var(--text); }
.ws-page .dd-rec-tbl tbody tr:last-child td { border-bottom:none; }
.ws-page .dd-rec-tbl tbody tr:hover td { background:var(--hover-subtle); }
.ws-page .dd-rec-tbl td:first-child, .ws-page .dd-rec-tbl th:first-child { font-weight:700; color:var(--text-bright); }
.ws-page .dd-rec-tbl th:nth-child(2), .ws-page .dd-rec-tbl td:nth-child(2),
.ws-page .dd-rec-tbl th:nth-child(3), .ws-page .dd-rec-tbl td:nth-child(3),
.ws-page .dd-rec-tbl th:nth-child(4), .ws-page .dd-rec-tbl td:nth-child(4) { text-align:right; }
.ws-page .dd-rec-tbl td:nth-child(2), .ws-page .dd-rec-tbl td:nth-child(3), .ws-page .dd-rec-tbl td:nth-child(4) { font-variant-numeric:tabular-nums; }
.ws-page .dd-rec-tbl th:last-child, .ws-page .dd-rec-tbl td:last-child { text-align:right; font-weight:600; color:var(--text); }


.st-ai-content .ddm-ins-summary { margin:16px 0; background:var(--hover-subtle); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.st-ai-content .dd-rec-tbl { width:100%; border-collapse:collapse; font-family:var(--font-ui); font-size:.95rem; }
.st-ai-content .dd-rec-tbl th { text-align:left; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--text-muted); padding:14px 18px 9px; border-bottom:1px solid var(--border); }
.st-ai-content .dd-rec-tbl td { padding:11px 18px; border-bottom:1px solid var(--border); color:var(--text); }
.st-ai-content .dd-rec-tbl tbody tr:last-child td { border-bottom:none; }
.st-ai-content .dd-rec-tbl tbody tr:hover td { background:var(--hover-subtle); }
.st-ai-content .dd-rec-tbl td:first-child, .st-ai-content .dd-rec-tbl th:first-child { font-weight:700; color:var(--text-bright); }
.st-ai-content .dd-rec-tbl th:nth-child(n+2), .st-ai-content .dd-rec-tbl td:nth-child(n+2) { text-align:right; }
.st-ai-content .dd-rec-tbl td:nth-child(n+2) { font-variant-numeric:tabular-nums; }
.st-ai-content .dd-rec-tbl td:last-child { font-weight:600; }


.ws-page .ws-ov-head-center { text-align:center; }
.ws-page .ws-ov-head-center .ws-ov-titlerow { justify-content:center; }
.ws-page .ws-ov-market { font-family:var(--font-ui); font-size:1.1rem; font-weight:600; color:var(--text-dim); margin-top:10px; letter-spacing:.01em; }
.ws-page .ws-ov-market b { color:var(--text-bright); font-weight:700; }


.ws-page .ws-substrip { justify-content: center; }


.ws-page .dd-fas-depth-row { display:flex; align-items:center; gap:11px; margin-bottom:8px; }
.ws-page .dd-fas-depth-lbl {
  font-size:1.55rem; font-weight:800; line-height:1; letter-spacing:-0.02em; color:var(--text-bright);
}
.ws-page .dd-fas-depth-sel {
  font-size:1.2rem; font-weight:800; height:auto; padding:5px 12px; letter-spacing:-0.02em;
  font-variant-numeric:tabular-nums;
  background: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 18%, var(--panel));
  border-color: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 50%, var(--border));
  color: var(--text-bright);
}
.ws-page .dd-fas-depth-sel:hover,
.ws-page .dd-fas-depth-sel:focus { outline:none; border-color: var(--pill-active-bg, #d9b66a); }


.ws-page .ws-substrip .ddm-sc-select {
  background: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 16%, var(--panel));
  border-color: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 45%, var(--border));
  color: var(--text-bright); font-weight: 600;
}
.ws-page .ws-substrip .ddm-sc-select:hover { border-color: var(--pill-active-bg, #d9b66a); }
.ws-page .ws-substrip .ddm-sc-select:focus { outline: none; border-color: var(--pill-active-bg, #d9b66a); }


.ws-page .dd-bt-open-row { display:flex; justify-content:center; margin-top:18px; }
.ws-page .dd-bt-open-btn {
  display:inline-flex; align-items:center; gap:9px;
  padding:11px 22px; border-radius:var(--radius-md); cursor:pointer;
  font-family:var(--font-ui); font-size:.96rem; font-weight:600; color:var(--text-bright);
  background: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 16%, var(--panel));
  border:1px solid color-mix(in srgb, var(--pill-active-bg, #d9b66a) 45%, var(--border));
  transition: border-color var(--ease), background var(--ease);
}
.ws-page .dd-bt-open-btn:hover {
  border-color: var(--pill-active-bg, #d9b66a);
  background: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 26%, var(--panel));
}


#wsChartModal .dd-bt-modal { display:flex; flex-direction:column; width:100%; min-width:0; }
#wsChartModal .dd-bt-modal-ctrls { display:flex; align-items:center; gap:8px 16px; flex-wrap:wrap; margin-bottom:14px; }
#wsChartModal .dd-bt-modal .dd-eq-stats { margin-bottom:10px; }
#wsChartModal .dd-bt-modal .dd-bt-wrap { flex:0 0 auto; }


.ws-page #ddYearlyTableWrap { margin-top:16px; }
.ws-page #ddYearlyTableWrap[hidden] { display:none; }


.ws-page .ddm-yearly-hero-item {
  background:var(--card); border:1px solid var(--border); border-radius:var(--radius-md);
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}


.ws-page .ddm-yearly-filters { background:transparent; border:none; padding:0; gap:8px; }
.ws-page .ddm-yearly-filters .ddm-th-btn {
  padding:7px 16px; border-radius:var(--radius-sm);
  border:1px solid var(--border); background:var(--card); color:var(--text-dim);
  font-family:var(--font-ui); font-size:.9rem; font-weight:600;
  transition:border-color var(--ease), background var(--ease), color var(--ease);
}
.ws-page .ddm-yearly-filters .ddm-th-btn:hover {
  border-color:var(--surface-border-strong); background:var(--card); color:var(--text-bright);
}
.ws-page .ddm-yearly-filters .ddm-th-btn.active {
  background: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 16%, var(--card));
  border-color: color-mix(in srgb, var(--pill-active-bg, #d9b66a) 50%, var(--border));
  color:var(--text-bright); box-shadow:none;
}


.ws-page .ws-chart-card,
.ws-page .ddm-ins-metric,
.ws-page .ddm-ins-summary,
.ws-page .dd-fas-card,
.ws-page .ddm-stat-card,
.ws-page .ddm-yearly-hero-item,
.ws-page .ddm-table-wrap,
.ws-page .ddm-table,
.ws-page .ddm-table th { background:var(--card); }


.ws-page #ddCatalogWrap .ddm-table,
.ws-page #ddCatalogWrap .ddm-table th,
.ws-page #ddCatalogWrap .ddm-table td { font-size: calc(0.82rem + 2px); }
.ws-page #ddCatalogWrap .ddm-peak-badge { font-size: calc(0.6rem + 2px); }





.scr-overlay {
  position: fixed; inset: 0;
  background: var(--overlay-bg);
  z-index: 200; display: none;
  align-items: center; justify-content: center;
  backdrop-filter: blur(var(--overlay-blur));
}
.scr-overlay.open { display: flex; animation: scrFadeIn .15s ease; }

@keyframes scrFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}


.scr-panel {
  width: 100vw; max-width: 100vw;
  height: 100vh; max-height: 100vh;
  background: var(--panel);
  border: none;
  border-radius: 0;
  display: flex; flex-direction: row;
  box-shadow: var(--overlay-shadow);
  overflow: hidden;
  animation: scrSlideIn .2s ease;
}
@keyframes scrSlideIn {
  from { opacity: 0; transform: translateY(12px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}


.scr-sidebar {
  width: 230px; min-width: 230px;
  background: var(--bg);
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.scr-sidebar-header {
  padding: 16px 18px 12px;
  font-family: var(--font-ui);
  font-size: .88rem;
  font-weight: 600;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .04em;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.scr-sidebar-list {
  flex: 1; overflow-y: auto;
  padding: 8px 10px;
}
.scr-group-title {
  padding: 12px 10px 5px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.scr-menu-item {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  border: none; background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .88rem;
  font-weight: 450;
  cursor: pointer;
  width: 100%;
  text-align: left;
  transition: background var(--ease), color var(--ease);
}
.scr-menu-item:hover {
  background: var(--hover-medium);
  color: var(--text);
}
.scr-menu-item.active {
  background: var(--blue-dim);
  color: var(--blue);
  font-weight: 600;
}
.scr-menu-icon {
  width: 18px; height: 18px;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.scr-menu-icon svg {
  width: 16px; height: 16px;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  opacity: .5;
}
.scr-menu-item.active .scr-menu-icon svg { opacity: 1; }
.scr-menu-item:hover .scr-menu-icon svg { opacity: .8; }


.scr-menu-icon .scr-sparkle-anim {
  fill: #f3e8ff;
  stroke: none;
  opacity: 1;
}


@keyframes scr-ai-gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
@keyframes scr-ai-glow { 0%,100% { box-shadow: 0 0 8px rgba(139,92,246,.35), 0 0 16px rgba(109,40,217,.12); } 50% { box-shadow: 0 0 14px rgba(168,85,247,.5), 0 0 28px rgba(139,92,246,.2); } }
@keyframes scr-ai-sheen { 0% { left: -100%; opacity: 0; } 15% { opacity: 1; } 45% { left: 140%; opacity: 0; } 100% { left: 140%; opacity: 0; } }

.scr-land-card-ai {
  background: linear-gradient(135deg, #3b0764, #6d28d9, #a855f7, #7c3aed, #3b0764) !important;
  background-size: 300% 300% !important;
  animation: scr-ai-gradient 5s ease infinite, scr-ai-glow 3s ease-in-out infinite;
  border: 1px solid rgba(168,85,247,.45) !important;
  position: relative;
  overflow: hidden;
}
.scr-land-card-ai:hover {
  border-color: rgba(216,180,254,.7) !important;
  transform: translateY(-2px);
}
.scr-land-card-ai::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 55%; height: 100%;
  background: linear-gradient(120deg, transparent, var(--surface-border-hi), transparent);
  animation: scr-ai-sheen 3.5s ease infinite;
  pointer-events: none;
}
.scr-land-card-ai .scr-land-card-title {
  color: #f3e8ff;
  font-weight: 800;
}
.scr-land-card-ai .scr-land-card-desc {
  color: rgba(233,213,255,.7);
}

@keyframes scr-sparkle-dance {
  0%   { transform: rotate(0deg) scale(1);    filter: drop-shadow(0 0 2px rgba(216,180,254,.6)); }
  25%  { transform: rotate(18deg) scale(1.3); filter: drop-shadow(0 0 7px rgba(216,180,254,1)); }
  50%  { transform: rotate(0deg) scale(1);    filter: drop-shadow(0 0 2px rgba(216,180,254,.6)); }
  75%  { transform: rotate(-18deg) scale(1.2);filter: drop-shadow(0 0 6px rgba(216,180,254,.95)); }
  100% { transform: rotate(0deg) scale(1);    filter: drop-shadow(0 0 2px rgba(216,180,254,.6)); }
}
.scr-sparkle-anim {
  animation: scr-sparkle-dance 5s ease-in-out infinite;
  transform-origin: center;
}

.scr-land-icon-ai {
  background: rgba(168,85,247,.25) !important;
  border-color: rgba(168,85,247,.4) !important;
}
.scr-land-icon-ai svg {
  fill: #f3e8ff !important;
  stroke: none !important;
}


.scr-menu-overview {
  margin-bottom: 6px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}


.scr-content {
  flex: 1; display: flex; flex-direction: column;
  overflow: hidden;
}


.scr-header {
  padding: 16px 24px 14px;
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 14px;
  flex-shrink: 0;
}
.scr-header-titles {
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0;
}
.scr-header h3 {
  font-family: var(--font-ui);
  font-size: 1.15rem; font-weight: 700;
  color: var(--text-bright); white-space: nowrap;
  margin: 0;
}
.scr-header-subtitle {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.scr-header-count {
  font-family: var(--font-ui);
  font-size: .84rem;
  color: var(--text-muted);
  background: var(--surface-raised);
  padding: 3px 10px;
  border-radius: var(--radius-sm);
}
.scr-header-controls {
  display: flex; align-items: center; gap: 10px;
  margin-left: auto;
}
.scr-search {
  padding: 7px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .9rem;
  outline: none;
  width: 200px;
  transition: border-color var(--ease);
}
.scr-search:focus { border-color: var(--blue); }
.scr-search::placeholder { color: var(--text-muted); }
.scr-back {
  background: none; border: none; color: var(--text-dim); cursor: pointer;
  font-size: 1.15rem; width: 30px; height: 30px;
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  transition: background var(--ease), color var(--ease);
  flex-shrink: 0;
}
.scr-back:hover { background: var(--hover-medium); color: var(--text); }
.scr-close {
  background: none; border: none; color: var(--text-dim); cursor: pointer;
  font-size: 1.2rem; width: 26px; height: 26px;
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  transition: background var(--ease), color var(--ease);
}
.scr-close:hover { background: var(--hover-medium); color: var(--text); }


.scr-table-wrap {
  flex: 1; overflow: auto;
  padding: 0;
}
.scr-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-ui);
  font-size: 1rem;
}
.scr-table thead { position: sticky; top: 0; z-index: 2; }
.scr-table th {
  padding: 10px 14px;
  background: var(--bg);
  color: var(--text-muted);
  font-weight: 600;
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-align: left;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: color var(--ease);
}
.scr-table th:hover { color: var(--text); }
.scr-table th.scr-sort-asc::after { content: ' \25B2'; font-size: .82rem; }
.scr-table th.scr-sort-desc::after { content: ' \25BC'; font-size: .82rem; }
.scr-table th.scr-col-right,
.scr-table td.scr-col-right { text-align: right; }

.scr-table td {
  padding: 9px 14px;
  border-bottom: 1px solid var(--hover-subtle);
  color: var(--text);
  white-space: nowrap;
}
.scr-table tbody tr {
  transition: background .1s;
  cursor: pointer;
}
.scr-table tbody tr:hover { background: var(--hover-subtle); }


.scr-sym-wrap { display: inline-flex; align-items: center; gap: 10px; }
.scr-row-logo.wl-logo { width: 24px; height: 24px; }
.scr-row-logo.wl-logo img { width: 24px; height: 24px; }
.scr-row-logo.wl-logo .wl-logo-fb { width: 24px; height: 24px; font-size: .68rem; }
.scr-sym {
  font-family: var(--font-ui);
  font-weight: 600;
  color: var(--text-bright);
  font-size: 1rem;
}
.scr-name {
  font-size: .92rem;
  color: var(--text-muted);
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
}


.scr-positive { color: var(--green); }
.scr-negative { color: var(--red); }


.scr-loading {
  display: flex; align-items: center; justify-content: center;
  flex: 1;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .95rem;
  gap: 10px;
}
.scr-loading-spinner {
  width: 20px; height: 20px;
  border: 2px solid var(--border-hi);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: scrSpin .6s linear infinite;
}
@keyframes scrSpin {
  to { transform: rotate(360deg); }
}
.scr-empty {
  display: flex; align-items: center; justify-content: center;
  flex: 1;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .95rem;
}



.scr-landing {
  padding: 32px 36px 48px;
  overflow-y: auto;
  flex: 1;
}


.scr-land-section {
  margin-bottom: 40px;
}
.scr-land-section:last-child { margin-bottom: 0; }

.scr-land-group-header {
  margin-bottom: 16px;
}
.scr-land-group-title {
  font-family: var(--font-ui);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-bright);
  margin: 0;
  letter-spacing: -.01em;
}
.scr-land-group-desc {
  font-family: var(--font-ui);
  font-size: .88rem;
  color: var(--text-muted);
  margin-top: 4px;
  display: block;
}


.scr-land-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}


.scr-land-card {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 22px;
  background: var(--surface-veil);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  cursor: pointer;
  text-align: left;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
  font-family: var(--font-ui);
}
.scr-land-card:hover {
  border-color: var(--surface-border-hi);
  background: var(--hover-subtle);
  box-shadow: 0 4px 24px rgba(0, 0, 0, .2);
}
.scr-land-card:active {
  background: var(--surface-raised);
}


.scr-land-card-icon {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--blue-dim);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background .2s ease;
}
.scr-land-card:hover .scr-land-card-icon {
  background: var(--blue-med);
}
.scr-land-card-icon svg {
  width: 20px; height: 20px;
  stroke: var(--blue);
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}


.scr-land-card-body {
  flex: 1;
  min-width: 0;
  padding-top: 2px;
}
.scr-land-card-title {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-bright);
  margin-bottom: 5px;
  letter-spacing: -.005em;
}
.scr-land-card-desc {
  font-size: .84rem;
  color: var(--text-dim);
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}


.scr-land-card--custom .scr-land-card-icon svg {
  stroke: var(--purple);
}



.scr-threshold {
  display: flex; align-items: center; gap: 6px;
  flex-shrink: 0; height: 34px; padding: 0 4px;
}
.scr-thr-label {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  color: var(--text-dim); white-space: nowrap;
}
.scr-thr-btn {
  width: 24px; height: 24px;
  border: 1px solid var(--border); border-radius: 4px;
  background: none; color: var(--text-dim);
  font-size: .9rem; font-weight: 600;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ease); flex-shrink: 0;
}
.scr-thr-btn:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-dim); }
.scr-thr-input {
  width: 80px; height: 4px;
  -webkit-appearance: none; appearance: none;
  background: var(--border); border-radius: 2px;
  outline: none; cursor: pointer;
}
.scr-thr-input::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--blue); border: 2px solid var(--panel);
  cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.3);
}
.scr-thr-input::-moz-range-thumb {
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--blue); border: 2px solid var(--panel); cursor: pointer;
}
.scr-thr-value {
  font-family: var(--font-ui); font-size: .85rem; font-weight: 600;
  color: var(--blue); white-space: nowrap;
  min-width: 40px; text-align: center;
}



.scr-filter-bar {
  display: flex; flex-direction: column;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.scr-filter-row {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 20px;
  overflow-x: auto;
  min-height: 50px;
}
.scr-active-filters {
  display: flex; align-items: center; gap: 6px;
  padding: 0 20px 10px;
  overflow-x: auto;
}
.scr-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 6px 3px 10px;
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  color: var(--text-bright);
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  white-space: nowrap; flex-shrink: 0;
}
.scr-tag-x {
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  border: none; background: none; border-radius: 4px;
  color: var(--text-muted); cursor: pointer;
  font-size: .85rem; line-height: 1;
  transition: background var(--ease), color var(--ease);
}
.scr-tag-x:hover { background: var(--red-dim); color: var(--red); }


.scr-qt-tabs {
  display: flex; gap: 2px;
  background: var(--divider-soft);
  border-radius: var(--radius-sm);
  padding: 2px;
  flex-shrink: 0;
}
.scr-qt-tab {
  padding: 5px 14px;
  border: none; border-radius: 4px;
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem; font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
}
.scr-qt-tab:hover { color: var(--text); }
.scr-qt-tab.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  font-weight: 600;
}


.scr-primary-filter {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui); font-size: .84rem; font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap; flex-shrink: 0;
  height: 34px;
}
.scr-primary-filter:hover {
  border-color: var(--surface-border-hi);
  background: var(--hover-subtle);
  color: var(--text);
}
.scr-primary-filter.scr-pf-active {
  border-color: var(--blue-dim);
  background: var(--blue-dim);
  color: var(--text-bright);
}
.scr-primary-filter.scr-pf-active:hover {
  border-color: var(--blue);
  background: var(--blue-dim);
}
.scr-pf-icon {
  width: 15px; height: 15px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.scr-pf-icon svg {
  width: 14px; height: 14px;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  opacity: .5;
}
.scr-pf-active .scr-pf-icon svg { opacity: .8; stroke: var(--blue); }
.scr-pf-label { color: inherit; }
.scr-pf-value {
  font-weight: 600;
  color: var(--blue);
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.scr-pf-arrow {
  font-size: .82rem;
  opacity: .4;
  margin-left: 2px;
}


.scr-filter-sep {
  width: 1px; height: 20px;
  background: var(--border);
  flex-shrink: 0;
}


.scr-chip {
  display: flex; align-items: center;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-hi);
  background: var(--hover-subtle);
  overflow: hidden; flex-shrink: 0;
  transition: border-color var(--ease);
  cursor: pointer; height: 32px;
}
.scr-chip:hover { border-color: var(--surface-border-hi); }

.scr-chip-label {
  padding: 0 10px;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  color: var(--text-dim); white-space: nowrap;
  border-right: 1px solid var(--border);
  height: 100%; display: flex; align-items: center;
}
.scr-chip-value {
  padding: 0 10px;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  color: var(--text-bright); white-space: nowrap;
  display: flex; align-items: center; gap: 5px;
  height: 100%;
  transition: background var(--ease);
}
.scr-chip-value:hover { background: var(--hover-subtle); }
.scr-chip-count {
  font-family: var(--font-ui); font-size: .82rem;
  background: var(--blue-dim); color: var(--blue);
  padding: 1px 6px; border-radius: 4px; font-weight: 600;
}
.scr-chip-remove {
  width: 30px; height: 100%;
  display: flex; align-items: center; justify-content: center;
  border: none; background: none;
  color: var(--text-muted); cursor: pointer; font-size: .9rem;
  border-left: 1px solid var(--border);
  transition: background var(--ease), color var(--ease);
}
.scr-chip-remove:hover { background: var(--red-dim); color: var(--red); }


.scr-chip.scr-chip--sort { border-color: var(--purple-dim); }
.scr-chip--sort .scr-chip-label { color: var(--purple); border-color: var(--purple-dim); }
.scr-chip--sort .scr-chip-value { color: var(--purple); }


.scr-filter-add {
  display: flex; align-items: center; gap: 5px;
  padding: 6px 12px;
  border: 1px dashed var(--border-hi);
  border-radius: var(--radius-sm);
  background: none;
  color: var(--text-dim);
  font-family: var(--font-ui); font-size: .84rem; font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap; flex-shrink: 0;
}
.scr-filter-add:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-dim); }
.scr-filter-add svg {
  width: 14px; height: 14px;
  stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round;
}


.scr-filter-clear {
  display: flex; align-items: center; gap: 4px;
  padding: 5px 10px;
  border: none; background: none;
  color: var(--text-muted);
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  cursor: pointer; flex-shrink: 0; white-space: nowrap;
  margin-left: auto;
  transition: color var(--ease);
}
.scr-filter-clear:hover { color: var(--red); }
.scr-filter-clear svg {
  width: 13px; height: 13px;
  stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round;
}



.scr-filter-dropdown {
  position: fixed; z-index: 310;
  min-width: 280px; max-width: 420px;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 40px rgba(0,0,0,.5);
  overflow: hidden;
  animation: scrDropIn .12s ease;
}
@keyframes scrDropIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.scr-dd-header {
  display: flex; align-items: center; padding: 12px 14px;
  border-bottom: 1px solid var(--border); gap: 8px;
}
.scr-dd-title { font-size: .88rem; font-weight: 600; color: var(--text-bright); flex: 1; }
.scr-dd-close {
  width: 22px; height: 22px; border: none; background: none;
  color: var(--text-muted); cursor: pointer; font-size: .9rem;
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
}
.scr-dd-close:hover { background: var(--hover-medium); color: var(--text); }

.scr-dd-search { padding: 9px 14px; border-bottom: 1px solid var(--border); }
.scr-dd-search input {
  width: 100%; padding: 7px 10px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--panel); color: var(--text);
  font-family: var(--font-ui); font-size: .85rem; outline: none;
}
.scr-dd-search input:focus { border-color: var(--blue); }
.scr-dd-search input::placeholder { color: var(--text-muted); }


.scr-dd-list { max-height: 280px; overflow-y: auto; padding: 6px 0; }
.scr-dd-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px; cursor: pointer;
  transition: background .1s; font-size: .88rem; color: var(--text);
}
.scr-dd-item:hover { background: var(--hover-subtle); }

.scr-dd-check {
  width: 18px; height: 18px;
  border: 1.5px solid var(--border-hi); border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: all var(--ease);
}
.scr-dd-item.selected .scr-dd-check {
  background: var(--blue); border-color: var(--blue);
}
.scr-dd-item.selected .scr-dd-check::after {
  content: ''; width: 10px; height: 6px;
  border-left: 2px solid #fff; border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}
.scr-dd-item-label { flex: 1; }
.scr-dd-item-count {
  font-family: var(--font-ui); font-size: .82rem; color: var(--text-muted);
}
.scr-dd-item-flag { font-size: 1.05rem; width: 20px; text-align: center; }

.scr-dd-section {
  padding: 10px 14px 4px;
  font-size: .82rem; font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .05em;
}


.scr-dd-region {
  padding: 12px 14px 4px;
  font-size: .82rem; font-weight: 700;
  color: var(--accent, var(--blue));
  text-transform: uppercase; letter-spacing: .08em;
  border-top: 1px solid var(--surface-raised);
  margin-top: 4px;
}
.scr-dd-region:first-child { border-top: none; margin-top: 0; }
.scr-dd-country {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 14px; cursor: pointer;
  font-size: .88rem; font-weight: 600; color: var(--text);
}
.scr-dd-country:hover { background: rgba(255,255,255, var(--hover-subtle, .05)); }
.scr-dd-country .scr-dd-check { border-color: var(--text-dim); }
.scr-dd-country.selected .scr-dd-check { background: var(--blue); border-color: var(--blue); }
.scr-dd-country.partial .scr-dd-check {
  background: linear-gradient(135deg, var(--blue) 50%, transparent 50%);
  border-color: var(--blue);
}
.scr-dd-exchange {
  padding-left: 32px;
  font-size: .84rem;
}
.scr-dd-exchange .scr-dd-item-label { color: var(--text-dim); }


.scr-dd-range { padding: 16px 18px 14px; }
.scr-dd-range-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.scr-dd-range-label { font-size: .82rem; color: var(--text-dim); width: 40px; flex-shrink: 0; }
.scr-dd-range-input {
  flex: 1; padding: 7px 10px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--panel); color: var(--text);
  font-family: var(--font-ui); font-size: .85rem;
  outline: none; text-align: right;
}
.scr-dd-range-input:focus { border-color: var(--blue); }
.scr-dd-range-input::placeholder { color: var(--text-muted); }


.scr-dd-presets { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 12px; }
.scr-dd-preset {
  padding: 5px 11px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: none; color: var(--text-dim);
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  cursor: pointer; transition: all var(--ease);
}
.scr-dd-preset:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-dim); }
.scr-dd-preset.active { border-color: var(--blue); color: var(--blue); background: var(--blue-dim); }


.scr-dd-pill {
  padding: 6px 14px;
  border: 1px solid var(--border); border-radius: 50px;
  background: none; color: var(--text-dim);
  font-family: var(--font-ui); font-size: .84rem; font-weight: 500;
  cursor: pointer; transition: all var(--ease);
}
.scr-dd-pill:hover { border-color: var(--surface-border-hi); color: var(--text); }
.scr-dd-pill.active {
  background: var(--pill-active-bg); color: var(--pill-active-color);
  border-color: var(--pill-active-bg); font-weight: 600;
}


.scr-dd-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border-top: 1px solid var(--border); gap: 8px;
}
.scr-dd-reset {
  padding: 6px 12px; border: none; background: none;
  color: var(--text-muted); font-family: var(--font-ui);
  font-size: .82rem; font-weight: 500; cursor: pointer;
}
.scr-dd-reset:hover { color: var(--text); }
.scr-dd-apply {
  padding: 7px 20px; border: none;
  border-radius: var(--radius-sm);
  background: var(--blue); color: #fff;
  font-family: var(--font-ui); font-size: .85rem; font-weight: 600;
  cursor: pointer; transition: background var(--ease);
}
.scr-dd-apply:hover { background: var(--blue-hover); }


.scr-dd-categories {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 6px; padding: 12px 14px;
}
.scr-dd-cat-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: var(--radius-sm);
  cursor: pointer; transition: background .1s;
}
.scr-dd-cat-item:hover { background: var(--hover-subtle); }
.scr-dd-cat-icon {
  width: 32px; height: 32px; border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.scr-dd-cat-icon svg {
  width: 16px; height: 16px;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.scr-dd-cat-icon.blue   { background: var(--blue-dim);   color: var(--blue); }
.scr-dd-cat-icon.purple { background: var(--purple-dim); color: var(--purple); }
.scr-dd-cat-icon.green  { background: var(--green-dim);  color: var(--green); }
.scr-dd-cat-icon.amber  { background: var(--amber-dim);  color: var(--amber); }
.scr-dd-cat-icon.red    { background: var(--red-dim);    color: var(--red); }
.scr-dd-cat-icon.dim    { background: var(--surface-raised); color: var(--text-dim); }
.scr-dd-cat-label { font-size: .85rem; font-weight: 500; color: var(--text); }



.scr-status {
  display: flex; align-items: center;
  padding: 8px 20px;
  border-top: 1px solid var(--border);
  gap: 16px; flex-shrink: 0;
}
.scr-status-item {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-muted); display: flex; align-items: center; gap: 5px;
}
.scr-status-item strong {
  font-family: var(--font-ui); font-weight: 600; color: var(--text-dim);
}
.scr-status-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--green);
}
.scr-status-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.scr-status-page { display: flex; align-items: center; gap: 4px; }
.scr-status-page button {
  width: 24px; height: 24px;
  border: 1px solid var(--border); border-radius: 4px;
  background: none; color: var(--text-muted); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: .82rem; transition: all var(--ease);
}
.scr-status-page button:hover { border-color: var(--blue); color: var(--blue); }
.scr-status-page button[disabled] { opacity: .3; pointer-events: none; }



.bsc-overlay {
  position: fixed; inset: 0; z-index: 10050;
  display: none;
  background: var(--overlay-bg);
}
.bsc-overlay.open { display: flex; }

.bsc-panel {
  width: 100vw; height: 100vh;
  background: var(--panel);
  display: flex; flex-direction: row;
  overflow: hidden;
}


.bsc-filters {
  width: 280px; min-width: 280px;
  border-right: 1px solid var(--border);
  background: var(--bg);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.bsc-f-scroll { flex: 1; overflow-y: auto; padding: 18px 16px 14px; display: flex; flex-direction: column; gap: 20px; }
.bsc-f-title {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-ui); font-size: .7rem; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase;
  color: var(--text-muted); margin-bottom: 10px;
}
.bsc-f-title svg { width: 13px; height: 13px; stroke: var(--text-muted); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.bsc-f-seg { display: flex; background: var(--divider-soft, var(--card)); border-radius: var(--radius-sm, 8px); padding: 3px; gap: 2px; }
.bsc-f-seg button {
  flex: 1; border: none; background: none; color: var(--text-dim);
  font-family: var(--font-ui); font-size: .8rem; font-weight: 600;
  padding: 8px 4px; border-radius: 5px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 5px;
  transition: background var(--ease, .15s), color var(--ease, .15s);
}
.bsc-f-seg button svg { width: 11px; height: 11px; stroke: currentColor; fill: none; stroke-width: 2.4; stroke-linecap: round; }
.bsc-f-seg button:hover { color: var(--text); }
.bsc-f-seg button.active.up { background: var(--green-med, var(--green-dim)); color: var(--green); }
.bsc-f-seg button.active.down { background: var(--red-med, var(--red-dim)); color: var(--red); }
.bsc-f-seg button.active.both { background: var(--blue-dim); color: var(--blue); }

.bsc-f-pills { display: flex; gap: 6px; }
.bsc-f-pill {
  flex: 1; text-align: center; padding: 8px 0;
  border-radius: var(--radius-sm, 8px); border: 1px solid var(--border);
  background: none; color: var(--text-dim);
  font-family: var(--font-data); font-size: .85rem; cursor: pointer;
  transition: all var(--ease, .15s);
}
.bsc-f-pill:hover { color: var(--text); border-color: var(--border-hi); }
.bsc-f-pill.active { border-color: var(--blue); background: var(--blue-dim); color: var(--blue); font-weight: 700; }

.bsc-f-slider-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.bsc-f-slider-head .lbl { font-size: .78rem; color: var(--text-dim); }
.bsc-f-slider-head .val { font-family: var(--font-data); font-size: .95rem; font-weight: 700; color: var(--blue); }
.bsc-f-range { width: 100%; accent-color: var(--blue); cursor: pointer; }
.bsc-f-ticks { display: flex; justify-content: space-between; margin-top: 4px; font-family: var(--font-data); font-size: .65rem; color: var(--text-muted); }

.bsc-f-dur { display: flex; align-items: flex-end; gap: 8px; }
.bsc-f-dur label { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.bsc-f-dur label span {
  font-family: var(--font-ui); font-size: .65rem; font-weight: 600;
  letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted);
}
.bsc-f-dur select {
  width: 100%; padding: 8px 8px;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-sm, 8px);
  color: var(--text); font-family: var(--font-data); font-size: .82rem;
  cursor: pointer;
}
.bsc-f-dur select:focus { outline: none; border-color: var(--border-hi); }
.bsc-f-dur-sep { color: var(--text-muted); padding-bottom: 9px; flex-shrink: 0; }

.bsc-f-checks { display: flex; flex-direction: column; gap: 6px; }
.bsc-f-check {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: var(--radius-sm, 8px);
  background: var(--surface-veil, transparent); cursor: pointer;
  transition: border-color var(--ease, .15s);
}
.bsc-f-check:hover { border-color: var(--border-hi); }
.bsc-f-box {
  width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid var(--border-hi);
  flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  background: var(--panel); transition: all var(--ease, .15s);
}
.bsc-f-check.on .bsc-f-box { background: var(--blue); border-color: var(--blue); }
.bsc-f-check.on .bsc-f-box::after {
  content: ''; width: 8px; height: 5px;
  border-left: 2px solid #fff; border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translateY(-1px);
}
.bsc-f-lbl { flex: 1; font-size: .85rem; color: var(--text); font-weight: 500; }
.bsc-f-hint { font-family: var(--font-data); font-size: .7rem; color: var(--text-muted); white-space: nowrap; }

.bsc-f-search { position: relative; display: flex; align-items: center; }
.bsc-f-search svg { position: absolute; left: 10px; width: 13px; height: 13px; stroke: var(--text-muted); fill: none; stroke-width: 1.8; }
.bsc-f-search input {
  width: 100%; padding: 9px 10px 9px 30px;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-sm, 8px);
  color: var(--text); font-family: var(--font-data); font-size: .82rem;
}
.bsc-f-search input:focus { outline: none; border-color: var(--border-hi); }

.bsc-f-foot {
  padding: 12px 16px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
  font-size: .78rem; color: var(--text-dim); flex-shrink: 0;
}
.bsc-f-foot b { color: var(--text); font-family: var(--font-data); }
.bsc-f-reset {
  background: none; border: none; color: var(--text-muted);
  font-family: var(--font-ui); font-size: .78rem; cursor: pointer; padding: 2px 4px;
}
.bsc-f-reset:hover { color: var(--text); }


.bsc-main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.bsc-hdr {
  padding: 16px 24px 14px; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 14px; flex-shrink: 0;
}
.bsc-hdr-titles { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bsc-hdr h3 { font-family: var(--font-ui); font-size: 1.15rem; font-weight: 700; color: var(--text-bright, var(--text)); white-space: nowrap; margin: 0; }
.bsc-sub { font-size: .8rem; color: var(--text-muted); }
.bsc-count { margin-left: auto; font-family: var(--font-data); font-size: .8rem; color: var(--text-dim); white-space: nowrap; }
.bsc-close {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; flex-shrink: 0;
  border: 1px solid var(--border-hi); border-radius: var(--radius-sm, 8px);
  background: var(--card); color: var(--text);
  font-family: var(--font-ui); font-size: .85rem; font-weight: 600;
  cursor: pointer;
  transition: all var(--ease, .15s);
}
.bsc-close:hover { border-color: var(--red); color: var(--red); background: var(--red-dim); }
.bsc-close-x { font-size: 1.15rem; line-height: 1; }


.bsc-min-chip {
  position: fixed; left: 18px; bottom: 18px; z-index: 10040;
  display: none; align-items: center; gap: 9px;
  padding: 11px 18px;
  border: 1px solid var(--border-hi); border-radius: var(--radius-sm, 8px);
  background: var(--panel); color: var(--text);
  font-family: var(--font-ui); font-size: .85rem; font-weight: 600;
  cursor: pointer;
  box-shadow: 0 6px 18px var(--overlay-bg);
  transition: border-color var(--ease, .15s), color var(--ease, .15s);
}
.bsc-min-chip.show { display: inline-flex; }
.bsc-min-chip:hover { border-color: var(--blue); color: var(--blue); }
.bsc-min-chip svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; }

.bsc-table-wrap { flex: 1; overflow: auto; }
.bsc-table { width: 100%; border-collapse: collapse; font-family: var(--font-ui); font-size: .95rem; }
.bsc-table thead { position: sticky; top: 0; z-index: 2; }
.bsc-table th {
  padding: 10px 14px; background: var(--bg);
  color: var(--text-muted); font-weight: 600; font-size: .8rem;
  text-transform: uppercase; letter-spacing: .04em;
  text-align: left; white-space: nowrap;
}
.bsc-sortable { cursor: pointer; }
.bsc-sortable:hover { color: var(--text); }
.bsc-sort-desc::after { content: ' ▼'; font-size: .75rem; }
.bsc-sort-asc::after { content: ' ▲'; font-size: .75rem; }
.bsc-table th.bsc-r, .bsc-table td.bsc-r { text-align: right; }

.bsc-table td { padding: 9px 14px; border-bottom: 1px solid var(--hover-subtle, var(--border)); color: var(--text); white-space: nowrap; }
.bsc-table tbody tr { transition: background .1s; cursor: pointer; }
.bsc-table tbody tr:hover { background: var(--hover-subtle, var(--hover-medium)); }
.bsc-table tbody tr.sel { background: var(--blue-dim); }
.bsc-rank { color: var(--text-muted); font-family: var(--font-data); font-size: .76rem; width: 34px; }

.bsc-sym-wrap { display: inline-flex; align-items: center; gap: 10px; }
.bsc-logo {
  width: 26px; height: 26px; border-radius: 6px; flex-shrink: 0;
  background: var(--card); border: 1px solid var(--border);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-data); font-size: .62rem; font-weight: 700; color: var(--text-dim);
  overflow: hidden;
}
.bsc-logo img { width: 100%; height: 100%; object-fit: contain; border-radius: 5px; }
.bsc-logo .wl-logo-fb { width: 100%; height: 100%; font-size: .62rem; display: flex; align-items: center; justify-content: center; }
.bsc-names { display: inline-flex; flex-direction: column; line-height: 1.25; }
.bsc-sym { font-weight: 700; color: var(--text-bright, var(--text)); }
.bsc-name { font-size: .74rem; color: var(--text-muted); }
.bsc-class { color: var(--text-dim); font-size: .84rem; }
.bsc-range { font-family: var(--font-data); font-weight: 600; }
.bsc-range.bsc-up { color: var(--green); }
.bsc-range.bsc-down { color: var(--red); }
.bsc-dur { color: var(--text-dim); font-family: var(--font-data); font-size: .84rem; }
.bsc-wr { font-family: var(--font-data); font-weight: 700; }
.bsc-wr.bsc-up { color: var(--green); }
.bsc-wr.bsc-down { color: var(--red); }
.bsc-n { color: var(--text-muted); font-family: var(--font-data); font-weight: 400; font-size: .74rem; }
.bsc-mono { font-family: var(--font-data); }
.bsc-pos { color: var(--green); }
.bsc-neg { color: var(--red); }
.bsc-dim { color: var(--text-dim); }

.bsc-bars { display: inline-flex; align-items: flex-end; gap: 3px; height: 16px; }
.bsc-bar { display: inline-block; width: 7px; border-radius: 1px 1px 0 0; }
.bsc-bar-pos { background: var(--green); }
.bsc-bar-neg { background: var(--red); }
.bsc-bar-null { background: var(--border); height: 3px !important; }
.bsc-bar-flat { background: var(--text-muted); height: 2px !important; }

.bsc-empty { padding: 48px 20px; text-align: center; color: var(--text-muted); font-family: var(--font-ui); }
.bsc-retry {
  background: var(--card); border: 1px solid var(--border); color: var(--text);
  border-radius: var(--radius-sm, 8px); padding: 5px 14px; cursor: pointer; font-size: .8rem;
}
.bsc-retry:hover { border-color: var(--border-hi); }
.bsc-err-detail { margin-top: 8px; font-size: .7rem; color: var(--text-dim); }
.bsc-footnote {
  flex-shrink: 0; padding: 8px 24px;
  border-top: 1px solid var(--border);
  font-size: .72rem; color: var(--text-muted); line-height: 1.45;
  font-family: var(--font-ui);
}


.bsc-stats {
  width: 396px; min-width: 396px;
  background: var(--bg);
  border-left: 1px solid var(--border);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.bsc-stats-empty { flex: 1; display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: .85rem; padding: 20px; text-align: center; }
.bsc-stats-head { padding: 14px 18px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.bsc-stats-row1 { display: flex; align-items: center; gap: 10px; }
.bsc-stats-row1 .bsc-sym { font-size: 1.02rem; }
.bsc-stats-row2 { display: flex; align-items: center; gap: 8px; margin-top: 9px; flex-wrap: wrap; }
.bsc-pill {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 10px;
  border-radius: 999px; font-size: .7rem; font-weight: 700; letter-spacing: .04em;
}
.bsc-pill.bsc-up { background: var(--green-dim); color: var(--green); }
.bsc-pill.bsc-down { background: var(--red-dim); color: var(--red); }
.bsc-chip {
  font-family: var(--font-data); font-size: .76rem; color: var(--text);
  background: var(--card); border: 1px solid var(--border);
  border-radius: 6px; padding: 2px 8px;
}
.bsc-stats-body { flex: 1; overflow-y: auto; padding: 16px 18px; }

.bsc-hero { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.bsc-hero-lbl { font-size: .68rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: .05em; }
.bsc-hero-big { font-family: var(--font-data); font-size: 1.8rem; font-weight: 700; color: var(--green); margin-top: 2px; }
.bsc-hero-big.neg { color: var(--red); }
.bsc-hero-sub { font-family: var(--font-data); font-size: .72rem; color: var(--text-dim); margin-top: 3px; }
.bsc-ring {
  margin-left: auto; width: 74px; height: 74px; border-radius: 50%; flex-shrink: 0;
  background: var(--card);
  display: flex; align-items: center; justify-content: center;
  border: 3px solid var(--green);
}
.bsc-ring.bsc-down { border-color: var(--red); }
.bsc-ring-in { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.bsc-ring-in b { font-family: var(--font-data); font-size: .92rem; color: var(--text-bright, var(--text)); }
.bsc-ring-in span { font-family: var(--font-data); font-size: .6rem; color: var(--text-muted); }

.bsc-sec {
  display: flex; align-items: center; justify-content: space-between;
  font-size: .7rem; font-weight: 700; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .05em;
  margin: 14px 0 8px;
}
.bsc-sec .bsc-mono { text-transform: none; letter-spacing: 0; font-weight: 600; }
.bsc-chart-box { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius-sm, 8px); padding: 8px; }
.bsc-out-svg, .bsc-eq-svg { display: block; width: 100%; }
.bsc-svg-base { stroke: var(--border); stroke-width: 1; }
.bsc-svg-pos { fill: var(--green); }
.bsc-svg-neg { fill: var(--red); }
.bsc-svg-null { fill: var(--border); }
.bsc-svg-flat { fill: var(--text-muted); }
.bsc-svg-txt { font-family: var(--font-data); font-size: 8px; fill: var(--text-muted); }
.bsc-eq-line { stroke: var(--green); stroke-width: 1.6; fill: none; }
.bsc-eq-line.neg { stroke: var(--red); }
.bsc-eq-area { fill: var(--green-dim); }
.bsc-eq-area.neg { fill: var(--red-dim); }

.bsc-tiles { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-top: 12px; }
.bsc-tile { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius-sm, 8px); padding: 8px 10px; min-width: 0; }
.bsc-tile-k { font-size: .6rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bsc-tile-v { font-family: var(--font-data); font-size: .88rem; font-weight: 700; margin-top: 3px; color: var(--text); }
.bsc-tile-d { font-size: .6rem; color: var(--text-muted); margin-top: 2px; font-family: var(--font-data); line-height: 1.3; }

.bsc-aff { display: flex; flex-direction: column; gap: 6px; }
.bsc-aff-row {
  display: flex; align-items: center; gap: 8px;
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius-sm, 8px); padding: 7px 10px;
  font-size: .78rem; color: var(--text-dim);
}
.bsc-aff-row b { margin-left: auto; font-family: var(--font-data); color: var(--text); font-weight: 600; font-size: .74rem; }
.bsc-aff-ico { font-weight: 700; flex-shrink: 0; }
.bsc-aff-ico.ok { color: var(--green); }
.bsc-aff-ico.warn { color: var(--amber); }

.bsc-cta { padding: 12px 18px 16px; flex-shrink: 0; }
.bsc-cta button {
  width: 100%; padding: 11px 0; border: none;
  border-radius: var(--radius-sm, 8px);
  background: var(--blue); color: #fff;
  font-family: var(--font-ui); font-size: .9rem; font-weight: 600; cursor: pointer;
}
.bsc-cta button:hover { background: var(--blue-hover, var(--blue)); }




.sp-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: var(--overlay-bg, rgba(0,0,0,.55));
  backdrop-filter: var(--overlay-blur, blur(6px));
  display: flex;
  align-items: center;
  justify-content: center;
}

.sp-frame {
  width: 94vw;
  height: 90vh;
  max-width: 1700px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--overlay-shadow, 0 24px 80px rgba(0,0,0,.6));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  color: var(--text);
}


.sp-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--surface-raised);
  flex-shrink: 0;
}
.sp-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.sp-header-left svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: var(--blue, var(--blue));
  stroke-width: 2;
  flex-shrink: 0;
}
.sp-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-bright);
  white-space: nowrap;
}
.sp-symbol {
  font-size: 0.88rem;
  color: var(--text-dim);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sp-close {
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-size: 1.2rem;
  cursor: pointer;
  transition: all var(--ease);
  flex-shrink: 0;
}
.sp-close:hover {
  background: var(--hover-medium);
  color: var(--text-bright);
}

.sp-back-cycles {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--surface-raised);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  flex-shrink: 0;
  margin-right: 4px;
}
.sp-back-cycles:hover {
  background: var(--hover-medium);
  border-color: var(--border-hi);
  color: var(--text-bright);
}
.sp-back-cycles svg { stroke: currentColor; }


.sp-body {
  display: flex;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}


.sp-sidebar {
  width: 260px;
  background: var(--panel);
  border-right: 1px solid var(--surface-raised);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  padding: 12px;
  gap: 10px;
  flex-shrink: 0;
}
.sp-sidebar::-webkit-scrollbar { width: 4px; }
.sp-sidebar::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 2px; }


.sp-type-tabs {
  display: flex;
  gap: 8px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--surface-raised);
  flex-shrink: 0;
}
.sp-type-btn {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 18px;
  background: rgba(167,139,250,.08);
  border: 1px solid rgba(167,139,250,.18);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--text-dim);
  cursor: pointer;
  transition: all var(--ease);
  white-space: nowrap;
}
.sp-type-btn svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  flex-shrink: 0;
}
.sp-type-btn:hover {
  color: var(--purple);
  background: rgba(167,139,250,.14);
  border-color: rgba(167,139,250,.30);
}
.sp-type-btn.active {
  background: rgba(167,139,250,.22);
  border-color: rgba(167,139,250,.45);
  color: var(--purple);
  font-weight: 600;
}


.sp-section {
  background: var(--surface-veil);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-sm);
  padding: 10px;
}
.sp-section-label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}


.sp-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.sp-row:last-child { margin-bottom: 0; }
.sp-row label {
  font-size: 0.85rem;
  color: var(--text);
}


.sp-select, .sp-input {
  background: var(--divider-soft);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text-bright);
  font-family: var(--font-ui);
  font-size: 0.85rem;
  padding: 4px 8px;
  outline: none;
  transition: border-color var(--ease);
}
.sp-select:focus, .sp-input:focus { border-color: var(--blue); }
.sp-select { cursor: pointer; }
.sp-select option { background: var(--card); color: var(--text); }
.sp-input { width: 65px; text-align: center; }


.sp-range-presets {
  display: flex;
  gap: 4px;
  margin-top: 4px;
}
.sp-range-btn {
  flex: 1;
  padding: 5px 4px;
  background: var(--divider-soft);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
  text-align: center;
}
.sp-range-btn:hover {
  background: var(--surface-border);
  color: var(--text);
}
.sp-range-btn.active {
  background: var(--pill-active-bg, rgba(77,166,255,.18));
  color: var(--pill-active-color, var(--blue));
  border-color: rgba(77,166,255,.35);
  font-weight: 600;
}


.sp-year-range {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}
.sp-year-input { width: 58px; text-align: center; }


.sp-btn-run {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 10px 16px;
  border: none;
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: 0.90rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  background: var(--blue);
  color: #111;
  margin-top: auto;
}
.sp-btn-run:hover { filter: brightness(1.1); }
.sp-btn-run:disabled { opacity: .5; cursor: not-allowed; }
.sp-btn-run svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}


.sp-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
}


.sp-view-chart {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}


.sp-chart-container {
  flex: 1;
  min-height: 0;
  position: relative;
  overflow: hidden;
}
.sp-chart-container > div:first-child { width: 100%; height: 100%; }


.sp-spinner-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(10,11,15,.85);
  z-index: 10;
  gap: 12px;
}
.sp-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--surface-border);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: spSpin .8s linear infinite;
}
.sp-spinner-text {
  color: var(--blue);
  font-size: 0.90rem;
  font-weight: 500;
}
@keyframes spSpin { to { transform: rotate(360deg); } }


.sp-progress {
  padding: 4px 16px 8px;
  flex-shrink: 0;
}
.sp-progress-bar {
  height: 5px;
  background: var(--surface-raised);
  border-radius: 3px;
  overflow: hidden;
}
.sp-progress-fill {
  height: 100%;
  background: var(--purple);
  width: 0%;
  transition: width 0.3s ease;
  border-radius: 3px;
}
.sp-progress-text {
  text-align: center;
  font-size: 0.82rem;
  color: var(--purple);
  padding-top: 3px;
}


.sp-view-report {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.sp-report-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--surface-raised);
  flex-shrink: 0;
}
.sp-back-btn {
  background: transparent;
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 0.85rem;
  padding: 5px 12px;
  cursor: pointer;
  transition: all var(--ease);
}
.sp-back-btn:hover { background: var(--hover-subtle); color: var(--text-bright); }


.sp-lang-toggle {
  display: flex;
  gap: 4px;
  margin-left: auto;
}
.sp-lang-btn {
  background: var(--surface-raised);
  color: var(--text-muted);
  border: 1px solid var(--surface-border);
  padding: 3px 10px;
  font-size: 0.82rem;
  font-family: var(--font-ui);
  font-weight: 600;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all var(--ease);
}
.sp-lang-btn:hover { background: var(--surface-border); }
.sp-lang-btn.active { background: var(--blue); color: #111; border-color: var(--blue); }

.sp-report-content {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
}
.sp-report-content::-webkit-scrollbar { width: 6px; }
.sp-report-content::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.sp-peaks-panel {
  width: 280px;
  background: var(--panel);
  border-left: 1px solid var(--surface-raised);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  flex-shrink: 0;
}
.sp-peaks-header {
  padding: 10px 12px 8px;
  font-size: 0.90rem;
  font-weight: 600;
  color: var(--text-bright);
  border-bottom: 1px solid var(--surface-raised);
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sp-peaks-controls {
  display: flex;
  align-items: center;
  gap: 4px;
}
.sp-peaks-controls label { font-size: 0.82rem; color: var(--text-muted); }
.sp-peaks-controls select {
  background: var(--divider-soft);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text-bright);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  padding: 2px 4px;
  outline: none;
}


.sp-peaks-source {
  padding: 6px 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid var(--surface-raised);
  flex-shrink: 0;
}
.sp-peaks-source label { font-size: 0.82rem; color: var(--text-muted); white-space: nowrap; }
.sp-peaks-source select {
  flex: 1;
  background: var(--divider-soft);
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-sm);
  color: var(--text-bright);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  padding: 3px 6px;
  outline: none;
}


.sp-peaks-subtabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--surface-border);
  flex-shrink: 0;
}
.sp-peaks-subtab {
  flex: 1;
  padding: 6px 0;
  background: transparent;
  border: none;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all var(--ease);
}
.sp-peaks-subtab:hover { color: var(--text); }
.sp-peaks-subtab.active { color: var(--text-bright); border-bottom-color: var(--text-bright); }


.sp-peaks-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
}
.sp-peaks-list::-webkit-scrollbar { width: 4px; }
.sp-peaks-list::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 2px; }


.sp-peak-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: var(--surface-veil);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-sm);
  margin-bottom: 5px;
  transition: border-color var(--ease);
  cursor: pointer;
  flex-wrap: wrap;
}
.sp-peak-item:hover { border-color: var(--surface-border-hi); }

.sp-peak-rank {
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(77,166,255,.12);
  color: var(--blue);
  font-size: 0.82rem;
  font-weight: 700;
  flex-shrink: 0;
}
.sp-peak-info { flex: 1; min-width: 0; }
.sp-peak-period { font-size: 0.90rem; font-weight: 600; color: var(--text-bright); }
.sp-peak-years { font-size: 0.82rem; color: var(--text-muted); }
.sp-peak-extra { font-size: 0.82rem; color: var(--amber); }
.sp-peak-power {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--amber);
  margin-left: auto;
  flex-shrink: 0;
}
.sp-peak-gain {
  font-size: 0.85rem;
  font-weight: 700;
  flex-shrink: 0;
  min-width: 52px;
  text-align: right;
}


.sp-peak-actions { display: flex; gap: 4px; flex-shrink: 0; }
.sp-peak-btn {
  padding: 3px 8px;
  border: none;
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
}
.sp-peak-btn-wave { background: var(--blue-dim); color: var(--blue); }
.sp-peak-btn-wave:hover { background: var(--blue-med); }
.sp-peak-btn-cycle { background: var(--amber-dim); color: var(--amber); }
.sp-peak-btn-cycle:hover { background: var(--amber-light); }


.sp-peak-deg {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 5px;
  border-radius: 3px;
  background: var(--red-dim);
  color: var(--red);
  font-size: 0.82rem;
  font-weight: 700;
}
.sp-badge-pass {
  padding: 1px 5px;
  border-radius: 3px;
  background: var(--green-dim);
  color: var(--green);
  font-size: 0.82rem;
  font-weight: 700;
}
.sp-badge-fail {
  padding: 1px 5px;
  border-radius: 3px;
  background: rgba(240,80,110,.12);
  color: var(--red);
  font-size: 0.82rem;
  font-weight: 700;
}


.sp-peaks-bottom {
  padding: 8px;
  border-top: 1px solid var(--surface-raised);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sp-send-all-btn {
  padding: 8px 12px;
  background: rgba(38,217,127,.12);
  color: var(--green);
  border: 1px solid rgba(38,217,127,.25);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  width: 100%;
  transition: all var(--ease);
}
.sp-send-all-btn:hover { background: rgba(38,217,127,.25); }

.sp-view-report-btn {
  padding: 8px 12px;
  background: rgba(167,139,250,.12);
  color: var(--purple);
  border: 1px solid rgba(167,139,250,.25);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  width: 100%;
  transition: all var(--ease);
}
.sp-view-report-btn:hover { background: rgba(167,139,250,.25); }


.sp-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--text-muted);
  font-size: 0.90rem;
  text-align: center;
  padding: 30px;
}


.sp-status {
  padding: 5px 16px;
  font-size: 0.82rem;
  color: var(--text-muted);
  border-top: 1px solid var(--surface-raised);
  flex-shrink: 0;
}
.sp-status-ok { color: var(--green); }
.sp-status-err { color: var(--red); }


.sp-report-section {
  background: var(--surface-veil);
  border: 1px solid var(--surface-raised);
  border-radius: var(--radius-md);
  padding: 20px;
  margin-bottom: 16px;
}
.sp-report-section h4 {
  color: var(--amber);
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 12px;
}
.sp-insight-text {
  color: var(--text);
  line-height: 1.6;
  margin-bottom: 12px;
  font-size: 0.85rem;
}
.sp-insight-text ul { margin: 8px 0; padding-left: 20px; }
.sp-insight-text li { margin-bottom: 4px; }


.sp-cycle-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.sp-cycle-table th, .sp-cycle-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--surface-raised);
  color: var(--text);
  white-space: nowrap;
}
.sp-cycle-table th {
  background: var(--divider-soft);
  color: var(--amber);
  font-weight: 600;
  position: sticky;
  top: 0;
}
.sp-cycle-table .sp-row-highlight { background: rgba(38,217,127,.08); }
.sp-cycle-table .sp-row-highlight td { color: var(--green); font-weight: 600; }

.sp-table-container {
  overflow-x: auto;
  border-radius: var(--radius-sm);
  border: 1px solid var(--surface-raised);
  margin: 12px 0;
}
.sp-table-container::-webkit-scrollbar { height: 6px; }
.sp-table-container::-webkit-scrollbar-thumb { background: var(--surface-border); border-radius: 3px; }


.sp-detail-tabs-container {
  margin: 16px 0;
  background: var(--surface-veil);
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--surface-raised);
}
.sp-detail-tabs-header {
  display: flex;
  flex-wrap: wrap;
  background: var(--surface-veil);
  border-bottom: 1px solid var(--surface-raised);
}
.sp-detail-tab-button {
  padding: 10px 16px;
  font-size: 0.85rem;
  font-family: var(--font-ui);
  color: var(--text-muted);
  cursor: pointer;
  transition: all var(--ease);
  border: none;
  background: none;
  border-right: 1px solid var(--surface-raised);
  white-space: nowrap;
  flex: 1;
  text-align: center;
  min-width: 100px;
}
.sp-detail-tab-button:hover { background: var(--hover-subtle); color: var(--text); }
.sp-detail-tab-button.active { background: var(--blue); color: #111; font-weight: 600; }
.sp-detail-tabs-content { padding: 20px; }


.sp-timing-bar {
  flex: 1;
  height: 4px;
  background: var(--surface-raised);
  border-radius: 2px;
}
.sp-timing-bar-fill {
  height: 100%;
  background: var(--blue);
  border-radius: 2px;
}




.inst-overlay {
  position: fixed; inset: 0;
  background: var(--panel);
  z-index: 200; display: none;
  align-items: center; justify-content: center;
}
.inst-overlay.open { display: flex; animation: instFadeIn .15s ease; }

@keyframes instFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}


.inst-panel {
  width: 100vw; max-width: none;
  height: 100vh; height: 100dvh;
  background: var(--panel);
  border: 0; border-radius: 0;
  display: flex; flex-direction: row;
  overflow: hidden;
  animation: instSlideIn .18s ease;
}
@keyframes instSlideIn {
  from { opacity: 0; transform: scale(.995); }
  to { opacity: 1; transform: scale(1); }
}


.inst-sidebar {
  width: 240px; min-width: 240px;
  background: var(--bg);
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
  padding: 24px 16px;
  overflow: hidden;
}
.inst-logo {
  font-family: var(--font-ui);
  font-weight: 800; font-size: 1.07rem;
  letter-spacing: .06em; text-transform: uppercase;
  color: var(--text-bright); margin-bottom: 2px;
}
.inst-logo-sub {
  font-family: var(--font-ui);
  font-size: .90rem; color: var(--text-muted);
  margin-bottom: 24px; letter-spacing: .03em;
}
.inst-sb-search {
  width: 100%; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: transparent; color: var(--text);
  font-family: var(--font-ui); font-size: .96rem; outline: none;
  margin-bottom: 24px; transition: border-color var(--ease);
}
.inst-sb-search:focus { border-color: var(--text-muted); }
.inst-sb-search::placeholder { color: var(--text-muted); }
.inst-sb-scroll { flex: 1; overflow-y: auto; }
.inst-sb-group { margin-bottom: 20px; }
.inst-nav-label {
  font-family: var(--font-ui);
  font-size: .84rem; text-transform: uppercase; color: var(--text-muted);
  letter-spacing: .14em; margin-bottom: 8px; display: block; font-weight: 600;
}
.inst-sb-item {
  padding: 6px 8px; border-radius: 4px; color: var(--text-dim);
  font-family: var(--font-ui); font-size: .96rem; cursor: pointer;
  transition: var(--ease); display: flex; justify-content: space-between;
  align-items: center; margin-bottom: 1px;
}
.inst-sb-item:hover { color: var(--text-bright); }
.inst-sb-item.active {
  color: var(--text-bright); font-weight: 600;
  background: var(--hover-medium); border-radius: 4px;
}


.inst-main {
  flex: 1; overflow-y: auto; position: relative;
  display: flex; flex-direction: column;
}
.inst-header-bar {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center;
  padding: 0 14px 0 20px; gap: 8px;
  background: var(--panel);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0; min-height: 56px;
}

.inst-header-tabs { display: flex; gap: 8px; align-items: center; }
.inst-tabbtn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; cursor: pointer;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--card); color: var(--text-dim);
  font-family: var(--font-ui); font-size: .96rem; font-weight: 600;
  letter-spacing: .01em; white-space: nowrap;
  transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.inst-tabbtn svg { width: 16px; height: 16px; flex: none; }
.inst-tabbtn:hover { color: var(--text-bright); border-color: var(--border-hi); }

.inst-tabbtn.active {
  background: color-mix(in srgb, var(--blue) 14%, transparent);
  border-color: color-mix(in srgb, var(--blue) 50%, transparent);
  color: var(--text-bright); font-weight: 700;
}
.inst-tabbtn.active svg { color: var(--blue); }
.inst-tabbtn:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

.inst-close {
  width: 40px; height: 40px; border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--card); color: var(--text-dim); font-size: 1.7rem;
  line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.inst-close:hover {
  background: var(--red); border-color: var(--red); color: #fff;
}
.inst-close:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }


.inst-back {
  border: none; background: transparent; color: var(--text-dim);
  font-size: 1.3rem; cursor: pointer; padding: 4px 8px;
  border-radius: var(--radius-sm); transition: var(--ease);
  line-height: 1; display: flex; align-items: center;
}
.inst-back:hover { background: var(--hover-medium); color: var(--text-bright); }


.inst-landing { padding: 28px 36px 48px; flex: 1; overflow-y: auto; }


.inst-ws { padding-top: 26px; }

.inst-ws .ws-chart-card-head { flex-wrap: wrap; row-gap: 8px; }
.inst-ws .ws-chart-card-tools { gap: 10px; flex-wrap: wrap; }

.inst-ws-head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px; align-items: start;
}
.inst-ws-head .ws-ov-sub { margin-bottom: 0; }
.inst-ws .ws-chap-intro .ws-ai-note { margin: 18px 0 0; max-width: 980px; }

.inst-note {
  margin: 14px 2px 0; font-family: var(--font-ui);
  font-size: .82rem; color: var(--text-muted); line-height: 1.6;
}
.inst-card-meta {
  font-family: var(--font-ui); font-size: .78rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted);
}

.inst-ws .ws-chart-body .inst-cons-table { margin: 0; }

.inst-mov-charts {
  display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
  align-items: start;
}
.inst-mov-charts .ws-chart-card { margin: 0; }


.inst-cal-cards { display: flex; gap: 10px; flex-wrap: wrap; }
.inst-cal-card {
  min-width: 158px; padding: 11px 14px 12px;
  background: var(--surface-veil); border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.inst-cal-lbl {
  font-family: var(--font-ui); font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em; color: var(--text-muted);
}
.inst-cal-val {
  font-family: var(--font-ui); font-size: 1.08rem; font-weight: 700;
  color: var(--text-bright); line-height: 1.2; margin-top: 6px;
}
.inst-cal-val.warn { color: var(--amber); }
.inst-cal-sub {
  font-family: var(--font-ui); font-size: .8rem; color: var(--text-muted);
  margin-top: 3px; line-height: 1.4;
}

.inst-land-view { display: none; }
.inst-land-view.show { display: block; }


.inst-land-section { margin-bottom: 40px; }
.inst-land-label {
  font-family: var(--font-ui);
  font-size: .84rem; text-transform: uppercase; color: var(--text-muted);
  letter-spacing: .14em; font-weight: 600; margin-bottom: 14px;
  padding-bottom: 6px; border-bottom: 1px solid var(--border);
}


.inst-cons-ctrl { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }


.inst-cons-tablewrap { min-width: 0; overflow: auto; max-height: 540px; }
.inst-cons-tablewrap .inst-cons-table thead th {
  position: sticky; top: 0; z-index: 2; background: var(--panel);
}


.inst-cons-table th.sortedby {
  color: var(--text-bright);
  text-decoration: underline; text-decoration-color: var(--blue);
  text-decoration-thickness: 2px; text-underline-offset: 5px;
}


.inst-cons-table { width: 100%; border-collapse: collapse; }
.inst-cons-table th {
  text-align: left; color: var(--text-muted); font-family: var(--font-ui);
  font-size: .8rem; text-transform: uppercase; letter-spacing: .08em;
  padding: 6px 10px; border-bottom: 1px solid var(--border); font-weight: 600;
  white-space: nowrap;
}
.inst-cons-table th.r { text-align: right; }
.inst-cons-table td {
  padding: 7px 10px; border-bottom: 1px solid var(--hover-subtle);
  font-family: var(--font-ui); font-size: .94rem; vertical-align: middle;
}
.inst-cons-table td.r { text-align: right; }
.inst-cons-table tbody tr:hover { background: var(--hover-subtle); }
.inst-cons-rank {
  width: 26px; color: var(--text-muted); font-size: .84rem;
  font-family: var(--font-ui); text-align: right; padding-right: 4px !important;
}
.inst-cons-empty { text-align: center; color: var(--text-muted); padding: 18px 0 !important; }


.inst-logo.wl-logo {
  width: 22px; height: 22px; border-radius: 6px;
  align-self: center; flex: none;
}
.inst-logo.wl-logo img { width: 16px; height: 16px; }
.inst-logo .wl-logo-fb { font-size: 9px; }

.inst-cons-stock { display: flex; align-items: center; gap: 8px; min-width: 0; }
.inst-cons-stock .inst-tk {
  font-size: .96rem; cursor: pointer; border-bottom: 1px dashed var(--border-hi);
}
.inst-cons-stock .inst-tk:hover { color: var(--blue); border-bottom-color: var(--blue); }
.inst-tk-fund { color: var(--text-dim); }
.inst-cons-name {
  color: var(--text-dim); font-size: .9rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}


.inst-cell-bar {
  display: grid; grid-template-columns: 62px minmax(74px, auto);
  align-items: center; gap: 10px; justify-content: flex-end;
}
.inst-cell-bar > .inst-mono {
  text-align: right; font-variant-numeric: tabular-nums;
}
.inst-cbar {
  display: block; width: 62px; height: 6px; flex-shrink: 0;
  background: var(--hover-subtle); border-radius: 3px; overflow: hidden;
}
.inst-cbar i { display: block; height: 100%; background: var(--blue); border-radius: 3px; }
.inst-cbar.alt i { background: var(--purple); }
.inst-den { color: var(--text-muted); font-size: .84rem; }

.inst-qq {
  font-family: var(--font-ui); font-size: .88rem; font-weight: 700;
  padding: 1px 6px; border-radius: 3px;
}
.inst-qq.up { color: var(--green); background: color-mix(in srgb, var(--green) 12%, transparent); }
.inst-qq.down { color: var(--red); background: color-mix(in srgb, var(--red) 12%, transparent); }
.inst-qq.flat { color: var(--text-muted); }

.inst-mov-chart { width: 100%; }



.ws-ai-note .inst-tk,
.inst-note .inst-tk {
  cursor: pointer; font-weight: 700; color: var(--text-bright);
  border-bottom: 1px dashed var(--border-hi);
}
.ws-ai-note .inst-tk:hover,
.inst-note .inst-tk:hover { color: var(--blue); border-bottom-color: var(--blue); }

.inst-note .inst-tk { font-size: inherit; color: var(--text-dim); }
.ws-ai-note .stm-ins-prose:last-child { margin-bottom: 0; }
.inst-lede-q {
  display: inline-block; margin-right: 8px; padding: 1px 7px;
  border: 1px solid var(--border-hi); border-radius: 3px;
  font-size: .82rem; font-weight: 700; letter-spacing: .06em;
  color: var(--text-muted); text-transform: uppercase; vertical-align: 2px;
}

.inst-mov-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.inst-mov-buy { color: var(--green); border-bottom-color: color-mix(in srgb, var(--green) 45%, transparent); }
.inst-mov-sell { color: var(--red); border-bottom-color: color-mix(in srgb, var(--red) 45%, transparent); }
.inst-bs.up { color: var(--green); font-weight: 700; }
.inst-bs.down { color: var(--red); font-weight: 700; }
.inst-bs-sep { color: var(--text-muted); margin: 0 3px; }

@media (max-width: 1180px) {
  .inst-mov-charts { grid-template-columns: 1fr; }
  .inst-mov-grid { grid-template-columns: 1fr; }
  .inst-ws-head { grid-template-columns: 1fr; }
  .inst-landing { padding: 22px 22px 40px; }
}


.inst-fund-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.inst-fund-card {
  padding: 20px; cursor: pointer; transition: background var(--ease), border-color var(--ease);
  position: relative; background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-md); min-height: 155px; display: flex;
  flex-direction: column; justify-content: space-between;
}
.inst-fund-card:hover { background: var(--border); border-color: var(--border-hi); }
.inst-fund-card-badge {
  font-family: var(--font-ui);
  font-size: .82rem; text-transform: uppercase; letter-spacing: .14em;
  font-weight: 700; color: var(--text-muted); margin-bottom: 10px; display: block;
}
.inst-fund-card-top { display: flex; align-items: center; gap: 12px; }
.inst-fund-logo { width: 42px; height: 42px; flex-shrink: 0; }
.inst-fund-logo svg { width: 100%; height: 100%; }
.inst-fund-card-name {
  font-family: var(--font-ui);
  font-size: 1.22rem; font-weight: 800; letter-spacing: -.02em; margin-bottom: 2px;
  color: var(--text-bright);
}
.inst-fund-card-manager {
  font-family: var(--font-ui);
  font-size: .94rem; color: var(--text-dim); font-weight: 400;
}
.inst-fund-card-bottom {
  margin-top: 14px; display: flex; justify-content: space-between;
  align-items: flex-end; padding-right: 28px;
}
.inst-fund-card-aum {
  font-family: var(--font-ui);
  font-size: 1.22rem; font-weight: 700; color: var(--text-bright);
}
.inst-fund-card-tag {
  font-family: var(--font-ui);
  font-size: .84rem; font-weight: 600; color: var(--text-muted);
  padding: 2px 6px; border: 1px solid var(--border); border-radius: 3px;
  text-transform: uppercase; letter-spacing: .04em;
}
.inst-fund-card-arrow {
  position: absolute; bottom: 22px; right: 20px;
  font-size: 1.4rem; color: var(--border); transition: var(--ease);
}
.inst-fund-card:hover .inst-fund-card-arrow {
  color: var(--text-bright); transform: translateX(4px);
}


.inst-detail { display: none; flex-direction: column; flex: 1; min-height: 0; }
.inst-detail.show { display: flex; }
.inst-detail-scroll { flex: 1; overflow-y: auto; padding: 28px 40px 40px; }

.inst-det-header {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 28px;
}
.inst-det-badge {
  color: var(--text-muted); font-family: var(--font-ui);
  font-size: .90rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .1em; display: block; margin-bottom: 6px;
}
.inst-det-header h1 {
  font-family: var(--font-ui);
  font-size: 2rem; font-weight: 900; letter-spacing: -.04em;
  color: var(--text-bright);
}
.inst-det-sub {
  color: var(--text-dim); font-family: var(--font-ui);
  font-size: .96rem; margin-top: 4px;
}


.inst-det-tabs {
  display: flex; gap: 0; margin-bottom: 28px;
  border-bottom: 1px solid var(--border); width: fit-content;
}
.inst-det-tab {
  padding: 8px 18px; border: none; background: transparent;
  color: var(--text-muted); font-family: var(--font-ui); font-size: .96rem;
  font-weight: 500; cursor: pointer; transition: var(--ease);
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.inst-det-tab:hover { color: var(--text-bright); }
.inst-det-tab.active {
  color: var(--text-bright); font-weight: 700;
  border-bottom-color: var(--text-bright);
}


.inst-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px; }
.inst-stat-card {
  padding: 16px 20px; background: var(--card);
  border: 1px solid var(--border); border-radius: var(--radius-md);
}
.inst-stat-label {
  font-family: var(--font-ui);
  font-size: .84rem; text-transform: uppercase; color: var(--text-muted);
  letter-spacing: .1em; font-weight: 600; margin-bottom: 6px;
}
.inst-stat-val {
  font-family: var(--font-ui);
  font-size: 1.62rem; font-weight: 700; color: var(--text-bright);
}
.inst-stat-sub {
  font-family: var(--font-ui);
  font-size: .90rem; margin-top: 4px;
}


.inst-dash-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; }
.inst-main-col { display: flex; flex-direction: column; min-width: 0; }


.inst-holdings-panel {
  border: 1px solid var(--border); border-radius: var(--radius-md);
  padding: 20px; background: var(--card);
  display: flex; flex-direction: column;
  min-height: 0;
}
.inst-dash-grid { align-items: start; }
.inst-dash-grid > .inst-main-col > .inst-holdings-panel { align-self: stretch; }

.inst-holdings-scroll {
  flex: 1; overflow-y: auto; min-height: 0; max-height: 52vh;
}
.inst-holdings-scroll .inst-h-table thead th {
  position: sticky; top: 0; z-index: 1; background: var(--card);
}
.inst-holdings-scroll::-webkit-scrollbar { width: 4px; }
.inst-holdings-scroll::-webkit-scrollbar-thumb { background: var(--border-hi); border-radius: 2px; }

.inst-panel-box {
  border: 1px solid var(--border); border-radius: var(--radius-md);
  padding: 20px; background: var(--card);
}
.inst-panel-hdr {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 16px; flex-shrink: 0;
}
.inst-panel-title {
  font-family: var(--font-ui);
  font-weight: 800; font-size: 1.04rem; text-transform: uppercase;
  letter-spacing: .04em; color: var(--text-bright);
}
.inst-panel-meta {
  font-family: var(--font-ui);
  font-size: .90rem; color: var(--text-muted);
}


.inst-h-table { width: 100%; border-collapse: collapse; }
.inst-h-table th {
  text-align: left; color: var(--text-muted); font-family: var(--font-ui);
  font-size: .84rem; text-transform: uppercase; letter-spacing: .08em;
  padding: 8px 12px; border-bottom: 1px solid var(--border); font-weight: 600;
  position: sticky; top: 0; background: var(--card); z-index: 1;
}
.inst-h-table th.r { text-align: right; }
.inst-h-table td {
  padding: 10px 12px; border-bottom: 1px solid var(--hover-subtle);
  font-family: var(--font-ui); font-size: .96rem;
}
.inst-h-table td.r { text-align: right; }
.inst-h-table tbody tr { cursor: pointer; transition: background var(--ease); }
.inst-h-table tbody tr:hover { background: var(--hover-subtle); }
.inst-tk {
  color: var(--text-bright); font-size: 1rem; font-weight: 700;
  font-family: var(--font-ui); letter-spacing: .02em;
}

.inst-h-stock { display: flex; align-items: center; gap: 9px; min-width: 0; }
.inst-h-stock .inst-tk {
  font-size: .94rem; cursor: pointer; flex: none;
  border-bottom: 1px dashed var(--border-hi);
}
.inst-h-stock .inst-tk:hover { color: var(--blue); border-bottom-color: var(--blue); }
.inst-h-name {
  font-weight: 600; color: var(--text-bright);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.inst-nm { font-weight: 400; color: var(--text-dim); }
.inst-mono { font-family: var(--font-ui); }
.inst-badge-sm {
  font-family: var(--font-ui);
  font-size: .84rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .05em;
}
.inst-badge-new { color: var(--green); }
.inst-badge-trim { color: var(--red); }
.inst-badge-add { color: var(--blue); }
.inst-badge-hold { color: var(--text-muted); }


.inst-src {
  font-size: .82rem; font-weight: 700; padding: 1px 4px; border-radius: 2px;
  text-transform: uppercase; letter-spacing: .05em; display: inline-block;
  font-family: var(--font-ui);
}
.inst-src-13f { color: var(--text-muted); border: 1px solid var(--border); }
.inst-src-f4 { color: var(--amber); border: 1px solid rgba(255,184,51,.3); }


.inst-alloc { margin-bottom: 22px; }
.inst-alloc-hdr {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; padding: 2px 2px 0;
}
.inst-alloc-body {
  display: flex; justify-content: center;
  padding: 30px 0 34px;         
}
.inst-pie-stage { position: relative; flex: none; }
.inst-pie-stage svg { display: block; }
.inst-pie-seg { cursor: pointer; }

.inst-pie-lead { fill: none; stroke-width: 1.4; opacity: .85; }


.inst-logo.wl-logo.inst-pie-mark {
  position: absolute; transform: translate(-50%, -50%);   
  
  pointer-events: none;
  width: auto; height: auto; border-radius: 50%;
  background: #fff; box-shadow: 0 2px 8px rgba(5, 8, 15, .32);
  transition: transform .22s ease;
}
.inst-logo.wl-logo.inst-pie-mark::after { display: none; }
.inst-logo.wl-logo.inst-pie-mark.wl-logo-lt {
  background: var(--wlg-tile-onlight);
  box-shadow: 0 2px 8px rgba(5, 8, 15, .35);
}
.inst-logo.wl-logo.inst-pie-mark.wl-logo-dk { background: #fff; }
.inst-logo.wl-logo.inst-pie-mark img { width: 68%; height: 68%; object-fit: contain; }
.inst-logo.wl-logo.inst-pie-mark .wl-logo-fb { font-size: 11px; }
.inst-pie-mark.hot { transform: translate(-50%, -50%) scale(1.08); }

.inst-pie-mark.inst-pie-tail { box-shadow: 0 1px 4px rgba(5, 8, 15, .35); }
.inst-pie-mark.inst-pie-tail.wl-logo-lt {
  box-shadow: 0 1px 4px rgba(5, 8, 15, .35), inset 0 0 0 1px rgba(255, 255, 255, .28);
}


.inst-plabel {
  position: absolute; display: flex; align-items: center;
  pointer-events: none; white-space: nowrap;
}
.inst-plabel.left { transform: translate(-100%, -50%); text-align: right; flex-direction: row-reverse; }

.inst-logo.wl-logo.inst-pl-tile {
  position: relative; transform: none; flex: none; margin: 0 10px;
  border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(5, 8, 15, .30);
}
.inst-logo.wl-logo.inst-pl-tile.wl-logo-lt { background: var(--wlg-tile-onlight); }
.inst-plabel.hot .inst-pl-tile { transform: scale(1.08); }
.inst-plabel.right { transform: translate(0, -50%); }
.inst-pl-nm {
  font-family: var(--font-ui); font-size: 17px; font-weight: 600;
  color: var(--text-bright); line-height: 1.25; transition: font-size .14s ease;
}
.inst-pl-nm .tk {
  font-family: var(--font-data); font-size: 15px; font-weight: 700;
  color: var(--text-muted); margin: 0 6px; transition: font-size .14s ease;
}
.inst-pl-v {
  font-family: var(--font-data); font-size: 16px; font-weight: 600;
  color: var(--text-dim); line-height: 1.3; transition: font-size .14s ease;
}
.inst-pl-pc { color: var(--text-soft); }
.inst-plabel.hot .inst-pl-nm { font-size: 21px; }
.inst-plabel.hot .inst-pl-nm .tk { font-size: 19px; }
.inst-plabel.hot .inst-pl-v { font-size: 20px; }


.inst-pie-center {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 152px; text-align: center; pointer-events: none;
}
.inst-pie-eyebrow {
  font-family: var(--font-ui); font-size: .58rem; font-weight: 600;
  letter-spacing: .13em; text-transform: uppercase; color: var(--text-muted);
}
.inst-pie-val {
  font-family: var(--font-data); font-size: 1.45rem; font-weight: 700;
  color: var(--text-bright); letter-spacing: -.03em; line-height: 1.1; margin-top: 2px;
}
.inst-pie-sub { font-family: var(--font-ui); font-size: .68rem; color: var(--text-dim); line-height: 1.35; margin-top: 3px; }

.inst-logo.wl-logo.inst-pie-hub {
  position: relative; border-radius: 50%; margin: 0 auto 6px;
  background: #fff; box-shadow: 0 2px 8px rgba(5, 8, 15, .32);
}
.inst-logo.wl-logo.inst-pie-hub::after { display: none; }
.inst-logo.wl-logo.inst-pie-hub.wl-logo-lt { background: var(--wlg-tile-onlight); }
.inst-logo.wl-logo.inst-pie-hub img { width: 68%; height: 68%; object-fit: contain; }


.inst-rf-compact { display: flex; flex-direction: column; gap: 0; }
.inst-rf-c {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 0; border-bottom: 1px solid var(--hover-subtle);
}
.inst-rf-c:last-child { border-bottom: none; }
.inst-rf-c-date {
  font-family: var(--font-ui); font-size: .88rem;
  color: var(--text-muted); width: 56px; flex-shrink: 0;
}
.inst-rf-c-act {
  margin-left: auto; font-family: var(--font-ui);
  font-size: .88rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em;
}
.inst-rf-sell { color: var(--red); }
.inst-rf-buy { color: var(--green); }


.inst-changes-area { display: none; }
.inst-changes-area.show { display: block; }
.inst-ch-period {
  display: inline-block; font-family: var(--font-ui);
  font-size: .94rem; color: var(--text-dim); margin-bottom: 28px;
  font-weight: 500; border-bottom: 1px solid var(--border); padding-bottom: 6px;
}
.inst-ch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.inst-ch-panel {
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  overflow: hidden;
}
.inst-ch-panel-header {
  padding: 14px 18px; border-bottom: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: center;
}
.inst-ch-panel-title {
  font-family: var(--font-ui);
  font-size: .90rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 800;
}
.inst-ch-panel-count {
  font-family: var(--font-ui); font-size: .96rem; font-weight: 700;
}
.inst-ch-panel.inst-ch-new .inst-ch-panel-title,
.inst-ch-panel.inst-ch-new .inst-ch-panel-count { color: var(--green); }
.inst-ch-panel.inst-ch-up .inst-ch-panel-title,
.inst-ch-panel.inst-ch-up .inst-ch-panel-count { color: var(--blue); }
.inst-ch-panel.inst-ch-down .inst-ch-panel-title,
.inst-ch-panel.inst-ch-down .inst-ch-panel-count { color: var(--red); }
.inst-ch-panel.inst-ch-exit .inst-ch-panel-title,
.inst-ch-panel.inst-ch-exit .inst-ch-panel-count { color: var(--text-muted); }
.inst-ch-panel.inst-ch-new { background: var(--green-dim); }
.inst-ch-panel.inst-ch-up { background: var(--blue-dim); }
.inst-ch-panel.inst-ch-down { background: var(--red-dim); }
.inst-ch-panel.inst-ch-exit { background: rgba(92, 97, 128, .05); }
.inst-ch-row {
  display: flex; align-items: center; padding: 10px 18px;
  border-bottom: 1px solid var(--hover-subtle); cursor: pointer;
  transition: background var(--ease);
}
.inst-ch-row:last-child { border-bottom: none; }
.inst-ch-row:hover { background: var(--hover-subtle); }
.inst-ch-row-name {
  flex: 1; font-family: var(--font-ui); font-size: .94rem;
  color: var(--text-dim); min-width: 0; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.inst-ch-row-val {
  text-align: right; font-family: var(--font-ui);
  font-size: .94rem; font-weight: 700; width: 72px; flex-shrink: 0; margin-left: 10px;
}
.inst-ch-row-shares {
  text-align: right; font-family: var(--font-ui);
  font-size: .84rem; color: var(--text-muted); width: 110px;
  flex-shrink: 0; margin-left: 10px;
}


.inst-status-bar {
  padding: 8px 40px; border-top: 1px solid var(--border);
  display: flex; gap: 20px; font-family: var(--font-ui);
  font-size: .82rem; color: var(--text-muted); flex-shrink: 0;
}
.inst-status-bar strong { color: var(--text-dim); font-weight: 700; }
.inst-st-dot {
  width: 4px; height: 4px; border-radius: 50%; background: var(--green);
  display: inline-block; margin-right: 3px;
}


.inst-ins-table { width: 100%; border-collapse: collapse; }
.inst-ins-table th {
  text-align: left; color: var(--text-muted); font-family: var(--font-ui);
  font-size: .84rem; text-transform: uppercase; letter-spacing: .08em;
  padding: 8px 12px; border-bottom: 1px solid var(--border); font-weight: 600;
  cursor: pointer; user-select: none; transition: color var(--ease);
}
.inst-ins-table th:hover { color: var(--text-bright); }
.inst-ins-table th.r { text-align: right; }
.inst-ins-table th.sorted { color: var(--text-bright); }
.inst-ins-table th .sort-arrow { font-size: .82rem; margin-left: 3px; opacity: .4; }
.inst-ins-table th.sorted .sort-arrow { opacity: 1; }
.inst-ins-table td {
  padding: 8px 12px; border-bottom: 1px solid var(--hover-subtle);
  font-family: var(--font-ui); font-size: .94rem;
}
.inst-ins-table td.r { text-align: right; }
.inst-ins-table tbody tr { cursor: pointer; transition: background var(--ease); }
.inst-ins-table tbody tr:hover { background: var(--hover-subtle); }


.inst-sort-btn {
  padding: 5px 12px; border: 1px solid var(--border); border-radius: 4px;
  background: transparent; color: var(--text-muted); font-family: var(--font-ui);
  font-size: .84rem; font-weight: 600; cursor: pointer; transition: all var(--ease);
}
.inst-sort-btn:hover { color: var(--text-bright); border-color: var(--border-hi); }
.inst-sort-btn.active {
  color: var(--text-bright); background: var(--hover-medium);
  border-color: var(--surface-border-hi);
}


.inst-search-input {
  width: 100%; padding: 7px 10px 7px 28px;
  background: var(--divider-soft); border: 1px solid var(--border);
  border-radius: var(--radius-sm); color: var(--text);
  font-family: var(--font-ui); font-size: .90rem; outline: none;
  margin-bottom: 10px; transition: border-color var(--ease);
}
.inst-search-input:focus { border-color: var(--blue); }
.inst-search-wrap { position: relative; }
.inst-search-wrap::before {
  content: '\1F50D'; position: absolute; left: 8px; top: 50%;
  transform: translateY(-50%); font-size: .82rem; opacity: .4; pointer-events: none;
}


.inst-sentiment {
  display: flex; flex-direction: column; padding: 0;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-md); margin-bottom: 24px; overflow: hidden;
}
.inst-sent-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 20px; border-bottom: 1px solid var(--border);
}
.inst-sent-title {
  font-family: var(--font-ui); font-size: .90rem; font-weight: 700;
  color: var(--text-bright); text-transform: uppercase; letter-spacing: .06em;
}
.inst-sent-controls { display: flex; gap: 6px; }
.inst-hdr-select {
  padding: 4px 24px 4px 8px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--divider-soft); color: var(--text-bright); font-family: var(--font-ui);
  font-size: .84rem; font-weight: 600; cursor: pointer; transition: border-color var(--ease);
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23888'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 8px center;
}
.inst-hdr-select:hover { border-color: var(--border-hi); }
.inst-hdr-select:focus { outline: none; border-color: var(--blue); }
.inst-hdr-select option { background: var(--card); color: var(--text-bright); }
.inst-sent-body { display: flex; align-items: center; gap: 28px; padding: 20px; }


.inst-modal-overlay {
  display: none; position: fixed; inset: 0; z-index: 9999;
  background: var(--overlay-bg); backdrop-filter: blur(6px);
  justify-content: center; align-items: center;
}
.inst-modal-overlay.open { display: flex; }
.inst-modal {
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-lg); width: 580px; max-width: 92vw;
  max-height: 82vh; display: flex; flex-direction: column;
  overflow: hidden; box-shadow: var(--overlay-shadow);
}
.inst-modal-head {
  padding: 18px 22px 14px; border-bottom: 1px solid var(--border);
  display: flex; justify-content: space-between; align-items: flex-start;
}
.inst-modal-title {
  font-family: var(--font-ui); font-size: 1.28rem; font-weight: 700;
  color: var(--text-bright);
}
.inst-modal-title .inst-modal-ticker { color: var(--blue); margin-right: 6px; }
.inst-modal-title .inst-modal-name {
  color: var(--text-dim); font-weight: 400; font-size: 1rem;
  display: block; margin-top: 2px;
}
.inst-modal-close {
  width: 26px; height: 26px; border: none; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-dim); font-size: 1.2rem;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.inst-modal-close:hover { background: var(--hover-medium); color: var(--text-bright); }
.inst-modal-summary {
  padding: 12px 22px; display: flex; gap: 18px;
  border-bottom: 1px solid var(--border); font-size: .92rem;
}
.inst-modal-stat { display: flex; flex-direction: column; gap: 2px; }
.inst-modal-stat label {
  color: var(--text-muted); font-family: var(--font-ui);
  font-size: .82rem; text-transform: uppercase; letter-spacing: .4px;
}
.inst-modal-stat .val {
  font-family: var(--font-ui); font-weight: 700; font-size: 1.02rem;
  color: var(--text-bright);
}
.inst-modal-stat .val.green { color: var(--green); }
.inst-modal-stat .val.red { color: var(--red); }
.inst-modal-body { flex: 1; overflow-y: auto; padding: 0; }
.inst-modal-section { padding: 14px 22px 6px; }
.inst-modal-section-title {
  font-family: var(--font-ui);
  font-size: .86rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .7px; color: var(--text-muted); margin-bottom: 8px;
}
.inst-insider-row {
  display: flex; align-items: center; gap: 12px;
  padding: 9px 0; border-bottom: 1px solid var(--divider-soft);
}
.inst-insider-row:last-child { border-bottom: none; }
.inst-insider-icon {
  width: 30px; height: 30px; border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-ui); font-size: .84rem; font-weight: 700;
  flex-shrink: 0;
}
.inst-insider-icon.buy { background: var(--green-dim); color: var(--green); }
.inst-insider-icon.sell { background: var(--red-dim); color: var(--red); }
.inst-insider-info { flex: 1; min-width: 0; }
.inst-insider-name {
  font-family: var(--font-ui); font-size: .96rem; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: var(--text-bright);
}
.inst-insider-role {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-muted); margin-top: 1px;
}
.inst-insider-vals { text-align: right; flex-shrink: 0; }
.inst-insider-amt { font-family: var(--font-ui); font-size: .96rem; font-weight: 700; }
.inst-insider-shares {
  font-family: var(--font-ui); font-size: .82rem;
  color: var(--text-muted); margin-top: 1px;
}


.inst-empty {
  padding: 20px 0; text-align: center; font-family: var(--font-ui);
  font-size: .90rem; color: var(--text-muted);
}




.cot-overlay {
  display: none; position: fixed; inset: 0; z-index: 9000;
  background: var(--bg);
}
.cot-overlay.open { display: flex; }

.cot-panel {
  width: 100%; height: 100%;
  background: var(--bg);
  display: flex; flex-direction: column;
  overflow: hidden;
}


.cot-header {
  padding: 14px 24px 0;
  border-bottom: 1px solid var(--border, #1f2334);
  background: linear-gradient(180deg, var(--surface-veil) 0%, transparent 100%);
  flex-shrink: 0;
}
.cot-header-top {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;
}
.cot-title {
  font-size: 1.375rem; font-weight: 700; color: var(--text-bright, #e8ebf4);
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-ui);
}
.cot-title::before {
  content: ''; display: inline-block; width: 3px; height: 18px;
  background: var(--blue, #4da6ff); border-radius: 2px;
}
.cot-subtitle {
  font-size: 0.855rem; color: var(--text-muted, #5c6180); font-weight: 500;
  margin-top: 2px; display: flex; align-items: center; gap: 8px;
  font-family: var(--font-ui);
}
.cot-close {
  width: 26px; height: 26px; border: none; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-muted);
  font-size: 1.2rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ease);
}
.cot-close:hover { background: var(--hover-medium); color: var(--text-bright); }


.cot-lang-toggle { display: flex; gap: 2px; background: var(--divider-soft); border-radius: var(--radius-sm); padding: 2px; }
.cot-lang-btn {
  background: transparent; border: none; color: var(--text-muted);
  font-size: .75rem; font-weight: 600; padding: 3px 10px; border-radius: 4px;
  cursor: pointer; transition: all var(--ease); letter-spacing: .03em;
  font-family: var(--font-ui);
}
.cot-lang-btn:hover { color: var(--text-bright); background: var(--surface-raised); }
.cot-lang-btn.active { color: var(--text-bright); background: var(--surface-border); }


.cot-report-badge {
  display: inline-block; padding: 1px 7px; border-radius: 4px;
  font-size: 0.725rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  font-family: var(--font-ui);
}
.cot-report-badge.tff { background: var(--blue-dim); color: var(--blue); }
.cot-report-badge.disagg { background: var(--purple-dim); color: var(--purple); }
.cot-report-badge.legacy { background: var(--amber-dim); color: var(--amber); }

.cot-report-date {
  font-family: var(--font-ui); font-size: 0.845rem; color: var(--text-dim, #8a90ab);
  background: var(--divider-soft); padding: 4px 10px; border-radius: var(--radius-sm);
  border: 1px solid var(--border);
}


.cot-datasrc-toggle {
  display: inline-flex; background: var(--divider-soft);
  border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden;
}
.cot-datasrc-btn {
  padding: 4px 10px; border: none; background: transparent; color: var(--text-muted);
  font-family: var(--font-ui); font-size: 0.78rem; font-weight: 600;
  cursor: pointer; transition: all var(--ease); white-space: nowrap;
}
.cot-datasrc-btn.active { background: rgba(77,166,255,.12); color: var(--blue); }
.cot-datasrc-btn:hover:not(.active) { color: var(--text); background: var(--hover-subtle); }


.cot-dir-grid { display: flex; flex-direction: column; gap: 0; }
.cot-dir-header {
  display: grid; grid-template-columns: 1fr 80px 80px; gap: 4px; padding: 0 0 6px;
  border-bottom: 1px solid var(--surface-raised);
}
.cot-dir-header span {
  font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-muted); text-align: center; font-family: var(--font-ui);
}
.cot-dir-header span:first-child { text-align: left; }
.cot-dir-row {
  display: grid; grid-template-columns: 1fr 80px 80px; gap: 4px; align-items: center;
  padding: 7px 0;
}
.cot-dir-row + .cot-dir-row { border-top: 1px solid var(--hover-subtle); }
.cot-dir-name {
  font-size: .86rem; font-weight: 600; color: var(--text-bright);
  display: flex; align-items: center; gap: 5px; font-family: var(--font-ui);
}
.cot-dir-name .cot-player-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.cot-dir-badge {
  display: flex; align-items: center; justify-content: center; gap: 3px;
  padding: 3px 8px; border-radius: 4px; font-size: .74rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .03em; font-family: var(--font-ui);
}
.cot-dir-badge.buying { background: var(--green-dim); color: var(--green); }
.cot-dir-badge.selling { background: var(--red-dim); color: var(--red); }
.cot-dir-badge.flat { background: var(--divider-soft); color: var(--text-muted); }
.cot-dir-badge .cot-dir-arrow { font-size: .65rem; }


.cot-left-panel {
  width: 180px; min-width: 180px; overflow-y: auto;
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 0;
  background: var(--panel);
}
.cot-left-panel::-webkit-scrollbar { width: 3px; }
.cot-left-panel::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
.cot-left-search {
  padding: 10px 10px 8px; border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.cot-left-search-input {
  width: 100%; padding: 7px 10px 7px 30px; background: var(--surface-raised);
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  color: var(--text-bright); font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  outline: none; transition: all var(--ease); cursor: pointer;
}
.cot-left-search-input::placeholder { color: var(--text-muted); }
.cot-left-search-input:hover { border-color: var(--surface-border-hi); background: var(--surface-border); }
.cot-left-search-wrap2 { position: relative; display: flex; align-items: center; }
.cot-left-search-icon {
  position: absolute; left: 8px; width: 14px; height: 14px; color: var(--text-muted);
  pointer-events: none;
}
.cot-left-group-title {
  font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
  color: var(--text-muted); padding: 10px 10px 4px; pointer-events: none;
  font-family: var(--font-ui);
}
.cot-left-group-title:first-child { padding-top: 8px; }
.cot-left-item {
  padding: 5px 10px; font-size: .82rem; font-weight: 500; color: var(--text-dim);
  cursor: pointer; transition: all var(--ease); border-left: 2px solid transparent;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-family: var(--font-ui);
}
.cot-left-item:hover { color: var(--text-bright); background: var(--hover-subtle); }
.cot-left-item.active { color: var(--blue); border-left-color: var(--blue); background: rgba(77,166,255,.12); font-weight: 600; }


.cot-main { flex: 1; display: flex; overflow: hidden; }
.cot-chart-area {
  flex: 1; display: flex; flex-direction: column; overflow: hidden;
  border-right: 1px solid var(--border);
}
.cot-sidebar {
  width: 470px; min-width: 470px; overflow-y: auto; padding: 0;
  background: var(--surface-veil); display: flex; flex-direction: column; gap: 0;
}
.cot-sidebar > .cot-chat-response,
.cot-sidebar > div:last-child { padding: 0 16px 16px; }


.cot-ai-header {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.cot-ai-stars { width: 24px; height: 24px; flex-shrink: 0; }
.cot-ai-stars .star-big { fill: var(--purple); }
.cot-ai-stars .star-small { fill: var(--blue); }
.cot-ai-stars .star-big {
  transform-origin: center; transform-box: fill-box;
  animation: cotPulseStar 2s ease-in-out infinite;
}
.cot-ai-stars .star-small {
  transform-origin: center; transform-box: fill-box;
  animation: cotPulseStar 2s ease-in-out infinite .5s;
}
@keyframes cotPulseStar {
  0%, 100% { transform: scale(.8); opacity: .7; }
  50% { transform: scale(1.1); opacity: 1; }
}
.cot-ai-header-text { display: flex; flex-direction: column; gap: 2px; }
.cot-ai-header-title {
  font-size: .82rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  background: linear-gradient(135deg, var(--purple), var(--blue));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; font-family: var(--font-ui);
}
.cot-ai-header-sub {
  font-size: .82rem; color: var(--text-muted); font-weight: 400;
  font-family: var(--font-ui);
}


.cot-topstrip {
  display: grid; gap: 0; border-bottom: 1px solid var(--border);
}
.cot-topstrip-cell {
  padding: 10px 16px;
  display: flex; flex-direction: column; justify-content: center;
}
.cot-topstrip-cell + .cot-topstrip-cell { border-left: 1px solid var(--border); }
.cot-topstrip-label {
  font-size: 0.725rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--text-muted); margin-bottom: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-family: var(--font-ui);
}
.cot-topstrip-factor-fill { height: 100%; border-radius: 2px; }
.cot-topstrip-factor-val { font-family: var(--font-ui); font-size: 0.685rem; font-weight: 600; width: 24px; text-align: right; }
.cot-topstrip-row { display: flex; align-items: center; gap: 8px; }
.cot-topstrip-val { font-family: var(--font-ui); font-size: 1.045rem; font-weight: 700; min-width: 36px; }
.cot-topstrip-gauge {
  flex: 1; height: 5px; background: var(--surface-raised);
  border-radius: 3px; overflow: hidden; min-width: 60px;
}
.cot-topstrip-gauge-fill { height: 100%; border-radius: 3px; transition: width .4s ease; }
.cot-topstrip-chg { font-family: var(--font-ui); font-size: 0.745rem; font-weight: 600; }


.cot-chart-toolbar {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 14px; border-bottom: 1px solid var(--border);
  background: var(--surface-veil); flex-shrink: 0;
}
.cot-chart-toolbar > :last-child { margin-left: auto; }
.cot-mode-select {
  padding: 5px 28px 5px 10px; border: 1px solid var(--border-hi);
  background-color: var(--card);
  color: var(--text-bright); font-family: var(--font-ui); font-size: 0.875rem; font-weight: 600;
  border-radius: var(--radius-sm); cursor: pointer; transition: all var(--ease);
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238a90ab'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 8px center;
  min-width: 180px;
  color-scheme: dark;
}
.cot-mode-select:hover { border-color: var(--blue); }
.cot-mode-select:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 2px var(--blue-dim); }
.cot-mode-select option { background-color: var(--card); color: var(--text); }


.cot-add-btn {
  width: 28px; height: 28px; border: 1px solid var(--surface-border-hi);
  background: var(--divider-soft);
  color: var(--text-muted); font-size: 1.125rem; font-weight: 600; border-radius: var(--radius-sm);
  cursor: pointer; transition: all var(--ease); display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cot-add-btn:hover { border-color: var(--blue); color: var(--blue); }
.cot-add-wrap { position: relative; }
.cot-add-popup {
  display: none; position: absolute; top: 34px; left: 0; z-index: 200;
  background: var(--card); border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm);
  box-shadow: var(--overlay-shadow, 0 8px 24px rgba(0,0,0,.5)); min-width: 220px; max-height: 320px;
  overflow-y: auto; padding: 4px 0;
}
.cot-add-popup.open { display: block; }
.cot-add-popup::-webkit-scrollbar { width: 4px; }
.cot-add-popup::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
.cot-add-group {
  font-size: 0.705rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-muted); padding: 6px 12px 3px; pointer-events: none;
  font-family: var(--font-ui);
}
.cot-add-item {
  padding: 5px 12px; font-size: 0.825rem; color: var(--text); cursor: pointer;
  transition: background var(--ease); display: flex; align-items: center; gap: 8px;
  font-family: var(--font-ui);
}
.cot-add-item:hover { background: var(--hover-medium); }
.cot-add-item.active { color: var(--blue); }
.cot-add-item .cot-add-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }


.cot-overlays-bar {
  position: absolute; top: 30px; right: 12px; z-index: 50;
  display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end;
  pointer-events: auto;
}
.cot-overlay-chip {
  display: flex; align-items: center; gap: 4px;
  background: var(--card); border: 1px solid var(--border);
  padding: 2px 6px 2px 8px; border-radius: var(--radius-sm);
  font-size: 0.705rem; font-weight: 600; color: var(--text-dim);
  font-family: var(--font-ui);
}
.cot-overlay-chip-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  border: none; padding: 0; cursor: pointer;
  transition: transform var(--ease);
}
.cot-overlay-chip-dot:hover { transform: scale(1.35); }
.cot-overlay-chip-x {
  width: 14px; height: 14px; border: none; background: transparent;
  color: var(--text-muted); font-size: 0.825rem; cursor: pointer; display: flex;
  align-items: center; justify-content: center; border-radius: 50%;
  transition: all var(--ease);
}
.cot-overlay-chip-x:hover { background: var(--hover-medium); color: var(--red); }


.cot-overlay-toggle {
  display: flex; align-items: center; gap: 8px; cursor: pointer; user-select: none;
}
.cot-overlay-toggle input { display: none; }
.cot-toggle-track {
  width: 32px; height: 18px; border-radius: 9px;
  background: var(--surface-border); position: relative;
  transition: background var(--ease);
}
.cot-overlay-toggle input:checked ~ .cot-toggle-track { background: rgba(77,166,255,.12); }
.cot-toggle-thumb {
  position: absolute; top: 2px; left: 2px; width: 14px; height: 14px;
  border-radius: 50%; background: var(--text-muted);
  transition: all var(--ease);
}
.cot-overlay-toggle input:checked ~ .cot-toggle-track .cot-toggle-thumb {
  left: 16px; background: var(--blue);
}
.cot-toggle-label { font-size: 0.805rem; font-weight: 600; color: var(--text-muted); font-family: var(--font-ui); }
.cot-overlay-toggle input:checked ~ .cot-toggle-label { color: var(--blue); }
.cot-overlay-ctl { display: flex; align-items: center; gap: 8px; }


.cot-ovcolor-btn {
  width: 24px; height: 24px; flex-shrink: 0; padding: 0;
  border: 1px solid var(--border-hi); border-radius: var(--radius-sm);
  background: var(--card); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all var(--ease);
}
.cot-ovcolor-btn:hover { border-color: var(--blue); }
.cot-ovcolor-btn:disabled { opacity: .35; cursor: default; }
.cot-ovcolor-swatch { width: 12px; height: 12px; border-radius: 3px; display: block; background: var(--blue); }
.cot-color-popup {
  
  position: fixed; z-index: 9600; padding: 8px;
  background: var(--card); border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm);
  box-shadow: var(--overlay-shadow, 0 8px 24px rgba(0,0,0,.5));
}
.cot-color-grid { display: grid; grid-template-columns: repeat(7, 18px); gap: 6px; }
.cot-color-sw {
  width: 18px; height: 18px; padding: 0; border-radius: 4px;
  border: 1px solid var(--border); cursor: pointer; transition: transform var(--ease);
}
.cot-color-sw:hover { transform: scale(1.15); }
.cot-color-sw.active { border-color: var(--text-bright); box-shadow: 0 0 0 2px var(--blue-dim); }
.cot-color-custom {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border);
  font-family: var(--font-ui); font-size: 0.705rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); cursor: pointer;
}
.cot-color-custom input {
  width: 30px; height: 20px; padding: 0; cursor: pointer;
  border: 1px solid var(--border); border-radius: 4px; background: transparent;
}


.cot-chart-wrap { flex: 1; position: relative; min-height: 0; overflow: hidden; }
.cot-chart-label {
  position: absolute; top: 8px; left: 12px; z-index: 50;
  font-size: 0.805rem; font-weight: 600; color: var(--text-dim);
  text-transform: uppercase; letter-spacing: .08em;
  background: var(--label-bg, var(--card)); padding: 3px 10px; border-radius: var(--radius-sm);
  pointer-events: none; font-family: var(--font-ui);
}
.cot-chart-sublabel {
  position: absolute; top: 8px; right: 12px; z-index: 50;
  font-size: 0.725rem; color: var(--text-muted); font-weight: 500;
  background: var(--label-bg, var(--card)); padding: 3px 8px; border-radius: var(--radius-sm);
  pointer-events: none; font-family: var(--font-ui);
}
.cot-bottom-header {
  position: absolute; top: 0; left: 0; right: 0; z-index: 50;
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 6px 12px; pointer-events: none;
}
.cot-bottom-header > * { pointer-events: auto; }
.cot-bottom-header .cot-chart-label,
.cot-bottom-header .cot-chart-sublabel {
  position: static; background: none; padding: 0;
}


.cot-legend {
  position: absolute; top: 30px; left: 12px; z-index: 50;
  display: flex; gap: 6px; flex-wrap: wrap;
  background: var(--label-bg, var(--card)); padding: 3px 6px; border-radius: var(--radius-sm);
  pointer-events: auto;
}
.cot-legend-item {
  display: flex; align-items: center; gap: 5px;
  font-size: 0.745rem; color: var(--text-dim); font-weight: 500;
  font-family: var(--font-ui);
}
.cot-legend-item.clickable {
  cursor: pointer; padding: 2px 6px; border-radius: var(--radius-sm);
  transition: all var(--ease); user-select: none;
}
.cot-legend-item.clickable:hover { background: var(--hover-subtle); }
.cot-legend-item.disabled { opacity: .3; }
.cot-legend-item.disabled .cot-legend-dot { background: var(--text-muted) !important; }
.cot-legend-dot { width: 8px; height: 3px; border-radius: 2px; }


.cot-bottom-charts {
  display: flex; border-top: 1px solid var(--border); height: 220px; min-height: 220px;
}
.cot-bottom-chart { flex: 1; position: relative; min-width: 0; }
.cot-bottom-chart + .cot-bottom-chart { border-left: 1px solid var(--border); }


.cot-chat-response {
  font-family: var(--font-ui); font-size: 1.095rem; line-height: 1.75; color: var(--text);
}
.cot-chat-response p { margin-bottom: 14px; }
.cot-chat-response p:last-child { margin-bottom: 0; }
.cot-chat-response strong { color: var(--text-bright); }
.cot-chat-response .hl-green { color: var(--green); font-weight: 600; }
.cot-chat-response .hl-red { color: var(--red); font-weight: 600; }
.cot-chat-response .hl-amber { color: var(--amber); font-weight: 600; }
.cot-chat-response .hl-blue { color: var(--blue); font-weight: 600; }
.cot-chat-response .num { font-family: var(--font-ui); font-weight: 600; }


.cot-section {
  margin-bottom: 20px; padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.cot-section:last-child { border-bottom: none; margin-bottom: 0; }
.cot-section-header { margin-bottom: 16px; }
.cot-section-title-row { display: flex; align-items: baseline; gap: 8px; }
.cot-section-num {
  font-family: var(--font-ui); font-size: 1.5rem; font-weight: 700;
  color: var(--text-bright); line-height: 1.15; letter-spacing: -.01em;
}
.cot-section-title {
  font-family: var(--font-ui); font-size: 1.5rem; font-weight: 700;
  color: var(--text-bright); line-height: 1.15; letter-spacing: -.01em;
}
.cot-section-subtitle {
  font-size: 0.82rem; font-weight: 500; color: var(--text-muted); margin-top: 4px;
  font-family: var(--font-ui);
}
.cot-section-prose {
  font-size: 0.95rem; line-height: 1.65; color: var(--text);
  margin-bottom: 10px; font-family: var(--font-ui);
}
.cot-section-prose:last-child { margin-bottom: 0; }
.cot-section-prose strong { color: var(--text-bright); }
.cot-section-prose .hl-green { color: var(--green); font-weight: 600; }
.cot-section-prose .hl-red { color: var(--red); font-weight: 600; }
.cot-section-prose .hl-amber { color: var(--amber); font-weight: 600; }
.cot-section-prose .hl-blue { color: var(--blue); font-weight: 600; }
.cot-section-prose .num { font-family: var(--font-ui); font-weight: 600; }


.cot-collapse-trigger {
  display: flex; align-items: center; gap: 6px; cursor: pointer;
  padding: 6px 0; user-select: none;
}
.cot-collapse-trigger:hover .cot-section-title { color: var(--blue); }
.cot-collapse-trigger .cot-caret {
  font-size: 0.6rem; color: var(--text-muted); transition: transform .2s ease;
}
.cot-collapse-trigger.open .cot-caret { transform: rotate(90deg); }
.cot-collapse-body { display: none; padding-bottom: 4px; }
.cot-collapse-body.open { display: block; }


.cot-player-card { margin-bottom: 8px; }
.cot-player-name {
  font-size: 0.92rem; font-weight: 700; color: var(--text-bright);
  margin-bottom: 2px; display: flex; align-items: center; gap: 5px;
  font-family: var(--font-ui);
}
.cot-player-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.cot-player-desc {
  font-size: 0.88rem; color: var(--text-dim); line-height: 1.5;
  font-family: var(--font-ui);
}


.cot-delta-row { display: flex; align-items: center; gap: 6px; padding: 5px 0; }
.cot-delta-row + .cot-delta-row { border-top: 1px solid var(--divider-soft); }
.cot-delta-label {
  font-size: .82rem; font-weight: 500; color: var(--text-dim); width: 70px; flex-shrink: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-family: var(--font-ui);
}
.cot-delta-track {
  flex: 1; height: 7px; background: var(--surface-raised);
  border-radius: 4px; position: relative; overflow: hidden;
}
.cot-delta-center {
  position: absolute; left: 50%; top: 0; bottom: 0; width: 1px;
  background: var(--surface-border);
}
.cot-delta-fill { position: absolute; top: 0; bottom: 0; border-radius: 4px; }
.cot-delta-sent {
  width: 48px; flex-shrink: 0; font-size: .78rem; font-weight: 600; text-align: right;
  font-family: var(--font-ui);
}


.cot-idx-row { display: flex; align-items: center; gap: 6px; padding: 4px 0; }
.cot-idx-label {
  font-size: .82rem; font-weight: 500; color: var(--text-dim); width: 70px; flex-shrink: 0;
  font-family: var(--font-ui);
}
.cot-idx-track {
  flex: 1; height: 8px; border-radius: 4px; position: relative;
  background: linear-gradient(90deg, #ef4444 0%, #f87171 20%, #fb923c 35%, #facc15 45%, #a3a3a3 50%, #a3e635 55%, #4ade80 65%, #22c55e 80%, #16a34a 100%);
}
.cot-idx-marker {
  position: absolute; top: -3px; width: 3px; height: 14px;
  border-radius: 1px; transform: translateX(-50%);
  background: #fff !important; box-shadow: 0 0 6px rgba(0,0,0,.6);
}
.cot-idx-val { font-family: var(--font-ui); font-size: .78rem; font-weight: 700; width: 26px; text-align: right; }
.cot-idx-lbl { font-size: .72rem; font-weight: 600; width: 80px; text-align: right; font-family: var(--font-ui); }
.cot-idx-delta { font-family: var(--font-ui); font-size: .68rem; font-weight: 600; width: 28px; text-align: right; }


.cot-chat-widget {
  background: var(--hover-subtle); border: 1px solid var(--surface-raised);
  border-radius: var(--radius-md); padding: 12px 14px; margin: 14px 0;
}
.cot-chat-widget-title {
  font-size: 0.945rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .06em; color: var(--text-muted); margin-bottom: 10px;
  font-family: var(--font-ui);
}
.cot-chat-widget table td,
.cot-chat-widget table th { padding: 4px; }


.cot-pos-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
.cot-pos-row + .cot-pos-row { border-top: 1px solid var(--divider-soft); }
.cot-pos-label {
  font-size: .88rem; font-weight: 500; color: var(--text-dim); width: 84px; flex-shrink: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font-family: var(--font-ui);
}
.cot-pos-bar-wrap {
  flex: 1; height: 8px; background: var(--surface-raised); border-radius: 4px;
  position: relative; overflow: hidden; display: flex;
}
.cot-pos-bar-long { height: 100%; border-radius: 4px 0 0 4px; transition: width .4s ease; background: var(--green); }
.cot-pos-bar-short { height: 100%; border-radius: 0 4px 4px 0; transition: width .4s ease; background: var(--red); }
.cot-pos-pct {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  width: 38px; text-align: right; flex-shrink: 0; color: var(--text-dim);
}
.cot-pos-net {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  width: 62px; text-align: right; flex-shrink: 0;
}
.cot-pos-net.net-pos { color: var(--green); }
.cot-pos-net.net-neg { color: var(--red); }


.cot-conc-bar-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.cot-conc-bar-row:last-child { margin-bottom: 0; }
.cot-conc-bar-label {
  font-size: 0.82rem; font-weight: 500; color: var(--text-dim);
  width: 82px; flex-shrink: 0; text-align: right; font-family: var(--font-ui);
}
.cot-conc-bar-track {
  flex: 1; height: 12px; background: var(--hover-subtle);
  border-radius: var(--radius-sm); overflow: hidden;
}
.cot-conc-bar-fill { height: 100%; border-radius: var(--radius-sm); transition: width .4s ease; }
.cot-conc-bar-val {
  font-family: var(--font-ui); font-size: 0.84rem; font-weight: 600;
  width: 50px; flex-shrink: 0;
}


.cot-market-trigger {
  cursor: pointer; display: flex; align-items: center; gap: 6px;
  padding: 2px 8px 2px 0; border-radius: var(--radius-sm);
  transition: background var(--ease);
}
.cot-market-trigger:hover { background: var(--hover-subtle); }
.cot-market-trigger .cot-market-caret {
  font-size: 0.725rem; color: var(--text-muted); transition: transform var(--ease);
}
.cot-market-trigger.open .cot-market-caret { transform: rotate(180deg); }

.cot-market-overlay {
  display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  z-index: 9500; background: rgba(0,0,0,.6); backdrop-filter: blur(4px);
  align-items: flex-start; justify-content: center; padding-top: 8vh;
}
.cot-market-overlay.open { display: flex; }

.cot-market-modal {
  width: 600px; max-width: 92vw; max-height: 78vh;
  background: var(--panel); border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg); box-shadow: var(--overlay-shadow);
  display: flex; flex-direction: column; overflow: hidden;
}
.cot-market-search-wrap {
  padding: 16px 18px 12px; border-bottom: 1px solid var(--border);
}
.cot-market-search {
  width: 100%; padding: 10px 14px; background: var(--divider-soft);
  border: 1px solid var(--surface-border-hi); border-radius: var(--radius-sm);
  color: var(--text-bright); font-family: var(--font-ui); font-size: 0.975rem;
  outline: none; transition: border-color var(--ease);
}
.cot-market-search::placeholder { color: var(--text-muted); }
.cot-market-search:focus { border-color: var(--blue); }

.cot-market-featured {
  padding: 10px 18px 6px; border-bottom: 1px solid var(--border);
}
.cot-market-featured-title {
  font-size: 0.725rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: var(--text-muted); margin-bottom: 8px;
  font-family: var(--font-ui);
}
.cot-market-featured-grid { display: flex; flex-wrap: wrap; gap: 6px; padding-bottom: 4px; }
.cot-market-chip {
  padding: 5px 12px; background: var(--divider-soft); border: 1px solid var(--border);
  border-radius: var(--radius-sm); font-size: 0.845rem; font-weight: 600;
  color: var(--text-dim); cursor: pointer; transition: all var(--ease);
  white-space: nowrap; font-family: var(--font-ui);
}
.cot-market-chip:hover { border-color: var(--blue); color: var(--text-bright); }
.cot-market-chip.active { border-color: var(--blue); color: var(--blue); background: rgba(77,166,255,.12); }

.cot-market-list-wrap { flex: 1; overflow-y: auto; padding: 4px 0; }
.cot-market-list-wrap::-webkit-scrollbar { width: 4px; }
.cot-market-list-wrap::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }

.cot-market-list-group {
  font-size: 0.705rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--text-muted); padding: 8px 18px 3px;
  pointer-events: none; font-family: var(--font-ui);
}
.cot-market-list-item {
  padding: 7px 18px; font-size: 0.885rem; color: var(--text);
  cursor: pointer; transition: background var(--ease);
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--font-ui);
}
.cot-market-list-item:hover { background: var(--hover-medium); }
.cot-market-list-item.active { color: var(--blue); }
.cot-market-list-item .cot-market-exchange {
  font-size: 0.725rem; color: var(--text-muted); font-weight: 500;
}
.cot-market-empty {
  padding: 24px 18px; text-align: center; color: var(--text-muted); font-size: 0.945rem;
  font-family: var(--font-ui);
}
.cot-market-count {
  padding: 6px 18px 10px; font-size: 0.725rem; color: var(--text-muted);
  border-top: 1px solid var(--border); text-align: center;
  font-family: var(--font-ui);
}


.cot-loading {
  display: flex; align-items: center; justify-content: center; height: 100%;
  color: var(--text-muted); font-size: 0.945rem; gap: 8px;
  font-family: var(--font-ui);
}
.cot-loading .cot-spinner {
  width: 16px; height: 16px; border: 2px solid var(--border);
  border-top-color: var(--blue); border-radius: 50%;
  animation: cotSpin .6s linear infinite;
}
@keyframes cotSpin { to { transform: rotate(360deg); } }


.cot-reveal {
  opacity: 0; transform: translateY(12px);
  animation: cotRevealIn 1.2s ease forwards;
}
@keyframes cotRevealIn { to { opacity: 1; transform: translateY(0); } }


.cot-sidebar::-webkit-scrollbar { width: 4px; }
.cot-sidebar::-webkit-scrollbar-track { background: transparent; }
.cot-sidebar::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }


.cot-tf-pills {
  display: flex; gap: 2px;
  background: var(--divider-soft); border-radius: var(--radius-sm); padding: 2px;
}
.cot-tf-pill {
  background: transparent; border: none; color: var(--text-muted);
  font-family: var(--font-ui); font-size: 0.845rem; font-weight: 600;
  padding: 4px 10px; border-radius: 4px; cursor: pointer;
  transition: all var(--ease);
}
.cot-tf-pill:hover { color: var(--text); background: var(--hover-subtle); }
.cot-tf-pill.active { color: var(--text-bright); background: var(--surface-border-hi); }


.cot-bottom-pills {
  display: flex; gap: 2px;
  background: var(--label-bg, var(--card)); border-radius: var(--radius-sm); padding: 2px;
}
.cot-bottom-pill {
  background: transparent; border: none; color: var(--text-dim);
  font-family: var(--font-ui); font-size: 0.725rem; font-weight: 500;
  padding: 3px 8px; border-radius: 4px; cursor: pointer;
  transition: all var(--ease);
}
.cot-bottom-pill:hover { color: var(--text); background: var(--hover-subtle); }
.cot-bottom-pill.active {
  color: var(--text-bright); background: var(--hover-medium);
  border-bottom: 1.5px solid var(--text-bright);
}




.pc-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  font-family: var(--font-ui);
}


.pc-settings {
  padding: 14px 16px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
}


.pc-seg {
  display: flex;
  gap: 2px;
  padding: 2px;
  margin-bottom: 8px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}
.pc-seg-btn {
  flex: 1;
  padding: 5px 0;
  text-align: center;
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
}
.pc-seg-btn:hover { background: var(--hover-subtle); }
.pc-seg-btn.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
}


.pc-toggle {
  width: 34px;
  height: 18px;
  border-radius: 9px;
  background: var(--border-hi);
  border: 1px solid var(--border);
  cursor: pointer;
  padding: 2px;
  transition: background var(--ease);
}
.pc-toggle span {
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--text-dim);
  transition: all var(--ease);
}
.pc-toggle.on { background: var(--blue); border-color: var(--blue); }
.pc-toggle.on span { transform: translateX(16px); background: #fff; }


.pc-caption {
  font-size: .78rem;
  color: var(--text-muted);
  margin-top: 10px;
}

.pc-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
}


.pc-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 6px 0;
}
.pc-select-full { width: 100%; }
.pc-select-full .pc-ov-select {
  width: 100%;
  padding: 6px 22px 6px 8px;
}


.pc-inert-row .pc-pills { opacity: .4; pointer-events: none; }
.pc-inert-val {
  font-size: .82rem;
  color: var(--text-muted);
  font-style: italic;
}

.pc-label {
  font-size: .85rem;
  font-weight: 500;
  color: var(--text);
}

.pc-input {
  width: 68px;
  height: 28px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-bright);
  font-family: var(--font-ui);
  font-size: .85rem;
  text-align: center;
  outline: none;
  transition: border-color var(--ease);
}
.pc-input:focus { border-color: var(--blue); }
.pc-input::-webkit-inner-spin-button,
.pc-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }


.pc-slider {
  flex: 1;
  -webkit-appearance: none;
  height: 4px;
  background: var(--border-hi);
  border-radius: 2px;
  outline: none;
}
.pc-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 14px; height: 14px;
  background: var(--blue);
  border-radius: 50%;
  cursor: pointer;
}

.pc-pills {
  display: flex;
  gap: 4px;
}
.pc-pill {
  padding: 4px 10px;
  border-radius: var(--radius-sm);
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--ease);
}
.pc-pill:hover { background: var(--hover-subtle); }
.pc-pill.active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  border-color: transparent;
}


.pc-year-slider {
  padding: 8px 0 4px;
}


.pc-run-btn {
  width: 100%;
  margin-top: 12px;
  padding: 9px 0;
  background: var(--blue);
  border: none;
  border-radius: var(--radius-sm);
  color: #fff;
  font-family: var(--font-ui);
  font-size: .90rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--ease);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.pc-run-btn:hover { background: var(--blue-hover); }
.pc-run-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.pc-run-btn.loading {
  pointer-events: none;
  opacity: .7;
}


.pc-spinner {
  width: 14px; height: 14px;
  border: 2px solid rgba(255,255,255,.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: pcSpin .6s linear infinite;
}
@keyframes pcSpin { to { transform: rotate(360deg); } }


.pc-progress {
  display: none;
  margin-top: 12px;
  padding: 14px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}
.pc-progress.on { display: block; }

.pc-steps {
  display: flex;
  flex-direction: column;
  gap: 16px;
}


.pc-step {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.pc-step-body { flex: 1 1 auto; min-width: 0; }

.pc-step .pc-spinner {
  flex: 0 0 auto;
  width: 16px; height: 16px;
  margin-top: 1px;
  border-width: 2px;
  border-color: var(--border-hi);
  border-top-color: var(--blue);
}
.pc-step-icon {
  flex: 0 0 auto;
  width: 16px; height: 16px;
  margin-top: 1px;
  display: flex; align-items: center; justify-content: center;
  font-size: .95rem; line-height: 1; font-weight: 700;
  color: var(--green);
}

.pc-step-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 7px;
}
.pc-step-label {
  font-size: .88rem;
  line-height: 1.25;
  color: var(--text);
  
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pc-step-value {
  flex: 0 0 auto;
  font-size: .85rem;
  font-weight: 600;
  color: var(--text-bright);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pc-step.ok .pc-step-label { color: var(--text-dim); }
.pc-step.ok .pc-step-value { color: var(--text-muted); font-weight: 500; }


.pc-bar {
  height: 6px;
  border-radius: 999px;
  background: var(--border-hi);
  overflow: hidden;
}
.pc-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: var(--blue);
  
  transition: width .45s ease-out;
}
.pc-bar.done .pc-bar-fill { background: var(--green); }


.pc-bar.indeterminate .pc-bar-fill {
  width: 40%;
  transition: none;
  animation: pcBarSlide 1.25s ease-in-out infinite;
}
@keyframes pcBarSlide {
  0%   { transform: translateX(-105%); }
  100% { transform: translateX(255%); }
}


.pc-step-sub {
  margin-top: 7px;
  font-size: .78rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
  .pc-bar-fill { transition: none; }
  .pc-bar.indeterminate .pc-bar-fill { animation: none; width: 100%; opacity: .45; }
}


.pc-results {
  flex: 1;
  overflow-y: auto;
  padding: 0 12px 12px;
}


.pc-sticky {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--panel);
}


.pc-asof {
  margin: 0 -12px;
  padding: 7px 12px;
  background: var(--card);
  border-bottom: 1px solid var(--border-hi);
  font-size: .85rem;
  line-height: 1.3;
}
.pc-asof-k { color: var(--text-dim); }
.pc-asof-v {
  color: var(--text-bright);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}


.pc-results-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0 6px;
}
.pc-ov-left {
  display: flex;
  align-items: center;
  gap: 4px;
  position: relative;
}
.pc-ov-select {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-bright);
  font-family: var(--font-ui);
  font-size: .82rem;
  padding: 3px 20px 3px 8px;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
.pc-ov-arrow {
  position: absolute;
  right: 6px;
  font-size: .6rem;
  color: var(--text-dim);
  pointer-events: none;
}
.pc-ov-title {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-dim);
}
.pc-ov-title-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
}

.pc-help {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-muted);
  font-family: var(--font-ui);
  font-size: .72rem;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: help;
  padding: 0;
  transition: all var(--ease);
}
.pc-help:hover,
.pc-help:focus-visible {
  color: var(--text-bright);
  border-color: var(--text-dim);
}


.pc-overview {
  display: flex;
  gap: 2px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
}
.pc-ov-col {
  flex: 1;
  text-align: center;
}
.pc-ov-label {
  font-size: .82rem;
  font-weight: 500;
  color: var(--text-dim);
  margin-bottom: 2px;
}
.pc-ov-val {
  font-size: .90rem;
  font-weight: 700;
  font-family: var(--font-ui);
  font-variant-numeric: tabular-nums;
}
.pc-ov-val.pos { color: var(--green); }
.pc-ov-val.neg { color: var(--red); }

.pc-ov-val.na { color: var(--text-muted); }
.pc-ov-pct {
  font-size: .82rem;
  color: var(--text-muted);
}


.pc-ov2 {
  display: grid;
  align-items: center;
  padding: 8px 0;
  column-gap: 2px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
}
.pc-ov2-head { text-align: center; }
.pc-ov2 .pc-ov-label { margin-bottom: 4px; }
.pc-ov2-side {
  font-size: .74rem;
  font-weight: 600;
  color: var(--text-muted);
  text-align: left;
  line-height: 1.1;
}
.pc-ov2-cell {
  text-align: center;
  padding: 3px 0;
}

.pc-ov2-real { background: var(--surface-raised); }
.pc-ov2-real.first { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.pc-ov2-real.last { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.pc-ov2-rule {
  grid-column: 1 / -1;
  height: 1px;
  background: var(--divider-soft);
  margin: 4px 0 3px;
}

.pc-ov2-dash {
  font-size: .90rem;
  font-weight: 700;
  color: var(--text-muted);
}

.pc-overview.with-legend {
  border-bottom: none;
  margin-bottom: 2px;
}


.pc-ov-legend {
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
  font-size: .74rem;
  line-height: 1.4;
  color: var(--text-muted);
  padding: 0 2px 8px;
  margin-top: -4px;
}
.pc-ov-legend b {
  color: var(--text-dim);
  font-weight: 600;
}


.pc-ov-n {
  font-size: .72rem;
  color: var(--text-dim);
  opacity: .75;
}


.pc-plan-head {
  padding: 12px 2px 10px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
}
.pc-plan-line {
  font-size: .95rem;
  color: var(--text);
  line-height: 1.45;
}
.pc-plan-line b { color: var(--text-bright); font-weight: 700; }
.pc-plan-line.none { color: var(--text-muted); font-size: .88rem; }

.pc-bars-slider { width: 100%; margin: 2px 0 6px; }
.pc-date {
  width: 118px;
  font-size: .80rem;
  color-scheme: dark;
}
.pc-bars-info { padding: 2px 0 6px; }
.pc-plan-muted { font-size: .78rem; color: var(--text-muted); }


.pc-plan-step {
  margin-top: 6px;
  padding: 6px 8px;
  border: 1px dashed var(--border-hi);
  border-radius: var(--radius-sm);
  font-size: .78rem;
  color: var(--text-dim);
  cursor: pointer;
  transition: all var(--ease);
}
.pc-plan-step:hover { border-color: var(--blue); color: var(--blue); }
.pc-plan-step b { color: var(--text-bright); font-weight: 700; }
.pc-plan-step:hover b { color: var(--blue); }

.pc-plan-detail {
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px dashed var(--border);
}
.pc-plan-cov {
  display: flex;
  gap: 14px;
  margin-top: 8px;
  font-size: .80rem;
  color: var(--text-muted);
}
.pc-plan-cov b { color: var(--text-bright); font-weight: 700; }

.pc-plan-note {
  font-size: .76rem;
  line-height: 1.45;
  color: var(--text-muted);
  padding: 4px 2px;
}
.pc-plan-note.warn { color: var(--text-dim); }

.pc-plan-note.alert {
  color: var(--text);
  background: var(--amber-dim);
  border-left: 2px solid var(--amber);
  border-radius: var(--radius-sm);
  padding: 6px 8px;
  margin: 2px 0;
}
.pc-plan-note b { color: var(--text-dim); font-weight: 600; }

.pc-plan-table {
  margin-top: 10px;
  border-top: 1px solid var(--divider-soft);
}
.pc-plan-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1.2fr 1fr;
  gap: 4px;
  padding: 5px 4px;
  font-size: .80rem;
  color: var(--text-dim);
  border-bottom: 1px solid var(--divider-soft);
}
.pc-plan-row span:not(:first-child) { text-align: right; }
.pc-plan-hdr {
  font-size: .72rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.pc-plan-row.chosen {
  background: var(--blue-dim);
  color: var(--text-bright);
  font-weight: 600;
}
.pc-plan-row.unfit { opacity: .45; }


.pc-adv {
  margin-top: 10px;
  border-top: 1px solid var(--divider-soft);
}
.pc-adv > summary {
  display: block;
  padding: 9px 0 3px;
  font-size: .82rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--text-dim);
  cursor: pointer;
  list-style: none;
}
.pc-adv > summary::-webkit-details-marker { display: none; }
.pc-adv > summary::before { content: '\25B8  '; color: var(--text-muted); }
.pc-adv[open] > summary::before { content: '\25BE  '; }
.pc-adv > summary:hover { color: var(--text-bright); }

.pc-adv-sum { color: var(--text-bright); }
.pc-adv-body { padding: 2px 0 4px; }


.pc-bars-box {
  display: flex;
  align-items: baseline;
  gap: 7px;
}
.pc-bars-span {
  font-size: .80rem;
  color: var(--text-dim);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}




.pc-card {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 8px;
  border-bottom: 1px solid var(--divider-soft);
  cursor: pointer;
  transition: background var(--ease);
}
.pc-card:hover { background: var(--hover-subtle); }
.pc-card.active { background: var(--blue-dim); }

.pc-card-sim {
  font-size: .85rem;
  font-weight: 700;
  color: var(--text-bright);
  font-family: var(--font-ui);
  min-width: 38px;
  flex-shrink: 0;
}
.pc-card-date {
  font-size: .82rem;
  color: var(--text-dim);
  min-width: 80px;
  
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pc-card-ago { color: var(--text-muted); }


.pc-card-squares {
  display: flex;
  gap: 3px;
  
  flex-shrink: 0;
  justify-content: flex-end;
}
.pc-sq {
  width: 16px; height: 16px;
  border-radius: 3px;
  flex-shrink: 0;
  cursor: default;
}
.pc-sq.pos { background: var(--green); }
.pc-sq.neg { background: var(--red); }
.pc-sq.na { background: var(--border-hi); }

.pc-sq.eop {
  margin-left: 7px;
  outline: 1px solid var(--border-hi);
  outline-offset: 1.5px;
}


.pc-card-add {
  width: 22px; height: 22px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-dim);
  font-size: .90rem;
  font-family: var(--font-ui);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all var(--ease);
}
.pc-card-add:hover { border-color: var(--blue); color: var(--blue); }
.pc-card-add.on {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}


.pc-tooltip {
  position: fixed;
  display: none;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm);
  padding: 5px 9px;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--text-bright);
  
  white-space: pre-line;
  max-width: 262px;
  text-align: left;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -100%);
  box-shadow: 0 4px 12px rgba(0,0,0,.4);
}


.pc-empty {
  text-align: center;
  padding: 40px 20px;
  color: var(--text-muted);
  font-size: .90rem;
}
.pc-error {
  text-align: center;
  padding: 16px;
  color: var(--red);
  font-size: .85rem;
}


.pc-avg-row {
  margin: 8px 0 4px !important;
}

.pc-avg-norm {
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 600;
  line-height: 1;
}

.pc-avg-note {
  font-size: .75rem;
  color: var(--text-muted);
  line-height: 1.35;
  padding: 0 2px 6px;
}
.pc-avg-note:empty { display: none; }


.pc-card-cb {
  flex-shrink: 0;
}



.ipo-overlay {
  position: fixed; inset: 0;
  z-index: 4000;
  display: none;
  background: var(--bg, #0a0b0f);
}
.ipo-overlay.open { display: block; }

.ipo-modal {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  font-family: var(--font-ui);
  color: var(--text);
}


.ipo-header {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--divider-soft, rgba(255,255,255,.07));
  flex: 0 0 auto;
}
.ipo-header-title { font-size: 1.05rem; font-weight: 600; letter-spacing: .2px; }
.ipo-header-sub { font-size: .9rem; color: var(--text-dim); font-weight: 500; }
.ipo-header-spacer { flex: 1; }
.ipo-close {
  width: 26px; height: 26px; border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; line-height: 1; cursor: pointer;
  background: transparent; border: none; color: var(--text-dim);
  transition: var(--ease, .15s ease);
}
.ipo-close:hover { background: rgba(255,255,255,var(--hover-medium, .08)); color: var(--text); }


.ipo-cols { flex: 1; display: flex; min-height: 0; }

.ipo-left {
  flex: 0 0 320px; min-width: 0;
  border-right: 1px solid var(--divider-soft, rgba(255,255,255,.07));
  display: flex; flex-direction: column; overflow: hidden;
}
.ipo-main {
  flex: 1; min-width: 0; min-height: 0;
  display: flex; flex-direction: column; overflow: hidden;
  padding: 14px 16px; gap: 12px;
}
.ipo-main-scroll {
  flex: 1; min-height: 0; overflow: hidden;
  display: flex; flex-direction: column; gap: 12px;
}
.ipo-right {
  flex: 0 0 330px; min-width: 0;
  border-left: 1px solid var(--divider-soft, rgba(255,255,255,.07));
  overflow-y: auto; padding: 14px;
  display: flex; flex-direction: column;
}


.ipo-left-scroll { flex: 1; overflow-y: auto; padding: 12px; }
.ipo-section-label {
  font-size: .82rem; font-weight: 600; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .8px; margin: 14px 4px 8px;
}
.ipo-section-label:first-child { margin-top: 4px; }

.ipo-group-select {
  width: 100%;
  font-family: var(--font-ui); font-size: .92rem; font-weight: 500;
  padding: 8px 10px; border-radius: var(--radius-sm);
  background: rgba(255,255,255,.04); color: var(--text);
  border: 1px solid var(--surface-border, rgba(255,255,255,.12));
  cursor: pointer; transition: var(--ease, .15s ease); outline: none;
}
.ipo-group-select:hover { border-color: var(--surface-border-hi, rgba(255,255,255,.24)); }
.ipo-group-select:focus { border-color: var(--green, #26d97f); }
.ipo-group-select option { background: var(--panel, #101219); color: var(--text); }


.ipo-tickers-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ipo-tickers-head .ipo-section-label { flex: 1; min-width: 0; }
.ipo-tickers-head .sn-dash-filters-btn.ipo-filt-on {
  background: var(--pill-active-bg); color: var(--pill-active-color); border-color: transparent;
}

.ipo-ticker-list { margin-top: 6px; display: flex; flex-direction: column; gap: 2px; }
.ipo-ticker {
  display: flex; align-items: center; gap: 9px;
  padding: 6px 8px; border-radius: var(--radius-sm);
  cursor: pointer; transition: var(--ease, .15s ease);
}
.ipo-ticker:hover { background: rgba(255,255,255,var(--hover-subtle, .05)); }
.ipo-ticker.off { opacity: .4; }
.ipo-tk-check {
  width: 16px; height: 16px; flex: 0 0 auto; border-radius: 4px;
  border: 1.5px solid var(--surface-border-hi, rgba(255,255,255,.28));
  display: flex; align-items: center; justify-content: center;
  font-size: .7rem; color: var(--pill-active-color, #0c0e12);
}
.ipo-ticker:not(.off) .ipo-tk-check { background: var(--green, #26d97f); border-color: transparent; }
.ipo-tk-logo { width: 24px; height: 24px; flex: 0 0 auto; border-radius: 6px; object-fit: contain; background: #fff; }
.ipo-tk-logo-fb {
  width: 24px; height: 24px; flex: 0 0 auto; border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  font-size: .78rem; font-weight: 700; color: #fff;
}
.ipo-tk-meta { flex: 1; min-width: 0; }
.ipo-tk-sym { font-size: .92rem; font-weight: 600; }
.ipo-tk-name { font-size: .82rem; color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ipo-tk-warn { color: var(--amber, #f0b429); font-size: .9rem; cursor: help; }

.ipo-tk-eye { flex: 0 0 auto; }
.ipo-tk-eye.on { opacity: 1; color: var(--green, #26d97f); }
.ipo-tk-rm { color: var(--text-dim); font-size: 1rem; cursor: pointer; padding: 0 4px; opacity: 0; transition: var(--ease, .15s ease); }
.ipo-ticker:hover .ipo-tk-rm { opacity: 1; }
.ipo-tk-rm:hover { color: var(--red, #f0506e); }
.ipo-add-btn {
  margin-top: 8px; width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-dim);
  border: 1px dashed var(--surface-border-hi, rgba(255,255,255,.24));
  font-family: var(--font-ui); font-size: .88rem; font-weight: 500;
  cursor: pointer; transition: var(--ease, .15s ease);
}
.ipo-add-btn:hover { color: var(--text); border-color: var(--green, #26d97f); }


.ipo-controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; flex: 0 0 auto; }
.ipo-controls-spacer { flex: 1; }
.ipo-ctrl-label { font-size: .82rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: .5px; }
.ipo-seg {
  display: inline-flex; background: rgba(0,0,0,.25);
  border: 1px solid var(--divider-soft, rgba(255,255,255,.07));
  border-radius: var(--radius-sm); padding: 3px;
}
.ipo-seg button {
  font-family: var(--font-ui); font-size: .86rem; font-weight: 500;
  padding: 4px 12px; border: none; background: transparent;
  color: var(--text-dim); cursor: pointer; border-radius: 4px;
  transition: var(--ease, .15s ease);
}
.ipo-seg button.active { background: var(--surface-border-hi, rgba(255,255,255,.16)); color: var(--text); }
.ipo-reset-sel {
  font-family: var(--font-ui); font-size: .84rem; font-weight: 500;
  padding: 5px 12px; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-dim);
  border: 1px solid var(--surface-border, rgba(255,255,255,.12));
  cursor: pointer; transition: var(--ease, .15s ease);
}
.ipo-reset-sel:hover { color: var(--text); border-color: var(--surface-border-hi, rgba(255,255,255,.24)); }


.ipo-chart-wrap {
  flex: 0 0 auto; position: relative; height: 50vh; min-height: 300px;
  border: 1px solid var(--divider-soft, rgba(255,255,255,.07));
  border-radius: var(--radius-md); padding: 8px;
}
.ipo-chart-hint {
  position: absolute; top: 12px; left: 50%; transform: translateX(-50%);
  font-size: .82rem; color: var(--text-dim); pointer-events: none; opacity: .7;
}

.ipo-zoom-reset {
  display: none; position: absolute; top: 10px; right: 12px; z-index: 3;
  font-family: var(--font-ui); font-size: .82rem; font-weight: 500;
  padding: 5px 12px; border-radius: var(--radius-sm);
  background: var(--overlay-bg, rgba(20,22,28,.85)); backdrop-filter: blur(4px);
  color: var(--text-dim); border: 1px solid var(--surface-border, rgba(255,255,255,.14));
  cursor: pointer; transition: var(--ease, .15s ease);
}
.ipo-zoom-reset:hover { color: var(--text); border-color: var(--surface-border-hi, rgba(255,255,255,.24)); }
.ipo-readout {
  position: absolute; top: 12px; left: 14px;
  pointer-events: none; z-index: 2;
  background: var(--divider-soft); backdrop-filter: blur(4px);
  border: 1px solid var(--border-hi); border-radius: var(--radius-md);
  padding: 9px 12px; font-size: .84rem; color: var(--text); line-height: 1.5;
}
.ipo-ro-head {
  font-size: .82rem; color: var(--text-muted); margin-bottom: 5px;
  padding-bottom: 4px; border-bottom: 1px solid var(--surface-raised);
  text-transform: uppercase; letter-spacing: .4px; white-space: nowrap;
}
.ipo-ro-row { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.ipo-ro-row b { margin-left: auto; font-weight: 700; padding-left: 14px; font-family: var(--font-ui); }
.ipo-ro-dot { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }
.ipo-ro-mean { background: var(--text-dim); }
.ipo-spinner {
  position: absolute; inset: 0; display: none;
  align-items: center; justify-content: center; flex-direction: column; gap: 12px;
  font-size: .9rem; color: var(--text-dim); background: rgba(0,0,0,.2);
}
.ipo-spinner.on { display: flex; }
.ipo-spin-ring {
  width: 30px; height: 30px; border-radius: 50%;
  border: 3px solid rgba(255,255,255,.12); border-top-color: var(--green, #26d97f);
  animation: ipo-spin .8s linear infinite;
}
@keyframes ipo-spin { to { transform: rotate(360deg); } }


.ipo-scroll {
  display: none; position: relative; height: 10px; flex: 0 0 auto;
  margin: 2px 8px 0; border-radius: 999px;
  background: rgba(255,255,255,.05);
}
.ipo-scroll.on { display: block; }
.ipo-scroll-thumb {
  position: absolute; top: 0; height: 100%; min-width: 24px;
  border-radius: 999px; cursor: grab;
  background: rgba(255,255,255,.22); transition: background var(--ease, .15s ease);
}
.ipo-scroll-thumb:hover { background: rgba(255,255,255,.34); }
.ipo-scroll-thumb:active { cursor: grabbing; background: var(--green, #26d97f); }


.ipo-legend {
  display: flex; flex-wrap: wrap; gap: 8px 16px;
  padding: 2px 4px; flex: 0 0 auto;
}
.ipo-leg-item { display: flex; align-items: center; gap: 7px; font-size: .85rem; color: var(--text-dim); }
.ipo-leg-dot { width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto; }

.ipo-leg-item.ipo-leg-tog { cursor: pointer; user-select: none; border-radius: var(--radius-sm); padding: 1px 6px; transition: var(--ease, .15s ease); }
.ipo-leg-item.ipo-leg-tog:hover { background: rgba(255,255,255,var(--hover-subtle, .05)); color: var(--text); }
.ipo-leg-item.ipo-leg-tog.off { opacity: .4; text-decoration: line-through; }



.ipo-matrix { flex: 1 1 auto; min-height: 80px; overflow: auto; }
.ipo-mx { width: 100%; border-collapse: collapse; font-family: var(--font-ui); font-size: 1.07rem; white-space: nowrap; }
.ipo-mx th {
  text-align: right; font-weight: 600; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .4px;
  padding: 4px 10px 6px; position: sticky; top: 0; background: var(--bg);
  border-bottom: 1px solid var(--surface-raised);
}
.ipo-mx th:first-child, .ipo-mx td:first-child {
  text-align: left; position: sticky; left: 0; background: var(--bg); z-index: 1; font-weight: 600;
}

.ipo-mx thead th { z-index: 3; background: var(--bg); }
.ipo-mx thead th:first-child { z-index: 4; }
.ipo-mx td {
  padding: 5px 10px; text-align: right; color: var(--text);
  border-bottom: 1px solid var(--hover-subtle);
}
.ipo-mx tbody tr { transition: background var(--ease); }
.ipo-mx tbody tr:hover td { background: var(--divider-soft); }
.ipo-mx tbody tr:hover td:first-child { background: var(--divider-soft); }
.ipo-mx-avg td { font-weight: 700; color: #c3a05f; background: var(--divider-soft); border-bottom: 1px solid var(--surface-raised); }
.ipo-mx-avg td:first-child { background: var(--divider-soft); }

.ipo-mx tbody tr:not(.ipo-mx-avg) td { font-size: .94rem; }
.ipo-mx-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 7px; vertical-align: middle; }

.ipo-pos { color: var(--green); }
.ipo-neg { color: var(--red); }


.ipo-corr-sec { flex: 0 0 auto; }
.ipo-corr { overflow-x: auto; }
.ipo-corr-empty { padding: 16px 2px; font-size: .86rem; color: var(--text-dim); }
.ipo-corr-tbl { border-collapse: collapse; font-family: var(--font-ui); font-size: .8rem; }
.ipo-corr-tbl th {
  color: var(--text-muted); font-weight: 600; padding: 5px 8px; white-space: nowrap;
  position: sticky; background: var(--bg);
}
.ipo-corr-tbl thead th { top: 0; border-bottom: 1px solid var(--surface-raised); }
.ipo-corr-tbl tbody th { left: 0; text-align: left; border-right: 1px solid var(--surface-raised); z-index: 1; }
.ipo-corr-cell {
  text-align: center; padding: 5px 9px; min-width: 46px;
  color: var(--text); font-weight: 600;
  border-bottom: 1px solid var(--hover-subtle);
}


.ipo-stats-empty { padding: 26px; text-align: center; font-size: .9rem; color: var(--text-dim); line-height: 1.5; }

.ipo-dist { display: flex; flex-direction: column; gap: 2px; }
.ipo-dist-row { display: flex; align-items: center; gap: 9px; padding: 2px 0; }
.ipo-dist-sym { flex: 0 0 50px; font-size: .82rem; font-weight: 600; color: var(--text); }
.ipo-dist-row .sn-yl-bar-track { flex: 1; }
.ipo-dist-val { flex: 0 0 50px; text-align: right; font-size: .82rem; font-weight: 600; font-family: var(--font-ui); }



.cal-overlay {
  position: fixed;
  inset: 0;
  z-index: 4000;
  display: none;
  align-items: center;
  justify-content: center;
  background: var(--overlay-bg);
  backdrop-filter: blur(var(--overlay-blur));
  -webkit-backdrop-filter: blur(var(--overlay-blur));
  padding: 24px;
}
.cal-overlay.open { display: flex; }

.cal-modal {
  width: min(1040px, 96vw);
  height: min(88vh, 900px);
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-lg);
  box-shadow: var(--overlay-shadow);
  overflow: hidden;
  font-family: var(--font-ui);
}


.cal-header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px 14px;
  border-bottom: 1px solid var(--border);
}
.cal-header-spacer { flex: 1; }
.cal-title { font-size: 1.05rem; font-weight: 600; color: var(--text-bright); }
.cal-sub { font-size: 0.86rem; color: var(--text-dim); margin-top: 2px; }
.cal-close {
  width: 26px; height: 26px;
  display: flex; align-items: center; justify-content: center;
  border: none; background: transparent;
  color: var(--text-dim); font-size: 1.2rem; cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background var(--ease), color var(--ease);
}
.cal-close:hover { background: var(--hover-medium); color: var(--text-bright); }


.cal-tabs {
  display: flex;
  gap: 2px;
  padding: 0 14px;
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
}
.cal-tabs button {
  appearance: none;
  border: none;
  background: transparent;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.9rem;
  font-weight: 500;
  padding: 11px 14px;
  cursor: pointer;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color var(--ease), border-color var(--ease);
}
.cal-tabs button:hover { color: var(--text); }
.cal-tabs button.active { color: var(--text-bright); border-bottom-color: var(--text-bright); }


.cal-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}
.cal-range-wrap, .cal-sym-wrap, .cal-econ-wrap, .cal-custom { display: flex; align-items: center; gap: 8px; }
.cal-count { margin-left: auto; font-size: 0.84rem; color: var(--text-muted); white-space: nowrap; }


.cal-seg {
  display: inline-flex;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 2px;
}
.cal-seg button {
  appearance: none;
  border: none;
  background: transparent;
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.84rem;
  font-weight: 500;
  padding: 5px 11px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--ease), color var(--ease);
}
.cal-seg button:hover { color: var(--text); }
.cal-seg button.active {
  background: var(--pill-active-bg, var(--blue-med));
  color: var(--pill-active-color, var(--text-bright));
}

.cal-custom input[type="date"] {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 0.84rem;
  padding: 5px 8px;
  color-scheme: dark;
}
.cal-custom span { color: var(--text-muted); }

.cal-sym-wrap input, .cal-country {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 0.86rem;
  padding: 6px 9px;
}
.cal-sym-wrap input { width: 140px; }
.cal-sym-wrap input:focus, .cal-country:focus, .cal-custom input:focus {
  outline: none; border-color: var(--blue); box-shadow: 0 0 0 2px var(--blue-focus);
}
.cal-country { max-width: 160px; color-scheme: dark; }

.cal-apply, .cal-cur {
  appearance: none;
  border: 1px solid var(--border-hi);
  background: var(--card);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 5px 10px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--ease);
}
.cal-apply:hover, .cal-cur:hover { background: var(--hover-medium); }

.cal-toggle {
  appearance: none;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text-dim);
  font-family: var(--font-ui);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 5px 10px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.cal-toggle:hover { color: var(--text); }
.cal-toggle.active {
  background: var(--blue-med);
  color: var(--text-bright);
  border-color: var(--blue-strong);
}
.cal-flag { font-size: 0.9rem; }


.cal-status { padding: 0 16px; max-height: 0; overflow: hidden; transition: max-height var(--ease); }
.cal-status.warn, .cal-status.info {
  max-height: 60px;
  padding: 9px 16px;
  font-size: 0.84rem;
  border-bottom: 1px solid var(--border);
}
.cal-status.warn { background: var(--amber-dim); color: var(--amber); }
.cal-status.info { background: var(--blue-dim); color: var(--blue); }


.cal-body-wrap { position: relative; flex: 1; overflow: auto; }
.cal-body { min-height: 100%; }

.cal-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.cal-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: left;
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--text-muted);
  background: var(--panel);
  padding: 10px 14px;
  border-bottom: 1px solid var(--border-hi);
  white-space: nowrap;
}
.cal-table tbody td {
  padding: 9px 14px;
  color: var(--text);
  border-bottom: 1px solid var(--divider-soft);
  white-space: nowrap;
}
.cal-table tbody tr:hover td { background: var(--hover-subtle); }
.cal-name { white-space: normal; color: var(--text-soft); max-width: 320px; }
.cal-mono { font-variant-numeric: tabular-nums; }
.cal-pos { color: var(--green); }
.cal-neg { color: var(--red); }

.cal-sym {
  color: var(--blue);
  font-weight: 600;
  cursor: pointer;
  border-radius: var(--radius-sm);
}
.cal-sym:hover { text-decoration: underline; }
.cal-link { color: var(--blue); text-decoration: none; font-size: 0.82rem; }
.cal-link:hover { text-decoration: underline; }
.cal-tag {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--red);
  border: 1px solid var(--red);
  border-radius: var(--radius-sm);
  padding: 0 4px;
  margin-left: 4px;
}


.cal-imp {
  display: inline-block;
  font-size: 0.76rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
}
.cal-imp-high { background: var(--red-med); color: var(--red); }
.cal-imp-med  { background: var(--amber-dim); color: var(--amber); }
.cal-imp-low  { background: var(--surface-raised); color: var(--text-dim); }
.cal-imp-none { color: var(--text-muted); }

.cal-empty {
  padding: 48px 16px;
  text-align: center;
  color: var(--text-muted);
  font-size: 0.92rem;
}


.cal-spinner {
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(16, 18, 25, .55);
}
.cal-spin-ring {
  width: 34px; height: 34px;
  border: 3px solid var(--border-hi);
  border-top-color: var(--blue);
  border-radius: 50%;
  animation: cal-spin .8s linear infinite;
}
@keyframes cal-spin { to { transform: rotate(360deg); } }


.cal-pager {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 10px;
  border-top: 1px solid var(--border);
}
.cal-pager button {
  appearance: none;
  border: 1px solid var(--border-hi);
  background: var(--card);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 0.84rem;
  padding: 6px 12px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--ease);
}
.cal-pager button:hover { background: var(--hover-medium); }
.cal-pager span { font-size: 0.84rem; color: var(--text-dim); }


@media (max-width: 720px) {
  .cal-modal { width: 100vw; height: 100vh; border-radius: 0; }
  .cal-sym-wrap input { width: 110px; }
}




@font-face {
  font-family: "Phosphor";
  src: url("breadth-tech/Phosphor.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.ph {
  
  font-family: "Phosphor" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  
  letter-spacing: 0;
  -webkit-font-feature-settings: "liga";
  -moz-font-feature-settings: "liga=1";
  -moz-font-feature-settings: "liga";
  -ms-font-feature-settings: "liga" 1;
  font-feature-settings: "liga";
  -webkit-font-variant-ligatures: discretionary-ligatures;
  font-variant-ligatures: discretionary-ligatures;

  
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ph.ph-acorn:before {
  content: "\eb9a";
}
.ph.ph-address-book:before {
  content: "\e6f8";
}
.ph.ph-address-book-tabs:before {
  content: "\ee4e";
}
.ph.ph-air-traffic-control:before {
  content: "\ecd8";
}
.ph.ph-airplane:before {
  content: "\e002";
}
.ph.ph-airplane-in-flight:before {
  content: "\e4fe";
}
.ph.ph-airplane-landing:before {
  content: "\e502";
}
.ph.ph-airplane-takeoff:before {
  content: "\e504";
}
.ph.ph-airplane-taxiing:before {
  content: "\e500";
}
.ph.ph-airplane-tilt:before {
  content: "\e5d6";
}
.ph.ph-airplay:before {
  content: "\e004";
}
.ph.ph-alarm:before {
  content: "\e006";
}
.ph.ph-alien:before {
  content: "\e8a6";
}
.ph.ph-align-bottom:before {
  content: "\e506";
}
.ph.ph-align-bottom-simple:before {
  content: "\eb0c";
}
.ph.ph-align-center-horizontal:before {
  content: "\e50a";
}
.ph.ph-align-center-horizontal-simple:before {
  content: "\eb0e";
}
.ph.ph-align-center-vertical:before {
  content: "\e50c";
}
.ph.ph-align-center-vertical-simple:before {
  content: "\eb10";
}
.ph.ph-align-left:before {
  content: "\e50e";
}
.ph.ph-align-left-simple:before {
  content: "\eaee";
}
.ph.ph-align-right:before {
  content: "\e510";
}
.ph.ph-align-right-simple:before {
  content: "\eb12";
}
.ph.ph-align-top:before {
  content: "\e512";
}
.ph.ph-align-top-simple:before {
  content: "\eb14";
}
.ph.ph-amazon-logo:before {
  content: "\e96c";
}
.ph.ph-ambulance:before {
  content: "\e572";
}
.ph.ph-anchor:before {
  content: "\e514";
}
.ph.ph-anchor-simple:before {
  content: "\e5d8";
}
.ph.ph-android-logo:before {
  content: "\e008";
}
.ph.ph-angle:before {
  content: "\e7bc";
}
.ph.ph-angular-logo:before {
  content: "\eb80";
}
.ph.ph-aperture:before {
  content: "\e00a";
}
.ph.ph-app-store-logo:before {
  content: "\e974";
}
.ph.ph-app-window:before {
  content: "\e5da";
}
.ph.ph-apple-logo:before {
  content: "\e516";
}
.ph.ph-apple-podcasts-logo:before {
  content: "\eb96";
}
.ph.ph-approximate-equals:before {
  content: "\edaa";
}
.ph.ph-archive:before {
  content: "\e00c";
}
.ph.ph-armchair:before {
  content: "\e012";
}
.ph.ph-arrow-arc-left:before {
  content: "\e014";
}
.ph.ph-arrow-arc-right:before {
  content: "\e016";
}
.ph.ph-arrow-bend-double-up-left:before {
  content: "\e03a";
}
.ph.ph-arrow-bend-double-up-right:before {
  content: "\e03c";
}
.ph.ph-arrow-bend-down-left:before {
  content: "\e018";
}
.ph.ph-arrow-bend-down-right:before {
  content: "\e01a";
}
.ph.ph-arrow-bend-left-down:before {
  content: "\e01c";
}
.ph.ph-arrow-bend-left-up:before {
  content: "\e01e";
}
.ph.ph-arrow-bend-right-down:before {
  content: "\e020";
}
.ph.ph-arrow-bend-right-up:before {
  content: "\e022";
}
.ph.ph-arrow-bend-up-left:before {
  content: "\e024";
}
.ph.ph-arrow-bend-up-right:before {
  content: "\e026";
}
.ph.ph-arrow-circle-down:before {
  content: "\e028";
}
.ph.ph-arrow-circle-down-left:before {
  content: "\e02a";
}
.ph.ph-arrow-circle-down-right:before {
  content: "\e02c";
}
.ph.ph-arrow-circle-left:before {
  content: "\e05a";
}
.ph.ph-arrow-circle-right:before {
  content: "\e02e";
}
.ph.ph-arrow-circle-up:before {
  content: "\e030";
}
.ph.ph-arrow-circle-up-left:before {
  content: "\e032";
}
.ph.ph-arrow-circle-up-right:before {
  content: "\e034";
}
.ph.ph-arrow-clockwise:before {
  content: "\e036";
}
.ph.ph-arrow-counter-clockwise:before {
  content: "\e038";
}
.ph.ph-arrow-down:before {
  content: "\e03e";
}
.ph.ph-arrow-down-left:before {
  content: "\e040";
}
.ph.ph-arrow-down-right:before {
  content: "\e042";
}
.ph.ph-arrow-elbow-down-left:before {
  content: "\e044";
}
.ph.ph-arrow-elbow-down-right:before {
  content: "\e046";
}
.ph.ph-arrow-elbow-left:before {
  content: "\e048";
}
.ph.ph-arrow-elbow-left-down:before {
  content: "\e04a";
}
.ph.ph-arrow-elbow-left-up:before {
  content: "\e04c";
}
.ph.ph-arrow-elbow-right:before {
  content: "\e04e";
}
.ph.ph-arrow-elbow-right-down:before {
  content: "\e050";
}
.ph.ph-arrow-elbow-right-up:before {
  content: "\e052";
}
.ph.ph-arrow-elbow-up-left:before {
  content: "\e054";
}
.ph.ph-arrow-elbow-up-right:before {
  content: "\e056";
}
.ph.ph-arrow-fat-down:before {
  content: "\e518";
}
.ph.ph-arrow-fat-left:before {
  content: "\e51a";
}
.ph.ph-arrow-fat-line-down:before {
  content: "\e51c";
}
.ph.ph-arrow-fat-line-left:before {
  content: "\e51e";
}
.ph.ph-arrow-fat-line-right:before {
  content: "\e520";
}
.ph.ph-arrow-fat-line-up:before {
  content: "\e522";
}
.ph.ph-arrow-fat-lines-down:before {
  content: "\e524";
}
.ph.ph-arrow-fat-lines-left:before {
  content: "\e526";
}
.ph.ph-arrow-fat-lines-right:before {
  content: "\e528";
}
.ph.ph-arrow-fat-lines-up:before {
  content: "\e52a";
}
.ph.ph-arrow-fat-right:before {
  content: "\e52c";
}
.ph.ph-arrow-fat-up:before {
  content: "\e52e";
}
.ph.ph-arrow-left:before {
  content: "\e058";
}
.ph.ph-arrow-line-down:before {
  content: "\e05c";
}
.ph.ph-arrow-line-down-left:before {
  content: "\e05e";
}
.ph.ph-arrow-line-down-right:before {
  content: "\e060";
}
.ph.ph-arrow-line-left:before {
  content: "\e062";
}
.ph.ph-arrow-line-right:before {
  content: "\e064";
}
.ph.ph-arrow-line-up:before {
  content: "\e066";
}
.ph.ph-arrow-line-up-left:before {
  content: "\e068";
}
.ph.ph-arrow-line-up-right:before {
  content: "\e06a";
}
.ph.ph-arrow-right:before {
  content: "\e06c";
}
.ph.ph-arrow-square-down:before {
  content: "\e06e";
}
.ph.ph-arrow-square-down-left:before {
  content: "\e070";
}
.ph.ph-arrow-square-down-right:before {
  content: "\e072";
}
.ph.ph-arrow-square-in:before {
  content: "\e5dc";
}
.ph.ph-arrow-square-left:before {
  content: "\e074";
}
.ph.ph-arrow-square-out:before {
  content: "\e5de";
}
.ph.ph-arrow-square-right:before {
  content: "\e076";
}
.ph.ph-arrow-square-up:before {
  content: "\e078";
}
.ph.ph-arrow-square-up-left:before {
  content: "\e07a";
}
.ph.ph-arrow-square-up-right:before {
  content: "\e07c";
}
.ph.ph-arrow-u-down-left:before {
  content: "\e07e";
}
.ph.ph-arrow-u-down-right:before {
  content: "\e080";
}
.ph.ph-arrow-u-left-down:before {
  content: "\e082";
}
.ph.ph-arrow-u-left-up:before {
  content: "\e084";
}
.ph.ph-arrow-u-right-down:before {
  content: "\e086";
}
.ph.ph-arrow-u-right-up:before {
  content: "\e088";
}
.ph.ph-arrow-u-up-left:before {
  content: "\e08a";
}
.ph.ph-arrow-u-up-right:before {
  content: "\e08c";
}
.ph.ph-arrow-up:before {
  content: "\e08e";
}
.ph.ph-arrow-up-left:before {
  content: "\e090";
}
.ph.ph-arrow-up-right:before {
  content: "\e092";
}
.ph.ph-arrows-clockwise:before {
  content: "\e094";
}
.ph.ph-arrows-counter-clockwise:before {
  content: "\e096";
}
.ph.ph-arrows-down-up:before {
  content: "\e098";
}
.ph.ph-arrows-horizontal:before {
  content: "\eb06";
}
.ph.ph-arrows-in:before {
  content: "\e09a";
}
.ph.ph-arrows-in-cardinal:before {
  content: "\e09c";
}
.ph.ph-arrows-in-line-horizontal:before {
  content: "\e530";
}
.ph.ph-arrows-in-line-vertical:before {
  content: "\e532";
}
.ph.ph-arrows-in-simple:before {
  content: "\e09e";
}
.ph.ph-arrows-left-right:before {
  content: "\e0a0";
}
.ph.ph-arrows-merge:before {
  content: "\ed3e";
}
.ph.ph-arrows-out:before {
  content: "\e0a2";
}
.ph.ph-arrows-out-cardinal:before {
  content: "\e0a4";
}
.ph.ph-arrows-out-line-horizontal:before {
  content: "\e534";
}
.ph.ph-arrows-out-line-vertical:before {
  content: "\e536";
}
.ph.ph-arrows-out-simple:before {
  content: "\e0a6";
}
.ph.ph-arrows-split:before {
  content: "\ed3c";
}
.ph.ph-arrows-vertical:before {
  content: "\eb04";
}
.ph.ph-article:before {
  content: "\e0a8";
}
.ph.ph-article-medium:before {
  content: "\e5e0";
}
.ph.ph-article-ny-times:before {
  content: "\e5e2";
}
.ph.ph-asclepius:before {
  content: "\ee34";
}
.ph.ph-caduceus:before {
  content: "\ee34";
}
.ph.ph-asterisk:before {
  content: "\e0aa";
}
.ph.ph-asterisk-simple:before {
  content: "\e832";
}
.ph.ph-at:before {
  content: "\e0ac";
}
.ph.ph-atom:before {
  content: "\e5e4";
}
.ph.ph-avocado:before {
  content: "\ee04";
}
.ph.ph-axe:before {
  content: "\e9fc";
}
.ph.ph-baby:before {
  content: "\e774";
}
.ph.ph-baby-carriage:before {
  content: "\e818";
}
.ph.ph-backpack:before {
  content: "\e922";
}
.ph.ph-backspace:before {
  content: "\e0ae";
}
.ph.ph-bag:before {
  content: "\e0b0";
}
.ph.ph-bag-simple:before {
  content: "\e5e6";
}
.ph.ph-balloon:before {
  content: "\e76c";
}
.ph.ph-bandaids:before {
  content: "\e0b2";
}
.ph.ph-bank:before {
  content: "\e0b4";
}
.ph.ph-barbell:before {
  content: "\e0b6";
}
.ph.ph-barcode:before {
  content: "\e0b8";
}
.ph.ph-barn:before {
  content: "\ec72";
}
.ph.ph-barricade:before {
  content: "\e948";
}
.ph.ph-baseball:before {
  content: "\e71a";
}
.ph.ph-baseball-cap:before {
  content: "\ea28";
}
.ph.ph-baseball-helmet:before {
  content: "\ee4a";
}
.ph.ph-basket:before {
  content: "\e964";
}
.ph.ph-basketball:before {
  content: "\e724";
}
.ph.ph-bathtub:before {
  content: "\e81e";
}
.ph.ph-battery-charging:before {
  content: "\e0ba";
}
.ph.ph-battery-charging-vertical:before {
  content: "\e0bc";
}
.ph.ph-battery-empty:before {
  content: "\e0be";
}
.ph.ph-battery-full:before {
  content: "\e0c0";
}
.ph.ph-battery-high:before {
  content: "\e0c2";
}
.ph.ph-battery-low:before {
  content: "\e0c4";
}
.ph.ph-battery-medium:before {
  content: "\e0c6";
}
.ph.ph-battery-plus:before {
  content: "\e808";
}
.ph.ph-battery-plus-vertical:before {
  content: "\ec50";
}
.ph.ph-battery-vertical-empty:before {
  content: "\e7c6";
}
.ph.ph-battery-vertical-full:before {
  content: "\e7c4";
}
.ph.ph-battery-vertical-high:before {
  content: "\e7c2";
}
.ph.ph-battery-vertical-low:before {
  content: "\e7be";
}
.ph.ph-battery-vertical-medium:before {
  content: "\e7c0";
}
.ph.ph-battery-warning:before {
  content: "\e0c8";
}
.ph.ph-battery-warning-vertical:before {
  content: "\e0ca";
}
.ph.ph-beach-ball:before {
  content: "\ed24";
}
.ph.ph-beanie:before {
  content: "\ea2a";
}
.ph.ph-bed:before {
  content: "\e0cc";
}
.ph.ph-beer-bottle:before {
  content: "\e7b0";
}
.ph.ph-beer-stein:before {
  content: "\eb62";
}
.ph.ph-behance-logo:before {
  content: "\e7f4";
}
.ph.ph-bell:before {
  content: "\e0ce";
}
.ph.ph-bell-ringing:before {
  content: "\e5e8";
}
.ph.ph-bell-simple:before {
  content: "\e0d0";
}
.ph.ph-bell-simple-ringing:before {
  content: "\e5ea";
}
.ph.ph-bell-simple-slash:before {
  content: "\e0d2";
}
.ph.ph-bell-simple-z:before {
  content: "\e5ec";
}
.ph.ph-bell-slash:before {
  content: "\e0d4";
}
.ph.ph-bell-z:before {
  content: "\e5ee";
}
.ph.ph-belt:before {
  content: "\ea2c";
}
.ph.ph-bezier-curve:before {
  content: "\eb00";
}
.ph.ph-bicycle:before {
  content: "\e0d6";
}
.ph.ph-binary:before {
  content: "\ee60";
}
.ph.ph-binoculars:before {
  content: "\ea64";
}
.ph.ph-biohazard:before {
  content: "\e9e0";
}
.ph.ph-bird:before {
  content: "\e72c";
}
.ph.ph-blueprint:before {
  content: "\eda0";
}
.ph.ph-bluetooth:before {
  content: "\e0da";
}
.ph.ph-bluetooth-connected:before {
  content: "\e0dc";
}
.ph.ph-bluetooth-slash:before {
  content: "\e0de";
}
.ph.ph-bluetooth-x:before {
  content: "\e0e0";
}
.ph.ph-boat:before {
  content: "\e786";
}
.ph.ph-bomb:before {
  content: "\ee0a";
}
.ph.ph-bone:before {
  content: "\e7f2";
}
.ph.ph-book:before {
  content: "\e0e2";
}
.ph.ph-book-bookmark:before {
  content: "\e0e4";
}
.ph.ph-book-open:before {
  content: "\e0e6";
}
.ph.ph-book-open-text:before {
  content: "\e8f2";
}
.ph.ph-book-open-user:before {
  content: "\ede0";
}
.ph.ph-bookmark:before {
  content: "\e0e8";
}
.ph.ph-bookmark-simple:before {
  content: "\e0ea";
}
.ph.ph-bookmarks:before {
  content: "\e0ec";
}
.ph.ph-bookmarks-simple:before {
  content: "\e5f0";
}
.ph.ph-books:before {
  content: "\e758";
}
.ph.ph-boot:before {
  content: "\ecca";
}
.ph.ph-boules:before {
  content: "\e722";
}
.ph.ph-bounding-box:before {
  content: "\e6ce";
}
.ph.ph-bowl-food:before {
  content: "\eaa4";
}
.ph.ph-bowl-steam:before {
  content: "\e8e4";
}
.ph.ph-bowling-ball:before {
  content: "\ea34";
}
.ph.ph-box-arrow-down:before {
  content: "\e00e";
}
.ph.ph-archive-box:before {
  content: "\e00e";
}
.ph.ph-box-arrow-up:before {
  content: "\ee54";
}
.ph.ph-boxing-glove:before {
  content: "\ea36";
}
.ph.ph-brackets-angle:before {
  content: "\e862";
}
.ph.ph-brackets-curly:before {
  content: "\e860";
}
.ph.ph-brackets-round:before {
  content: "\e864";
}
.ph.ph-brackets-square:before {
  content: "\e85e";
}
.ph.ph-brain:before {
  content: "\e74e";
}
.ph.ph-brandy:before {
  content: "\e6b4";
}
.ph.ph-bread:before {
  content: "\e81c";
}
.ph.ph-bridge:before {
  content: "\ea68";
}
.ph.ph-briefcase:before {
  content: "\e0ee";
}
.ph.ph-briefcase-metal:before {
  content: "\e5f2";
}
.ph.ph-broadcast:before {
  content: "\e0f2";
}
.ph.ph-broom:before {
  content: "\ec54";
}
.ph.ph-browser:before {
  content: "\e0f4";
}
.ph.ph-browsers:before {
  content: "\e0f6";
}
.ph.ph-bug:before {
  content: "\e5f4";
}
.ph.ph-bug-beetle:before {
  content: "\e5f6";
}
.ph.ph-bug-droid:before {
  content: "\e5f8";
}
.ph.ph-building:before {
  content: "\e100";
}
.ph.ph-building-apartment:before {
  content: "\e0fe";
}
.ph.ph-building-office:before {
  content: "\e0ff";
}
.ph.ph-buildings:before {
  content: "\e102";
}
.ph.ph-bulldozer:before {
  content: "\ec6c";
}
.ph.ph-bus:before {
  content: "\e106";
}
.ph.ph-butterfly:before {
  content: "\ea6e";
}
.ph.ph-cable-car:before {
  content: "\e49c";
}
.ph.ph-cactus:before {
  content: "\e918";
}
.ph.ph-cake:before {
  content: "\e780";
}
.ph.ph-calculator:before {
  content: "\e538";
}
.ph.ph-calendar:before {
  content: "\e108";
}
.ph.ph-calendar-blank:before {
  content: "\e10a";
}
.ph.ph-calendar-check:before {
  content: "\e712";
}
.ph.ph-calendar-dot:before {
  content: "\e7b2";
}
.ph.ph-calendar-dots:before {
  content: "\e7b4";
}
.ph.ph-calendar-heart:before {
  content: "\e8b0";
}
.ph.ph-calendar-minus:before {
  content: "\ea14";
}
.ph.ph-calendar-plus:before {
  content: "\e714";
}
.ph.ph-calendar-slash:before {
  content: "\ea12";
}
.ph.ph-calendar-star:before {
  content: "\e8b2";
}
.ph.ph-calendar-x:before {
  content: "\e10c";
}
.ph.ph-call-bell:before {
  content: "\e7de";
}
.ph.ph-camera:before {
  content: "\e10e";
}
.ph.ph-camera-plus:before {
  content: "\ec58";
}
.ph.ph-camera-rotate:before {
  content: "\e7a4";
}
.ph.ph-camera-slash:before {
  content: "\e110";
}
.ph.ph-campfire:before {
  content: "\e9d8";
}
.ph.ph-car:before {
  content: "\e112";
}
.ph.ph-car-battery:before {
  content: "\ee30";
}
.ph.ph-car-profile:before {
  content: "\e8cc";
}
.ph.ph-car-simple:before {
  content: "\e114";
}
.ph.ph-cardholder:before {
  content: "\e5fa";
}
.ph.ph-cards:before {
  content: "\e0f8";
}
.ph.ph-cards-three:before {
  content: "\ee50";
}
.ph.ph-caret-circle-double-down:before {
  content: "\e116";
}
.ph.ph-caret-circle-double-left:before {
  content: "\e118";
}
.ph.ph-caret-circle-double-right:before {
  content: "\e11a";
}
.ph.ph-caret-circle-double-up:before {
  content: "\e11c";
}
.ph.ph-caret-circle-down:before {
  content: "\e11e";
}
.ph.ph-caret-circle-left:before {
  content: "\e120";
}
.ph.ph-caret-circle-right:before {
  content: "\e122";
}
.ph.ph-caret-circle-up:before {
  content: "\e124";
}
.ph.ph-caret-circle-up-down:before {
  content: "\e13e";
}
.ph.ph-caret-double-down:before {
  content: "\e126";
}
.ph.ph-caret-double-left:before {
  content: "\e128";
}
.ph.ph-caret-double-right:before {
  content: "\e12a";
}
.ph.ph-caret-double-up:before {
  content: "\e12c";
}
.ph.ph-caret-down:before {
  content: "\e136";
}
.ph.ph-caret-left:before {
  content: "\e138";
}
.ph.ph-caret-line-down:before {
  content: "\e134";
}
.ph.ph-caret-line-left:before {
  content: "\e132";
}
.ph.ph-caret-line-right:before {
  content: "\e130";
}
.ph.ph-caret-line-up:before {
  content: "\e12e";
}
.ph.ph-caret-right:before {
  content: "\e13a";
}
.ph.ph-caret-up:before {
  content: "\e13c";
}
.ph.ph-caret-up-down:before {
  content: "\e140";
}
.ph.ph-carrot:before {
  content: "\ed38";
}
.ph.ph-cash-register:before {
  content: "\ed80";
}
.ph.ph-cassette-tape:before {
  content: "\ed2e";
}
.ph.ph-castle-turret:before {
  content: "\e9d0";
}
.ph.ph-cat:before {
  content: "\e748";
}
.ph.ph-cell-signal-full:before {
  content: "\e142";
}
.ph.ph-cell-signal-high:before {
  content: "\e144";
}
.ph.ph-cell-signal-low:before {
  content: "\e146";
}
.ph.ph-cell-signal-medium:before {
  content: "\e148";
}
.ph.ph-cell-signal-none:before {
  content: "\e14a";
}
.ph.ph-cell-signal-slash:before {
  content: "\e14c";
}
.ph.ph-cell-signal-x:before {
  content: "\e14e";
}
.ph.ph-cell-tower:before {
  content: "\ebaa";
}
.ph.ph-certificate:before {
  content: "\e766";
}
.ph.ph-chair:before {
  content: "\e950";
}
.ph.ph-chalkboard:before {
  content: "\e5fc";
}
.ph.ph-chalkboard-simple:before {
  content: "\e5fe";
}
.ph.ph-chalkboard-teacher:before {
  content: "\e600";
}
.ph.ph-champagne:before {
  content: "\eaca";
}
.ph.ph-charging-station:before {
  content: "\e8d0";
}
.ph.ph-chart-bar:before {
  content: "\e150";
}
.ph.ph-chart-bar-horizontal:before {
  content: "\e152";
}
.ph.ph-chart-donut:before {
  content: "\eaa6";
}
.ph.ph-chart-line:before {
  content: "\e154";
}
.ph.ph-chart-line-down:before {
  content: "\e8b6";
}
.ph.ph-chart-line-up:before {
  content: "\e156";
}
.ph.ph-chart-pie:before {
  content: "\e158";
}
.ph.ph-chart-pie-slice:before {
  content: "\e15a";
}
.ph.ph-chart-polar:before {
  content: "\eaa8";
}
.ph.ph-chart-scatter:before {
  content: "\eaac";
}
.ph.ph-chat:before {
  content: "\e15c";
}
.ph.ph-chat-centered:before {
  content: "\e160";
}
.ph.ph-chat-centered-dots:before {
  content: "\e164";
}
.ph.ph-chat-centered-slash:before {
  content: "\e162";
}
.ph.ph-chat-centered-text:before {
  content: "\e166";
}
.ph.ph-chat-circle:before {
  content: "\e168";
}
.ph.ph-chat-circle-dots:before {
  content: "\e16c";
}
.ph.ph-chat-circle-slash:before {
  content: "\e16a";
}
.ph.ph-chat-circle-text:before {
  content: "\e16e";
}
.ph.ph-chat-dots:before {
  content: "\e170";
}
.ph.ph-chat-slash:before {
  content: "\e15e";
}
.ph.ph-chat-teardrop:before {
  content: "\e172";
}
.ph.ph-chat-teardrop-dots:before {
  content: "\e176";
}
.ph.ph-chat-teardrop-slash:before {
  content: "\e174";
}
.ph.ph-chat-teardrop-text:before {
  content: "\e178";
}
.ph.ph-chat-text:before {
  content: "\e17a";
}
.ph.ph-chats:before {
  content: "\e17c";
}
.ph.ph-chats-circle:before {
  content: "\e17e";
}
.ph.ph-chats-teardrop:before {
  content: "\e180";
}
.ph.ph-check:before {
  content: "\e182";
}
.ph.ph-check-circle:before {
  content: "\e184";
}
.ph.ph-check-fat:before {
  content: "\eba6";
}
.ph.ph-check-square:before {
  content: "\e186";
}
.ph.ph-check-square-offset:before {
  content: "\e188";
}
.ph.ph-checkerboard:before {
  content: "\e8c4";
}
.ph.ph-checks:before {
  content: "\e53a";
}
.ph.ph-cheers:before {
  content: "\ea4a";
}
.ph.ph-cheese:before {
  content: "\e9fe";
}
.ph.ph-chef-hat:before {
  content: "\ed8e";
}
.ph.ph-cherries:before {
  content: "\e830";
}
.ph.ph-church:before {
  content: "\ecea";
}
.ph.ph-cigarette:before {
  content: "\ed90";
}
.ph.ph-cigarette-slash:before {
  content: "\ed92";
}
.ph.ph-circle:before {
  content: "\e18a";
}
.ph.ph-circle-dashed:before {
  content: "\e602";
}
.ph.ph-circle-half:before {
  content: "\e18c";
}
.ph.ph-circle-half-tilt:before {
  content: "\e18e";
}
.ph.ph-circle-notch:before {
  content: "\eb44";
}
.ph.ph-circles-four:before {
  content: "\e190";
}
.ph.ph-circles-three:before {
  content: "\e192";
}
.ph.ph-circles-three-plus:before {
  content: "\e194";
}
.ph.ph-circuitry:before {
  content: "\e9c2";
}
.ph.ph-city:before {
  content: "\ea6a";
}
.ph.ph-clipboard:before {
  content: "\e196";
}
.ph.ph-clipboard-text:before {
  content: "\e198";
}
.ph.ph-clock:before {
  content: "\e19a";
}
.ph.ph-clock-afternoon:before {
  content: "\e19c";
}
.ph.ph-clock-clockwise:before {
  content: "\e19e";
}
.ph.ph-clock-countdown:before {
  content: "\ed2c";
}
.ph.ph-clock-counter-clockwise:before {
  content: "\e1a0";
}
.ph.ph-clock-user:before {
  content: "\edec";
}
.ph.ph-closed-captioning:before {
  content: "\e1a4";
}
.ph.ph-cloud:before {
  content: "\e1aa";
}
.ph.ph-cloud-arrow-down:before {
  content: "\e1ac";
}
.ph.ph-cloud-arrow-up:before {
  content: "\e1ae";
}
.ph.ph-cloud-check:before {
  content: "\e1b0";
}
.ph.ph-cloud-fog:before {
  content: "\e53c";
}
.ph.ph-cloud-lightning:before {
  content: "\e1b2";
}
.ph.ph-cloud-moon:before {
  content: "\e53e";
}
.ph.ph-cloud-rain:before {
  content: "\e1b4";
}
.ph.ph-cloud-slash:before {
  content: "\e1b6";
}
.ph.ph-cloud-snow:before {
  content: "\e1b8";
}
.ph.ph-cloud-sun:before {
  content: "\e540";
}
.ph.ph-cloud-warning:before {
  content: "\ea98";
}
.ph.ph-cloud-x:before {
  content: "\ea96";
}
.ph.ph-clover:before {
  content: "\edc8";
}
.ph.ph-club:before {
  content: "\e1ba";
}
.ph.ph-coat-hanger:before {
  content: "\e7fe";
}
.ph.ph-coda-logo:before {
  content: "\e7ce";
}
.ph.ph-code:before {
  content: "\e1bc";
}
.ph.ph-code-block:before {
  content: "\eafe";
}
.ph.ph-code-simple:before {
  content: "\e1be";
}
.ph.ph-codepen-logo:before {
  content: "\e978";
}
.ph.ph-codesandbox-logo:before {
  content: "\ea06";
}
.ph.ph-coffee:before {
  content: "\e1c2";
}
.ph.ph-coffee-bean:before {
  content: "\e1c0";
}
.ph.ph-coin:before {
  content: "\e60e";
}
.ph.ph-coin-vertical:before {
  content: "\eb48";
}
.ph.ph-coins:before {
  content: "\e78e";
}
.ph.ph-columns:before {
  content: "\e546";
}
.ph.ph-columns-plus-left:before {
  content: "\e544";
}
.ph.ph-columns-plus-right:before {
  content: "\e542";
}
.ph.ph-command:before {
  content: "\e1c4";
}
.ph.ph-compass:before {
  content: "\e1c8";
}
.ph.ph-compass-rose:before {
  content: "\e1c6";
}
.ph.ph-compass-tool:before {
  content: "\ea0e";
}
.ph.ph-computer-tower:before {
  content: "\e548";
}
.ph.ph-confetti:before {
  content: "\e81a";
}
.ph.ph-contactless-payment:before {
  content: "\ed42";
}
.ph.ph-control:before {
  content: "\eca6";
}
.ph.ph-cookie:before {
  content: "\e6ca";
}
.ph.ph-cooking-pot:before {
  content: "\e764";
}
.ph.ph-copy:before {
  content: "\e1ca";
}
.ph.ph-copy-simple:before {
  content: "\e1cc";
}
.ph.ph-copyleft:before {
  content: "\e86a";
}
.ph.ph-copyright:before {
  content: "\e54a";
}
.ph.ph-corners-in:before {
  content: "\e1ce";
}
.ph.ph-corners-out:before {
  content: "\e1d0";
}
.ph.ph-couch:before {
  content: "\e7f6";
}
.ph.ph-court-basketball:before {
  content: "\ee36";
}
.ph.ph-cow:before {
  content: "\eabe";
}
.ph.ph-cowboy-hat:before {
  content: "\ed12";
}
.ph.ph-cpu:before {
  content: "\e610";
}
.ph.ph-crane:before {
  content: "\ed48";
}
.ph.ph-crane-tower:before {
  content: "\ed49";
}
.ph.ph-credit-card:before {
  content: "\e1d2";
}
.ph.ph-cricket:before {
  content: "\ee12";
}
.ph.ph-crop:before {
  content: "\e1d4";
}
.ph.ph-cross:before {
  content: "\e8a0";
}
.ph.ph-crosshair:before {
  content: "\e1d6";
}
.ph.ph-crosshair-simple:before {
  content: "\e1d8";
}
.ph.ph-crown:before {
  content: "\e614";
}
.ph.ph-crown-cross:before {
  content: "\ee5e";
}
.ph.ph-crown-simple:before {
  content: "\e616";
}
.ph.ph-cube:before {
  content: "\e1da";
}
.ph.ph-cube-focus:before {
  content: "\ed0a";
}
.ph.ph-cube-transparent:before {
  content: "\ec7c";
}
.ph.ph-currency-btc:before {
  content: "\e618";
}
.ph.ph-currency-circle-dollar:before {
  content: "\e54c";
}
.ph.ph-currency-cny:before {
  content: "\e54e";
}
.ph.ph-currency-dollar:before {
  content: "\e550";
}
.ph.ph-currency-dollar-simple:before {
  content: "\e552";
}
.ph.ph-currency-eth:before {
  content: "\eada";
}
.ph.ph-currency-eur:before {
  content: "\e554";
}
.ph.ph-currency-gbp:before {
  content: "\e556";
}
.ph.ph-currency-inr:before {
  content: "\e558";
}
.ph.ph-currency-jpy:before {
  content: "\e55a";
}
.ph.ph-currency-krw:before {
  content: "\e55c";
}
.ph.ph-currency-kzt:before {
  content: "\ec4c";
}
.ph.ph-currency-ngn:before {
  content: "\eb52";
}
.ph.ph-currency-rub:before {
  content: "\e55e";
}
.ph.ph-cursor:before {
  content: "\e1dc";
}
.ph.ph-cursor-click:before {
  content: "\e7c8";
}
.ph.ph-cursor-text:before {
  content: "\e7d8";
}
.ph.ph-cylinder:before {
  content: "\e8fc";
}
.ph.ph-database:before {
  content: "\e1de";
}
.ph.ph-desk:before {
  content: "\ed16";
}
.ph.ph-desktop:before {
  content: "\e560";
}
.ph.ph-desktop-tower:before {
  content: "\e562";
}
.ph.ph-detective:before {
  content: "\e83e";
}
.ph.ph-dev-to-logo:before {
  content: "\ed0e";
}
.ph.ph-device-mobile:before {
  content: "\e1e0";
}
.ph.ph-device-mobile-camera:before {
  content: "\e1e2";
}
.ph.ph-device-mobile-slash:before {
  content: "\ee46";
}
.ph.ph-device-mobile-speaker:before {
  content: "\e1e4";
}
.ph.ph-device-rotate:before {
  content: "\edf2";
}
.ph.ph-device-tablet:before {
  content: "\e1e6";
}
.ph.ph-device-tablet-camera:before {
  content: "\e1e8";
}
.ph.ph-device-tablet-speaker:before {
  content: "\e1ea";
}
.ph.ph-devices:before {
  content: "\eba4";
}
.ph.ph-diamond:before {
  content: "\e1ec";
}
.ph.ph-diamonds-four:before {
  content: "\e8f4";
}
.ph.ph-dice-five:before {
  content: "\e1ee";
}
.ph.ph-dice-four:before {
  content: "\e1f0";
}
.ph.ph-dice-one:before {
  content: "\e1f2";
}
.ph.ph-dice-six:before {
  content: "\e1f4";
}
.ph.ph-dice-three:before {
  content: "\e1f6";
}
.ph.ph-dice-two:before {
  content: "\e1f8";
}
.ph.ph-disc:before {
  content: "\e564";
}
.ph.ph-disco-ball:before {
  content: "\ed98";
}
.ph.ph-discord-logo:before {
  content: "\e61a";
}
.ph.ph-divide:before {
  content: "\e1fa";
}
.ph.ph-dna:before {
  content: "\e924";
}
.ph.ph-dog:before {
  content: "\e74a";
}
.ph.ph-door:before {
  content: "\e61c";
}
.ph.ph-door-open:before {
  content: "\e7e6";
}
.ph.ph-dot:before {
  content: "\ecde";
}
.ph.ph-dot-outline:before {
  content: "\ece0";
}
.ph.ph-dots-nine:before {
  content: "\e1fc";
}
.ph.ph-dots-six:before {
  content: "\e794";
}
.ph.ph-dots-six-vertical:before {
  content: "\eae2";
}
.ph.ph-dots-three:before {
  content: "\e1fe";
}
.ph.ph-dots-three-circle:before {
  content: "\e200";
}
.ph.ph-dots-three-circle-vertical:before {
  content: "\e202";
}
.ph.ph-dots-three-outline:before {
  content: "\e204";
}
.ph.ph-dots-three-outline-vertical:before {
  content: "\e206";
}
.ph.ph-dots-three-vertical:before {
  content: "\e208";
}
.ph.ph-download:before {
  content: "\e20a";
}
.ph.ph-download-simple:before {
  content: "\e20c";
}
.ph.ph-dress:before {
  content: "\ea7e";
}
.ph.ph-dresser:before {
  content: "\e94e";
}
.ph.ph-dribbble-logo:before {
  content: "\e20e";
}
.ph.ph-drone:before {
  content: "\ed74";
}
.ph.ph-drop:before {
  content: "\e210";
}
.ph.ph-drop-half:before {
  content: "\e566";
}
.ph.ph-drop-half-bottom:before {
  content: "\eb40";
}
.ph.ph-drop-simple:before {
  content: "\ee32";
}
.ph.ph-drop-slash:before {
  content: "\e954";
}
.ph.ph-dropbox-logo:before {
  content: "\e7d0";
}
.ph.ph-ear:before {
  content: "\e70c";
}
.ph.ph-ear-slash:before {
  content: "\e70e";
}
.ph.ph-egg:before {
  content: "\e812";
}
.ph.ph-egg-crack:before {
  content: "\eb64";
}
.ph.ph-eject:before {
  content: "\e212";
}
.ph.ph-eject-simple:before {
  content: "\e6ae";
}
.ph.ph-elevator:before {
  content: "\ecc0";
}
.ph.ph-empty:before {
  content: "\edbc";
}
.ph.ph-engine:before {
  content: "\ea80";
}
.ph.ph-envelope:before {
  content: "\e214";
}
.ph.ph-envelope-open:before {
  content: "\e216";
}
.ph.ph-envelope-simple:before {
  content: "\e218";
}
.ph.ph-envelope-simple-open:before {
  content: "\e21a";
}
.ph.ph-equalizer:before {
  content: "\ebbc";
}
.ph.ph-equals:before {
  content: "\e21c";
}
.ph.ph-eraser:before {
  content: "\e21e";
}
.ph.ph-escalator-down:before {
  content: "\ecba";
}
.ph.ph-escalator-up:before {
  content: "\ecbc";
}
.ph.ph-exam:before {
  content: "\e742";
}
.ph.ph-exclamation-mark:before {
  content: "\ee44";
}
.ph.ph-exclude:before {
  content: "\e882";
}
.ph.ph-exclude-square:before {
  content: "\e880";
}
.ph.ph-export:before {
  content: "\eaf0";
}
.ph.ph-eye:before {
  content: "\e220";
}
.ph.ph-eye-closed:before {
  content: "\e222";
}
.ph.ph-eye-slash:before {
  content: "\e224";
}
.ph.ph-eyedropper:before {
  content: "\e568";
}
.ph.ph-eyedropper-sample:before {
  content: "\eac4";
}
.ph.ph-eyeglasses:before {
  content: "\e7ba";
}
.ph.ph-eyes:before {
  content: "\ee5c";
}
.ph.ph-face-mask:before {
  content: "\e56a";
}
.ph.ph-facebook-logo:before {
  content: "\e226";
}
.ph.ph-factory:before {
  content: "\e760";
}
.ph.ph-faders:before {
  content: "\e228";
}
.ph.ph-faders-horizontal:before {
  content: "\e22a";
}
.ph.ph-fallout-shelter:before {
  content: "\e9de";
}
.ph.ph-fan:before {
  content: "\e9f2";
}
.ph.ph-farm:before {
  content: "\ec70";
}
.ph.ph-fast-forward:before {
  content: "\e6a6";
}
.ph.ph-fast-forward-circle:before {
  content: "\e22c";
}
.ph.ph-feather:before {
  content: "\e9c0";
}
.ph.ph-fediverse-logo:before {
  content: "\ed66";
}
.ph.ph-figma-logo:before {
  content: "\e22e";
}
.ph.ph-file:before {
  content: "\e230";
}
.ph.ph-file-archive:before {
  content: "\eb2a";
}
.ph.ph-file-arrow-down:before {
  content: "\e232";
}
.ph.ph-file-arrow-up:before {
  content: "\e61e";
}
.ph.ph-file-audio:before {
  content: "\ea20";
}
.ph.ph-file-c:before {
  content: "\eb32";
}
.ph.ph-file-c-sharp:before {
  content: "\eb30";
}
.ph.ph-file-cloud:before {
  content: "\e95e";
}
.ph.ph-file-code:before {
  content: "\e914";
}
.ph.ph-file-cpp:before {
  content: "\eb2e";
}
.ph.ph-file-css:before {
  content: "\eb34";
}
.ph.ph-file-csv:before {
  content: "\eb1c";
}
.ph.ph-file-dashed:before {
  content: "\e704";
}
.ph.ph-file-dotted:before {
  content: "\e704";
}
.ph.ph-file-doc:before {
  content: "\eb1e";
}
.ph.ph-file-html:before {
  content: "\eb38";
}
.ph.ph-file-image:before {
  content: "\ea24";
}
.ph.ph-file-ini:before {
  content: "\eb33";
}
.ph.ph-file-jpg:before {
  content: "\eb1a";
}
.ph.ph-file-js:before {
  content: "\eb24";
}
.ph.ph-file-jsx:before {
  content: "\eb3a";
}
.ph.ph-file-lock:before {
  content: "\e95c";
}
.ph.ph-file-magnifying-glass:before {
  content: "\e238";
}
.ph.ph-file-search:before {
  content: "\e238";
}
.ph.ph-file-md:before {
  content: "\ed50";
}
.ph.ph-file-minus:before {
  content: "\e234";
}
.ph.ph-file-pdf:before {
  content: "\e702";
}
.ph.ph-file-plus:before {
  content: "\e236";
}
.ph.ph-file-png:before {
  content: "\eb18";
}
.ph.ph-file-ppt:before {
  content: "\eb20";
}
.ph.ph-file-py:before {
  content: "\eb2c";
}
.ph.ph-file-rs:before {
  content: "\eb28";
}
.ph.ph-file-sql:before {
  content: "\ed4e";
}
.ph.ph-file-svg:before {
  content: "\ed08";
}
.ph.ph-file-text:before {
  content: "\e23a";
}
.ph.ph-file-ts:before {
  content: "\eb26";
}
.ph.ph-file-tsx:before {
  content: "\eb3c";
}
.ph.ph-file-txt:before {
  content: "\eb35";
}
.ph.ph-file-video:before {
  content: "\ea22";
}
.ph.ph-file-vue:before {
  content: "\eb3e";
}
.ph.ph-file-x:before {
  content: "\e23c";
}
.ph.ph-file-xls:before {
  content: "\eb22";
}
.ph.ph-file-zip:before {
  content: "\e958";
}
.ph.ph-files:before {
  content: "\e710";
}
.ph.ph-film-reel:before {
  content: "\e8c0";
}
.ph.ph-film-script:before {
  content: "\eb50";
}
.ph.ph-film-slate:before {
  content: "\e8c2";
}
.ph.ph-film-strip:before {
  content: "\e792";
}
.ph.ph-fingerprint:before {
  content: "\e23e";
}
.ph.ph-fingerprint-simple:before {
  content: "\e240";
}
.ph.ph-finn-the-human:before {
  content: "\e56c";
}
.ph.ph-fire:before {
  content: "\e242";
}
.ph.ph-fire-extinguisher:before {
  content: "\e9e8";
}
.ph.ph-fire-simple:before {
  content: "\e620";
}
.ph.ph-fire-truck:before {
  content: "\e574";
}
.ph.ph-first-aid:before {
  content: "\e56e";
}
.ph.ph-first-aid-kit:before {
  content: "\e570";
}
.ph.ph-fish:before {
  content: "\e728";
}
.ph.ph-fish-simple:before {
  content: "\e72a";
}
.ph.ph-flag:before {
  content: "\e244";
}
.ph.ph-flag-banner:before {
  content: "\e622";
}
.ph.ph-flag-banner-fold:before {
  content: "\ecf2";
}
.ph.ph-flag-checkered:before {
  content: "\ea38";
}
.ph.ph-flag-pennant:before {
  content: "\ecf0";
}
.ph.ph-flame:before {
  content: "\e624";
}
.ph.ph-flashlight:before {
  content: "\e246";
}
.ph.ph-flask:before {
  content: "\e79e";
}
.ph.ph-flip-horizontal:before {
  content: "\ed6a";
}
.ph.ph-flip-vertical:before {
  content: "\ed6c";
}
.ph.ph-floppy-disk:before {
  content: "\e248";
}
.ph.ph-floppy-disk-back:before {
  content: "\eaf4";
}
.ph.ph-flow-arrow:before {
  content: "\e6ec";
}
.ph.ph-flower:before {
  content: "\e75e";
}
.ph.ph-flower-lotus:before {
  content: "\e6cc";
}
.ph.ph-flower-tulip:before {
  content: "\eacc";
}
.ph.ph-flying-saucer:before {
  content: "\eb4a";
}
.ph.ph-folder:before {
  content: "\e24a";
}
.ph.ph-folder-notch:before {
  content: "\e24a";
}
.ph.ph-folder-dashed:before {
  content: "\e8f8";
}
.ph.ph-folder-dotted:before {
  content: "\e8f8";
}
.ph.ph-folder-lock:before {
  content: "\ea3c";
}
.ph.ph-folder-minus:before {
  content: "\e254";
}
.ph.ph-folder-notch-minus:before {
  content: "\e254";
}
.ph.ph-folder-open:before {
  content: "\e256";
}
.ph.ph-folder-notch-open:before {
  content: "\e256";
}
.ph.ph-folder-plus:before {
  content: "\e258";
}
.ph.ph-folder-notch-plus:before {
  content: "\e258";
}
.ph.ph-folder-simple:before {
  content: "\e25a";
}
.ph.ph-folder-simple-dashed:before {
  content: "\ec2a";
}
.ph.ph-folder-simple-dotted:before {
  content: "\ec2a";
}
.ph.ph-folder-simple-lock:before {
  content: "\eb5e";
}
.ph.ph-folder-simple-minus:before {
  content: "\e25c";
}
.ph.ph-folder-simple-plus:before {
  content: "\e25e";
}
.ph.ph-folder-simple-star:before {
  content: "\ec2e";
}
.ph.ph-folder-simple-user:before {
  content: "\eb60";
}
.ph.ph-folder-star:before {
  content: "\ea86";
}
.ph.ph-folder-user:before {
  content: "\eb46";
}
.ph.ph-folders:before {
  content: "\e260";
}
.ph.ph-football:before {
  content: "\e718";
}
.ph.ph-football-helmet:before {
  content: "\ee4c";
}
.ph.ph-footprints:before {
  content: "\ea88";
}
.ph.ph-fork-knife:before {
  content: "\e262";
}
.ph.ph-four-k:before {
  content: "\ea5c";
}
.ph.ph-frame-corners:before {
  content: "\e626";
}
.ph.ph-framer-logo:before {
  content: "\e264";
}
.ph.ph-function:before {
  content: "\ebe4";
}
.ph.ph-funnel:before {
  content: "\e266";
}
.ph.ph-funnel-simple:before {
  content: "\e268";
}
.ph.ph-funnel-simple-x:before {
  content: "\e26a";
}
.ph.ph-funnel-x:before {
  content: "\e26c";
}
.ph.ph-game-controller:before {
  content: "\e26e";
}
.ph.ph-garage:before {
  content: "\ecd6";
}
.ph.ph-gas-can:before {
  content: "\e8ce";
}
.ph.ph-gas-pump:before {
  content: "\e768";
}
.ph.ph-gauge:before {
  content: "\e628";
}
.ph.ph-gavel:before {
  content: "\ea32";
}
.ph.ph-gear:before {
  content: "\e270";
}
.ph.ph-gear-fine:before {
  content: "\e87c";
}
.ph.ph-gear-six:before {
  content: "\e272";
}
.ph.ph-gender-female:before {
  content: "\e6e0";
}
.ph.ph-gender-intersex:before {
  content: "\e6e6";
}
.ph.ph-gender-male:before {
  content: "\e6e2";
}
.ph.ph-gender-neuter:before {
  content: "\e6ea";
}
.ph.ph-gender-nonbinary:before {
  content: "\e6e4";
}
.ph.ph-gender-transgender:before {
  content: "\e6e8";
}
.ph.ph-ghost:before {
  content: "\e62a";
}
.ph.ph-gif:before {
  content: "\e274";
}
.ph.ph-gift:before {
  content: "\e276";
}
.ph.ph-git-branch:before {
  content: "\e278";
}
.ph.ph-git-commit:before {
  content: "\e27a";
}
.ph.ph-git-diff:before {
  content: "\e27c";
}
.ph.ph-git-fork:before {
  content: "\e27e";
}
.ph.ph-git-merge:before {
  content: "\e280";
}
.ph.ph-git-pull-request:before {
  content: "\e282";
}
.ph.ph-github-logo:before {
  content: "\e576";
}
.ph.ph-gitlab-logo:before {
  content: "\e694";
}
.ph.ph-gitlab-logo-simple:before {
  content: "\e696";
}
.ph.ph-globe:before {
  content: "\e288";
}
.ph.ph-globe-hemisphere-east:before {
  content: "\e28a";
}
.ph.ph-globe-hemisphere-west:before {
  content: "\e28c";
}
.ph.ph-globe-simple:before {
  content: "\e28e";
}
.ph.ph-globe-simple-x:before {
  content: "\e284";
}
.ph.ph-globe-stand:before {
  content: "\e290";
}
.ph.ph-globe-x:before {
  content: "\e286";
}
.ph.ph-goggles:before {
  content: "\ecb4";
}
.ph.ph-golf:before {
  content: "\ea3e";
}
.ph.ph-goodreads-logo:before {
  content: "\ed10";
}
.ph.ph-google-cardboard-logo:before {
  content: "\e7b6";
}
.ph.ph-google-chrome-logo:before {
  content: "\e976";
}
.ph.ph-google-drive-logo:before {
  content: "\e8f6";
}
.ph.ph-google-logo:before {
  content: "\e292";
}
.ph.ph-google-photos-logo:before {
  content: "\eb92";
}
.ph.ph-google-play-logo:before {
  content: "\e294";
}
.ph.ph-google-podcasts-logo:before {
  content: "\eb94";
}
.ph.ph-gps:before {
  content: "\edd8";
}
.ph.ph-gps-fix:before {
  content: "\edd6";
}
.ph.ph-gps-slash:before {
  content: "\edd4";
}
.ph.ph-gradient:before {
  content: "\eb42";
}
.ph.ph-graduation-cap:before {
  content: "\e62c";
}
.ph.ph-grains:before {
  content: "\ec68";
}
.ph.ph-grains-slash:before {
  content: "\ec6a";
}
.ph.ph-graph:before {
  content: "\eb58";
}
.ph.ph-graphics-card:before {
  content: "\e612";
}
.ph.ph-greater-than:before {
  content: "\edc4";
}
.ph.ph-greater-than-or-equal:before {
  content: "\eda2";
}
.ph.ph-grid-four:before {
  content: "\e296";
}
.ph.ph-grid-nine:before {
  content: "\ec8c";
}
.ph.ph-guitar:before {
  content: "\ea8a";
}
.ph.ph-hair-dryer:before {
  content: "\ea66";
}
.ph.ph-hamburger:before {
  content: "\e790";
}
.ph.ph-hammer:before {
  content: "\e80e";
}
.ph.ph-hand:before {
  content: "\e298";
}
.ph.ph-hand-arrow-down:before {
  content: "\ea4e";
}
.ph.ph-hand-arrow-up:before {
  content: "\ee5a";
}
.ph.ph-hand-coins:before {
  content: "\ea8c";
}
.ph.ph-hand-deposit:before {
  content: "\ee82";
}
.ph.ph-hand-eye:before {
  content: "\ea4c";
}
.ph.ph-hand-fist:before {
  content: "\e57a";
}
.ph.ph-hand-grabbing:before {
  content: "\e57c";
}
.ph.ph-hand-heart:before {
  content: "\e810";
}
.ph.ph-hand-palm:before {
  content: "\e57e";
}
.ph.ph-hand-peace:before {
  content: "\e7cc";
}
.ph.ph-hand-pointing:before {
  content: "\e29a";
}
.ph.ph-hand-soap:before {
  content: "\e630";
}
.ph.ph-hand-swipe-left:before {
  content: "\ec94";
}
.ph.ph-hand-swipe-right:before {
  content: "\ec92";
}
.ph.ph-hand-tap:before {
  content: "\ec90";
}
.ph.ph-hand-waving:before {
  content: "\e580";
}
.ph.ph-hand-withdraw:before {
  content: "\ee80";
}
.ph.ph-handbag:before {
  content: "\e29c";
}
.ph.ph-handbag-simple:before {
  content: "\e62e";
}
.ph.ph-hands-clapping:before {
  content: "\e6a0";
}
.ph.ph-hands-praying:before {
  content: "\ecc8";
}
.ph.ph-handshake:before {
  content: "\e582";
}
.ph.ph-hard-drive:before {
  content: "\e29e";
}
.ph.ph-hard-drives:before {
  content: "\e2a0";
}
.ph.ph-hard-hat:before {
  content: "\ed46";
}
.ph.ph-hash:before {
  content: "\e2a2";
}
.ph.ph-hash-straight:before {
  content: "\e2a4";
}
.ph.ph-head-circuit:before {
  content: "\e7d4";
}
.ph.ph-headlights:before {
  content: "\e6fe";
}
.ph.ph-headphones:before {
  content: "\e2a6";
}
.ph.ph-headset:before {
  content: "\e584";
}
.ph.ph-heart:before {
  content: "\e2a8";
}
.ph.ph-heart-break:before {
  content: "\ebe8";
}
.ph.ph-heart-half:before {
  content: "\ec48";
}
.ph.ph-heart-straight:before {
  content: "\e2aa";
}
.ph.ph-heart-straight-break:before {
  content: "\eb98";
}
.ph.ph-heartbeat:before {
  content: "\e2ac";
}
.ph.ph-hexagon:before {
  content: "\e2ae";
}
.ph.ph-high-definition:before {
  content: "\ea8e";
}
.ph.ph-high-heel:before {
  content: "\e8e8";
}
.ph.ph-highlighter:before {
  content: "\ec76";
}
.ph.ph-highlighter-circle:before {
  content: "\e632";
}
.ph.ph-hockey:before {
  content: "\ec86";
}
.ph.ph-hoodie:before {
  content: "\ecd0";
}
.ph.ph-horse:before {
  content: "\e2b0";
}
.ph.ph-hospital:before {
  content: "\e844";
}
.ph.ph-hourglass:before {
  content: "\e2b2";
}
.ph.ph-hourglass-high:before {
  content: "\e2b4";
}
.ph.ph-hourglass-low:before {
  content: "\e2b6";
}
.ph.ph-hourglass-medium:before {
  content: "\e2b8";
}
.ph.ph-hourglass-simple:before {
  content: "\e2ba";
}
.ph.ph-hourglass-simple-high:before {
  content: "\e2bc";
}
.ph.ph-hourglass-simple-low:before {
  content: "\e2be";
}
.ph.ph-hourglass-simple-medium:before {
  content: "\e2c0";
}
.ph.ph-house:before {
  content: "\e2c2";
}
.ph.ph-house-line:before {
  content: "\e2c4";
}
.ph.ph-house-simple:before {
  content: "\e2c6";
}
.ph.ph-hurricane:before {
  content: "\e88e";
}
.ph.ph-ice-cream:before {
  content: "\e804";
}
.ph.ph-identification-badge:before {
  content: "\e6f6";
}
.ph.ph-identification-card:before {
  content: "\e2c8";
}
.ph.ph-image:before {
  content: "\e2ca";
}
.ph.ph-image-broken:before {
  content: "\e7a8";
}
.ph.ph-image-square:before {
  content: "\e2cc";
}
.ph.ph-images:before {
  content: "\e836";
}
.ph.ph-images-square:before {
  content: "\e834";
}
.ph.ph-infinity:before {
  content: "\e634";
}
.ph.ph-lemniscate:before {
  content: "\e634";
}
.ph.ph-info:before {
  content: "\e2ce";
}
.ph.ph-instagram-logo:before {
  content: "\e2d0";
}
.ph.ph-intersect:before {
  content: "\e2d2";
}
.ph.ph-intersect-square:before {
  content: "\e87a";
}
.ph.ph-intersect-three:before {
  content: "\ecc4";
}
.ph.ph-intersection:before {
  content: "\edba";
}
.ph.ph-invoice:before {
  content: "\ee42";
}
.ph.ph-island:before {
  content: "\ee06";
}
.ph.ph-jar:before {
  content: "\e7e0";
}
.ph.ph-jar-label:before {
  content: "\e7e1";
}
.ph.ph-jeep:before {
  content: "\e2d4";
}
.ph.ph-joystick:before {
  content: "\ea5e";
}
.ph.ph-kanban:before {
  content: "\eb54";
}
.ph.ph-key:before {
  content: "\e2d6";
}
.ph.ph-key-return:before {
  content: "\e782";
}
.ph.ph-keyboard:before {
  content: "\e2d8";
}
.ph.ph-keyhole:before {
  content: "\ea78";
}
.ph.ph-knife:before {
  content: "\e636";
}
.ph.ph-ladder:before {
  content: "\e9e4";
}
.ph.ph-ladder-simple:before {
  content: "\ec26";
}
.ph.ph-lamp:before {
  content: "\e638";
}
.ph.ph-lamp-pendant:before {
  content: "\ee2e";
}
.ph.ph-laptop:before {
  content: "\e586";
}
.ph.ph-lasso:before {
  content: "\edc6";
}
.ph.ph-lastfm-logo:before {
  content: "\e842";
}
.ph.ph-layout:before {
  content: "\e6d6";
}
.ph.ph-leaf:before {
  content: "\e2da";
}
.ph.ph-lectern:before {
  content: "\e95a";
}
.ph.ph-lego:before {
  content: "\e8c6";
}
.ph.ph-lego-smiley:before {
  content: "\e8c7";
}
.ph.ph-less-than:before {
  content: "\edac";
}
.ph.ph-less-than-or-equal:before {
  content: "\eda4";
}
.ph.ph-letter-circle-h:before {
  content: "\ebf8";
}
.ph.ph-letter-circle-p:before {
  content: "\ec08";
}
.ph.ph-letter-circle-v:before {
  content: "\ec14";
}
.ph.ph-lifebuoy:before {
  content: "\e63a";
}
.ph.ph-lightbulb:before {
  content: "\e2dc";
}
.ph.ph-lightbulb-filament:before {
  content: "\e63c";
}
.ph.ph-lighthouse:before {
  content: "\e9f6";
}
.ph.ph-lightning:before {
  content: "\e2de";
}
.ph.ph-lightning-a:before {
  content: "\ea84";
}
.ph.ph-lightning-slash:before {
  content: "\e2e0";
}
.ph.ph-line-segment:before {
  content: "\e6d2";
}
.ph.ph-line-segments:before {
  content: "\e6d4";
}
.ph.ph-line-vertical:before {
  content: "\ed70";
}
.ph.ph-link:before {
  content: "\e2e2";
}
.ph.ph-link-break:before {
  content: "\e2e4";
}
.ph.ph-link-simple:before {
  content: "\e2e6";
}
.ph.ph-link-simple-break:before {
  content: "\e2e8";
}
.ph.ph-link-simple-horizontal:before {
  content: "\e2ea";
}
.ph.ph-link-simple-horizontal-break:before {
  content: "\e2ec";
}
.ph.ph-linkedin-logo:before {
  content: "\e2ee";
}
.ph.ph-linktree-logo:before {
  content: "\edee";
}
.ph.ph-linux-logo:before {
  content: "\eb02";
}
.ph.ph-list:before {
  content: "\e2f0";
}
.ph.ph-list-bullets:before {
  content: "\e2f2";
}
.ph.ph-list-checks:before {
  content: "\eadc";
}
.ph.ph-list-dashes:before {
  content: "\e2f4";
}
.ph.ph-list-heart:before {
  content: "\ebde";
}
.ph.ph-list-magnifying-glass:before {
  content: "\ebe0";
}
.ph.ph-list-numbers:before {
  content: "\e2f6";
}
.ph.ph-list-plus:before {
  content: "\e2f8";
}
.ph.ph-list-star:before {
  content: "\ebdc";
}
.ph.ph-lock:before {
  content: "\e2fa";
}
.ph.ph-lock-key:before {
  content: "\e2fe";
}
.ph.ph-lock-key-open:before {
  content: "\e300";
}
.ph.ph-lock-laminated:before {
  content: "\e302";
}
.ph.ph-lock-laminated-open:before {
  content: "\e304";
}
.ph.ph-lock-open:before {
  content: "\e306";
}
.ph.ph-lock-simple:before {
  content: "\e308";
}
.ph.ph-lock-simple-open:before {
  content: "\e30a";
}
.ph.ph-lockers:before {
  content: "\ecb8";
}
.ph.ph-log:before {
  content: "\ed82";
}
.ph.ph-magic-wand:before {
  content: "\e6b6";
}
.ph.ph-magnet:before {
  content: "\e680";
}
.ph.ph-magnet-straight:before {
  content: "\e682";
}
.ph.ph-magnifying-glass:before {
  content: "\e30c";
}
.ph.ph-magnifying-glass-minus:before {
  content: "\e30e";
}
.ph.ph-magnifying-glass-plus:before {
  content: "\e310";
}
.ph.ph-mailbox:before {
  content: "\ec1e";
}
.ph.ph-map-pin:before {
  content: "\e316";
}
.ph.ph-map-pin-area:before {
  content: "\ee3a";
}
.ph.ph-map-pin-line:before {
  content: "\e318";
}
.ph.ph-map-pin-plus:before {
  content: "\e314";
}
.ph.ph-map-pin-simple:before {
  content: "\ee3e";
}
.ph.ph-map-pin-simple-area:before {
  content: "\ee3c";
}
.ph.ph-map-pin-simple-line:before {
  content: "\ee38";
}
.ph.ph-map-trifold:before {
  content: "\e31a";
}
.ph.ph-markdown-logo:before {
  content: "\e508";
}
.ph.ph-marker-circle:before {
  content: "\e640";
}
.ph.ph-martini:before {
  content: "\e31c";
}
.ph.ph-mask-happy:before {
  content: "\e9f4";
}
.ph.ph-mask-sad:before {
  content: "\eb9e";
}
.ph.ph-mastodon-logo:before {
  content: "\ed68";
}
.ph.ph-math-operations:before {
  content: "\e31e";
}
.ph.ph-matrix-logo:before {
  content: "\ed64";
}
.ph.ph-medal:before {
  content: "\e320";
}
.ph.ph-medal-military:before {
  content: "\ecfc";
}
.ph.ph-medium-logo:before {
  content: "\e322";
}
.ph.ph-megaphone:before {
  content: "\e324";
}
.ph.ph-megaphone-simple:before {
  content: "\e642";
}
.ph.ph-member-of:before {
  content: "\edc2";
}
.ph.ph-memory:before {
  content: "\e9c4";
}
.ph.ph-messenger-logo:before {
  content: "\e6d8";
}
.ph.ph-meta-logo:before {
  content: "\ed02";
}
.ph.ph-meteor:before {
  content: "\e9ba";
}
.ph.ph-metronome:before {
  content: "\ec8e";
}
.ph.ph-microphone:before {
  content: "\e326";
}
.ph.ph-microphone-slash:before {
  content: "\e328";
}
.ph.ph-microphone-stage:before {
  content: "\e75c";
}
.ph.ph-microscope:before {
  content: "\ec7a";
}
.ph.ph-microsoft-excel-logo:before {
  content: "\eb6c";
}
.ph.ph-microsoft-outlook-logo:before {
  content: "\eb70";
}
.ph.ph-microsoft-powerpoint-logo:before {
  content: "\eace";
}
.ph.ph-microsoft-teams-logo:before {
  content: "\eb66";
}
.ph.ph-microsoft-word-logo:before {
  content: "\eb6a";
}
.ph.ph-minus:before {
  content: "\e32a";
}
.ph.ph-minus-circle:before {
  content: "\e32c";
}
.ph.ph-minus-square:before {
  content: "\ed4c";
}
.ph.ph-money:before {
  content: "\e588";
}
.ph.ph-money-wavy:before {
  content: "\ee68";
}
.ph.ph-monitor:before {
  content: "\e32e";
}
.ph.ph-monitor-arrow-up:before {
  content: "\e58a";
}
.ph.ph-monitor-play:before {
  content: "\e58c";
}
.ph.ph-moon:before {
  content: "\e330";
}
.ph.ph-moon-stars:before {
  content: "\e58e";
}
.ph.ph-moped:before {
  content: "\e824";
}
.ph.ph-moped-front:before {
  content: "\e822";
}
.ph.ph-mosque:before {
  content: "\ecee";
}
.ph.ph-motorcycle:before {
  content: "\e80a";
}
.ph.ph-mountains:before {
  content: "\e7ae";
}
.ph.ph-mouse:before {
  content: "\e33a";
}
.ph.ph-mouse-left-click:before {
  content: "\e334";
}
.ph.ph-mouse-middle-click:before {
  content: "\e338";
}
.ph.ph-mouse-right-click:before {
  content: "\e336";
}
.ph.ph-mouse-scroll:before {
  content: "\e332";
}
.ph.ph-mouse-simple:before {
  content: "\e644";
}
.ph.ph-music-note:before {
  content: "\e33c";
}
.ph.ph-music-note-simple:before {
  content: "\e33e";
}
.ph.ph-music-notes:before {
  content: "\e340";
}
.ph.ph-music-notes-minus:before {
  content: "\ee0c";
}
.ph.ph-music-notes-plus:before {
  content: "\eb7c";
}
.ph.ph-music-notes-simple:before {
  content: "\e342";
}
.ph.ph-navigation-arrow:before {
  content: "\eade";
}
.ph.ph-needle:before {
  content: "\e82e";
}
.ph.ph-network:before {
  content: "\edde";
}
.ph.ph-network-slash:before {
  content: "\eddc";
}
.ph.ph-network-x:before {
  content: "\edda";
}
.ph.ph-newspaper:before {
  content: "\e344";
}
.ph.ph-newspaper-clipping:before {
  content: "\e346";
}
.ph.ph-not-equals:before {
  content: "\eda6";
}
.ph.ph-not-member-of:before {
  content: "\edae";
}
.ph.ph-not-subset-of:before {
  content: "\edb0";
}
.ph.ph-not-superset-of:before {
  content: "\edb2";
}
.ph.ph-notches:before {
  content: "\ed3a";
}
.ph.ph-note:before {
  content: "\e348";
}
.ph.ph-note-blank:before {
  content: "\e34a";
}
.ph.ph-note-pencil:before {
  content: "\e34c";
}
.ph.ph-notebook:before {
  content: "\e34e";
}
.ph.ph-notepad:before {
  content: "\e63e";
}
.ph.ph-notification:before {
  content: "\e6fa";
}
.ph.ph-notion-logo:before {
  content: "\e9a0";
}
.ph.ph-nuclear-plant:before {
  content: "\ed7c";
}
.ph.ph-number-circle-eight:before {
  content: "\e352";
}
.ph.ph-number-circle-five:before {
  content: "\e358";
}
.ph.ph-number-circle-four:before {
  content: "\e35e";
}
.ph.ph-number-circle-nine:before {
  content: "\e364";
}
.ph.ph-number-circle-one:before {
  content: "\e36a";
}
.ph.ph-number-circle-seven:before {
  content: "\e370";
}
.ph.ph-number-circle-six:before {
  content: "\e376";
}
.ph.ph-number-circle-three:before {
  content: "\e37c";
}
.ph.ph-number-circle-two:before {
  content: "\e382";
}
.ph.ph-number-circle-zero:before {
  content: "\e388";
}
.ph.ph-number-eight:before {
  content: "\e350";
}
.ph.ph-number-five:before {
  content: "\e356";
}
.ph.ph-number-four:before {
  content: "\e35c";
}
.ph.ph-number-nine:before {
  content: "\e362";
}
.ph.ph-number-one:before {
  content: "\e368";
}
.ph.ph-number-seven:before {
  content: "\e36e";
}
.ph.ph-number-six:before {
  content: "\e374";
}
.ph.ph-number-square-eight:before {
  content: "\e354";
}
.ph.ph-number-square-five:before {
  content: "\e35a";
}
.ph.ph-number-square-four:before {
  content: "\e360";
}
.ph.ph-number-square-nine:before {
  content: "\e366";
}
.ph.ph-number-square-one:before {
  content: "\e36c";
}
.ph.ph-number-square-seven:before {
  content: "\e372";
}
.ph.ph-number-square-six:before {
  content: "\e378";
}
.ph.ph-number-square-three:before {
  content: "\e37e";
}
.ph.ph-number-square-two:before {
  content: "\e384";
}
.ph.ph-number-square-zero:before {
  content: "\e38a";
}
.ph.ph-number-three:before {
  content: "\e37a";
}
.ph.ph-number-two:before {
  content: "\e380";
}
.ph.ph-number-zero:before {
  content: "\e386";
}
.ph.ph-numpad:before {
  content: "\e3c8";
}
.ph.ph-nut:before {
  content: "\e38c";
}
.ph.ph-ny-times-logo:before {
  content: "\e646";
}
.ph.ph-octagon:before {
  content: "\e38e";
}
.ph.ph-office-chair:before {
  content: "\ea46";
}
.ph.ph-onigiri:before {
  content: "\ee2c";
}
.ph.ph-open-ai-logo:before {
  content: "\e7d2";
}
.ph.ph-option:before {
  content: "\e8a8";
}
.ph.ph-orange:before {
  content: "\ee40";
}
.ph.ph-orange-slice:before {
  content: "\ed36";
}
.ph.ph-oven:before {
  content: "\ed8c";
}
.ph.ph-package:before {
  content: "\e390";
}
.ph.ph-paint-brush:before {
  content: "\e6f0";
}
.ph.ph-paint-brush-broad:before {
  content: "\e590";
}
.ph.ph-paint-brush-household:before {
  content: "\e6f2";
}
.ph.ph-paint-bucket:before {
  content: "\e392";
}
.ph.ph-paint-roller:before {
  content: "\e6f4";
}
.ph.ph-palette:before {
  content: "\e6c8";
}
.ph.ph-panorama:before {
  content: "\eaa2";
}
.ph.ph-pants:before {
  content: "\ec88";
}
.ph.ph-paper-plane:before {
  content: "\e394";
}
.ph.ph-paper-plane-right:before {
  content: "\e396";
}
.ph.ph-paper-plane-tilt:before {
  content: "\e398";
}
.ph.ph-paperclip:before {
  content: "\e39a";
}
.ph.ph-paperclip-horizontal:before {
  content: "\e592";
}
.ph.ph-parachute:before {
  content: "\ea7c";
}
.ph.ph-paragraph:before {
  content: "\e960";
}
.ph.ph-parallelogram:before {
  content: "\ecc6";
}
.ph.ph-park:before {
  content: "\ecb2";
}
.ph.ph-password:before {
  content: "\e752";
}
.ph.ph-path:before {
  content: "\e39c";
}
.ph.ph-patreon-logo:before {
  content: "\e98a";
}
.ph.ph-pause:before {
  content: "\e39e";
}
.ph.ph-pause-circle:before {
  content: "\e3a0";
}
.ph.ph-paw-print:before {
  content: "\e648";
}
.ph.ph-paypal-logo:before {
  content: "\e98c";
}
.ph.ph-peace:before {
  content: "\e3a2";
}
.ph.ph-pen:before {
  content: "\e3aa";
}
.ph.ph-pen-nib:before {
  content: "\e3ac";
}
.ph.ph-pen-nib-straight:before {
  content: "\e64a";
}
.ph.ph-pencil:before {
  content: "\e3ae";
}
.ph.ph-pencil-circle:before {
  content: "\e3b0";
}
.ph.ph-pencil-line:before {
  content: "\e3b2";
}
.ph.ph-pencil-ruler:before {
  content: "\e906";
}
.ph.ph-pencil-simple:before {
  content: "\e3b4";
}
.ph.ph-pencil-simple-line:before {
  content: "\ebc6";
}
.ph.ph-pencil-simple-slash:before {
  content: "\ecf6";
}
.ph.ph-pencil-slash:before {
  content: "\ecf8";
}
.ph.ph-pentagon:before {
  content: "\ec7e";
}
.ph.ph-pentagram:before {
  content: "\ec5c";
}
.ph.ph-pepper:before {
  content: "\e94a";
}
.ph.ph-percent:before {
  content: "\e3b6";
}
.ph.ph-person:before {
  content: "\e3a8";
}
.ph.ph-person-arms-spread:before {
  content: "\ecfe";
}
.ph.ph-person-simple:before {
  content: "\e72e";
}
.ph.ph-person-simple-bike:before {
  content: "\e734";
}
.ph.ph-person-simple-circle:before {
  content: "\ee58";
}
.ph.ph-person-simple-hike:before {
  content: "\ed54";
}
.ph.ph-person-simple-run:before {
  content: "\e730";
}
.ph.ph-person-simple-ski:before {
  content: "\e71c";
}
.ph.ph-person-simple-snowboard:before {
  content: "\e71e";
}
.ph.ph-person-simple-swim:before {
  content: "\e736";
}
.ph.ph-person-simple-tai-chi:before {
  content: "\ed5c";
}
.ph.ph-person-simple-throw:before {
  content: "\e732";
}
.ph.ph-person-simple-walk:before {
  content: "\e73a";
}
.ph.ph-perspective:before {
  content: "\ebe6";
}
.ph.ph-phone:before {
  content: "\e3b8";
}
.ph.ph-phone-call:before {
  content: "\e3ba";
}
.ph.ph-phone-disconnect:before {
  content: "\e3bc";
}
.ph.ph-phone-incoming:before {
  content: "\e3be";
}
.ph.ph-phone-list:before {
  content: "\e3cc";
}
.ph.ph-phone-outgoing:before {
  content: "\e3c0";
}
.ph.ph-phone-pause:before {
  content: "\e3ca";
}
.ph.ph-phone-plus:before {
  content: "\ec56";
}
.ph.ph-phone-slash:before {
  content: "\e3c2";
}
.ph.ph-phone-transfer:before {
  content: "\e3c6";
}
.ph.ph-phone-x:before {
  content: "\e3c4";
}
.ph.ph-phosphor-logo:before {
  content: "\e3ce";
}
.ph.ph-pi:before {
  content: "\ec80";
}
.ph.ph-piano-keys:before {
  content: "\e9c8";
}
.ph.ph-picnic-table:before {
  content: "\ee26";
}
.ph.ph-picture-in-picture:before {
  content: "\e64c";
}
.ph.ph-piggy-bank:before {
  content: "\ea04";
}
.ph.ph-pill:before {
  content: "\e700";
}
.ph.ph-ping-pong:before {
  content: "\ea42";
}
.ph.ph-pint-glass:before {
  content: "\edd0";
}
.ph.ph-pinterest-logo:before {
  content: "\e64e";
}
.ph.ph-pinwheel:before {
  content: "\eb9c";
}
.ph.ph-pipe:before {
  content: "\ed86";
}
.ph.ph-pipe-wrench:before {
  content: "\ed88";
}
.ph.ph-pix-logo:before {
  content: "\ecc2";
}
.ph.ph-pizza:before {
  content: "\e796";
}
.ph.ph-placeholder:before {
  content: "\e650";
}
.ph.ph-planet:before {
  content: "\e652";
}
.ph.ph-plant:before {
  content: "\ebae";
}
.ph.ph-play:before {
  content: "\e3d0";
}
.ph.ph-play-circle:before {
  content: "\e3d2";
}
.ph.ph-play-pause:before {
  content: "\e8be";
}
.ph.ph-playlist:before {
  content: "\e6aa";
}
.ph.ph-plug:before {
  content: "\e946";
}
.ph.ph-plug-charging:before {
  content: "\eb5c";
}
.ph.ph-plugs:before {
  content: "\eb56";
}
.ph.ph-plugs-connected:before {
  content: "\eb5a";
}
.ph.ph-plus:before {
  content: "\e3d4";
}
.ph.ph-plus-circle:before {
  content: "\e3d6";
}
.ph.ph-plus-minus:before {
  content: "\e3d8";
}
.ph.ph-plus-square:before {
  content: "\ed4a";
}
.ph.ph-poker-chip:before {
  content: "\e594";
}
.ph.ph-police-car:before {
  content: "\ec4a";
}
.ph.ph-polygon:before {
  content: "\e6d0";
}
.ph.ph-popcorn:before {
  content: "\eb4e";
}
.ph.ph-popsicle:before {
  content: "\ebbe";
}
.ph.ph-potted-plant:before {
  content: "\ec22";
}
.ph.ph-power:before {
  content: "\e3da";
}
.ph.ph-prescription:before {
  content: "\e7a2";
}
.ph.ph-presentation:before {
  content: "\e654";
}
.ph.ph-presentation-chart:before {
  content: "\e656";
}
.ph.ph-printer:before {
  content: "\e3dc";
}
.ph.ph-prohibit:before {
  content: "\e3de";
}
.ph.ph-prohibit-inset:before {
  content: "\e3e0";
}
.ph.ph-projector-screen:before {
  content: "\e658";
}
.ph.ph-projector-screen-chart:before {
  content: "\e65a";
}
.ph.ph-pulse:before {
  content: "\e000";
}
.ph.ph-activity:before {
  content: "\e000";
}
.ph.ph-push-pin:before {
  content: "\e3e2";
}
.ph.ph-push-pin-simple:before {
  content: "\e65c";
}
.ph.ph-push-pin-simple-slash:before {
  content: "\e65e";
}
.ph.ph-push-pin-slash:before {
  content: "\e3e4";
}
.ph.ph-puzzle-piece:before {
  content: "\e596";
}
.ph.ph-qr-code:before {
  content: "\e3e6";
}
.ph.ph-question:before {
  content: "\e3e8";
}
.ph.ph-question-mark:before {
  content: "\e3e9";
}
.ph.ph-queue:before {
  content: "\e6ac";
}
.ph.ph-quotes:before {
  content: "\e660";
}
.ph.ph-rabbit:before {
  content: "\eac2";
}
.ph.ph-racquet:before {
  content: "\ee02";
}
.ph.ph-radical:before {
  content: "\e3ea";
}
.ph.ph-radio:before {
  content: "\e77e";
}
.ph.ph-radio-button:before {
  content: "\eb08";
}
.ph.ph-radioactive:before {
  content: "\e9dc";
}
.ph.ph-rainbow:before {
  content: "\e598";
}
.ph.ph-rainbow-cloud:before {
  content: "\e59a";
}
.ph.ph-ranking:before {
  content: "\ed62";
}
.ph.ph-read-cv-logo:before {
  content: "\ed0c";
}
.ph.ph-receipt:before {
  content: "\e3ec";
}
.ph.ph-receipt-x:before {
  content: "\ed40";
}
.ph.ph-record:before {
  content: "\e3ee";
}
.ph.ph-rectangle:before {
  content: "\e3f0";
}
.ph.ph-rectangle-dashed:before {
  content: "\e3f2";
}
.ph.ph-recycle:before {
  content: "\e75a";
}
.ph.ph-reddit-logo:before {
  content: "\e59c";
}
.ph.ph-repeat:before {
  content: "\e3f6";
}
.ph.ph-repeat-once:before {
  content: "\e3f8";
}
.ph.ph-replit-logo:before {
  content: "\eb8a";
}
.ph.ph-resize:before {
  content: "\ed6e";
}
.ph.ph-rewind:before {
  content: "\e6a8";
}
.ph.ph-rewind-circle:before {
  content: "\e3fa";
}
.ph.ph-road-horizon:before {
  content: "\e838";
}
.ph.ph-robot:before {
  content: "\e762";
}
.ph.ph-rocket:before {
  content: "\e3fc";
}
.ph.ph-rocket-launch:before {
  content: "\e3fe";
}
.ph.ph-rows:before {
  content: "\e5a2";
}
.ph.ph-rows-plus-bottom:before {
  content: "\e59e";
}
.ph.ph-rows-plus-top:before {
  content: "\e5a0";
}
.ph.ph-rss:before {
  content: "\e400";
}
.ph.ph-rss-simple:before {
  content: "\e402";
}
.ph.ph-rug:before {
  content: "\ea1a";
}
.ph.ph-ruler:before {
  content: "\e6b8";
}
.ph.ph-sailboat:before {
  content: "\e78a";
}
.ph.ph-scales:before {
  content: "\e750";
}
.ph.ph-scan:before {
  content: "\ebb6";
}
.ph.ph-scan-smiley:before {
  content: "\ebb4";
}
.ph.ph-scissors:before {
  content: "\eae0";
}
.ph.ph-scooter:before {
  content: "\e820";
}
.ph.ph-screencast:before {
  content: "\e404";
}
.ph.ph-screwdriver:before {
  content: "\e86e";
}
.ph.ph-scribble:before {
  content: "\e806";
}
.ph.ph-scribble-loop:before {
  content: "\e662";
}
.ph.ph-scroll:before {
  content: "\eb7a";
}
.ph.ph-seal:before {
  content: "\e604";
}
.ph.ph-circle-wavy:before {
  content: "\e604";
}
.ph.ph-seal-check:before {
  content: "\e606";
}
.ph.ph-circle-wavy-check:before {
  content: "\e606";
}
.ph.ph-seal-percent:before {
  content: "\e60a";
}
.ph.ph-seal-question:before {
  content: "\e608";
}
.ph.ph-circle-wavy-question:before {
  content: "\e608";
}
.ph.ph-seal-warning:before {
  content: "\e60c";
}
.ph.ph-circle-wavy-warning:before {
  content: "\e60c";
}
.ph.ph-seat:before {
  content: "\eb8e";
}
.ph.ph-seatbelt:before {
  content: "\edfe";
}
.ph.ph-security-camera:before {
  content: "\eca4";
}
.ph.ph-selection:before {
  content: "\e69a";
}
.ph.ph-selection-all:before {
  content: "\e746";
}
.ph.ph-selection-background:before {
  content: "\eaf8";
}
.ph.ph-selection-foreground:before {
  content: "\eaf6";
}
.ph.ph-selection-inverse:before {
  content: "\e744";
}
.ph.ph-selection-plus:before {
  content: "\e69c";
}
.ph.ph-selection-slash:before {
  content: "\e69e";
}
.ph.ph-shapes:before {
  content: "\ec5e";
}
.ph.ph-share:before {
  content: "\e406";
}
.ph.ph-share-fat:before {
  content: "\ed52";
}
.ph.ph-share-network:before {
  content: "\e408";
}
.ph.ph-shield:before {
  content: "\e40a";
}
.ph.ph-shield-check:before {
  content: "\e40c";
}
.ph.ph-shield-checkered:before {
  content: "\e708";
}
.ph.ph-shield-chevron:before {
  content: "\e40e";
}
.ph.ph-shield-plus:before {
  content: "\e706";
}
.ph.ph-shield-slash:before {
  content: "\e410";
}
.ph.ph-shield-star:before {
  content: "\ec34";
}
.ph.ph-shield-warning:before {
  content: "\e412";
}
.ph.ph-shipping-container:before {
  content: "\e78c";
}
.ph.ph-shirt-folded:before {
  content: "\ea92";
}
.ph.ph-shooting-star:before {
  content: "\ecfa";
}
.ph.ph-shopping-bag:before {
  content: "\e416";
}
.ph.ph-shopping-bag-open:before {
  content: "\e418";
}
.ph.ph-shopping-cart:before {
  content: "\e41e";
}
.ph.ph-shopping-cart-simple:before {
  content: "\e420";
}
.ph.ph-shovel:before {
  content: "\e9e6";
}
.ph.ph-shower:before {
  content: "\e776";
}
.ph.ph-shrimp:before {
  content: "\eab4";
}
.ph.ph-shuffle:before {
  content: "\e422";
}
.ph.ph-shuffle-angular:before {
  content: "\e424";
}
.ph.ph-shuffle-simple:before {
  content: "\e426";
}
.ph.ph-sidebar:before {
  content: "\eab6";
}
.ph.ph-sidebar-simple:before {
  content: "\ec24";
}
.ph.ph-sigma:before {
  content: "\eab8";
}
.ph.ph-sign-in:before {
  content: "\e428";
}
.ph.ph-sign-out:before {
  content: "\e42a";
}
.ph.ph-signature:before {
  content: "\ebac";
}
.ph.ph-signpost:before {
  content: "\e89c";
}
.ph.ph-sim-card:before {
  content: "\e664";
}
.ph.ph-siren:before {
  content: "\e9b8";
}
.ph.ph-sketch-logo:before {
  content: "\e42c";
}
.ph.ph-skip-back:before {
  content: "\e5a4";
}
.ph.ph-skip-back-circle:before {
  content: "\e42e";
}
.ph.ph-skip-forward:before {
  content: "\e5a6";
}
.ph.ph-skip-forward-circle:before {
  content: "\e430";
}
.ph.ph-skull:before {
  content: "\e916";
}
.ph.ph-skype-logo:before {
  content: "\e8dc";
}
.ph.ph-slack-logo:before {
  content: "\e5a8";
}
.ph.ph-sliders:before {
  content: "\e432";
}
.ph.ph-sliders-horizontal:before {
  content: "\e434";
}
.ph.ph-slideshow:before {
  content: "\ed32";
}
.ph.ph-smiley:before {
  content: "\e436";
}
.ph.ph-smiley-angry:before {
  content: "\ec62";
}
.ph.ph-smiley-blank:before {
  content: "\e438";
}
.ph.ph-smiley-meh:before {
  content: "\e43a";
}
.ph.ph-smiley-melting:before {
  content: "\ee56";
}
.ph.ph-smiley-nervous:before {
  content: "\e43c";
}
.ph.ph-smiley-sad:before {
  content: "\e43e";
}
.ph.ph-smiley-sticker:before {
  content: "\e440";
}
.ph.ph-smiley-wink:before {
  content: "\e666";
}
.ph.ph-smiley-x-eyes:before {
  content: "\e442";
}
.ph.ph-snapchat-logo:before {
  content: "\e668";
}
.ph.ph-sneaker:before {
  content: "\e80c";
}
.ph.ph-sneaker-move:before {
  content: "\ed60";
}
.ph.ph-snowflake:before {
  content: "\e5aa";
}
.ph.ph-soccer-ball:before {
  content: "\e716";
}
.ph.ph-sock:before {
  content: "\ecce";
}
.ph.ph-solar-panel:before {
  content: "\ed7a";
}
.ph.ph-solar-roof:before {
  content: "\ed7b";
}
.ph.ph-sort-ascending:before {
  content: "\e444";
}
.ph.ph-sort-descending:before {
  content: "\e446";
}
.ph.ph-soundcloud-logo:before {
  content: "\e8de";
}
.ph.ph-spade:before {
  content: "\e448";
}
.ph.ph-sparkle:before {
  content: "\e6a2";
}
.ph.ph-speaker-hifi:before {
  content: "\ea08";
}
.ph.ph-speaker-high:before {
  content: "\e44a";
}
.ph.ph-speaker-low:before {
  content: "\e44c";
}
.ph.ph-speaker-none:before {
  content: "\e44e";
}
.ph.ph-speaker-simple-high:before {
  content: "\e450";
}
.ph.ph-speaker-simple-low:before {
  content: "\e452";
}
.ph.ph-speaker-simple-none:before {
  content: "\e454";
}
.ph.ph-speaker-simple-slash:before {
  content: "\e456";
}
.ph.ph-speaker-simple-x:before {
  content: "\e458";
}
.ph.ph-speaker-slash:before {
  content: "\e45a";
}
.ph.ph-speaker-x:before {
  content: "\e45c";
}
.ph.ph-speedometer:before {
  content: "\ee74";
}
.ph.ph-sphere:before {
  content: "\ee66";
}
.ph.ph-spinner:before {
  content: "\e66a";
}
.ph.ph-spinner-ball:before {
  content: "\ee28";
}
.ph.ph-spinner-gap:before {
  content: "\e66c";
}
.ph.ph-spiral:before {
  content: "\e9fa";
}
.ph.ph-split-horizontal:before {
  content: "\e872";
}
.ph.ph-split-vertical:before {
  content: "\e876";
}
.ph.ph-spotify-logo:before {
  content: "\e66e";
}
.ph.ph-spray-bottle:before {
  content: "\e7e4";
}
.ph.ph-square:before {
  content: "\e45e";
}
.ph.ph-square-half:before {
  content: "\e462";
}
.ph.ph-square-half-bottom:before {
  content: "\eb16";
}
.ph.ph-square-logo:before {
  content: "\e690";
}
.ph.ph-square-split-horizontal:before {
  content: "\e870";
}
.ph.ph-square-split-vertical:before {
  content: "\e874";
}
.ph.ph-squares-four:before {
  content: "\e464";
}
.ph.ph-stack:before {
  content: "\e466";
}
.ph.ph-stack-minus:before {
  content: "\edf4";
}
.ph.ph-stack-overflow-logo:before {
  content: "\eb78";
}
.ph.ph-stack-plus:before {
  content: "\edf6";
}
.ph.ph-stack-simple:before {
  content: "\e468";
}
.ph.ph-stairs:before {
  content: "\e8ec";
}
.ph.ph-stamp:before {
  content: "\ea48";
}
.ph.ph-standard-definition:before {
  content: "\ea90";
}
.ph.ph-star:before {
  content: "\e46a";
}
.ph.ph-star-and-crescent:before {
  content: "\ecf4";
}
.ph.ph-star-four:before {
  content: "\e6a4";
}
.ph.ph-star-half:before {
  content: "\e70a";
}
.ph.ph-star-of-david:before {
  content: "\e89e";
}
.ph.ph-steam-logo:before {
  content: "\ead4";
}
.ph.ph-steering-wheel:before {
  content: "\e9ac";
}
.ph.ph-steps:before {
  content: "\ecbe";
}
.ph.ph-stethoscope:before {
  content: "\e7ea";
}
.ph.ph-sticker:before {
  content: "\e5ac";
}
.ph.ph-stool:before {
  content: "\ea44";
}
.ph.ph-stop:before {
  content: "\e46c";
}
.ph.ph-stop-circle:before {
  content: "\e46e";
}
.ph.ph-storefront:before {
  content: "\e470";
}
.ph.ph-strategy:before {
  content: "\ea3a";
}
.ph.ph-stripe-logo:before {
  content: "\e698";
}
.ph.ph-student:before {
  content: "\e73e";
}
.ph.ph-subset-of:before {
  content: "\edc0";
}
.ph.ph-subset-proper-of:before {
  content: "\edb6";
}
.ph.ph-subtitles:before {
  content: "\e1a8";
}
.ph.ph-subtitles-slash:before {
  content: "\e1a6";
}
.ph.ph-subtract:before {
  content: "\ebd6";
}
.ph.ph-subtract-square:before {
  content: "\ebd4";
}
.ph.ph-subway:before {
  content: "\e498";
}
.ph.ph-suitcase:before {
  content: "\e5ae";
}
.ph.ph-suitcase-rolling:before {
  content: "\e9b0";
}
.ph.ph-suitcase-simple:before {
  content: "\e5b0";
}
.ph.ph-sun:before {
  content: "\e472";
}
.ph.ph-sun-dim:before {
  content: "\e474";
}
.ph.ph-sun-horizon:before {
  content: "\e5b6";
}
.ph.ph-sunglasses:before {
  content: "\e816";
}
.ph.ph-superset-of:before {
  content: "\edb8";
}
.ph.ph-superset-proper-of:before {
  content: "\edb4";
}
.ph.ph-swap:before {
  content: "\e83c";
}
.ph.ph-swatches:before {
  content: "\e5b8";
}
.ph.ph-swimming-pool:before {
  content: "\ecb6";
}
.ph.ph-sword:before {
  content: "\e5ba";
}
.ph.ph-synagogue:before {
  content: "\ecec";
}
.ph.ph-syringe:before {
  content: "\e968";
}
.ph.ph-t-shirt:before {
  content: "\e670";
}
.ph.ph-table:before {
  content: "\e476";
}
.ph.ph-tabs:before {
  content: "\e778";
}
.ph.ph-tag:before {
  content: "\e478";
}
.ph.ph-tag-chevron:before {
  content: "\e672";
}
.ph.ph-tag-simple:before {
  content: "\e47a";
}
.ph.ph-target:before {
  content: "\e47c";
}
.ph.ph-taxi:before {
  content: "\e902";
}
.ph.ph-tea-bag:before {
  content: "\e8e6";
}
.ph.ph-telegram-logo:before {
  content: "\e5bc";
}
.ph.ph-television:before {
  content: "\e754";
}
.ph.ph-television-simple:before {
  content: "\eae6";
}
.ph.ph-tennis-ball:before {
  content: "\e720";
}
.ph.ph-tent:before {
  content: "\e8ba";
}
.ph.ph-terminal:before {
  content: "\e47e";
}
.ph.ph-terminal-window:before {
  content: "\eae8";
}
.ph.ph-test-tube:before {
  content: "\e7a0";
}
.ph.ph-text-a-underline:before {
  content: "\ed34";
}
.ph.ph-text-aa:before {
  content: "\e6ee";
}
.ph.ph-text-align-center:before {
  content: "\e480";
}
.ph.ph-text-align-justify:before {
  content: "\e482";
}
.ph.ph-text-align-left:before {
  content: "\e484";
}
.ph.ph-text-align-right:before {
  content: "\e486";
}
.ph.ph-text-b:before {
  content: "\e5be";
}
.ph.ph-text-bolder:before {
  content: "\e5be";
}
.ph.ph-text-columns:before {
  content: "\ec96";
}
.ph.ph-text-h:before {
  content: "\e6ba";
}
.ph.ph-text-h-five:before {
  content: "\e6c4";
}
.ph.ph-text-h-four:before {
  content: "\e6c2";
}
.ph.ph-text-h-one:before {
  content: "\e6bc";
}
.ph.ph-text-h-six:before {
  content: "\e6c6";
}
.ph.ph-text-h-three:before {
  content: "\e6c0";
}
.ph.ph-text-h-two:before {
  content: "\e6be";
}
.ph.ph-text-indent:before {
  content: "\ea1e";
}
.ph.ph-text-italic:before {
  content: "\e5c0";
}
.ph.ph-text-outdent:before {
  content: "\ea1c";
}
.ph.ph-text-strikethrough:before {
  content: "\e5c2";
}
.ph.ph-text-subscript:before {
  content: "\ec98";
}
.ph.ph-text-superscript:before {
  content: "\ec9a";
}
.ph.ph-text-t:before {
  content: "\e48a";
}
.ph.ph-text-t-slash:before {
  content: "\e488";
}
.ph.ph-text-underline:before {
  content: "\e5c4";
}
.ph.ph-textbox:before {
  content: "\eb0a";
}
.ph.ph-thermometer:before {
  content: "\e5c6";
}
.ph.ph-thermometer-cold:before {
  content: "\e5c8";
}
.ph.ph-thermometer-hot:before {
  content: "\e5ca";
}
.ph.ph-thermometer-simple:before {
  content: "\e5cc";
}
.ph.ph-threads-logo:before {
  content: "\ed9e";
}
.ph.ph-three-d:before {
  content: "\ea5a";
}
.ph.ph-thumbs-down:before {
  content: "\e48c";
}
.ph.ph-thumbs-up:before {
  content: "\e48e";
}
.ph.ph-ticket:before {
  content: "\e490";
}
.ph.ph-tidal-logo:before {
  content: "\ed1c";
}
.ph.ph-tiktok-logo:before {
  content: "\eaf2";
}
.ph.ph-tilde:before {
  content: "\eda8";
}
.ph.ph-timer:before {
  content: "\e492";
}
.ph.ph-tip-jar:before {
  content: "\e7e2";
}
.ph.ph-tipi:before {
  content: "\ed30";
}
.ph.ph-tire:before {
  content: "\edd2";
}
.ph.ph-toggle-left:before {
  content: "\e674";
}
.ph.ph-toggle-right:before {
  content: "\e676";
}
.ph.ph-toilet:before {
  content: "\e79a";
}
.ph.ph-toilet-paper:before {
  content: "\e79c";
}
.ph.ph-toolbox:before {
  content: "\eca0";
}
.ph.ph-tooth:before {
  content: "\e9cc";
}
.ph.ph-tornado:before {
  content: "\e88c";
}
.ph.ph-tote:before {
  content: "\e494";
}
.ph.ph-tote-simple:before {
  content: "\e678";
}
.ph.ph-towel:before {
  content: "\ede6";
}
.ph.ph-tractor:before {
  content: "\ec6e";
}
.ph.ph-trademark:before {
  content: "\e9f0";
}
.ph.ph-trademark-registered:before {
  content: "\e3f4";
}
.ph.ph-traffic-cone:before {
  content: "\e9a8";
}
.ph.ph-traffic-sign:before {
  content: "\e67a";
}
.ph.ph-traffic-signal:before {
  content: "\e9aa";
}
.ph.ph-train:before {
  content: "\e496";
}
.ph.ph-train-regional:before {
  content: "\e49e";
}
.ph.ph-train-simple:before {
  content: "\e4a0";
}
.ph.ph-tram:before {
  content: "\e9ec";
}
.ph.ph-translate:before {
  content: "\e4a2";
}
.ph.ph-trash:before {
  content: "\e4a6";
}
.ph.ph-trash-simple:before {
  content: "\e4a8";
}
.ph.ph-tray:before {
  content: "\e4aa";
}
.ph.ph-tray-arrow-down:before {
  content: "\e010";
}
.ph.ph-archive-tray:before {
  content: "\e010";
}
.ph.ph-tray-arrow-up:before {
  content: "\ee52";
}
.ph.ph-treasure-chest:before {
  content: "\ede2";
}
.ph.ph-tree:before {
  content: "\e6da";
}
.ph.ph-tree-evergreen:before {
  content: "\e6dc";
}
.ph.ph-tree-palm:before {
  content: "\e91a";
}
.ph.ph-tree-structure:before {
  content: "\e67c";
}
.ph.ph-tree-view:before {
  content: "\ee48";
}
.ph.ph-trend-down:before {
  content: "\e4ac";
}
.ph.ph-trend-up:before {
  content: "\e4ae";
}
.ph.ph-triangle:before {
  content: "\e4b0";
}
.ph.ph-triangle-dashed:before {
  content: "\e4b2";
}
.ph.ph-trolley:before {
  content: "\e5b2";
}
.ph.ph-trolley-suitcase:before {
  content: "\e5b4";
}
.ph.ph-trophy:before {
  content: "\e67e";
}
.ph.ph-truck:before {
  content: "\e4b4";
}
.ph.ph-truck-trailer:before {
  content: "\e4b6";
}
.ph.ph-tumblr-logo:before {
  content: "\e8d4";
}
.ph.ph-twitch-logo:before {
  content: "\e5ce";
}
.ph.ph-twitter-logo:before {
  content: "\e4ba";
}
.ph.ph-umbrella:before {
  content: "\e684";
}
.ph.ph-umbrella-simple:before {
  content: "\e686";
}
.ph.ph-union:before {
  content: "\edbe";
}
.ph.ph-unite:before {
  content: "\e87e";
}
.ph.ph-unite-square:before {
  content: "\e878";
}
.ph.ph-upload:before {
  content: "\e4be";
}
.ph.ph-upload-simple:before {
  content: "\e4c0";
}
.ph.ph-usb:before {
  content: "\e956";
}
.ph.ph-user:before {
  content: "\e4c2";
}
.ph.ph-user-check:before {
  content: "\eafa";
}
.ph.ph-user-circle:before {
  content: "\e4c4";
}
.ph.ph-user-circle-check:before {
  content: "\ec38";
}
.ph.ph-user-circle-dashed:before {
  content: "\ec36";
}
.ph.ph-user-circle-gear:before {
  content: "\e4c6";
}
.ph.ph-user-circle-minus:before {
  content: "\e4c8";
}
.ph.ph-user-circle-plus:before {
  content: "\e4ca";
}
.ph.ph-user-focus:before {
  content: "\e6fc";
}
.ph.ph-user-gear:before {
  content: "\e4cc";
}
.ph.ph-user-list:before {
  content: "\e73c";
}
.ph.ph-user-minus:before {
  content: "\e4ce";
}
.ph.ph-user-plus:before {
  content: "\e4d0";
}
.ph.ph-user-rectangle:before {
  content: "\e4d2";
}
.ph.ph-user-sound:before {
  content: "\eca8";
}
.ph.ph-user-square:before {
  content: "\e4d4";
}
.ph.ph-user-switch:before {
  content: "\e756";
}
.ph.ph-users:before {
  content: "\e4d6";
}
.ph.ph-users-four:before {
  content: "\e68c";
}
.ph.ph-users-three:before {
  content: "\e68e";
}
.ph.ph-van:before {
  content: "\e826";
}
.ph.ph-vault:before {
  content: "\e76e";
}
.ph.ph-vector-three:before {
  content: "\ee62";
}
.ph.ph-vector-two:before {
  content: "\ee64";
}
.ph.ph-vibrate:before {
  content: "\e4d8";
}
.ph.ph-video:before {
  content: "\e740";
}
.ph.ph-video-camera:before {
  content: "\e4da";
}
.ph.ph-video-camera-slash:before {
  content: "\e4dc";
}
.ph.ph-video-conference:before {
  content: "\edce";
}
.ph.ph-vignette:before {
  content: "\eba2";
}
.ph.ph-vinyl-record:before {
  content: "\ecac";
}
.ph.ph-virtual-reality:before {
  content: "\e7b8";
}
.ph.ph-virus:before {
  content: "\e7d6";
}
.ph.ph-visor:before {
  content: "\ee2a";
}
.ph.ph-voicemail:before {
  content: "\e4de";
}
.ph.ph-volleyball:before {
  content: "\e726";
}
.ph.ph-wall:before {
  content: "\e688";
}
.ph.ph-wallet:before {
  content: "\e68a";
}
.ph.ph-warehouse:before {
  content: "\ecd4";
}
.ph.ph-warning:before {
  content: "\e4e0";
}
.ph.ph-warning-circle:before {
  content: "\e4e2";
}
.ph.ph-warning-diamond:before {
  content: "\e7fc";
}
.ph.ph-warning-octagon:before {
  content: "\e4e4";
}
.ph.ph-washing-machine:before {
  content: "\ede8";
}
.ph.ph-watch:before {
  content: "\e4e6";
}
.ph.ph-wave-sawtooth:before {
  content: "\ea9c";
}
.ph.ph-wave-sine:before {
  content: "\ea9a";
}
.ph.ph-wave-square:before {
  content: "\ea9e";
}
.ph.ph-wave-triangle:before {
  content: "\eaa0";
}
.ph.ph-waveform:before {
  content: "\e802";
}
.ph.ph-waveform-slash:before {
  content: "\e800";
}
.ph.ph-waves:before {
  content: "\e6de";
}
.ph.ph-webcam:before {
  content: "\e9b2";
}
.ph.ph-webcam-slash:before {
  content: "\ecdc";
}
.ph.ph-webhooks-logo:before {
  content: "\ecae";
}
.ph.ph-wechat-logo:before {
  content: "\e8d2";
}
.ph.ph-whatsapp-logo:before {
  content: "\e5d0";
}
.ph.ph-wheelchair:before {
  content: "\e4e8";
}
.ph.ph-wheelchair-motion:before {
  content: "\e89a";
}
.ph.ph-wifi-high:before {
  content: "\e4ea";
}
.ph.ph-wifi-low:before {
  content: "\e4ec";
}
.ph.ph-wifi-medium:before {
  content: "\e4ee";
}
.ph.ph-wifi-none:before {
  content: "\e4f0";
}
.ph.ph-wifi-slash:before {
  content: "\e4f2";
}
.ph.ph-wifi-x:before {
  content: "\e4f4";
}
.ph.ph-wind:before {
  content: "\e5d2";
}
.ph.ph-windmill:before {
  content: "\e9f8";
}
.ph.ph-windows-logo:before {
  content: "\e692";
}
.ph.ph-wine:before {
  content: "\e6b2";
}
.ph.ph-wrench:before {
  content: "\e5d4";
}
.ph.ph-x:before {
  content: "\e4f6";
}
.ph.ph-x-circle:before {
  content: "\e4f8";
}
.ph.ph-x-logo:before {
  content: "\e4bc";
}
.ph.ph-x-square:before {
  content: "\e4fa";
}
.ph.ph-yarn:before {
  content: "\ed9a";
}
.ph.ph-yin-yang:before {
  content: "\e92a";
}
.ph.ph-youtube-logo:before {
  content: "\e4fc";
}





#btRoot {
    
    --font-ui: 'Inter', sans-serif;
    --font-mono: 'JetBrains Mono', monospace;

    
    --bullish: #22c55e;
    --bullish-dim: rgba(34, 197, 94, 0.1);
    --bearish: #ef4444;
    --bearish-dim: rgba(239, 68, 68, 0.1);
    --neutral: #eab308;
    --accent: #C5A565;
    --purple: #8b5cf6;
    --cyan: #C5A565;

    
    --radius-md: 12px;
    --radius-sm: 6px;

    
    --fs-h1: 22px;
    --fs-h2: 17px;
    --fs-h3: 15px;
    --fs-body: 14px;
    --fs-small: 13px;
    --fs-tiny: 12px;
    --fs-micro: 12px;

    
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;

    
    --touch-min: 44px;
}


#btRoot.dark-theme {
    --bg-body: #08080a;
    --bg-card: rgba(255,255,255,0.06);
    --bg-card-hover: rgba(255,255,255,0.10);
    --border-subtle: rgba(255,255,255,0.08);
    --border-focus: rgba(255,255,255,0.12);
    --text-main: #f5f5f7;
    --text-muted: #a1a1a6;
    --text-secondary: #a1a1a6;
    --chart-grid: rgba(255,255,255,0.06);
    --chart-text: #9a9a9e;
    --scrollbar-thumb: rgba(255,255,255,0.10);
    --donut-empty: rgba(255,255,255,0.08);
    --text-dim: #8e8e93;
    --text-ghost: #2c2c2e;
    --surface-2: rgba(255,255,255,0.06);
    --surface-3: rgba(255,255,255,0.08);
}


#btRoot.light-theme {
    --bg-body: #f5f5f7;
    --bg-card: rgba(255,255,255,0.85);
    --bg-card-hover: rgba(0,0,0,0.04);
    --border-subtle: rgba(0,0,0,0.06);
    --border-focus: rgba(0,0,0,0.1);
    --text-main: #1a1a1e;
    --text-muted: #6b7280;
    --text-secondary: #4b5563;
    --chart-grid: #e5e7eb;
    --chart-text: #9ca3af;
    --scrollbar-thumb: #d1d5db;
    --donut-empty: #e5e7eb;
    --text-dim: #9ca3af;
    --text-ghost: #d1d5db;
}


#btRoot.light-theme .sidebar::after {
    background: rgba(0,0,0,0.06);
}
#btRoot.light-theme .card {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
}

#btRoot.light-theme .nav-item:hover {
    background: rgba(0,0,0,0.04);
}
#btRoot.light-theme .nav-item.active::before {
    background: var(--accent);
}
#btRoot.light-theme .nav-label {
    color: var(--text-dim);
}
#btRoot.light-theme .ov-select {
    background: var(--bg-body);
    border-color: rgba(0,0,0,0.1);
}
#btRoot.light-theme::before {
    display: none;
}
#btRoot.light-theme::after {
    background: #ffffff;
}


#btRoot.light-theme * {
    scrollbar-color: #d1d5db transparent;
}
#btRoot.light-theme *::-webkit-scrollbar-thumb {
    background: #d1d5db;
}
#btRoot.light-theme *::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}



#btRoot, #btRoot * { margin: 0; padding: 0; box-sizing: border-box; }

#btRoot, #btRoot * {
    scrollbar-width: thin;
    scrollbar-color: var(--border-focus) transparent;
}
#btRoot::-webkit-scrollbar, #btRoot *::-webkit-scrollbar { width: 6px; height: 6px; }
#btRoot::-webkit-scrollbar-track, #btRoot *::-webkit-scrollbar-track { background: transparent; }
#btRoot::-webkit-scrollbar-thumb, #btRoot *::-webkit-scrollbar-thumb { background: var(--border-focus); border-radius: 3px; }
#btRoot::-webkit-scrollbar-thumb:hover, #btRoot *::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }
#btRoot::-webkit-scrollbar-corner, #btRoot *::-webkit-scrollbar-corner { background: transparent; }

#btRoot {
    background-color: var(--bg-body);
    color: var(--text-main);
    font-family: var(--font-ui);
    height: 100vh;
    overflow: hidden;
    display: flex;
    position: relative; 
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


#btRoot::before {
    content: '';
    position: fixed;
    inset: 0;
    background: url('./breadth-tech/breadth-tech-bg.webp') center/cover no-repeat;
    filter: blur(20px);
    transform: scale(1.1);
    z-index: -2;
}
#btRoot::after {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.9);
    z-index: -1;
}



#btRoot .sidebar {
    width: 240px;
    padding: 32px 24px;
    padding-top: 100px;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    position: relative;
}


#btRoot .sidebar::after {
    content: '';
    position: absolute;
    right: 0;
    top: 48px;
    bottom: 48px;
    width: 1px;
    background: rgba(255,255,255,0.06);
}

#btRoot .nav-menu {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    overflow-y: auto;
}

#btRoot .nav-group {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
#btRoot .nav-group + .nav-group {
    margin-top: 32px;
}
#btRoot .nav-label {
    font-size: 12px;
    font-family: var(--font-mono);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--text-muted);
    padding: 0 12px;
    margin-bottom: 10px;
}

#btRoot .nav-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 12px;
    border-radius: 10px;
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.25s ease;
    letter-spacing: -0.2px;
    position: relative;
}
#btRoot .nav-item i {
    font-size: 18px;
    transition: all 0.25s;
}
#btRoot .nav-item:hover {
    color: var(--text-main);
    background: rgba(255,255,255,0.06);
}
#btRoot .nav-item.active {
    color: var(--text-main);
}
#btRoot .nav-item.active i {
    color: var(--accent);
    filter: drop-shadow(0 0 6px rgba(197,165,101,0.35));
}
#btRoot .nav-item.active::before {
    content: '';
    position: absolute;
    left: -2px;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 18px;
    border-radius: 2px;
    background: var(--accent);
    box-shadow: 0 0 10px rgba(197,165,101,0.4);
}

#btRoot .nav-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: var(--touch-min);
    padding: 12px 14px;
    border-radius: 10px;
    background: #1a2332;
    border: 1px solid var(--accent);
    color: #ffffff;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.2px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 0 12px rgba(197,165,101,0.15);
}
#btRoot .nav-cta i {
    font-size: 18px;
    color: var(--accent);
}
#btRoot .nav-cta:hover {
    background: #223047;
    box-shadow: 0 0 16px rgba(197,165,101,0.35);
    transform: translateY(-1px);
}
#btRoot.light-theme .nav-cta {
    background: #1a2332;
    color: #ffffff;
}



#btRoot .main-view {
    flex: 1;
    overflow: hidden;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
#btRoot .main-scroll {
    flex: 1;
    overflow-y: auto;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0px, black 30px, black calc(100% - 50px), transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0px, black 30px, black calc(100% - 50px), transparent 100%);
}

#btRoot .top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

#btRoot .page-title h1 {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.5px;
}
#btRoot .page-title p {
    font-size: 14px;
    color: var(--text-muted);
    margin-top: 4px;
}

#btRoot .regime-pill {
    display: none !important;
}
#btRoot .status-dot { display: none; }


#btRoot .view-content { display: block; scroll-margin-top: 34px; }
#btRoot .view-content + .view-content { border-top: 1px solid var(--border-subtle); }

#btRoot #brSecChart,
#btRoot #scSecTrends,
#btRoot #pfSecStocks { scroll-margin-top: 34px; }


#btRoot .sec-head { margin-bottom: 8px; }
#btRoot .sec-head h2 {
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.7px;
    color: var(--text-main);
}
#btRoot .sec-head p {
    font-size: 15px;
    color: var(--text-muted);
    margin-top: 6px;
    line-height: 1.5;
}
#btRoot .sec-head p:empty { display: none; }

#btRoot .sec-head + .br-section,
#btRoot .sec-head + .sc-section,
#btRoot .sec-head + .pf-section,
#btRoot .sec-head + .st-section,
#btRoot .sec-head + .sc-mobile-tabs + .sc-section,
#btRoot .sec-head + .pf-mobile-tabs + .pf-section,
#btRoot .sec-head + .st-mobile-tabs + .st-section { border-top: none; }



#btRoot .theme-toggle-topbar {
    display: flex;
    align-items: center;
    gap: 8px;
    
    position: absolute;
    top: 22px;
    right: 24px;
    z-index: 60;
}

@media (max-width: 1200px) {

    #btRoot .page-title { padding-right: 104px; }

}

#btRoot .theme-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 22px;
    flex-shrink: 0;
}
#btRoot .theme-switch input { opacity: 0; width: 0; height: 0; }
#btRoot .theme-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: var(--border-focus);
    transition: 0.3s;
    border-radius: 22px;
}
#btRoot .theme-slider:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
}
#btRoot input:checked + .theme-slider { background-color: var(--accent); }
#btRoot input:checked + .theme-slider:before { transform: translateX(22px); }



#btRoot #loader {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    left: 0;
    background: var(--bg-body);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 100;
    transition: opacity 0.2s ease-out;
}
#btRoot #loader.loader-fade {
    opacity: 0;
    pointer-events: none;
}

#btRoot .spinner {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border-subtle);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }



#btRoot .login-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.75);
    z-index: 100000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
    backdrop-filter: blur(8px);
    align-items: center;
    justify-content: center;
}
#btRoot .login-overlay.show {
    display: flex;
    opacity: 1;
    visibility: visible;
}

#btRoot .login-modal {
    background: var(--bg-card);
    border: 1px solid var(--border-focus);
    border-radius: 16px;
    padding: 48px 40px;
    max-width: 480px;
    width: 90%;
    text-align: center;
    animation: loginModalPop 0.3s ease-out;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

@keyframes loginModalPop {
    from { transform: scale(0.9) translateY(-20px); opacity: 0; }
    to { transform: scale(1) translateY(0); opacity: 1; }
}

#btRoot .login-modal-icon {
    font-size: 64px;
    margin-bottom: 24px;
    color: var(--accent);
}
#btRoot .login-modal h2 {
    margin: 0 0 16px 0;
    color: var(--text-main);
    font-size: 24px;
    font-weight: 600;
}
#btRoot .login-modal p {
    margin: 0 0 32px 0;
    color: var(--text-muted);
    font-size: 15px;
    line-height: 1.6;
}
#btRoot .login-modal-btn {
    display: inline-block;
    padding: 14px 32px;
    background: linear-gradient(135deg, var(--accent), #8b5cf6);
    color: white;
    font-weight: 600;
    font-size: 15px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    text-decoration: none;
}
#btRoot .login-modal-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4);
}
#btRoot .login-modal-btn:active { transform: translateY(0); }



#btRoot .hamburger-btn {
    display: none;
    background: transparent;
    border: none;
    color: var(--text-main);
    font-size: 24px;
    cursor: pointer;
    padding: 8px;
    margin-right: 12px;
    border-radius: var(--radius-sm);
    transition: background 0.2s;
}
#btRoot .hamburger-btn:hover { background: var(--bg-card-hover); }

#btRoot .sidebar-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 998;
    opacity: 0;
    transition: opacity 0.3s ease;
}
#btRoot .sidebar-overlay.active {
    display: block;
    opacity: 1;
}



#btRoot .tech-overview {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 32px;
}


#btRoot .ov-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    padding: 40px 0 16px;
    margin-bottom: 64px;
}


#btRoot .ov-hero-bottomrow {
    width: 100%;
    max-width: 920px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    margin-top: 28px;
    padding: 0 16px;
    opacity: 0;
    animation: ov-fade-in 0.8s ease 0.3s forwards;
}
#btRoot .ov-ai-badge {
    display: flex;
    align-items: center;
    gap: 10px;
}
#btRoot .ov-ai-badge-stars {
    position: relative;
    width: 24px;
    height: 24px;
}
#btRoot .ov-ai-badge-stars .s {
    position: absolute;
    color: var(--accent);
    line-height: 1;
    filter: drop-shadow(0 0 3px rgba(197,165,101,0.5));
    animation: ov-star-float 3s ease-in-out infinite;
}
#btRoot .ov-ai-badge-stars .s1 { font-size: 15px; top: 2px; left: 3px; animation-delay: 0s; }
#btRoot .ov-ai-badge-stars .s2 { font-size: 9px; top: -2px; right: 0px; animation-delay: -1s; }
#btRoot .ov-ai-badge-stars .s3 { font-size: 7px; bottom: 1px; left: 0px; animation-delay: -2s; }
#btRoot .ov-ai-badge-text {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.3px;
    color: var(--text-muted);
}
#btRoot .ov-hero-date {
    font-size: 15px;
    color: var(--text-muted);
}


#btRoot .ov-carousel-wrapper {
    position: relative;
    width: 100%;
    max-width: 900px;
    display: flex;
    align-items: center;
}
#btRoot .ov-carousel {
    overflow: hidden;
    position: relative;
    width: 100%;
    min-width: 0;
}
#btRoot .ov-carousel-track {
    display: flex;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}


#btRoot .ov-carousel-slide {
    width: 100%;
    min-width: 100%;
    flex-shrink: 0;
    padding: 0 16px;
    box-sizing: border-box;
    overflow: hidden;
}
#btRoot .ov-slide-kicker {
    font-family: var(--font-mono);
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    color: var(--accent);
    text-align: center;
    margin-bottom: 14px;
    opacity: 0;
    animation: ov-fade-in 0.8s ease 0.15s forwards;
}
#btRoot .ov-slide-headline {
    font-size: clamp(32px, 5vw, 56px);
    font-weight: 800;
    letter-spacing: -1.5px;
    line-height: 1.15;
    margin-bottom: 24px;
    height: 3.55em;
    overflow: hidden;
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
    color: var(--text-main);
}
#btRoot .ov-slide-headline .up { color: var(--bullish); }
#btRoot .ov-slide-headline .down { color: var(--bearish); }
#btRoot .ov-slide-headline .gold { color: var(--accent); }
#btRoot .ov-slide-headline .ov-cursor {
    display: inline-block;
    width: 3px;
    height: 0.75em;
    background: var(--accent);
    margin-left: 3px;
    vertical-align: text-bottom;
    border-radius: 2px;
    animation: ov-blink 0.8s step-end infinite;
    box-shadow: 0 0 20px rgba(197,165,101,0.5);
}


#btRoot .ov-slide-metrics {
    display: flex;
    justify-content: center;
    gap: 0;
    opacity: 0;
    transform: translateY(16px);
}
#btRoot .ov-slide-metrics.show {
    animation: ov-lift 0.6s ease forwards;
}
#btRoot .ov-slide-metric {
    padding: 0 clamp(16px, 3.5vw, 44px);
    text-align: center;
    position: relative;
}
#btRoot .ov-slide-metric:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 36px;
    background: var(--border-subtle);
}
#btRoot .ov-slide-metric-val {
    font-family: var(--font-mono);
    font-size: clamp(28px, 4.5vw, 48px);
    font-weight: 700;
    letter-spacing: -1.5px;
    line-height: 1;
    margin-bottom: 8px;
}
#btRoot .ov-slide-metric-val.up { color: var(--bullish); }
#btRoot .ov-slide-metric-val.down { color: var(--bearish); }
#btRoot .ov-slide-metric-val.gold { color: var(--accent); }
#btRoot .ov-slide-metric-val.green { color: var(--bullish); }
#btRoot .ov-slide-metric-val.amber { color: var(--accent); }
#btRoot .ov-slide-metric-val.red { color: var(--bearish); }
#btRoot .ov-slide-metric-label {
    font-size: 12px;
    font-weight: 600;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--text-muted);
}


#btRoot .ov-carousel-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 28px;
    padding: 8px;
    cursor: pointer;
    transition: color 0.2s;
    opacity: 0.4;
}
#btRoot .ov-carousel-arrow:hover {
    opacity: 1;
    color: var(--accent);
}
#btRoot .ov-carousel-prev { left: -48px; }
#btRoot .ov-carousel-next { right: -48px; }


#btRoot .ov-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
}
#btRoot .ov-carousel-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--border-subtle);
    cursor: pointer;
    transition: all 0.3s;
    position: relative;
}
#btRoot .ov-carousel-dot::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 44px;
    height: 44px;
}
#btRoot .ov-carousel-dot.active {
    background: var(--accent);
    box-shadow: 0 0 8px rgba(197,165,101,0.4);
    transform: scale(1.3);
}
#btRoot .ov-carousel-dot:hover:not(.active) {
    background: var(--text-muted);
}


#btRoot .ov-scroll-hint {
    position: absolute;
    bottom: -46px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.8s ease;
    pointer-events: none;
    z-index: 2;
}
#btRoot .ov-scroll-hint.show {
    opacity: 1;
    pointer-events: auto;
}
#btRoot .ov-scroll-hint-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--text-muted);
    letter-spacing: 0.4px;
    white-space: nowrap;
}
#btRoot .ov-scroll-hint-arrow {
    width: 12px;
    height: 12px;
    border-right: 2px solid var(--accent);
    border-bottom: 2px solid var(--accent);
    transform: rotate(45deg);
    animation: ov-arrow-bob 1.8s ease-in-out infinite;
}
#btRoot .ov-scroll-hint:hover .ov-scroll-hint-label { color: var(--text-main); }


#btRoot .ov-snapshot {
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-secondary);
    max-width: 100%;
    padding: 0;
}
#btRoot .ov-snapshot strong { color: var(--text-main); font-weight: 700; }
#btRoot .ov-snapshot .up { color: var(--bullish); font-weight: 600; }
#btRoot .ov-snapshot .down { color: var(--bearish); font-weight: 600; }
#btRoot .ov-snapshot .gold { color: var(--accent); font-weight: 600; }


@keyframes ov-blink { 0%, 45% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes ov-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes ov-lift { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ov-arrow-bob { 0%, 100% { transform: rotate(45deg) translate(0,0); opacity: 0.3; } 50% { transform: rotate(45deg) translate(3px,3px); opacity: 0.6; } }
@keyframes ov-star-float { 0%, 100% { transform: translateY(0) scale(1); opacity: 0.7; } 50% { transform: translateY(-3px) scale(1.2); opacity: 1; } }


@media (max-width: 640px) {

    #btRoot .ov-carousel-prev { left: -8px; }
    #btRoot .ov-carousel-next { right: -8px; }
    #btRoot .ov-carousel-arrow { font-size: 22px; opacity: 0.5; }
    #btRoot .ov-slide-metrics {
        flex-direction: column;
        gap: 12px;
        align-items: center;
    }
    #btRoot .ov-slide-metric {
        padding: 8px 0;
    }
    #btRoot .ov-slide-metric:not(:last-child)::after {
        display: none;
    }

}


#btRoot .ov-section {
    padding: 56px 0;
    border-top: 1px solid var(--border-subtle);
    opacity: 0;
    transform: translateY(24px);
    transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
#btRoot .ov-section.visible { opacity: 1; transform: translateY(0); }


#btRoot .ov-card {
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    padding: 24px;
}
#btRoot .ov-card-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--border-subtle);
}
#btRoot .ov-card-tab {
    background: none;
    border: none;
    color: var(--text-muted);
    font-family: var(--font-mono);
    font-size: 13px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 12px 20px;
    cursor: pointer;
    position: relative;
    transition: color 0.2s;
}
#btRoot .ov-card-tab::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: transparent;
    transition: background 0.2s;
}
#btRoot .ov-card-tab.active {
    color: var(--text-main);
    font-weight: 600;
}
#btRoot .ov-card-tab.active::after {
    background: var(--accent);
}
#btRoot .ov-card-tab:hover { color: var(--text-main); }
#btRoot .ov-card-panel { display: none; }
#btRoot .ov-card-panel.active { display: block; }
#btRoot.light-theme .ov-card {
    background: rgba(0,0,0,0.02);
}

#btRoot .ov-section-label {
    font-size: 13px;
    font-family: var(--font-mono);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--text-muted);
    margin-bottom: 24px;
}


#btRoot .ov-idx-bars { display: flex; flex-direction: column; gap: 14px; }
#btRoot .ov-idx-bar-row { display: flex; align-items: center; gap: 16px; }
#btRoot .ov-idx-bar-name { font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: var(--text-muted); width: 80px; flex-shrink: 0; text-align: right; }
#btRoot .ov-idx-bar-track { flex: 1; height: 6px; background: rgba(255,255,255,0.06); border-radius: 3px; overflow: hidden; position: relative; }
#btRoot .ov-idx-bar-fill { height: 100%; border-radius: 3px; transition: width 1.2s cubic-bezier(0.16, 1, 0.3, 1); }
#btRoot .ov-idx-bar-fill.up { background: var(--bullish); }
#btRoot .ov-idx-bar-fill.down { background: var(--bearish); }
#btRoot .ov-idx-bar-fill.gold { background: var(--accent); }
#btRoot .ov-idx-bar-track::after { content: ''; position: absolute; left: 50%; top: -2px; width: 1px; height: 10px; background: rgba(255,255,255,0.10); }
#btRoot .ov-idx-bar-val { font-family: var(--font-mono); font-size: 13px; font-weight: 600; width: 45px; flex-shrink: 0; }
#btRoot .ov-idx-bar-val.up { color: var(--bullish); }
#btRoot .ov-idx-bar-val.down { color: var(--bearish); }
#btRoot .ov-idx-bar-val.gold { color: var(--accent); }
#btRoot .ov-idx-bar-caption { margin-top: 8px; font-size: 13px; color: var(--text-muted); padding-left: 96px; }


#btRoot .ov-health-bar-container { margin-top: 32px; }
#btRoot .ov-health-bar { display: flex; height: 10px; border-radius: 5px; overflow: hidden; gap: 1px; }
#btRoot .ov-health-seg { transition: width 1s ease; }
#btRoot .ov-health-seg.good { background: var(--bullish); }
#btRoot .ov-health-seg.neutral { background: var(--accent); }
#btRoot .ov-health-seg.bad { background: var(--bearish); opacity: 0.7; }
#btRoot .ov-health-seg.severe { background: var(--bearish); }

#btRoot .ov-health-legend { display: flex; gap: 20px; margin-top: 12px; flex-wrap: wrap; }
#btRoot .ov-health-legend-item { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
#btRoot .ov-health-legend-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
#btRoot .ov-health-legend-dot.good { background: var(--bullish); }
#btRoot .ov-health-legend-dot.neutral { background: var(--accent); }
#btRoot .ov-health-legend-dot.bad { background: var(--bearish); opacity: 0.7; }
#btRoot .ov-health-legend-dot.severe { background: var(--bearish); }
#btRoot .ov-health-legend-val { font-family: var(--font-mono); font-weight: 600; color: var(--text-main); }


#btRoot .ov-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 8px;
}
#btRoot .ov-section-header .ov-section-label { margin-bottom: 0; }

#btRoot .ov-select {
    background: var(--bg-body);
    border: 1px solid var(--border-subtle);
    color: var(--text-main);
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-family: var(--font-mono);
    cursor: pointer;
}

#btRoot .ov-timeframe-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 16px;
}
#btRoot .ov-tab {
    background: transparent;
    border: none;
    color: var(--text-muted);
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: var(--font-mono);
}
#btRoot .ov-tab.active {
    background: var(--bg-card-hover);
    color: var(--text-main);
    font-weight: 600;
}
#btRoot .ov-tab:hover { background: var(--bg-card-hover); }

#btRoot .ov-perf-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    position: relative;
}

#btRoot .ov-histogram-watermark {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 48px;
    font-weight: 600;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: var(--text-main);
    opacity: 0.07;
    pointer-events: none;
    z-index: 1;
    white-space: nowrap;
    user-select: none;
}
@media (max-width: 768px) {

    #btRoot .ov-histogram-watermark { font-size: 24px; }

}

#btRoot .ov-perf-bar-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 0;
}
#btRoot .ov-perf-bar-label {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-main);
    width: 100px;
    flex-shrink: 0;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#btRoot .ov-perf-bar-track {
    flex: 1;
    height: 10px;
    position: relative;
    border-radius: 2px;
}
#btRoot .ov-perf-bar-fill {
    height: 100%;
    border-radius: 2px;
    transition: width 0.3s ease;
    min-width: 2px;
}
#btRoot .ov-perf-bar-fill.positive { background: var(--bullish); }
#btRoot .ov-perf-bar-fill.negative { background: var(--bearish); }
#btRoot .ov-perf-bar-value {
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-mono);
    width: 65px;
    flex-shrink: 0;
    text-align: left;
}

#btRoot .ov-sector-insight {
    margin-top: 16px;
    font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.6;
}
#btRoot .ov-sector-insight strong { color: var(--text-main); }


#btRoot .ov-bullets { display: flex; flex-direction: column; gap: 0; }
#btRoot .ov-bullet { padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,0.06); display: flex; gap: 14px; align-items: flex-start; }
#btRoot .ov-bullet:last-child { border-bottom: none; }
#btRoot .ov-bullet-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 7px; }
#btRoot .ov-bullet-dot.up { background: var(--bullish); box-shadow: 0 0 6px rgba(34,197,94,0.4); }
#btRoot .ov-bullet-dot.down { background: var(--bearish); box-shadow: 0 0 6px rgba(239,68,68,0.4); }
#btRoot .ov-bullet-dot.warn { background: var(--neutral); box-shadow: 0 0 6px rgba(234,179,8,0.4); }
#btRoot .ov-bullet-dot.neutral { background: var(--text-muted); }
#btRoot .ov-bullet-text { font-size: 15px; color: var(--text-secondary); line-height: 1.6; }
#btRoot .ov-bullet-text strong { color: var(--text-main); font-weight: 600; }
#btRoot .ov-bullet-text .up { color: var(--bullish); font-weight: 600; }
#btRoot .ov-bullet-text .down { color: var(--bearish); font-weight: 600; }
#btRoot .ov-bullet-text .gold { color: var(--accent); font-weight: 600; }


#btRoot .ov-sector-strip { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; padding-bottom: 4px; }
#btRoot .ov-sector-strip::-webkit-scrollbar { display: none; }
#btRoot .ov-sector-chip { flex-shrink: 0; padding: 14px 18px; background: rgba(255,255,255,0.022); border-radius: 10px; text-align: center; min-width: 100px; }
#btRoot .ov-sector-chip-name { font-size: 12px; font-weight: 600; color: var(--text-muted); margin-bottom: 6px; white-space: nowrap; }
#btRoot .ov-sector-chip-val { font-family: var(--font-mono); font-size: 16px; font-weight: 700; letter-spacing: -0.5px; }
#btRoot .ov-sector-chip-val.up { color: var(--bullish); }
#btRoot .ov-sector-chip-val.down { color: var(--bearish); }
#btRoot .ov-sector-chip-val.gold { color: var(--accent); }
#btRoot .ov-sector-chip-delta { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); margin-top: 4px; }


#btRoot .ov-movers-split { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
#btRoot .ov-movers-col-label { font-size: 13px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; margin-bottom: 14px; }
#btRoot .ov-movers-col-label.up { color: var(--bullish); }
#btRoot .ov-movers-col-label.down { color: var(--bearish); }

#btRoot .ov-mover-row { display: flex; align-items: center; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
#btRoot .ov-mover-row:last-child { border-bottom: none; }
#btRoot .ov-mover-rank { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); width: 22px; flex-shrink: 0; }
#btRoot .ov-mover-ticker { font-family: var(--font-mono); font-size: 14px; font-weight: 600; color: var(--text-main); width: 60px; flex-shrink: 0; }
#btRoot .ov-mover-sector { font-size: 13px; color: var(--text-muted); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#btRoot .ov-mover-pct { font-family: var(--font-mono); font-size: 14px; font-weight: 600; flex-shrink: 0; text-align: right; }
#btRoot .ov-mover-pct.up { color: var(--bullish); }
#btRoot .ov-mover-pct.down { color: var(--bearish); }


#btRoot .ov-news-date {
    display: inline-block;
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    background: rgba(255,255,255,0.07);
    padding: 2px 8px;
    border-radius: 5px;
    white-space: nowrap;
    flex-shrink: 0;
}
#btRoot.light-theme .ov-news-date { background: rgba(0,0,0,0.05); }


#btRoot .news-rail {
    width: 300px;
    flex-shrink: 0;
    padding: 32px 24px;
    padding-top: 100px;
    position: relative;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.15) transparent;
}

#btRoot .news-rail::before {
    content: '';
    position: absolute;
    left: 0;
    top: 48px;
    bottom: 48px;
    width: 1px;
    background: rgba(255,255,255,0.06);
}
#btRoot.light-theme .news-rail::before { background: rgba(0,0,0,0.08); }
#btRoot .ov-panel-label {
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--accent);
    padding-bottom: 14px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--border-subtle);
}
#btRoot .ov-panel-group-label {
    font-family: var(--font-mono);
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--text-muted);
    margin: 20px 0 10px;
}
#btRoot .ov-panel-group-label:empty { display: none; }
#btRoot .ov-panel-label + .ov-panel-group-label { margin-top: 0; }
#btRoot .ov-panel-flash-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 2px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    cursor: pointer;
}
#btRoot .ov-panel-flash-item:last-child { border-bottom: none; }
#btRoot.light-theme .ov-panel-flash-item { border-bottom-color: rgba(0,0,0,0.06); }
#btRoot .ov-panel-flash-title {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.5;
    transition: color 0.2s;
}
#btRoot .ov-panel-flash-item:hover .ov-panel-flash-title { color: var(--text-main); }


#btRoot .ov-news-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(0,0,0,0.65);
    backdrop-filter: blur(4px);
    align-items: center;
    justify-content: center;
    padding: 24px;
}
#btRoot .ov-news-modal.open { display: flex; }
#btRoot .ov-news-modal-card {
    position: relative;
    max-width: 560px;
    width: 100%;
    max-height: 80vh;
    overflow-y: auto;
    background: #141416;
    border: 1px solid var(--border-subtle);
    border-radius: 16px;
    padding: 28px;
}
#btRoot.light-theme .ov-news-modal-card { background: var(--bg-body); }
#btRoot .ov-news-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    color: var(--text-muted);
    font-size: 16px;
    cursor: pointer;
}
#btRoot .ov-news-modal-close:hover { color: var(--text-main); border-color: var(--accent); }
#btRoot .ov-news-modal-date {
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 600;
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 1px;
}
#btRoot .ov-news-modal-title {
    font-size: 19px;
    font-weight: 700;
    color: var(--text-main);
    line-height: 1.35;
    margin: 10px 0 12px;
    padding-right: 28px;
}
#btRoot .ov-news-modal-text {
    font-size: 15px;
    color: var(--text-secondary);
    line-height: 1.7;
}


#btRoot .ov-explore { padding: 40px 0 56px; text-align: center; opacity: 0; transform: translateY(16px); transition: all 0.6s ease; }
#btRoot .ov-explore.visible { opacity: 1; transform: translateY(0); }
#btRoot .ov-explore-row { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
#btRoot .ov-explore-btn { font-family: var(--font-ui); font-size: 12px; font-weight: 500; color: var(--text-muted); background: transparent; border: 1px solid var(--border-subtle); border-radius: 8px; padding: 10px 22px; cursor: pointer; transition: all 0.25s; }
#btRoot .ov-explore-btn:hover { color: var(--text-main); border-color: rgba(197,165,101,0.3); background: rgba(197,165,101,0.04); }



@media (max-width: 1200px) {

    #btRoot .sidebar {
        position: fixed;
        top: 0;
        left: -280px;
        width: 280px;
        height: 100%;
        z-index: 999;
        transition: left 0.3s ease;
        background: var(--bg-body);
        padding-top: 32px;
    }
    #btRoot .sidebar::after { display: none; }
    #btRoot .sidebar.open { left: 0; }

    #btRoot .hamburger-btn {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #btRoot {
        flex-direction: column;
        height: auto;
        min-height: 100vh;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    #btRoot .main-view {
        overflow: visible;
        height: auto;
        min-height: auto;
        flex: 1;
        -webkit-overflow-scrolling: touch;
    }

}

@media (max-width: 1200px) {

    
    #btRoot .news-rail { display: none !important; }

}
@media (max-width: 640px) {

    #btRoot .tech-overview { padding: 0 20px; }
    #btRoot .ov-movers-split { grid-template-columns: 1fr; gap: 20px; }
    #btRoot .ov-section { padding: 40px 0; }
    #btRoot .ov-idx-bar-caption { padding-left: 0; }

}



#btRoot .tech-breadth {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 32px 80px;
}


#btRoot .br-section {
    padding: 48px 0;
    border-top: 1px solid var(--border-subtle);
    opacity: 0;
    transform: translateY(24px);
    transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
#btRoot .br-section.visible { opacity: 1; transform: translateY(0); }
#btRoot .br-section:first-child { border-top: none; }

#btRoot .br-section-label {
    font-size: 13px;
    font-family: var(--font-mono);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--text-muted);
    margin-bottom: 24px;
}

#btRoot .br-card {
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    padding: 24px;
}
#btRoot.light-theme .br-card { background: rgba(0,0,0,0.02); }


#btRoot .br-chart-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 12px;
}
#btRoot .br-chart-controls { display: flex; align-items: center; gap: 8px; }

#btRoot .br-select {
    background: var(--bg-body);
    border: 1px solid var(--border-subtle);
    color: var(--text-main);
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-family: var(--font-mono);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2386868b'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    padding-right: 28px;
    max-width: 100%;
    min-width: 0;
}
#btRoot.light-theme .br-select { background: var(--bg-body); border-color: rgba(0,0,0,0.1); }

#btRoot .br-metric-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    background: rgba(255,255,255,0.06);
    border-radius: 8px;
    padding: 3px;
    margin-bottom: 16px;
}
#btRoot.light-theme .br-metric-tabs { background: rgba(0,0,0,0.03); }
#btRoot .br-metric-tab {
    background: transparent;
    border: none;
    color: var(--text-muted);
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: var(--font-mono);
    white-space: nowrap;
}
#btRoot .br-metric-tab.active {
    background: var(--bg-card-hover);
    color: var(--text-main);
    font-weight: 600;
}
#btRoot .br-metric-tab:hover:not(.active) { color: var(--text-main); }

#btRoot .br-fullscreen-btn {
    background: transparent;
    border: 1px solid var(--border-subtle);
    color: var(--text-muted);
    width: 34px;
    height: 34px;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.2s;
    flex-shrink: 0;
}
#btRoot .br-fullscreen-btn:hover { color: var(--text-main); border-color: var(--accent); }


#btRoot .br-fs-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 10000;
    background: var(--bg-body);
}
#btRoot .br-fs-modal.open { display: flex; }
#btRoot .br-fs-modal-inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 16px 20px;
    overflow: hidden;
}
#btRoot .br-fs-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    margin-bottom: 12px;
    gap: 12px;
}
#btRoot .br-fs-modal-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    background: rgba(255,255,255,0.06);
    border-radius: 8px;
    padding: 3px;
    margin-bottom: 12px;
    flex-shrink: 0;
}
#btRoot.light-theme .br-fs-modal-tabs { background: rgba(0,0,0,0.03); }
#btRoot .br-fs-modal-canvas {
    flex: 1;
    min-height: 0;
    position: relative;
}
#btRoot .br-fs-modal-canvas canvas { width: 100% !important; height: 100% !important; }
#btRoot .br-fs-modal .br-metric-desc { flex-shrink: 0; margin-top: 8px; margin-bottom: 0; }

#btRoot .br-chart-canvas-wrap {
    position: relative;
    height: 420px;
    margin-bottom: 16px;
}
#btRoot .br-chart-canvas-wrap canvas { width: 100% !important; height: 100% !important; }


#btRoot .br-metric-desc {
    font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.6;
    padding: 14px 18px;
    background: rgba(255,255,255,0.06);
    border-radius: 8px;
    border-left: 2px solid var(--accent);
    margin-top: 8px;
}
#btRoot.light-theme .br-metric-desc { background: rgba(0,0,0,0.02); }


#btRoot .br-synthesis {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
    font-size: 15px;
    line-height: 1.75;
    color: var(--text-secondary);
}
#btRoot .br-synthesis strong { color: var(--text-main); font-weight: 600; }


#btRoot .ai-paragraph {
    margin-bottom: 16px;
    line-height: 1.7;
}
#btRoot .ai-paragraph:last-child { margin-bottom: 0; }
#btRoot .ai-paragraph strong { color: var(--text-main); font-weight: 600; }

#btRoot .ai-sec-title {
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--accent);
    margin: 24px 0 10px;
}
#btRoot .ai-sec-title:first-child { margin-top: 0; }

#btRoot .positive { color: var(--bullish); font-weight: 600; }
#btRoot .negative { color: var(--bearish); font-weight: 600; }
#btRoot .neutral-highlight,
#btRoot .neutral { color: var(--neutral); font-weight: 600; }
#btRoot .gold { color: var(--accent); font-weight: 600; }

#btRoot .positive strong,
#btRoot .negative strong,
#btRoot .neutral-highlight strong,
#btRoot .gold strong { color: inherit; }


#btRoot.light-theme .positive { color: #15803d; }
#btRoot.light-theme .negative { color: #dc2626; }
#btRoot.light-theme .neutral-highlight,
#btRoot.light-theme .neutral { color: #b45309; }
#btRoot.light-theme .gold { color: #9a7b3f; }
#btRoot.light-theme .ai-sec-title { color: #9a7b3f; }


#btRoot .br-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

#btRoot .br-index-card {
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
#btRoot.light-theme .br-index-card { background: rgba(0,0,0,0.02); }

#btRoot .br-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#btRoot .br-card-index-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-main);
    letter-spacing: -0.3px;
}
#btRoot .br-card-score {
    font-family: var(--font-mono);
    font-size: 13px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 12px;
}
#btRoot .br-card-score.good { color: var(--bullish); background: rgba(34,197,94,0.1); }
#btRoot .br-card-score.warn { color: var(--neutral); background: rgba(234,179,8,0.1); }
#btRoot .br-card-score.bad { color: var(--bearish); background: rgba(239,68,68,0.1); }

#btRoot .br-period-toggle {
    display: flex;
    gap: 2px;
    background: rgba(255,255,255,0.06);
    border-radius: 6px;
    padding: 2px;
}
#btRoot.light-theme .br-period-toggle { background: rgba(0,0,0,0.03); }
#btRoot .br-period-btn {
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-muted);
    background: transparent;
    border: none;
    padding: 8px 16px;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.2s;
}
#btRoot .br-period-btn.active {
    background: rgba(255,255,255,0.10);
    color: var(--text-main);
    font-weight: 600;
}
#btRoot.light-theme .br-period-btn.active { background: rgba(0,0,0,0.06); }


#btRoot .br-card-viz {
    display: flex;
    align-items: center;
    gap: 16px;
}
#btRoot .br-donut-wrap {
    width: 72px;
    height: 72px;
    flex-shrink: 0;
    position: relative;
}
#btRoot .br-donut-wrap canvas { width: 72px !important; height: 72px !important; }
#btRoot .br-donut-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}
#btRoot .br-donut-val {
    font-family: var(--font-mono);
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}
#btRoot .br-donut-unit {
    font-family: var(--font-mono);
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 1px;
}

#btRoot .br-card-mini-chart {
    flex: 1;
    height: 52px;
    min-width: 0;
}
#btRoot .br-card-mini-chart canvas { width: 100% !important; height: 52px !important; }


#btRoot .br-percentile { display: flex; flex-direction: column; gap: 6px; }
#btRoot .br-percentile-label {
    font-size: 12px;
    font-family: var(--font-mono);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.8px;
}
#btRoot .br-percentile-track {
    height: 4px;
    background: rgba(255,255,255,0.06);
    border-radius: 2px;
    position: relative;
}
#btRoot.light-theme .br-percentile-track { background: rgba(0,0,0,0.06); }
#btRoot .br-percentile-fill {
    height: 100%;
    border-radius: 2px;
    transition: width 0.8s ease;
}
#btRoot .br-percentile-marker {
    position: absolute;
    top: -3px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid var(--bg-body);
    transform: translateX(-50%);
    transition: left 0.8s ease;
}
#btRoot .br-percentile-range {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    font-family: var(--font-mono);
    color: var(--text-dim);
}


#btRoot .br-card-narrative {
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-secondary);
}
#btRoot .br-card-narrative strong { color: var(--text-main); }
#btRoot .br-card-narrative .up { color: var(--bullish); font-weight: 600; }
#btRoot .br-card-narrative .down { color: var(--bearish); font-weight: 600; }
#btRoot .br-card-narrative .gold { color: var(--accent); font-weight: 600; }


@media (max-width: 900px) {

    #btRoot .br-cards-grid { grid-template-columns: 1fr 1fr; }

}
@media (max-width: 640px) {

    #btRoot .tech-breadth { padding: 24px 20px 60px; }
    #btRoot .br-cards-grid { grid-template-columns: 1fr; }
    #btRoot .br-chart-canvas-wrap { height: 260px; }
    #btRoot .br-metric-tabs { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
    #btRoot .br-section { padding: 36px 0; }
    
    #btRoot .br-chart-controls { flex-wrap: wrap; width: 100%; min-width: 0; }
    #btRoot .br-chart-controls .br-select { flex: 1 1 auto; }

}


#btRoot .tech-sectors { max-width: 1200px; margin: 0 auto; padding: 40px 32px 80px; }
#btRoot .sc-section { padding: 48px 0; border-top: 1px solid var(--border-subtle); opacity: 0; transform: translateY(24px); transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
#btRoot .sc-section.visible { opacity: 1; transform: translateY(0); }
#btRoot .sc-section:first-child { border-top: none; }
#btRoot .sc-section-label { font-size: 13px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--text-muted); margin-bottom: 24px; }
#btRoot .sc-card { background: rgba(255,255,255,0.06); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 24px; }
#btRoot.light-theme .sc-card { background: rgba(0,0,0,0.02); }
#btRoot .sc-chart-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 12px; }
#btRoot .sc-chart-controls { display: flex; align-items: center; gap: 8px; }
#btRoot .sc-select { background: var(--bg-body); border: 1px solid var(--border-subtle); color: var(--text-main); padding: 8px 14px; border-radius: 8px; font-size: 13px; font-family: var(--font-mono); cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2386868b'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 28px; }
#btRoot.light-theme .sc-select { background: var(--bg-body); border-color: rgba(0,0,0,0.1); }
#btRoot .sc-fullscreen-btn { background: transparent; border: 1px solid var(--border-subtle); color: var(--text-muted); width: 34px; height: 34px; border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 16px; transition: all 0.2s; flex-shrink: 0; }
#btRoot .sc-fullscreen-btn:hover { color: var(--text-main); border-color: var(--accent); }
#btRoot .sc-chart-canvas-wrap { position: relative; height: 450px; margin-bottom: 16px; }
#btRoot .sc-chart-canvas-wrap canvas { width: 100% !important; height: 100% !important; }
#btRoot .sc-histogram-insight { font-size: 14px; color: var(--text-secondary); line-height: 1.6; padding: 14px 18px; background: rgba(255,255,255,0.06); border-radius: 8px; border-left: 2px solid var(--accent); margin-top: 8px; }
#btRoot.light-theme .sc-histogram-insight { background: rgba(0,0,0,0.02); }
#btRoot .sc-histogram-insight strong { color: var(--text-main); font-weight: 600; }

#btRoot .sc-fs-modal { display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 10000; background: var(--bg-body); }
#btRoot .sc-fs-modal.open { display: flex; }
#btRoot .sc-fs-modal-inner { display: flex; flex-direction: column; width: 100%; height: 100%; padding: 16px 20px; overflow: hidden; }
#btRoot .sc-fs-modal-header { display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; margin-bottom: 12px; gap: 12px; }
#btRoot .sc-fs-modal-canvas { flex: 1; min-height: 0; position: relative; }
#btRoot .sc-fs-modal-canvas canvas { width: 100% !important; height: 100% !important; }
#btRoot .sc-fs-modal .sc-histogram-insight { flex-shrink: 0; margin-top: 8px; margin-bottom: 0; }

#btRoot .sc-trends-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
#btRoot .sc-trend-card { background: rgba(255,255,255,0.06); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 20px; display: flex; flex-direction: column; gap: 12px; transition: border-color 0.2s; }
#btRoot.light-theme .sc-trend-card { background: rgba(0,0,0,0.02); }
#btRoot .sc-trend-card:hover { border-color: var(--accent); }
#btRoot .sc-trend-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
#btRoot .sc-trend-name { font-size: 15px; font-weight: 600; color: var(--text-main); letter-spacing: -0.3px; }
#btRoot .sc-trend-ticker { font-size: 13px; font-family: var(--font-mono); color: var(--text-muted); margin-top: 2px; }
#btRoot .sc-trend-badges { display: flex; gap: 4px; margin-top: 4px; }
#btRoot .sc-signal-badge { font-size: 12px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; padding: 4px 10px; border-radius: 4px; }
#btRoot .sc-signal-breakout { color: var(--bullish); background: rgba(34,197,94,0.12); }
#btRoot .sc-signal-hot-up { color: #f59e0b; background: rgba(245,158,11,0.12); }
#btRoot .sc-signal-hot-down { color: var(--bearish); background: rgba(239,68,68,0.12); }
#btRoot .sc-trend-rs { text-align: right; padding: 6px 10px; border-radius: 8px; flex-shrink: 0; }
#btRoot .sc-trend-rs-label { font-size: 12px; font-family: var(--font-mono); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; }
#btRoot .sc-trend-rs-value { font-size: 16px; font-family: var(--font-mono); font-weight: 700; margin-top: 2px; }
#btRoot .sc-trend-chart-wrap { height: 60px; position: relative; }
#btRoot .sc-trend-chart-wrap canvas { width: 100% !important; height: 100% !important; }
#btRoot .sc-trend-metrics { display: flex; justify-content: space-between; gap: 8px; border-top: 1px solid var(--border-subtle); padding-top: 10px; }
#btRoot .sc-trend-metric { display: flex; flex-direction: column; align-items: center; gap: 2px; flex: 1; }
#btRoot .sc-trend-metric-label { font-size: 12px; font-family: var(--font-mono); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; }
#btRoot .sc-trend-metric-value { font-size: 14px; font-family: var(--font-mono); font-weight: 600; color: var(--text-main); }

#btRoot .sc-ai-header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
#btRoot .sc-ai-stars { position: relative; width: 24px; height: 24px; flex-shrink: 0; }
#btRoot .sc-ai-stars .s { position: absolute; color: var(--accent); line-height: 1; filter: drop-shadow(0 0 3px rgba(197,165,101,0.5)); animation: ov-star-float 3s ease-in-out infinite; }
#btRoot .sc-ai-stars .s1 { font-size: 15px; top: 2px; left: 3px; animation-delay: 0s; }
#btRoot .sc-ai-stars .s2 { font-size: 9px; top: -2px; right: 0px; animation-delay: -1s; }
#btRoot .sc-ai-stars .s3 { font-size: 7px; bottom: 1px; left: 0px; animation-delay: -2s; }
#btRoot .sc-ai-title { font-size: 13px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); }
#btRoot .sc-ai-status { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
#btRoot .sc-ai-body { font-size: 15px; line-height: 1.75; color: var(--text-secondary); }
#btRoot .sc-ai-body p { margin-bottom: 16px; }
#btRoot .sc-ai-body p:last-child { margin-bottom: 0; }
#btRoot .sc-ai-body strong { color: var(--text-main); font-weight: 600; }
#btRoot .sc-ai-body .up { color: var(--bullish); font-weight: 600; }
#btRoot .sc-ai-body .down { color: var(--bearish); font-weight: 600; }
#btRoot .sc-ai-body .gold { color: var(--accent); font-weight: 600; }

#btRoot .sc-mobile-tabs { display: none; gap: 2px; background: rgba(255,255,255,0.06); border-radius: 10px; padding: 3px; margin-bottom: 24px; }
#btRoot.light-theme .sc-mobile-tabs { background: rgba(0,0,0,0.04); }
#btRoot .sc-mobile-tab { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 12px; border-radius: 8px; border: none; background: transparent; color: var(--text-muted); font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; }
#btRoot .sc-mobile-tab.active { background: rgba(255,255,255,0.10); color: var(--text-main); }
#btRoot.light-theme .sc-mobile-tab.active { background: rgba(0,0,0,0.06); }

#btRoot .sc-hero-layout { display: flex; gap: 16px; align-items: flex-start; }
#btRoot .sc-hero-layout > .sc-rotation-card { flex: 1; max-height: 600px; overflow-y: auto; }
#btRoot .sc-hero-layout > .sc-ai-side-card { width: 420px; flex-shrink: 0; max-height: 600px; overflow: hidden; display: flex; flex-direction: column; }
#btRoot .sc-hero-layout > .sc-ai-side-card .sc-ai-body { flex: 1; overflow-y: auto; max-height: 500px; }
@media (max-width: 900px) {
 #btRoot .sc-trends-grid { grid-template-columns: 1fr 1fr; } #btRoot .sc-hero-layout { flex-direction: column; } #btRoot .sc-hero-layout > .sc-ai-side-card { width: 100%; max-height: none; } #btRoot .sc-hero-layout > .sc-rotation-card { max-height: none; } 
}
@media (max-width: 640px) {
 #btRoot .tech-sectors { padding: 24px 20px 60px; } #btRoot .sc-trends-grid { grid-template-columns: 1fr; } #btRoot .sc-chart-canvas-wrap { height: 320px; } #btRoot .sc-mobile-tabs { display: flex; } #btRoot .sc-section { padding: 36px 0; } 
}


#btRoot .tech-performance { max-width: 1200px; margin: 0 auto; padding: 40px 32px 80px; }
#btRoot .pf-section { padding: 48px 0; border-top: 1px solid var(--border-subtle); opacity: 0; transform: translateY(24px); transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
#btRoot .pf-section.visible { opacity: 1; transform: translateY(0); }
#btRoot .pf-section:first-child { border-top: none; }
#btRoot .pf-section-label { font-size: 13px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--text-muted); margin-bottom: 24px; }
#btRoot .pf-card { background: rgba(255,255,255,0.06); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 24px; }
#btRoot.light-theme .pf-card { background: rgba(0,0,0,0.02); }
#btRoot .pf-card-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; flex-wrap: wrap; gap: 8px; font-size: 15px; font-weight: 600; color: var(--text-main); letter-spacing: -0.2px; }
#btRoot .pf-card-title i { color: var(--text-muted); margin-right: 4px; }
#btRoot .pf-select { background: var(--bg-body); border: 1px solid var(--border-subtle); color: var(--text-main); padding: 8px 14px; border-radius: 8px; font-size: 13px; font-family: var(--font-mono); cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2386868b'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 28px; }
#btRoot.light-theme .pf-select { background: var(--bg-body); border-color: rgba(0,0,0,0.1); }
#btRoot .pf-input { background: var(--bg-body); border: 1px solid var(--border-subtle); color: var(--text-main); padding: 8px 14px; border-radius: 8px; font-size: 13px; font-family: var(--font-mono); width: 140px; }
#btRoot .pf-input::placeholder { color: var(--text-muted); }
#btRoot.light-theme .pf-input { background: var(--bg-body); border-color: rgba(0,0,0,0.1); }
#btRoot .pf-top-grid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 16px; align-items: start; }
#btRoot .pf-top-grid > .pf-card,
#btRoot .pf-charts-grid > .pf-card { min-width: 0; }
#btRoot .pf-top-grid > .pf-card:first-child .pf-table-scroll { max-height: 500px; overflow-y: auto; }
#btRoot .pf-top-grid > .pf-ai-card { max-height: 540px; overflow: hidden; display: flex; flex-direction: column; }
#btRoot .pf-top-grid > .pf-ai-card .pf-ai-body { flex: 1; overflow-y: auto; }
#btRoot .pf-table-scroll { overflow-x: auto; }
#btRoot .pf-table { width: 100%; border-collapse: separate; border-spacing: 0; font-family: var(--font-mono); font-size: 15px; }
#btRoot .pf-table th,
#btRoot .pf-table td { padding: 10px 12px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--border-subtle); }
#btRoot .pf-table th { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); position: sticky; top: 0; background: #111114; z-index: 3; box-shadow: 0 1px 0 var(--border-subtle); }
#btRoot .pf-table th:first-child,
#btRoot .pf-table td:first-child { text-align: left; }
#btRoot .pf-table tr:hover { background: var(--bg-card-hover); }
#btRoot .pf-table tfoot td { position: sticky; background: #111114; z-index: 3; }
#btRoot .pf-table tfoot tr:nth-last-child(1) td { bottom: 0; box-shadow: 0 -1px 0 var(--border-subtle); }
#btRoot .pf-table tfoot tr:nth-last-child(2) td { bottom: 37px; }
#btRoot .pf-table tfoot tr:nth-last-child(3) td { bottom: 74px; box-shadow: 0 -1px 0 var(--border-subtle); }
#btRoot.light-theme .pf-table th { background: #f0f1f3; }
#btRoot.light-theme .pf-table tfoot td { background: #f0f1f3; }
#btRoot.light-theme .pf-table tr:hover { background: #f3f4f6; }
#btRoot .pf-stocks-scroll { max-height: 500px; overflow-y: auto; overflow-x: auto; }
#btRoot .pf-stocks-table .pf-rank { color: var(--text-muted); font-size: 14px; width: 30px; }
#btRoot .pf-stocks-table .pf-symbol { font-weight: 600; color: var(--text-main); text-align: left; font-size: 15px; }
#btRoot .pf-stocks-table .pf-sector { color: var(--text-muted); font-size: 14px; text-align: left; }
#btRoot .pf-stocks-table .pf-cap { color: var(--text-muted); font-size: 14px; }
#btRoot .pf-summary-row { font-size: 14px; color: var(--text-muted); }
#btRoot .pf-stocks-title { flex-direction: column; align-items: flex-start; gap: 12px; }
#btRoot .pf-filters { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
#btRoot .pf-mobile-tf-select { display: none; }
#btRoot .pf-charts-grid { display: grid; grid-template-columns: 65fr 35fr; gap: 16px; }
#btRoot .pf-chart-wrap { position: relative; }
#btRoot .pf-chart-wrap canvas { width: 100% !important; height: 100% !important; }
#btRoot .pf-dist-stats { font-size: 13px; color: var(--text-secondary); padding: 12px 0 0; line-height: 1.5; border-top: 1px solid var(--border-subtle); margin-top: 12px; }
#btRoot .pf-dist-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
#btRoot .pf-dist-controls { display: flex; gap: 8px; align-items: center; }
#btRoot .pf-dist-mode-toggle { display: flex; border: 1px solid var(--border-subtle); border-radius: 6px; overflow: hidden; }
#btRoot .pf-dist-mode-btn { background: transparent; border: none; color: var(--text-muted); padding: 5px 8px; cursor: pointer; font-size: 13px; transition: all 0.2s; display: flex; align-items: center; justify-content: center; }
#btRoot .pf-dist-mode-btn.active { background: var(--bg-card-hover); color: var(--text-main); }
#btRoot .pf-dist-mode-btn:hover:not(.active) { color: var(--text-main); }
#btRoot .pf-leader-content { display: flex; flex-direction: column; align-items: center; gap: 16px; }
#btRoot .pf-leader-chart-wrap { width: 160px; height: 160px; }
#btRoot .pf-leader-chart-wrap canvas { width: 100% !important; height: 100% !important; }
#btRoot .pf-leader-legend { font-size: 13px; width: 100%; }

#btRoot .pf-ai-header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
#btRoot .pf-ai-stars { position: relative; width: 24px; height: 24px; flex-shrink: 0; }
#btRoot .pf-ai-stars .s { position: absolute; color: var(--accent); line-height: 1; filter: drop-shadow(0 0 3px rgba(197,165,101,0.5)); animation: ov-star-float 3s ease-in-out infinite; }
#btRoot .pf-ai-stars .s1 { font-size: 15px; top: 2px; left: 3px; animation-delay: 0s; }
#btRoot .pf-ai-stars .s2 { font-size: 9px; top: -2px; right: 0px; animation-delay: -1s; }
#btRoot .pf-ai-stars .s3 { font-size: 7px; bottom: 1px; left: 0px; animation-delay: -2s; }
#btRoot .pf-ai-title { font-size: 13px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); }
#btRoot .pf-ai-status { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
#btRoot .pf-ai-body { font-size: 15px; line-height: 1.75; color: var(--text-secondary); max-height: 400px; overflow-y: auto; }
#btRoot .pf-ai-body p { margin-bottom: 16px; }
#btRoot .pf-ai-body p:last-child { margin-bottom: 0; }
#btRoot .pf-ai-body strong { color: var(--text-main); font-weight: 600; }
#btRoot .pf-ai-body .up { color: var(--bullish); font-weight: 600; }
#btRoot .pf-ai-body .down { color: var(--bearish); font-weight: 600; }
#btRoot .pf-ai-body .gold { color: var(--accent); font-weight: 600; }

#btRoot .pf-mobile-tabs { display: none; gap: 2px; background: rgba(255,255,255,0.06); border-radius: 10px; padding: 3px; margin-bottom: 24px; }
#btRoot.light-theme .pf-mobile-tabs { background: rgba(0,0,0,0.04); }
#btRoot .pf-mobile-tab { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 12px; border-radius: 8px; border: none; background: transparent; color: var(--text-muted); font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; }
#btRoot .pf-mobile-tab.active { background: rgba(255,255,255,0.10); color: var(--text-main); }
#btRoot.light-theme .pf-mobile-tab.active { background: rgba(0,0,0,0.06); }
@media (max-width: 900px) {
 #btRoot .pf-top-grid { grid-template-columns: minmax(0, 1fr); } #btRoot .pf-charts-grid { grid-template-columns: minmax(0, 1fr); } 
}
@media (max-width: 768px) {
 #btRoot .pf-mobile-tf-select { display: block; } #btRoot .pf-sector-table .pf-col-count,
#btRoot .pf-sector-table .pf-col-1w,
#btRoot .pf-sector-table .pf-col-1m,
#btRoot .pf-sector-table .pf-col-3m,
#btRoot .pf-sector-table .pf-col-6m,
#btRoot .pf-sector-table .pf-col-1y,
#btRoot .pf-sector-table .pf-col-ytd { display: none; } #btRoot .pf-sector-table.show-1w .pf-col-1w,
#btRoot .pf-sector-table.show-1m .pf-col-1m,
#btRoot .pf-sector-table.show-3m .pf-col-3m,
#btRoot .pf-sector-table.show-6m .pf-col-6m,
#btRoot .pf-sector-table.show-1y .pf-col-1y,
#btRoot .pf-sector-table.show-ytd .pf-col-ytd { display: table-cell; } #btRoot .pf-sector-table .pf-col-pos { display: table-cell; } #btRoot .pf-stocks-table th:nth-child(3),
#btRoot .pf-stocks-table td:nth-child(3),
#btRoot .pf-stocks-table th:nth-child(4),
#btRoot .pf-stocks-table td:nth-child(4),
#btRoot .pf-stocks-table th:nth-child(8),
#btRoot .pf-stocks-table td:nth-child(8),
#btRoot .pf-stocks-table th:nth-child(10),
#btRoot .pf-stocks-table td:nth-child(10) { display: none; } 
}
@media (max-width: 640px) {
 #btRoot .tech-performance { padding: 24px 20px 60px; } #btRoot .pf-mobile-tabs { display: flex; } #btRoot .pf-section { padding: 36px 0; } #btRoot .pf-filters { width: 100%; } #btRoot .pf-select,
#btRoot .pf-input { font-size: 12px; } #btRoot .pf-stocks-scroll { max-height: 400px; } #btRoot .pf-table th,
#btRoot .pf-table td { padding: 8px 6px; font-size: 13px; } #btRoot .pf-dist-stats-grid { grid-template-columns: 1fr 1fr; } 
}


#btRoot .tech-stealth { max-width: 1200px; margin: 0 auto; padding: 40px 32px 80px; }
#btRoot .st-section { padding: 48px 0; border-top: 1px solid var(--border-subtle); opacity: 0; transform: translateY(24px); transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
#btRoot .st-section.visible { opacity: 1; transform: translateY(0); }
#btRoot .st-section:first-child { border-top: none; }
#btRoot .st-section-label { font-size: 13px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--text-muted); margin-bottom: 24px; }
#btRoot .st-card { background: rgba(255,255,255,0.06); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 24px; }
#btRoot.light-theme .st-card { background: rgba(0,0,0,0.02); }


#btRoot .st-top-row {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    grid-template-areas:
        "donut table"
        "ai    ai";
    gap: 16px;
    align-items: stretch;
}
#btRoot .st-top-row > .st-card { min-width: 0; }
#btRoot .st-donut-top-card { grid-area: donut; display: flex; flex-direction: column; padding: 20px; overflow: hidden; }
#btRoot .st-sectors-top-card { grid-area: table; display: flex; flex-direction: column; overflow: hidden; }
#btRoot .st-ai-top-card { grid-area: ai; }
#btRoot .st-sectors-top-title { font-size: 14px; font-weight: 600; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
#btRoot .st-ai-top-card { display: flex; flex-direction: column; max-height: none; }
#btRoot .st-donut-section { display: flex; flex-direction: column; align-items: center; flex: 1; }
#btRoot .st-comparison-section { display: flex; flex-direction: column; gap: 12px; }
#btRoot .st-donut-wrap { width: 140px; height: 140px; position: relative; }
#btRoot .st-donut-wrap canvas { width: 140px !important; height: 140px !important; }

#btRoot .st-chart-card { display: flex; flex-direction: column; min-height: 500px; }
#btRoot .st-donut-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; pointer-events: none; }
#btRoot .st-donut-val { font-family: var(--font-mono); font-size: 30px; font-weight: 700; color: var(--bullish); line-height: 1; }
#btRoot .st-donut-lbl { font-size: 11px; color: var(--text-muted); margin-top: 4px; font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; max-width: 96px; margin-left: auto; margin-right: auto; }
#btRoot .st-donut-legend { display: flex; flex-direction: column; gap: 8px; width: 100%; max-width: 200px; }
#btRoot .st-legend-row { display: flex; align-items: center; gap: 8px; }
#btRoot .st-legend-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
#btRoot .st-legend-text { font-size: 13px; color: var(--text-muted); flex: 1; }
#btRoot .st-legend-val { font-family: var(--font-mono); font-size: 14px; font-weight: 600; }
#btRoot .st-mega-card-title { font-size: 15px; font-weight: 600; color: var(--text-main); letter-spacing: -0.3px; }
#btRoot .st-bar-group { display: flex; flex-direction: column; gap: 6px; }
#btRoot .st-bar-label { font-size: 13px; font-family: var(--font-mono); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; }
#btRoot .st-bar-track { height: 28px; background: rgba(255,255,255,0.06); border-radius: 6px; overflow: hidden; position: relative; }
#btRoot.light-theme .st-bar-track { background: rgba(0,0,0,0.04); }
#btRoot .st-bar-fill { height: 100%; border-radius: 6px; display: flex; align-items: center; justify-content: flex-end; padding: 0 10px; font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: #fff; transition: width 0.8s cubic-bezier(0.16, 1, 0.3, 1); min-width: 50px; }
#btRoot .st-bar-index { background: linear-gradient(90deg, var(--accent), #d4a843); }
#btRoot .st-bar-median { background: linear-gradient(90deg, var(--bearish), #f97316); }
#btRoot .st-bar-newhigh { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--bullish); padding: 4px 0; }
#btRoot .st-bar-newhigh i { font-size: 16px; }
#btRoot .st-table-card { padding: 16px; }
#btRoot .st-table-wrap { overflow-x: auto; }
#btRoot .st-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 15px; }
#btRoot .st-table thead { border-bottom: 1px solid var(--border-subtle); }
#btRoot .st-table th { font-family: var(--font-mono); font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.8px; color: var(--text-muted); padding: 12px 10px; text-align: right; white-space: nowrap; background: #111114; position: sticky; top: 0; z-index: 3; box-shadow: 0 1px 0 var(--border-subtle); }
#btRoot.light-theme .st-table th { background: #f0f1f3; }
#btRoot .st-th-sector { text-align: left; }
#btRoot .st-th-count { text-align: center; }
#btRoot .st-table td { padding: 10px 8px; border-bottom: 1px solid rgba(255,255,255,0.06); }
#btRoot.light-theme .st-table td { border-bottom-color: rgba(0,0,0,0.04); }
#btRoot .st-td-sector { font-weight: 600; color: var(--text-main); font-size: 15px; white-space: nowrap; text-align: left; }
#btRoot .st-td-count { font-family: var(--font-mono); font-size: 15px; color: var(--text-muted); text-align: center; }
#btRoot .st-td-perf { font-family: var(--font-mono); font-size: 15px; font-weight: 600; text-align: right; }
#btRoot .st-chart-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 12px; }
#btRoot .st-chart-controls { display: flex; align-items: center; gap: 8px; }
#btRoot .st-select { background: var(--bg-body); border: 1px solid var(--border-subtle); color: var(--text-main); padding: 8px 14px; border-radius: 8px; font-size: 13px; font-family: var(--font-mono); cursor: pointer; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2386868b'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 28px; max-width: 100%; min-width: 0; }
#btRoot.light-theme .st-select { background: var(--bg-body); border-color: rgba(0,0,0,0.1); }
#btRoot .st-fullscreen-btn { background: transparent; border: 1px solid var(--border-subtle); color: var(--text-muted); width: 34px; height: 34px; border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 16px; transition: all 0.2s; flex-shrink: 0; }
#btRoot .st-fullscreen-btn:hover { color: var(--text-main); border-color: var(--accent); }
#btRoot .st-chart-canvas-wrap { position: relative; height: 420px; margin-bottom: 16px; }
#btRoot .st-chart-canvas-wrap canvas { width: 100% !important; height: 100% !important; }
#btRoot .st-chart-insight { font-size: 14px; color: var(--text-secondary); line-height: 1.6; padding: 14px 18px; background: rgba(255,255,255,0.06); border-radius: 8px; border-left: 2px solid var(--accent); margin-top: 8px; }
#btRoot.light-theme .st-chart-insight { background: rgba(0,0,0,0.02); }
#btRoot .st-ai-header { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
#btRoot .st-ai-stars { position: relative; width: 24px; height: 24px; flex-shrink: 0; }
#btRoot .st-ai-stars .s { position: absolute; color: var(--accent); line-height: 1; filter: drop-shadow(0 0 3px rgba(197,165,101,0.5)); animation: ov-star-float 3s ease-in-out infinite; }
#btRoot .st-ai-stars .s1 { font-size: 15px; top: 2px; left: 3px; animation-delay: 0s; }
#btRoot .st-ai-stars .s2 { font-size: 9px; top: -2px; right: 0px; animation-delay: -1s; }
#btRoot .st-ai-stars .s3 { font-size: 7px; bottom: 1px; left: 0px; animation-delay: -2s; }
#btRoot .st-ai-title { font-size: 13px; font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); }
#btRoot .st-ai-status { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
#btRoot .st-ai-body { font-size: 15px; line-height: 1.75; color: var(--text-secondary); }
#btRoot .st-ai-body p { margin-bottom: 16px; }
#btRoot .st-ai-body p:last-child { margin-bottom: 0; }
#btRoot .st-ai-body strong { color: var(--text-main); font-weight: 600; }
#btRoot .st-ai-body .up { color: var(--bullish); font-weight: 600; }
#btRoot .st-ai-body .down { color: var(--bearish); font-weight: 600; }
#btRoot .st-ai-body .gold { color: var(--accent); font-weight: 600; }
#btRoot .st-fs-modal { display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 10000; background: var(--bg-body); }
#btRoot .st-fs-modal.open { display: flex; }
#btRoot .st-fs-modal-inner { display: flex; flex-direction: column; width: 100%; height: 100%; padding: 16px 20px; overflow: hidden; }
#btRoot .st-fs-modal-header { display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; margin-bottom: 12px; gap: 12px; }
#btRoot .st-fs-modal-canvas { flex: 1; min-height: 0; position: relative; }
#btRoot .st-fs-modal-canvas canvas { width: 100% !important; height: 100% !important; }
#btRoot .st-mobile-tabs { display: none; gap: 2px; background: rgba(255,255,255,0.06); border-radius: 10px; padding: 3px; margin-bottom: 24px; }
#btRoot.light-theme .st-mobile-tabs { background: rgba(0,0,0,0.04); }
#btRoot .st-mobile-tab { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 12px; border-radius: 8px; border: none; background: transparent; color: var(--text-muted); font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; }
#btRoot .st-mobile-tab.active { background: rgba(255,255,255,0.10); color: var(--text-main); }
#btRoot.light-theme .st-mobile-tab.active { background: rgba(0,0,0,0.06); }
@media (max-width: 900px) {

    #btRoot .st-top-row {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "donut"
            "table"
            "ai";
    }

}
@media (max-width: 640px) {
 #btRoot .tech-stealth { padding: 24px 20px 60px; } #btRoot .st-top-row { grid-template-columns: minmax(0, 1fr); } #btRoot .st-donut-wrap { width: 160px; height: 160px; } #btRoot .st-donut-wrap canvas { width: 160px !important; height: 160px !important; } #btRoot .st-donut-val { font-size: 22px; } #btRoot .st-chart-canvas-wrap { height: 260px; } #btRoot .st-mobile-tabs { display: flex; } #btRoot .st-section { padding: 36px 0; } #btRoot .st-table { font-size: 14px; } #btRoot .st-table th { font-size: 12px; padding: 10px 6px; } #btRoot .st-table td { padding: 8px 4px; } #btRoot .st-chart-controls { flex-wrap: wrap; width: 100%; min-width: 0; } #btRoot .st-chart-controls .st-select { flex: 1 1 auto; } 
}




#btRoot .ai-fade-in { animation: ov-fade-in 0.6s ease; }


#btRoot #brSecCards,
#btRoot .sc-hero-section,
#btRoot .pf-top-row,
#btRoot .st-top-section {
    border-top: none;
    padding-top: 8px;
}


#btRoot .news-mobile {
    max-width: 1200px;
    margin: 0 auto;
    padding: 48px 32px 80px;
    border-top: 1px solid var(--border-subtle);
}
@media (min-width: 1201px) {

    
    #btRoot .news-mobile { display: none !important; }

}
@media (max-width: 640px) {

    #btRoot .news-mobile { padding: 40px 20px 60px; }

}


@media (max-width: 480px) {


    
    #btRoot,
#btRoot {
        height: 100%;
        max-height: 100%;
        overflow: hidden;
    }
    #btRoot .main-view {
        flex: 1;
        min-height: 0;
        height: auto;
        overflow: hidden;
        padding: 12px;
        gap: 12px;
    }
    #btRoot .main-scroll {
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        -webkit-mask-image: none;
        mask-image: none;
        scrollbar-width: none;
    }
    #btRoot .main-scroll::-webkit-scrollbar { width: 0; height: 0; }
    #btRoot .top-bar { flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
    #btRoot .page-title { flex: 1 1 auto; min-width: 0; }
    #btRoot .page-title h1 { font-size: 18px; }
    #btRoot .page-title p { font-size: 12px; }
    #btRoot .hamburger-btn { margin-right: 6px; padding: 4px; }
    #btRoot .sec-head h2 { font-size: 22px; letter-spacing: -0.4px; }
    #btRoot .sec-head p { font-size: 13px; }

    
    #btRoot .tech-overview { padding: 0 12px; }
    #btRoot .tech-breadth,
#btRoot .tech-sectors,
#btRoot .tech-performance,
#btRoot .tech-stealth { padding: 20px 12px 48px; }
    #btRoot .news-mobile { padding: 32px 12px 48px; }
    #btRoot .ov-card,
#btRoot .br-card,
#btRoot .sc-card,
#btRoot .pf-card,
#btRoot .st-card { padding: 14px; }
    #btRoot .br-index-card,
#btRoot .sc-trend-card,
#btRoot .st-donut-top-card { padding: 14px; }
    #btRoot .ov-section,
#btRoot .br-section,
#btRoot .sc-section,
#btRoot .pf-section,
#btRoot .st-section { padding: 28px 0; }

    
    #btRoot .ov-select,
#btRoot .br-select,
#btRoot .sc-select,
#btRoot .pf-select,
#btRoot .st-select,
#btRoot .pf-input {
        font-size: 12px;
        padding: 7px 24px 7px 10px;
        max-width: 100%;
        min-width: 0;
    }
    #btRoot .pf-input { padding-right: 10px; width: 100%; }

    
    #btRoot .ov-slide-headline {
        font-size: clamp(21px, 7.5vw, 30px);
        letter-spacing: -0.6px;
        height: auto;
        min-height: 3.6em;
        overflow: visible;
    }
    #btRoot .ov-slide-kicker { font-size: 11px; letter-spacing: 1.6px; }
    #btRoot .ov-slide-metric-val { font-size: 26px; letter-spacing: -0.8px; }
    #btRoot .ov-hero { margin-bottom: 48px; }
    #btRoot .ov-hero-bottomrow { gap: 12px; flex-wrap: wrap; }
    #btRoot .ov-hero-date { font-size: 13px; }
    #btRoot .ov-carousel-slide { padding: 0 4px; }

    #btRoot .ov-card-tabs { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
    #btRoot .ov-card-tabs::-webkit-scrollbar { display: none; }
    #btRoot .ov-card-tab { padding: 10px 12px; font-size: 11px; letter-spacing: 0.5px; white-space: nowrap; flex-shrink: 0; }
    #btRoot .ov-timeframe-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #btRoot .ov-timeframe-tabs::-webkit-scrollbar { display: none; }
    #btRoot .ov-tab { padding: 8px 12px; flex-shrink: 0; }

    #btRoot .ov-perf-bar-label { width: 74px; font-size: 11px; }
    #btRoot .ov-perf-bar-value { width: 52px; font-size: 11px; }
    #btRoot .ov-perf-bar-row { gap: 5px; }
    #btRoot .ov-snapshot { font-size: 15px; }
    #btRoot .ov-section-label { font-size: 11px; margin-bottom: 16px; }

    #btRoot .ov-mover-row { gap: 4px; }
    #btRoot .ov-mover-rank { width: 16px; font-size: 11px; }
    #btRoot .ov-mover-ticker { width: 46px; font-size: 13px; }
    #btRoot .ov-mover-sector { font-size: 11px; min-width: 0; }
    #btRoot .ov-mover-pct { font-size: 12px; }

    
    #btRoot .br-chart-canvas-wrap { height: 220px; }
    #btRoot .br-metric-tab { padding: 7px 10px; font-size: 12px; }
    #btRoot .br-metric-desc,
#btRoot .sc-histogram-insight,
#btRoot .st-chart-insight { font-size: 13px; padding: 12px 12px; }
    #btRoot .br-card-narrative { font-size: 13px; }
    #btRoot .br-synthesis { font-size: 14px; }
    #btRoot .br-period-btn { padding: 7px 10px; }

    
    #btRoot .sc-chart-canvas-wrap { height: 300px; }
    #btRoot .sc-trend-metric-label { font-size: 10px; letter-spacing: 0; }
    #btRoot .sc-trend-metric-value { font-size: 12px; }
    #btRoot .sc-trend-metrics { gap: 4px; }
    #btRoot .sc-ai-body,
#btRoot .pf-ai-body,
#btRoot .st-ai-body { font-size: 14px; }

    
    #btRoot .pf-table-scroll,
#btRoot .pf-stocks-scroll { -webkit-overflow-scrolling: touch; }
    #btRoot .pf-table { font-size: 12px; }
    #btRoot .pf-table th,
#btRoot .pf-table td { padding: 6px 3px; font-size: 12px; }
    #btRoot .pf-table th { font-size: 10px; letter-spacing: 0; }
    #btRoot .pf-sector-table .pf-col-count,
#btRoot .pf-sector-table .pf-col-pos { display: none; }
    #btRoot .pf-sector-table td:first-child {
        max-width: 130px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    #btRoot .pf-stocks-table th:nth-child(5),
#btRoot .pf-stocks-table td:nth-child(5),
#btRoot .pf-stocks-table th:nth-child(9),
#btRoot .pf-stocks-table td:nth-child(9) { display: none; }
    #btRoot .pf-stocks-table .pf-rank { width: 22px; font-size: 11px; }
    #btRoot .pf-stocks-table .pf-symbol { font-size: 12px; }
    #btRoot .pf-filters { flex-direction: column; align-items: stretch; width: 100%; }
    #btRoot .pf-filters .pf-select { width: 100%; }
    #btRoot .pf-card-title { font-size: 14px; }
    #btRoot .pf-dist-stats-grid { grid-template-columns: 1fr; }
    #btRoot .pf-dist-stats { font-size: 12px; }
    #btRoot .pf-leader-chart-wrap { width: 130px; height: 130px; }
    #btRoot .pf-leader-legend { font-size: 12px; }

    
    #btRoot .st-donut-wrap,
#btRoot .st-donut-wrap canvas { width: 130px !important; height: 130px !important; }
    #btRoot .st-donut-val { font-size: 22px; }
    #btRoot .st-chart-canvas-wrap { height: 220px; }
    #btRoot .st-table th:nth-child(2),
#btRoot .st-table td:nth-child(2),
#btRoot .st-table th:nth-child(4),
#btRoot .st-table td:nth-child(4),
#btRoot .st-table th:nth-child(5),
#btRoot .st-table td:nth-child(5),
#btRoot .st-table th:nth-child(6),
#btRoot .st-table td:nth-child(6) { display: none; }
    #btRoot .st-table th { font-size: 10px; padding: 8px 3px; letter-spacing: 0; }
    #btRoot .st-table td { padding: 7px 3px; }
    #btRoot .st-td-sector { font-size: 12px; max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
    #btRoot .st-td-perf { font-size: 12px; }
    #btRoot .st-bar-fill { min-width: 44px; font-size: 12px; padding: 0 8px; }
    #btRoot .st-bar-track { height: 24px; }

    
    #btRoot .br-fs-modal-inner,
#btRoot .sc-fs-modal-inner,
#btRoot .st-fs-modal-inner { padding: 12px; }
    #btRoot .ov-news-modal { padding: 12px; }
    #btRoot .ov-news-modal-card { padding: 20px 16px; }

}


@media (max-width: 300px) {

    #btRoot .pf-stocks-table th:nth-child(1),
#btRoot .pf-stocks-table td:nth-child(1) { display: none; }
    #btRoot .ov-mover-rank { display: none; }

}



#btOverlay { position: fixed; inset: 0; z-index: 4000; display: none; }
#btOverlay.open { display: block; }
#btRoot { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; }


#btRoot .bt-close-btn { margin-left: 10px; flex-shrink: 0; }


#btRoot .bt-range-tabs { margin-left: auto; flex-shrink: 0; }
#btRoot .bt-range-tabs .br-period-btn { padding: 8px 12px; }


:root[data-theme="light"] #btRoot.dark-theme .ov-card { box-shadow: none; }
:root[data-theme="light"] #btRoot.dark-theme .st-bar-track { background: rgba(255,255,255,0.06); }


#btRoot .bt-lwc-host { position: absolute; inset: 0; }
#btRoot .bt-lwc-legend {
  position: absolute; top: 2px; left: 0; right: 0; display: flex; justify-content: center;
  gap: 16px; font-family: var(--font-mono); font-size: 12px; color: #86868b;
  pointer-events: none; z-index: 3;
}
#btRoot .bt-lwc-legend .sw { display: inline-block; width: 12px; height: 3px; margin-right: 5px; vertical-align: middle; border-radius: 1px; }
#btRoot .bt-lwc-tooltip {
  position: absolute; display: none; pointer-events: none; z-index: 4;
  background: rgba(20,20,22,0.95); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px; padding: 12px; font-family: var(--font-mono); font-size: 11px;
  color: #f5f5f7; white-space: nowrap;
}
#btRoot .bt-lwc-tooltip .tt-title { color: #86868b; margin-bottom: 4px; }




.rpt-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  margin: 10px 0;
  font-family: var(--font-ui);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}


.rpt-ai-header {
  display: flex; align-items: center; gap: 14px;
  padding: 16px 18px; border-bottom: 1px solid rgba(167,139,250,.22);
  flex-shrink: 0;
  background:
    linear-gradient(135deg, rgba(88,28,135,.45) 0%, rgba(109,40,217,.28) 45%, rgba(30,64,175,.18) 100%),
    radial-gradient(120% 140% at 0% 0%, rgba(196,181,253,.15), transparent 60%);
  position: relative;
}
.rpt-ai-header::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(167,139,250,.6), transparent);
}
.rpt-ai-stars { width: 28px; height: 28px; flex-shrink: 0; }
.rpt-ai-stars .rpt-star-big {
  fill: #f3e8ff; transform-origin: center; transform-box: fill-box;
  animation: rptSparkleDance 5s ease-in-out infinite;
}
.rpt-ai-stars .rpt-star-small {
  fill: #f3e8ff; transform-origin: center; transform-box: fill-box;
  animation: rptSparkleDance 5s ease-in-out infinite .5s;
}
@keyframes rptSparkleDance {
  0%,100% { transform: rotate(-18deg) scale(1); filter: drop-shadow(0 0 4px rgba(216,180,254,.8)); }
  50%     { transform: rotate(18deg) scale(1.35); filter: drop-shadow(0 0 10px rgba(216,180,254,1)); }
}
.rpt-ai-title {
  font-family: var(--font-ui); font-size: 1.04rem; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase;
  background: linear-gradient(135deg, #d8b4fe, #a78bfa 40%, #7dd3fc);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; white-space: nowrap;
  line-height: 1.15;
}
.rpt-ai-sub {
  font-family: var(--font-ui); font-size: .94rem;
  color: rgba(216,180,254,.75); white-space: nowrap;
  margin-top: 2px; letter-spacing: .02em;
}


.rpt-main-title {
  font-family: var(--font-ui);
  font-size: 1.37rem;
  font-weight: 700;
  color: var(--text-bright);
  line-height: 1.25;
  letter-spacing: -.01em;
  padding: 18px 18px 10px;
  border-bottom: 1px solid var(--border);
}
.rpt-main-title-sym {
  display: inline-block;
  margin-left: 4px;
  padding: 2px 10px;
  border-radius: var(--radius-sm);
  background: rgba(167,139,250,.16);
  color: #c4b5fd;
  font-size: 1.12rem;
  font-weight: 700;
  vertical-align: 2px;
  letter-spacing: .03em;
}


.rpt-header {
  padding: 14px 18px 16px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.rpt-price-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.rpt-price {
  font-size: 1.47rem;
  font-weight: 700;
  color: var(--text-bright);
}
.rpt-change {
  font-size: 1.07rem;
  font-weight: 600;
}
.rpt-change.pos { color: var(--green); }
.rpt-change.neg { color: var(--red); }



.rpt-section:last-child { border-bottom: none; }

.rpt-section {
  padding: 16px 18px 20px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.rpt-section-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 14px;
  font-family: var(--font-ui);
  font-size: 1.395rem;
  font-weight: 700;
  color: var(--text-bright);
  line-height: 1.15;
  letter-spacing: -.01em;
  text-transform: none;
}
.rpt-section-num {
  font-family: var(--font-ui);
  font-size: 1.395rem;
  font-weight: 700;
  color: var(--text-bright);
  line-height: 1.15;
  letter-spacing: -.01em;
  min-width: auto;
  opacity: .55;
}

.rpt-text {
  font-family: var(--font-ui);
  font-size: .94rem;
  line-height: 1.65;
  color: var(--text);
}
.rpt-text strong {
  color: var(--text-bright);
  font-weight: 700;
}
.rpt-text + .rpt-text { margin-top: 10px; }


.rpt-yearly-narr { display: contents; }
.rpt-yearly-narr p { margin: 10px 0 0; }
.rpt-yearly-narr .yr-up { color: var(--green, #26d97f); font-weight: 700; }
.rpt-yearly-narr .yr-dn { color: var(--red, #f0506e); font-weight: 700; }


.rpt-yearly-flowing { display: contents; }
.rpt-yearly-flowing p { margin: 10px 0 0; }
.rpt-yearly-flowing b { font-weight: 700; }
.rpt-yearly-flowing .yr-up { color: var(--green, #26d97f); font-weight: 700; }
.rpt-yearly-flowing .yr-dn { color: var(--red, #f0506e); font-weight: 700; }


.rpt-yearly-waiting { margin: 12px 0 4px; }
.rpt-yearly-waiting .aiTt-wrap { min-height: 120px; padding: 16px 12px; }


.rpt-cascade-waiting { padding: 16px 18px 20px; border-bottom: 1px solid var(--border); }
.rpt-cascade-waiting .aiTt-wrap { min-height: 120px; padding: 16px 12px; }


.rpt-subhead {
  display: block;
  margin: 18px 0 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border);
  font-size: .88rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted);
}
.rpt-text > .rpt-subhead:first-child { margin-top: 4px; }


.rpt-verdict-dot {
  display: inline-block; width: 9px; height: 9px; border-radius: 50%;
  background: currentColor; flex: 0 0 auto;
}
.rpt-verdict {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 4px 10px;
  border-radius: var(--radius-sm);
  font-size: .94rem;
  font-weight: 600;
  line-height: 1;
}
.rpt-verdict.bullish {
  background: var(--green-subtle);
  color: var(--green);
  border: 1px solid rgba(38,217,127,.15);
}
.rpt-verdict.neutral {
  background: var(--amber-light);
  color: var(--amber);
  border: 1px solid rgba(255,184,51,.15);
}
.rpt-verdict.bearish {
  background: var(--red-subtle);
  color: var(--red);
  border: 1px solid rgba(240,80,110,.15);
}


.rpt-wrap.rpt-gated #rptSec5,
.rpt-wrap.rpt-gated #rptSec6,
.rpt-wrap.rpt-gated #rptSec7,
.rpt-wrap.rpt-gated #rptSec8,
.rpt-wrap.rpt-gated .rpt-final,
.rpt-wrap.rpt-gated-c4 #rptSec4 { display: none; }


.rpt-final {
  padding: 16px 18px 18px;
  background: var(--surface-veil);
  border-top: 1px solid var(--border);
}
.rpt-final-title {
  font-family: var(--font-ui);
  font-size: 1.22rem;
  font-weight: 700;
  color: var(--text-bright);
  margin-bottom: 12px;
  letter-spacing: -.01em;
}
.rpt-final-text {
  font-family: var(--font-ui);
  font-size: .94rem;
  line-height: 1.65;
  color: var(--text);
  margin-bottom: 14px;
}
.rpt-score-grid {
  display: grid;
  
  grid-template-columns: 1fr auto auto;
  gap: 7px 9px;
  font-size: .96rem;
  align-items: center;
}
.rpt-score-label {
  color: var(--text-dim);
}
.rpt-score-dot {
  text-align: center;
  font-size: .9rem;
  line-height: 1;
}
.rpt-score-text {
  font-weight: 600;
  text-align: left;
}
.rpt-score-text.pos { color: var(--green); }
.rpt-score-text.neu { color: var(--amber); }
.rpt-score-text.neg { color: var(--red); }

.rpt-score-val {
  font-weight: 600;
  text-align: right;
}
.rpt-score-val.pos { color: var(--green); }
.rpt-score-val.neu { color: var(--amber); }
.rpt-score-val.neg { color: var(--red); }
.rpt-score-val.rpt-score-pending,
.rpt-score-text.rpt-score-pending,
.rpt-score-dot.rpt-score-pending,
.rpt-score-pending {
  color: var(--text-muted);
  font-weight: 500;
  opacity: .75;
}
.rpt-final.rpt-verdict-pending .rpt-score-overall .rpt-score-val {
  color: var(--text-muted);
  font-weight: 600;
}
.rpt-score-overall {
  grid-column: 1 / -1;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  font-size: 1.04rem;
  font-weight: 700;
}


.rpt-loading-section { padding: 8px 0 4px; }
.rpt-loading-section .aiTt-wrap {
  min-height: 120px;
  padding: 14px 0;
  gap: 10px;
}
.rpt-loading-section .aiTt-stage {
  width: 80px;
  height: 80px;
}
.rpt-loading-section .aiTt-big {
  width: 34px;
  height: 34px;
}
.rpt-loading-section .aiTt-orbit-a svg { width: 14px; height: 14px; margin-left: -7px; }
.rpt-loading-section .aiTt-orbit-b svg { width: 12px; height: 12px; margin-left: -6px; bottom: 3px; }
.rpt-loading-section .aiTt-orbit-c svg { width: 10px; height: 10px; margin-top: -5px; }
.rpt-loading-section .aiTt-label { font-size: .85rem; }


.rpt-viz {
  margin: 4px 0 14px;
  padding: 12px 14px;
  background: var(--card);
  border: 1px solid var(--border-hi);
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
}

.rpt-viz > svg { display: block; width: 100%; height: auto; }


.rpt-hc { width: 100%; margin: 2px 0 2px; }
.rpt-hc .highcharts-container { font-family: var(--font-ui) !important; }




.rpt-vol-lede { display: flex; align-items: flex-end; gap: 16px; margin: 2px 0 4px; }
.rpt-vol-hero {
  font-family: var(--font-ui); font-size: 2.9rem; font-weight: 600;
  line-height: .9; letter-spacing: -.03em; color: var(--text-bright);
}
.rpt-vol-hero small { font-size: 1.15rem; font-weight: 500; color: var(--text-muted); }
.rpt-vol-lede-txt { padding-bottom: 4px; }
.rpt-vol-zone { font-size: .98rem; font-weight: 700; letter-spacing: -.01em; color: var(--text-bright); }
.rpt-vol-sub { margin-top: 3px; font-size: .82rem; color: var(--text-muted); }
.rpt-vol-sub b { color: var(--text-soft); font-weight: 600; }


.rpt-vol-zonelbl { display: flex; margin-top: 6px; }
.rpt-vol-zonelbl span {
  flex: 1; text-align: center;
  font-size: .67rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  color: var(--text-muted);
}
.rpt-vol-zonelbl span.on { color: var(--text-bright); }


.rpt-vol-sm { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 2px 20px; }
.rpt-vol-sm-cell { padding: 9px 0 3px; }
.rpt-vol-sm-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 4px; }
.rpt-vol-sm-lbl { font-size: .82rem; font-weight: 600; color: var(--text-soft); }
.rpt-vol-sm-cell.is-active .rpt-vol-sm-lbl { color: var(--text-bright); font-weight: 700; }
.rpt-vol-sm-val { font-family: var(--font-data); font-size: .86rem; font-weight: 700; color: var(--text-bright); }
.rpt-vol-sm-foot {
  display: flex; align-items: center; gap: 6px; margin-top: 5px;
  font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  color: var(--text-muted);
}
.rpt-vol-sm-foot i { width: 8px; height: 8px; border-radius: 2px; flex: 0 0 8px; }

.rpt-vol-sm-cell.is-empty { opacity: .55; }
.rpt-vol-sm-void {
  height: 26px; border-radius: 3px;
  background: repeating-linear-gradient(45deg,
    var(--surface-veil, rgba(255,255,255,.02)) 0 6px,
    transparent 6px 12px);
  border: 1px solid var(--border);
}


.rpt-vol-fighead {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding-bottom: 7px; margin-bottom: 9px; border-bottom: 1px solid var(--border);
}
.rpt-vol-figtitle {
  font-size: .73rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: var(--text-dim);
}
.rpt-vol-note { margin: -3px 0 7px; font-size: .74rem; color: var(--text-muted); }
.rpt-vol-seg { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--border-hi); border-radius: 99px; }
.rpt-vol-seg button {
  font-family: var(--font-ui); font-size: .69rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; padding: 4px 11px; cursor: pointer;
  background: transparent; color: var(--text-muted); border: 0; border-radius: 99px;
  transition: background .15s, color .15s;
}
.rpt-vol-seg button:hover { color: var(--text-bright); }
.rpt-vol-seg button.on { background: var(--text-bright); color: var(--card); }

.rpt-vol-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 7px; }
.rpt-vol-legend[hidden] { display: none; }   
.rpt-vol-legend span { display: flex; align-items: center; gap: 6px; font-size: .75rem; color: var(--text-muted); }
.rpt-vol-legend i { width: 14px; height: 8px; border-radius: 2px; display: block; }


.rpt-vol-tab { width: 100%; border-collapse: collapse; margin-top: 10px; }
.rpt-vol-tab th, .rpt-vol-tab td { text-align: right; padding: 6px 0; font-size: .79rem; border-bottom: 1px solid var(--border); }
.rpt-vol-tab th { font-size: .67rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.rpt-vol-tab td { font-family: var(--font-data); font-variant-numeric: tabular-nums; color: var(--text); }
.rpt-vol-tab th:first-child, .rpt-vol-tab td:first-child { text-align: left; font-family: var(--font-ui); font-weight: 600; color: var(--text-soft); }
.rpt-vol-tab td b { color: var(--text-bright); font-weight: 700; }


.rpt-dl-mono {
  font-family: var(--font-data); font-size: 11.5px; font-weight: 500;
  color: var(--text-dim); font-variant-numeric: tabular-nums;
}
.rpt-dl-mono b { color: var(--text-bright); font-weight: 700; }


.rpt-viz-pct-legend {
  display: flex; flex-wrap: wrap; gap: 4px 18px;
  margin-top: 6px; padding-top: 6px;
  border-top: 1px solid var(--border);
}
.rpt-viz-pct-legend-row {
  display: flex; align-items: baseline; gap: 7px;
  font-size: .84rem;
}
.rpt-viz-rng-num {
  font-size: .84rem; color: var(--text); white-space: nowrap;
}
.rpt-viz-rng-num em {
  font-style: normal; color: var(--text-muted); font-size: .78rem;
}
.rpt-viz-rng-num.typ { color: var(--blue); }
.rpt-viz-rng-num.ext { color: var(--text-muted); }


.rpt-viz-52w-labels {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: .85rem; color: var(--text-muted);
  margin-top: 2px;
}
.rpt-viz-52w-low, .rpt-viz-52w-high { color: var(--text); font-weight: 600; }
.rpt-viz-52w-mid {
  color: var(--text-bright); font-weight: 600;
  font-size: .82rem; opacity: .85;
}


.rpt-viz-horizons { padding: 12px 12px 10px; }
.rpt-viz-hz-title {
  font-size: .82rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 8px;
}
.rpt-viz-hz-wrap {
  position: relative;
  padding: 0 4px;
}
.rpt-viz-hz-grid {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.rpt-viz-hz-grid::-webkit-scrollbar { display: none; }
.rpt-viz-hz-cell {
  flex: 1 0 110px;
  scroll-snap-align: start;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 8px 6px; text-align: center;
}
.rpt-viz-hz-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 26px; height: 26px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text-bright);
  font-size: 1.1rem; font-weight: 700;
  line-height: 1;
  border-radius: 50%;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  z-index: 5;
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
  transition: background var(--ease, .15s ease);
  padding: 0;
}
.rpt-viz-hz-arrow:hover { background: var(--surface-raised, rgba(255,255,255,.08)); }
.rpt-viz-hz-arrow.prev { left: -8px; }
.rpt-viz-hz-arrow.next { right: -8px; }

.rpt-viz-horizons[data-cols="1"] .rpt-viz-hz-arrow,
.rpt-viz-horizons[data-cols="2"] .rpt-viz-hz-arrow,
.rpt-viz-horizons[data-cols="3"] .rpt-viz-hz-arrow,
.rpt-viz-horizons[data-cols="4"] .rpt-viz-hz-arrow { display: none; }
.rpt-viz-hz-lbl {
  font-size: .82rem; color: var(--text-muted); font-weight: 600;
  margin-bottom: 4px;
}
.rpt-viz-hz-val {
  font-size: 1.05rem; font-weight: 700; color: var(--text-bright);
  line-height: 1.2;
}
.rpt-viz-hz-pct {
  font-size: .9rem; font-weight: 700; margin-top: 2px;
}
.rpt-viz-hz-pct.pos { color: var(--green); }
.rpt-viz-hz-pct.neg { color: var(--red); }


.rpt-viz-ma-title,
.rpt-viz-regime-title,
.rpt-viz-dd-title {
  display: flex; align-items: baseline; gap: 0; flex-wrap: wrap;
  font-size: .82rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 8px;
}
.rpt-viz-ma-row {
  display: grid; grid-template-columns: 1fr 80px 70px;
  align-items: center; gap: 10px;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: .94rem;
  margin-bottom: 2px;
}
.rpt-viz-ma-row.is-price {
  background: rgba(167,139,250,.14);
  border: 1px solid rgba(167,139,250,.28);
}
.rpt-viz-ma-row.is-price .rpt-viz-ma-label,
.rpt-viz-ma-row.is-price .rpt-viz-ma-side {
  color: var(--text-bright); font-weight: 700;
}
.rpt-viz-ma-label { color: var(--text); font-weight: 600; }
.rpt-viz-ma-side {
  text-align: center; font-weight: 700; font-size: .82rem;
  letter-spacing: .06em;
  padding: 3px 6px; border-radius: 4px;
}
.rpt-viz-ma-side.pos { color: var(--green); background: rgba(38,217,127,.12); }
.rpt-viz-ma-side.neg { color: var(--red);   background: rgba(240,80,110,.12); }
.rpt-viz-ma-dist { text-align: right; font-weight: 700; font-size: .9rem; }
.rpt-viz-ma-dist.pos { color: var(--green); }
.rpt-viz-ma-dist.neg { color: var(--red); }


.rpt-viz-fwd-desc {
  font-size: .9rem; font-weight: 500; color: var(--text-dim);
  line-height: 1.45; margin: 0 0 12px;
}
.rpt-viz-fwd-desc b { color: var(--text-bright); font-weight: 700; }
.rpt-viz-fwd-desc b.pos { color: var(--green); }
.rpt-viz-fwd-desc b.neg { color: var(--red); }

.rpt-fwdtbl { width: 100%; border-collapse: collapse; font-size: .88rem; }

.rpt-fwdtbl thead th {
  font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: var(--text-muted); text-align: right;
  padding: 0 16px 7px 0; border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.rpt-fwdtbl thead th.l { text-align: left; }
.rpt-fwdtbl thead th:last-child { padding-right: 0; }
.rpt-fwdtbl tbody td {
  padding: 9px 0; border-bottom: 1px solid var(--divider-soft);
  text-align: right; white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.rpt-fwdtbl tbody tr:last-child td { border-bottom: none; }
.rpt-fwdtbl tbody td.rpt-fwdtbl-h {
  text-align: left; font-weight: 700; color: var(--text-bright);
  width: 1%; padding: 9px 16px 9px 0;
}

.rpt-fwdtbl tbody td.rpt-fwdtbl-mid { width: 100%; padding: 9px 16px 9px 0; }
.rpt-fwdtbl-cell { display: flex; align-items: center; gap: 12px; }
.rpt-fwdtbl-track {
  position: relative; flex: 1; min-width: 60px; height: 12px;
  background: var(--hover-subtle); border-radius: 3px; overflow: hidden;
}
.rpt-fwdtbl-zero {
  position: absolute; top: 0; bottom: 0; left: 50%; width: 1px;
  background: var(--text-faint); z-index: 2;
}
.rpt-fwdtbl-fill {
  position: absolute; top: 2px; bottom: 2px;
  border-radius: 2px; z-index: 1;
}
.rpt-fwdtbl-fill.pos { background: var(--green); }
.rpt-fwdtbl-fill.neg { background: var(--red); }
.rpt-fwdtbl-val { flex: 0 0 auto; min-width: 62px; text-align: right; font-weight: 800; }
.rpt-fwdtbl-val.pos { color: var(--green); }
.rpt-fwdtbl-val.neg { color: var(--red); }
.rpt-fwdtbl tbody td.rpt-fwdtbl-wr { font-weight: 700; color: var(--text-bright); width: 1%; }

@media (max-width: 520px) {
  .rpt-fwdtbl-track { display: none; }
  .rpt-fwdtbl-cell { justify-content: flex-end; }
}


.rpt-viz-sn-title,
.rpt-viz-cyc-title {
  font-size: .88rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 8px;
}
.rpt-viz-seasonal { container-type: inline-size; }
.rpt-viz-sn {
  position: relative;
}
.rpt-viz-sn-chart {
  position: relative;
  height: 180px;
  margin-top: 18px;
}
.rpt-viz-sn-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.rpt-viz-sn-grid .gl {
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: rgba(255,255,255,.05);
}
.rpt-viz-sn-grid .gl.zero { background: rgba(255,255,255,.22); }
.rpt-viz-sn-cols {
  position: absolute;
  inset: 0;
  display: flex;
  gap: 0;
}
.rpt-viz-sn-col {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
}
.rpt-viz-sn-bar {
  position: absolute;
  left: 0; right: 0;
  border: 0;
  border-radius: 0;
  box-shadow: inset -1px 0 0 rgba(0,0,0,.35);
  transition: height .4s ease;
}
.rpt-viz-sn-bar.pos { background: var(--green); bottom: 50%; }
.rpt-viz-sn-bar.neg { background: var(--red);   top: 50%; }
.rpt-viz-sn-col:last-child .rpt-viz-sn-bar { box-shadow: none; }
.rpt-viz-sn-col.is-current .rpt-viz-sn-bar.pos,
.rpt-viz-sn-col.is-current .rpt-viz-sn-bar.neg {
  background: var(--accent, #a78bfa);
}
.rpt-viz-sn-val {
  position: absolute;
  left: 0; right: 0;
  text-align: center;
  font-size: clamp(.7rem, 1.1cqi, .86rem);
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  pointer-events: none;
}
.rpt-viz-sn-val.pos { color: var(--green); }
.rpt-viz-sn-val.neg { color: var(--red); }
.rpt-viz-sn-col.is-current .rpt-viz-sn-val { color: var(--accent, #a78bfa); }
.rpt-viz-sn-col.is-current::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 7px; height: 7px;
  background: var(--accent, #a78bfa);
  border-radius: 50%;
  box-shadow: 0 0 0 2px var(--card), 0 0 10px var(--accent, #a78bfa);
  z-index: 2;
}
.rpt-viz-sn-xlabels {
  display: flex;
  gap: 0;
  margin-top: 8px;
}
.rpt-viz-sn-xlabels span {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
  font-size: clamp(.72rem, 1.2cqi, .9rem);
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: .02em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rpt-viz-sn-xlabels span.cur {
  color: var(--accent, #a78bfa);
  font-weight: 800;
}


.rpt-viz-cyc { container-type: inline-size; }
.rpt-viz-cy-pattern {
  margin-top: 6px;
}
.rpt-viz-cy-pat-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px 14px;
  margin-bottom: 10px;
}
.rpt-viz-cy-pat-title {
  font-size: clamp(.74rem, 1cqi, .86rem);
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.rpt-viz-cy-pat-sub {
  font-size: clamp(.74rem, 1cqi, .86rem);
  font-weight: 600;
  color: var(--text-dim, var(--text-muted));
}
.rpt-viz-cy-pat-sub b { font-weight: 800; color: var(--text-bright); }
.rpt-viz-cy-pat-sub b.pos { color: var(--green); }
.rpt-viz-cy-pat-sub b.neg { color: var(--red); }
.rpt-viz-cy-pat-sub b.accent { color: var(--accent, #a78bfa); }
.rpt-viz-cy-pat-xlabels {
  display: flex;
  gap: 0;
  margin-top: 6px;
}
.rpt-viz-cy-pat-xlabels span {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
  font-size: clamp(.7rem, 1.1cqi, .86rem);
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: .02em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


.rpt-cyc-p {
  margin: 0 0 10px 0;
  line-height: 1.55;
}
.rpt-cyc-p:last-child { margin-bottom: 0; }
.rpt-cyc-p strong.pos { color: var(--green); }
.rpt-cyc-p strong.neg { color: var(--red); }



.rpt-viz-regime-title strong { color: var(--text-bright); }
.rpt-viz-regime-bar {
  position: relative; height: 24px; border-radius: 4px;
  overflow: hidden; margin: 8px 0;
}
.rpt-viz-regime-zone { position: absolute; top: 0; height: 100%; }
.rpt-viz-regime-needle {
  position: absolute; top: -4px; width: 4px; height: 32px;
  background: #7c3aed;
  border-radius: 2px; z-index: 5;
  transition: left .5s ease;
  box-shadow:
    0 0 0 1.5px rgba(255,255,255,.85),
    0 0 0 2.5px rgba(0,0,0,.45),
    0 0 8px rgba(124,58,237,.7);
}
.rpt-viz-regime-labels {
  display: flex; justify-content: space-between;
  font-size: .82rem; color: var(--text-muted); font-weight: 600;
}



.rpt-viz-pct-multi { padding: 12px; }
.rpt-viz-pct-title {
  display: flex; align-items: baseline; gap: 0; flex-wrap: wrap;
  font-size: .82rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 8px;
}
.rpt-viz-pct-row {
  display: flex; align-items: center; gap: 8px; padding: 6px 0;
}
.rpt-viz-pct-row + .rpt-viz-pct-row { border-top: 1px solid var(--divider-soft); }
.rpt-viz-pct-lbl {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  color: var(--text-dim); width: 86px; flex-shrink: 0;
}
.rpt-viz-pct-track {
  flex: 1; height: 7px; border-radius: 4px; position: relative;
  background: linear-gradient(90deg,
    #3b82f6 0%, #60a5fa 15%, #a3a3a3 40%, #a3a3a3 60%, #f59e0b 85%, #ef4444 100%);
  overflow: visible;
}

.rpt-viz-pct-zone { display: none; }
.rpt-viz-pct-marker {
  position: absolute; top: -4px; width: 3px; height: 15px;
  border-radius: 1px; transform: translateX(-50%);
  background: #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,.45), 0 0 6px rgba(255,255,255,.5);
  transition: left .5s ease;
}
.rpt-viz-pct-val {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 700;
  width: 32px; text-align: right; flex-shrink: 0;
}
.rpt-viz-pct-zone-lbl {
  font-family: var(--font-ui); font-size: .82rem; font-weight: 600;
  width: 110px; text-align: right; flex-shrink: 0; text-transform: uppercase;
  letter-spacing: .03em;
}
.rpt-viz-pct-val.blue,  .rpt-viz-pct-zone-lbl.blue  { color: var(--blue); }
.rpt-viz-pct-val.green, .rpt-viz-pct-zone-lbl.green { color: var(--green); }
.rpt-viz-pct-val.amber, .rpt-viz-pct-zone-lbl.amber { color: var(--amber); }
.rpt-viz-pct-val.red,   .rpt-viz-pct-zone-lbl.red   { color: var(--red); }


.rpt-viz-rng { padding: 12px; }
.rpt-viz-rng-title {
  font-size: .82rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 4px;
}
.rpt-viz-rng-title strong { color: var(--text-bright); }
.rpt-viz-rng-legend {
  display: flex; gap: 14px; align-items: center;
  font-size: .72rem; color: var(--text-muted);
  margin-bottom: 6px; padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.rpt-viz-rng-legend-item { display: inline-flex; align-items: center; gap: 6px; }
.rpt-viz-rng-legend-sw {
  width: 14px; height: 10px; border-radius: 2px; display: inline-block;
}

.rpt-viz-rng-legend-sw.typ { background: var(--purple); opacity: .75; border: 1px solid var(--purple); }
.rpt-viz-rng-legend-sw.ext { background: rgba(240,80,110,.22); border: 1px solid rgba(240,80,110,.4); }
.rpt-viz-rng-row {
  display: grid;
  grid-template-columns: 62px 1fr 1fr;
  align-items: baseline;
  gap: 12px;
  padding: 5px 4px;
}
.rpt-viz-rng-row + .rpt-viz-rng-row { border-top: 1px solid var(--border); }
.rpt-viz-rng-tf {
  font-size: 1rem; font-weight: 600; color: var(--text-bright);
}
.rpt-viz-rng-bar-wrap { position: relative; }
.rpt-viz-rng-bar {
  position: relative;
  height: 26px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.02);
  overflow: visible;
}
.rpt-viz-rng-ext {
  position: absolute; top: 0; bottom: 0;
  background: rgba(240,80,110,.07);
  border-left: 1px dashed rgba(240,80,110,.35);
  border-right: 1px dashed rgba(240,80,110,.35);
}
.rpt-viz-rng-typ {
  position: absolute; top: 0; bottom: 0;
  background: rgba(38,217,127,.14);
  border-left: 2px solid rgba(38,217,127,.5);
  border-right: 2px solid rgba(38,217,127,.5);
}
.rpt-viz-rng-needle {
  position: absolute; top: -4px; bottom: -4px;
  width: 2px; background: var(--text-bright);
  box-shadow: 0 0 8px rgba(255,255,255,.5);
}
.rpt-viz-rng-needle::before {
  content: ''; position: absolute;
  top: -5px; left: -4px;
  width: 10px; height: 10px;
  background: var(--text-bright); border-radius: 50%;
  box-shadow: 0 0 8px rgba(255,255,255,.6);
}
.rpt-viz-rng-tick,
.rpt-viz-rng-tick-top {
  position: absolute;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  line-height: 1.1;
}
.rpt-viz-rng-tick { top: 100%; margin-top: 8px; }
.rpt-viz-rng-tick-top { bottom: 100%; margin-bottom: 8px; }
.rpt-viz-rng-tick .price,
.rpt-viz-rng-tick-top .price { font-size: .845rem; font-weight: 500; }
.rpt-viz-rng-tick .pct,
.rpt-viz-rng-tick-top .pct { font-size: .745rem; font-weight: 500; opacity: .75; }
.rpt-viz-rng-tick.typ .price,
.rpt-viz-rng-tick.typ .pct { color: var(--green); }
.rpt-viz-rng-tick-top .price,
.rpt-viz-rng-tick-top .pct { color: var(--red); }


@media (max-width: 520px) {
  .rpt-viz-rng-row {
    grid-template-columns: 52px 1fr;
    gap: 4px 10px;
    padding: 5px 2px;
  }
  
  .rpt-viz-rng-num.ext { grid-column: 2; }
  .rpt-viz-rng-tf { font-size: .84rem; }
  .rpt-viz-rng-tick .price,
  .rpt-viz-rng-tick-top .price { font-size: .785rem; }
  .rpt-viz-rng-tick .pct,
  .rpt-viz-rng-tick-top .pct { font-size: .685rem; }
}
@media (max-width: 380px) {
  .rpt-viz-rng-tick .price,
  .rpt-viz-rng-tick-top .price { font-size: .725rem; }
  .rpt-viz-rng-tick .pct,
  .rpt-viz-rng-tick-top .pct { font-size: .645rem; }
}


.rpt-viz-dd-labels {
  display: flex; justify-content: space-between;
  font-size: .88rem; color: var(--text-muted);
  margin-top: 2px;
}
.rpt-viz-dd-labels strong { color: var(--text-bright); font-weight: 700; }


.rpt-viz-yrdd { padding: 12px 12px 6px; }
.rpt-viz-yrdd-title {
  font-size: .82rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; color: var(--text-muted); margin-bottom: 10px;
}
.rpt-viz-yrdd-chart {
  position: relative;
  height: 200px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.rpt-viz-yr-cols {
  position: absolute;
  inset: 0 0 18px 0;
  display: flex;
  gap: 1px;
  align-items: flex-start;
}
.rpt-viz-yr-col {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
  height: 100%;
}
.rpt-viz-yr-bar {
  position: absolute;
  top: 0; left: 0; right: 0;
  border-radius: 0 0 2px 2px;
  transition: height .35s ease;
}

.rpt-viz-yr-bar-low      { background: rgba(234,61,61,.32); }
.rpt-viz-yr-bar-mod      { background: rgba(234,61,61,.52); }
.rpt-viz-yr-bar-high     { background: rgba(234,61,61,.75); }
.rpt-viz-yr-bar-extreme  { background: rgba(234,61,61,.95); }
.rpt-viz-yr-lbl {
  
  position: absolute;
  bottom: -16px; left: 50%;
  transform: translateX(-50%);
  text-align: center;
  font-size: .68rem;
  font-weight: 600;
  color: var(--text-muted);
  white-space: nowrap;
}
.rpt-viz-yr-avgline {
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: rgba(255,184,51,.55);
  border-top: 1px dashed rgba(255,184,51,.55);
  z-index: 2;
  pointer-events: none;
}
.rpt-viz-yr-avglbl {
  position: absolute;
  right: 4px;
  font-size: .72rem;
  font-weight: 700;
  color: var(--amber, #ffb833);
  background: rgba(16,18,25,.85);
  padding: 0 4px;
  border-radius: 3px;
  z-index: 3;
  pointer-events: none;
}


.rpt-viz-pcdd { padding: 14px 14px 8px; }
.rpt-pcdd-row { display: flex; align-items: center; gap: 10px; margin: 7px 0; }
.rpt-pcdd-lbl {
  flex: 0 0 104px; font-size: .8rem; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rpt-pcdd-track {
  flex: 1 1 auto; height: 16px; background: rgba(255,255,255,.05);
  border-radius: 4px; overflow: hidden;
}
.rpt-pcdd-bar { height: 100%; border-radius: 4px; min-width: 2px; transition: width .35s ease; }
.rpt-pcdd-val {
  flex: 0 0 auto; font-size: .82rem; font-weight: 700;
  color: var(--text-bright); font-variant-numeric: tabular-nums; white-space: nowrap;
}
.rpt-pcdd-n { font-size: .72rem; font-weight: 500; color: var(--text-muted); }

@keyframes rptFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.rpt-section { animation: rptFadeIn .3s ease both; }
.rpt-section:nth-child(2) { animation-delay: .05s; }
.rpt-section:nth-child(3) { animation-delay: .1s; }
.rpt-section:nth-child(4) { animation-delay: .15s; }
.rpt-section:nth-child(5) { animation-delay: .2s; }
.rpt-section:nth-child(6) { animation-delay: .25s; }
.rpt-section:nth-child(7) { animation-delay: .3s; }


.rpt-wrap .ddm-ins-num,
.rpt-wrap .ddm-ins-title { font-size: 1.275rem; }
.rpt-wrap .ddm-ins-prose { font-size: .94rem; }




.rpt-text strong.pos, .rpt-wrap .rpt-now-card .pos, .rpt-nm-h .pos, .rpt-pavg.pos { color: var(--green); }
.rpt-text strong.neg, .rpt-wrap .rpt-now-card .neg, .rpt-nm-h .neg, .rpt-pavg.neg { color: var(--red); }


.rpt-subhead.rpt-subhead-flex { display: flex; align-items: center; gap: 8px; }
.rpt-subhead-note {
  margin-left: auto; font-size: .72rem; font-weight: 600;
  letter-spacing: .02em; text-transform: none; color: var(--text-muted);
}


.rpt-now-card {
  margin: 6px 0 12px; padding: 14px 16px; border-radius: var(--radius-md);
  background: linear-gradient(180deg, var(--red-subtle), transparent);
  border: 1px solid var(--red-med);
  container-type: inline-size;
}
.rpt-now-card.bull {
  background: linear-gradient(180deg, var(--green-subtle), transparent);
  border-color: var(--green-med);
}
.rpt-now-top { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; flex-wrap: wrap; }
.rpt-now-flag {
  font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 99px;
}
.rpt-now-flag.bear { background: var(--red-med); color: var(--red); }
.rpt-now-flag.bull { background: var(--green-med); color: var(--green); }
.rpt-now-range { font-size: 1.05rem; font-weight: 700; color: var(--text-bright); }
.rpt-now-sub { font-size: .9rem; color: var(--text-dim); margin-bottom: 12px; }
.rpt-now-sub strong { color: var(--text-bright); font-weight: 700; }
.rpt-now-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.rpt-now-m { text-align: left; min-width: 0; }
.rpt-now-mv { font-size: 1.12rem; font-weight: 700; color: var(--text-bright); line-height: 1.1; }
.rpt-now-mv.pos { color: var(--green); }
.rpt-now-mv.neg { color: var(--red); }
.rpt-now-ml { font-size: .78rem; color: var(--text-muted); margin-top: 2px; line-height: 1.2; }


.rpt-nextmove { margin: 6px 0 4px; display: flex; flex-direction: column; gap: 0; }
.rpt-nm-step { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; }
.rpt-nm-rail { display: flex; flex-direction: column; align-items: center; height: 100%; }
.rpt-nm-dot {
  width: 14px; height: 14px; border-radius: 50%; flex: none; margin-top: 3px;
  border: 2px solid var(--card, #0a0b0f);
}
.rpt-nm-dot.now { background: var(--red); }
.rpt-nm-dot.bull { background: var(--green); }
.rpt-nm-dot.gap { background: var(--text-muted); }
.rpt-nm-dot.next { background: var(--green); }
.rpt-nm-line { flex: 1; width: 2px; background: var(--border-hi); min-height: 26px; }
.rpt-nm-line.dash { background: repeating-linear-gradient(180deg, var(--border-hi) 0 4px, transparent 4px 8px); }
.rpt-nm-body { padding-bottom: 14px; }
.rpt-nm-when {
  font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--text-muted);
}
.rpt-nm-h { font-size: .96rem; font-weight: 700; color: var(--text-bright); margin: 1px 0; }
.rpt-nm-d { font-size: .82rem; color: var(--text-dim); }
.rpt-nm-d b { color: var(--text-soft); }


.rpt-sncurve {
  margin: 4px 0 12px; padding: 12px 14px 8px;
  background: var(--surface-veil); border: 1px solid var(--border); border-radius: var(--radius-sm);
}
.rpt-sncurve-title { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.rpt-sncurve-ytd { font-size: .82rem; font-weight: 600; color: var(--text-muted); letter-spacing: 0; text-transform: none; }
.rpt-sncurve-ytd b { color: var(--green); }
.rpt-sncurve svg { display: block; width: 100%; height: auto; }
.rpt-sncurve-leg { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 6px; font-size: .8rem; color: var(--text-muted); }
.rpt-sncurve-leg i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.rpt-sncurve-leg i.g { background: rgba(38,217,127,.55); }
.rpt-sncurve-leg i.r { background: rgba(240,80,110,.55); }
.rpt-sncurve-leg i.t { width: 2px; height: 11px; border-radius: 0; background: #a78bfa; }




.rpt-cal {
  position: relative; height: 56px; margin: 2px 0 12px; border-radius: var(--radius-sm);
  background: var(--card); border: 1px solid var(--border-hi); overflow: hidden;
}
.rpt-cal-seg {
  position: absolute; top: 7px; bottom: 26px; border-radius: 3px;
  display: flex; align-items: center; justify-content: center;
  cursor: default;
}

.rpt-cal-wr {
  font-size: .78rem; font-weight: 400; line-height: 1;
  color: #fff; letter-spacing: -.02em; pointer-events: none; white-space: nowrap;
}
.rpt-cal-seg:hover { filter: brightness(1.15); }

.rpt-cal-seg.b { background: var(--green); opacity: .92; }
.rpt-cal-seg.r { background: var(--red); opacity: .92; }
.rpt-cal-seg.now { outline: 1.5px solid #a78bfa; outline-offset: 1px; opacity: 1; }
.rpt-cal-today { position: absolute; top: 0; bottom: 22px; width: 0; border-left: 1.5px dashed #a78bfa; }
.rpt-cal-months { position: absolute; left: 0; right: 0; bottom: 4px; display: flex; }

.rpt-cal-months span { flex: 1; text-align: center; font-size: .82rem; line-height: 1.1; letter-spacing: -.01em; color: var(--text-muted); }


.rpt-caltip {
  position: fixed; z-index: 9999; left: 0; top: 0;
  min-width: 200px; max-width: 320px;
  padding: 11px 13px 12px;
  font-family: var(--font-ui);
  background: var(--card);
  border: 1px solid var(--border-hi, var(--border));
  border-radius: var(--radius-md);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .45), 0 2px 6px rgba(0, 0, 0, .3);
  opacity: 0; visibility: hidden;
  transform: translateY(3px);
  transition: opacity .12s ease, transform .12s ease, visibility .12s;
  pointer-events: none;   
}
.rpt-caltip.on { opacity: 1; visibility: visible; transform: translateY(0); }
:root[data-theme="light"] .rpt-caltip { box-shadow: 0 10px 24px rgba(16, 24, 48, .16), 0 2px 6px rgba(16, 24, 48, .1); }

.rpt-caltip-h {
  display: flex; align-items: baseline; gap: 7px;
  font-size: 1rem; font-weight: 700; color: var(--text-bright);
}
.rpt-caltip-now {
  margin-left: auto; padding: 2px 7px; border-radius: 999px;
  font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: #a78bfa; border: 1px solid rgba(167, 139, 250, .45);
}
.rpt-caltip-sub { margin-top: 3px; font-size: .85rem; color: var(--text-muted); }
.rpt-caltip-m {
  display: flex; gap: 16px; margin-top: 9px;
  font-size: .95rem; font-weight: 700; color: var(--text-bright);
}
.rpt-caltip-m span { display: flex; flex-direction: column; gap: 2px; }
.rpt-caltip-m i {
  font-style: normal; font-size: .72rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted);
}
.rpt-caltip-note {
  margin-top: 9px; padding-top: 8px;
  border-top: 1px solid var(--border);
  font-size: .87rem; line-height: 1.45; color: var(--text-dim, var(--text-muted));
}
.rpt-caltip-note.up { color: var(--green); }
.rpt-caltip-note.dn { color: var(--red); }


.rpt-sntbl-scroll {
  position: relative; max-height: 264px; overflow-y: auto; overscroll-behavior: contain;
  border: 1px solid var(--surface-border); border-radius: var(--radius-md);
  padding: 0; margin: 4px 0 2px;
}
.rpt-sntbl { width: 100%; border-collapse: collapse; font-size: .88rem; }

.rpt-sntbl thead th {
  font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: var(--text-muted); text-align: right; padding: 9px 0 7px; border-bottom: 1px solid var(--border);
  position: sticky; top: 0; background: var(--panel); z-index: 1;
}
.rpt-sntbl thead th.l { text-align: left; padding-left: 12px; }
.rpt-sntbl thead th:last-child, .rpt-sntbl tbody td:last-child { padding-right: 12px; }
.rpt-sntbl tbody td { padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.04); text-align: right; white-space: nowrap; }
.rpt-sntbl tbody tr:last-child td { border-bottom: none; }

.rpt-sntbl tbody tr.now td {
  background: rgba(167,139,250,.12);
  box-shadow: inset 0 1px 0 rgba(167,139,250,.45), inset 0 -1px 0 rgba(167,139,250,.45);
}
.rpt-sntbl tbody td.rpt-sntbl-per { text-align: left; font-weight: 700; color: var(--text-bright); position: relative; padding-left: 12px; }
.rpt-sntbl tbody tr.now .rpt-sntbl-per::before {
  content: ''; position: absolute; left: 0; top: -1px; bottom: -1px;
  width: 3px; border-radius: 0 2px 2px 0; background: #a78bfa;
}
.rpt-sntbl-now {
  display: inline-block; margin-left: 8px; vertical-align: 1px;
  font-size: .64rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  padding: 2px 6px; border-radius: 99px; background: rgba(167,139,250,.2); color: #a78bfa;
}
.rpt-sntbl-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 7px; vertical-align: 1px; }
.rpt-sntbl-dot.b { background: var(--green); }
.rpt-sntbl-dot.r { background: var(--red); }
.rpt-sntbl-sub { font-size: .76rem; color: var(--text-muted); font-weight: 400; }
.rpt-sntbl-avg { font-weight: 800; }
.rpt-sntbl-avg.pos { color: var(--green); }
.rpt-sntbl-avg.neg { color: var(--red); }
.rpt-sntbl-wr { color: var(--text-bright); font-weight: 700; }
.rpt-sntbl-10 { font-weight: 700; }
.rpt-sntbl-10.up { color: var(--green); }
.rpt-sntbl-10.dn { color: var(--red); }
.rpt-sntbl-10.fl { color: var(--text-dim); }
.rpt-sntbl tbody td.rpt-sntbl-rel { width: 30px; text-align: center; padding-left: 6px; }
.rpt-rel { width: 15px; height: 15px; display: inline-block; vertical-align: -2px; }
.rpt-rel svg { width: 100%; height: 100%; display: block; }
.rpt-rel.star { color: var(--green); }
.rpt-rel.warn { color: var(--amber); }
.rpt-sntbl-legend {
  display: flex; gap: 14px; flex-wrap: wrap; align-items: center;
  margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--border);
  font-size: .78rem; color: var(--text-muted);
}
.rpt-sntbl-legend .rpt-rel { width: 13px; height: 13px; vertical-align: -2px; margin-right: 2px; }


@container (max-width: 360px) {
  .rpt-now-metrics { grid-template-columns: repeat(2, 1fr); }
}


.rpt-opt-donuts { display: flex; gap: 12px; flex-wrap: wrap; margin: 10px 0 14px; }
.rpt-opt-donut {
  flex: 1 1 200px; display: flex; align-items: center; gap: 13px;
  padding: 12px 14px;
  background: var(--surface-veil); border: 1px solid var(--border);
  border-radius: var(--radius-md);
}
.rpt-opt-donut-pie {
  width: 70px; height: 70px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
}
.rpt-opt-donut-hole {
  width: 50px; height: 50px; border-radius: 50%;
  background: var(--panel);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .95rem; font-variant-numeric: tabular-nums;
}
.rpt-opt-donut-hole .pos { color: var(--green); }
.rpt-opt-donut-hole .neg { color: var(--red); }
.rpt-opt-donut-hole .neu { color: var(--amber, #c08a2e); }
.rpt-opt-donut-label {
  font-size: .74rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .05em; color: var(--text-muted); margin-bottom: 5px; white-space: nowrap;
}
.rpt-opt-donut-leg { display: flex; flex-direction: column; gap: 2px; font-size: .82rem; white-space: nowrap; }
.rpt-opt-donut-leg .c { color: var(--green); }
.rpt-opt-donut-leg .p { color: var(--red); }


.rpt-opttbl-wrap {
  border: 1px solid var(--surface-border, var(--border));
  border-radius: var(--radius-md);
  overflow: hidden;
  margin: 8px 0 10px;
}
.rpt-opttbl { width: 100%; border-collapse: collapse; font-size: .88rem; margin: 0; }
.rpt-opttbl thead th {
  font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: var(--text-muted); text-align: right; padding: 9px 8px 7px;
  background: var(--panel);
  border-bottom: 1px solid var(--border);
}
.rpt-opttbl thead th.l, .rpt-opttbl tbody td.l { text-align: left; padding-left: 12px; }
.rpt-opttbl thead th:last-child, .rpt-opttbl tbody td:last-child { padding-right: 12px; }
.rpt-opttbl tbody td {
  padding: 9px 8px; text-align: right; white-space: nowrap;
  border-bottom: 1px solid rgba(255,255,255,.05); color: var(--text);
}
.rpt-opttbl tbody tr:last-child td { border-bottom: none; }
.rpt-opt-lvls tbody td.l { font-weight: 600; color: var(--text-bright); }
.rpt-opt-lvl-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; }
.rpt-opt-lvl-px { font-weight: 700; color: var(--text-bright); font-variant-numeric: tabular-nums; }
.rpt-opt-lvl-sub { font-size: .72rem; color: var(--text-muted); font-weight: 400; }
.rpt-opt-lvl-dist.pos { color: var(--green); }
.rpt-opt-lvl-dist.neg { color: var(--red); }
.rpt-opt-lvls tbody tr.spot td { background: rgba(77, 166, 255, .1); }
.rpt-opt-exp-share { min-width: 92px; }
.rpt-opt-exp-bar {
  display: inline-block; height: 7px; max-width: 54px;
  background: rgba(77, 166, 255, .55); border-radius: 2px;
  margin-right: 7px; vertical-align: middle;
}
.rpt-opt-exp-pct { font-weight: 700; color: var(--text-bright); }

.rpt-opt-dom { font-size: .8rem; font-weight: 700; letter-spacing: .02em; }
.rpt-opt-dom.pos { color: var(--green); }
.rpt-opt-dom.neg { color: var(--red); }
.rpt-opt-dom.neu { color: var(--text-muted); font-weight: 500; }


.rpt-viz-colhead {
  margin-left: auto;
  font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  color: var(--text-muted);
}







#scannerOverlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 800;
    display: none;
    font-family: 'Inter', sans-serif;
    background: #1a1a1a;
    color: #ffffff;
    overflow: hidden;

    
    --bg-primary: #1a1a1a;
    --bg-secondary: #252525;
    --bg-tertiary: #2a2a2a;
    --bg-surface: #333;
    --bg-card: #3a3a3a;
    --border-light: #444;
    --text-primary: #ffffff;
    --text-secondary: #ffffff;
    --text-muted: #ccc;
    --gold: #C3A05F;
    --gold-light: #d4b170;
    --success: #22c55e;
    --success-dim: rgba(34,197,94,0.12);
    --danger: #ef4444;
    --danger-dim: rgba(239,68,68,0.12);
    --warning: #fbbf24;
    --border-subtle: var(--surface-raised);
    --text-dim: #555;
}
#scannerOverlay.open {
    display: block;
}


#scannerOverlay * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


#scannerOverlay .sc-close-btn {
    position: fixed;
    top: 20px;
    right: 24px;
    z-index: 1001;
    width: 32px;
    height: 32px;
    background: var(--surface-border);
    border: 1px solid var(--surface-border-hi);
    border-radius: 6px;
    color: #ccc;
    font-size: 1.2rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .15s ease;
}
#scannerOverlay .sc-close-btn:hover {
    background: var(--surface-border-hi);
    color: #fff;
}


#scannerOverlay .sc-popout-btn {
    position: fixed;
    top: 20px;
    right: 64px;
    z-index: 1001;
    width: 32px;
    height: 32px;
    background: var(--surface-border);
    border: 1px solid var(--surface-border-hi);
    border-radius: 6px;
    color: #ccc;
    font-size: 1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .15s ease;
}
#scannerOverlay .sc-popout-btn:hover {
    background: var(--surface-border-hi);
    color: #fff;
}


body.scanner-popout > *:not(#scannerOverlay):not(script):not(style):not(link):not(noscript) {
    display: none !important;
}
body.scanner-popout {
    margin: 0;
    padding: 0;
    overflow: hidden;
}
body.scanner-popout #scannerOverlay {
    position: fixed;
    inset: 0;
    display: block;
}
body.scanner-popout #scannerOverlay .sc-popout-btn {
    display: none;
}


#scannerOverlay .header {
    background: var(--bg-primary);
    border-bottom: 1px solid var(--border-light);
    padding: 16px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 77px;
    z-index: 1000;
}

#scannerOverlay .header-left {
    display: flex;
    align-items: center;
    gap: 16px;
}

#scannerOverlay .hamburger-btn {
    display: none;
    background: none;
    border: none;
    color: var(--text-primary);
    font-size: 24px;
    cursor: pointer;
    padding: 8px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

#scannerOverlay .hamburger-btn:hover {
    background: var(--bg-surface);
}

#scannerOverlay .mobile-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 850;
}

#scannerOverlay .header-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

#scannerOverlay .brand-info h1 {
    font-size: 20px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

#scannerOverlay .brand-info p {
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#scannerOverlay .dates-market-info {
    display: none;
    align-items: center;
    gap: 12px;
    align-self: center;
}

#scannerOverlay .dates-market-flag {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    border: 2px solid var(--border-light);
    background: var(--bg-card);
    flex-shrink: 0;
}

#scannerOverlay .dates-market-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-primary);
    white-space: nowrap;
}

#scannerOverlay .header-center {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

#scannerOverlay .header-info-text {
    font-size: 16px;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.2;
    margin: 0;
}

#scannerOverlay .header-results-count {
    font-size: 12px;
    color: var(--text-muted);
    font-weight: 400;
    margin-top: 2px;
}

#scannerOverlay .header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}


#scannerOverlay .main-layout {
    display: flex;
    height: 100vh;
    padding-top: 77px;
}

#scannerOverlay .drawer {
    width: 320px;
    background: var(--bg-secondary);
    border-right: 1px solid var(--border-light);
    position: fixed;
    top: 77px;
    left: 0;
    height: calc(100vh - 77px);
    z-index: 900;
    overflow-y: auto;
}

#scannerOverlay .drawer::-webkit-scrollbar {
    width: 6px;
}

#scannerOverlay .drawer::-webkit-scrollbar-track {
    background: #1e1e1e;
}

#scannerOverlay .drawer::-webkit-scrollbar-thumb {
    background: var(--gold);
    border-radius: 3px;
}

#scannerOverlay .content-area {
    flex: 1;
    margin-left: 310px;
    height: calc(100vh - 77px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#scannerOverlay .drawer-content {
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

#scannerOverlay .drawer-section {
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    border-radius: 16px;
    overflow: hidden;
}

#scannerOverlay .section-content {
    padding: 14px;
}


#scannerOverlay .shortcuts-grid {
    display: grid;
    gap: 12px;
}

#scannerOverlay .shortcut-card {
    background: var(--bg-tertiary);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
}

#scannerOverlay .shortcut-card:hover {
    border-color: var(--gold);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

#scannerOverlay .shortcut-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

#scannerOverlay .shortcut-flag {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    border: 2px solid var(--border-light);
    background: var(--bg-card);
}

#scannerOverlay .flag-us {
    background: linear-gradient(to bottom, #ff0000 0%, #ff0000 7.7%, #ffffff 7.7%, #ffffff 15.4%, #ff0000 15.4%, #ff0000 23.1%, #ffffff 23.1%, #ffffff 30.8%, #ff0000 30.8%, #ff0000 38.5%, #ffffff 38.5%, #ffffff 46.2%, #ff0000 46.2%, #ff0000 53.9%, #ffffff 53.9%, #ffffff 61.6%, #ff0000 61.6%, #ff0000 69.3%, #ffffff 69.3%, #ffffff 77%, #ff0000 77%, #ff0000 84.7%, #ffffff 84.7%, #ffffff 92.4%, #ff0000 92.4%, #ff0000 100%);
    position: relative;
}

#scannerOverlay .flag-us::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 40%;
    height: 46.2%;
    background: #002868;
}

#scannerOverlay .flag-it {
    background: linear-gradient(to right, #009246 0%, #009246 33.33%, #ffffff 33.33%, #ffffff 66.66%, #ce2b37 66.66%, #ce2b37 100%);
}

#scannerOverlay .flag-globe {
    background: radial-gradient(circle at 30% 30%, #4A90E2, #1E3A5F);
    position: relative;
    overflow: hidden;
}

#scannerOverlay .flag-globe::before {
    content: '';
    position: absolute;
    top: 3px;
    left: 8px;
    width: 12px;
    height: 8px;
    background: #228B22;
    border-radius: 50% 30% 40% 20%;
    transform: rotate(-15deg);
}

#scannerOverlay .flag-globe::after {
    content: '';
    position: absolute;
    top: 12px;
    right: 6px;
    width: 8px;
    height: 10px;
    background: #228B22;
    border-radius: 60% 40% 30% 70%;
    transform: rotate(25deg);
    box-shadow:
        -10px -5px 0 -2px #228B22,
        -18px 2px 0 -3px #228B22;
}

#scannerOverlay .flag-forex {
    background: linear-gradient(135deg, #00D4AA 0%, #00A085 100%);
    position: relative;
    color: white;
    font-size: 14px;
    font-weight: 600;
}

#scannerOverlay .flag-forex::before {
    content: '$\20AC';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 12px;
    font-weight: 900;
}

#scannerOverlay .flag-crypto {
    background: linear-gradient(135deg, #F7931A 0%, #D4741A 100%);
    position: relative;
    color: white;
}

#scannerOverlay .flag-crypto::before {
    content: '\20BF';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    font-weight: 600;
}

#scannerOverlay .shortcut-info h4 {
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 2px;
}

#scannerOverlay .shortcut-info p {
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#scannerOverlay .shortcut-actions {
    display: flex;
    gap: 8px;
}

#scannerOverlay .shortcut-actions-three {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 6px;
}

#scannerOverlay .shortcut-btn {
    flex: 1;
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    color: var(--text-secondary);
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
    text-align: center;
}

#scannerOverlay .shortcut-btn:hover {
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    border-color: var(--gold);
    color: var(--bg-primary);
}


#scannerOverlay .form-group {
    margin-bottom: 16px;
}

#scannerOverlay .form-label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#scannerOverlay .form-input,
#scannerOverlay .form-select {
    width: 100%;
    background: var(--bg-surface);
    border: 1px solid #4a4a4a;
    border-radius: 8px;
    padding: 8px 12px;
    color: var(--text-primary);
    font-size: 13px;
    font-family: inherit;
    transition: all 0.3s ease;
    height: 36px;
}

#scannerOverlay .form-input:focus,
#scannerOverlay .form-select:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 2px rgba(195, 160, 95, 0.1);
    background-color: var(--bg-card);
}


#scannerOverlay .exchange-selector {
    border: 1px solid #4a4a4a;
    border-radius: 8px;
    max-height: 180px;
    overflow-y: auto;
    background: var(--bg-surface);
}

#scannerOverlay .continent-header {
    background: var(--bg-card);
    padding: 10px 12px;
    border-bottom: 1px solid #4a4a4a;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    font-size: 12px;
}

#scannerOverlay .continent-header:hover {
    background: var(--bg-surface);
}

#scannerOverlay .exchanges-list {
    display: none;
    background: var(--bg-secondary);
}

#scannerOverlay .exchanges-list.expanded {
    display: block;
}

#scannerOverlay .exchange-item {
    padding: 8px 12px 8px 28px;
    border-bottom: 1px solid #4a4a4a;
    display: flex;
    align-items: center;
    font-size: 12px;
}

#scannerOverlay .exchange-item:hover {
    background: var(--bg-card);
}

#scannerOverlay .selected-summary {
    margin-top: 8px;
    padding: 8px;
    background: rgba(34, 197, 94, 0.1);
    border: 1px solid rgba(34, 197, 94, 0.2);
    border-radius: 6px;
    font-size: 11px;
    color: var(--success);
}


#scannerOverlay .controls-section {
    flex-shrink: 0;
    padding: 16px 24px;
    background: var(--bg-primary);
}

#scannerOverlay .controls-layout {
    display: flex;
    gap: 16px;
}

#scannerOverlay .dates-container {
    flex: 1;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 16px;
    padding: 12px 16px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

#scannerOverlay .dates-content {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
}

#scannerOverlay .dates-row {
    display: flex;
    align-items: end;
    gap: 10px;
}

#scannerOverlay .analyze-btn-dates {
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    border: none;
    color: var(--bg-primary);
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    height: 36px;
    margin-bottom: 8px;
}

#scannerOverlay .analyze-btn-dates:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

#scannerOverlay .date-separator {
    display: flex;
    align-items: end;
    padding-bottom: 8px;
    font-size: 12px;
    color: var(--text-muted);
    font-weight: 600;
    margin: 0 12px;
}

#scannerOverlay .date-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 70px;
    flex-shrink: 0;
}

#scannerOverlay .date-group .form-label {
    margin-bottom: 0px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#scannerOverlay .date-group select {
    width: 80px;
}

#scannerOverlay .date-group input {
    width: 70px;
}


#scannerOverlay .results-section {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 0 24px 24px 24px;
}

#scannerOverlay .status-messages {
    text-align: center;
    flex-shrink: 0;
    margin-bottom: 16px;
}

#scannerOverlay #loadingText {
    display: none;
    color: var(--gold);
    font-weight: 600;
    padding: 32px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 16px;
    text-align: center;
    position: relative;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

#scannerOverlay .loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

#scannerOverlay .spinner {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(195, 160, 95, 0.3);
    border-top: 3px solid var(--gold);
    border-radius: 50%;
    animation: sc-spin 1s linear infinite;
}

#scannerOverlay .loading-text {
    font-size: 16px;
    font-weight: 600;
    color: var(--gold);
    letter-spacing: 0.5px;
}

#scannerOverlay .loading-dots {
    font-size: 16px;
    color: var(--gold);
    animation: sc-dots 1.5s infinite;
}


@keyframes sc-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes sc-dots {
    0%, 20% {
        color: var(--gold);
        text-shadow: 0.25em 0 0 transparent, 0.5em 0 0 transparent;
    }
    40% {
        color: var(--gold);
        text-shadow: 0.25em 0 0 var(--gold), 0.5em 0 0 transparent;
    }
    60% {
        text-shadow: 0.25em 0 0 var(--gold), 0.5em 0 0 var(--gold);
    }
    80%, 100% {
        text-shadow: 0.25em 0 0 transparent, 0.5em 0 0 transparent;
    }
}

#scannerOverlay #errorMessage {
    display: none;
    color: var(--danger);
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid var(--danger);
    padding: 20px;
    border-radius: 16px;
}

#scannerOverlay #futureWarning {
    display: none;
    background: rgba(251, 191, 36, 0.08);
    border: 1px solid rgba(251, 191, 36, 0.35);
    border-radius: 10px;
    padding: 10px 20px;
    font-size: 13px;
    color: var(--warning);
    font-weight: 500;
    line-height: 1.5;
    flex-shrink: 0;
}

#scannerOverlay #futureWarning strong {
    font-weight: 700;
}

#scannerOverlay .results-info {
    background: transparent;
    border: none;
    color: var(--text-muted);
    padding: 16px 20px;
    border-radius: 16px;
    display: none;
    font-weight: 400;
    font-size: 13px;
    flex-shrink: 0;
    text-align: center;
}


#scannerOverlay .results-container {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 20px;
    overflow: hidden;
    display: none;
    flex: 1;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

#scannerOverlay .table-search-container {
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-light);
    padding: 12px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

#scannerOverlay .table-left-controls {
    display: flex;
    align-items: center;
    gap: 16px;
}

#scannerOverlay .table-divider {
    width: 1px;
    height: 24px;
    background: var(--border-light);
    flex-shrink: 0;
}

#scannerOverlay .mini-search {
    width: 160px;
    background: var(--bg-surface);
    border: 1px solid #4a4a4a;
    border-radius: 6px;
    padding: 6px 12px;
    color: var(--text-primary);
    font-size: 12px;
    font-family: inherit;
    transition: all 0.3s ease;
    height: 32px;
}

#scannerOverlay .mini-search:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 2px rgba(195, 160, 95, 0.1);
}

#scannerOverlay .mini-search::placeholder {
    color: var(--text-muted);
}

#scannerOverlay .table-years-group {
    display: flex;
    align-items: center;
    gap: 6px;
}

#scannerOverlay .table-years-label {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-muted);
    white-space: nowrap;
}

#scannerOverlay .table-years-input {
    width: 45px;
    background: var(--bg-surface);
    border: 1px solid #4a4a4a;
    border-radius: 6px;
    padding: 6px 4px;
    color: var(--text-primary);
    font-size: 12px;
    font-family: inherit;
    transition: all 0.3s ease;
    height: 32px;
    text-align: center;
}

#scannerOverlay .table-years-input:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 2px rgba(195, 160, 95, 0.1);
}

#scannerOverlay .table-strategy-group {
    display: flex;
    align-items: center;
}

#scannerOverlay .table-strategy-control {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 32px;
}

#scannerOverlay .table-strategy-label {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    min-width: 28px;
    color: var(--text-muted);
    transition: color 0.3s ease;
}

#scannerOverlay .table-strategy-label.active.short {
    color: var(--danger);
}

#scannerOverlay .table-strategy-label.active.long {
    color: var(--success);
}

#scannerOverlay .table-toggle-switch {
    position: relative;
    width: 40px;
    height: 20px;
    background: var(--bg-card);
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 1px solid var(--border-light);
    box-shadow:
        0 0 6px rgba(255, 80, 80, 0.6),
        0 0 12px rgba(255, 80, 80, 0.4),
        0 0 18px rgba(255, 80, 80, 0.2);
}

#scannerOverlay .table-toggle-switch.long {
    box-shadow:
        0 0 6px rgba(50, 255, 120, 0.6),
        0 0 12px rgba(50, 255, 120, 0.4),
        0 0 18px rgba(50, 255, 120, 0.2);
}

#scannerOverlay .table-toggle-slider {
    position: absolute;
    top: 1px;
    left: 1px;
    width: 16px;
    height: 16px;
    background: white;
    border-radius: 3px;
    transition: transform 0.3s ease;
}

#scannerOverlay .table-toggle-switch.long .table-toggle-slider {
    transform: translateX(22px);
}


#scannerOverlay .table-market-cap-group {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 200px;
}

#scannerOverlay .table-market-cap-label {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-muted);
    white-space: nowrap;
}

#scannerOverlay .table-market-cap-slider {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

#scannerOverlay .table-slider-container {
    position: relative;
    width: 120px;
    height: 24px;
    background: var(--bg-card);
    border-radius: 6px;
    cursor: pointer;
    border: 1px solid var(--border-light);
    display: flex;
    align-items: center;
}

#scannerOverlay .table-slider-track {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 20px;
    background: transparent;
    border-radius: 4px;
    pointer-events: none;
}

#scannerOverlay .table-slider-progress {
    position: absolute;
    top: 2px;
    left: 2px;
    height: 18px;
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    border-radius: 4px;
    width: 0%;
    transition: width 0.1s ease;
}

#scannerOverlay .table-slider-input {
    width: 100%;
    height: 24px;
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    cursor: pointer;
    outline: none;
    position: relative;
}

#scannerOverlay .table-slider-input::-webkit-slider-track {
    width: 100%;
    height: 24px;
    background: transparent;
}

#scannerOverlay .table-slider-input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    background: white;
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

#scannerOverlay .table-slider-input::-moz-range-track {
    width: 100%;
    height: 24px;
    background: transparent;
}

#scannerOverlay .table-slider-input::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background: white;
    border-radius: 4px;
    cursor: pointer;
    border: none;
    position: relative;
    z-index: 2;
}

#scannerOverlay .table-market-cap-value {
    font-size: 10px;
    color: var(--text-muted);
    white-space: nowrap;
    min-width: 50px;
    text-align: center;
}


#scannerOverlay .table-futures-category-group {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 140px;
}

#scannerOverlay .table-futures-category-label {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-muted);
    white-space: nowrap;
}

#scannerOverlay .table-futures-category-select {
    background: var(--bg-surface);
    border: 1px solid #4a4a4a;
    border-radius: 6px;
    padding: 6px 8px;
    color: var(--text-primary);
    font-size: 12px;
    font-family: inherit;
    transition: all 0.3s ease;
    height: 32px;
    min-width: 80px;
}

#scannerOverlay .table-futures-category-select:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 2px rgba(195, 160, 95, 0.1);
}


#scannerOverlay .table-extended-group {
    display: flex;
    align-items: center;
}

#scannerOverlay .extended-toggle-label {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
    white-space: nowrap;
    user-select: none;
}

#scannerOverlay .extended-toggle-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--gold);
    cursor: pointer;
}

#scannerOverlay .extended-label-text {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
}


#scannerOverlay .sc-admin-backtest {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(139, 92, 246, 0.35);
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.08), rgba(139, 92, 246, 0.02));
}
#scannerOverlay .sc-admin-backtest.active {
    border-color: rgba(139, 92, 246, 0.7);
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.18), rgba(139, 92, 246, 0.05));
}
#scannerOverlay .sc-admin-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}
#scannerOverlay .sc-admin-toggle input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
#scannerOverlay .sc-admin-toggle-track {
    position: relative;
    flex: 0 0 auto;
    width: 38px;
    height: 20px;
    border-radius: 999px;
    background: #3a3550;
    transition: background .18s ease;
}
#scannerOverlay .sc-admin-toggle-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    transition: transform .18s ease;
}
#scannerOverlay .sc-admin-toggle input:checked + .sc-admin-toggle-track {
    background: #8b5cf6;
}
#scannerOverlay .sc-admin-toggle input:checked + .sc-admin-toggle-track .sc-admin-toggle-thumb {
    transform: translateX(18px);
}
#scannerOverlay .sc-admin-toggle-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
    line-height: 1.2;
}
#scannerOverlay .sc-admin-badge {
    display: inline-block;
    margin-left: 4px;
    padding: 1px 6px;
    border-radius: 6px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .5px;
    color: #fff;
    background: #8b5cf6;
    vertical-align: middle;
}
#scannerOverlay .sc-admin-backtest-hint {
    margin-top: 6px;
    font-size: 11px;
    line-height: 1.35;
    color: var(--text-muted);
}

#scannerOverlay .sc-backtest-banner {
    margin: 0 0 10px 0;
    padding: 9px 14px;
    border: 1px solid rgba(139, 92, 246, 0.5);
    border-left: 3px solid #8b5cf6;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(139, 92, 246, 0.04));
    color: #d9ccff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}
#scannerOverlay .sc-backtest-banner.provisional {
    border-color: rgba(245, 158, 11, 0.55);
    border-left-color: #f59e0b;
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.16), rgba(245, 158, 11, 0.04));
    color: #ffe2b0;
}


#scannerOverlay .results-table-container {
    flex: 1;
    overflow-y: auto;
    overflow-x: auto;
}

#scannerOverlay .results-table-container::-webkit-scrollbar {
    width: 8px;
}

#scannerOverlay .results-table-container::-webkit-scrollbar-track {
    background: #1e1e1e;
}

#scannerOverlay .results-table-container::-webkit-scrollbar-thumb {
    background: var(--gold);
    border-radius: 4px;
}

#scannerOverlay .results-table {
    width: 100%;
    border-collapse: collapse;
}

#scannerOverlay .results-table th {
    background: #1a1a1a;
    color: var(--text-muted);
    text-align: left;
    padding: 14px 20px;
    font-weight: 600;
    position: sticky;
    top: 0;
    z-index: 10;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
    white-space: nowrap;
    border-bottom: 2px solid rgba(195, 160, 95, 0.3);
}

#scannerOverlay .results-table th.sortable {
    cursor: pointer;
    user-select: none;
    position: relative;
    padding-right: 22px;
}

#scannerOverlay .results-table th.sortable::after {
    content: '\25B2\a\25BC';
    white-space: pre;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9px;
    line-height: 10px;
    opacity: 0.3;
    color: var(--text-muted);
}

#scannerOverlay .results-table th.sortable.sorted-asc::after {
    content: '\25B2';
    font-size: 11px;
    line-height: 1;
    opacity: 1;
    color: var(--gold);
}

#scannerOverlay .results-table th.sortable.sorted-desc::after {
    content: '\25BC';
    font-size: 11px;
    line-height: 1;
    opacity: 1;
    color: var(--gold);
}

#scannerOverlay .results-table th.sortable:hover {
    color: var(--text-primary);
}

#scannerOverlay .results-table td {
    padding: 16px 20px;
    border-bottom: 1px solid var(--border-subtle);
    font-size: 16px;
    color: var(--text-secondary);
    white-space: nowrap;
    text-align: left;
    vertical-align: middle;
}

#scannerOverlay .results-table tr {
    transition: all 0.15s;
}

#scannerOverlay .results-table tr:hover {
    background: var(--hover-subtle);
}


#scannerOverlay .symbol-cell {
    font-weight: 700;
    color: #ffffff;
    font-family: 'Monaco', 'Menlo', monospace;
    width: 70px;
    padding: 6px 4px !important;
}

#scannerOverlay .symbol-box {
    display: inline-block;
    padding: 4px 6px;
    border: 1px solid var(--border-light);
    border-radius: 4px;
    background: transparent;
    font-weight: 700;
    color: #ffffff;
    font-family: 'Monaco', 'Menlo', monospace;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s ease;
}

#scannerOverlay .symbol-box:hover {
    border-color: var(--gold);
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    color: var(--bg-primary);
}

#scannerOverlay .name-cell {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#scannerOverlay .logo-cell {
    text-align: left;
    padding: 4px 2px;
    width: 36px;
    min-width: 36px;
    max-width: 36px;
}

#scannerOverlay .logo-img {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    object-fit: cover;
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    margin: 0 auto;
    display: block;
}

#scannerOverlay .logo-fallback {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--bg-card);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    color: var(--gold);
    border: 1px solid var(--border-light);
    margin: 0 auto;
}


#scannerOverlay .sharpe-help {
    display: inline-block;
    width: 16px;
    height: 16px;
    background: var(--bg-primary);
    color: var(--gold);
    border-radius: 50%;
    text-align: center;
    line-height: 16px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    margin-left: 4px;
    border: 1px solid var(--gold);
    transition: all 0.3s ease;
}

#scannerOverlay .sharpe-help:hover {
    background: var(--gold);
    color: var(--bg-primary);
}


#scannerOverlay .mini-chart {
    width: 200px;
    height: 52px;
}

#scannerOverlay .mini-chart-line {
    fill: none;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#scannerOverlay .mini-chart-positive {
    stroke: var(--success);
}

#scannerOverlay .mini-chart-negative {
    stroke: var(--danger);
}

#scannerOverlay .mini-chart-neutral {
    stroke: var(--text-muted);
}

#scannerOverlay .mini-chart-area {
    opacity: 0.12;
}

#scannerOverlay .chart-cell {
    text-align: left;
    padding: 8px 10px;
    width: 220px;
}

#scannerOverlay .mini-chart {
    cursor: pointer;
    opacity: 0.9;
    transition: opacity 0.2s ease;
}

#scannerOverlay .mini-chart:hover {
    opacity: 1;
}


#scannerOverlay .backtest-charts {
    width: 100%;
}

#scannerOverlay .chart-section {
    width: 100%;
}

#scannerOverlay .large-chart-container {
    width: 100%;
    background: var(--bg-tertiary);
    border-radius: 8px;
    padding: 16px;
    border: 1px solid var(--border-light);
}

#scannerOverlay .performance-stats {
    border: 1px solid var(--border-light);
}


#scannerOverlay .sharpe-negative {
    color: #ef4444;
    font-weight: 600;
}

#scannerOverlay .sharpe-poor {
    color: #f97316;
    font-weight: 600;
}

#scannerOverlay .sharpe-acceptable {
    color: #eab308;
    font-weight: 600;
}

#scannerOverlay .sharpe-good {
    color: #22c55e;
    font-weight: 600;
}

#scannerOverlay .sharpe-excellent {
    color: #22c55e;
    font-weight: 600;
}

#scannerOverlay .sharpe-star {
    color: #fbbf24;
    margin-left: 4px;
}


#scannerOverlay .thead-group-row th {
    padding: 6px 20px !important;
    border-bottom: none !important;
    font-size: 10px !important;
    letter-spacing: 1.5px;
    position: sticky !important;
    top: 0 !important;
    z-index: 12 !important;
    background: #1a1a1a !important;
    height: 28px;
}

#scannerOverlay .thead-main-row th {
    position: sticky !important;
    top: 28px !important;
    z-index: 11 !important;
    background: #1a1a1a !important;
    box-shadow: 0 -1px 0 0 #1a1a1a;
}

#scannerOverlay .thead-group-label {
    text-align: center !important;
    color: var(--gold) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}


#scannerOverlay .col-separator {
    border-right: 2px solid rgba(195, 160, 95, 0.25) !important;
}


#scannerOverlay .overall-cell {
    text-align: center !important;
    min-width: 70px;
    padding: 8px 12px !important;
}

#scannerOverlay .overall-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    font-weight: 800;
    font-size: 18px;
    font-family: 'JetBrains Mono', monospace;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.5px;
}


#scannerOverlay .health-cell {
    text-align: center !important;
    min-width: 80px;
}

#scannerOverlay .health-score {
    font-family: 'JetBrains Mono', monospace;
    font-size: 17px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

#scannerOverlay .health-score .health-total {
    font-weight: 500;
    color: var(--text-dim);
}

#scannerOverlay .health-good { color: #22c55e; }
#scannerOverlay .health-warning { color: #eab308; }
#scannerOverlay .health-danger { color: #ef4444; }


#scannerOverlay .star-rating {
    font-size: 16px;
    letter-spacing: 2px;
    white-space: nowrap;
    line-height: 1;
}

#scannerOverlay .star-rating .stars-empty {
    color: var(--text-dim);
    opacity: 0.4;
}


#scannerOverlay .conf-cell {
    font-weight: 600;
    font-size: 13px;
    text-align: left;
}

#scannerOverlay .conf-high { color: #22c55e; }
#scannerOverlay .conf-medium { color: #eab308; }
#scannerOverlay .conf-low { color: #888; }


#scannerOverlay .er-cell {
    font-weight: 600;
    font-size: 14px;
}


#scannerOverlay .pf-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 15px;
    font-family: 'JetBrains Mono', monospace;
    min-width: 52px;
}

#scannerOverlay .pf-g { background: var(--success-dim); color: var(--success); }
#scannerOverlay .pf-y { background: rgba(251,191,36,0.12); color: var(--warning); }
#scannerOverlay .pf-r { background: var(--danger-dim); color: var(--danger); }


#scannerOverlay .num-cell {
    text-align: center !important;
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}


#scannerOverlay .hero-metric {
    text-align: center !important;
    font-family: 'JetBrains Mono', monospace;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.5px;
    font-variant-numeric: tabular-nums;
}


#scannerOverlay .pct10y-cell {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 600;
    font-size: 16px;
    font-variant-numeric: tabular-nums;
}


#scannerOverlay .ma-cell { text-align: center !important; min-width: 80px; }
#scannerOverlay .ma-dist { display: flex; align-items: center; gap: 4px; font-family: 'JetBrains Mono', monospace; font-size: 15px; font-weight: 600; justify-content: center; }
#scannerOverlay .ma-dist-up { color: var(--success); }
#scannerOverlay .ma-dist-dn { color: var(--danger); }
#scannerOverlay .ma-arrow { font-size: 16px; }


#scannerOverlay .gc-y { color: #22c55e; font-weight: 600; }
#scannerOverlay .gc-n { color: #555; }


#scannerOverlay .trend-cell { text-align: center !important; min-width: 80px; }
#scannerOverlay .trend-hm { display: flex; flex-direction: column; align-items: center; gap: 2px; }
#scannerOverlay .trend-arrows { display: flex; align-items: center; gap: 4px; justify-content: center; }
#scannerOverlay .trend-arrow { font-size: 20px; font-weight: 900; line-height: 1; }
#scannerOverlay .trend-arrow-long { color: var(--success); }
#scannerOverlay .trend-arrow-short { color: var(--danger); }
#scannerOverlay .trend-arrow-neutral { color: var(--text-dim); }
#scannerOverlay .trend-labels { display: flex; gap: 4px; justify-content: center; margin-top: 2px; }
#scannerOverlay .trend-lbl { width: 18px; text-align: center; font-size: 11px; color: var(--text-dim); font-weight: 600; }


#scannerOverlay .details-section-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--gold);
    margin: 20px 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-light);
}

#scannerOverlay .details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

#scannerOverlay .details-grid .stat-row {
    padding: 8px 0;
}

#scannerOverlay .details-perf-bar {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

#scannerOverlay .details-perf-bar .perf-value {
    font-weight: 600;
    font-size: 13px;
}

#scannerOverlay .details-ma-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

#scannerOverlay .details-ma-badge {
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
}

#scannerOverlay .details-ma-badge.above { background: rgba(34, 197, 94, 0.15); color: #22c55e; }
#scannerOverlay .details-ma-badge.below { background: rgba(239, 68, 68, 0.15); color: #ef4444; }
#scannerOverlay .details-ma-badge.active { background: rgba(195, 160, 95, 0.2); color: #C3A05F; }
#scannerOverlay .details-ma-badge.inactive { background: rgba(136, 136, 136, 0.1); color: #888; }

#scannerOverlay .details-health-bar {
    width: 100%;
    height: 6px;
    background: var(--bg-card);
    border-radius: 3px;
    margin-top: 6px;
    overflow: hidden;
}

#scannerOverlay .details-health-fill {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s ease;
}


#scannerOverlay .positive {
    color: var(--success);
    font-weight: 600;
}

#scannerOverlay .negative {
    color: var(--danger);
    font-weight: 600;
}

#scannerOverlay .neutral {
    color: var(--text-muted);
    font-weight: 500;
}


#scannerOverlay .sharpe-cell {
    width: 55px;
    padding: 6px 4px !important;
}

#scannerOverlay .years-cell {
    text-align: center !important;
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    font-weight: 600;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}


#scannerOverlay .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 20px;
    background: var(--bg-secondary);
    border-top: 1px solid var(--border-light);
    flex-shrink: 0;
}

#scannerOverlay .pagination-btn {
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    color: var(--text-secondary);
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
    min-width: 36px;
    text-align: center;
}

#scannerOverlay .pagination-btn:hover:not(:disabled) {
    background: var(--gold);
    border-color: var(--gold);
    color: var(--bg-primary);
}

#scannerOverlay .pagination-btn.active {
    background: var(--gold);
    border-color: var(--gold);
    color: var(--bg-primary);
}

#scannerOverlay .pagination-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

#scannerOverlay .pagination-info {
    color: var(--text-muted);
    font-size: 14px;
    margin: 0 12px;
}


#scannerOverlay .hidden {
    display: none !important;
}


#scannerOverlay .modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 2000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 80px 20px 20px 20px;
}

#scannerOverlay .modal-content {
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 16px;
    width: 100%;
    max-width: 500px;
    max-height: calc(100vh - 120px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

#scannerOverlay .modal-content.wide {
    max-width: 1100px;
    max-height: calc(100vh - 200px);
}

#scannerOverlay .modal-header {
    background: #1e1e1e;
    padding: 20px 24px;
    border-bottom: 1px solid var(--border-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
}

#scannerOverlay .modal-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--gold);
    margin: 0;
}

#scannerOverlay .modal-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

#scannerOverlay .modal-close {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    transition: all 0.3s ease;
}

#scannerOverlay .modal-close:hover {
    background: var(--bg-surface);
    color: var(--text-primary);
}

#scannerOverlay .modal-body {
    padding: 24px;
    flex: 1;
    overflow-y: auto;
}

#scannerOverlay .modal-body::-webkit-scrollbar {
    width: 6px;
}

#scannerOverlay .modal-body::-webkit-scrollbar-track {
    background: #1e1e1e;
}

#scannerOverlay .modal-body::-webkit-scrollbar-thumb {
    background: var(--gold);
    border-radius: 3px;
}

#scannerOverlay .modal-exchange-selector {
    border: 1px solid #4a4a4a;
    border-radius: 8px;
    max-height: 300px;
    overflow-y: auto;
    background: var(--bg-surface);
    margin-bottom: 20px;
}

#scannerOverlay .modal-footer {
    padding: 16px 24px;
    border-top: 1px solid var(--border-light);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-shrink: 0;
}

#scannerOverlay .modal-btn {
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
    border: 1px solid var(--border-light);
}

#scannerOverlay .modal-btn-cancel {
    background: var(--bg-surface);
    color: var(--text-secondary);
}

#scannerOverlay .modal-btn-cancel:hover {
    background: var(--bg-card);
}

#scannerOverlay .modal-btn-confirm {
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    color: var(--bg-primary);
    border-color: var(--gold);
}

#scannerOverlay .modal-btn-confirm:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
}

#scannerOverlay .modal-btn-confirm:disabled {
    background: var(--bg-surface);
    color: var(--text-muted);
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}


#scannerOverlay .bt-body { display: flex; min-height: 520px; }

#scannerOverlay .bt-sidebar {
    width: 310px;
    flex-shrink: 0;
    border-right: 1px solid var(--border-light);
    padding: 20px;
    overflow-y: auto;
    background: var(--bg-primary);
}

#scannerOverlay .bt-sidebar::-webkit-scrollbar { width: 4px; }
#scannerOverlay .bt-sidebar::-webkit-scrollbar-track { background: transparent; }
#scannerOverlay .bt-sidebar::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 2px; }

#scannerOverlay .bt-charts {
    flex: 1;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow-y: auto;
}

#scannerOverlay .bt-charts::-webkit-scrollbar { width: 4px; }
#scannerOverlay .bt-charts::-webkit-scrollbar-track { background: transparent; }
#scannerOverlay .bt-charts::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 2px; }


#scannerOverlay .ms-section { margin-bottom: 20px; }

#scannerOverlay .ms-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--border-light);
}

#scannerOverlay .ms-big { font-size: 40px; font-weight: 900; letter-spacing: -1px; }
#scannerOverlay .ms-big-sub { font-size: 15px; color: var(--text-muted); margin-top: 2px; }

#scannerOverlay .ms-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
}

#scannerOverlay .ms-row + .ms-row { border-top: 1px solid rgba(68,68,68,0.3); }
#scannerOverlay .ms-label { font-size: 15px; color: var(--text-muted); }
#scannerOverlay .ms-val { font-size: 16px; font-weight: 600; color: var(--text-primary); }

#scannerOverlay .ms-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 700;
}

#scannerOverlay .ms-badge-g { background: rgba(34,197,94,0.12); color: #22c55e; }
#scannerOverlay .ms-badge-r { background: rgba(239,68,68,0.12); color: #ef4444; }


#scannerOverlay .health-ring { text-align: center; padding: 8px 0; }
#scannerOverlay .health-ring svg { width: 90px; height: 90px; transform: rotate(-90deg); }
#scannerOverlay .hr-bg { fill: none; stroke: var(--bg-surface); stroke-width: 7; }
#scannerOverlay .hr-fill { fill: none; stroke-width: 7; stroke-linecap: round; }

#scannerOverlay .hr-text {
    position: relative;
    top: -56px;
    font-size: 30px;
    font-weight: 900;
    text-align: center;
}

#scannerOverlay .hr-sub { font-size: 14px; color: var(--text-muted); position: relative; top: -50px; }


#scannerOverlay .trend-bar-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
#scannerOverlay .trend-bar-label { font-size: 15px; color: var(--text-muted); width: 52px; font-weight: 600; }
#scannerOverlay .trend-bar-track { flex: 1; height: 8px; background: var(--bg-surface); border-radius: 4px; overflow: hidden; }
#scannerOverlay .trend-bar-fill { height: 100%; border-radius: 4px; }
#scannerOverlay .trend-bar-fill.long { background: linear-gradient(90deg, #22c55e, rgba(34,197,94,0.4)); }
#scannerOverlay .trend-bar-fill.short { background: linear-gradient(90deg, #ef4444, rgba(239,68,68,0.4)); }
#scannerOverlay .trend-bar-dir { font-size: 14px; font-weight: 700; width: 42px; text-align: right; }


#scannerOverlay .bt-top-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

#scannerOverlay .bt-stat-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    padding: 14px;
    text-align: center;
}

#scannerOverlay .bt-stat-label { font-size: 13px; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; }
#scannerOverlay .bt-stat-val { font-size: 26px; font-weight: 800; margin-top: 4px; }
#scannerOverlay .bt-stat-sub { font-size: 14px; color: var(--text-muted); margin-top: 2px; }
#scannerOverlay .v-green { color: #22c55e; }
#scannerOverlay .v-red { color: #ef4444; }


#scannerOverlay .details-container {
    padding: 0;
}

#scannerOverlay .details-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-light);
}

#scannerOverlay .details-logo img,
#scannerOverlay .details-logo .logo-fallback {
    width: 48px;
    height: 48px;
}

#scannerOverlay .details-logo .logo-fallback {
    font-size: 18px;
}

#scannerOverlay .details-info h4 {
    font-size: 20px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 4px;
}

#scannerOverlay .details-info p {
    font-size: 14px;
    color: var(--text-muted);
    margin: 0;
}

#scannerOverlay .details-stats {
    margin-bottom: 24px;
}

#scannerOverlay .stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--border-light);
}

#scannerOverlay .stat-row:last-child {
    border-bottom: none;
}

#scannerOverlay .stat-label {
    font-size: 14px;
    color: var(--text-muted);
    font-weight: 500;
}

#scannerOverlay .stat-value {
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
}

#scannerOverlay .details-chart {
    margin-top: 16px;
}

#scannerOverlay .details-chart h5 {
    font-size: 16px;
    color: var(--gold);
    margin-bottom: 12px;
    font-weight: 600;
}

#scannerOverlay .details-chart #detailsChartContainer {
    width: 100%;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#scannerOverlay .details-chart .mini-chart {
    width: 100% !important;
    height: 120px !important;
    cursor: default;
}

#scannerOverlay .tip-box {
    background: var(--bg-surface);
    padding: 12px;
    border-radius: 8px;
    border-left: 4px solid var(--gold);
    margin-top: 16px;
}


#scannerOverlay .filters-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    color: var(--text-secondary);
    padding: 6px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: inherit;
    white-space: nowrap;
    height: 32px;
    position: relative;
}

#scannerOverlay .filters-btn:hover {
    border-color: var(--gold);
    color: var(--gold);
}

#scannerOverlay .filters-btn.has-active {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(195, 160, 95, 0.1);
}

#scannerOverlay .filters-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--gold);
    color: var(--bg-primary);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}


#scannerOverlay .modal-btn-reset {
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    color: var(--text-muted);
    padding: 4px 12px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
}

#scannerOverlay .modal-btn-reset:hover {
    background: rgba(239, 68, 68, 0.15);
    border-color: var(--danger);
    color: var(--danger);
}

#scannerOverlay .af-strategy-indicator {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    margin-bottom: 20px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-muted);
}

#scannerOverlay .af-strategy-long {
    color: var(--success);
    font-weight: 800;
}

#scannerOverlay .af-strategy-short {
    color: var(--danger);
    font-weight: 800;
}

#scannerOverlay .af-strategy-hint {
    font-size: 11px;
    font-weight: 400;
    color: var(--text-dim);
    margin-left: auto;
}

#scannerOverlay .af-section {
    margin-bottom: 20px;
}

#scannerOverlay .af-section-title {
    font-size: 11px;
    font-weight: 700;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--border-light);
}

#scannerOverlay .af-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(68, 68, 68, 0.3);
}

#scannerOverlay .af-row:last-child {
    border-bottom: none;
}

#scannerOverlay .af-label {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    flex: 1;
}

#scannerOverlay .af-hint {
    font-size: 11px;
    font-weight: 600;
    color: var(--text-dim);
    min-width: 80px;
    text-align: right;
}

#scannerOverlay .af-unit {
    font-size: 12px;
    color: var(--text-muted);
    font-weight: 600;
    min-width: 16px;
}

#scannerOverlay .af-input {
    width: 65px;
    background: var(--bg-surface);
    border: 1px solid #4a4a4a;
    border-radius: 6px;
    padding: 5px 8px;
    color: var(--text-primary);
    font-size: 13px;
    font-family: 'JetBrains Mono', monospace;
    text-align: center;
    height: 30px;
    transition: all 0.2s ease;
}

#scannerOverlay .af-input:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 2px rgba(195, 160, 95, 0.1);
}


#scannerOverlay .af-toggle {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    flex-shrink: 0;
}

#scannerOverlay .af-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}

#scannerOverlay .af-toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: var(--bg-card);
    border: 1px solid var(--border-light);
    transition: all 0.2s ease;
    border-radius: 4px;
}

#scannerOverlay .af-toggle-slider::before {
    content: "";
    position: absolute;
    height: 14px;
    width: 14px;
    left: 2px;
    bottom: 2px;
    background-color: var(--text-muted);
    transition: all 0.2s ease;
    border-radius: 2px;
}

#scannerOverlay .af-toggle input:checked + .af-toggle-slider {
    background-color: rgba(195, 160, 95, 0.2);
    border-color: var(--gold);
}

#scannerOverlay .af-toggle input:checked + .af-toggle-slider::before {
    transform: translateX(16px);
    background-color: var(--gold);
}


@keyframes sc-ai-gradient-shift {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes sc-ai-sheen {
    0%   { left: -100%; opacity: 0; }
    15%  { opacity: 1; }
    45%  { left: 140%; opacity: 0; }
    100% { left: 140%; opacity: 0; }
}

@keyframes sc-ai-pulse-glow {
    0%, 100% { box-shadow: 0 0 10px rgba(139,92,246,0.45), 0 0 22px rgba(109,40,217,0.2), inset 0 1px 0 var(--surface-border-hi); }
    50%       { box-shadow: 0 0 20px rgba(168,85,247,0.75), 0 0 40px rgba(139,92,246,0.3), inset 0 1px 0 var(--surface-border-strong); }
}

@keyframes sc-ai-sparkle-dance {
    0%   { transform: rotate(0deg) scale(1);    filter: drop-shadow(0 0 2px rgba(216,180,254,0.6)); }
    25%  { transform: rotate(18deg) scale(1.3); filter: drop-shadow(0 0 7px rgba(216,180,254,1)); }
    50%  { transform: rotate(0deg) scale(1);    filter: drop-shadow(0 0 2px rgba(216,180,254,0.6)); }
    75%  { transform: rotate(-18deg) scale(1.2);filter: drop-shadow(0 0 6px rgba(216,180,254,0.95)); }
    100% { transform: rotate(0deg) scale(1);    filter: drop-shadow(0 0 2px rgba(216,180,254,0.6)); }
}

@keyframes sc-ai-item-twinkle {
    0%, 100% { opacity: 0.65; transform: scale(1);    filter: drop-shadow(0 0 2px rgba(168,85,247,0.4)); }
    50%       { opacity: 1;    transform: scale(1.4);  filter: drop-shadow(0 0 9px rgba(192,132,252,1)); }
}


#scannerOverlay .sort-by-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
    position: relative;
}

#scannerOverlay .sort-by-label {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-muted);
    white-space: nowrap;
    text-align: center;
}

#scannerOverlay .sort-by-buttons {
    display: flex;
    align-items: center;
    gap: 8px;
}


#scannerOverlay .season-sort-wrapper { position: relative; }

#scannerOverlay .season-sort-btn {
    display: flex;
    align-items: center;
    gap: 7px;
    background: var(--bg-surface);
    border: 1px solid var(--border-light);
    color: var(--text-secondary);
    padding: 6px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    white-space: nowrap;
    height: 32px;
    letter-spacing: 0.3px;
    transition: all 0.2s ease;
}

#scannerOverlay .season-sort-btn:hover {
    border-color: var(--gold);
    color: var(--gold);
}

#scannerOverlay .season-sort-btn.active {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(195, 160, 95, 0.1);
}

#scannerOverlay .season-sort-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    min-width: 160px;
    z-index: 2000;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

#scannerOverlay .season-sort-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    transition: all 0.15s ease;
    border-bottom: 1px solid var(--border-subtle);
}

#scannerOverlay .season-sort-item:last-child { border-bottom: none; }

#scannerOverlay .season-sort-item:hover {
    background: rgba(195, 160, 95, 0.1);
    color: var(--gold);
}

#scannerOverlay .season-sort-item.selected {
    color: var(--gold);
}

#scannerOverlay .season-sort-item .check-icon {
    width: 14px;
    text-align: center;
    font-size: 12px;
    color: var(--gold);
}


#scannerOverlay .ai-picks-wrapper { position: relative; }

#scannerOverlay .ai-picks-btn {
    display: flex;
    align-items: center;
    gap: 7px;
    background: linear-gradient(135deg, #3b0764, #6d28d9, #a855f7, #7c3aed, #3b0764);
    background-size: 300% 300%;
    animation: sc-ai-gradient-shift 5s ease infinite, sc-ai-pulse-glow 3s ease-in-out infinite;
    border: 1px solid rgba(168,85,247,0.55);
    color: #f3e8ff;
    padding: 6px 14px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    font-family: inherit;
    white-space: nowrap;
    height: 32px;
    letter-spacing: 0.5px;
    transition: transform 0.2s ease, border-color 0.2s ease;
    position: relative;
    overflow: hidden;
}

#scannerOverlay .ai-picks-btn::before {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 55%; height: 100%;
    background: linear-gradient(120deg, transparent, var(--surface-border-strong), transparent);
    animation: sc-ai-sheen 3.5s ease infinite;
    pointer-events: none;
}

#scannerOverlay .ai-picks-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(216,180,254,0.85);
}

#scannerOverlay .ai-picks-sparkle-icon {
    animation: sc-ai-sparkle-dance 5s ease-in-out infinite;
    transform-origin: center;
    flex-shrink: 0;
}

#scannerOverlay .ai-picks-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    background: linear-gradient(160deg, #130826 0%, #1c0f35 60%, #160a2e 100%);
    border: 1px solid rgba(139,92,246,0.5);
    border-radius: 14px;
    min-width: 230px;
    z-index: 2000;
    overflow: hidden;
    box-shadow:
        0 14px 44px rgba(79,30,180,0.6),
        0 0 0 1px rgba(168,85,247,0.1),
        inset 0 1px 0 var(--surface-raised);
}

#scannerOverlay .ai-picks-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: rgba(233,213,255,0.8);
    transition: all 0.15s ease;
    border-bottom: 1px solid rgba(109,40,217,0.2);
    position: relative;
    overflow: hidden;
}

#scannerOverlay .ai-picks-item:last-child { border-bottom: none; }

#scannerOverlay .ai-picks-item::after {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, #c084fc, #7c3aed);
    border-radius: 0 2px 2px 0;
    transform: scaleY(0);
    transition: transform 0.15s ease;
}

#scannerOverlay .ai-picks-item:hover::after,
#scannerOverlay .ai-picks-item.selected::after { transform: scaleY(1); }

#scannerOverlay .ai-picks-item.selected {
    background: linear-gradient(90deg, rgba(109,40,217,0.22), rgba(139,92,246,0.06));
    color: #ede9fe;
}

#scannerOverlay .ai-picks-item:hover {
    background: linear-gradient(90deg, rgba(109,40,217,0.28), rgba(139,92,246,0.08));
    color: #ede9fe;
}

#scannerOverlay .ai-picks-item-icon {
    width: 16px;
    height: 16px;
    color: #c084fc;
    flex-shrink: 0;
    animation: sc-ai-item-twinkle 2.4s ease-in-out infinite;
}

#scannerOverlay .ai-picks-item:nth-child(2) .ai-picks-item-icon { animation-delay: 0.5s; }
#scannerOverlay .ai-picks-item:nth-child(3) .ai-picks-item-icon { animation-delay: 1s; }
#scannerOverlay .ai-picks-item-sub { font-size: 10px; font-weight: 500; color: rgba(139,92,246,0.65); margin-top: 2px; }


#scannerOverlay .ai-picks-dropdown .season-sort-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    transition: all 0.15s ease;
    border-top: 1px solid rgba(109,40,217,0.35);
    background: var(--bg-secondary);
}
#scannerOverlay .ai-picks-dropdown .season-sort-item:last-child {
    border-radius: 0 0 14px 14px;
}
#scannerOverlay .ai-picks-dropdown .season-sort-item:hover {
    background: rgba(195,160,95,0.1);
    color: var(--gold);
}
#scannerOverlay .ai-picks-dropdown .season-sort-item.selected {
    color: var(--gold);
}
#scannerOverlay .ai-picks-dropdown .season-sort-item .check-icon {
    width: 14px;
    text-align: center;
    font-size: 12px;
    color: var(--gold);
    flex-shrink: 0;
}


#scannerOverlay .ai-th-sparkle {
    display: inline-block;
    width: 13px;
    height: 13px;
    vertical-align: middle;
    margin-right: 3px;
    color: #a855f7;
    animation: sc-ai-sparkle-dance 5s ease-in-out infinite;
    transform-origin: center;
    filter: drop-shadow(0 0 3px rgba(168,85,247,0.5));
}


@media (max-width: 768px) {
    #scannerOverlay .hamburger-btn {
        display: block;
    }

    #scannerOverlay .header {
        padding: 12px 16px;
    }

    #scannerOverlay .brand-info h1 {
        font-size: 18px;
    }

    #scannerOverlay .brand-info p {
        display: none;
    }

    #scannerOverlay .content-area {
        margin-left: 0;
    }

    #scannerOverlay .drawer {
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        z-index: 900;
    }

    #scannerOverlay .drawer.open {
        transform: translateX(0);
    }

    #scannerOverlay .mobile-overlay.active {
        display: block;
    }

    #scannerOverlay .dates-market-info {
        display: none !important;
    }

    #scannerOverlay .controls-section {
        padding: 12px 16px;
    }

    #scannerOverlay .controls-layout {
        flex-direction: column;
        gap: 16px;
    }

    #scannerOverlay .dates-container {
        padding: 12px 16px;
        flex: none;
    }

    #scannerOverlay .dates-content {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }

    #scannerOverlay .dates-row {
        flex-wrap: nowrap;
        gap: 8px;
        justify-content: space-between;
        align-items: end;
    }

    #scannerOverlay .date-group {
        width: auto;
        min-width: 60px;
        flex: 1;
    }

    #scannerOverlay .date-group select,
    #scannerOverlay .date-group input {
        width: 100%;
        font-size: 12px;
        padding: 6px 4px;
    }

    #scannerOverlay .date-separator {
        order: unset;
        width: auto;
        text-align: center;
        padding: 0 4px;
        font-size: 10px;
        margin: 0;
        padding-bottom: 6px;
    }

    #scannerOverlay .results-section {
        padding: 0 16px 16px 16px;
    }

    #scannerOverlay .table-search-container {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
        padding: 12px 16px;
    }

    #scannerOverlay .table-divider {
        display: none;
    }

    #scannerOverlay .table-strategy-group {
        order: 1;
        justify-content: center;
    }

    #scannerOverlay .mini-search {
        order: 2;
        width: 100%;
    }

    #scannerOverlay .table-market-cap-group {
        order: 3;
        justify-content: center;
        min-width: auto;
    }

    #scannerOverlay .table-futures-category-group {
        order: 4;
        justify-content: center;
        min-width: auto;
    }

    #scannerOverlay .desktop-only-col {
        display: none;
    }

    #scannerOverlay .mobile-name {
        font-weight: 500;
        margin-bottom: 8px;
    }

    #scannerOverlay .results-table th:not(.mobile-visible):not(.desktop-only-col),
    #scannerOverlay .results-table td:not(.mobile-visible):not(.desktop-only-col) {
        display: none;
    }

    #scannerOverlay .results-table th.mobile-visible,
    #scannerOverlay .results-table td.mobile-visible {
        display: table-cell;
    }

    #scannerOverlay .mobile-details {
        display: none;
        padding: 8px 0;
        font-size: 12px;
        color: var(--text-muted);
        border-top: 1px solid var(--border-light);
        margin-top: 8px;
    }

    #scannerOverlay .mobile-details-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        margin-top: 8px;
    }

    #scannerOverlay .mobile-detail-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 4px 0;
    }

    #scannerOverlay .mobile-detail-label {
        font-size: 11px;
        color: var(--text-muted);
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    #scannerOverlay .mobile-detail-value {
        font-size: 12px;
        font-weight: 600;
    }

    #scannerOverlay .symbol-box {
        font-size: 14px;
        padding: 4px 8px;
    }

    #scannerOverlay .logo-cell {
        width: 80px;
        padding: 8px 4px;
    }

    #scannerOverlay .logo-img,
    #scannerOverlay .logo-fallback {
        width: 24px;
        height: 24px;
    }

    #scannerOverlay .logo-fallback {
        font-size: 10px;
    }

    #scannerOverlay .pagination {
        flex-wrap: wrap;
        gap: 4px;
        padding: 16px;
    }

    #scannerOverlay .pagination-btn {
        min-width: 32px;
        padding: 6px 8px;
        font-size: 11px;
    }

    #scannerOverlay .pagination-info {
        font-size: 11px;
    }

    #scannerOverlay .modal-overlay {
        padding: 20px 10px;
    }

    #scannerOverlay .modal-content {
        max-height: calc(100vh - 40px);
    }

    #scannerOverlay .header-center {
        display: none;
    }
}

@media (max-width: 480px) {
    #scannerOverlay .brand-info h1 {
        font-size: 16px;
    }

    #scannerOverlay .date-group {
        min-width: 50px;
    }

    #scannerOverlay .date-group select,
    #scannerOverlay .date-group input {
        font-size: 11px;
        padding: 4px 2px;
    }

    #scannerOverlay .date-separator {
        font-size: 9px;
        padding: 0 2px;
    }

    #scannerOverlay .mobile-details-grid {
        grid-template-columns: 1fr;
    }

    #scannerOverlay .table-market-cap-slider {
        flex-direction: column;
        gap: 8px;
        align-items: stretch;
    }

    #scannerOverlay .table-slider-container {
        width: 100%;
    }

    #scannerOverlay .mobile-name {
        font-size: 13px;
    }

    #scannerOverlay .table-left-controls {
        gap: 6px;
    }

    #scannerOverlay .table-years-input {
        width: 40px;
    }

    #scannerOverlay .table-toggle-switch {
        width: 35px;
        height: 18px;
    }

    #scannerOverlay .table-toggle-slider {
        width: 14px;
        height: 14px;
    }

    #scannerOverlay .table-toggle-switch.long .table-toggle-slider {
        transform: translateX(19px);
    }
}



:root {
  --as-accent: #7c8cff;
  --as-accent-2: #59c2ff;
  --as-grad: linear-gradient(135deg, #7c8cff 0%, #59c2ff 100%);
  
  --as-text: rgba(255, 255, 255, .92);
  --as-text-dim: rgba(255, 255, 255, .5);
  --as-text-strong: #fff;
  --as-bubble-bg: rgba(255, 255, 255, .045);
  --as-bubble-border: rgba(255, 255, 255, .09);
  --as-hover: rgba(255, 255, 255, .08);
  --as-dot: rgba(255, 255, 255, .55);
}
:root[data-theme="light"] {
  --as-accent: #5566f0;
  --as-accent-2: #2f7fe0;
  --as-grad: linear-gradient(135deg, #5566f0 0%, #2f7fe0 100%);
  --as-text: #1c2030;
  --as-text-dim: #5b6276;
  --as-text-strong: #0e1220;
  --as-bubble-bg: rgba(20, 30, 60, .035);
  --as-bubble-border: rgba(20, 30, 60, .12);
  --as-hover: rgba(20, 30, 60, .055);
  --as-dot: rgba(20, 30, 60, .45);
}


.as-root {
  display: flex;
  flex-direction: column;
  height: 100%;
  font-family: var(--font-ui);
  overflow: hidden;
}


.as-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--as-bubble-border);
  flex: 0 0 auto;
}
.as-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--as-grad);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 4px 14px rgba(85, 102, 240, .28);
}
.as-avatar svg { width: 18px; height: 18px; fill: #fff; stroke: #fff; }
.as-head-meta { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.as-head-name { font-size: .94rem; font-weight: 600; color: var(--as-text-strong); }
.as-head-sub { font-size: .82rem; color: var(--as-text-dim); }
.as-head-back {
  margin-left: auto;
  display: none;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--as-text-dim);
  background: var(--as-bubble-bg);
  border: 1px solid var(--as-bubble-border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--ease), color var(--ease);
}
.as-head-back svg { width: 13px; height: 13px; }
.as-head-back:hover { background: var(--as-hover); color: var(--as-text); }
.as-head-back.show { display: inline-flex; }


.as-stream {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 18px 16px 8px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  scroll-behavior: smooth;
  position: relative;   
}
.as-sentinel { flex: 0 0 auto; height: 8px; margin: -4px 0; }
.as-stream::-webkit-scrollbar { width: 8px; }
.as-stream::-webkit-scrollbar-thumb { background: var(--as-bubble-border); border-radius: 4px; }


.as-row { display: flex; gap: 9px; align-items: flex-start; animation: as-fade-in .25s var(--ease); }
.as-row-user { justify-content: flex-end; }
.as-row-avatar {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--as-grad);
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}
.as-row-avatar svg { width: 13px; height: 13px; fill: #fff; stroke: #fff; }


.as-bubble {
  max-width: 84%;
  padding: 10px 13px;
  border-radius: var(--radius-md);
  font-size: .92rem;
  line-height: 1.5;
  color: var(--as-text);
}
.as-bubble-ai {
  background: var(--as-bubble-bg);
  border: 1px solid var(--as-bubble-border);
  border-top-left-radius: 4px;
}
.as-bubble-user {
  background: var(--as-grad);
  color: #fff;
  font-weight: 500;
  border-top-right-radius: 4px;
  box-shadow: 0 4px 14px rgba(85, 102, 240, .22);
}
.as-bubble b, .as-bubble strong { color: var(--as-text-strong); font-weight: 600; }
.as-bubble-user b, .as-bubble-user strong { color: #fff; }
.as-bubble p { margin: 0; }
.as-bubble p + p { margin-top: 8px; }


.as-aph { position: relative; padding: 6px 2px 2px 6px; }
.as-aph::before {
  content: '\201C';                 
  position: absolute; top: -12px; left: -4px;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 2.6rem; line-height: 1;
  color: var(--as-accent); opacity: .32;
  pointer-events: none;
}
.as-aph-text {
  font-style: italic;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--as-text-strong);
}
.as-aph-by {
  margin-top: 9px;
  font-size: .85rem;
  font-weight: 600;
  color: var(--as-accent-2);
  text-align: right;
}


.as-row-card { align-items: flex-start; }

.as-row-card .as-card {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  border-top-left-radius: 4px;
  padding: 16px 16px 18px;
  overflow: hidden;
}
.as-card-loading { padding: 12px 13px; }
.as-card-in { animation: as-fade-in .3s var(--ease); }

.as-card .as-rpt { font-size: .95rem; }


.as-card .as-rpt {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  overflow: visible;
}


.as-card .as-rpt .rpt-section {
  padding: 0 0 14px; margin: 0 0 14px;
  background: none; border: 0; border-radius: 0;
  border-bottom: 1px solid var(--border);
}
.as-card .as-rpt .rpt-section:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: none; }


.as-card .as-rpt p.rpt-text { margin: 0 0 20px; }
.as-card .as-rpt p.rpt-text:last-child { margin-bottom: 0; }
.as-card .as-rpt .rpt-subhead { margin: 36px 0 16px; padding-bottom: 7px; }
.as-card .as-rpt .rpt-text > .rpt-subhead:first-child,
.as-card .as-rpt .rpt-section .rpt-subhead:first-child { margin-top: 8px; }
.as-card .as-rpt .rpt-now-card { margin: 16px 0 24px; }
.as-card .as-rpt .rpt-cal { margin: 16px 0 26px; }
.as-card .as-rpt .rpt-viz-seasonal { margin: 16px 0 24px; }
.as-card .as-rpt .rpt-viz-fwd { margin: 16px 0 22px; padding: 14px 16px 10px; }
.as-card .as-rpt .rpt-sncurve { margin: 16px 0 24px; }
.as-card .as-rpt .rpt-sntbl-scroll { margin: 16px 0 12px; }
.as-card .as-rpt .rpt-sntbl-legend { margin-top: 16px; padding-top: 12px; }
.as-card .as-rpt .rpt-verdict { margin-top: 18px; }

.as-card .yr-ins-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 12px; }

.as-card .as-rpt .as-empty { margin: 0; padding: 4px 0; opacity: .75; }


.as-verdict {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px; padding: 8px 11px;
  border-radius: var(--radius-sm); font-weight: 600;
}
.as-verdict-lbl { font-size: .8rem; color: var(--as-text-dim); text-transform: uppercase; letter-spacing: .04em; }
.as-verdict-val { margin-left: auto; font-size: .95rem; font-weight: 700; }
.as-verdict-pos { background: rgba(31, 175, 99, .12); }  .as-verdict-pos .as-verdict-val { color: #1faf63; }
.as-verdict-neg { background: rgba(224, 64, 94, .12); }  .as-verdict-neg .as-verdict-val { color: #e0405e; }
.as-verdict-neu { background: rgba(192, 138, 46, .12); } .as-verdict-neu .as-verdict-val { color: #c08a2e; }
:root[data-theme="light"] .as-verdict-pos .as-verdict-val { color: #0f9d52; }
:root[data-theme="light"] .as-verdict-neg .as-verdict-val { color: #d12f4d; }
:root[data-theme="light"] .as-verdict-neu .as-verdict-val { color: #a9761f; }


.as-trend-tf {
  margin-top: 12px; padding-top: 10px;
  border-top: 1px solid var(--as-border, rgba(255,255,255,.08));
}
.as-trend-tf-h {
  font-size: .82rem; font-weight: 700; color: var(--as-text-dim);
  text-transform: uppercase; letter-spacing: .04em; margin-bottom: 6px;
}


.as-hist-wrap { margin: 14px 0 6px; }
.as-hist { display: block; width: 100%; height: auto; overflow: visible; }

.as-hist-hc { width: 100%; min-height: 220px; }
.as-hist-hc .highcharts-container, .as-hist-hc svg { border-radius: var(--radius-sm); }
.as-hist-cap { display: flex; gap: 16px; margin-top: 4px; font-size: .82rem; color: var(--as-text-dim); }
.as-hist-cap span { display: inline-flex; align-items: center; }
.as-hist-cap i { width: 11px; height: 11px; border-radius: 2px; margin-right: 6px; }
.as-hist-cap i.as-hist-k-med {
  width: 0; height: 12px; border-radius: 0; background: none !important;
  border-left: 2px dashed var(--as-text-dim);
}


.as-mtf {
  margin-top: 14px; padding-top: 12px;
  border-top: 1px solid var(--as-border, rgba(255,255,255,.08));
}
.as-mtf-h {
  font-size: .82rem; font-weight: 700; color: var(--as-text-dim);
  text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px;
}
.as-mtf-grid { display: flex; flex-direction: column; gap: 5px; }
.as-mtf-row {
  display: grid; grid-template-columns: 2.4em auto 1fr; gap: 9px; align-items: center;
}
.as-mtf-tf { font-weight: 700; font-size: .9rem; color: var(--as-text-dim); }
.as-mtf-badge {
  justify-self: start; padding: 2px 8px; border-radius: var(--radius-sm);
  font-size: .82rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap;
}
.as-mtf-pos { background: rgba(31,175,99,.14); color: #1faf63; }
.as-mtf-neg { background: rgba(224,64,94,.14); color: #e0405e; }
.as-mtf-neu { background: rgba(192,138,46,.14); color: #c08a2e; }
:root[data-theme="light"] .as-mtf-pos { color: #0f9d52; }
:root[data-theme="light"] .as-mtf-neg { color: #d12f4d; }
:root[data-theme="light"] .as-mtf-neu { color: #a9761f; }
.as-mtf-dur { justify-self: end; text-align: right; font-size: .9rem; color: var(--as-text); opacity: .85; }
.as-mtf-sum {
  margin-top: 10px; padding: 7px 11px; border-radius: var(--radius-sm);
  font-size: .9rem; font-weight: 600;
}
.as-mtf-sum-pos { background: rgba(31,175,99,.12); color: #1faf63; }
.as-mtf-sum-neg { background: rgba(224,64,94,.12); color: #e0405e; }
.as-mtf-sum-neu { background: rgba(192,138,46,.12); color: #c08a2e; }
:root[data-theme="light"] .as-mtf-sum-pos { color: #0f9d52; }
:root[data-theme="light"] .as-mtf-sum-neg { color: #d12f4d; }
:root[data-theme="light"] .as-mtf-sum-neu { color: #a9761f; }


.as-card .as-rpt .ddm-ins-metrics {
  grid-template-columns: repeat(2, 1fr) !important;  
  gap: 8px; margin: 0 0 14px;
}
.as-card .as-rpt .ddm-ins-metric {
  padding: 10px 11px; text-align: left;
  background: var(--as-bubble-bg); border: 1px solid var(--as-bubble-border);
  border-radius: var(--radius-md);
}
.as-card .as-rpt .ddm-ins-metric-label {
  font-size: .72rem; letter-spacing: .06em; color: var(--as-text-dim); margin-bottom: 5px;
}
.as-card .as-rpt .ddm-ins-metric-val {
  font-size: 1.15rem; font-weight: 700; line-height: 1.1;
  color: var(--as-text); font-variant-numeric: tabular-nums;
}
.as-card .as-rpt .ws-ai-note { margin: 0 0 16px; }
.as-card .as-rpt .ddm-ins-prose { font-size: .95rem; line-height: 1.6; margin: 0 0 12px; }
.as-card .as-rpt .ddm-ins-prose:last-child { margin-bottom: 0; }

.as-card .as-rpt .ddm-ins-summary {
  margin: 4px 0 0; overflow-x: auto;
  background: var(--as-bubble-bg); border: 1px solid var(--as-bubble-border);
  border-radius: var(--radius-md);
}
.as-card .as-rpt .dd-rec-tbl { width: 100%; border-collapse: collapse; font-size: .88rem; }
.as-card .as-rpt .dd-rec-tbl th {
  text-align: right; padding: 11px 12px 7px; white-space: nowrap;
  font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--as-text-dim); border-bottom: 1px solid var(--as-bubble-border);
}
.as-card .as-rpt .dd-rec-tbl td {
  text-align: right; padding: 9px 12px; white-space: nowrap;
  color: var(--as-text); font-variant-numeric: tabular-nums;
  border-bottom: 1px solid var(--as-bubble-border);
}
.as-card .as-rpt .dd-rec-tbl th:first-child,
.as-card .as-rpt .dd-rec-tbl td:first-child { text-align: left; font-weight: 700; }
.as-card .as-rpt .dd-rec-tbl tbody tr:last-child td { border-bottom: none; }




.as-opt.as-back2q {
  margin-top: 6px;
  background: rgba(124, 140, 255, .13);
  border: 1px solid var(--as-accent);
  box-shadow: none;
}
.as-opt.as-back2q:hover {
  background: rgba(124, 140, 255, .24);
  border-color: var(--as-accent-2);
}
.as-opt.as-back2q .as-opt-ico {
  background: transparent;
  color: var(--as-text-strong);
  width: 30px; height: 30px;
}
.as-opt.as-back2q .as-opt-ico svg {
  width: 20px; height: 20px;
  fill: currentColor; stroke: currentColor;
}
.as-opt.as-back2q .as-opt-label {
  font-weight: 600;
  font-size: .94rem;
  color: var(--as-text-strong);
}


.as-caret {
  display: inline-block;
  width: 2px;
  height: 1em;
  margin-left: 1px;
  background: var(--as-accent-2);
  vertical-align: text-bottom;
  animation: as-blink 1s step-end infinite;
}
@keyframes as-blink { 50% { opacity: 0; } }


.as-dots { display: inline-flex; gap: 4px; padding: 3px 2px; }
.as-dots span {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--as-dot);
  animation: as-dot 1.2s infinite ease-in-out both;
}
.as-dots span:nth-child(2) { animation-delay: .18s; }
.as-dots span:nth-child(3) { animation-delay: .36s; }
@keyframes as-dot {
  0%, 80%, 100% { transform: translateY(0); opacity: .35; }
  40% { transform: translateY(-4px); opacity: 1; }
}


.as-opts {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 2px 0 4px 35px; 
}
.as-opt {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  text-align: left;
  padding: 11px 13px;
  font-family: var(--font-ui);
  background: var(--as-bubble-bg);
  border: 1px solid var(--as-bubble-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  color: var(--as-text);
  text-decoration: none;   
  opacity: 0;
  transform: translateY(7px);
  transition: background var(--ease), border-color var(--ease), transform var(--ease), opacity var(--ease);
}
.as-opt.as-in { opacity: 1; transform: translateY(0); }
.as-opt:hover { background: var(--as-hover); border-color: var(--as-accent); }
.as-opt:active { transform: scale(.985); }
.as-opt:disabled { cursor: default; opacity: .4; pointer-events: none; }

.as-opt-ico {
  width: 30px; height: 30px;
  flex: 0 0 auto;
  border-radius: var(--radius-sm);
  display: flex; align-items: center; justify-content: center;
  color: var(--as-accent-2);
  background: rgba(85, 102, 240, .12);
}
.as-opt-ico svg { width: 17px; height: 17px; }
.as-opt-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.as-opt-label { font-size: .92rem; font-weight: 500; line-height: 1.25; color: var(--as-text); }
.as-opt-sub { font-size: .82rem; color: var(--as-text-dim); line-height: 1.25; }
.as-opt-chev { color: var(--as-text-dim); font-size: 1.1rem; flex: 0 0 auto; }




.as-opt-back { background: transparent; border-style: dashed; }
.as-opt-back .as-opt-ico { background: transparent; color: var(--as-text-dim); }
.as-opt-back .as-opt-label { color: var(--as-text-dim); }
.as-opt-back:hover .as-opt-label { color: var(--as-text); }


.as-cont-label {
  margin: 6px 0 -4px 35px;
  font-size: .8rem;
  font-weight: 600;
  color: var(--as-text-dim);
  letter-spacing: .01em;
}


.as-opt-leaf .as-opt-ico { background: rgba(47, 127, 224, .1); }


.as-opts.as-opts-row {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
  margin-left: 0;
}
.as-opts-row .as-opt.as-cta {
  width: auto;
  flex: 1 1 190px;
  min-width: 0;
  padding: 8px 12px;
}

.as-opt.as-cta .as-opt-ico { width: 24px; height: 24px; }
.as-opt.as-cta .as-opt-ico svg { width: 14px; height: 14px; }
.as-opt.as-cta .as-opt-label { font-size: .86rem; }
.as-opt.as-cta .as-opt-chev { font-size: 1rem; }
.as-opt.as-cta {
  background: var(--as-grad);
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(85, 102, 240, .28);
}
.as-opt.as-cta .as-opt-label { color: #fff; font-weight: 600; }
.as-opt.as-cta .as-opt-sub { color: rgba(255, 255, 255, .78); }
.as-opt.as-cta .as-opt-ico { background: rgba(255, 255, 255, .18); color: #fff; }
.as-opt.as-cta .as-opt-ico svg { fill: #fff; stroke: #fff; }
.as-opt.as-cta .as-opt-chev { color: #fff; opacity: .9; font-weight: 700; }
.as-opt.as-cta:hover {
  background: var(--as-grad);
  border-color: rgba(255, 255, 255, .55);
  filter: brightness(1.08);
}


.as-foot { flex: 0 0 auto; padding: 10px 16px 14px; border-top: 1px solid var(--as-bubble-border); }
.as-teaser {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 10px 12px;
  font-family: var(--font-ui);
  font-size: .86rem;
  color: var(--as-text);
  background: linear-gradient(135deg, rgba(85, 102, 240, .12), rgba(47, 127, 224, .08));
  border: 1px solid rgba(85, 102, 240, .3);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: border-color var(--ease), background var(--ease);
}
.as-teaser:hover { border-color: var(--as-accent); background: linear-gradient(135deg, rgba(85, 102, 240, .2), rgba(47, 127, 224, .14)); }
.as-teaser-star { display: inline-flex; color: var(--as-accent); }
.as-teaser-star svg { width: 15px; height: 15px; }
.as-teaser-soon {
  margin-left: auto;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--as-accent-2);
  background: rgba(47, 127, 224, .12);
  padding: 2px 7px;
  border-radius: 999px;
}

@keyframes as-fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }


.rsb-icon-as.active svg .as-spark,
.rsb-icon-as:hover svg .as-spark { fill: var(--as-accent-2); }


.as-fab {
  position: fixed;
  bottom: 22px;
  right: calc(var(--rsb-strip-w, 48px) + 16px);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  z-index: 90;
  background: var(--as-grad);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(85, 102, 240, .4), 0 0 0 1px rgba(255, 255, 255, .1) inset;
  transition: transform .18s var(--ease), opacity .18s var(--ease), box-shadow .18s var(--ease);
}
.as-fab svg { width: 22px; height: 22px; fill: #fff; stroke: #fff; position: relative; z-index: 1; }
.as-fab:hover { transform: translateY(-2px) scale(1.05); box-shadow: 0 10px 26px rgba(85, 102, 240, .5); }
.as-fab:active { transform: scale(.96); }
.as-fab-hidden { opacity: 0; pointer-events: none; transform: scale(.6); }
.as-fab-glow {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  background: var(--as-grad);
  opacity: .55;
  z-index: 0;
  animation: as-fab-pulse 2.6s ease-out infinite;
}
@keyframes as-fab-pulse {
  0% { transform: scale(.85); opacity: .5; }
  70% { transform: scale(1.5); opacity: 0; }
  100% { transform: scale(1.5); opacity: 0; }
}


@media (prefers-reduced-motion: reduce) {
  .as-row, .as-opt, .as-dots span, .as-caret, .as-fab-glow { animation: none !important; }
  .as-opt { transition: background var(--ease), border-color var(--ease); }
  .as-stream { scroll-behavior: auto; }
}




:root[data-theme="light"] { color-scheme: light; }



:root[data-theme="light"] .stm-ai-header,
:root[data-theme="light"] .rpt-ai-header,
:root[data-theme="light"] .dd-ai-header {
  background:
    linear-gradient(135deg, rgba(109, 40, 217, .14) 0%, rgba(79, 70, 229, .10) 45%, rgba(37, 99, 235, .08) 100%),
    radial-gradient(120% 140% at 0% 0%, rgba(167, 139, 250, .12), transparent 60%);
  border-bottom-color: rgba(124, 58, 237, .22);
}
:root[data-theme="light"] .stm-ai-header::after,
:root[data-theme="light"] .rpt-ai-header::after,
:root[data-theme="light"] .dd-ai-header::after {
  background: linear-gradient(90deg, transparent, rgba(124, 58, 237, .5), transparent);
}

:root[data-theme="light"] .stm-ai-title,
:root[data-theme="light"] .rpt-ai-title,
:root[data-theme="light"] .dd-ai-title {
  background: linear-gradient(135deg, #6d28d9 0%, #4f46e5 45%, #2563eb 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

:root[data-theme="light"] .stm-ai-sub,
:root[data-theme="light"] .rpt-ai-sub,
:root[data-theme="light"] .dd-ai-sub {
  color: rgba(79, 70, 229, .82);
}

:root[data-theme="light"] .stm-ai-stars,
:root[data-theme="light"] .stm-ai-stars .stm-star-big,
:root[data-theme="light"] .stm-ai-stars .stm-star-small,
:root[data-theme="light"] .rpt-ai-stars,
:root[data-theme="light"] .rpt-ai-stars path,
:root[data-theme="light"] .dd-ai-stars,
:root[data-theme="light"] .dd-ai-stars path {
  fill: #6d28d9;
}
:root[data-theme="light"] .stm-ai-stars .stm-star-big,
:root[data-theme="light"] .stm-ai-stars .stm-star-small {
  filter: drop-shadow(0 0 3px rgba(109, 40, 217, .35));
}


:root[data-theme="light"] .ai-typing-dot,
:root[data-theme="light"] .stm-ai-loading-dot { color: #6d28d9; }


:root[data-theme="light"] .aiTt-star {
  fill: #7c3aed;
  filter: drop-shadow(0 0 6px rgba(124, 58, 237, .35))
          drop-shadow(0 0 14px rgba(197, 165, 101, .25));
}
:root[data-theme="light"] .aiTt-label { color: var(--text-bright); }


:root[data-theme="light"] .rsb-icon-ai { color: #7c3aed; }
:root[data-theme="light"] .rsb-icon-ai:hover { color: #6d28d9; }
:root[data-theme="light"] .rsb-icon-ai.active {
  color: #5b21b6;
  background: rgba(124, 58, 237, .12);
}
:root[data-theme="light"] .rsb-icon-ai.active:hover {
  color: #6d28d9;
  background: var(--panel);
}


:root[data-theme="light"] body {
  color: var(--text);
}


:root[data-theme="light"] .rsb-panel.open,
:root[data-theme="light"] .cycles-panel,
:root[data-theme="light"] .seasonality-panel,
:root[data-theme="light"] .stats-panel {
  box-shadow: -2px 0 8px rgba(15, 23, 42, .06);
}


:root[data-theme="light"] .tb-group-panel .tb-btn:hover span {
  color: var(--text-bright);
}


:root[data-theme="light"] #chartLogo span {
  color: #C5A565;
}
:root[data-theme="light"] #chartLogo img {
  filter: brightness(0) saturate(100%)
          invert(69%) sepia(22%) saturate(716%)
          hue-rotate(358deg) brightness(93%) contrast(86%);
}


:root[data-theme="light"] .wl-item,
:root[data-theme="light"] .wl-screener-item {
  border-bottom-color: rgba(15, 23, 42, .06);
}


:root[data-theme="light"] .stm-canvas-wrap,
:root[data-theme="light"] .stm-canvas-section .stm-canvas-wrap,
:root[data-theme="light"] .ddm-card,
:root[data-theme="light"] .cot-chart-area,
:root[data-theme="light"] .cot-chart-wrap {
  background: var(--card);
}
:root[data-theme="light"] .ddm-card {
  border-color: var(--border);
}


:root[data-theme="light"] .stm-ret-controls {
  box-shadow: 0 8px 14px -4px rgba(15, 23, 42, .10);
}

:root[data-theme="light"] .stm-rethist-bin .stm-ret-custom-input {
  background: rgba(255, 255, 255, .82);
}

:root[data-theme="light"] .yr-field select option {
  background-color: #ffffff !important;
  color: #1f2937 !important;
}
:root[data-theme="light"] .yr-field select option:checked {
  background: #e5e7eb !important;
  color: #111827 !important;
}


:root[data-theme="light"] .stm-modal-body,
:root[data-theme="light"] .sn-dash-body,
:root[data-theme="light"] .cy-dash-body,
:root[data-theme="light"] .stm-modal-content,
:root[data-theme="light"] .ddm-body,
:root[data-theme="light"] .stm-body {
  background: var(--panel);
}


:root[data-theme="light"] .lwc-watermark text,
:root[data-theme="light"] g.tv-lightweight-charts text[fill^="rgba(255"] {
  fill: rgba(0, 0, 0, .045) !important;
}


:root[data-theme="light"] .inst-fund-card,
:root[data-theme="light"] .inst-stat-card,
:root[data-theme="light"] .stealth-hero-card,
:root[data-theme="light"] .stealth-detail-card,
:root[data-theme="light"] .sector-trend-card,
:root[data-theme="light"] .ov-card,
:root[data-theme="light"] .overview-card,
:root[data-theme="light"] .cp-card,
:root[data-theme="light"] .cot-chat-widget,
:root[data-theme="light"] .stm-canvas-wrap,
:root[data-theme="light"] .stm-action-box,
:root[data-theme="light"] .cy-card,
:root[data-theme="light"] .sn-card,
:root[data-theme="light"] .pc-card,
:root[data-theme="light"] .rpt-section,
:root[data-theme="light"] .stats-card,
:root[data-theme="light"] .breadth-insight-panel,
:root[data-theme="light"] .ai-chat-container {
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08),
              0 1px 2px rgba(0, 0, 0, .04);
}


:root[data-theme="light"] .sn-glass,
:root[data-theme="light"] .cy-glass,
:root[data-theme="light"] .st-glass {
  background: var(--card);
  border-color: var(--border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06),
              0 1px 2px rgba(0, 0, 0, .03);
}


:root[data-theme="light"] .cy-range {
  background: #e5e7eb;
}
:root[data-theme="light"] .cy-range::-webkit-slider-thumb {
  background: #C5A565;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}
:root[data-theme="light"] .cy-range::-moz-range-thumb {
  background: #C5A565;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}


:root[data-theme="light"] .sn-slider-handle {
  background: #ffffff;
  border: 2px solid #C5A565;
  box-shadow: 0 2px 6px rgba(15, 23, 42, .18);
}


:root[data-theme="light"] .sn-v-chip.active {
  background: #C5A565;
  border-color: #C5A565;
  color: #ffffff;
}
:root[data-theme="light"] .sn-v-chip:hover {
  background: rgba(197, 165, 101, .12);
  border-color: rgba(197, 165, 101, .4);
}


:root[data-theme="light"] .sn-dash-chart-top,
:root[data-theme="light"] .sn-dash-chart,
:root[data-theme="light"] .sn-dash-bt-area,
:root[data-theme="light"] .sn-dash-bt-body,
:root[data-theme="light"] .sn-dash-bt-chart,
:root[data-theme="light"] .sn-bt-chart-wrap,
:root[data-theme="light"] .sn-bt-chart,
:root[data-theme="light"] .cy-dash-chart-top,
:root[data-theme="light"] .cy-dash-chart,
:root[data-theme="light"] .cy-dash-bt-area,
:root[data-theme="light"] .cy-dash-bt-body,
:root[data-theme="light"] .cy-dash-bt-chart,
:root[data-theme="light"] .cy-bt-chart-wrap,
:root[data-theme="light"] .cy-bt-chart,
:root[data-theme="light"] .cot-chart-area,
:root[data-theme="light"] .cot-chart-wrap,
:root[data-theme="light"] .opt-chart-wrap,
:root[data-theme="light"] .pc-chart-wrap,
:root[data-theme="light"] .sp-chart-wrap,
:root[data-theme="light"] .dd-chart-wrap,
:root[data-theme="light"] .stm-chart-wrap {
  background: #ffffff;
}


:root[data-theme="light"] .sn-dash-chart-header,
:root[data-theme="light"] .sn-dash-bt-header,
:root[data-theme="light"] .cy-dash-chart-header,
:root[data-theme="light"] .cy-dash-bt-header {
  background: #ffffff;
}


:root[data-theme="light"] .sn-dash-bt-tooltip,
:root[data-theme="light"] .cy-dash-bt-tooltip {
  background: rgba(255, 255, 255, .98);
  border-color: rgba(15, 23, 42, .12);
  color: var(--text-bright);
  box-shadow: 0 4px 14px rgba(15, 23, 42, .12);
}


:root[data-theme="light"] .sn-settings-pop {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .14),
              0 2px 6px rgba(15, 23, 42, .08) !important;
}
:root[data-theme="light"] .sn-pop-row {
  border-bottom-color: #e5e7eb !important;
}
:root[data-theme="light"] .sn-pop-row span {
  color: #111827 !important;
  font-weight: 600;
}

:root[data-theme="light"] .sn-ios-toggle {
  background: #cbd5e1 !important;
}
:root[data-theme="light"] .sn-ios-toggle.on {
  background: #16a34a !important;
}
:root[data-theme="light"] .sn-ios-toggle::after {
  box-shadow: 0 1px 3px rgba(15, 23, 42, .25) !important;
}


:root[data-theme="light"] .sn-dash-gear-popup {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .14),
              0 2px 6px rgba(15, 23, 42, .08) !important;
}
:root[data-theme="light"] .sn-dash-gear-row {
  color: #111827 !important;
  font-weight: 600;
}
:root[data-theme="light"] .sn-dash-gear-row + .sn-dash-gear-row {
  border-top-color: #e5e7eb !important;
}


:root[data-theme="light"] .cy-ios-toggle {
  background: #cbd5e1 !important;
}
:root[data-theme="light"] .cy-ios-toggle.on {
  background: #16a34a !important;
}
:root[data-theme="light"] .cy-ios-toggle::after {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .25) !important;
}


:root[data-theme="light"] .inst-fund-card:hover {
  background: #ffffff;
  border-color: var(--border-hi);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .10),
              0 2px 4px rgba(0, 0, 0, .06);
  transform: translateY(-1px);
  transition: box-shadow var(--ease), transform var(--ease), border-color var(--ease);
}


:root[data-theme="light"] .sn-yl-bar-track {
  background: #e5e7eb;
}
:root[data-theme="light"] .sn-yl-row:hover {
  background: #f3f4f6;
}
:root[data-theme="light"] .sn-yl-row.pinned {
  background: rgba(197, 165, 101, .14);
}


:root[data-theme="light"] .sn-yl-cb {
  border-color: var(--border-hi);
}
:root[data-theme="light"] .sn-yl-cb.on {
  border-color: var(--text-bright);
}
:root[data-theme="light"] .sn-yl-cb.on::after {
  border-color: var(--text-bright);
}

:root[data-theme="light"] .sn-yp-cb {
  accent-color: var(--text-bright);
}


:root[data-theme="light"] .stealth-bar-track,
:root[data-theme="light"] .st-bar-track,
:root[data-theme="light"] .cp-analyst-bar-track,
:root[data-theme="light"] .dd-bar-track {
  background: #e5e7eb;
}




:root[data-theme="light"] .cy-dash-sb-tabs,
:root[data-theme="light"] .sn-dash-sb-tabs,
:root[data-theme="light"] .sn-bp-mode-wrap,
:root[data-theme="light"] .sn-bp-toggle-wrap {
  background: #e5e7eb;
  border-color: #d1d5db;
}


:root[data-theme="light"] .cy-dash-sb-pill,
:root[data-theme="light"] .sn-dash-sb-pill {
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1),
              0 1px 3px rgba(0, 0, 0, .06);
}


:root[data-theme="light"] .cy-dash-sb-tab.active,
:root[data-theme="light"] .sn-dash-sb-tab.active,
:root[data-theme="light"] .sn-bp-toggle.active {
  color: var(--text-bright);
}
:root[data-theme="light"] .sn-bp-toggle.active {
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .08),
              0 1px 3px rgba(0, 0, 0, .05);
}


:root[data-theme="light"] .sn-bp-toggle.sn-bp-toggle-bull.active {
  background: rgba(22, 163, 74, .16);
  color: #15803d;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}
:root[data-theme="light"] .sn-bp-toggle.sn-bp-toggle-bear.active {
  background: rgba(220, 38, 38, .14);
  color: #b91c1c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}


:root[data-theme="light"] .sn-bp-mode.active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, .12),
              0 1px 2px rgba(0, 0, 0, .06);
}


:root[data-theme="light"] .cy-dash-sb-tab:hover,
:root[data-theme="light"] .sn-dash-sb-tab:hover,
:root[data-theme="light"] .sn-bp-mode:hover,
:root[data-theme="light"] .sn-bp-toggle:hover {
  color: var(--text-bright);
}


:root[data-theme="light"] .ipo-seg {
  background: #e5e7eb;
  border-color: #d1d5db;
}
:root[data-theme="light"] .ipo-seg button { color: #5b6170; }
:root[data-theme="light"] .ipo-seg button:hover { color: var(--text-bright); }
:root[data-theme="light"] .ipo-seg button.active {
  background: #ffffff;
  color: var(--text-bright);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .08), 0 1px 3px rgba(0, 0, 0, .05);
}


:root[data-theme="light"] .sn-bp-container {
  background: #f3f4f6;
  border-color: #e5e7eb;
}
:root[data-theme="light"] .sn-bp-settings-card {
  background: #ffffff;
  border-color: var(--border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06),
              0 1px 2px rgba(0, 0, 0, .03);
}
:root[data-theme="light"] .sn-bp-card {
  background: #ffffff;
  border-color: var(--border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06),
              0 1px 2px rgba(0, 0, 0, .03);
}
:root[data-theme="light"] .sn-bp-card:hover {
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .08),
              0 1px 3px rgba(0, 0, 0, .04);
}
:root[data-theme="light"] .sn-bp-card.sn-bp-active {
  background: rgba(197, 165, 101, .08);
  border-color: rgba(197, 165, 101, .5);
}


:root[data-theme="light"] .cot-dropdown-btn,
:root[data-theme="light"] .cot-report-select,
:root[data-theme="light"] .cot-source-tabs {
  background: #f3f4f6;
  border-color: #e5e7eb;
}


:root[data-theme="light"] .sn-bp-mode-wrap,
:root[data-theme="light"] .sn-bp-toggle-wrap,
:root[data-theme="light"] .cy-dash-sb-tabs {
  box-shadow: inset 0 0 0 1px #e5e7eb;
}


:root[data-theme="light"] .scr-land-card-ai {
  background: linear-gradient(135deg, #a78bfa, #8b5cf6, #c084fc, #a855f7, #a78bfa) !important;
  background-size: 300% 300% !important;
  border-color: rgba(139, 92, 246, .35) !important;
}
:root[data-theme="light"] .scr-land-card-ai:hover {
  border-color: rgba(124, 58, 237, .55) !important;
}
:root[data-theme="light"] .scr-land-card-ai .scr-land-card-title,
:root[data-theme="light"] .scr-land-card-ai .scr-land-card-desc {
  color: #ffffff;
}
:root[data-theme="light"] .scr-land-card-ai .scr-land-card-desc {
  color: rgba(255, 255, 255, .85);
}
:root[data-theme="light"] .scr-land-icon-ai {
  background: rgba(255, 255, 255, .22) !important;
  border-color: rgba(255, 255, 255, .35) !important;
}

@keyframes scr-ai-glow-light {
  0%, 100% { box-shadow: 0 4px 14px rgba(139, 92, 246, .22), 0 2px 6px rgba(109, 40, 217, .1); }
  50%      { box-shadow: 0 6px 20px rgba(168, 85, 247, .32), 0 3px 10px rgba(139, 92, 246, .14); }
}
:root[data-theme="light"] .scr-land-card-ai {
  animation: scr-ai-gradient 5s ease infinite, scr-ai-glow-light 3s ease-in-out infinite;
}


:root[data-theme="light"] .sn-dash-filter-menu {
  background: #ffffff;
  border-color: #e5e7eb;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .14),
              0 2px 6px rgba(15, 23, 42, .08);
}
:root[data-theme="light"] .sn-dash-fm-item:hover {
  background: #f3f4f6;
  color: var(--text-bright);
}
:root[data-theme="light"] .sn-dash-fm-group + .sn-dash-fm-group {
  border-top-color: #e5e7eb;
}


:root[data-theme="light"] .sn-bt-oos-zone-label {
  color: rgba(15, 23, 42, .42);
}
:root[data-theme="light"] .sn-bt-oos-zone-label-oos {
  color: rgba(180, 83, 9, .9);
}

:root[data-theme="light"] .sn-bt-oos-line {
  border-left-color: rgba(217, 119, 6, .7);
}




:root[data-theme="light"] .stm-ret-select {
  background-color: var(--card);
  border-color: var(--border-hi);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 4l3 3 3-3' fill='none' stroke='%231f2937' stroke-opacity='0.85' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
:root[data-theme="light"] .stm-ret-select:hover { border-color: var(--text-dim); }
:root[data-theme="light"] .stm-ret-select option {
  background-color: #ffffff !important;
  color: #1f2937 !important;
}


:root[data-theme="light"] .st-compute-select {
  background-color: var(--card);
  border-color: var(--border-hi);
  color: var(--text-bright);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 4l3 3 3-3' fill='none' stroke='%231f2937' stroke-opacity='0.85' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
:root[data-theme="light"] .st-compute-select:hover,
:root[data-theme="light"] .st-compute-select:focus {
  background-color: var(--card);
  border-color: var(--text-dim);
}
:root[data-theme="light"] .st-compute-select option {
  background-color: #ffffff !important;
  color: #1f2937 !important;
}


:root[data-theme="light"] .yr-ins-card {
  background: var(--card);
  border-color: var(--border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);
}
:root[data-theme="light"] .yr-ins-card.yr-ins-hero {
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(34, 197, 94, .10), transparent 55%),
    var(--card);
}

:root[data-theme="light"] .yr-ins-narrative { border-top-color: var(--border); }


:root[data-theme="light"] .ws-ov-expand-btn {
  color: #8a6a1c;
  border-color: rgba(150, 112, 30, .55);
  background: linear-gradient(120deg, rgba(201, 162, 79, .20), rgba(201, 162, 79, .08));
}
:root[data-theme="light"] .ws-ov-expand-btn:hover {
  color: #6f5414;
  border-color: rgba(150, 112, 30, .85);
  background: linear-gradient(120deg, rgba(201, 162, 79, .30), rgba(201, 162, 79, .14));
}


:root[data-theme="light"] .stm-card,
:root[data-theme="light"] .stm-ret-fwd-card,
:root[data-theme="light"] .ws-chart-card {
  background: var(--card);
  border-color: var(--border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);
}

:root[data-theme="light"] .stm-ret-lwc-wrap {
  background: var(--card);
}


:root[data-theme="light"] .yr-perf-strip,
:root[data-theme="light"] .yr-panel,
:root[data-theme="light"] .yr-form {
  background: var(--card);
  border-color: var(--border);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);
}

:root[data-theme="light"] .yr-answer {
  background: radial-gradient(120% 100% at 0% 0%, rgba(38, 217, 127, .10), transparent 55%), var(--card);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);
}
:root[data-theme="light"] .yr-answer-neu {
  background: radial-gradient(120% 100% at 0% 0%, rgba(201, 162, 93, .12), transparent 55%), var(--card);
}
:root[data-theme="light"] .yr-answer-neg {
  background: radial-gradient(120% 100% at 0% 0%, rgba(240, 80, 110, .10), transparent 55%), var(--card);
}

:root[data-theme="light"] .yr-field select,
:root[data-theme="light"] .yr-input {
  background: #ffffff;
  border-color: var(--border-hi);
  color: var(--text-bright);
}
:root[data-theme="light"] .yr-field select:focus,
:root[data-theme="light"] .yr-input:focus,
:root[data-theme="light"] .yr-field select:hover,
:root[data-theme="light"] .yr-input:hover {
  background: #ffffff;
  border-color: var(--text-dim);
}




:root[data-theme="light"] .sn-bp-modal {
  background: #ffffff;
  border-color: var(--surface-border, #e2e5ee);
  box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
}
:root[data-theme="light"] .sn-bp-modal-cancel {
  background: var(--surface-raised, #eef0f6);
  color: var(--text-muted);
}
:root[data-theme="light"] .sn-bp-modal-cancel:hover {
  background: var(--surface-border, #e2e5ee);
  color: var(--text);
}