:root {
  color-scheme: dark;

  --color-outer: #03070b;
  --color-stone: #080d13;
  --color-ink: #02070c;
  --color-navy: #06111a;
  --color-panel: #081722;
  --color-panel-raised: #0b1f2d;
  --color-panel-deep: #04101a;
  --color-line: #263b49;
  --color-line-strong: #455d6d;

  --color-text: #f5f7fb;
  --color-text-soft: #c3ccd6;
  --color-muted: #8e9aa7;
  --color-faint: #637281;

  --color-gold: #f0ad2c;
  --color-gold-bright: #ffd563;
  --color-gold-deep: #a96306;
  --color-elixir: #d34bbd;
  --color-elixir-bright: #f06ad9;
  --color-dark: #6f35b5;
  --color-dark-bright: #9b5be0;
  --color-cyan: #21baff;
  --color-blue: #1462bd;
  --color-blue-bright: #2d8bf0;
  --color-green: #29d469;
  --color-green-deep: #0c5e35;
  --color-orange: #d95421;
  --color-orange-bright: #ff7a32;
  --color-error: #ff6b5f;

  --font-body: "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif;
  --font-display: "Bahnschrift", "Arial Narrow", Arial, sans-serif;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: clamp(1.05rem, 1.6vw, 1.25rem);
  --text-h2: clamp(2.15rem, 4vw, 4.15rem);
  --text-hero: clamp(3.6rem, 5.15vw, 6.25rem);

  --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: 4.5rem;

  --container: 76rem;
  --container-wide: 100rem;
  --section-space: clamp(5rem, 8vw, 8rem);
  --cut-sm: 0.5rem;
  --cut-md: 0.9rem;
  --cut-lg: 1.4rem;
  --duration-fast: 160ms;

  --z-base: 0;
  --z-raised: 10;
  --z-stage: 20;
  --z-nav: 30;
  --z-menu: 40;

  --shadow-panel: 0.8rem 0.9rem 0 rgba(0, 0, 0, 0.34);
  --shadow-deep: 1.1rem 1.25rem 0 rgba(0, 0, 0, 0.42);
}