/* ============================================================
   LINXLI DESIGN TOKENS - Light Mode Glassmorphism
   Brand gradient: #4B6EF5 → #6B5EE8 → #7B52E0 → #9333CC
   ============================================================ */

:root {
  /* ── Brand Colors ────────────────────────────────── */
  --brand-blue:    #4B6EF5;
  --brand-indigo:  #6B5EE8;
  --brand-violet:  #7B52E0;
  --brand-purple:  #9333CC;

  --brand-primary:       #9333CC;
  --brand-primary-hover: #7E22CE;
  --brand-primary-glow:  rgba(147, 51, 204, 0.22);

  --brand-secondary:      #4B6EF5;
  --brand-secondary-glow: rgba(75, 110, 245, 0.18);

  --brand-gradient: linear-gradient(135deg, #4B6EF5 0%, #6B5EE8 40%, #7B52E0 65%, #9333CC 100%);
  --brand-gradient-subtle: linear-gradient(135deg, rgba(75,110,245,0.07) 0%, rgba(147,51,204,0.07) 100%);
  --brand-gradient-text: linear-gradient(135deg, #4B6EF5 0%, #7B52E0 60%, #9333CC 100%);

  /* ── Glass System - Light Mode ───────────────────── */
  --glass-bg:           rgba(255, 255, 255, 0.72);
  --glass-bg-strong:    rgba(255, 255, 255, 0.92);
  --glass-bg-subtle:    rgba(255, 255, 255, 0.45);
  --glass-border:       rgba(107, 94, 232, 0.13);
  --glass-border-soft:  rgba(107, 94, 232, 0.08);
  --glass-border-brand: rgba(107, 94, 232, 0.30);
  --glass-shadow:       0 4px 24px rgba(107, 94, 232, 0.09), 0 1px 4px rgba(0, 0, 0, 0.05);
  --glass-shadow-md:    0 8px 32px rgba(107, 94, 232, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
  --glass-shadow-brand: 0 8px 32px rgba(147, 51, 204, 0.18);
  --glass-blur:         blur(20px);
  --glass-blur-heavy:   blur(40px);
  --glass-blur-light:   blur(10px);

  /* ── Surfaces - Light ────────────────────────────── */
  --surface-page:   #F8F7FF;   /* Page bg - subtle violet tint */
  --surface-card:   #FFFFFF;
  --surface-raised: #F2F0FF;
  --surface-muted:  #EDE9FF;

  /* ── Text ────────────────────────────────────────── */
  --text-primary:   #1A1729;
  --text-secondary: rgba(26, 23, 41, 0.62);
  --text-muted:     rgba(26, 23, 41, 0.40);
  --text-inverse:   #FFFFFF;

  /* ── Typography ──────────────────────────────────── */
  --font-display: 'Urbanist', sans-serif;
  --font-body:    'Plus Jakarta Sans', sans-serif;

  /* ── Radius ──────────────────────────────────────── */
  --radius-card:  20px;
  --radius-card-sm: 14px;
  --radius-btn:   12px;
  --radius-pill:  999px;

  /* ── Transitions ─────────────────────────────────── */
  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-smooth:  cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast:   200ms;
  --duration-normal: 340ms;
  --duration-slow:   600ms;
}