:root {
  /* Fonts */
  --font-title: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Theme color configuration */
  --bg-color-1: #08081a;
  --bg-color-2: #0f0f2e;
  --text-primary: #ffffff;
  --text-secondary: rgba(255, 255, 255, 0.7);
  --text-muted: rgba(255, 255, 255, 0.4);
  
  /* Primary HSL Accent configuration */
  --accent-h: 262;
  --accent-s: 83%;
  --accent-l: 58%;
  
  /* Derived colors */
  --accent: hsl(var(--accent-h) var(--accent-s) var(--accent-l));
  --accent-light: hsl(var(--accent-h) var(--accent-s) calc(var(--accent-l) + 15%));
  --accent-dark: hsl(var(--accent-h) var(--accent-s) calc(var(--accent-l) - 15%));
  --accent-glow: hsla(var(--accent-h) var(--accent-s) var(--accent-l) / 0.4);
  --accent-bg: hsla(var(--accent-h) var(--accent-s) var(--accent-l) / 0.1);

  /* Liquid Glass Styles */
  --glass-bg: rgba(255, 255, 255, 0.03);
  --glass-bg-hover: rgba(255, 255, 255, 0.08);
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-border-light: rgba(255, 255, 255, 0.15);
  --glass-blur: 40px;
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);

  /* Alert / Info Colors */
  --color-success: #10b981;
  --color-error: #ef4444;
  --color-warn: #f59e0b;
  --color-info: #3b82f6;

  /* Sizing and borders */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 30px;
  --border-width: 1px;

  /* Animation Easing Curve Tokens */
  --spring-bounce: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --spring-gentle: cubic-bezier(0.34, 1.56, 0.64, 1);
  --spring-snappy: cubic-bezier(0.68, -0.6, 0.32, 1.6);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 150ms var(--ease-standard);
  --transition-normal: 300ms var(--ease-standard);
  --transition-slow: 500ms var(--ease-standard);
}

/* Midnight AMOLED Theme */
[data-theme="midnight"] {
  --bg-color-1: #000000;
  --bg-color-2: #0a0a0a;
  --glass-bg: rgba(255, 255, 255, 0.015);
  --glass-border: rgba(255, 255, 255, 0.05);
  --glass-border-light: rgba(255, 255, 255, 0.1);
  --glass-shadow: 0 4px 20px rgba(0, 0, 0, 0.8);
}

/* Deep Ocean Blue Theme */
[data-theme="ocean"] {
  --bg-color-1: #060e1a;
  --bg-color-2: #0d1e36;
  --glass-bg: rgba(255, 255, 255, 0.04);
  --glass-border: rgba(255, 255, 255, 0.07);
  --glass-border-light: rgba(255, 255, 255, 0.13);
}

/* Light Glassmorphic Theme */
[data-theme="light"] {
  --bg-color-1: #f3f4f6;
  --bg-color-2: #ffffff;
  --text-primary: #1f2937;
  --text-secondary: rgba(31, 41, 55, 0.8);
  --text-muted: rgba(31, 41, 55, 0.5);
  --glass-bg: rgba(255, 255, 255, 0.45);
  --glass-bg-hover: rgba(255, 255, 255, 0.65);
  --glass-border: rgba(31, 41, 55, 0.1);
  --glass-border-light: rgba(31, 41, 55, 0.18);
  --glass-shadow: 0 8px 32px rgba(31, 41, 55, 0.08);
}