:root {
  --lp-bg: #080809;
  --lp-bg-elevated: #111114;
  --lp-surface: #18181c;
  --lp-surface-hover: #222228;
  --lp-border: rgba(255, 255, 255, 0.08);
  --lp-border-strong: rgba(255, 255, 255, 0.16);

  --lp-text: #f3f1ec;
  --lp-text-muted: #9b9890;
  --lp-text-dim: #5c5954;

  --lp-accent: #c4a962;
  --lp-accent-soft: rgba(196, 169, 98, 0.15);
  --lp-portal: #e8dcc8;
  --lp-portal-glow: rgba(232, 220, 200, 0.45);

  --lp-font-display: "Fraunces", "Georgia", serif;
  --lp-font-ui: "IBM Plex Sans", system-ui, sans-serif;

  --lp-space-xs: 0.5rem;
  --lp-space-sm: 1rem;
  --lp-space-md: 1.5rem;
  --lp-space-lg: 2.5rem;
  --lp-space-xl: 4rem;
  --lp-space-2xl: 6rem;

  --lp-radius-sm: 4px;
  --lp-radius-md: 8px;
  --lp-radius-lg: 16px;

  --lp-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --lp-duration: 0.5s;
  --lp-header-h: 72px;

  --lp-max: 1440px;
  --lp-content: 1120px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --lp-duration: 0.01ms;
  }
}