/* ============================================================
   UniqueAPI GLOBAL THEME  —  /var/www/smartapi/theme.css
   Injected into EVERY page via nginx (link added before </head>).

   PURPOSE
   -------
   The app's compiled Tailwind bundle bakes several accent hues into
   utility classes (teal as the authored base, plus indigo/sky/blue
   accents, and violet/purple). This file UNIFIES every brand/accent
   surface onto ONE primary hue (+ one secondary) by overriding those
   utility classes with !important, driven entirely from the token
   block below.

   RECOLORS (brand/accent only):  primary-* teal-* indigo-* sky-* blue-*
                                  -> PRIMARY scale
                                  violet-* purple-*  -> SECONDARY scale
   LEFT UNTOUCHED (semantic / neutral, on purpose):
       success green-*/emerald-* · error red-*/rose-*
       warning orange-*/amber-*/yellow-* · neutral slate-*/gray-*/zinc-*
   ============================================================ */

/* ============================================================
   ░░  BRAND KNOBS  —  THE ONE PLACE YOU EDIT TO RE-THEME  ░░
   ------------------------------------------------------------
   CHANGE PRIMARY (buttons, links, accents, the whole UI):
     Replace the 11 --brand-* values below with your hue's 50..950
     scale. --color-primary points at 500, --color-primary-strong at
     600, --color-link at 400. Done — every utility family, links,
     rings, selection, scrollbar AND the home page follow automatically.
   CHANGE SECONDARY (gradient end / accent):
     Replace the 11 --brand2-* values (violet today). --color-secondary
     points at --brand2-500; --brand-gradient is primary->secondary.
   Nothing else in this file or the home page hardcodes a brand color.
   ============================================================ */
:root {
  /* ---- PRIMARY scale (default: INDIGO) — edit to re-theme ---- */
  --brand-50: #eef2ff;
  --brand-100: #e0e7ff;
  --brand-200: #c7d2fe;
  --brand-300: #a5b4fc;
  --brand-400: #818cf8;
  --brand-500: #6366f1;
  --brand-600: #4f46e5;
  --brand-700: #4338ca;
  --brand-800: #3730a3;
  --brand-900: #312e81;
  --brand-950: #1e1b4b;
  /* ---- SECONDARY scale (default: VIOLET) — accent / grad end -- */
  --brand2-50: #f5f3ff;
  --brand2-100: #ede9fe;
  --brand2-200: #ddd6fe;
  --brand2-300: #c4b5fd;
  --brand2-400: #a78bfa;
  --brand2-500: #8b5cf6;
  --brand2-600: #7c3aed;
  --brand2-700: #6d28d9;
  --brand2-800: #5b21b6;
  --brand2-900: #4c1d95;
  --brand2-950: #2e1065;

  /* ---- NEUTRALS (structural surfaces/borders/text — not brand) -- */
  --neutral-bg:#0b1120; --neutral-surface:#111827; --neutral-surface-2:#0f172a;
  --neutral-border:#1e293b; --neutral-text:#e2e8f0; --neutral-muted:#94a3b8; --neutral-faint:#64748b;

  /* ---- SEMANTIC brand tokens (think in these names) ----------- */
  --color-primary:        var(--brand-500);
  --color-primary-strong: var(--brand-600);
  --color-secondary:      var(--brand2-500);
  --color-link:           var(--brand-400);
  --color-link-hover:     var(--brand-300);
  --color-on-primary:     #ffffff;
  --brand-gradient: linear-gradient(135deg, var(--color-primary), var(--color-secondary));

  /* ---- neutral semantic aliases (used by home page) ----------- */
  --surface:var(--neutral-surface); --surface-2:var(--neutral-surface-2);
  --border:var(--neutral-border); --text:var(--neutral-text); --muted:var(--neutral-muted);

  /* ---- AUX (NON-brand) tokens: code-syntax + subtle overlay ---- */
  /* Defined so the home page references a real global (not phantom). */
  /* These are NOT remapped status colors; nothing recolors green.   */
  --success:#86efac;                       /* code-block string highlight */
  --overlay:rgba(255,255,255,.02);         /* faint surface overlay       */

  /* ---- BACK-COMPAT with previous --smartapi-* token names ----- */
  --smartapi-primary-50: var(--brand-50);
  --smartapi-primary-100: var(--brand-100);
  --smartapi-primary-200: var(--brand-200);
  --smartapi-primary-300: var(--brand-300);
  --smartapi-primary-400: var(--brand-400);
  --smartapi-primary-500: var(--brand-500);
  --smartapi-primary-600: var(--brand-600);
  --smartapi-primary-700: var(--brand-700);
  --smartapi-primary-800: var(--brand-800);
  --smartapi-primary-900: var(--brand-900);
  --smartapi-primary-950: var(--brand-950);
  --smartapi-accent: var(--brand2-500);
}

/* ============================================================
   UTILITY-CLASS REMAPS  (read the tokens above; never hardcode)
   ============================================================ */

