/* ============================================================
   D3 FRAMEWORK — "EVENT HORIZON" design system
   Austere near-black mission-control with a Hawking-gold accent.
   Dark by default; a light variant is available via the toggle.
   Loaded LAST so it governs the palette on every page.
   ============================================================ */

:root, html[data-theme="dark"]{
  --bg:#14110d; --bg2:#1a1610; --surface:#1f1a13; --surface2:#272016; --surface3:#322a1d;
  --panel:#1c1812; --inset:#161209;
  --border:#372e21; --border2:#4a3d2c; --chart-grid:#2e2618;
  --text:#f6efe2; --text2:#c2b6a0; --text3:#8c8068; --text4:#615844;
  --accent:#ff6a2b; --accent2:#e5531f; --accent-hover:#ff7d44;
  --accent-dim:rgba(255,106,43,.15); --accent-bd:rgba(255,106,43,.44); --accent-border:rgba(255,106,43,.44); --accent-light:rgba(255,106,43,.15); --accent-glow:rgba(255,106,43,.48);
  --green:#46cf94; --green-dim:rgba(70,207,148,.14); --green-bd:rgba(70,207,148,.4); --green-border:rgba(70,207,148,.4); --green-light:rgba(70,207,148,.14);
  --amber:#f5b544; --amber-dim:rgba(245,181,68,.14); --amber-bd:rgba(245,181,68,.4); --amber-border:rgba(245,181,68,.4); --amber-light:rgba(245,181,68,.14);
  --red:#fb6f5a; --red-dim:rgba(251,111,90,.14); --red-bd:rgba(251,111,90,.4); --red-border:rgba(251,111,90,.4); --red-light:rgba(251,111,90,.14);
  --cyan:#2dd4bf; --bracket:var(--accent-bd);
  --shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 14px 44px -18px rgba(0,0,0,.72);
  --shadow-lg:0 26px 70px -26px rgba(0,0,0,.82);
}
html[data-theme="light"]{
  --bg:#f5f1e8; --bg2:#efe9dc; --surface:#fffdf8; --surface2:#f3eee2; --surface3:#e9e1d2;
  --panel:#fffdf8; --inset:#f3eee2;
  --border:#e6ddca; --border2:#d3c8b0; --chart-grid:#ece4d4;
  --text:#1a1611; --text2:#5c5446; --text3:#8b8273; --text4:#b3a98f;
  --accent:#c9461a; --accent2:#9a3412; --accent-hover:#dc5526;
  --accent-dim:#fbeae0; --accent-bd:#f1c3a8; --accent-border:#f1c3a8; --accent-light:#fbeae0; --accent-glow:rgba(201,70,26,.18);
  --green:#1a7a52; --green-dim:#e5f2ea; --green-bd:#bbe0cd; --green-border:#bbe0cd; --green-light:#e5f2ea;
  --amber:#9a6a00; --amber-dim:#fbf2dc; --amber-bd:#ead09a; --amber-border:#ead09a; --amber-light:#fbf2dc;
  --red:#b3261e; --red-dim:#fbe9e7; --red-bd:#f1c3bd; --red-border:#f1c3bd; --red-light:#fbe9e7;
  --cyan:#0e7490; --bracket:var(--accent-bd);
  --shadow:0 1px 2px rgba(60,40,20,.05), 0 10px 30px -16px rgba(60,40,20,.14);
  --shadow-lg:0 16px 48px -18px rgba(60,40,20,.2);
}

/* neutralise any leftover cosmic/academic layers */
.plasma-bg,.plasma-stars,.accretion,.hero-grid-deco{display:none!important}

html{scroll-behavior:smooth}
html,body{background-color:var(--bg)!important}
body{background-image:none!important;color:var(--text);
  font-family:'Archivo',system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  transition:background-color .25s,color .25s}
