:root {
    --font-ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-prose: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
    --font-mono: ui-monospace, "Cascadia Mono", "Segoe UI Mono", Menlo, Consolas, monospace;

    --type-display: 2.074rem;
    --type-h1: 1.728rem;
    --type-h2: 1.44rem;
    --type-h3: 1.2rem;
    --type-body: 1rem;
    --type-ui: 0.9375rem;
    --type-dense: 0.875rem;
    --type-small: 0.8125rem;
    --type-micro: 0.75rem;

    --leading-display: 1.2;
    --leading-h1: 1.25;
    --leading-h2: 1.3;
    --leading-h3: 1.35;
    --leading-body: 1.6;
    --leading-ui: 1.45;
    --leading-dense: 1.4;
    --leading-micro: 1.35;

    --space-0: 0;
    --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;

    --row-height: 40px;
    --touch-target: 44px;
    --gutter: var(--space-4);
    --content-max: 1600px;
    --prose-measure: 72ch;
    --node-width: 180px;
    --node-height: 64px;

    --radius-input: 4px;
    --radius-card: 6px;
    --radius-sheet: 8px;
    --border-hairline-width: 1px;
    --border-strong-width: 2px;
    --focus-ring-width: 3px;
    --focus-ring-offset: 2px;

    --lin-1: #523815;
    --lin-2: #225477;
    --lin-3: #716321;
    --lin-4: #2b806b;
    --lin-5: #987ece;
    --lin-6: #84ae32;
    --lin-7: #cbaadf;
    --lin-8: #e9c3bc;

    --lin-1-label: #ffffff;
    --lin-2-label: #ffffff;
    --lin-3-label: #ffffff;
    --lin-4-label: #ffffff;
    --lin-5-label: #17191c;
    --lin-6-label: #17191c;
    --lin-7-label: #17191c;
    --lin-8-label: #17191c;

    --ord-1: #15344a;
    --ord-2: #225477;
    --ord-3: #3a7aa6;
    --ord-4: #7facca;
    --ord-5: #cfe0ec;

    --ord-1-label: #ffffff;
    --ord-2-label: #ffffff;
    --ord-3-label: #ffffff;
    --ord-4-label: #17191c;
    --ord-5-label: #17191c;

    --band-male: #2a5b8c;
    --band-female: #8c3a6b;
    --band-unknown: #5a6168;

    --tint-1: #d7e2f2;
    --tint-2: #cde8e4;
    --tint-3: #f0d9ea;
    --tint-4: #f7decc;
    --tint-5: #e4ebc4;
    --tint-6: #e0e3e7;
    --tint-7: #dedaf5;
    --tint-8: #f6d6da;
    --tint-text: #17191c;
}

:root,
:root[data-theme="light"] {
    --bg-page: #ffffff;
    --bg-surface: #f4f6f8;
    --text-primary: #17191c;
    --text-muted: #5a6168;
    --link: #0b5c9b;
    --link-visited: #6b3f9e;
    --on-primary: #ffffff;
    --danger: #a32015;
    --success: #1b6b44;
    --warning: #7a4e00;
    --border-strong: #767e86;
    --border-hairline: #c9cfd5;
    --focus-ring: #0b5c9b;
    color-scheme: light;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --bg-page: #14171a;
        --bg-surface: #1d2126;
        --text-primary: #e8eaed;
        --text-muted: #a9b1b9;
        --link: #79b8f0;
        --link-visited: #c3a6f0;
        --on-primary: #0b1116;
        --danger: #f08b80;
        --success: #6ecf9c;
        --warning: #e0b050;
        --border-strong: #6b747c;
        --border-hairline: #2c3238;
        --focus-ring: #79b8f0;
        color-scheme: dark;
    }
}

:root[data-theme="dark"] {
    --bg-page: #14171a;
    --bg-surface: #1d2126;
    --text-primary: #e8eaed;
    --text-muted: #a9b1b9;
    --link: #79b8f0;
    --link-visited: #c3a6f0;
    --on-primary: #0b1116;
    --danger: #f08b80;
    --success: #6ecf9c;
    --warning: #e0b050;
    --border-strong: #6b747c;
    --border-hairline: #2c3238;
    --focus-ring: #79b8f0;
    color-scheme: dark;
}

@media (min-width: 48rem) {
    :root {
        --gutter: var(--space-5);
    }
}

@media (min-width: 64rem) {
    :root {
        --gutter: var(--space-6);
    }
}

@media print {
    :root,
    :root[data-theme="light"],
    :root[data-theme="dark"] {
        --bg-page: #ffffff;
        --bg-surface: #f4f6f8;
        --text-primary: #17191c;
        --text-muted: #5a6168;
        --link: #0b5c9b;
        --link-visited: #6b3f9e;
        --on-primary: #ffffff;
        --danger: #a32015;
        --success: #1b6b44;
        --warning: #7a4e00;
        --border-strong: #767e86;
        --border-hairline: #c9cfd5;
        --focus-ring: #0b5c9b;
        color-scheme: light;
    }
}