:root {
  --paper-0: #faf9f6;
  --paper-1: #faf9f6;
  --paper-2: #efeee9;
  --ink-1: #16181d;
  --ink-2: #5b6170;
  --ink-3: #9096a3;
  --line: #d8d7d1;
  --line-strong: #aaa9a3;
  --blue: #4d7cff;
  --blue-bright: #8fb0ff;
  --blue-deep: #2f55d9;
  --blue-ink: #1e3aa6;
  --wash-blue: #ebf0ff;
  --teal: #0fa592;
  --teal-ink: #0b7266;
  --wash-teal: #e2f6f1;
  --violet: #7c5ce8;
  --violet-ink: #5a3ccb;
  --wash-violet: #efeafd;
  --amber: #c77e14;
  --amber-ink: #91580a;
  --wash-amber: #fbf0dc;
  --editorial-field: #244bea;
  --field-ink: #ffffff;
  --field-dim: #e0e7ff;
  --field-rule: #7894ff;
  --positive: #12a150;
  --negative: #d64545;
  --caution: #e8a23d;
  --radial-warm: 232 185 142;
  --radial-latest: 171 192 238;
  --radial-lead: 189 208 191;
  --font-display: Newsreader, Georgia, serif;
  --font-sans: "Space Grotesk", system-ui, sans-serif;
  --font-body: "Space Grotesk", system-ui, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --text-display: 500 clamp(2.7rem, 6.2vw, 5.25rem) / 0.98 var(--font-display);
  --text-h1: 500 clamp(3rem, 7vw, 6rem) / 1 var(--font-display);
  --text-feature: 500 clamp(2.65rem, 4.5vw, 4.5rem) / 1.02 var(--font-display);
  --text-card: 500 clamp(1.65rem, 2.3vw, 2.125rem) / 1.08 var(--font-display);
  --text-h2: 600 clamp(1.5rem, 3.4vw, 1.875rem) / 1.15 var(--font-sans);
  --text-h3: 600 clamp(1.25rem, 2.4vw, 1.375rem) / 1.25 var(--font-sans);
  --text-dek: 400 clamp(1.125rem, 2.6vw, 1.375rem) / 1.5 var(--font-sans);
  --text-body: 400 1.125rem / 1.65 var(--font-body);
  --text-row: 500 1.25rem / 1.2 var(--font-sans);
  --text-btn: 600 0.9375rem / 1 var(--font-sans);
  --text-mono: 400 0.8125rem / 1.5 var(--font-mono);
  --text-ui: 400 1rem / 1.5 var(--font-sans);
  --text-ui-sm: 400 0.875rem / 1.45 var(--font-sans);
  --text-btn: 600 0.9375rem / 1 var(--font-sans);
  --text-kicker: 600 0.75rem / 1.2 var(--font-sans);
  --text-caption: 400 0.8125rem / 1.5 var(--font-sans);
  --text-mono: 400 0.8125rem / 1.5 var(--font-mono);
  --ls-display: -0.015em;
  --ls-kicker: 0.08em;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --col-text: 680px;
  --col-wide: 1320px;
  --gutter: clamp(1rem, 4vw, 1.5rem);
  --masthead-size: clamp(3.75rem, 7.5vw, 6.75rem);
  --section-rail: 9rem;
  --avatar-size: 2.75rem;
  --radius-card: 0;
  --radius-pill: 0;
  --radius-input: 10px;
  --radial-warm-size: 480px 300px;
  --radial-latest-size: 300px 250px;
  --radial-lead-size: 380px 280px;
  --radial-section-size: 190px 140px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 0.16s;
  --dur-play: 0.28s;
  color-scheme: light;
}

.tone-blue { --tone: var(--blue); --tone-ink: var(--blue-deep); --tone-wash: var(--wash-blue); }
.tone-teal { --tone: var(--teal); --tone-ink: var(--teal-ink); --tone-wash: var(--wash-teal); }
.tone-violet { --tone: var(--violet); --tone-ink: var(--violet-ink); --tone-wash: var(--wash-violet); }
.tone-amber { --tone: var(--amber); --tone-ink: var(--amber-ink); --tone-wash: var(--wash-amber); }

@media (max-width: 736px) {
  :root {
    --radial-warm-size: 310px 210px;
    --radial-latest-size: 200px 170px;
    --radial-lead-size: 250px 190px;
    --radial-section-size: 140px 100px;
  }
}
