/* AUTO-GENERATED by shared/design-tokens/build.mjs — do not edit by hand. */

:root {
  --volt-50: #E8F9FF;
  --volt-100: #C9F0FF;
  --volt-200: #9BE4FF;
  --volt-300: #6AD8FF;
  --volt-400: #3FD0FF;
  --volt-500: #1FB8EB;
  --volt-600: #0E93C2;
  --volt-700: #0A6F9C;
  --volt-800: #08567A;
  --volt-900: #063A52;
  --violet-50: #EEF0FF;
  --violet-100: #DDE1FF;
  --violet-200: #BCC3FF;
  --violet-300: #9CA6FF;
  --violet-400: #7C8CFF;
  --violet-500: #6372F2;
  --violet-600: #4F5BD5;
  --violet-700: #3E47AE;
  --violet-800: #2F3685;
  --violet-900: #20255C;
  --sky-400: #5AA9FF;
  --sky-500: #3B8FF0;
  --sky-600: #1A62BA;
  --ink-0: #FFFFFF;
  --ink-50: #F4F7FB;
  --ink-100: #E6ECF4;
  --ink-200: #C7D3E1;
  --ink-300: #9FB0C4;
  --ink-400: #7A8BA3;
  --ink-500: #52627A;
  --ink-600: #2A3D5C;
  --ink-700: #1A2A45;
  --ink-800: #13203A;
  --ink-850: #0D1626;
  --ink-900: #08101D;
  --ink-950: #060B14;
  --win-400: #34D399;
  --win-500: #10B981;
  --win-600: #0B7A54;
  --loss-400: #F87171;
  --loss-500: #EF4444;
  --loss-600: #C8293F;
  --draw-400: #FBBF24;
  --draw-500: #F59E0B;
  --draw-600: #9A6000;
  --live-400: #FF6B84;
  --live-500: #FF3B5C;
  --live-600: #C8102E;
  --gradient-ai: linear-gradient(135deg, #7C8CFF 0%, #3FD0FF 100%);
  --gradient-volt: linear-gradient(135deg, #9BE4FF 0%, #1FB8EB 100%);
  --gradient-pitch: linear-gradient(180deg, rgba(63,208,255,0.10) 0%, rgba(63,208,255,0) 60%);
  --gradient-live: linear-gradient(135deg, #FF6B84 0%, #FF3B5C 100%);
  --gradient-heroDark: radial-gradient(120% 140% at 85% 0%, rgba(63,208,255,0.16) 0%, rgba(63,208,255,0) 48%), radial-gradient(120% 140% at 0% 0%, rgba(124,140,255,0.10) 0%, rgba(124,140,255,0) 50%);
  --gradient-heroLight: radial-gradient(120% 140% at 85% 0%, rgba(10,111,156,0.12) 0%, rgba(10,111,156,0) 48%), radial-gradient(120% 140% at 0% 0%, rgba(79,91,213,0.08) 0%, rgba(79,91,213,0) 50%);
  --font-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --fs-2xs: 0.6875rem;
  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-md: 0.9375rem;
  --fs-lg: 1.0625rem;
  --fs-xl: 1.25rem;
  --fs-2xl: 1.5rem;
  --fs-3xl: 1.875rem;
  --fs-4xl: 2.375rem;
  --fs-5xl: 3rem;
  --fs-6xl: 3.75rem;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;
  --space-0: 0rem;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 1.75rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-slow: 320ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --prob-0-dark: #F87171;
  --prob-0-light: #C8293F;
  --prob-1-dark: #FBBF24;
  --prob-1-light: #9A6000;
  --prob-2-dark: #3FD0FF;
  --prob-2-light: #0A6F9C;
  --prob-3-dark: #34D399;
  --prob-3-light: #0B7A54;
}

/* Varsayılan: koyu tema (marka birincil deneyimi) */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #060B14;
  --bg-elevated: #08101D;
  --surface: #0D1626;
  --surface2: #13203A;
  --surface3: #1A2A45;
  --border: #1C2A40;
  --border-strong: #2A3D5C;
  --text: #F5F8FC;
  --text-secondary: #B8C6D6;
  --text-muted: #8394AC;
  --primary: #3FD0FF;
  --primary-hover: #6AD8FF;
  --on-primary: #04121C;
  --primary-soft: rgba(63,208,255,0.12);
  --accent: #7C8CFF;
  --accent-soft: rgba(124,140,255,0.14);
  --info: #5AA9FF;
  --success: #34D399;
  --success-soft: rgba(52,211,153,0.14);
  --danger: #F87171;
  --danger-soft: rgba(248,113,113,0.14);
  --warning: #FBBF24;
  --warning-soft: rgba(251,191,36,0.14);
  --live: #FF3B5C;
  --live-soft: rgba(255,59,92,0.14);
  --overlay: rgba(2,6,12,0.74);
  --shadow: 0 1px 0 rgba(255,255,255,0.03) inset, 0 12px 32px -12px rgba(0,0,0,0.6);
  --glow: 0 0 0 1px rgba(63,208,255,0.35), 0 12px 40px -12px rgba(63,208,255,0.35);
  --surface4: #22355A;
  --surface-hover: #102038;
  --elev1: 0 1px 2px rgba(0,0,0,0.40);
  --elev2: 0 1px 0 rgba(255,255,255,0.04) inset, 0 10px 28px -12px rgba(0,0,0,0.65);
  --elev3: 0 1px 0 rgba(255,255,255,0.05) inset, 0 28px 72px -24px rgba(0,0,0,0.80);
  --ring: rgba(63,208,255,0.60);
  --live-glow: 0 0 0 1px rgba(255,59,92,0.40), 0 10px 30px -12px rgba(255,59,92,0.55);
  --home-tint: rgba(63,208,255,0.16);
  --away-tint: rgba(124,140,255,0.18);
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #F4F7FB;
  --bg-elevated: #FFFFFF;
  --surface: #FFFFFF;
  --surface2: #EEF3F9;
  --surface3: #E3EAF3;
  --border: #DCE4EE;
  --border-strong: #C7D3E1;
  --text: #0A1626;
  --text-secondary: #3A4A60;
  --text-muted: #52627A;
  --primary: #0A6F9C;
  --primary-hover: #08567A;
  --on-primary: #FFFFFF;
  --primary-soft: rgba(10,111,156,0.10);
  --accent: #4F5BD5;
  --accent-soft: rgba(79,91,213,0.10);
  --info: #1A62BA;
  --success: #0B7A54;
  --success-soft: rgba(11,122,84,0.12);
  --danger: #C8293F;
  --danger-soft: rgba(200,41,63,0.10);
  --warning: #9A6000;
  --warning-soft: rgba(154,96,0,0.12);
  --live: #C8102E;
  --live-soft: rgba(200,16,46,0.10);
  --overlay: rgba(10,22,38,0.45);
  --shadow: 0 1px 2px rgba(10,22,38,0.06), 0 8px 24px -12px rgba(10,22,38,0.18);
  --glow: 0 0 0 1px rgba(10,111,156,0.30), 0 12px 32px -14px rgba(10,111,156,0.32);
  --surface4: #DCE4EE;
  --surface-hover: #F6F9FC;
  --elev1: 0 1px 2px rgba(10,22,38,0.07);
  --elev2: 0 1px 2px rgba(10,22,38,0.05), 0 10px 26px -14px rgba(10,22,38,0.20);
  --elev3: 0 2px 6px rgba(10,22,38,0.06), 0 28px 64px -24px rgba(10,22,38,0.30);
  --ring: rgba(10,111,156,0.55);
  --live-glow: 0 0 0 1px rgba(200,16,46,0.28), 0 10px 26px -14px rgba(200,16,46,0.38);
  --home-tint: rgba(10,111,156,0.12);
  --away-tint: rgba(79,91,213,0.12);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --bg: #F4F7FB;
    --bg-elevated: #FFFFFF;
    --surface: #FFFFFF;
    --surface2: #EEF3F9;
    --surface3: #E3EAF3;
    --border: #DCE4EE;
    --border-strong: #C7D3E1;
    --text: #0A1626;
    --text-secondary: #3A4A60;
    --text-muted: #52627A;
    --primary: #0A6F9C;
    --primary-hover: #08567A;
    --on-primary: #FFFFFF;
    --primary-soft: rgba(10,111,156,0.10);
    --accent: #4F5BD5;
    --accent-soft: rgba(79,91,213,0.10);
    --info: #1A62BA;
    --success: #0B7A54;
    --success-soft: rgba(11,122,84,0.12);
    --danger: #C8293F;
    --danger-soft: rgba(200,41,63,0.10);
    --warning: #9A6000;
    --warning-soft: rgba(154,96,0,0.12);
    --live: #C8102E;
    --live-soft: rgba(200,16,46,0.10);
    --overlay: rgba(10,22,38,0.45);
    --shadow: 0 1px 2px rgba(10,22,38,0.06), 0 8px 24px -12px rgba(10,22,38,0.18);
    --glow: 0 0 0 1px rgba(10,111,156,0.30), 0 12px 32px -14px rgba(10,111,156,0.32);
    --surface4: #DCE4EE;
    --surface-hover: #F6F9FC;
    --elev1: 0 1px 2px rgba(10,22,38,0.07);
    --elev2: 0 1px 2px rgba(10,22,38,0.05), 0 10px 26px -14px rgba(10,22,38,0.20);
    --elev3: 0 2px 6px rgba(10,22,38,0.06), 0 28px 64px -24px rgba(10,22,38,0.30);
    --ring: rgba(10,111,156,0.55);
    --live-glow: 0 0 0 1px rgba(200,16,46,0.28), 0 10px 26px -14px rgba(200,16,46,0.38);
    --home-tint: rgba(10,111,156,0.12);
    --away-tint: rgba(79,91,213,0.12);
  }
}