:root {
  --radius-0: 0;
  --radius-1: 2px;
  --radius-2: 4px;
  --radius-pill: 999px;
  --radius-sm: var(--radius-1);
  --radius-md: var(--radius-2);
  --radius-card: var(--radius-2);
  --radius-lg: var(--radius-2);
  --shadow-book: 0 2px 4px rgba(0, 0, 0, .5),
                 0 24px 48px -12px rgba(0, 0, 0, .75),
                 0 0 80px -20px rgba(240, 180, 90, .35);
  --shadow-card: 0 1px 0 rgba(255, 230, 180, .05) inset,
                 0 12px 32px -16px rgba(0, 0, 0, .6);
  --shadow-soft: 0 12px 32px -16px rgba(0, 0, 0, .6);
  --shadow-lift: 0 18px 40px -16px rgba(0, 0, 0, .7);
  --glow-button: 0 0 32px -6px rgba(240, 207, 138, .55);
  --glow-sun: radial-gradient(60% 50% at 50% 40%, rgba(255, 220, 140, .28), rgba(255, 220, 140, 0) 70%);
  --scrim-bottom: linear-gradient(180deg, rgba(17, 11, 10, 0) 0%, rgba(17, 11, 10, .85) 70%, var(--night-900) 100%);
  --scrim-left: linear-gradient(90deg, rgba(17, 11, 10, .92) 0%, rgba(17, 11, 10, .6) 45%, rgba(17, 11, 10, 0) 80%);
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --dur-fast: 160ms;
  --dur-base: 280ms;
  --dur-slow: 900ms;
  --duration-fast: var(--dur-fast);
  --duration-base: var(--dur-base);
  --duration-slow: var(--dur-slow);
  --hover-rise: translateY(-2px);
}
@keyframes ds-fade-up {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
