/* GENERATED by scripts/build-tokens.mjs from design/tokens.json. Do not edit.
   Design system: Onward v2. Same values as src/native/theme/tokens.js. */

:root {
  --color-ground: #F7F1E8;
  --color-surface: #FBF8F3;
  --color-surface-sunk: #EFE6D8;
  --color-line: #E6DCCB;
  --color-control-line: #2F6F62;
  --color-ink: #1E1C18;
  --color-ink-muted: #5C574E;
  --color-brand: #2F6F62;
  --color-brand-tint: #DFE9E4;
  --color-on-brand: #FBF8F3;
  --color-play-accent: #B85418;
  --color-play-ground: #FFF4E8;
  --color-notice-ground: #F3E6C8;
  --color-notice-ink: #5C4A17;
  --color-progress: #C9892B;
  --color-focus: #1E1C18;
  --color-action: var(--color-brand);
  --color-action-text: var(--color-on-brand);

  --font-ui: Inter, "Noto Sans Devanagari", system-ui, sans-serif;
  --font-display: Fraunces, "Anek Devanagari", Georgia, serif;

  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 40px;

  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-pill: 999px;
  /* legacy names used by style.css */
  --radius-btn: var(--radius-md);
  --radius-key: var(--radius-lg);

  --target-min: 48px;
  --target-compact: 56px;
  --target-player: 72px;
  --target-key: 96px;
  --target-key-severe: 112px;
  /* legacy name used by style.css */
  --key: var(--target-key);

  --type-heading-xl-size: 44px;
  --type-heading-xl-line: 52px;
  --type-heading-xl-weight: 600;
  --type-heading-lg-size: 32px;
  --type-heading-lg-line: 40px;
  --type-heading-lg-weight: 600;
  --type-heading-md-size: 22px;
  --type-heading-md-line: 30px;
  --type-heading-md-weight: 600;
  --type-body-lg-size: 20px;
  --type-body-lg-line: 30px;
  --type-body-lg-weight: 400;
  --type-body-size: 18px;
  --type-body-line: 26px;
  --type-body-weight: 400;
  --type-label-size: 16px;
  --type-label-line: 24px;
  --type-label-weight: 700;
  --type-caption-size: 15px;
  --type-caption-line: 22px;
  --type-caption-weight: 400;
  --type-heading-lg-indic-size: 30px;
  --type-heading-lg-indic-line: 48px;
  --type-heading-lg-indic-weight: 700;
  --type-body-lg-indic-size: 20px;
  --type-body-lg-indic-line: 34px;
  --type-body-lg-indic-weight: 400;
  --type-body-indic-size: 18px;
  --type-body-indic-line: 31px;
  --type-body-indic-weight: 400;
  --type-label-indic-size: 16px;
  --type-label-indic-line: 28px;
  --type-label-indic-weight: 700;
  --type-digit-stage-size: 160px;
  --type-digit-stage-line: 176px;
  --type-digit-stage-weight: 700;
  --type-digit-slot-size: 40px;
  --type-digit-slot-line: 48px;
  --type-digit-slot-weight: 700;
  --type-digit-key-size: 32px;
  --type-digit-key-line: 40px;
  --type-digit-key-weight: 700;
}

/* High contrast — player profile setting (DEC-14), not dark mode (OUT-09). */
:root[data-theme='highContrast'] {
  --color-ground: #FFFFFF;
  --color-surface: #FFFFFF;
  --color-surface-sunk: #EDEDED;
  --color-line: #767676;
  --color-control-line: #000000;
  --color-ink: #000000;
  --color-ink-muted: #2B2B2B;
  --color-brand: #1F4A41;
  --color-brand-tint: #CFE0D9;
  --color-on-brand: #FFFFFF;
  --color-play-accent: #8A3A0C;
  --color-play-ground: #FFFFFF;
  --color-notice-ground: #F3E6C8;
  --color-notice-ink: #3D300C;
  --color-progress: #6B4A10;
  --color-focus: #000000;
  --color-action: var(--color-brand);
  --color-action-text: var(--color-on-brand);
}

/* Pediatric program skin: accent + ground follow the player's care program (DEC-14). */
:root[data-skin='pediatric'] {
  --color-brand: var(--color-play-accent);
  --color-control-line: var(--color-play-accent);
  --color-ground: var(--color-play-ground);
  --key: var(--target-key-severe);
}