:root {
  /* Background */
  --bg-primary:     transparent;
  --bg-secondary:   rgba(255, 255, 255, 0.04);
  --bg-card:        rgba(255, 255, 255, 0.05);
  --bg-card-hover:  rgba(255, 255, 255, 0.08);
  --bg-glass:       rgba(22, 17, 10, 0.7);
  --bg-glass-hover: rgba(22, 17, 10, 0.9);
  --bg-overlay:     rgba(0, 0, 0, 0.75);
  --bg-dark:        #16110A;
  --bg-dark-card:   rgba(255, 255, 255, 0.06);

  /* Brand */
  --brand:          #1A1A1A;
  --brand-accent:   #E6A33C;
  --brand-accent-hover: #C47923;
  --brand-accent-light: rgba(230, 163, 60, 0.1);
  --brand-accent-glow:  rgba(230, 163, 60, 0.35);
  --brand-gradient: linear-gradient(135deg, #FFE270 0%, #E6A33C 50%, #C47923 100%);
  --brand-green:    #25D366;
  --brand-green-hover: #1EBE59;
  --success:        #10B981;
  --error:          #EF4444;
  --warning:        #F59E0B;
  --info:           #3B82F6;

  /* Text */
  --text-primary:   #FFFFFF;
  --text-secondary: #B0B0B0;
  --text-muted:     #7A7A7A;
  --text-accent:    var(--brand-accent);
  --text-on-dark:   #FFFFFF;
  --text-on-accent: #0C0804;

  /* Borders */
  --border-light:   rgba(255, 255, 255, 0.08);
  --border-medium:  rgba(255, 255, 255, 0.15);
  --border-dark:    rgba(255, 255, 255, 0.25);
  --border-accent:  var(--brand-accent);
  --border-radius-sm:  8px;
  --border-radius:     12px;
  --border-radius-lg:  20px;
  --border-radius-xl:  28px;
  --border-radius-full:9999px;

  /* Typography */
  --font-heading:   'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-body:      'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: 1rem;
  --fs-md:   1.125rem;
  --fs-lg:   1.25rem;
  --fs-xl:   1.5rem;
  --fs-2xl:  2rem;
  --fs-3xl:  2.5rem;
  --fs-4xl:  3.25rem;
  --fs-5xl:  4rem;

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-black:    900;

  --lh-tight:  1.15;
  --lh-snug:   1.35;
  --lh-normal: 1.6;
  --lh-loose:  1.8;

  /* Spacing */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* Shadows */
  --shadow-xs:  0 2px 4px rgba(0,0,0,0.02);
  --shadow-sm:  0 4px 8px rgba(0,0,0,0.04);
  --shadow-md:  0 8px 16px rgba(0,0,0,0.06);
  --shadow-lg:  0 16px 32px rgba(0,0,0,0.08);
  --shadow-xl:  0 24px 64px rgba(0,0,0,0.1);
  --shadow-card: 0 4px 24px rgba(0,0,0,0.04);
  --shadow-card-hover: 0 16px 40px rgba(0,0,0,0.1);

  /* Transitions */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast:    150ms;
  --dur-normal:  250ms;
  --dur-slow:    400ms;

  /* Layout */
  --header-h:    68px;
  --max-w:       1200px;
  --max-w-sm:    900px;

  /* Z-index */
  --z-base:    1;
  --z-card:    10;
  --z-header:  100;
  --z-modal:   300;
  --z-toast:   400;
}