/* VS Code Dark+: dark glass surfaces and blue focus accents. */
.prediction-refresh-toolbar {
  padding: 14px 16px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}
.prediction-refresh-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; }
.prediction-refresh-actions button { min-height: 44px; margin: 0; }
.prediction-refresh-actions .hint { margin: 0; overflow-wrap: anywhere; }
.prediction-task-refresh-status { margin: 10px 0 0; overflow-wrap: anywhere; }
:root {
  color-scheme: dark;
  --bg: #1e1e1e; --panel: #252526; --panel2: #2d2d30; --panel3: #333333;
  --line: #3c3c3c; --line2: #555555;
  --text: #d4d4d4; --text2: #cccccc; --muted: #a6a6a6;
  --accent: #4fc1ff; --accent2: #75beff; --accent-bg: #094771;
  --up: #f48771; --down: #89d185; --flat: #dcdcaa;
  --low: #89d185; --mid: #dcdcaa; --high: #f48771;
  --button: #0e639c; --button-hover: #1177bb; --selection: #37373d;
  --anime-shadow: none;
  --glass-surface: rgba(37, 37, 42, .74);
  --glass-raised: rgba(45, 45, 50, .6);
  --glass-chrome: rgba(35, 35, 40, .82);
  --glass-overlay: rgba(37, 37, 42, .92);
  --glass-line: rgba(198, 220, 255, .14);
  --glass-shadow: inset 0 1px 0 rgba(255, 255, 255, .045), 0 8px 28px rgba(0, 0, 0, .14);
}
html { background: var(--bg); scrollbar-color: #686868 var(--bg); }
body {
  background: radial-gradient(ellipse at 88% 8%, #18435c 0, transparent 48%),
    radial-gradient(ellipse at 8% 68%, #303047 0, transparent 48%), var(--bg);
  background-attachment: fixed;
  color: var(--text);
}
::selection { color: #ffffff; background: #264f78; }
body::before { background: var(--panel); border-right-color: var(--line); }
header { background: #333333; border-bottom-color: var(--line); }
.brand .logo { border-color: var(--line2); box-shadow: none; }
.brand-name, .workspace-title b, .status .st b { color: var(--text); }
.brand-si { color: var(--accent); }
.brand-caption, .workspace-title, .workspace-title small, .nav-group,
.nav-group > span, .nav-code, nav a.active .nav-code { color: var(--muted); }
.workspace-divider { color: var(--line2); }
.workspace-dot, .signal-dot { background: var(--accent); box-shadow: 0 0 0 4px #4fc1ff14; }
nav { scrollbar-color: #686868 transparent; }
nav a, nav a:first-child { color: var(--text2); }
nav a:hover { color: #ffffff; background: #2a2d2e; }
nav a.active { color: #ffffff; border-color: #094771; background: #37373d; box-shadow: inset 2px 0 #007acc; }
.nav-icon, nav a.active .nav-icon { color: inherit; }
.pill.idle { color: var(--down); border-color: #476141; background: #253327; }
.pill.run { color: var(--mid); border-color: #625d3e; background: #353426; }
.vip-badge { color: #dcdcaa; border-color: #625d3e; background: #353426; }
#account-open, .vis-mini { color: var(--text2); border-color: var(--line); background: var(--panel); box-shadow: none; }
.vis-mini:hover { border-color: var(--line2); }
.vis-mini .vm-cum b { color: var(--text); }
.page-head, .page-head.home { background: var(--panel); border-color: var(--line); box-shadow: none; }
.page-head h1, .page-head.home h1 { color: #eeeeee; }
.page-head p, .page-head.home p { color: var(--text2); }
.page-head .page-eyebrow, .page-head.home .page-eyebrow, .eyebrow-index,
.eyebrow, .hero-facts small { color: var(--muted); }
.page-head.home .hero-facts { border-top-color: var(--line); }
.hero-facts b { color: var(--text); }
.card, .mkt .card, a.dg, .membership-gate, .evo-lock, .bt-history-figure,
.event-watch, .bt-highlights, .runinfo, .evo-history, .vip-notice, .kpi,
.global-follow-bar, .tts-hero, .tts-principles article { background: var(--panel); border-color: var(--line); box-shadow: none; }
.card h2, .card h3, .sec-title h2, .section-topline h2, .mkt-head h3,
.about .about-title, .cm-head b, .bt-history-figure h3, .bt-history-heading h2,
.dg .dg-head h3, .event-watch h2, .event-watch h3, .event-watch li strong,
.vip-notice h2, .membership-gate h3, .research-note summary b,
.tts-hero h2, .tts-principles h3 { color: var(--text); }
.sec-title h2::before { background: #007acc; }
.section-note, .sec-title > span, .mkt-sub, .mkt-head .sym, .mkt-price .unit,
.dg-head span, .dg-head > span, .dg-more, .event-watch small,
.event-watch .event-market, .event-watch-head > span, .event-meta,
.big > div, .kpi span, .kpi small, .vip-price small, .vip-contact,
.vip-plan-label, .vip-savings, .gate-contact, .gate-contact code,
.gate-plans small, .research-note summary small, .research-note summary em,
.bt-history-heading p, .bt-history-heading > span, .bt-history-controls,
.bt-history-legend, .bt-history-caption, .bt-history-note,
.tts-availability > span, .tts-visual-label, .tts-visual-label > :last-child,
.tts-visual-note, .tts-step, .tts-footer { color: var(--muted); }
.mkt-price .price, .big b, .kpi b, .nm, .dg li .nm, .dg li em,
.cm-body, .meta b, .event-watch li p, .vip-notice p, .tts-principles p,
.gate-plans strong { color: var(--text2); }
.view, .coin .box, .box, .vip-annual, .vip-monthly, .evo-history-row,
#panel-EVOLVE .evo-text, #panel-OPEN .code, .tts-visual { background: var(--panel2); border-color: var(--line); color: var(--text2); box-shadow: none; }
.coin .box h4 { color: var(--muted); }
.research-note, .research-note.prediction-card { background: var(--panel); }
.research-note summary, .strategy-brief summary { color: var(--accent); }
.prediction-time-banner { background: #1c3547; border-color: #31536c; border-left-color: #007acc; color: #9cdcfe; }
.prediction-time-banner strong { color: #c3e8ff; }
.prediction-time-banner strong small, .prediction-time-banner > span:last-child { color: #9cdcfe; }
.prediction-watermark, .page-watermark, .dg .prediction-watermark { color: var(--muted); border-color: var(--line); }
.tablewrap { border-color: var(--line); scrollbar-color: #686868 var(--panel); }
.tablewrap::before { background: var(--panel2); color: var(--muted); }
th { background: var(--panel2); color: var(--text2); }
th, td, .dg li, .event-watch li, .cm-replies, .runinfo .meta + .meta { border-color: var(--line); }
tbody tr:nth-child(even):not(.detail) { background: #28282a; }
tr.row:hover, .prediction-table tr.row:hover > td { background: #2a2d2e; }
tr.detail td { background: var(--bg); color: var(--text2); box-shadow: inset 2px 0 #007acc; }
.rk { background: var(--panel3); color: var(--text2); }
.rk.t1, .rk.t2, .rk.t3 { background: #353426; color: #dcdcaa; }
.conf i { background: var(--line); }
.conf i b { background: #007acc; }
.ag.both { color: #9cdcfe; background: #1c3547; }
.risk.低, .side.做空, .dir.跌 { color: var(--down); background: #253327; }
.risk.中, .dir.震荡 { color: var(--mid); background: #353426; }
.risk.高, .side.做多, .dir.涨 { color: var(--up); background: #3d2b29; }
a.dg:hover, .bt-highlights .bth-result:hover { background: #2a2d2e; border-color: var(--line2); box-shadow: none; }
.event-watch-grid h3 span, .event-watch .event-status { color: #dcdcaa; background: #353426; border-color: #625d3e; }
.event-meta b { color: #ce9178; }
.event-toggle { color: var(--accent) !important; border-color: var(--line2) !important; background: var(--panel2) !important; }
.bt-highlights .bth-result { background: var(--panel2); border-color: var(--line); }
.bt-highlights .bth-title, .bth-main strong { color: #dcdcaa; }
.bth-market, .bth-main small, .bth-metrics, .bth-metrics b, .bth-time { color: var(--text2); }
.bth-head > span, .bth-time span { color: var(--muted); }
button, .button-primary, #panel-OPEN .cta, a.global-x-follow,
.about a.contact-link--follow { color: #ffffff; background: var(--button); border-color: var(--button); box-shadow: none; }
button:hover:not(:disabled):not(.ghost), .button-primary:hover,
#panel-OPEN .cta:hover, a.global-x-follow:hover, .about a.contact-link--follow:hover { color: #ffffff; background: var(--button-hover); border-color: var(--button-hover); box-shadow: none; }
.button-secondary, button.ghost, .about .contact-link { color: var(--text2); background: var(--panel2); border-color: var(--line2); }
.button-secondary:hover, button.ghost:hover:not(:disabled), .about .contact-link:hover { color: #ffffff; background: var(--selection); border-color: var(--line2); }
.toggle, #bt-history-smooth { background: var(--bg); border-color: var(--line); }
.toggle a, #bt-history-smooth button { color: var(--muted); }
.toggle a.active, #bt-history-smooth button[aria-pressed="true"] { color: #ffffff; background: var(--selection); border-color: var(--line2); box-shadow: none; }
.toggle a:hover { color: #ffffff; }
.follow-copy strong, .follow-copy > span { color: var(--text2); }
.follow-mascot { filter: none; }
.gate-icon { color: var(--accent); background: #1c3547; }
.vip-price { color: #9cdcfe; }
.cm-form textarea, .cm-form input, .cm-form select, .tokbox input,
#panel-EVOLVE select, #pl-filters input, #pl-filters select { color: var(--text); background: #3c3c3c; border-color: var(--line2); }
input::placeholder, textarea::placeholder { color: var(--muted); }
input:focus, textarea:focus, select:focus { border-color: #007acc !important; box-shadow: 0 0 0 1px #007acc; }
.cm-act a { color: var(--accent); }
dialog { color: var(--text); background: var(--panel) !important; border-color: var(--line2) !important; box-shadow: 0 24px 80px #00000070; }
dialog::backdrop { background: #00000099; }
.chart .grid-line { stroke: var(--line2); }
.chart .axis-text { fill: var(--muted); }
.chart .tip, .vis-map .tip, .bt-history-tip { color: var(--text2); background: var(--panel2); border-color: var(--line2); box-shadow: 0 8px 24px #00000050; }
.chart .tip .t, .bt-history-tip small { color: var(--muted); }
.bt-history-tip > b { color: var(--text); }
.bt-history-plot > svg { fill: var(--muted); }
.bt-history-plot > svg > rect, .bt-history-plot > svg > circle { fill: var(--panel); }
.bt-history-plot > svg > line { stroke: var(--line); }
.bt-history-plot > svg > path:not([data-history-series]) { stroke: var(--line2); }
.tts-kicker, .tts-description { color: var(--muted); }
.tts-intro { color: var(--text2); }
.tts-copy h2 span, .tts-intro strong, .tts-footer span { color: #9cdcfe; }
.tts-beta { color: #9cdcfe; background: #1c3547; border-color: #31536c; }
.tts-availability button:disabled { color: var(--muted); background: var(--panel2); border-color: var(--line); }
.vis-atlas.card { background: var(--bg); border-color: var(--line); }
.vis-atlas-heading h3 { color: var(--text); }
.vis-atlas .vis-atlas-eyebrow { color: #9cdcfe; }
footer { background: var(--panel); border-top-color: var(--line); }
.foot-brand b, .foot h4 { color: var(--text); }
.foot a, .foot-brand p, .foot-note { color: var(--muted); }
.foot a:hover { color: var(--accent); }
.foot-note { border-top-color: var(--line); }
@media (max-width: 760px) {
  nav { background: var(--panel); border-color: var(--line); box-shadow: 0 12px 35px #00000060; }
  .status { border-top-color: var(--line); }
}

/* Keep opaque surfaces as the fallback for browsers without backdrop blur. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body::before, footer {
    background: var(--glass-chrome);
    border-color: var(--glass-line);
    -webkit-backdrop-filter: blur(20px) saturate(120%);
    backdrop-filter: blur(20px) saturate(120%);
  }
  /* Blur a separate layer: filtering header itself would move its fixed brand/nav. */
  header { background: transparent; border-bottom-color: var(--glass-line); }
  header::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: var(--glass-chrome);
    -webkit-backdrop-filter: blur(20px) saturate(120%);
    backdrop-filter: blur(20px) saturate(120%);
  }
  .page-head, .page-head.home, .card, .mkt .card, a.dg,
  .membership-gate, .evo-lock, .bt-history-figure, .event-watch,
  .bt-highlights, .runinfo, .evo-history, .vip-notice, .kpi,
  .global-follow-bar, .vis-mini, .tts-hero, .tts-principles article {
    background: var(--glass-surface);
    border-color: var(--glass-line);
    box-shadow: var(--glass-shadow);
    -webkit-backdrop-filter: blur(16px) saturate(115%);
    backdrop-filter: blur(16px) saturate(115%);
  }
  .view, .coin .box, .box, .vip-annual, .vip-monthly,
  .evo-history-row, #panel-EVOLVE .evo-text, #panel-OPEN .code,
  .tts-visual, .bt-highlights .bth-result,
  .button-secondary, button.ghost, #account-open, .about .contact-link {
    background: var(--glass-raised);
    border-color: var(--glass-line);
  }
  .research-note, .research-note.prediction-card { background: var(--glass-surface); }
  nav a:hover, a.dg:hover, .bt-highlights .bth-result:hover {
    background: rgba(79, 193, 255, .09);
    border-color: rgba(117, 190, 255, .25);
  }
  nav a.active {
    background: rgba(0, 122, 204, .18);
    border-color: rgba(79, 193, 255, .24);
  }
  dialog, .chart .tip, .vis-map .tip, .bt-history-tip {
    background: var(--glass-overlay) !important;
    border-color: var(--glass-line) !important;
    -webkit-backdrop-filter: blur(24px) saturate(120%);
    backdrop-filter: blur(24px) saturate(120%);
  }
  dialog::backdrop {
    background: rgba(8, 12, 20, .58);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }
  .vis-atlas.card { background: rgba(16, 27, 38, .84); }
  @media (max-width: 760px) {
    nav {
      background: var(--glass-overlay);
      border-color: var(--glass-line);
      -webkit-backdrop-filter: blur(20px);
      backdrop-filter: blur(20px);
    }
  }
}

@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  :root {
    --glass-surface: var(--panel);
    --glass-raised: var(--panel2);
    --glass-chrome: var(--panel);
    --glass-overlay: var(--panel);
    --glass-line: var(--line2);
    --glass-shadow: none;
  }
  body { background: var(--bg); }
  body::before, header::before, footer, .page-head, .page-head.home,
  .card, .mkt .card, a.dg, .membership-gate, .evo-lock,
  .bt-history-figure, .event-watch, .bt-highlights, .runinfo,
  .evo-history, .vip-notice, .kpi, .global-follow-bar, .vis-mini,
  .tts-hero, .tts-principles article, nav, dialog,
  .chart .tip, .vis-map .tip, .bt-history-tip, dialog::backdrop {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .vis-atlas.card { background: var(--bg); }
}