/* NEVER YOUR — design tokens (see docs/DESIGN-SYSTEM.md) */
:root {
    --color-black: #000000;
    --color-charcoal: #0a0a0a;
    --color-midnight: #0f1419;
    --color-dark: #1a1a1a;
    --color-graphite: #121212;
    --color-surface: #161616;
    --color-gold: #D4AF37;
    --color-platinum: #E5E4E2;
    --color-white: #FFFFFF;
    --color-electric: #F0F0F0;

    --accent-games: #5b8cff;
    --accent-sounds: #c45cff;
    --accent-books: #d4a574;
    --accent-entertainment: #d4af37;
    --accent-games-dim: rgba(91, 140, 255, 0.12);
    --accent-sounds-dim: rgba(196, 92, 255, 0.12);
    --accent-books-dim: rgba(212, 165, 116, 0.14);
    --accent-entertainment-dim: rgba(212, 175, 55, 0.1);

    --font-serif: 'Playfair Display', serif;
    --font-sans: 'Inter', sans-serif;

    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 2rem;
    --spacing-lg: 4rem;
    --spacing-xl: 8rem;

    --transition-slow: 1s cubic-bezier(0.25, 0.1, 0.25, 1);
    --transition-normal: 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
    --transition-fast: 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
    --transition-ceremonial: 1.2s cubic-bezier(0.2, 0, 0.2, 1);

    --motion-subtle: 4px;
    --motion-gentle: 8px;

    --layout-max: 1200px;
    --nav-compact-break: 1100px;

    --motion-page-entry: 1s;
    --motion-section: 0.8s;
    --motion-hover: 0.5s;
    --motion-axis-pulse: 8s;
}