/* Agenx design tokens: the single source for colour, type, radius, spacing and motion.
   Dark is the primary theme. Light is designed separately, not inverted.
   Theme is chosen by <html data-theme="dark|light|system">; the app defaults to dark. */

:root, :root[data-theme="dark"] {
  color-scheme: dark;
  --bg:#090A10; --bg2:#11131C; --card:#181B27; --elev:#202333;
  --text:#F5F5FA; --sub:#A5A7B8; --muted:#73778B;          /* muted is for tertiary, non-essential text only (below 4.5:1 on cards) */
  --accent:#7667FF; --accent2:#4F8CFF; --ok:#41D9C1; --warn:#FFB340; --bad:#FF6B7A;
  --line:rgba(255,255,255,.08); --line-strong:rgba(255,255,255,.16);
  --glass-bg:rgba(25,28,42,.72); --glass-line:rgba(255,255,255,.09); --glass-hi:inset 0 1px 0 rgba(255,255,255,.07);
  --shadow:0 1px 0 rgba(255,255,255,.03) inset, 0 18px 40px -26px rgba(0,0,0,.8);
  --shadow-float:0 24px 60px -24px rgba(0,0,0,.85);
  --btn:linear-gradient(135deg,#5a47e6 0%,#3b63ec 60%,#2a6fdb 100%); --btn-text:#fff;
  --hero:linear-gradient(150deg,#4b3bd9 0%,#3a5ae0 58%,#2468d0 100%);
  --ambient:radial-gradient(900px 420px at 85% -8%, rgba(118,103,255,.20), transparent 70%), radial-gradient(700px 360px at 8% -4%, rgba(79,140,255,.14), transparent 70%);
  --fill:rgba(255,255,255,.06); --switch-off:#3a3d52;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg:#F5F6FA; --bg2:#ECEEF6; --card:#FFFFFF; --elev:#F1F2F8;
  --text:#14161F; --sub:#565C72; --muted:#7A8095;
  --accent:#5B4BEA; --accent2:#2F6BE0; --ok:#0E8F7A; --warn:#B25E00; --bad:#D70015;
  --line:rgba(20,24,50,.10); --line-strong:rgba(20,24,50,.2);
  --glass-bg:rgba(255,255,255,.72); --glass-line:rgba(20,24,50,.08); --glass-hi:inset 0 1px 0 rgba(255,255,255,.8);
  --shadow:0 1px 2px rgba(20,24,50,.04), 0 14px 32px -24px rgba(20,24,50,.28);
  --shadow-float:0 24px 56px -26px rgba(20,24,50,.35);
  --btn:linear-gradient(135deg,#5a47e6 0%,#3b63ec 60%,#2a6fdb 100%); --btn-text:#fff;
  --hero:linear-gradient(150deg,#4b3bd9 0%,#3a5ae0 58%,#2468d0 100%);
  --ambient:radial-gradient(900px 420px at 85% -8%, rgba(118,103,255,.16), transparent 70%), radial-gradient(700px 360px at 8% -4%, rgba(79,140,255,.12), transparent 70%);
  --fill:rgba(20,24,50,.05); --switch-off:#c9ccd9;
}
@media (prefers-color-scheme: light) {
  :root[data-theme="system"] {
    color-scheme: light;
    --bg:#F5F6FA; --bg2:#ECEEF6; --card:#FFFFFF; --elev:#F1F2F8;
    --text:#14161F; --sub:#565C72; --muted:#7A8095;
    --accent:#5B4BEA; --accent2:#2F6BE0; --ok:#0E8F7A; --warn:#B25E00; --bad:#D70015;
    --line:rgba(20,24,50,.10); --line-strong:rgba(20,24,50,.2);
    --glass-bg:rgba(255,255,255,.72); --glass-line:rgba(20,24,50,.08); --glass-hi:inset 0 1px 0 rgba(255,255,255,.8);
    --shadow:0 1px 2px rgba(20,24,50,.04), 0 14px 32px -24px rgba(20,24,50,.28);
    --shadow-float:0 24px 56px -26px rgba(20,24,50,.35);
    --ambient:radial-gradient(900px 420px at 85% -8%, rgba(118,103,255,.16), transparent 70%), radial-gradient(700px 360px at 8% -4%, rgba(79,140,255,.12), transparent 70%);
    --fill:rgba(20,24,50,.05); --switch-off:#c9ccd9;
  }
}
:root {
  --font:Heebo, "Segoe UI", -apple-system, BlinkMacSystemFont, Arial, sans-serif;
  --font-latin:Sora, Heebo, "Segoe UI", sans-serif;
  /* radius: main cards 24-28, secondary 18-22, buttons 12-16, inputs 14-16 */
  --r-card:26px; --r-card2:20px; --r-btn:14px; --r-input:15px; --r-pill:999px;
  --pad:24px; --pad-sm:16px; --gap:16px;
  --t:200ms; --ease:cubic-bezier(.2,.8,.2,1);
  --blur:20px;
}
