/* ═══════════════════════════════════════════════════════════════
   NOVA DESIGN SYSTEM — Tokens & Variables
   Import this file first in any project.
   ═══════════════════════════════════════════════════════════════

   Usage: @import './nova-tokens.css';

   ═══════════════════════════════════════════════════════════════ */

:root {

  /* ─── Color Palette ─── */
  --nova-bg:            #000000;
  --nova-bg-02:         #05050f;
  --nova-bg-03:         #0a0a1a;

  --nova-surface-01:    rgba(255,255,255,0.03);
  --nova-surface-02:    rgba(255,255,255,0.06);
  --nova-surface-03:    rgba(255,255,255,0.09);
  --nova-surface-04:    rgba(255,255,255,0.13);

  --nova-border:        rgba(255,255,255,0.08);
  --nova-border-md:     rgba(255,255,255,0.12);
  --nova-border-bright: rgba(255,255,255,0.18);

  /* Brand */
  --nova-indigo:        #6366F1;
  --nova-indigo-light:  #818CF8;
  --nova-indigo-dark:   #4F46E5;
  --nova-violet:        #8B5CF6;
  --nova-violet-light:  #A78BFA;
  --nova-cyan:          #06B6D4;
  --nova-cyan-light:    #22D3EE;
  --nova-blue:          #3B82F6;
  --nova-blue-light:    #60A5FA;
  --nova-green:         #10B981;
  --nova-green-light:   #34D399;
  --nova-amber:         #F59E0B;
  --nova-amber-light:   #FCD34D;
  --nova-red:           #EF4444;
  --nova-red-light:     #F87171;
  --nova-pink:          #EC4899;
  --nova-orange:        #F97316;

  /* Text */
  --nova-text-primary:   rgba(255,255,255,0.95);
  --nova-text-secondary: rgba(255,255,255,0.55);
  --nova-text-tertiary:  rgba(255,255,255,0.32);
  --nova-text-disabled:  rgba(255,255,255,0.2);

  /* ─── Typography ─── */
  --nova-font:      -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', 'Segoe UI', sans-serif;
  --nova-font-mono: 'SF Mono', 'Fira Code', 'Cascadia Code', 'Consolas', monospace;

  --nova-text-xs:   11px;
  --nova-text-sm:   13px;
  --nova-text-base: 15px;
  --nova-text-md:   17px;
  --nova-text-lg:   20px;
  --nova-text-xl:   24px;
  --nova-text-2xl:  32px;
  --nova-text-3xl:  40px;
  --nova-text-4xl:  56px;
  --nova-text-5xl:  72px;

  --nova-weight-regular: 400;
  --nova-weight-medium:  500;
  --nova-weight-semi:    600;
  --nova-weight-bold:    700;
  --nova-weight-black:   900;

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

  /* ─── Border Radius ─── */
  --nova-radius-xs: 4px;
  --nova-radius-sm: 8px;
  --nova-radius-md: 12px;
  --nova-radius-lg: 16px;
  --nova-radius-xl: 20px;
  --nova-radius-2xl:28px;
  --nova-radius-3xl:40px;
  --nova-radius-full: 9999px;

  /* ─── Blur (Glassmorphism) ─── */
  --nova-blur-xs:  blur(4px);
  --nova-blur-sm:  blur(8px);
  --nova-blur-md:  blur(16px);
  --nova-blur-lg:  blur(32px);
  --nova-blur-xl:  blur(60px);
  --nova-blur-2xl: blur(100px);

  /* ─── Shadows ─── */
  --nova-shadow-sm:    0 2px 8px rgba(0,0,0,0.3);
  --nova-shadow-md:    0 4px 20px rgba(0,0,0,0.4);
  --nova-shadow-lg:    0 8px 40px rgba(0,0,0,0.5);
  --nova-shadow-xl:    0 20px 60px rgba(0,0,0,0.6);
  --nova-shadow-2xl:   0 40px 100px rgba(0,0,0,0.7);
  --nova-shadow-glow:  0 0 30px rgba(99,102,241,0.3);
  --nova-shadow-glow-lg: 0 0 60px rgba(99,102,241,0.2);

  /* ─── Transitions ─── */
  --nova-ease:        cubic-bezier(0.4, 0, 0.2, 1);
  --nova-ease-in:     cubic-bezier(0.4, 0, 1, 1);
  --nova-ease-out:    cubic-bezier(0, 0, 0.2, 1);
  --nova-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --nova-ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);

  --nova-duration-fast:   150ms;
  --nova-duration-base:   250ms;
  --nova-duration-slow:   400ms;
  --nova-duration-slower: 700ms;

  --nova-transition:       var(--nova-duration-base) var(--nova-ease);
  --nova-transition-fast:  var(--nova-duration-fast) var(--nova-ease);
  --nova-transition-slow:  var(--nova-duration-slow) var(--nova-ease);
  --nova-transition-spring:var(--nova-duration-slow) var(--nova-ease-spring);

  /* ─── Z-Index Scale ─── */
  --nova-z-base:    1;
  --nova-z-raised:  10;
  --nova-z-overlay: 100;
  --nova-z-modal:   1000;
  --nova-z-toast:   2000;
  --nova-z-cursor:  9999;

  /* ─── Layout ─── */
  --nova-max-width:  1200px;
  --nova-nav-height: 64px;
  --nova-safe-top:   env(safe-area-inset-top, 0px);
  --nova-safe-bot:   env(safe-area-inset-bottom, 0px);
  --nova-safe-left:  env(safe-area-inset-left, 0px);
  --nova-safe-right: env(safe-area-inset-right, 0px);

  /* ─── Gradients ─── */
  --nova-gradient-brand:   linear-gradient(135deg, var(--nova-indigo) 0%, var(--nova-violet) 50%, #7C3AED 100%);
  --nova-gradient-cyan:    linear-gradient(135deg, var(--nova-indigo) 0%, var(--nova-cyan) 100%);
  --nova-gradient-aurora:  linear-gradient(135deg, var(--nova-indigo) 0%, var(--nova-violet) 40%, var(--nova-cyan) 100%);
  --nova-gradient-success: linear-gradient(135deg, var(--nova-green) 0%, var(--nova-cyan) 100%);
  --nova-gradient-danger:  linear-gradient(135deg, var(--nova-red) 0%, var(--nova-pink) 100%);
  --nova-gradient-dark:    linear-gradient(180deg, var(--nova-bg-02) 0%, var(--nova-bg) 100%);
}