/* --- background-color --- */
.bg-primary-50, .bg-teal-50, .bg-indigo-50, .bg-sky-50, .bg-blue-50 { background-color: var(--brand-50) !important; }
.bg-violet-50, .bg-purple-50 { background-color: var(--brand2-50) !important; }
.bg-primary-100, .bg-teal-100, .bg-indigo-100, .bg-sky-100, .bg-blue-100 { background-color: var(--brand-100) !important; }
.bg-violet-100, .bg-purple-100 { background-color: var(--brand2-100) !important; }
.bg-primary-200, .bg-teal-200, .bg-indigo-200, .bg-sky-200, .bg-blue-200 { background-color: var(--brand-200) !important; }
.bg-violet-200, .bg-purple-200 { background-color: var(--brand2-200) !important; }
.bg-primary-300, .bg-teal-300, .bg-indigo-300, .bg-sky-300, .bg-blue-300 { background-color: var(--brand-300) !important; }
.bg-violet-300, .bg-purple-300 { background-color: var(--brand2-300) !important; }
.bg-primary-400, .bg-teal-400, .bg-indigo-400, .bg-sky-400, .bg-blue-400 { background-color: var(--brand-400) !important; }
.bg-violet-400, .bg-purple-400 { background-color: var(--brand2-400) !important; }
.bg-primary-500, .bg-teal-500, .bg-indigo-500, .bg-sky-500, .bg-blue-500 { background-color: var(--brand-500) !important; }
.bg-violet-500, .bg-purple-500 { background-color: var(--brand2-500) !important; }
.bg-primary-600, .bg-teal-600, .bg-indigo-600, .bg-sky-600, .bg-blue-600 { background-color: var(--brand-600) !important; }
.bg-violet-600, .bg-purple-600 { background-color: var(--brand2-600) !important; }
.bg-primary-700, .bg-teal-700, .bg-indigo-700, .bg-sky-700, .bg-blue-700 { background-color: var(--brand-700) !important; }
.bg-violet-700, .bg-purple-700 { background-color: var(--brand2-700) !important; }
.bg-primary-800, .bg-teal-800, .bg-indigo-800, .bg-sky-800, .bg-blue-800 { background-color: var(--brand-800) !important; }
.bg-violet-800, .bg-purple-800 { background-color: var(--brand2-800) !important; }
.bg-primary-900, .bg-teal-900, .bg-indigo-900, .bg-sky-900, .bg-blue-900 { background-color: var(--brand-900) !important; }
.bg-violet-900, .bg-purple-900 { background-color: var(--brand2-900) !important; }
.bg-primary-950, .bg-teal-950, .bg-indigo-950, .bg-sky-950, .bg-blue-950 { background-color: var(--brand-950) !important; }
.bg-violet-950, .bg-purple-950 { background-color: var(--brand2-950) !important; }
/* --- text color --- */
.text-primary-50, .text-teal-50, .text-indigo-50, .text-sky-50, .text-blue-50 { color: var(--brand-50) !important; }
.text-violet-50, .text-purple-50 { color: var(--brand2-50) !important; }
.text-primary-100, .text-teal-100, .text-indigo-100, .text-sky-100, .text-blue-100 { color: var(--brand-100) !important; }
.text-violet-100, .text-purple-100 { color: var(--brand2-100) !important; }
.text-primary-200, .text-teal-200, .text-indigo-200, .text-sky-200, .text-blue-200 { color: var(--brand-200) !important; }
.text-violet-200, .text-purple-200 { color: var(--brand2-200) !important; }
.text-primary-300, .text-teal-300, .text-indigo-300, .text-sky-300, .text-blue-300 { color: var(--brand-300) !important; }
.text-violet-300, .text-purple-300 { color: var(--brand2-300) !important; }
.text-primary-400, .text-teal-400, .text-indigo-400, .text-sky-400, .text-blue-400 { color: var(--brand-400) !important; }
.text-violet-400, .text-purple-400 { color: var(--brand2-400) !important; }
.text-primary-500, .text-teal-500, .text-indigo-500, .text-sky-500, .text-blue-500 { color: var(--brand-500) !important; }
.text-violet-500, .text-purple-500 { color: var(--brand2-500) !important; }
.text-primary-600, .text-teal-600, .text-indigo-600, .text-sky-600, .text-blue-600 { color: var(--brand-600) !important; }
.text-violet-600, .text-purple-600 { color: var(--brand2-600) !important; }
.text-primary-700, .text-teal-700, .text-indigo-700, .text-sky-700, .text-blue-700 { color: var(--brand-700) !important; }
.text-violet-700, .text-purple-700 { color: var(--brand2-700) !important; }
.text-primary-800, .text-teal-800, .text-indigo-800, .text-sky-800, .text-blue-800 { color: var(--brand-800) !important; }
.text-violet-800, .text-purple-800 { color: var(--brand2-800) !important; }
.text-primary-900, .text-teal-900, .text-indigo-900, .text-sky-900, .text-blue-900 { color: var(--brand-900) !important; }
.text-violet-900, .text-purple-900 { color: var(--brand2-900) !important; }
.text-primary-950, .text-teal-950, .text-indigo-950, .text-sky-950, .text-blue-950 { color: var(--brand-950) !important; }
.text-violet-950, .text-purple-950 { color: var(--brand2-950) !important; }
/* --- border-color --- */
.border-primary-50, .border-teal-50, .border-indigo-50, .border-sky-50, .border-blue-50 { border-color: var(--brand-50) !important; }
.border-violet-50, .border-purple-50 { border-color: var(--brand2-50) !important; }
.border-primary-100, .border-teal-100, .border-indigo-100, .border-sky-100, .border-blue-100 { border-color: var(--brand-100) !important; }
.border-violet-100, .border-purple-100 { border-color: var(--brand2-100) !important; }
.border-primary-200, .border-teal-200, .border-indigo-200, .border-sky-200, .border-blue-200 { border-color: var(--brand-200) !important; }
.border-violet-200, .border-purple-200 { border-color: var(--brand2-200) !important; }
.border-primary-300, .border-teal-300, .border-indigo-300, .border-sky-300, .border-blue-300 { border-color: var(--brand-300) !important; }
.border-violet-300, .border-purple-300 { border-color: var(--brand2-300) !important; }
.border-primary-400, .border-teal-400, .border-indigo-400, .border-sky-400, .border-blue-400 { border-color: var(--brand-400) !important; }
.border-violet-400, .border-purple-400 { border-color: var(--brand2-400) !important; }
.border-primary-500, .border-teal-500, .border-indigo-500, .border-sky-500, .border-blue-500 { border-color: var(--brand-500) !important; }
.border-violet-500, .border-purple-500 { border-color: var(--brand2-500) !important; }
.border-primary-600, .border-teal-600, .border-indigo-600, .border-sky-600, .border-blue-600 { border-color: var(--brand-600) !important; }
.border-violet-600, .border-purple-600 { border-color: var(--brand2-600) !important; }
.border-primary-700, .border-teal-700, .border-indigo-700, .border-sky-700, .border-blue-700 { border-color: var(--brand-700) !important; }
.border-violet-700, .border-purple-700 { border-color: var(--brand2-700) !important; }
.border-primary-800, .border-teal-800, .border-indigo-800, .border-sky-800, .border-blue-800 { border-color: var(--brand-800) !important; }
.border-violet-800, .border-purple-800 { border-color: var(--brand2-800) !important; }
.border-primary-900, .border-teal-900, .border-indigo-900, .border-sky-900, .border-blue-900 { border-color: var(--brand-900) !important; }
.border-violet-900, .border-purple-900 { border-color: var(--brand2-900) !important; }
.border-primary-950, .border-teal-950, .border-indigo-950, .border-sky-950, .border-blue-950 { border-color: var(--brand-950) !important; }
.border-violet-950, .border-purple-950 { border-color: var(--brand2-950) !important; }
/* --- ring color (ring-* and focus:ring-*) --- */
.ring-primary-50, .ring-teal-50, .ring-indigo-50, .ring-sky-50, .ring-blue-50 { --tw-ring-color: var(--brand-50) !important; }
.ring-violet-50, .ring-purple-50 { --tw-ring-color: var(--brand2-50) !important; }
.ring-primary-100, .ring-teal-100, .ring-indigo-100, .ring-sky-100, .ring-blue-100 { --tw-ring-color: var(--brand-100) !important; }
.ring-violet-100, .ring-purple-100 { --tw-ring-color: var(--brand2-100) !important; }
.ring-primary-200, .ring-teal-200, .ring-indigo-200, .ring-sky-200, .ring-blue-200 { --tw-ring-color: var(--brand-200) !important; }
.ring-violet-200, .ring-purple-200 { --tw-ring-color: var(--brand2-200) !important; }
.ring-primary-300, .ring-teal-300, .ring-indigo-300, .ring-sky-300, .ring-blue-300 { --tw-ring-color: var(--brand-300) !important; }
.ring-violet-300, .ring-purple-300 { --tw-ring-color: var(--brand2-300) !important; }
.ring-primary-400, .ring-teal-400, .ring-indigo-400, .ring-sky-400, .ring-blue-400 { --tw-ring-color: var(--brand-400) !important; }
.ring-violet-400, .ring-purple-400 { --tw-ring-color: var(--brand2-400) !important; }
.ring-primary-500, .ring-teal-500, .ring-indigo-500, .ring-sky-500, .ring-blue-500 { --tw-ring-color: var(--brand-500) !important; }
.ring-violet-500, .ring-purple-500 { --tw-ring-color: var(--brand2-500) !important; }
.ring-primary-600, .ring-teal-600, .ring-indigo-600, .ring-sky-600, .ring-blue-600 { --tw-ring-color: var(--brand-600) !important; }
.ring-violet-600, .ring-purple-600 { --tw-ring-color: var(--brand2-600) !important; }
.ring-primary-700, .ring-teal-700, .ring-indigo-700, .ring-sky-700, .ring-blue-700 { --tw-ring-color: var(--brand-700) !important; }
.ring-violet-700, .ring-purple-700 { --tw-ring-color: var(--brand2-700) !important; }
.ring-primary-800, .ring-teal-800, .ring-indigo-800, .ring-sky-800, .ring-blue-800 { --tw-ring-color: var(--brand-800) !important; }
.ring-violet-800, .ring-purple-800 { --tw-ring-color: var(--brand2-800) !important; }
.ring-primary-900, .ring-teal-900, .ring-indigo-900, .ring-sky-900, .ring-blue-900 { --tw-ring-color: var(--brand-900) !important; }
.ring-violet-900, .ring-purple-900 { --tw-ring-color: var(--brand2-900) !important; }
.ring-primary-950, .ring-teal-950, .ring-indigo-950, .ring-sky-950, .ring-blue-950 { --tw-ring-color: var(--brand-950) !important; }
.ring-violet-950, .ring-purple-950 { --tw-ring-color: var(--brand2-950) !important; }
.focus\:ring-primary-50:focus, .focus\:ring-teal-50:focus, .focus\:ring-indigo-50:focus, .focus\:ring-sky-50:focus, .focus\:ring-blue-50:focus { --tw-ring-color: var(--brand-50) !important; }
.focus\:ring-violet-50:focus, .focus\:ring-purple-50:focus { --tw-ring-color: var(--brand2-50) !important; }
.focus\:ring-primary-100:focus, .focus\:ring-teal-100:focus, .focus\:ring-indigo-100:focus, .focus\:ring-sky-100:focus, .focus\:ring-blue-100:focus { --tw-ring-color: var(--brand-100) !important; }
.focus\:ring-violet-100:focus, .focus\:ring-purple-100:focus { --tw-ring-color: var(--brand2-100) !important; }
.focus\:ring-primary-200:focus, .focus\:ring-teal-200:focus, .focus\:ring-indigo-200:focus, .focus\:ring-sky-200:focus, .focus\:ring-blue-200:focus { --tw-ring-color: var(--brand-200) !important; }
.focus\:ring-violet-200:focus, .focus\:ring-purple-200:focus { --tw-ring-color: var(--brand2-200) !important; }
.focus\:ring-primary-300:focus, .focus\:ring-teal-300:focus, .focus\:ring-indigo-300:focus, .focus\:ring-sky-300:focus, .focus\:ring-blue-300:focus { --tw-ring-color: var(--brand-300) !important; }
.focus\:ring-violet-300:focus, .focus\:ring-purple-300:focus { --tw-ring-color: var(--brand2-300) !important; }
.focus\:ring-primary-400:focus, .focus\:ring-teal-400:focus, .focus\:ring-indigo-400:focus, .focus\:ring-sky-400:focus, .focus\:ring-blue-400:focus { --tw-ring-color: var(--brand-400) !important; }
.focus\:ring-violet-400:focus, .focus\:ring-purple-400:focus { --tw-ring-color: var(--brand2-400) !important; }
.focus\:ring-primary-500:focus, .focus\:ring-teal-500:focus, .focus\:ring-indigo-500:focus, .focus\:ring-sky-500:focus, .focus\:ring-blue-500:focus { --tw-ring-color: var(--brand-500) !important; }
.focus\:ring-violet-500:focus, .focus\:ring-purple-500:focus { --tw-ring-color: var(--brand2-500) !important; }
.focus\:ring-primary-600:focus, .focus\:ring-teal-600:focus, .focus\:ring-indigo-600:focus, .focus\:ring-sky-600:focus, .focus\:ring-blue-600:focus { --tw-ring-color: var(--brand-600) !important; }
.focus\:ring-violet-600:focus, .focus\:ring-purple-600:focus { --tw-ring-color: var(--brand2-600) !important; }
.focus\:ring-primary-700:focus, .focus\:ring-teal-700:focus, .focus\:ring-indigo-700:focus, .focus\:ring-sky-700:focus, .focus\:ring-blue-700:focus { --tw-ring-color: var(--brand-700) !important; }
.focus\:ring-violet-700:focus, .focus\:ring-purple-700:focus { --tw-ring-color: var(--brand2-700) !important; }
.focus\:ring-primary-800:focus, .focus\:ring-teal-800:focus, .focus\:ring-indigo-800:focus, .focus\:ring-sky-800:focus, .focus\:ring-blue-800:focus { --tw-ring-color: var(--brand-800) !important; }
.focus\:ring-violet-800:focus, .focus\:ring-purple-800:focus { --tw-ring-color: var(--brand2-800) !important; }
.focus\:ring-primary-900:focus, .focus\:ring-teal-900:focus, .focus\:ring-indigo-900:focus, .focus\:ring-sky-900:focus, .focus\:ring-blue-900:focus { --tw-ring-color: var(--brand-900) !important; }
.focus\:ring-violet-900:focus, .focus\:ring-purple-900:focus { --tw-ring-color: var(--brand2-900) !important; }
.focus\:ring-primary-950:focus, .focus\:ring-teal-950:focus, .focus\:ring-indigo-950:focus, .focus\:ring-sky-950:focus, .focus\:ring-blue-950:focus { --tw-ring-color: var(--brand-950) !important; }
.focus\:ring-violet-950:focus, .focus\:ring-purple-950:focus { --tw-ring-color: var(--brand2-950) !important; }
/* --- hover variants --- */
.hover\:bg-primary-50:hover, .hover\:bg-teal-50:hover, .hover\:bg-indigo-50:hover, .hover\:bg-sky-50:hover, .hover\:bg-blue-50:hover { background-color: var(--brand-50) !important; }
.hover\:bg-violet-50:hover, .hover\:bg-purple-50:hover { background-color: var(--brand2-50) !important; }
.hover\:bg-primary-100:hover, .hover\:bg-teal-100:hover, .hover\:bg-indigo-100:hover, .hover\:bg-sky-100:hover, .hover\:bg-blue-100:hover { background-color: var(--brand-100) !important; }
.hover\:bg-violet-100:hover, .hover\:bg-purple-100:hover { background-color: var(--brand2-100) !important; }
.hover\:bg-primary-200:hover, .hover\:bg-teal-200:hover, .hover\:bg-indigo-200:hover, .hover\:bg-sky-200:hover, .hover\:bg-blue-200:hover { background-color: var(--brand-200) !important; }
.hover\:bg-violet-200:hover, .hover\:bg-purple-200:hover { background-color: var(--brand2-200) !important; }
.hover\:bg-primary-300:hover, .hover\:bg-teal-300:hover, .hover\:bg-indigo-300:hover, .hover\:bg-sky-300:hover, .hover\:bg-blue-300:hover { background-color: var(--brand-300) !important; }
.hover\:bg-violet-300:hover, .hover\:bg-purple-300:hover { background-color: var(--brand2-300) !important; }
.hover\:bg-primary-400:hover, .hover\:bg-teal-400:hover, .hover\:bg-indigo-400:hover, .hover\:bg-sky-400:hover, .hover\:bg-blue-400:hover { background-color: var(--brand-400) !important; }
.hover\:bg-violet-400:hover, .hover\:bg-purple-400:hover { background-color: var(--brand2-400) !important; }
.hover\:bg-primary-500:hover, .hover\:bg-teal-500:hover, .hover\:bg-indigo-500:hover, .hover\:bg-sky-500:hover, .hover\:bg-blue-500:hover { background-color: var(--brand-500) !important; }
.hover\:bg-violet-500:hover, .hover\:bg-purple-500:hover { background-color: var(--brand2-500) !important; }
.hover\:bg-primary-600:hover, .hover\:bg-teal-600:hover, .hover\:bg-indigo-600:hover, .hover\:bg-sky-600:hover, .hover\:bg-blue-600:hover { background-color: var(--brand-600) !important; }
.hover\:bg-violet-600:hover, .hover\:bg-purple-600:hover { background-color: var(--brand2-600) !important; }
.hover\:bg-primary-700:hover, .hover\:bg-teal-700:hover, .hover\:bg-indigo-700:hover, .hover\:bg-sky-700:hover, .hover\:bg-blue-700:hover { background-color: var(--brand-700) !important; }
.hover\:bg-violet-700:hover, .hover\:bg-purple-700:hover { background-color: var(--brand2-700) !important; }
.hover\:bg-primary-800:hover, .hover\:bg-teal-800:hover, .hover\:bg-indigo-800:hover, .hover\:bg-sky-800:hover, .hover\:bg-blue-800:hover { background-color: var(--brand-800) !important; }
.hover\:bg-violet-800:hover, .hover\:bg-purple-800:hover { background-color: var(--brand2-800) !important; }
.hover\:bg-primary-900:hover, .hover\:bg-teal-900:hover, .hover\:bg-indigo-900:hover, .hover\:bg-sky-900:hover, .hover\:bg-blue-900:hover { background-color: var(--brand-900) !important; }
.hover\:bg-violet-900:hover, .hover\:bg-purple-900:hover { background-color: var(--brand2-900) !important; }
.hover\:bg-primary-950:hover, .hover\:bg-teal-950:hover, .hover\:bg-indigo-950:hover, .hover\:bg-sky-950:hover, .hover\:bg-blue-950:hover { background-color: var(--brand-950) !important; }
.hover\:bg-violet-950:hover, .hover\:bg-purple-950:hover { background-color: var(--brand2-950) !important; }
.hover\:text-primary-50:hover, .hover\:text-teal-50:hover, .hover\:text-indigo-50:hover, .hover\:text-sky-50:hover, .hover\:text-blue-50:hover { color: var(--brand-50) !important; }
.hover\:text-violet-50:hover, .hover\:text-purple-50:hover { color: var(--brand2-50) !important; }
.hover\:text-primary-100:hover, .hover\:text-teal-100:hover, .hover\:text-indigo-100:hover, .hover\:text-sky-100:hover, .hover\:text-blue-100:hover { color: var(--brand-100) !important; }
.hover\:text-violet-100:hover, .hover\:text-purple-100:hover { color: var(--brand2-100) !important; }
.hover\:text-primary-200:hover, .hover\:text-teal-200:hover, .hover\:text-indigo-200:hover, .hover\:text-sky-200:hover, .hover\:text-blue-200:hover { color: var(--brand-200) !important; }
.hover\:text-violet-200:hover, .hover\:text-purple-200:hover { color: var(--brand2-200) !important; }
.hover\:text-primary-300:hover, .hover\:text-teal-300:hover, .hover\:text-indigo-300:hover, .hover\:text-sky-300:hover, .hover\:text-blue-300:hover { color: var(--brand-300) !important; }
.hover\:text-violet-300:hover, .hover\:text-purple-300:hover { color: var(--brand2-300) !important; }
.hover\:text-primary-400:hover, .hover\:text-teal-400:hover, .hover\:text-indigo-400:hover, .hover\:text-sky-400:hover, .hover\:text-blue-400:hover { color: var(--brand-400) !important; }
.hover\:text-violet-400:hover, .hover\:text-purple-400:hover { color: var(--brand2-400) !important; }
.hover\:text-primary-500:hover, .hover\:text-teal-500:hover, .hover\:text-indigo-500:hover, .hover\:text-sky-500:hover, .hover\:text-blue-500:hover { color: var(--brand-500) !important; }
.hover\:text-violet-500:hover, .hover\:text-purple-500:hover { color: var(--brand2-500) !important; }
.hover\:text-primary-600:hover, .hover\:text-teal-600:hover, .hover\:text-indigo-600:hover, .hover\:text-sky-600:hover, .hover\:text-blue-600:hover { color: var(--brand-600) !important; }
.hover\:text-violet-600:hover, .hover\:text-purple-600:hover { color: var(--brand2-600) !important; }
.hover\:text-primary-700:hover, .hover\:text-teal-700:hover, .hover\:text-indigo-700:hover, .hover\:text-sky-700:hover, .hover\:text-blue-700:hover { color: var(--brand-700) !important; }
.hover\:text-violet-700:hover, .hover\:text-purple-700:hover { color: var(--brand2-700) !important; }
.hover\:text-primary-800:hover, .hover\:text-teal-800:hover, .hover\:text-indigo-800:hover, .hover\:text-sky-800:hover, .hover\:text-blue-800:hover { color: var(--brand-800) !important; }
.hover\:text-violet-800:hover, .hover\:text-purple-800:hover { color: var(--brand2-800) !important; }
.hover\:text-primary-900:hover, .hover\:text-teal-900:hover, .hover\:text-indigo-900:hover, .hover\:text-sky-900:hover, .hover\:text-blue-900:hover { color: var(--brand-900) !important; }
.hover\:text-violet-900:hover, .hover\:text-purple-900:hover { color: var(--brand2-900) !important; }
.hover\:text-primary-950:hover, .hover\:text-teal-950:hover, .hover\:text-indigo-950:hover, .hover\:text-sky-950:hover, .hover\:text-blue-950:hover { color: var(--brand-950) !important; }
.hover\:text-violet-950:hover, .hover\:text-purple-950:hover { color: var(--brand2-950) !important; }
.hover\:border-primary-50:hover, .hover\:border-teal-50:hover, .hover\:border-indigo-50:hover, .hover\:border-sky-50:hover, .hover\:border-blue-50:hover { border-color: var(--brand-50) !important; }
.hover\:border-violet-50:hover, .hover\:border-purple-50:hover { border-color: var(--brand2-50) !important; }
.hover\:border-primary-100:hover, .hover\:border-teal-100:hover, .hover\:border-indigo-100:hover, .hover\:border-sky-100:hover, .hover\:border-blue-100:hover { border-color: var(--brand-100) !important; }
.hover\:border-violet-100:hover, .hover\:border-purple-100:hover { border-color: var(--brand2-100) !important; }
.hover\:border-primary-200:hover, .hover\:border-teal-200:hover, .hover\:border-indigo-200:hover, .hover\:border-sky-200:hover, .hover\:border-blue-200:hover { border-color: var(--brand-200) !important; }
.hover\:border-violet-200:hover, .hover\:border-purple-200:hover { border-color: var(--brand2-200) !important; }
.hover\:border-primary-300:hover, .hover\:border-teal-300:hover, .hover\:border-indigo-300:hover, .hover\:border-sky-300:hover, .hover\:border-blue-300:hover { border-color: var(--brand-300) !important; }
.hover\:border-violet-300:hover, .hover\:border-purple-300:hover { border-color: var(--brand2-300) !important; }
.hover\:border-primary-400:hover, .hover\:border-teal-400:hover, .hover\:border-indigo-400:hover, .hover\:border-sky-400:hover, .hover\:border-blue-400:hover { border-color: var(--brand-400) !important; }
.hover\:border-violet-400:hover, .hover\:border-purple-400:hover { border-color: var(--brand2-400) !important; }
.hover\:border-primary-500:hover, .hover\:border-teal-500:hover, .hover\:border-indigo-500:hover, .hover\:border-sky-500:hover, .hover\:border-blue-500:hover { border-color: var(--brand-500) !important; }
.hover\:border-violet-500:hover, .hover\:border-purple-500:hover { border-color: var(--brand2-500) !important; }
.hover\:border-primary-600:hover, .hover\:border-teal-600:hover, .hover\:border-indigo-600:hover, .hover\:border-sky-600:hover, .hover\:border-blue-600:hover { border-color: var(--brand-600) !important; }
.hover\:border-violet-600:hover, .hover\:border-purple-600:hover { border-color: var(--brand2-600) !important; }
.hover\:border-primary-700:hover, .hover\:border-teal-700:hover, .hover\:border-indigo-700:hover, .hover\:border-sky-700:hover, .hover\:border-blue-700:hover { border-color: var(--brand-700) !important; }
.hover\:border-violet-700:hover, .hover\:border-purple-700:hover { border-color: var(--brand2-700) !important; }
.hover\:border-primary-800:hover, .hover\:border-teal-800:hover, .hover\:border-indigo-800:hover, .hover\:border-sky-800:hover, .hover\:border-blue-800:hover { border-color: var(--brand-800) !important; }
.hover\:border-violet-800:hover, .hover\:border-purple-800:hover { border-color: var(--brand2-800) !important; }
.hover\:border-primary-900:hover, .hover\:border-teal-900:hover, .hover\:border-indigo-900:hover, .hover\:border-sky-900:hover, .hover\:border-blue-900:hover { border-color: var(--brand-900) !important; }
.hover\:border-violet-900:hover, .hover\:border-purple-900:hover { border-color: var(--brand2-900) !important; }
.hover\:border-primary-950:hover, .hover\:border-teal-950:hover, .hover\:border-indigo-950:hover, .hover\:border-sky-950:hover, .hover\:border-blue-950:hover { border-color: var(--brand-950) !important; }
.hover\:border-violet-950:hover, .hover\:border-purple-950:hover { border-color: var(--brand2-950) !important; }
/* --- GRADIENTS ---
   from-*: override ONLY --tw-gradient-from (the bundle's own rule keeps
   composing --tw-gradient-stops + the transparent companion, now using
   our brand 'from'). We deliberately do NOT pin --tw-gradient-stops, so
   3-stop app gradients (from/via/to) keep their middle color. */
