/* Design tokens: Paper default, Night overrides */

:root {
    --plate-bg: #0A0E1A;
    --plate-ink: #F4F1EA;
    /* Vellum surfaces */
    --sheet-solid: #FBF9F4;
    --sheet-tint: #F4F1EA;
    --sheet-highlight: #FFFFFF;
    --sheet-faint: #5A6479;
    --sheet-edge: #C2BAA8;
    --sheet-shadow: rgba(43, 39, 28, .13);
    --sheet-inner: rgba(255, 255, 255, .7);
    --sheet-wash: color-mix(in srgb, var(--sheet-solid) 94%, transparent);
    --sheet-glint: color-mix(in srgb, var(--sheet-highlight) 16%, transparent);
    --px: 50%;
    --py: 0%;

    /* Palette: Paper */
    --bg: #F4F1EA;
    --bg-elev: #FBF9F4;
    --bg-elev-2: #F4F1EA;
    --border: #D9D3C4;
    --border-strong: #C2BAA8;
    --text: #10172A;
    --text-muted: #3B4459;
    --text-faint: #5A6479;
    --accent: #0E7490;
    --accent-strong: #155E75;
    --accent-text: #0E7490;
    --accent-fill: #22D3EE;
    --accent-glow: rgba(8, 145, 178, 0.12);
    --spotlight-dark: rgba(34, 211, 238, 0.10);
    --spotlight-light: rgba(8, 145, 178, 0.08);
    --spotlight: var(--spotlight-light);
    --hero-glow-opacity: 0.5;
    --modal-backdrop: rgba(0, 0, 0, 0.55);
    --danger: #B91C1C;
    --btn-primary-bg: #0E7490;
    --btn-primary-fg: #FFFFFF;
    --btn-primary-bg-hover: #155E75;
    --mask-solid: #000000;
    --space-section: 72px;

    /* Blueprint vocabulary, inherited by both editions */
    --grid-line: rgba(59, 68, 89, 0.08);
    --dim-line: var(--border-strong);
    --annotation: var(--text-faint);
    --node: var(--bg-elev);
    --node-active: var(--accent-fill);
    --map-glow: color-mix(in srgb, var(--node-active) 12%, transparent);
    --edge: var(--text-faint);
    --edge-active: var(--accent);

    /* Typography */
    --font-display: 'Fraunces', Georgia, serif;
    --font-ui: 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'Geist Mono', 'SF Mono', 'Fira Code', monospace;

    /* Type scale (rem, with clamp for display-xl) */
    --fs-display-xl: clamp(3rem, 7vw, 5rem);
    --fs-display-lg: clamp(2.25rem, 5vw, 3.5rem);
    --fs-display-md: clamp(1.75rem, 3.5vw, 2.5rem);
    --fs-title: 1.5rem;
    --fs-body-lg: 1.125rem;
    --fs-body: 1rem;
    --fs-caption: 0.875rem;
    --fs-micro: 0.75rem;

    /* Spacing */
    --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;
    --space-10: 128px;

    /* Radius */
    --radius-sm: 6px;
    --radius: 12px;
    --radius-lg: 20px;
    --radius-full: 9999px;

    /* Elevation */
    --elev-1: inset 0 0 0 1px var(--border);
    --elev-2: inset 0 0 0 1px var(--border-strong), 0 12px 40px -12px rgba(15, 23, 41, 0.12);

    /* Layout */
    --max-width: 1200px;
    --max-width-narrow: 760px;

    /* Motion */
    --ease: cubic-bezier(0.2, 0.6, 0.2, 1);
    --t-fast: 150ms;
    --t-med: 300ms;
}

[data-theme="dark"] {
    /* Vellum surfaces */
    --sheet-solid: #0F1729;
    --sheet-tint: #0A0E1A;
    --sheet-highlight: #182238;
    --sheet-faint: #A8B6CE;
    --sheet-edge: #446073;
    --sheet-shadow: rgba(0, 0, 0, .4);
    --sheet-inner: rgba(139, 149, 176, .35);

    /* Palette: dark */
    --bg: #0A0E1A;
    --bg-elev: #0F1729;
    --bg-elev-2: #141E36;
    --border: #1E2A44;
    --border-strong: #2A3B5E;
    --text: #E8ECF5;
    --text-muted: #8B95B0;
    --text-faint: #7A86A3;
    --accent: #22D3EE;
    --accent-strong: #06B6D4;
    --accent-glow: rgba(34, 211, 238, 0.15);

    --spotlight-dark: rgba(34, 211, 238, 0.10);
    --spotlight-light: rgba(8, 145, 178, 0.08);
    --modal-backdrop: rgba(0, 0, 0, 0.55);
    --danger: #F87171;
    --accent-text: #22D3EE;
    --btn-primary-bg: #22D3EE;
    --btn-primary-fg: #04121A;
    --btn-primary-bg-hover: #06B6D4;

    --elev-2: inset 0 0 0 1px var(--border-strong), 0 12px 40px -12px rgba(0,0,0,0.6);
    --spotlight: var(--spotlight-dark);
    --hero-glow-opacity: 1;
    --grid-line: rgba(139, 149, 176, 0.08);
}

:root { --nav-offset: 88px; }
@media (max-width: 720px) { :root { --nav-offset: 128px; } }