:root {
  /* ---------- Motion ---------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --duration-fast: 150ms; /* @kind other */
  --duration-base: 320ms; /* @kind other */
  --duration-slow: 640ms; /* @kind other */
  --duration-reveal: 900ms; /* @kind other */

  /* ---------- Shadow — used sparingly; the world is lit by gold, not drop shadow ---------- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.55);
  --shadow-gold-glow: 0 0 32px rgba(212, 169, 74, 0.25);

  /* ---------- Borders ---------- */
  --border-w-hairline: 1px;
  --border-w-strong: 1.5px;

  /* ---------- Blur (used for scrim panels over full-bleed imagery only) ---------- */
  --blur-panel: 16px;

  /* ---------- Gradients ---------- */
  --gradient-scrim-bottom: linear-gradient(180deg, transparent 0%, rgba(10, 8, 6, 0.85) 70%, rgba(10, 8, 6, 1) 100%); /* @kind other */
  --gradient-scrim-top: linear-gradient(0deg, transparent 0%, rgba(10, 8, 6, 0.7) 100%); /* @kind other */
  --gradient-gold-beam: linear-gradient(90deg, rgba(212, 169, 74, 0) 0%, rgba(212, 169, 74, 0.35) 100%); /* @kind other */
  --gradient-vignette: radial-gradient(ellipse at 50% 40%, rgba(10, 8, 6, 0) 0%, rgba(10, 8, 6, 0.75) 100%); /* @kind other */
}