/* The Trader's Desk — design tokens.
   Light is the default; dark via [data-theme="dark"] or the system setting.
   Type scale 12/13/14/16/20/28, spacing scale 4/8/12/16/24/32. One accent
   for the market (indigo), one for the course (amber: every citation), and
   the three trend colours the course uses: up, down, uncertain. */
:root {
  --font-sans: "Inter", ui-sans-serif, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --fs-1: 12px; --fs-2: 13px; --fs-3: 14px; --fs-4: 16px; --fs-5: 20px; --fs-6: 28px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  --radius: 10px; --radius-sm: 6px;

  --bg: #f5f6f8;
  --surface: #ffffff;
  --surface-2: #eef0f4;
  --line: #dfe3ea;
  --line-strong: #c5cbd6;
  --ink: #16191f;
  --ink-2: #4b5260;
  --ink-3: #7b8494;
  --accent: #3b5bdb;
  --accent-soft: #e7ecfb;
  --course: #b7791f;
  --course-soft: #fbf3e3;
  --up: #12805c;  --up-soft: #e3f4ec;
  --down: #c8322b; --down-soft: #fbe6e4;
  --flat: #6b7280; --flat-soft: #eceef2;
  --warn: #b45309;
  --shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 4px 16px rgba(16, 24, 40, .06);
  --chart-bg: #ffffff; --chart-grid: #eef0f4; --chart-text: #7b8494;
  --swing: #3b5bdb; --level: #b7791f;
  --ai: #7c3aed; --ai-soft: #f1e9fd;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f1115; --surface: #171a21; --surface-2: #1f232c;
    --line: #262b36; --line-strong: #363c49;
    --ink: #e8eaef; --ink-2: #aab1bf; --ink-3: #77808f;
    --accent: #7b93ff; --accent-soft: #1d2440;
    --course: #e0a84a; --course-soft: #2e2617;
    --up: #3ccf91; --up-soft: #12301f; --down: #ff6b61; --down-soft: #3a1a17;
    --flat: #9aa3b2; --flat-soft: #262b36; --warn: #f59e0b;
    --shadow: 0 1px 2px rgba(0,0,0,.4), 0 6px 20px rgba(0,0,0,.35);
    --chart-bg: #171a21; --chart-grid: #232833; --chart-text: #77808f;
    --swing: #7b93ff; --level: #e0a84a;
    --ai: #b794f6; --ai-soft: #2a2140;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0f1115; --surface: #171a21; --surface-2: #1f232c;
  --line: #262b36; --line-strong: #363c49;
  --ink: #e8eaef; --ink-2: #aab1bf; --ink-3: #77808f;
  --accent: #7b93ff; --accent-soft: #1d2440;
  --course: #e0a84a; --course-soft: #2e2617;
  --up: #3ccf91; --up-soft: #12301f; --down: #ff6b61; --down-soft: #3a1a17;
  --flat: #9aa3b2; --flat-soft: #262b36; --warn: #f59e0b;
  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 6px 20px rgba(0,0,0,.35);
  --chart-bg: #171a21; --chart-grid: #232833; --chart-text: #77808f;
  --swing: #7b93ff; --level: #e0a84a;
  --ai: #b794f6; --ai-soft: #2a2140;
  color-scheme: dark;
}