/* Storm Chasers Cup: generated by website/build.py from branding/design-system/project/tokens.json */
:root, [data-theme="light"] {
  color-scheme: light;
  --navy: #081725;
  --ice: #ADE2E2;
  --steel: #639EB5;
  --storm-red: #C7202F;
  --white: #FFFFFF;
  --surface: #F3F8F8;
  --surface-raised: #FFFFFF;
  --surface-band: #DFF0F0;
  --line: #C3D6DC;
  --line-strong: #6E8796;
  --ink: var(--navy);
  --ink-muted: #4A6070;
  --link: #2B6984;
  --action: var(--navy);
  --on-action: var(--white);
  --signal: var(--storm-red);
  --on-signal: var(--white);
  --signal-ink: #B01B29;
  --on-ice: var(--navy);
  --focus-ring: #2B6984;
  --texture: rgba(99, 158, 181, 0.18);
  --texture-on-navy: rgba(173, 226, 226, 0.07);
}
[data-theme="dark"] {
  color-scheme: dark;
  --surface: var(--navy);
  --surface-raised: #0F2438;
  --surface-band: #0C1E30;
  --line: #24405A;
  --line-strong: #6F8DA3;
  --ink: #EEF7F7;
  --ink-muted: #A7BFCC;
  --link: var(--ice);
  --action: var(--ice);
  --on-action: var(--navy);
  --signal: var(--storm-red);
  --on-signal: var(--white);
  --signal-ink: #FF8A8F;
  --on-ice: var(--navy);
  --focus-ring: var(--ice);
  --texture: rgba(173, 226, 226, 0.08);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  color-scheme: dark;
  --surface: var(--navy);
  --surface-raised: #0F2438;
  --surface-band: #0C1E30;
  --line: #24405A;
  --line-strong: #6F8DA3;
  --ink: #EEF7F7;
  --ink-muted: #A7BFCC;
  --link: var(--ice);
  --action: var(--ice);
  --on-action: var(--navy);
  --signal: var(--storm-red);
  --on-signal: var(--white);
  --signal-ink: #FF8A8F;
  --on-ice: var(--navy);
  --focus-ring: var(--ice);
  --texture: rgba(173, 226, 226, 0.08);
  }
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-pill: 999px;
  --border-thin: 1px;
  --border-bold: 2px;
  --font-display: Saira, "Arial Narrow", Arial, sans-serif;
  --font-body: Barlow, "Segoe UI", Arial, sans-serif;
}
.display-xl { font-family: var(--font-display); font-size: 56px; line-height: 56px; font-weight: 800; letter-spacing: 0.01em; }
.display { font-family: var(--font-display); font-size: 32px; line-height: 36px; font-weight: 800; letter-spacing: 0.01em; }
.heading { font-family: var(--font-display); font-size: 22px; line-height: 28px; font-weight: 700; }
.eyebrow { font-family: var(--font-display); font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: 0.12em; }
.score { font-family: var(--font-display); font-size: 28px; line-height: 32px; font-weight: 700; }
.body-lg { font-family: var(--font-body); font-size: 19px; line-height: 28px; font-weight: 400; }
.body { font-family: var(--font-body); font-size: 17px; line-height: 26px; font-weight: 400; }
.label { font-family: var(--font-body); font-size: 15px; line-height: 20px; font-weight: 600; }
.small { font-family: var(--font-body); font-size: 14px; line-height: 20px; font-weight: 500; }
.credit { font-family: var(--font-body); font-size: 12px; line-height: 16px; font-weight: 400; }
@font-face { font-family: "Saira"; src: url("/fonts/Saira-Variable.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/fonts/Barlow-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/fonts/Barlow-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/fonts/Barlow-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/fonts/Barlow-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }