:root,
[data-theme="light"] {
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-3xl: clamp(2.5rem, 1rem + 4vw, 5rem);
  --text-hero: clamp(3rem, 0.5rem + 6vw, 7rem);
  --text-giant: clamp(4rem, 1rem + 9vw, 11rem);
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-full: 9999px;
  --content-narrow: 640px;
  --content-default: 960px;
  --content-wide: 1200px;
  --shadow-glow-sm: 0 0 12px color-mix(in oklch, var(--brand-primary-500) 25%, transparent);
  --shadow-glow-md: 0 0 28px color-mix(in oklch, var(--brand-primary-500) 35%, transparent), 0 0 8px color-mix(in oklch, var(--brand-primary-500) 20%, transparent);
  --shadow-glow-lg: 0 0 60px color-mix(in oklch, var(--brand-primary-500) 30%, transparent), 0 0 20px color-mix(in oklch, var(--brand-primary-500) 20%, transparent);
  --radius: 0.5rem;
  --font-display: "Space Grotesk Variable";
  --font-body: "Inter Variable";
  --font-mono: "Fira Code Variable";
  --transition-interactive: 200ms cubic-bezier(0.16, 1, 0.3, 1);
  --brand-primary-50: #fff6f8;
  --brand-primary-100: #ffe7ed;
  --brand-primary-200: #fed0dc;
  --brand-primary-300: #f7abc1;
  --brand-primary-400: #ef78a0;
  --brand-primary-500: #e13c80;
  --brand-primary-600: #bf0063;
  --brand-primary-700: #8f0049;
  --brand-primary-800: #610030;
  --brand-primary-900: #40001d;
  --brand-primary-950: #21000c;
  --brand-accent-50: #fbf6ff;
  --brand-accent-100: #f4eafd;
  --brand-accent-200: #e8d5f8;
  --brand-accent-300: #d6b5ef;
  --brand-accent-400: #c08ae7;
  --brand-accent-500: #aa5cdc;
  --brand-accent-600: #9129c8;
  --brand-accent-700: #6f089e;
  --brand-accent-800: #4c006e;
  --brand-accent-900: #300346;
  --brand-accent-950: #160223;
  --brand-neutral-50: #f8f8f9;
  --brand-neutral-100: #eeeef0;
  --brand-neutral-200: #dddee0;
  --brand-neutral-300: #c3c4c8;
  --brand-neutral-400: #a3a4aa;
  --brand-neutral-500: #85858e;
  --brand-neutral-600: #676872;
  --brand-neutral-700: #4c4c54;
  --brand-neutral-800: #323238;
  --brand-neutral-900: #1f1f23;
  --brand-neutral-950: #0d0d0f;
  --background: #ffffff;
  --foreground: #1f1f23;
  --card: #f8f8f9;
  --primary: #bf0063;
  --primary-foreground: #ffffff;
  --muted: #eeeef0;
  --muted-foreground: #676872;
  --border: #c3c4c8;
  --ring: #bf0063;
  --accent: #aa5cdc;
  --accent-foreground: #0a0a0a;
  --canvas-0: oklch(16.6% 0.027 283.1);
  --canvas-1: oklch(60.3% 0.244 0.4);
  --canvas-2: oklch(50% 0.23 310);
  --canvas-3: oklch(94.8% 0.011 280.5);
}

[data-theme="dark"] {
  --background: #0d0d1a;
  --foreground: #f8f8f9;
  --card: #1f1f23;
  --primary: #ef78a0;
  --primary-foreground: #0a0a0a;
  --muted: #1f1f23;
  --muted-foreground: #a3a4aa;
  --border: #323238;
  --ring: #ef78a0;
  --accent: #c08ae7;
  --accent-foreground: #0a0a0a;
}