/* Generated by scripts/build_tokens.py from design/tokens.json. Do not edit by hand. */

@font-face {
  font-family: "Source Serif 4";
  src: url("fonts/SourceSerif4-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("fonts/SourceSans3-latin.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-display: "Source Serif 4", Georgia, 'Times New Roman', serif;
  --font-text: "Source Sans 3", 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-base: 17px;
  --text-xs: 0.6400rem;
  --text-sm: 0.8000rem;
  --text-md: 1rem;
  --text-lg: 1.2500rem;
  --text-xl: 1.5625rem;
  --text-2xl: 1.9531rem;
  --text-3xl: 2.4414rem;
  --leading-body: 1.55;
  --leading-tight: 1.2;
  --leading-display: 1.1;
  --measure: 68ch;
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 40px;
  --space-6: 48px;
  --space-8: 64px;
  --space-12: 96px;
  --content-max: 1100px;
  --figure-height: 420px;
  --map-height: 460px;
  --hairline: 1px;
  --radius: 4px;
  --nav-height: 48px;
  --target-min: 44px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --motion-fast: 150ms;
  --motion: 200ms;
  --easing: cubic-bezier(0.2, 0, 0, 1);
  --paper: #F9F6F0;
  --surface: #FFFDF9;
  --ink: #1C1B19;
  --ink-muted: #5F5B55;
  --rule: #DAD5CB;
  --grid: #E4E0D8;
  --accent: #0B5C8C;
  --accent-ink: #FFFFFF;
  --skeleton: #ECE7DD;
  --focus: #0B5C8C;
  --error: #B3213A;
  --error-surface: #FBEDEF;
  --phase-el-nino: #E69F00;
  --phase-la-nina: #56B4E9;
  --phase-neutral: #999999;
  --band-el-nino: rgba(230,159,0,0.26);
  --band-la-nina: rgba(86,180,233,0.2);
  --state-alert: #C8324D;
  --state-no-alert: #0E8064;
  --state-not-assessed: #8F8A82;
  --series-1: #0072B2;
  --series-2: #D55E00;
  --series-3: #009E73;
  --series-4: #A8529B;
  --series-5: #7A6A00;
  --index-primary: #0072B2;
  --index-secondary: #86817A;
  --threshold: #86817A;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #15171A;
    --surface: #1D2024;
    --ink: #ECE8E1;
    --ink-muted: #B0AAA0;
    --rule: #33373D;
    --grid: #2A2E34;
    --accent: #8CC4EA;
    --accent-ink: #15171A;
    --skeleton: #2A2E34;
    --focus: #8CC4EA;
    --error: #F0788C;
    --error-surface: #3A2227;
    --phase-el-nino: #FFB450;
    --phase-la-nina: #78BEF0;
    --phase-neutral: #999999;
    --band-el-nino: rgba(255,180,80,0.24);
    --band-la-nina: rgba(120,190,240,0.18);
    --state-alert: #F0788C;
    --state-no-alert: #4FC39F;
    --state-not-assessed: #8F8A82;
    --series-1: #8ED0F5;
    --series-2: #F5A860;
    --series-3: #5AD1AC;
    --series-4: #EDB3D6;
    --series-5: #EAD66A;
    --index-primary: #8ED0F5;
    --index-secondary: #9C968D;
    --threshold: #8F8A82;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --paper: #15171A;
  --surface: #1D2024;
  --ink: #ECE8E1;
  --ink-muted: #B0AAA0;
  --rule: #33373D;
  --grid: #2A2E34;
  --accent: #8CC4EA;
  --accent-ink: #15171A;
  --skeleton: #2A2E34;
  --focus: #8CC4EA;
  --error: #F0788C;
  --error-surface: #3A2227;
  --phase-el-nino: #FFB450;
  --phase-la-nina: #78BEF0;
  --phase-neutral: #999999;
  --band-el-nino: rgba(255,180,80,0.24);
  --band-la-nina: rgba(120,190,240,0.18);
  --state-alert: #F0788C;
  --state-no-alert: #4FC39F;
  --state-not-assessed: #8F8A82;
  --series-1: #8ED0F5;
  --series-2: #F5A860;
  --series-3: #5AD1AC;
  --series-4: #EDB3D6;
  --series-5: #EAD66A;
  --index-primary: #8ED0F5;
  --index-secondary: #9C968D;
  --threshold: #8F8A82;
  color-scheme: dark;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-fast: 0ms;
    --motion: 0ms;
  }
}