:root {
    --graphite: #262b31;
    --graphite-rgb: 38, 43, 49;
    --beige: #f3ede4;
    --beige-rgb: 243, 237, 228;
    --capri-sea: #5ea7c7;
    --capri-sea-rgb: 94, 167, 199;

    --bg-fallback: var(--graphite);
    --bg: var(--graphite);
    --bg-soft: rgba(var(--graphite-rgb), 0.94);
    --text: var(--beige);
    --muted: rgba(var(--beige-rgb), 0.9);
    --muted-soft: rgba(var(--beige-rgb), 0.74);
    --line: rgba(var(--beige-rgb), 0.14);
    --line-strong: rgba(var(--beige-rgb), 0.26);
    --surface: rgba(var(--graphite-rgb), 0.76);
    --surface-strong: rgba(var(--graphite-rgb), 0.9);
    --surface-soft: rgba(var(--beige-rgb), 0.06);
    --surface-bone: var(--beige);
    --ink: var(--graphite);
    --accent: var(--capri-sea);
    --accent-soft: rgba(var(--capri-sea-rgb), 0.16);
    --shadow-soft: 0 20px 42px rgba(var(--graphite-rgb), 0.26);
    --shadow-strong: 0 28px 72px rgba(var(--graphite-rgb), 0.38);
    --glass-fill: rgba(var(--graphite-rgb), 0.3);
    --glass-fill-strong: rgba(var(--graphite-rgb), 0.46);
    --glass-edge: rgba(var(--beige-rgb), 0.16);
    --glass-edge-soft: rgba(var(--beige-rgb), 0.08);
    --glass-specular: rgba(var(--beige-rgb), 0.18);
    --glass-shadow:
        0 20px 46px rgba(var(--graphite-rgb), 0.28),
        0 2px 12px rgba(var(--graphite-rgb), 0.16);
    --glass-inset:
        inset 0 1px 0 rgba(var(--beige-rgb), 0.18),
        inset 1px 1.5px 0 rgba(var(--beige-rgb), 0.08),
        inset 0 -16px 28px rgba(var(--beige-rgb), 0.03),
        inset 0 -1px 0 rgba(var(--beige-rgb), 0.04);
    --glass-blur: blur(20px) saturate(150%);
    --text-shadow-soft: none;
    --text-shadow-strong: none;
    --radius-xl: 28px;
    --radius-lg: 20px;
    --radius-md: 14px;
    --radius-sm: 10px;
    --ease-standard: cubic-bezier(0.2, 0, 0, 1);
    --ease-emphasized: cubic-bezier(0.4, 0, 0.2, 1);
    --ease-decelerate: cubic-bezier(0, 0, 0.2, 1);
    --shadow-elev-1: 0 1px 2px rgba(var(--graphite-rgb), 0.06), 0 1px 1px rgba(var(--graphite-rgb), 0.04);
    --shadow-elev-2: 0 2px 4px rgba(var(--graphite-rgb), 0.06), 0 4px 8px rgba(var(--graphite-rgb), 0.06);
    --shadow-elev-3: 0 4px 8px rgba(var(--graphite-rgb), 0.08), 0 8px 24px rgba(var(--graphite-rgb), 0.08);
    --container: min(1320px, calc(100vw - 40px));
    --header-height: 84px;

    --display: "Instrument Serif", serif;
    --text-font: "Geist", sans-serif;
    --code-font: "JetBrains Mono", monospace;

    --transition-fast: 0.22s ease;
    --transition-base: 0.34s ease;
    --reveal-transition: 0.82s cubic-bezier(0.2, 0.8, 0.2, 1);
}