/* VYRA Design Tokens v0.3.0 - purple brand, dark default, light via [data-theme="light"]. Matches the approved UI mockups. */
:root {
  --on-grad: #ffffff; --log-bg: #05050d; --nav-active-bg: var(--surface-2);
  --font-fa: "Vazirmatn", "Tahoma", system-ui, sans-serif;
  --font-en: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  --font-sans: var(--font-en);

  /* legacy names kept so older rules still resolve (now purple/ink) */
  --navy-950: #06060f; --navy-900: #0a0a1a; --navy-800: #11112a; --navy-700: #1b1740;
  --graphite-700: #2a2748; --graphite-500: #6b6a8a; --graphite-300: #a29fc4;
  --silver-200: #d9d6f0; --silver-100: #ebe9f8; --white: #f6f5ff;
  --gold-300: #c4b5fd; --gold-400: #a78bfa; --gold-500: #8b5cf6; --gold-600: #6d28d9;
  --violet-400: #a78bfa; --violet-500: #8b5cf6; --violet-600: #7c3aed; --violet-700: #6d28d9; --violet-900: #2e1065;

  --success: #22c55e; --warning: #f59e0b; --danger: #ef4444; --info: #3b82f6;

  --bg: #06060f; --surface: #0c0c1f; --surface-2: #131330;
  --bg-glow: radial-gradient(900px 500px at 85% -10%, rgb(124 58 237 / .22), transparent 60%), radial-gradient(700px 500px at 0% 110%, rgb(91 33 182 / .2), transparent 60%);
  --border: rgb(139 92 246 / .16); --border-strong: rgb(139 92 246 / .32);
  --text: #f6f5ff; --text-muted: #a29fc4; --text-faint: #6b6a8a;
  --accent: #8b5cf6; --accent-hover: #a78bfa; --accent-contrast: #ffffff;
  --grad: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
  --focus: 0 0 0 3px rgb(139 92 246 / .45);
  --shadow-1: 0 1px 2px rgb(0 0 0 / .4), inset 0 1px 0 rgb(255 255 255 / .03);
  --shadow-2: 0 18px 44px rgb(0 0 0 / .55);
  --glow: 0 0 0 1px rgb(139 92 246 / .35), 0 10px 30px rgb(124 58 237 / .35);

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --radius-sm: 10px; --radius-md: 14px; --radius-lg: 18px; --radius-full: 999px;
  --text-xs: .75rem; --text-sm: .875rem; --text-md: 1rem; --text-lg: 1.25rem; --text-xl: 1.75rem; --text-2xl: 2.5rem;
  --sidebar-w: 248px; --header-h: 68px;
  --ease: cubic-bezier(.2, .7, .2, 1); --dur: 180ms;
}
:root[lang="fa"], [dir="rtl"] { --font-sans: var(--font-fa); }

[data-theme="light"] {
  --nav-active-bg: #ece7ff;
  --bg: #f7f6ff; --surface: #ffffff; --surface-2: #f3f1ff;
  --bg-glow: radial-gradient(900px 500px at 85% -10%, rgb(167 139 250 / .25), transparent 60%), radial-gradient(700px 500px at 0% 110%, rgb(196 181 253 / .3), transparent 60%);
  --border: rgb(109 40 217 / .12); --border-strong: rgb(109 40 217 / .28);
  --text: #14122b; --text-muted: #5d5a80; --text-faint: #9a97b8;
  --accent: #6d28d9; --accent-hover: #5b21b6; --accent-contrast: #ffffff;
  --shadow-1: 0 1px 2px rgb(40 20 100 / .06), 0 4px 14px rgb(40 20 100 / .05); --shadow-2: 0 18px 44px rgb(60 30 140 / .16);
  --glow: 0 0 0 1px rgb(109 40 217 / .25), 0 10px 26px rgb(109 40 217 / .28);
}
@media (prefers-reduced-motion: reduce) { :root { --dur: 0ms; } }