:root {
  /* Colors - Light Mode / Apple Inspired */
  --bg-body: #FFFFFF;
  --bg-surface: #F5F5F7;
  --bg-surface-hover: #E8E8ED;
  
  --text-primary: #1D1D1F;
  --text-secondary: #86868B;
  --text-on-accent: #FFFFFF;

  /* Brand Accent - Pink */
  /* Using a vibrant pink based on standard vibrant pinks, can adjust if hex is provided later */
  --accent-pink: #E6007E; 
  --accent-pink-hover: #C4006B;

  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  
  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 48px;
  --space-2xl: 80px;

  /* Layout */
  --container-width: 1200px;
  --header-height: 60px;

  /* Effects */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.12);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --transition-fast: 0.2s ease;
  --transition-smooth: 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}