:root {
    --color-paper:         oklch(97.8% 0.006 243);
    --color-paper-2:       oklch(95.2% 0.009 243);
    --color-paper-3:       oklch(91.5% 0.012 243);
    --color-rule:          oklch(86% 0.012 243);
    --color-rule-strong:   oklch(74% 0.016 243);
    --color-neutral:       oklch(56% 0.015 243);
    --color-muted:         oklch(42% 0.018 243);
    --color-ink:           oklch(19% 0.015 243);

    --color-accent:        oklch(44.5% 0.107 242.8);   /* #00598a */
    --color-accent-strong: oklch(37.5% 0.090 242.5);   /* #00456c */
    --color-accent-soft:   oklch(93.5% 0.024 240);
    --color-accent-ink:    oklch(97.8% 0.006 243);

    --color-night:         oklch(16% 0.012 243);
    --color-night-2:       oklch(21% 0.014 243);
    --color-night-rule:    oklch(30% 0.014 243);
    --color-night-ink:     oklch(95% 0.006 243);
    --color-night-muted:   oklch(74% 0.015 243);
    --color-night-accent:  oklch(76% 0.085 236);

    --color-focus:         oklch(52% 0.14 243);
    --color-success:       oklch(48% 0.11 155);
    --color-danger:        oklch(50% 0.16 27);
    --color-scrim:         oklch(16% 0.012 243 / 0.32);

    /* Type — display + body, nothing else. */
    --font-display: "Muller", "Figtree", ui-sans-serif, system-ui, sans-serif;
    --font-body:    "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;

    /* Perfect fourth from 1rem. */
    --text-2xs:     0.6875rem;
    --text-xs:      0.75rem;
    --text-sm:      0.875rem;
    --text-md:      1rem;
    --text-lg:      1.1875rem;
    --text-xl:      1.4375rem;
    --text-2xl:     1.875rem;
    --text-3xl:     2.5rem;
    --text-display: clamp(2.25rem, 1.4rem + 3.4vw, 3.875rem);

    --lh-tight: 1.05;
    --lh-snug:  1.25;
    --lh-body:  1.6;
    --measure:  68ch;

    /* Space — 4pt, named by role. */
    --space-3xs: 0.125rem;
    --space-2xs: 0.25rem;
    --space-xs:  0.5rem;
    --space-sm:  0.75rem;
    --space-md:  1rem;
    --space-lg:  1.5rem;
    --space-xl:  2.5rem;
    --space-2xl: 4rem;
    --space-3xl: 6rem;
    --space-4xl: 9rem;

    --page-max:    76rem;
    --page-gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);
    --nav-height:  4.25rem;

    /* Shape. */
    --radius-sm:   4px;
    --radius-md:   6px;
    --radius-lg:   10px;
    --radius-pill: 999px;
    --rule:        1px solid var(--color-rule);
    --shadow-whisper: 0 1px 2px oklch(19% 0.015 243 / 0.06);
    --shadow-panel:   0 24px 48px -24px oklch(19% 0.015 243 / 0.28);

    /* Motion. */
    --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --dur-micro: 120ms;
    --dur-short: 220ms;
    --dur-long:  420ms;

    /* Layers. */
    --z-raised:    10;
    --z-dropdown:  100;
    --z-sticky:    200;
    --z-sticky-nav: 300;
    --z-modal:     400;
    --z-toast:     500;
}