/* GENERATED by tools/generate_tokens.dart from design/tokens.json. Do not edit; change the JSON and run the generator. */
:root {
  color-scheme: light dark;
  --font-family: 'IBM Plex Sans Arabic', 'IBM Plex Sans', system-ui, sans-serif;
  --color-canvas: #f3f6f4;
  --color-surface: #ffffff;
  --color-surface-muted: #e9efec;
  --color-surface-raised: #ffffff;
  --color-border: #dce4e0;
  --color-border-strong: #c3cfc9;
  --color-divider: #e6ece9;
  --color-ink: #10211c;
  --color-ink-secondary: #44544e;
  --color-ink-muted: #5b6a64;
  --color-ink-inverse: #ffffff;
  --color-brand: #0b2e25;
  --color-on-brand: #ffffff;
  --color-primary: #157a5b;
  --color-primary-hover: #0f6248;
  --color-primary-soft: #dcefe6;
  --color-on-primary: #ffffff;
  --color-on-primary-soft: #0b4a36;
  --color-live: #ff7a1a;
  --color-live-text: #a84400;
  --color-live-soft: #ffebdd;
  --color-on-live: #ffffff;
  --color-on-live-soft: #8a3e05;
  --color-card-yellow: #f5c400;
  --color-card-red: #e03131;
  --color-win: #157a5b;
  --color-draw: #6b7a74;
  --color-loss: #e03131;
  --color-info: #1f5fa8;
  --color-info-soft: #e6eef9;
  --color-on-info-soft: #163f70;
  --color-success: #157a5b;
  --color-success-soft: #dcefe6;
  --color-on-success-soft: #0b4a36;
  --color-pro-gold-start: #f6d365;
  --color-pro-gold-end: #d9a21b;
  --color-on-pro-gold: #3d2a00;
  --color-donation-start: #8e1b45;
  --color-donation-end: #c4344f;
  --color-on-donation: #ffffff;
  --color-warning: #b26a00;
  --color-warning-soft: #fbf0dc;
  --color-on-warning-soft: #6b4100;
  --color-danger: #e03131;
  --color-danger-soft: #fde2e2;
  --color-on-danger-soft: #8a1f1f;
  --color-pitch: #1e7d3c;
  --color-pitch-line: #ffffff;
  --color-scrim: #0b1512;
  --color-focus: #157a5b;
  --color-nav-glass: #ffffff;
  --color-nav-ink: #10211c;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-gutter: 16px;
  --space-card-pad: 16px;
  --space-section-gap: 24px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-xxl: 32px;
  --radius-full: 999px;
  --radius-card: 16px;
  --radius-chip: 999px;
  --radius-nav-pill: 32px;
  --size-control: 48px;
  --size-control-sm: 36px;
  --size-crest: 26px;
  --size-crest-sm: 22px;
  --size-crest-md: 40px;
  --size-crest-lg: 56px;
  --size-crest-xl: 88px;
  --size-icon: 22px;
  --size-icon-sm: 18px;
  --size-icon-xs: 14px;
  --size-avatar: 32px;
  --size-avatar-md: 40px;
  --size-avatar-lg: 72px;
  --size-player-chip: 30px;
  --size-match-row: 64px;
  --size-date-chip: 56px;
  --size-bottom-nav: 64px;
  --size-side-rail-width: 60px;
  --size-side-rail-item: 56px;
  --size-card-thumb: 88px;
  --size-icon-tile: 40px;
  --size-coming-soon-art-width: 200px;
  --size-coming-soon-art-height: 160px;
  --shadow-card: 0 2px 8px rgba(11,46,37,0.06);
  --shadow-popover: 0 8px 24px rgba(11,46,37,0.14);
  --shadow-modal: 0 16px 40px rgba(11,46,37,0.22);
  --shadow-nav: 0 8px 24px rgba(0,0,0,0.16);
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-slow: 320ms;
  --motion-container: 360ms;
  --motion-container-close: 280ms;
  --motion-stagger: 40ms;
  --motion-shimmer: 1200ms;
  --motion-score-flash: 600ms;
  --motion-easing: cubic-bezier(0.2,0,0,1);
  --motion-easing-exit: cubic-bezier(0.4,0,1,1);
  --motion-easing-emphasis: cubic-bezier(0.2,0,0,1.2);
  --type-display-size: 40px;
  --type-display-weight: 700;
  --type-display-line: 48px;
  --type-h1-size: 28px;
  --type-h1-weight: 700;
  --type-h1-line: 36px;
  --type-h2-size: 22px;
  --type-h2-weight: 700;
  --type-h2-line: 30px;
  --type-title-size: 18px;
  --type-title-weight: 600;
  --type-title-line: 26px;
  --type-body-size: 16px;
  --type-body-weight: 400;
  --type-body-line: 26px;
  --type-body-medium-size: 16px;
  --type-body-medium-weight: 500;
  --type-body-medium-line: 26px;
  --type-body-sm-size: 14px;
  --type-body-sm-weight: 400;
  --type-body-sm-line: 22px;
  --type-label-size: 13px;
  --type-label-weight: 500;
  --type-label-line: 18px;
  --type-caption-size: 12px;
  --type-caption-weight: 400;
  --type-caption-line: 16px;
  --type-overline-size: 11px;
  --type-overline-weight: 600;
  --type-overline-line: 16px;
  --type-score-lg-size: 44px;
  --type-score-lg-weight: 700;
  --type-score-lg-line: 48px;
  --type-score-size: 24px;
  --type-score-weight: 700;
  --type-score-line: 28px;
  --type-score-sm-size: 18px;
  --type-score-sm-weight: 700;
  --type-score-sm-line: 22px;
  --type-time-size: 16px;
  --type-time-weight: 600;
  --type-time-line: 20px;
  --type-minute-size: 11px;
  --type-minute-weight: 700;
  --type-minute-line: 14px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-canvas: #0b1512;
    --color-surface: #122019;
    --color-surface-muted: #18291f;
    --color-surface-raised: #1a2e24;
    --color-border: #243a30;
    --color-border-strong: #34503f;
    --color-divider: #1c3027;
    --color-ink: #ecf3ef;
    --color-ink-secondary: #b4c3bb;
    --color-ink-muted: #86978f;
    --color-ink-inverse: #0b1512;
    --color-brand: #0b2e25;
    --color-on-brand: #ffffff;
    --color-primary: #3fbf8f;
    --color-primary-hover: #62d1a6;
    --color-primary-soft: #163b2e;
    --color-on-primary: #06211a;
    --color-on-primary-soft: #bdebd5;
    --color-live: #ff8a3d;
    --color-live-text: #ff8a3d;
    --color-live-soft: #3a2416;
    --color-on-live: #1a0c02;
    --color-on-live-soft: #ffd1ae;
    --color-card-yellow: #ffd23f;
    --color-card-red: #ff5a5a;
    --color-win: #3fbf8f;
    --color-draw: #86978f;
    --color-loss: #ff5a5a;
    --color-info: #7fb0ea;
    --color-info-soft: #14283f;
    --color-on-info-soft: #cfe1f6;
    --color-success: #3fbf8f;
    --color-success-soft: #163b2e;
    --color-on-success-soft: #bdebd5;
    --color-pro-gold-start: #f2cc5c;
    --color-pro-gold-end: #c98f12;
    --color-on-pro-gold: #2a1c00;
    --color-donation-start: #7a173c;
    --color-donation-end: #a82c45;
    --color-on-donation: #ffffff;
    --color-warning: #e3a23a;
    --color-warning-soft: #3e2a08;
    --color-on-warning-soft: #f3ddb0;
    --color-danger: #ff5a5a;
    --color-danger-soft: #3f1515;
    --color-on-danger-soft: #ffc9c9;
    --color-pitch: #1e6b36;
    --color-pitch-line: #d8e8de;
    --color-scrim: #000000;
    --color-focus: #3fbf8f;
    --color-nav-glass: #122019;
    --color-nav-ink: #ecf3ef;
  }
}