/* Design tokens from design/design-system/project/tokens.json ("Sticker Party"). Shared by the
   website and the admin. Do not add colours or sizes that are not in tokens.json. */
:root {
  --ground: #F6F3FA; --surface: #FFFFFF; --surface-sunken: #ECE6F3; --ink: #24122F; --ink-muted: #6A5878;
  --on-color: #24122F; --hairline: #CFC4DB; --brand: #FF6A2B; --brand-text: #C2410C; --sun: #FFC531;
  --correct: #14B8A6; --correct-text: #0F766E; --wrong: #F0507A; --wrong-text: #BE123C; --focus: #2563EB;
  --player-1: #FF8A4C; --player-2: #FFC531; --player-3: #2DD4BF; --player-4: #FF7FA2;
  --player-5: #6EA8FF; --player-6: #B39BFF; --player-7: #A3D95B; --player-8: #F5A3FF;
  --shadow-sticker: 4px 4px 0 #24122F; --shadow-sticker-pressed: 1px 1px 0 #24122F;
  --shadow-sheet: 0 16px 40px rgba(36,18,47,0.18);
  --display: "Unbounded", "Readex Pro", system-ui, sans-serif;
  --display-ar: "Readex Pro", "Unbounded", system-ui, sans-serif;
  --body: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --radius-sm: 10px; --radius-md: 18px; --radius-lg: 28px; --radius-pill: 999px;
  --stroke-sticker: 2.5px; --stroke-focus: 3px;
  --duration-tap: 120ms; --duration-quick: 200ms; --duration-move: 320ms;
  --duration-reveal: 600ms; --duration-celebrate: 1400ms;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --ground: #160C1F; --surface: #24152F; --surface-sunken: #0F0716; --ink: #F7F1FB; --ink-muted: #B9A8C7;
    --hairline: #4A3858; --brand: #FF7A40; --brand-text: #FF8A57; --sun: #FFCF4D;
    --correct: #2DD4BF; --correct-text: #5EEAD4; --wrong: #FF6B8F; --wrong-text: #FF8FA8; --focus: #7DB3FF;
    --shadow-sticker: 4px 4px 0 #000000; --shadow-sticker-pressed: 1px 1px 0 #000000;
    --shadow-sheet: 0 16px 40px rgba(0,0,0,0.55);
    color-scheme: dark;
  }
}
/* Type styles (tokens.json › type) */
.t-display-xl { font: 800 44px/48px var(--display); letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.t-score { font: 800 34px/36px var(--display); font-variant-numeric: tabular-nums; }
.t-title-lg { font: 700 28px/34px var(--display); }
.t-title-md { font: 700 20px/26px var(--display); }
.t-question { font: 600 22px/29px var(--body); }
.t-answer { font: 600 18px/24px var(--body); }
.t-body { font: 400 17px/24px var(--body); }
.t-callout { font: 500 15px/20px var(--body); }
.t-caption { font: 500 13px/18px var(--body); }
.t-label { font: 700 12px/16px var(--body); letter-spacing: .08em; text-transform: uppercase; }
:lang(ar) .t-label, :lang(tr) .t-label { text-transform: none; letter-spacing: 0; }
:focus-visible { outline: var(--stroke-focus) solid var(--focus); outline-offset: 3px; }
