:root {
  --sparkle-pink: #FF4FA3;
  /* Accessible darker pink for body-weight italic emphasis on white bg.
     Sparkle Pink fails WCAG AA at small sizes (~3.8:1).
     Ink Pink lands at ~4.7:1 on white. */
  --ink-pink: #C8266F;
  --cat-eye-blue: #7FD8FF;
  --butter-yellow: #FFE15C;
  --myspace-black: #0B0B14;
  --page-white: #FFFFFF;
  --lime-glitter: #9CFF6E;
  --holo-lilac: #D9C7FF;
  --leopard-orange: #FF7A1A;

  --ink: #1B1B22;
  --ink-soft: #4A4A55;
  --hairline: rgba(11, 11, 20, 0.12);

  --font-wordmark: "Rubik Glitch", "Monoton", system-ui, sans-serif;
  --font-heading: "Cherry Bomb One", "Comic Sans MS", cursive;
  --font-label: "Bungee", "Impact", sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-papyrus: "Papyrus", "Copperplate", fantasy;
  --font-comic: "Comic Sans MS", "Chalkboard SE", cursive;

  --fs-wordmark: clamp(3rem, 12vw, 8rem);
  --fs-h1: clamp(2rem, 5vw, 3.25rem);
  --fs-h2: clamp(1.5rem, 3.5vw, 2.25rem);
  --fs-h3: 1.25rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-tiny: 0.75rem;

  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-body: 1.6;

  --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;

  --max-narrow: 640px;
  --max-prose: 720px;
  --max-content: 960px;
  --max-wide: 1140px;

  --bp-mobile: 480px;
  --bp-tablet: 720px;
  --bp-desktop: 1024px;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;

  --shadow-soft: 0 4px 18px rgba(11, 11, 20, 0.08);
  --shadow-lift: 0 10px 32px rgba(11, 11, 20, 0.18);
  --shadow-holo: 0 0 24px rgba(217, 199, 255, 0.65);

  --dur-fast: 180ms;
  --dur-med: 360ms;
  --dur-slow: 600ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
}
