:root {
  color-scheme: dark;

  --color-background: #0a0a0c;
  --color-background-deep: #060607;
  --color-surface: #151518;
  --color-surface-raised: #1c1c20;
  --color-surface-hover: #232329;

  --color-border: #2a2a2e;
  --color-border-strong: #454039;

  --color-text: #f2efe8;
  --color-text-muted: #c7c3bb;
  --color-text-subtle: #908c84;

  --color-gold: #d4af37;
  --color-gold-light: #f2d88b;
  --color-gold-dark: #8f6a24;

  --color-crimson: #881e1e;
  --color-crimson-hover: #a52a2a;
  --color-crimson-dark: #5b1215;

  --color-bronze: #80502a;
  --color-success: #63805c;
  --color-warning: #c8953d;
  --color-danger: #b44c4c;

  --color-shadow: rgba(0, 0, 0, 0.34);
  --color-vignette: rgba(0, 0, 0, 0.48);
  --color-overlay: rgba(8, 8, 10, 0.74);
  --color-surface-tint: rgba(255, 255, 255, 0.02);
  --color-gold-faint: rgba(212, 175, 55, 0.14);
  --color-gold-border: rgba(212, 175, 55, 0.35);
  --color-crimson-faint: rgba(136, 30, 30, 0.18);
  --color-success-faint: rgba(99, 128, 92, 0.18);
  --color-danger-faint: rgba(180, 76, 76, 0.18);

  --font-display: "Cinzel", Georgia, serif;
  --font-body: "Montserrat", Arial, sans-serif;
  --font-accent: "Cinzel Decorative", Georgia, serif;

  --font-size-display: clamp(2.8rem, 5vw, 5.2rem);
  --font-size-h1: clamp(2.2rem, 3.8vw, 3.6rem);
  --font-size-h2: clamp(1.7rem, 2.8vw, 2.5rem);
  --font-size-h3: clamp(1.15rem, 2vw, 1.5rem);
  --font-size-body: 1rem;
  --font-size-small: 0.875rem;
  --font-size-eyebrow: 0.75rem;

  --line-height-tight: 1.1;
  --line-height-copy: 1.7;
  --line-height-ui: 1.45;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;

  --radius-small: 0.375rem;
  --radius-medium: 0.5rem;
  --radius-large: 0.875rem;
  --radius-round: 999px;

  --border-thin: 1px;
  --border-strong: 1px;
  --container-max: 78rem;
  --container-narrow: 62rem;
  --container-padding: clamp(1rem, 4vw, 2rem);

  --shadow-soft: 0 10px 30px var(--color-shadow);
  --shadow-card: 0 16px 40px rgba(0, 0, 0, 0.28);
  --shadow-panel: 0 20px 60px rgba(0, 0, 0, 0.42);

  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-slow: 250ms;
  --ease-standard: ease;

  --focus-ring: 0 0 0 2px var(--color-background), 0 0 0 4px var(--color-gold);

  --surface-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0));
  --hero-vignette:
    radial-gradient(circle at top right, rgba(212, 175, 55, 0.08), transparent 32%),
    radial-gradient(circle at center left, rgba(136, 30, 30, 0.12), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0));
  --grain-pattern:
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.012) 0, transparent 18%),
    radial-gradient(circle at 80% 0%, rgba(255, 255, 255, 0.008) 0, transparent 24%),
    radial-gradient(circle at 50% 100%, rgba(255, 255, 255, 0.01) 0, transparent 22%);

  --poster-ratio: 27 / 40;
}