.from-primary-50, .from-teal-50, .from-indigo-50, .from-sky-50, .from-blue-50 { --tw-gradient-from: var(--brand-50) !important; }
.from-violet-50, .from-purple-50 { --tw-gradient-from: var(--brand2-50) !important; }
.from-primary-100, .from-teal-100, .from-indigo-100, .from-sky-100, .from-blue-100 { --tw-gradient-from: var(--brand-100) !important; }
.from-violet-100, .from-purple-100 { --tw-gradient-from: var(--brand2-100) !important; }
.from-primary-200, .from-teal-200, .from-indigo-200, .from-sky-200, .from-blue-200 { --tw-gradient-from: var(--brand-200) !important; }
.from-violet-200, .from-purple-200 { --tw-gradient-from: var(--brand2-200) !important; }
.from-primary-300, .from-teal-300, .from-indigo-300, .from-sky-300, .from-blue-300 { --tw-gradient-from: var(--brand-300) !important; }
.from-violet-300, .from-purple-300 { --tw-gradient-from: var(--brand2-300) !important; }
.from-primary-400, .from-teal-400, .from-indigo-400, .from-sky-400, .from-blue-400 { --tw-gradient-from: var(--brand-400) !important; }
.from-violet-400, .from-purple-400 { --tw-gradient-from: var(--brand2-400) !important; }
.from-primary-500, .from-teal-500, .from-indigo-500, .from-sky-500, .from-blue-500 { --tw-gradient-from: var(--brand-500) !important; }
.from-violet-500, .from-purple-500 { --tw-gradient-from: var(--brand2-500) !important; }
.from-primary-600, .from-teal-600, .from-indigo-600, .from-sky-600, .from-blue-600 { --tw-gradient-from: var(--brand-600) !important; }
.from-violet-600, .from-purple-600 { --tw-gradient-from: var(--brand2-600) !important; }
.from-primary-700, .from-teal-700, .from-indigo-700, .from-sky-700, .from-blue-700 { --tw-gradient-from: var(--brand-700) !important; }
.from-violet-700, .from-purple-700 { --tw-gradient-from: var(--brand2-700) !important; }
.from-primary-800, .from-teal-800, .from-indigo-800, .from-sky-800, .from-blue-800 { --tw-gradient-from: var(--brand-800) !important; }
.from-violet-800, .from-purple-800 { --tw-gradient-from: var(--brand2-800) !important; }
.from-primary-900, .from-teal-900, .from-indigo-900, .from-sky-900, .from-blue-900 { --tw-gradient-from: var(--brand-900) !important; }
.from-violet-900, .from-purple-900 { --tw-gradient-from: var(--brand2-900) !important; }
.from-primary-950, .from-teal-950, .from-indigo-950, .from-sky-950, .from-blue-950 { --tw-gradient-from: var(--brand-950) !important; }
.from-violet-950, .from-purple-950 { --tw-gradient-from: var(--brand2-950) !important; }
.via-primary-50, .via-teal-50, .via-indigo-50, .via-sky-50, .via-blue-50 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-50), var(--tw-gradient-to, transparent) !important; }
.via-violet-50, .via-purple-50 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-50), var(--tw-gradient-to, transparent) !important; }
.via-primary-100, .via-teal-100, .via-indigo-100, .via-sky-100, .via-blue-100 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-100), var(--tw-gradient-to, transparent) !important; }
.via-violet-100, .via-purple-100 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-100), var(--tw-gradient-to, transparent) !important; }
.via-primary-200, .via-teal-200, .via-indigo-200, .via-sky-200, .via-blue-200 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-200), var(--tw-gradient-to, transparent) !important; }
.via-violet-200, .via-purple-200 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-200), var(--tw-gradient-to, transparent) !important; }
.via-primary-300, .via-teal-300, .via-indigo-300, .via-sky-300, .via-blue-300 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-300), var(--tw-gradient-to, transparent) !important; }
.via-violet-300, .via-purple-300 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-300), var(--tw-gradient-to, transparent) !important; }
.via-primary-400, .via-teal-400, .via-indigo-400, .via-sky-400, .via-blue-400 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-400), var(--tw-gradient-to, transparent) !important; }
.via-violet-400, .via-purple-400 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-400), var(--tw-gradient-to, transparent) !important; }
.via-primary-500, .via-teal-500, .via-indigo-500, .via-sky-500, .via-blue-500 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-500), var(--tw-gradient-to, transparent) !important; }
.via-violet-500, .via-purple-500 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-500), var(--tw-gradient-to, transparent) !important; }
.via-primary-600, .via-teal-600, .via-indigo-600, .via-sky-600, .via-blue-600 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-600), var(--tw-gradient-to, transparent) !important; }
.via-violet-600, .via-purple-600 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-600), var(--tw-gradient-to, transparent) !important; }
.via-primary-700, .via-teal-700, .via-indigo-700, .via-sky-700, .via-blue-700 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-700), var(--tw-gradient-to, transparent) !important; }
.via-violet-700, .via-purple-700 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-700), var(--tw-gradient-to, transparent) !important; }
.via-primary-800, .via-teal-800, .via-indigo-800, .via-sky-800, .via-blue-800 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-800), var(--tw-gradient-to, transparent) !important; }
.via-violet-800, .via-purple-800 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-800), var(--tw-gradient-to, transparent) !important; }
.via-primary-900, .via-teal-900, .via-indigo-900, .via-sky-900, .via-blue-900 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-900), var(--tw-gradient-to, transparent) !important; }
.via-violet-900, .via-purple-900 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-900), var(--tw-gradient-to, transparent) !important; }
.via-primary-950, .via-teal-950, .via-indigo-950, .via-sky-950, .via-blue-950 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand-950), var(--tw-gradient-to, transparent) !important; }
.via-violet-950, .via-purple-950 { --tw-gradient-stops: var(--tw-gradient-from), var(--brand2-950), var(--tw-gradient-to, transparent) !important; }
.to-primary-50, .to-teal-50, .to-indigo-50, .to-sky-50, .to-blue-50 { --tw-gradient-to: var(--brand-50) !important; }
.to-violet-50, .to-purple-50 { --tw-gradient-to: var(--brand2-50) !important; }
.to-primary-100, .to-teal-100, .to-indigo-100, .to-sky-100, .to-blue-100 { --tw-gradient-to: var(--brand-100) !important; }
.to-violet-100, .to-purple-100 { --tw-gradient-to: var(--brand2-100) !important; }
.to-primary-200, .to-teal-200, .to-indigo-200, .to-sky-200, .to-blue-200 { --tw-gradient-to: var(--brand-200) !important; }
.to-violet-200, .to-purple-200 { --tw-gradient-to: var(--brand2-200) !important; }
.to-primary-300, .to-teal-300, .to-indigo-300, .to-sky-300, .to-blue-300 { --tw-gradient-to: var(--brand-300) !important; }
.to-violet-300, .to-purple-300 { --tw-gradient-to: var(--brand2-300) !important; }
.to-primary-400, .to-teal-400, .to-indigo-400, .to-sky-400, .to-blue-400 { --tw-gradient-to: var(--brand-400) !important; }
.to-violet-400, .to-purple-400 { --tw-gradient-to: var(--brand2-400) !important; }
.to-primary-500, .to-teal-500, .to-indigo-500, .to-sky-500, .to-blue-500 { --tw-gradient-to: var(--brand-500) !important; }
.to-violet-500, .to-purple-500 { --tw-gradient-to: var(--brand2-500) !important; }
.to-primary-600, .to-teal-600, .to-indigo-600, .to-sky-600, .to-blue-600 { --tw-gradient-to: var(--brand-600) !important; }
.to-violet-600, .to-purple-600 { --tw-gradient-to: var(--brand2-600) !important; }
.to-primary-700, .to-teal-700, .to-indigo-700, .to-sky-700, .to-blue-700 { --tw-gradient-to: var(--brand-700) !important; }
.to-violet-700, .to-purple-700 { --tw-gradient-to: var(--brand2-700) !important; }
.to-primary-800, .to-teal-800, .to-indigo-800, .to-sky-800, .to-blue-800 { --tw-gradient-to: var(--brand-800) !important; }
.to-violet-800, .to-purple-800 { --tw-gradient-to: var(--brand2-800) !important; }
.to-primary-900, .to-teal-900, .to-indigo-900, .to-sky-900, .to-blue-900 { --tw-gradient-to: var(--brand-900) !important; }
.to-violet-900, .to-purple-900 { --tw-gradient-to: var(--brand2-900) !important; }
.to-primary-950, .to-teal-950, .to-indigo-950, .to-sky-950, .to-blue-950 { --tw-gradient-to: var(--brand-950) !important; }
.to-violet-950, .to-purple-950 { --tw-gradient-to: var(--brand2-950) !important; }

/* --- bare links / selection / scrollbar --- */
a:not([class*="text-"]):not([class*="bg-"]):not(.no-theme){ color: var(--color-link); }
a:not([class*="text-"]):not([class*="bg-"]):not(.no-theme):hover{ color: var(--color-link-hover); }
::selection{ background: var(--brand-200); color: var(--brand-900); }
::-webkit-scrollbar-thumb{ background-color: var(--brand-300); border-radius:4px; }
::-webkit-scrollbar-thumb:hover{ background-color: var(--brand-500); }

/* --- keep custom logo crisp --- */
img[src="/logo.png"], img[src*="logo"]{ border-radius:8px; box-shadow:0 2px 6px color-mix(in srgb, var(--brand-500) 18%, transparent); }