/* Token warna dan tipografi Menara Terminal (spesifikasi 5.1). Nilai gelap ditulis dua kali:
   di blok media (prefers-color-scheme) dan di :root[data-theme="dark"]; index.html memuat
   data-theme="dark" sehingga gelap adalah bawaan. Mode candle teal mengganti dua token wash. */
@font-face {
  font-family: "Inter";
  src: url("/vendor/fonts/inter-5.3.0-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("/vendor/fonts/jetbrains-mono-5.3.0-latin-wght-normal.woff2") format("woff2");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;
  --page: #f9f9f7;  --surface-1: #fcfcfb;  --surface-2: #f0efec;  --surface-raised: #ffffff;
  --text-primary: #0b0b0b;  --text-secondary: #52514e;  --text-muted: #898781;
  --grid: #e1e0d9;  --axis: #c3c2b7;
  --border: rgba(11,11,11,.10);  --border-strong: rgba(11,11,11,.18);
  --series-1: #2a78d6;  /* bot: ekuitas, EMA20, drawdown bot, eksposur, bar untung, isi meter */
  --series-2: #eb6834;  /* BTC ditahan (pembanding) saja */
  --series-3: #1baf7a;  /* naik / bid, HANYA pada gaya candle "Teal/merah" */
  --series-8: #e34948;  /* rugi / turun / ask */
  --candle-up-line: #52514e;  --candle-down-fill: #898781;  --volume: rgba(137,135,129,.55);
  --book-bid-wash: rgba(137,135,129,.20);  --book-ask-wash: rgba(137,135,129,.12);
  --delta-up: #006300;  --delta-down: #e34948;          /* ikon panah saja, tidak pernah teks */
  --accent-fill: #256abf;  --accent-on: #ffffff;  --accent-ink: #256abf;  --focus: #2a78d6;
  --wash: rgba(42,120,214,.08);  --wash-strong: rgba(42,120,214,.14);
  --meter-track: #cde2fb;  --diverge-mid: #f0efec;
  --danger-fill: #d03b3b;  --danger-on: #ffffff;
  --status-good: #0ca30c;  --status-warning: #fab219;  --status-serious: #ec835a;  --status-critical: #d03b3b;
  --ramp-100:#cde2fb; --ramp-200:#9ec5f4; --ramp-300:#6da7ec; --ramp-400:#3987e5; --ramp-500:#256abf; --ramp-600:#184f95; --ramp-700:#0d366b;
  --shadow-overlay: 0 8px 24px rgba(11,11,11,.16);
  --radius: 6px;  --radius-chip: 4px;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --page: #0d0d0d;  --surface-1: #1a1a19;  --surface-2: #222221;  --surface-raised: #262625;
    --text-primary: #ffffff;  --text-secondary: #c3c2b7;  --text-muted: #898781;
    --grid: #2c2c2a;  --axis: #383835;
    --border: rgba(255,255,255,.10);  --border-strong: rgba(255,255,255,.18);
    --series-1: #3987e5;  --series-2: #d95926;  --series-3: #199e70;  --series-8: #e66767;
    --candle-up-line: #c3c2b7;  --candle-down-fill: #898781;  --volume: rgba(137,135,129,.55);
    --book-bid-wash: rgba(195,194,183,.16);  --book-ask-wash: rgba(195,194,183,.09);
    --delta-up: #0ca30c;  --delta-down: #e66767;
    --accent-fill: #3987e5;  --accent-on: #0b0b0b;  --accent-ink: #6da7ec;  --focus: #3987e5;
    --wash: rgba(57,135,229,.14);  --wash-strong: rgba(57,135,229,.22);
    --meter-track: #184f95;  --diverge-mid: #383835;
    --shadow-overlay: 0 8px 24px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #0d0d0d;  --surface-1: #1a1a19;  --surface-2: #222221;  --surface-raised: #262625;
  --text-primary: #ffffff;  --text-secondary: #c3c2b7;  --text-muted: #898781;
  --grid: #2c2c2a;  --axis: #383835;
  --border: rgba(255,255,255,.10);  --border-strong: rgba(255,255,255,.18);
  --series-1: #3987e5;  --series-2: #d95926;  --series-3: #199e70;  --series-8: #e66767;
  --candle-up-line: #c3c2b7;  --candle-down-fill: #898781;  --volume: rgba(137,135,129,.55);
  --book-bid-wash: rgba(195,194,183,.16);  --book-ask-wash: rgba(195,194,183,.09);
  --delta-up: #0ca30c;  --delta-down: #e66767;
  --accent-fill: #3987e5;  --accent-on: #0b0b0b;  --accent-ink: #6da7ec;  --focus: #3987e5;
  --wash: rgba(57,135,229,.14);  --wash-strong: rgba(57,135,229,.22);
  --meter-track: #184f95;  --diverge-mid: #383835;
  --shadow-overlay: 0 8px 24px rgba(0,0,0,.5);
}
/* Gaya candle "Teal/merah berongga": wash buku order mengikuti sisi. */
:root[data-candles="teal"] {
  --book-bid-wash: color-mix(in oklab, var(--series-3) 16%, transparent);
  --book-ask-wash: color-mix(in oklab, var(--series-8) 16%, transparent);
}
html, body { background: var(--page); color: var(--text-primary); }