:root {
  --black: #000000;
  --black-50: #070707;
  --black-100: #0d0d0d;
  --black-200: #141414;
  --black-300: #1c1c1c;
  --black-400: #262626;
  --silver-100: #f5f5f5;
  --silver-200: #d9d9d9;
  --silver-300: #bfbfbf;
  --silver-400: #a6a6a6;
  --silver-500: #8c8c8c;
  --silver-600: #737373;
  --silver-700: #595959;
  --silver-800: #404040;
  --silver-900: #262626;
  --white: #ffffff;
  --white-10: rgba(255,255,255,0.1);
  --white-20: rgba(255,255,255,0.2);
  --white-5: rgba(255,255,255,0.05);
  --white-3: rgba(255,255,255,0.03);
  --black-80: rgba(0,0,0,0.85);

  --font-display: 'Syne', sans-serif;
  --font-body: 'Outfit', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  --gradient-silver: linear-gradient(135deg, #e0e0e0 0%, #a0a0a0 50%, #707070 100%);
  --gradient-silver-subtle: linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.01) 100%);
  --gradient-silver-glow: linear-gradient(135deg, rgba(192,192,192,0.25) 0%, rgba(128,128,128,0.08) 100%);
  --gradient-card: linear-gradient(165deg, #141414 0%, #0a0a0a 100%);
  --gradient-card-hover: linear-gradient(165deg, #1a1a1a 0%, #0f0f0f 100%);

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.5);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.5);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.6);
  --shadow-xl: 0 16px 64px rgba(0,0,0,0.7);
  --shadow-silver: 0 0 20px rgba(192,192,192,0.08);
  --shadow-silver-lg: 0 0 40px rgba(192,192,192,0.12);

  --border-silver: 1px solid rgba(255,255,255,0.07);
  --border-silver-light: 1px solid rgba(255,255,255,0.12);
  --border-silver-hover: 1px solid rgba(255,255,255,0.2);

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  --nav-height: 68px;
  --max-width: 1280px;
  --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-med: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}