:root {
  /* === Light Theme (Primary) === */
  --color-bg: #FFFFFF;
  --color-bg-soft: #FAF8FE;       /* lavender tint */
  --color-bg-muted: #F3EFFA;      /* soft purple */
  --color-surface: #FFFFFF;
  --color-surface-elev: #FFFFFF;

  --color-border: #E8E4F2;
  --color-border-strong: #D4CCE6;

  --color-text: #1A0F2E;
  --color-text-strong: #0F0820;
  --color-text-muted: #564A78;
  --color-text-dim: #7A6E95;
  --color-text-faint: #9F94B5;

  /* === Aurora Accent Palette === */
  --color-accent: #8B5CF6;        /* primary purple */
  --color-accent-hover: #7C3AED;
  --color-accent-soft: #F3EBFF;
  --color-accent-glow: rgba(139, 92, 246, 0.30);

  --color-accent-2: #06B6D4;      /* cyan */
  --color-accent-3: #EC4899;      /* pink */

  /* === Dark Theme (Aurora dark base) === */
  --color-dark-bg: #0A0817;
  --color-dark-surface: #14102A;
  --color-dark-surface-2: #1A1338;
  --color-dark-border: rgba(139, 92, 246, 0.18);
  --color-dark-text: #E8E2F5;
  --color-dark-text-muted: #B8AED0;
  --color-dark-text-dim: #8C82A8;
  --color-foil: #F0EBFA;

  --gradient-foil: linear-gradient(135deg, #F0EBFA 0%, #C4B5FD 50%, #F0EBFA 100%);
  --gradient-aurora: linear-gradient(135deg, #A78BFA 0%, #EC4899 50%, #22D3EE 100%);
  --gradient-aurora-soft: linear-gradient(135deg, rgba(167,139,250,0.15), rgba(236,72,153,0.10), rgba(34,211,238,0.15));
  --gradient-hero: linear-gradient(180deg, #FFFFFF 0%, #FAF8FE 100%);
  --gradient-dark: linear-gradient(180deg, #14102A 0%, #0A0817 100%);

  /* === Typography === */
  --font-sans: 'Pretendard', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-display: 'Pretendard', 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.25rem;
  --fs-4xl: 3rem;
  --fs-5xl: 4rem;
  --fs-6xl: 5.5rem;

  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-normal: 1.55;
  --lh-loose: 1.75;

  --tracking-tight: -0.025em;
  --tracking-normal: 0;
  --tracking-wide: 0.05em;
  --tracking-wider: 0.12em;
  --tracking-widest: 0.25em;

  /* === Spacing === */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 6rem;
  --space-16: 8rem;
  --space-20: 10rem;

  /* === Layout === */
  --container-max: 1280px;
  --container-narrow: 880px;
  --nav-height: 72px;

  /* === Effects === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 22px;

  --shadow-xs: 0 1px 2px rgba(10, 22, 40, 0.04);
  --shadow-sm: 0 2px 8px rgba(10, 22, 40, 0.05);
  --shadow-md: 0 8px 24px rgba(10, 22, 40, 0.08);
  --shadow-lg: 0 20px 60px rgba(10, 22, 40, 0.12);
  --shadow-card: 0 1px 3px rgba(10, 22, 40, 0.06), 0 6px 24px -10px rgba(10, 22, 40, 0.08);
  --shadow-card-hover: 0 4px 12px rgba(10, 22, 40, 0.08), 0 20px 40px -20px rgba(10, 22, 40, 0.18);

  --transition-fast: 160ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 280ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 520ms cubic-bezier(0.4, 0, 0.2, 1);

  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
}