:root {
  /* Brand Colors */
  --color-primary: #3695ff;
  --color-secondary: #00ffe5;
  --color-accent: #ff3366;
  
  /* Glass Colors */
  --glass-primary: rgba(54, 149, 255, 0.4);
  --glass-secondary: rgba(0, 255, 229, 0.4);
  --glass-secondary2: rgba(0, 255, 229, 0.2);
  --glass-border: rgba(255, 255, 255, 0.18);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --glass-bg: #0a0a0f;
  --glass-bg-2: rgba(52, 52, 52, 0.15);
  --glass-card: rgba(255, 255, 255, 0.05);
  
  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
  --gradient-secondary: linear-gradient(135deg, var(--color-secondary), var(--color-primary));
  --gradient-accent: linear-gradient(135deg, #ff3366, #ff6b9d);
  --gradient-dark: linear-gradient(180deg, rgba(10, 10, 15, 0.95), rgba(10, 10, 15, 0.85));
  
  /* Text */
  --text-main: #ffffff;
  --text-secondary: #b8c5d6;
  --text-muted: #7a8ba0;
  
  /* Spacing */
  --spacing-xs: 0.5rem;
  --spacing-sm: 1rem;
  --spacing-md: 2rem;
  --spacing-lg: 4rem;
  --spacing-xl: 6rem;
  
  /* Radius & Blur */
  --btn-radius: 3rem;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-xl: 2rem;
  --blur-amount: 20px;
  --blur-amount-safari: 20px;
  
  /* Shadows */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.3);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.4);
  --shadow-glow: 0 0 20px rgba(54, 149, 255, 0.4);
  --shadow-glow-secondary: 0 0 20px rgba(0, 255, 229, 0.4);
  
  /* Transitions */
  --transition-fast: 0.2s ease;
  --transition-base: 0.3s ease;
  --transition-slow: 0.5s ease;
  
  /* Z-index */
  --z-background: -1;
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 500;
  --z-fixed: 1000;
  --z-modal: 2000;
  --z-tooltip: 3000;
}