/* Not a Lottery — design tokens.
 *
 * Deep-ink base with gold and violet accents: the visual language of a draw
 * night, without borrowing anyone's brand. The app is dark by default because
 * that is what the subject matter wants; a light scheme follows the system
 * preference.
 */

/* This app commits to a single dark scheme rather than offering both. A draw
 * night is a dark room with lit balls in it, and every surface treatment here —
 * the glow on a matched ball, the gradient behind the shell — is built for
 * that. A light variant would be a different design, not a recolour. */

:root {
  color-scheme: dark;

  /* Surfaces, darkest to lightest */
  --ink-900: #07060f;
  --ink-800: #0d0b1a;
  --ink-700: #141127;
  --ink-600: #1c1834;
  --ink-500: #262041;
  --ink-400: #332b53;

  --line: rgba(255, 255, 255, 0.09);
  --line-strong: rgba(255, 255, 255, 0.16);

  /* Text */
  --text: #f2eff8;
  --text-dim: #a79fc4;
  --text-faint: #6f688c;

  /* Accents */
  --gold: #f5cd6b;
  --gold-deep: #d9a233;
  --violet: #8b5cf6;
  --violet-soft: #a78bfa;
  --magenta: #e8459b;
  --teal: #35c3b0;

  --win: #45d39a;
  --loss: #ff5c72;
  --warn: #ffb340;

  /* Ball colours, matching the bands used on the real machines */
  --ball-white: #f4f1e8;
  --ball-white-ink: #221d33;
  --ball-blue: #3c7de2;
  --ball-pink: #ec5f9f;
  --ball-green: #2fae6a;
  --ball-yellow: #f0c419;
  --ball-yellow-ink: #3a2c05;
  --ball-mauve: #9c6bd8;

  /* Type */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo,
    Consolas, monospace;

  /* Space */
  --gap-1: 4px;
  --gap-2: 8px;
  --gap-3: 12px;
  --gap-4: 16px;
  --gap-5: 24px;
  --gap-6: 32px;

  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 20px;

  --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.04) inset,
    0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-ball: 0 2px 6px rgba(0, 0, 0, 0.5),
    inset 0 -3px 8px rgba(0, 0, 0, 0.25), inset 0 3px 6px rgba(255, 255, 255, 0.35);

  --tap: 44px; /* minimum comfortable touch target */
  --shell-max: 520px;
  --header-h: 64px; /* sized around the 44px brand mark, not the text */
  --nav-h: 60px;

  /* Chart marks. Stepped for the chart surface (--ink-700, #141127) rather than
   * reused from the UI accents above, and validated on it: all inside the dark
   * lightness band, above the chroma floor, ≥3:1 against the surface, and
   * separable under simulated protanopia and deuteranopia. Do not substitute
   * the UI gold or violet here — they are too light for a mark. */
  --viz-net: #e8536a; /* net position — a single series, so no pairing needed */
  --viz-net-wash: rgba(232, 83, 106, 0.12);
  --viz-staked: #8b5cf6;
  --viz-won: #c98500;
  --viz-saved: #1f9e8c;
  --viz-grid: #2a2545;
  --viz-surface: #141127;
}