/* Curling TV tokens (generated from the design system's tokens.json). Ice = light, Night session = dark. */
@font-face { font-family: "Archivo"; src: url("/fonts/Archivo-Variable.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-style: normal; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible Next"; src: url("/fonts/AtkinsonHyperlegibleNext-Variable.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible Mono"; src: url("/fonts/AtkinsonHyperlegibleMono-Variable.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }

:root {
  color-scheme: light;
  --font-display: "Archivo", "Arial Black", system-ui, sans-serif;
  --font-text: "Atkinson Hyperlegible Next", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Atkinson Hyperlegible Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 80px;
  --radius-sheet: 4px;
  --radius-sheet-tv: 8px;
  --radius-stone: 999px;
  --glide: 420ms;
  --nudge: 160ms;
  --curl: cubic-bezier(0.2, 0.7, 0.25, 1);
  --ice: #F4F7F6;
  --ice-sunk: #E7EDEB;
  --frost: #FFFFFF;
  --frost-raised: #FFFFFF;
  --line: #CDD6D4;
  --line-strong: #76837F;
  --granite: #1C2125;
  --granite-muted: #4D575E;
  --granite-subtle: #5F6A72;
  --handle: #FFC21A;
  --on-handle: #1C2125;
  --handle-wash: #FFF1C2;
  --twelve: #2450C8;
  --hog: #C2103A;
  --on-hog: #FFFFFF;
  --gold: #C9A24A;
  --on-gold: #1C2125;
  --stone-red: #D7332A;
  --stone-yellow: #FFC21A;
  --granite-stone: #5E6873;
  --ok: #187045;
  --danger: #B42318;
  --focus: #1C2125;
  --shadow-lift: 0 18px 40px rgba(28,33,37,0.18);
  --shadow-hairline: 0 0 0 1px rgba(28,33,37,0.08);
}

/* Night session: the system preference, unless the person picked Ice in Account. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ice: #101316;
    --ice-sunk: #0B0D0F;
    --frost: #191D21;
    --frost-raised: #22272C;
    --line: #2C3339;
    --line-strong: #6B7781;
    --granite: #F1F4F3;
    --granite-muted: #AEB7BC;
    --granite-subtle: #8E999F;
    --handle: #FFC21A;
    --on-handle: #1C2125;
    --handle-wash: #3A2F0E;
    --twelve: #7FA2FF;
    --hog: #DA1E48;
    --on-hog: #FFFFFF;
    --gold: #C9A24A;
    --on-gold: #1C2125;
    --stone-red: #E5483E;
    --stone-yellow: #FFC21A;
    --granite-stone: #7C8791;
    --ok: #5CCB8F;
    --danger: #FF8A80;
    --focus: #FFC21A;
    --shadow-lift: 0 24px 60px rgba(0,0,0,0.55);
    --shadow-hairline: 0 0 0 1px rgba(255,255,255,0.06);
  }
}

/* Picked in Account, and the player, multiview and other always-Night surfaces. */
:root[data-theme="dark"], .theme-night {
  color-scheme: dark;
  --ice: #101316;
  --ice-sunk: #0B0D0F;
  --frost: #191D21;
  --frost-raised: #22272C;
  --line: #2C3339;
  --line-strong: #6B7781;
  --granite: #F1F4F3;
  --granite-muted: #AEB7BC;
  --granite-subtle: #8E999F;
  --handle: #FFC21A;
  --on-handle: #1C2125;
  --handle-wash: #3A2F0E;
  --twelve: #7FA2FF;
  --hog: #DA1E48;
  --on-hog: #FFFFFF;
  --gold: #C9A24A;
  --on-gold: #1C2125;
  --stone-red: #E5483E;
  --stone-yellow: #FFC21A;
  --granite-stone: #7C8791;
  --ok: #5CCB8F;
  --danger: #FF8A80;
  --focus: #FFC21A;
  --shadow-lift: 0 24px 60px rgba(0,0,0,0.55);
  --shadow-hairline: 0 0 0 1px rgba(255,255,255,0.06);
}
