/*
 * GENERATED by svhs-live-api/scripts/gen-design-tokens.cjs from
 * docs/design-system/tokens.json — the single source of truth. DO NOT EDIT.
 * Run `npm run gen:tokens` after editing tokens.json; `npm run check:tokens` guards drift.
 *
 * Canonical status + ribbon colors. Loaded BEFORE styles.css so these are
 * the authoritative declarations; styles.css consumes them via var().
 */
:root {
  --green: #34C759;
  --green-soft: rgba(52, 199, 89, 0.1);
  --orange: #FF9500;
  --orange-soft: rgba(255, 149, 0, 0.1);
  --blue: #007AFF;
  --blue-soft: rgba(0, 122, 255, 0.1);
  --red: #FF3B30;
  --red-soft: rgba(255, 59, 48, 0.1);
  --lineup: #B26A00;
  --lineup-fill: #FFCC00;
  --lineup-soft: rgba(255, 204, 0, 0.16);
  --gold: #B8860B;
  --ribbon-1: #007AFF;
  --ribbon-2: #FF3B30;
  --ribbon-3: #FFD60A;
  --ribbon-4: #FFFFFF;
  --ribbon-5: #FF4FA3;
  --ribbon-6: #34C759;
  --ribbon-7: #AF52DE;
  --ribbon-8: #A2845E;
  --ribbon-9: #5AC8FA;
  --ribbon-10: #8E8E93;
  --ribbon-default: #D1D1D6;
}

@media (prefers-color-scheme: dark) {
  :root {
    --green: #30D158;
    --green-soft: rgba(48, 209, 88, 0.15);
    --orange: #FF9F0A;
    --orange-soft: rgba(255, 159, 10, 0.15);
    --blue: #0A84FF;
    --blue-soft: rgba(10, 132, 255, 0.15);
    --red: #FF453A;
    --red-soft: rgba(255, 69, 58, 0.15);
    --lineup: #FFD60A;
    --lineup-fill: #FFD60A;
    --lineup-soft: rgba(255, 214, 10, 0.22);
    --gold: #D4A84B;
    --ribbon-1: #007AFF;
    --ribbon-2: #FF3B30;
    --ribbon-3: #FFD60A;
    --ribbon-4: #FFFFFF;
    --ribbon-5: #FF66B3;
    --ribbon-6: #34C759;
    --ribbon-7: #AF52DE;
    --ribbon-8: #A2845E;
    --ribbon-9: #5AC8FA;
    --ribbon-10: #8E8E93;
    --ribbon-default: #48484A;
  }
}