@font-face {
  font-family: "Onest";
  src: url("Onest-Variable.0202f1694a7b.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("JetBrainsMono-Variable.9948ef33c2ec.woff2") format("woff2");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #f7f7f5;
  --surface: #ffffff;
  --surface-sunken: #eff0ed;
  --fg: #1e1f22;
  --muted: #575d62;
  --subtle: #8a9095;
  --line: #d9dedc;
  --line-strong: #b9c0bd;
  --accent: #0f8a7e;
  --accent-strong: #0b7268;
  --on-accent: #ffffff;
  --accent-soft: #ddefec;
  --live: #0f8a7e;
  --warn: #9a5800;
  --warn-soft: #f8ecd9;
  --bad: #b3312a;
  --bad-soft: #f8e1de;
  --focus: #0f8a7e;
  --series-1: #2a78d6;
  --series-2: #eb6834;
  --series-3: #1baf7a;
  --series-4: #eda100;
  --series-5: #e87ba4;
  --series-6: #008300;
  --series-7: #4a3aa7;
  --series-8: #e34948;
  --chart-grid: #eceeed;
  --chart-axis: #c4cac7;
  --shadow-overlay: 0 12px 32px rgb(30 31 34 / 0.14), 0 2px 6px rgb(30 31 34 / 0.08);

  --scrim: rgb(20 21 23 / 0.45);
  --z-sticky: 10;
  --z-dropdown: 30;
  --z-toast: 60;
  --z-tooltip: 70;
  --icon-sm: 16px;
  --icon-md: 20px;

  --font-sans: "Onest", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.875rem;
  --text-3xl: 2.5rem;
  --text-4xl: 3.5rem;
  --text-display: 6rem;
  --text-hero: clamp(2.75rem, 1.6rem + 4.2vw, 4.75rem);

  --leading-display: 0.85;
  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-normal: 1.5;
  --leading-code: 1.9;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;

  --tracking-display: -0.05em;
  --tracking-heading: -0.02em;
  --tracking-tight: -0.01em;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  --radius-0: 0;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;

  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --duration-fast: 120ms;
  --duration: 200ms;

  --measure: 65ch;
  --content-max: 1200px;

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #141517;
    --surface: #1c1d20;
    --surface-sunken: #101113;
    --fg: #ecedea;
    --muted: #a0a6ab;
    --subtle: #6d7378;
    --line: #2e3135;
    --line-strong: #43474c;
    --accent: #2db5a5;
    --accent-strong: #2db5a5;
    --on-accent: #0e1412;
    --accent-soft: #15302c;
    --live: #2db5a5;
    --warn: #e5a54b;
    --warn-soft: #33281a;
    --bad: #f0705f;
    --bad-soft: #3a1f1c;
    --focus: #2db5a5;
    --series-1: #3987e5;
    --series-2: #d95926;
    --series-3: #199e70;
    --series-4: #c98500;
    --series-5: #d55181;
    --series-6: #008300;
    --series-7: #9085e9;
    --series-8: #e66767;
    --chart-grid: #26282c;
    --chart-axis: #3a3d42;
    --scrim: rgb(0 0 0 / 0.6);
    --shadow-overlay: 0 12px 32px rgb(0 0 0 / 0.5), 0 2px 6px rgb(0 0 0 / 0.3);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #141517;
  --surface: #1c1d20;
  --surface-sunken: #101113;
  --fg: #ecedea;
  --muted: #a0a6ab;
  --subtle: #6d7378;
  --line: #2e3135;
  --line-strong: #43474c;
  --accent: #2db5a5;
  --accent-strong: #2db5a5;
  --on-accent: #0e1412;
  --accent-soft: #15302c;
  --live: #2db5a5;
  --warn: #e5a54b;
  --warn-soft: #33281a;
  --bad: #f0705f;
  --bad-soft: #3a1f1c;
  --focus: #2db5a5;
  --series-1: #3987e5;
  --series-2: #d95926;
  --series-3: #199e70;
  --series-4: #c98500;
  --series-5: #d55181;
  --series-6: #008300;
  --series-7: #9085e9;
  --series-8: #e66767;
  --chart-grid: #26282c;
  --chart-axis: #3a3d42;
  --scrim: rgb(0 0 0 / 0.6);
  --shadow-overlay: 0 12px 32px rgb(0 0 0 / 0.5), 0 2px 6px rgb(0 0 0 / 0.3);
  color-scheme: dark;
}