/* ============================================================
   btctradingsimulator.com — design tokens
   Light is the primary theme: every scammy signal site is dark
   + neon; paper-white reads as public-utility honesty.
   Dark is a first-class variant via [data-theme="dark"].
   ============================================================ */

:root {
  /* ---- type ---- */
  --font-text: "Public Sans", "Helvetica Neue", Helvetica, sans-serif;
  --font-display: "Spline Sans Mono", monospace; /* overridden by typeface tweak */
  --font-mono: "Spline Sans Mono", ui-monospace, monospace;

  /* ---- neutrals (warm paper) ---- */
  --bg:        oklch(97.4% 0.005 85);   /* paper */
  --surface:   oklch(99.4% 0.002 85);   /* card */
  --surface-2: oklch(95.2% 0.006 85);   /* inset / chip */
  --ink:       oklch(24% 0.012 75);     /* primary text */
  --ink-2:     oklch(44% 0.014 75);     /* secondary */
  --ink-3:     oklch(62% 0.012 75);     /* tertiary / chart benchmark */
  --line:      oklch(89% 0.008 85);
  --line-soft: oklch(93% 0.006 85);

  /* ---- one confident accent (chosen: blue) ---- */
  --accent:        oklch(54% 0.21 262);
  --accent-strong: oklch(46% 0.21 262);
  --accent-soft:   oklch(94% 0.025 262);
  --on-accent:     oklch(99% 0.002 262);

  /* ---- P&L semantics ONLY (never decorative) ---- */
  --pos:      oklch(51% 0.13 155);
  --pos-soft: oklch(94% 0.04 155);
  --neg:      oklch(53% 0.17 27);
  --neg-soft: oklch(95% 0.025 27);

  /* ---- status ---- */
  --warn:      oklch(58% 0.12 75);
  --warn-soft: oklch(95% 0.035 85);

  /* ---- chart ---- */
  --chart-bot: var(--accent);
  --chart-btc: var(--ink-3);

  /* ---- shape & shadow ---- */
  --radius-card: 14px;
  --radius-chip: 999px;
  --shadow-card: 0 1px 2px oklch(24% 0.012 75 / 0.05), 0 4px 16px oklch(24% 0.012 75 / 0.05);

  /* ---- spacing scale ---- */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 72px;
}

[data-theme="dark"] {
  --bg:        oklch(19% 0.008 262);
  --surface:   oklch(23% 0.009 262);
  --surface-2: oklch(27% 0.01 262);
  --ink:       oklch(93% 0.006 85);
  --ink-2:     oklch(72% 0.01 85);
  --ink-3:     oklch(56% 0.012 85);
  --line:      oklch(32% 0.01 262);
  --line-soft: oklch(28% 0.01 262);

  --accent:        oklch(70% 0.16 262);
  --accent-strong: oklch(78% 0.13 262);
  --accent-soft:   oklch(30% 0.06 262);
  --on-accent:     oklch(16% 0.03 262);

  --pos:      oklch(72% 0.14 155);
  --pos-soft: oklch(30% 0.05 155);
  --neg:      oklch(70% 0.16 27);
  --neg-soft: oklch(30% 0.05 27);

  --warn:      oklch(78% 0.12 85);
  --warn-soft: oklch(29% 0.04 85);

  --shadow-card: 0 1px 2px oklch(0% 0 0 / 0.3), 0 6px 20px oklch(0% 0 0 / 0.25);
}