/* BrandsAI: Core Tokens, extracted and unified from codebase */
:root {
  /* Brand (from real orb): cyan, violet, magenta */
  --brand-cyan-300:#7dd3fc; --brand-cyan-400:#38bdf8; --brand-cyan-500:#0ea5e9;
  --brand-violet-300:#a78bfa; --brand-violet-400:#8b5cf6; --brand-violet-500:#7c3aed;
  --brand-magenta-300:#f0abfc; --brand-magenta-400:#e879f9; --brand-magenta-500:#d946ef; --brand-magenta-600:#c026d3;
  --brand-pink-400:#ec4899; --brand-pink-500:#db2777;

  /* Legacy aliases (map to real brand) */
  --brand-300:#a78bfa; --brand-400:#8b5cf6; --brand-500:#7c3aed; --brand-600:#6d28d9;
  --cyan-300:#7dd3fc; --cyan-400:#38bdf8; --cyan-500:#0ea5e9;

  /* Neutrals */
  --ink-0:#ffffff; --ink-50:#f8fafc; --ink-100:#f1f5f9; --ink-200:#e2e8f0;
  --ink-300:#cbd5e1; --ink-400:#94a3b8; --ink-500:#64748b; --ink-600:#475569;
  --ink-700:#334155; --ink-800:#1e293b; --ink-900:#0f172a; --ink-950:#020617; --ink-1000:#000000;

  /* Surfaces (dark, primary theme) */
  --bg:#030305;
  --bg-elev-1:#0a0b12;
  --bg-elev-2:#11131c;
  --bg-elev-3:#1a1d2b;

  /* Glass */
  --glass-bg: rgba(255,255,255,0.04);
  --glass-bg-strong: rgba(255,255,255,0.08);
  --glass-border: rgba(255,255,255,0.08);
  --glass-border-strong: rgba(255,255,255,0.14);
  --glass-blur: blur(40px);

  /* Text */
  --text-primary:#ffffff;
  --text-secondary: rgba(255,255,255,0.72);
  --text-tertiary: rgba(255,255,255,0.52);
  --text-muted: rgba(255,255,255,0.36);

  /* Glows */
  --glow-violet-sm: 0 0 20px rgba(139,92,246,0.35);
  --glow-violet:    0 0 40px -6px rgba(139,92,246,0.45);
  --glow-violet-lg: 0 0 80px -10px rgba(139,92,246,0.55);
  --glow-cyan:      0 0 40px -6px rgba(34,211,238,0.45);
  --glow-dual:      0 0 60px -10px rgba(139,92,246,0.45), 0 0 120px -30px rgba(34,211,238,0.35);

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
  --shadow-md: 0 8px 24px -8px rgba(0,0,0,0.5);
  --shadow-lg: 0 20px 60px -20px rgba(0,0,0,0.6);
  --shadow-xl: 0 40px 100px -30px rgba(0,0,0,0.7);

  /* Radii */
  --r-xs:4px; --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:24px; --r-2xl:32px; --r-3xl:40px; --r-full:9999px;

  /* Type */
  --font-sans: 'Inter', 'SF Pro Display', system-ui, -apple-system, sans-serif;
  --font-display: 'Inter Display', 'Inter', system-ui, sans-serif;
  --font-mono: 'SF Mono', 'JetBrains Mono', ui-monospace, monospace;
  --tracking-hero: -0.035em;
  --tracking-h1:   -0.025em;
  --tracking-h2:   -0.02em;
  --tracking-body: -0.005em;
  --tracking-label: 0.12em;

  /* Motion */
  --dur-fast: 150ms;
  --dur: 300ms;
  --dur-slow: 500ms;
  --ease: cubic-bezier(0.4,0,0.2,1);
  --ease-out: cubic-bezier(0.16,1,0.3,1);
  --ease-in:  cubic-bezier(0.7,0,0.84,0);
  --ease-spring: cubic-bezier(0.34,1.56,0.64,1);

  /* Gradients (real brand: cyan, violet, magenta; matches orb) */
  --grad-brand: linear-gradient(135deg, #38bdf8 0%, #8b5cf6 50%, #e879f9 100%);
  --grad-brand-horiz: linear-gradient(90deg, #38bdf8, #8b5cf6, #e879f9);
  --grad-hero: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(139,92,246,0.22), transparent 60%);
  --grad-orb: radial-gradient(circle at 35% 30%, #7dd3fc 0%, #8b5cf6 45%, #d946ef 85%);
  --grad-text: linear-gradient(90deg, #7dd3fc, #a78bfa, #f0abfc);
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin:0; padding:0; background: var(--bg); color: var(--text-primary); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; letter-spacing: var(--tracking-body); }
body { min-height: 100vh; min-height: 100dvh; overscroll-behavior-y: none; }
img { display:block; max-width:100%; height:auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
::selection { background: rgba(139,92,246,0.4); color:#fff; }
::-webkit-scrollbar { width:8px; height:8px; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.25); }