::selection{background:var(--accent);color:#0b0b0b}

/* typography — Instrument Serif display, orange em */
h1,h2,h3,.modal-title,.login-title{font-family:'Instrument Serif',Georgia,serif;letter-spacing:0;color:var(--text);font-weight:400}
h1 em,.hero h1 em{font-style:italic;color:var(--accent);background:none!important;-webkit-text-fill-color:currentColor!important}
/* Instrument Serif runs tall — give hero headline room so it never overlaps the lede */
.hero h1{line-height:1.08!important;margin-bottom:2.4rem!important;padding-bottom:.1em}
.hero .hero-desc,.hero .hero-formula{position:relative;z-index:2}
.kicker,.sec-label,.viz-cap b{color:var(--accent)!important}
.grad-text{background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--accent)!important;animation:none!important}

/* nav */
nav{background:color-mix(in srgb,var(--bg) 86%,transparent)!important;backdrop-filter:blur(12px) saturate(1.4)!important;
  -webkit-backdrop-filter:blur(12px) saturate(1.4)!important;border-bottom:1px solid var(--border)!important;box-shadow:none!important}
.logo,.brand-name{color:var(--text)!important}
.logo span,.logo i,.brand-name span{color:var(--text3)!important}
.logo-mark,.brand-mark svg,.sb-mark svg{color:var(--accent)!important;filter:drop-shadow(0 0 6px var(--accent-glow))!important}
.brand-mark,.sb-mark{background:var(--accent-dim)!important;border:1px solid var(--accent-bd)!important;box-shadow:none!important;animation:none!important}
.nav-links a{color:var(--text2)!important;background:none}
.nav-links a:hover{color:var(--text)!important;background:var(--surface2)!important}
.nav-links a.active,.nav-active{color:var(--accent)!important;font-weight:600;background:none!important}

/* theme toggle button */
.theme-switch{width:34px;height:34px;border-radius:8px;border:1px solid var(--border2);background:var(--surface);
  color:var(--text2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:.15s;flex:none}
.theme-switch:hover{color:var(--accent);border-color:var(--accent)}

/* surfaces — solid mission-control panels (no glass) */
.bench-card,.viz-card,.board-wrap,.papers-wrap,.stat,.statstrip,.metric,.panel,.console,
.result-box,.class-box,.class-detail,.cta,.modal,.feature-card,.plan,.pricing-card,.card,
.glass,.login-panel,.login-box,.ml-card,.ml-ticker,.ml-cost-panel,.narr-panel,.ml-feed,
.stat-card,.rcard,.chart-block,.console-bar,.ctrl-col{
  background:var(--surface)!important;border-color:var(--border)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.panel,.console,.viz-card,.board-wrap,.bench-card,.plan,.pricing-card,.modal,.statstrip{box-shadow:var(--shadow)!important}
.inset,.physics,.hero-formula,.ctrl-col,.console-bar,.panel-head{background:var(--inset)!important}
.sidebar{background:linear-gradient(180deg,var(--surface),var(--bg))!important;border-right:1px solid var(--border)!important;backdrop-filter:none!important}
.topbar{background:var(--surface)!important;border-bottom:1px solid var(--border)!important;backdrop-filter:none!important}

/* buttons — gold primary */
.btn-primary,.run-btn,.btn-run,.login-btn,.nav-cta{
  background:var(--accent)!important;background-image:none!important;color:#0b0b0b!important;border:none!important;
  box-shadow:none!important;animation:none!important;font-weight:600}
.btn-primary:hover,.run-btn:hover,.btn-run:hover,.nav-cta:hover{background:var(--accent-hover)!important;transform:none!important}
.btn-outline,.btn-ghost,.btn-secondary,.preset,.lb-chip,.ts-chip,.theme-toggle{
  background:var(--surface)!important;border:1px solid var(--border2)!important;color:var(--text)!important;backdrop-filter:none!important}
.btn-outline:hover,.btn-ghost:hover,.preset:hover,.lb-chip:hover,.ts-chip:hover{border-color:var(--accent)!important;color:var(--accent)!important;box-shadow:none!important}
.preset.active,.lb-chip.active{background:var(--accent-dim)!important;border-color:var(--accent)!important;color:var(--accent)!important}

/* form fields */
.field input,.field-input,input,select,textarea{background:var(--inset)!important;border-color:var(--border2)!important;color:var(--text)!important}
.field input:focus,.field-input:focus,input:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-dim)!important}

