/* Torqle design tokens — shared with ExamCoach. Every colour, size and timing on the page comes from here.
   Part 1 is ExamCoach's token set, copied exactly (same names, same values). Keep it identical across Torqle products.
   Part 2 is Buzzo’s play layer: what only a game needs (player and world colours, freeze, logo). */

/* ---------- Part 1: Torqle tokens (from ExamCoach) ---------- */
:root {
  --surface: #F6F7FB;
  --surface-raised: #FFFFFF;
  --surface-sunken: #ECEEF5;
  --hairline: #DCE0EA;
  --control-border: #858CA0;
  --ink: #12151E;
  --ink-muted: #5A6072;
  --brand: #2E4BF0;
  --on-brand: #FFFFFF;
  --brand-tint: #E6EBFF;
  --marigold: #FFB21E;
  --on-marigold: #3B2600;
  --success: #127F55;
  --warning: #9A5B00;
  --danger: #C8323D;
  --focus-ring: var(--brand);
  --shadow-card: 0 1px 2px rgba(18,21,30,0.06), 0 8px 24px rgba(18,21,30,0.06);
  --shadow-float: 0 12px 40px rgba(46,75,240,0.18);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --duration-fast: 140ms;
  --duration-base: 240ms;
  --duration-slow: 420ms;
  --font-sans: Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --surface: #0D0F16;
    --surface-raised: #161A24;
    --surface-sunken: #08090E;
    --hairline: #2A2F3D;
    --control-border: #646B80;
    --ink: #F1F3F8;
    --ink-muted: #A2A8B9;
    --brand: #7E95FF;
    --on-brand: #0B1240;
    --brand-tint: #1C2452;
    --marigold: #FFC24D;
    --on-marigold: #3B2600;
    --success: #4ED39C;
    --warning: #FFBC52;
    --danger: #FF7C84;
    --focus-ring: var(--brand);
    --shadow-card: 0 1px 2px rgba(0,0,0,0.5), 0 8px 24px rgba(0,0,0,0.35);
    --shadow-float: 0 12px 40px rgba(0,0,0,0.55);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --surface: #0D0F16;
  --surface-raised: #161A24;
  --surface-sunken: #08090E;
  --hairline: #2A2F3D;
  --control-border: #646B80;
  --ink: #F1F3F8;
  --ink-muted: #A2A8B9;
  --brand: #7E95FF;
  --on-brand: #0B1240;
  --brand-tint: #1C2452;
  --marigold: #FFC24D;
  --on-marigold: #3B2600;
  --success: #4ED39C;
  --warning: #FFBC52;
  --danger: #FF7C84;
  --focus-ring: var(--brand);
  --shadow-card: 0 1px 2px rgba(0,0,0,0.5), 0 8px 24px rgba(0,0,0,0.35);
  --shadow-float: 0 12px 40px rgba(0,0,0,0.55);
  color-scheme: dark;
}

/* ---------- Part 2: Buzzo game tokens ---------- */
/* Player colours: each passes 4.5:1 contrast with its text colour and with the page in both modes. */
:root {
  --player-0: #2E4BF0;
  --player-1: #C2410C;
  --player-2: #0F7A5C;
  --player-3: #8B3FD9;
  --on-player: #FFFFFF;
  --freeze: #0A84C6;
  --scrim: rgba(8,9,14,0.4);
  --logo-bg: #2E4BF0;
  --logo-fg: #FFFFFF;
  --logo-dot: #FFB21E;
  /* World colours: each world has its own, so picking one feels like picking a level. */
  --world-mix: #7A3FE0;
  --world-maths: #2E4BF0;
  --world-science: #0F7A5C;
  --world-social: #B45309;
  --world-english: #C2255C;
  --world-kannada: #C2410C;
  --world-hindi: #0E7490;
  --world-gk: #5A6072;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --player-0: #7E95FF;
    --player-1: #FF9461;
    --player-2: #45D0A5;
    --player-3: #C79BFF;
    --on-player: #0D0F16;
    --freeze: #5AC8FA;
    --scrim: rgba(0,0,0,0.6);
    --world-mix: #B79BFF;
    --world-maths: #7E95FF;
    --world-science: #45D0A5;
    --world-social: #F0A050;
    --world-english: #FF7BA8;
    --world-kannada: #FF9461;
    --world-hindi: #4FC9E0;
    --world-gk: #A2A8B9;
  }
}
:root[data-theme="dark"] {
  --player-0: #7E95FF;
  --player-1: #FF9461;
  --player-2: #45D0A5;
  --player-3: #C79BFF;
  --on-player: #0D0F16;
  --freeze: #5AC8FA;
  --scrim: rgba(0,0,0,0.6);
  --world-mix: #B79BFF;
  --world-maths: #7E95FF;
  --world-science: #45D0A5;
  --world-social: #F0A050;
  --world-english: #FF7BA8;
  --world-kannada: #FF9461;
  --world-hindi: #4FC9E0;
  --world-gk: #A2A8B9;
}
