:root {
    color-scheme: light;

    --color-paper: oklch(98.5% 0.009 78);
    --color-paper-2: oklch(95.5% 0.014 72);
    --color-ink: oklch(23.5% 0.018 55);
    --color-ink-2: oklch(42% 0.022 58);
    --color-muted: oklch(51% 0.020 62);
    --color-rule: oklch(86% 0.021 72);
    --color-rule-strong: oklch(61% 0.030 55);
    --color-accent: oklch(43% 0.120 25);
    --color-accent-hover: oklch(35% 0.130 25);
    --color-accent-ink: oklch(98.5% 0.009 78);
    --color-focus: oklch(48% 0.150 25);

    --font-display: ui-serif, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Charter, Georgia, serif;
    --font-body: "Avenir Next", Avenir, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-outlier: ui-monospace, "SFMono-Regular", "Cascadia Mono", "Roboto Mono", Consolas, monospace;

    --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;
    --space-page-inline: clamp(1.25rem, 6vw, 4.5rem);

    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-md: 1.125rem;
    --text-2xl: 1.9531rem;
    --text-display: clamp(2.75rem, 5vw + 1rem, 4.25rem);

    --rule-hairline: 1px;
    --rule-focus: 2px;
    --radius-media: 0.25rem;
    --measure-page: 66rem;
    --measure-prose: 65ch;
    --size-target: 2.75rem;
    --size-portrait-mobile: 8.75rem;
    --size-portrait-desktop: 11rem;
    --size-icon: 1.0625rem;
    --z-sticky: 200;
}

[data-theme="dark"] {
    color-scheme: dark;

    --color-paper: oklch(0% 0 0);
    --color-paper-2: oklch(14% 0.014 55);
    --color-ink: oklch(95% 0.012 78);
    --color-ink-2: oklch(78% 0.018 72);
    --color-muted: oklch(68% 0.019 65);
    --color-rule: oklch(28% 0.022 55);
    --color-rule-strong: oklch(50% 0.032 45);
    --color-accent: oklch(75% 0.095 25);
    --color-accent-hover: oklch(84% 0.075 25);
    --color-accent-ink: oklch(0% 0 0);
    --color-focus: oklch(78% 0.120 25);
}
