@layer tokens {
  :root{
    color-scheme: dark;

    /* Primitive color layer */
    --color-black: #050505;
    --color-coal: #0c0c0b;
    --color-iron: #171715;
    --color-walnut: #3b2313;
    --color-bark: #21150f;
    --color-gold-dark: #76501b;
    --color-gold: #c9a84c;
    --color-gold-bright: #efd27a;
    --color-blood: #7e100b;
    --color-blood-bright: #b52a1d;
    --color-ember: #ef802f;
    --color-cream: #f2ead6;
    --color-warm-white: #fff8e8;
    --color-muted: #b9ad94;
    --color-muted-dark: #887d69;
    --color-black-alpha-96: rgba(5, 5, 5, 0.96);
    --color-black-alpha-90: rgba(5, 5, 5, 0.9);
    --color-black-alpha-72: rgba(5, 5, 5, 0.72);
    --color-black-alpha-24: rgba(5, 5, 5, 0.24);
    --color-gold-alpha-58: rgba(201, 168, 76, 0.58);
    --color-gold-alpha-32: rgba(201, 168, 76, 0.32);
    --color-gold-alpha-16: rgba(201, 168, 76, 0.16);
    --color-gold-alpha-08: rgba(201, 168, 76, 0.08);
    --color-blood-alpha-84: rgba(126, 16, 11, 0.84);
    --color-blood-alpha-44: rgba(126, 16, 11, 0.44);

    /* Primitive typography layer */
    --font-display: "Cinzel Decorative", Georgia, serif;
    --font-editorial: "Cormorant Garamond", Georgia, serif;
    --font-sans: "Inter", Arial, sans-serif;
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;
    --weight-black: 900;

    /* Primitive spacing and geometry layer */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-28: 7rem;
    --space-32: 8rem;
    --radius-none: 0;
    --radius-sm: 0.125rem;
    --border-thin: 1px;
    --border-strong: 2px;
    --duration-fast: 160ms;
    --duration-base: 240ms;
    --duration-slow: 420ms;
    --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
    --shadow-deep: 0 1.5rem 4rem rgba(0, 0, 0, 0.62);
    --shadow-gold: 0 0 2rem var(--color-gold-alpha-16);
    --z-base: 0;
    --z-content: 2;
    --z-header: 20;
    --z-skip: 100;

    /* Semantic layer */
    --bg-page: var(--color-black);
    --bg-surface: var(--color-coal);
    --bg-surface-raised: var(--color-iron);
    --bg-overlay: var(--color-black-alpha-90);
    --text-primary: var(--color-cream);
    --text-strong: var(--color-warm-white);
    --text-muted: var(--color-muted);
    --text-quiet: var(--color-muted-dark);
    --accent-primary: var(--color-gold);
    --accent-primary-strong: var(--color-gold-bright);
    --accent-primary-dark: var(--color-gold-dark);
    --accent-danger: var(--color-blood-bright);
    --accent-action: var(--color-blood);
    --accent-ember: var(--color-ember);
    --border-subtle: var(--color-gold-alpha-32);
    --border-emphasis: var(--color-gold-alpha-58);
    --focus-ring: var(--color-gold-bright);
    --selection-bg: var(--color-gold-alpha-32);
    --selection-text: var(--color-warm-white);
    --hero-scrim: linear-gradient(90deg, var(--color-black-alpha-90) 2%, var(--color-black-alpha-72) 20%, var(--color-black-alpha-24) 44%, transparent 70%);
    --hero-edge-fade: linear-gradient(180deg, transparent 70%, var(--bg-page) 100%);
    --surface-walnut: linear-gradient(135deg, var(--color-bark), var(--color-coal));

    /* Component layer */
    --page-gutter: clamp(var(--space-4), 4vw, var(--space-16));
    --container-max: 90rem;
    --header-height: 7.25rem;
    --header-height-compact: 5.25rem;
    --header-surface: var(--color-black-alpha-96);
    --header-border: var(--border-subtle);
    --header-logo-width: 15.5rem;
    --header-nav-gap: clamp(var(--space-5), 3vw, var(--space-12));
    --hero-min-height: calc(100svh - var(--header-height));
    --hero-content-width: 42rem;
    --hero-copy-shadow: 0 0.75rem 2.8rem var(--color-black);
    --button-height: 3.75rem;
    --button-padding: var(--space-4) var(--space-8);
    --button-primary-bg: var(--color-blood-alpha-84);
    --button-primary-hover: var(--color-blood-bright);
    --gallery-gap: clamp(var(--space-5), 2.5vw, var(--space-10));
    --gallery-caption: var(--text-muted);
    --gallery-filter-selected: var(--accent-primary-strong);
    --viewer-surface: var(--bg-surface);
    --viewer-control: var(--accent-primary-strong);
    --viewer-backdrop: var(--color-black-alpha-90);
    --viewer-metadata: var(--text-muted);
    --form-field: var(--bg-surface-raised);
    --form-error: var(--accent-danger);
    --form-confirmation: var(--accent-primary-strong);
    --section-padding: clamp(var(--space-20), 9vw, var(--space-32));
  }
}
