/* ============================================================
   155 Golden Quest — DESIGN SYSTEM TOKENS
   Tayyor AI Liquid Glass · Dark-First. Gold/Yellow Brand (155)
   ============================================================ */
:root {
  /* —— Brand Primary & Gold Accents (155) —— */
  --gold-600:   #D97706;      /* Deep Gold/Amber */
  --gold-500:   #F59E0B;      /* Primary Gold */
  --gold-400:   #FBBF24;      /* Vivid Golden Yellow */
  --gold-300:   #FDE047;      /* Bright Gold */
  --gold-200:   #FEF08A;      /* Light Gold Sheen */
  --gold-100:   #FEF9C3;
  --gold-50:    #FEFCE8;

  --amber-600:  #B45309;
  --amber-500:  #D97706;
  --amber-400:  #F59E0B;
  --amber-300:  #FCD34D;

  --primary:        #F59E0B;
  --primary-hover:  #D97706;
  --primary-light:  #FBBF24;
  --accent:         #FACC15;
  --accent-light:   #FDE047;
  --highlight:      #FEF08A;

  /* —— Brand Gradients —— */
  --grad-brand: linear-gradient(135deg, #F59E0B 0%, #FACC15 100%);
  --grad-brand-soft: linear-gradient(135deg, rgba(245,158,11,.85) 0%, rgba(250,204,21,.85) 100%);
  --grad-sheen: linear-gradient(180deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 55%);
  --grad-card: linear-gradient(145deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,.03) 100%);
  --grad-pitch: linear-gradient(180deg, #102A1E 0%, #0B1C14 100%);

  /* Tint Gradients for Icon Boxes & Badges */
  --tint-gold:    linear-gradient(140deg, #D97706 0%, #FACC15 100%);
  --tint-brand:   linear-gradient(140deg, #F59E0B 0%, #FBBF24 100%);
  --tint-amber:   linear-gradient(140deg, #B45309 0%, #F59E0B 100%);
  --tint-emerald: linear-gradient(140deg, #16A34A 0%, #22C55E 100%);
  --tint-rose:    linear-gradient(140deg, #DC2626 0%, #EF4444 100%);
  --tint-cyan:    linear-gradient(140deg, #0284C7 0%, #38BDF8 100%);
  --tint-indigo:  linear-gradient(140deg, #4F46E5 0%, #6366F1 100%);
  --tint-slate:   linear-gradient(140deg, #2A3045 0%, #1A1F2E 100%);

  /* —— Semantic Status —— */
  --success-500: #16A34A;
  --success-400: #22C55E;
  --danger-500:  #DC2626;
  --danger-400:  #EF4444;
  --warning-500: #D97706;
  --warning-400: #F59E0B;

  --success: #22C55E;
  --danger:  #EF4444;
  --warning: #F59E0B;
  --info:    #38BDF8;

  --success-fill: rgba(34,197,94,.18);
  --success-text: #4ADE80;
  --danger-fill:  rgba(239,68,68,.18);
  --danger-text:  #F87171;
  --warning-fill: rgba(245,158,11,.18);
  --warning-text: #FBBF24;
  --info-fill:    rgba(56,189,248,.18);
  --info-text:    #7DD3FC;

  /* —— Neutral Palette (Cool, Deep Dark Canvas) —— */
  --ink-900: #0B0B12;   /* Deep canvas background */
  --ink-850: #101019;   /* Elevated layer */
  --ink-800: #14141F;   /* Neutral surface */
  --ink-700: #1B1B28;   /* Card surface */
  --ink-600: #262636;   /* Border / highlight */
  --slate-400: #A5B4CC; /* Secondary text */
  --slate-300: #C7D0E0; /* Subtitle text */
  --paper-50:  #F1F5F9; /* Primary text */
  --white:     #FFFFFF;

  --bg:          #0B0B12;
  --bg-app:      #0B0B12;
  --bg-elevated: #101019;
  --bg-canvas:   #14141F;
  --bg-scrim:    rgba(6,7,14,.75);
  --surface:     #101019;
  --surface2:    #14141F;
  --surface3:    #1B1B28;

  /* Radial Brand Glow at top of app */
  --glow-brand: radial-gradient(120% 120% at 50% -10%,
                 rgba(245,158,11,.40) 0%, rgba(250,204,21,.16) 38%, rgba(11,11,18,0) 75%);

  /* —— Text Tokens —— */
  --text:           #F1F5F9;
  --text-primary:   #F1F5F9;
  --text-secondary: #A5B4CC;
  --muted:          #A5B4CC;
  --text-tertiary:  #6B7796;
  --text-disabled:  #5A6175;
  --text-on-brand:  #000000;

  /* —— Liquid Glass Properties —— */
  --glass-fill:        rgba(255,255,255,.07);
  --glass-fill-strong: rgba(255,255,255,.12);
  --glass-fill-hover:  rgba(255,255,255,.11);
  --glass-rim:         rgba(255,255,255,.22);
  --glass-rim-bright:  rgba(255,255,255,.45);
  --glass-inner-glow:  rgba(245,158,11,.10);
  --glass-blur:        18px;
  --glass-blur-filter: blur(18px) saturate(140%);

  /* Lines & Dividers */
  --border:         rgba(255,255,255,.12);
  --border-subtle:  rgba(255,255,255,.08);
  --border-strong:  rgba(255,255,255,.20);

  /* Shadows */
  --shadow-sm:    0 2px 8px rgba(0,0,0,.35);
  --shadow-card:  0 8px 24px rgba(0,0,0,.45);
  --shadow-pop:   0 16px 48px rgba(0,0,0,.60);
  --shadow-btn:   0 8px 28px rgba(245,158,11,.40);
  --shadow-brand: 0 8px 28px rgba(245,158,11,.38);
  --shadow-sheet: 0 -12px 48px rgba(0,0,0,.65);

  /* Rim Light Tokens */
  --rim-top: inset 0 1px 0 rgba(255,255,255,.28);
  --glass-shadow: 0 8px 24px rgba(0,0,0,.45),
                  inset 0 1px 0 rgba(255,255,255,.26),
                  inset 0 0 24px rgba(245,158,11,.06);
  --glass-shadow-sm: 0 4px 14px rgba(0,0,0,.35),
                     inset 0 1px 0 rgba(255,255,255,.20);

  /* Fields / Inputs */
  --field-fill:    rgba(20,21,32,.92);
  --field-border:  rgba(255,255,255,.16);
  --field-focus:   #F59E0B;

  /* Typography */
  --font-heading: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;
  --font-body:    'Inter', -apple-system, sans-serif;
  --font-sans:    'Inter', -apple-system, sans-serif;
  --font-display: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;

  /* Spacing (8pt grid) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --gutter:  16px;

  /* Border Radii */
  --radius-sm:     8px;
  --radius-md:     12px;
  --radius-lg:     16px;
  --radius-xl:     20px;
  --radius-2xl:    24px;
  --radius-card:   20px;
  --radius-button: 14px;
  --radius-pill:   999px;

  /* Control Heights */
  --height-sm: 36px;
  --height-md: 48px;
  --height-lg: 54px;

  /* Transitions */
  --ease-out:    cubic-bezier(.22,.61,.36,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --dur-fast:    120ms;
  --dur-base:    220ms;
  --dur-slow:    360ms;
  --ease:        cubic-bezier(.4, 0, .2, 1);
  --duration:    200ms;

  /* Z-Index */
  --z-base:   1;
  --z-nav:    100;
  --z-modal:  200;
  --z-toast:  300;
  --z-splash: 400;
}