/* sliders */
input[type=range]{background:var(--border2)!important}
input[type=range]::-webkit-slider-thumb{background:var(--accent)!important;border:2px solid var(--surface)!important;box-shadow:0 0 0 1px var(--accent)!important}
input[type=range]::-moz-range-thumb{background:var(--accent)!important;border:2px solid var(--surface)!important}

/* readout / data */
.rcard::before{background:var(--border2)!important;box-shadow:none!important}
.rcard.key::before{background:var(--accent)!important;box-shadow:0 0 10px var(--accent-glow)!important}
.rcard.ok::before{background:var(--green)!important}
.rcard-val{color:var(--text)!important}
.rcard.key .rcard-val{color:var(--accent)!important;text-shadow:0 0 18px var(--accent-glow)!important}
.rcard.ok .rcard-val{color:var(--green)!important}
.ctrl-val{color:var(--accent)!important}

/* tables */
th{color:var(--text3)!important;border-color:var(--border)!important;background:var(--inset)!important}
td{border-color:var(--border)!important;color:var(--text2)!important}
tr:hover td{background:var(--surface2)!important}

/* tabs */
.tab.active{color:var(--accent)!important;border-bottom-color:var(--accent)!important}

/* insights / callouts */
.insight{background:var(--inset)!important;border-color:var(--border)!important;border-left:2px solid var(--accent)!important;color:var(--text2)!important}
.insight.ok{border-left-color:var(--green)!important}.insight.warn{border-left-color:var(--amber)!important}
.insight b{color:var(--text)!important}.insight .mono{color:var(--accent)!important}
.narr-next{background:var(--accent-dim)!important;border-color:var(--accent-bd)!important}
.narr-next-lab{color:var(--accent)!important}

/* badges */
.panel-badge.badge-green,.badge-green{background:var(--green-dim)!important;color:var(--green)!important;border-color:var(--green-bd)!important}
.panel-badge.badge-blue,.badge-blue{background:var(--accent-dim)!important;color:var(--accent)!important;border-color:var(--accent-bd)!important}
.panel-badge.badge-red,.badge-red{background:var(--red-dim)!important;color:var(--red)!important;border-color:var(--red-bd)!important}

/* footer / telemetry */
footer{background:var(--bg2)!important;border-top:1px solid var(--border)!important;backdrop-filter:none!important}
.footer-brand{background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--accent)!important}
.telemetry{background:var(--bg2)!important;border-bottom:1px solid var(--border)!important;color:var(--text2)!important}
.tlm-live{color:var(--green)!important}.tlm-live .dot{background:var(--green)!important;box-shadow:0 0 8px var(--green)!important}
.clock{color:var(--cyan)!important}

/* ── BIGGER CARDS + CLEARER GRAPHS (per request) ───────────── */
.rcard{padding:16px 18px!important;border-radius:12px!important}
.rcard-label{font-size:10.5px!important;margin-bottom:9px!important}
.rcard-val{font-size:20px!important;line-height:1.2!important;font-weight:600!important}
.rcard-unit{font-size:10px!important;margin-top:5px!important}
.stat-card{padding:20px 22px!important;border-radius:14px!important}
.stat-label{font-size:11px!important;margin-bottom:10px!important}
.stat-val{font-size:2.3rem!important;line-height:1.05!important}
.ml-card{padding:16px!important;border-radius:14px!important}
.ml-card-cls{font-size:1.9rem!important}
.ml-card-spark{height:30px!important}
.panel{border-radius:14px!important}
.panel-head{padding:14px 18px!important}
.panel-title{font-size:13.5px!important}
.panel-body{padding:18px!important}
.viz-host{min-height:240px!important}
.chart-block{border-radius:12px!important}
.chart-body{padding:12px 14px 8px!important}
.bench-card,.plan,.pricing-card,.viz-card{padding:1.75rem!important;border-radius:16px!important}
.readout{gap:12px!important}
/* clearer graph type: larger, higher-contrast axis text on SVGs */
svg text{font-size:11px!important}
.viz-host svg text,#chartHeat svg text,.chart-body svg text{fill:var(--text2)!important}
.lb-table td,.data-table td{padding:13px 16px!important;font-size:13.5px!important}
.lb-bar-track{height:10px!important}
@media(max-width:760px){.stat-val{font-size:1.8rem!important}}