/* ═════════════════════════════════════════════════════════════════════
   Bot Control Center · Theme v5 (2026-04)
   -----------------------------------------------------------------
   Modern dashboard theme layered on top of style.css.
   Dark-first palette, WA-green / TG-blue accents, low GPU cost.
   NOTE: Chat pages opt out via body.page-chats { ... } guards below.
   ═════════════════════════════════════════════════════════════════════ */

/* ───────────── BASE TOKENS (non-color) ────────────────────────── */
:root,
:root[data-theme="dark"] {
  /* Radii */
  --th-r-xs: 6px;
  --th-r-sm: 9px;
  --th-r: 12px;
  --th-r-lg: 16px;
  --th-r-xl: 22px;
  --th-r-pill: 999px;

  /* Spacing scale */
  --th-s-1: 4px;
  --th-s-2: 8px;
  --th-s-3: 12px;
  --th-s-4: 16px;
  --th-s-5: 20px;
  --th-s-6: 24px;
  --th-s-8: 32px;
  --th-s-10: 40px;

  /* Motion */
  --th-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --th-dur: 180ms;
  --th-dur-slow: 320ms;

  /* Layout */
  --th-sidebar-w: 252px;
  --th-sidebar-w-collapsed: 72px;

  /* Elevation (computed; tints come from provider) */
  --th-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.30);
  --th-shadow: 0 6px 22px rgba(0, 0, 0, 0.32), 0 1px 2px rgba(0, 0, 0, 0.36);
  --th-shadow-lg: 0 22px 60px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.40);
  --th-shadow-glow: 0 0 0 1px var(--th-border-strong);
  --th-ring: 0 0 0 3px var(--th-accent-ring);

  /* Semantic — same across providers */
  --th-ok: #22c55e;
  --th-ok-soft: rgba(34, 197, 94, 0.14);
  --th-warn: #f59e0b;
  --th-warn-soft: rgba(245, 158, 11, 0.14);
  --th-danger: #ef4444;
  --th-danger-soft: rgba(239, 68, 68, 0.14);
  --th-info: #60a5fa;
  --th-info-soft: rgba(96, 165, 250, 0.14);
}

/* ═══════════════════════════════════════════════════════════════════
   PROVIDER PALETTES — full colour theming.
   The entire UI repaints when body.provider-* changes.
   ═══════════════════════════════════════════════════════════════════ */

/* ────────────────────────────────────────────────────────────────
   PROVIDER PALETTES — exact spec
   Light + dark variants for WhatsApp (green) and Telegram (blue).
   ──────────────────────────────────────────────────────────────── */

/* ────── WhatsApp DARK — pure neutral zinc (Linear/Vercel) ────── */
body.provider-whatsapp {
  /* Surfaces — pure neutral grey, no colour tint */
  --th-bg:            #0A0A0A;
  --th-bg-grad-1:     #0A0A0A;
  --th-bg-grad-2:     #080808;
  --th-sidebar:       #050505;     /* pitch black, contrasts with page */
  --th-sidebar-hi:    #131316;
  --th-surface:       #141416;     /* cards */
  --th-surface-2:     #1C1C1F;     /* inner panels, inputs */
  --th-surface-3:     #26262A;     /* hover */
  --th-surface-hi:    #303034;     /* strong hover / active */
  --th-surface-flat:  #0E0E10;     /* inset / sub-card */

  /* Borders — thin neutral whites */
  --th-border:        rgba(255, 255, 255, 0.07);
  --th-border-strong: rgba(255, 255, 255, 0.12);
  --th-border-soft:   rgba(255, 255, 255, 0.035);
  --th-divider:       rgba(255, 255, 255, 0.05);

  /* Text — crisp neutrals */
  --th-text:          #FAFAFA;
  --th-text-strong:   #FFFFFF;
  --th-muted:         #A1A1AA;
  --th-dim:           #71717A;
  --th-ghost:         rgba(255, 255, 255, 0.035);

  /* Accent — WhatsApp green */
  --th-accent:          #25D366;
  --th-accent-hi:       #2EE479;
  --th-accent-deep:     #128C7E;
  --th-accent-dim:      rgba(37, 211, 102, 0.13);
  --th-accent-ring:     rgba(37, 211, 102, 0.35);
  --th-accent-glow:     rgba(37, 211, 102, 0.40);
  --th-accent-contrast: #FFFFFF;
  --th-brand-grad:      linear-gradient(135deg, #2EE479 0%, #25D366 50%, #128C7E 100%);
  --th-brand-grad-soft: linear-gradient(135deg, rgba(46, 228, 121, 0.18) 0%, rgba(18, 140, 126, 0.08) 100%);

  --th-brand-mesh-1: none; --th-brand-mesh-2: none; --th-brand-mesh-3: none;

  /* Legacy style.css var bridges (overrides the slate-blue Modern Theme block) */
  --bg-app:           var(--th-bg);
  --bg-elevated:      var(--th-surface);
  --bg:               var(--th-bg);
  --bg-soft:          var(--th-surface-flat);
  --surface:          var(--th-surface);
  --surface-2:        var(--th-surface-2);
  --surface-3:        var(--th-surface-3);
  --hover:            var(--th-ghost);
  --hover-strong:     rgba(255, 255, 255, 0.10);
  --border:           var(--th-border);
  --border-soft:      var(--th-border-soft);
  --glass-border:     var(--th-border);
  --glass-highlight:  var(--th-border);
  --glass-blur:       0px;
  --glass-blur-sidebar: 0px;
  --glass-blur-modal:  0px;
  --glass-blur-backdrop: 0px;
  --text:             var(--th-text);
  --text-2:           var(--th-text);
  --text-mute:        var(--th-muted);
  --text-dim:         var(--th-dim);
  --muted:            var(--th-muted);
  --wa:               var(--th-accent);
  --wa-dim:           var(--th-accent-dim);
  --wa-glow:          var(--th-accent-glow);
  --r:                14px;
  --r-sm:             10px;
}

/* ────── WhatsApp LIGHT ────── */
:root[data-theme="light"] body.provider-whatsapp {
  --th-bg:            #F0F2F5;
  --th-bg-grad-1:     #F0F2F5;
  --th-bg-grad-2:     #E8EBEF;
  --th-sidebar:       #FFFFFF;
  --th-sidebar-hi:    #F0F2F5;
  --th-surface:       #FFFFFF;
  --th-surface-2:     #F8FAFB;
  --th-surface-3:     #F0F2F5;
  --th-surface-hi:    #E4E7EB;
  --th-surface-flat:  #F0F2F5;

  --th-border:        #E1E8ED;
  --th-border-strong: #CFD7DD;
  --th-border-soft:   #F0F2F5;
  --th-divider:       #E9ECEF;

  --th-text:          #111111;
  --th-text-strong:   #000000;
  --th-muted:         #54656F;
  --th-dim:           #8696A0;
  --th-ghost:         rgba(17, 17, 17, 0.04);

  --th-accent:          #25D366;
  --th-accent-hi:       #128C7E;
  --th-accent-deep:     #075E54;
  --th-accent-dim:      rgba(37, 211, 102, 0.10);
  --th-accent-ring:     rgba(37, 211, 102, 0.30);
  --th-accent-glow:     rgba(37, 211, 102, 0.18);
  --th-accent-contrast: #FFFFFF;
}

/* ────── Telegram DARK — pure neutral zinc ────── */
body.provider-telegram {
  --th-bg:            #0A0A0A;
  --th-bg-grad-1:     #0A0A0A;
  --th-bg-grad-2:     #080808;
  --th-sidebar:       #050505;
  --th-sidebar-hi:    #131316;
  --th-surface:       #141416;
  --th-surface-2:     #1C1C1F;
  --th-surface-3:     #26262A;
  --th-surface-hi:    #303034;
  --th-surface-flat:  #0E0E10;

  --th-border:        rgba(255, 255, 255, 0.07);
  --th-border-strong: rgba(255, 255, 255, 0.12);
  --th-border-soft:   rgba(255, 255, 255, 0.035);
  --th-divider:       rgba(255, 255, 255, 0.05);

  --th-text:          #FAFAFA;
  --th-text-strong:   #FFFFFF;
  --th-muted:         #A1A1AA;
  --th-dim:           #71717A;
  --th-ghost:         rgba(255, 255, 255, 0.035);

  /* Accent — Telegram blue */
  --th-accent:          #2AABEE;
  --th-accent-hi:       #229ED9;
  --th-accent-deep:     #1A87B8;
  --th-accent-dim:      rgba(42, 171, 238, 0.13);
  --th-accent-ring:     rgba(42, 171, 238, 0.35);
  --th-accent-glow:     rgba(42, 171, 238, 0.40);
  --th-accent-contrast: #FFFFFF;
  --th-brand-grad:      linear-gradient(135deg, #5DC0F5 0%, #2AABEE 50%, #229ED9 100%);
  --th-brand-grad-soft: linear-gradient(135deg, rgba(93, 192, 245, 0.18) 0%, rgba(34, 158, 217, 0.08) 100%);

  --th-brand-mesh-1: none; --th-brand-mesh-2: none; --th-brand-mesh-3: none;

  /* Legacy style.css var bridges (overrides the slate-blue Modern Theme block) */
  --bg-app:           var(--th-bg);
  --bg-elevated:      var(--th-surface);
  --bg:               var(--th-bg);
  --bg-soft:          var(--th-surface-flat);
  --surface:          var(--th-surface);
  --surface-2:        var(--th-surface-2);
  --surface-3:        var(--th-surface-3);
  --hover:            var(--th-ghost);
  --hover-strong:     rgba(255, 255, 255, 0.10);
  --border:           var(--th-border);
  --border-soft:      var(--th-border-soft);
  --glass-border:     var(--th-border);
  --glass-highlight:  var(--th-border);
  --glass-blur:       0px;
  --glass-blur-sidebar: 0px;
  --glass-blur-modal:  0px;
  --glass-blur-backdrop: 0px;
  --text:             var(--th-text);
  --text-2:           var(--th-text);
  --text-mute:        var(--th-muted);
  --text-dim:         var(--th-dim);
  --muted:            var(--th-muted);
  --wa:               var(--th-accent);
  --wa-dim:           var(--th-accent-dim);
  --wa-glow:          var(--th-accent-glow);
  --r:                14px;
  --r-sm:             10px;
}

/* ────── Telegram LIGHT ────── */
:root[data-theme="light"] body.provider-telegram {
  --th-bg:            #F5F7FA;
  --th-bg-grad-1:     #F5F7FA;
  --th-bg-grad-2:     #EDF1F5;
  --th-sidebar:       #FFFFFF;
  --th-sidebar-hi:    #F5F7FA;
  --th-surface:       #FFFFFF;
  --th-surface-2:     #F8FAFC;
  --th-surface-3:     #EFF3F7;
  --th-surface-hi:    #E4EAF0;
  --th-surface-flat:  #F5F7FA;

  --th-border:        #E5E7EB;
  --th-border-strong: #CBD2D8;
  --th-border-soft:   #F1F3F5;
  --th-divider:       #ECEEF0;

  --th-text:          #111827;
  --th-text-strong:   #03070A;
  --th-muted:         #5C6873;
  --th-dim:           #8B96A2;
  --th-ghost:         rgba(17, 24, 39, 0.04);

  --th-accent:          #2AABEE;
  --th-accent-hi:       #229ED9;
  --th-accent-deep:     #1A87B8;
  --th-accent-dim:      rgba(42, 171, 238, 0.10);
  --th-accent-ring:     rgba(42, 171, 238, 0.30);
  --th-accent-glow:     rgba(42, 171, 238, 0.18);
  --th-accent-contrast: #FFFFFF;
}

/* ─── Force legacy elevated containers onto new neutral surface tokens ─── */
/* ═════════════════════════════════════════════════════════════════════
   SYSTEM PAGES — neutral indigo + zinc theme.
   Scoped to the page-content wrapper (main.main-inner) ONLY so the
   sidebar / topbar keep their provider colors (WhatsApp green or
   Telegram blue). Applies inside: /dashboard/notifications,
   /dashboard/settings, /dashboard/training, /dashboard/database,
   /dashboard/logs, /dashboard/admin, /dashboard/agents.
   ═════════════════════════════════════════════════════════════════════ */
body.system-page .main-inner {
  --th-bg:            #0A0A0B;
  --th-bg-grad-1:     #0A0A0B;
  --th-bg-grad-2:     #08080A;

  --th-surface:       #141417;
  --th-surface-2:     #1B1B1F;
  --th-surface-3:     #25252A;
  --th-surface-hi:    #2F2F35;
  --th-surface-flat:  #0E0E10;

  --th-border:        rgba(255, 255, 255, 0.07);
  --th-border-strong: rgba(255, 255, 255, 0.13);
  --th-border-soft:   rgba(255, 255, 255, 0.035);
  --th-divider:       rgba(255, 255, 255, 0.05);

  --th-text:          #FAFAFA;
  --th-text-strong:   #FFFFFF;
  --th-muted:         #A1A1AA;
  --th-dim:           #71717A;
  --th-ghost:         rgba(255, 255, 255, 0.04);

  /* Monochrome accent — white on dark. Primary buttons read as solid
     white, active tabs / chips get a soft white wash. No colored tint
     anywhere. Matches Vercel / Linear / Cursor / Arc minimalism. */
  --th-accent:          #FAFAFA;
  --th-accent-hi:       #FFFFFF;
  --th-accent-deep:     #E4E4E7;
  --th-accent-dim:      rgba(255, 255, 255, 0.08);
  --th-accent-ring:     rgba(255, 255, 255, 0.22);
  --th-accent-glow:     rgba(255, 255, 255, 0.12);
  --th-accent-contrast: #09090B;
  --th-brand-grad:      linear-gradient(135deg, #FAFAFA 0%, #D4D4D8 100%);

  /* Legacy --wa alias used by some inline widgets; align it to the
     scoped accent so they don't fall back to WA green inside the page. */
  --wa:      var(--th-accent);
  --wa-dim:  var(--th-accent-dim);
  --wa-glow: var(--th-accent-glow);
}

:root[data-theme="light"] body.system-page .main-inner {
  --th-bg:            #FAFAFA;
  --th-bg-grad-1:     #FAFAFA;
  --th-bg-grad-2:     #F4F4F5;

  --th-surface:       #FFFFFF;
  --th-surface-2:     #F4F4F5;
  --th-surface-3:     #E4E4E7;
  --th-surface-hi:    #D4D4D8;
  --th-surface-flat:  #FAFAFA;

  --th-border:        #E4E4E7;
  --th-border-strong: #D4D4D8;
  --th-border-soft:   #F4F4F5;
  --th-divider:       #E4E4E7;

  --th-text:          #18181B;
  --th-text-strong:   #09090B;
  --th-muted:         #52525B;
  --th-dim:           #71717A;
  --th-ghost:         rgba(0, 0, 0, 0.04);

  /* Monochrome accent — near-black on light. */
  --th-accent:          #18181B;
  --th-accent-hi:       #09090B;
  --th-accent-deep:     #000000;
  --th-accent-dim:      rgba(24, 24, 27, 0.06);
  --th-accent-ring:     rgba(24, 24, 27, 0.22);
  --th-accent-glow:     rgba(24, 24, 27, 0.10);
  --th-accent-contrast: #FFFFFF;
}


body:not(.page-chats) .glass-card,
body:not(.page-chats) .card {
  background: var(--th-surface);
  border-color: var(--th-border);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.20);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
:root[data-theme="light"] body:not(.page-chats) .glass-card,
:root[data-theme="light"] body:not(.page-chats) .card {
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 4px 12px rgba(15, 23, 42, 0.04);
}
body:not(.page-chats) .glass-input { background: var(--th-surface-2) !important; }

/* ─── Light-mode performance overrides ────────────────────────────────────
   Dark-mode shadows use rgba(0,0,0,0.55) which is a perf killer on white
   backgrounds (browser repaints huge soft shadows on every layout shift).
   Override globally with much lighter shadows + disable backdrop-filter
   blurs (which provide no visual value when both surface and bg are white). */
:root[data-theme="light"] {
  --th-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --th-shadow:    0 1px 3px rgba(15, 23, 42, 0.06), 0 4px 10px rgba(15, 23, 42, 0.04);
  --th-shadow-lg: 0 4px 16px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
}
:root[data-theme="light"] body:not(.page-chats) *,
:root[data-theme="light"] body:not(.page-chats) *::before,
:root[data-theme="light"] body:not(.page-chats) *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   LIGHT-MODE COLOR CONTRAST SAFETY NET
   Dashboard pages have many hardcoded colors designed for dark mode
   (light blue/cyan/green text on dark bg). These rules force-correct the
   most common contrast bugs: light text on light bg, dark text on dark
   backgrounds in card surfaces, etc. Scoped to non-chat pages only.
═══════════════════════════════════════════════════════════════════════════ */
:root[data-theme="light"] body:not(.page-chats):not(.page-telegram-chats):not(.page-tg-chats) {
  /* Headings always strong dark */
  & h1, & h2, & h3, & h4, & h5, & h6 {
    color: var(--th-text-strong) !important;
  }

  /* Body text default */
  & p, & span, & li, & td, & th, & dt, & dd, & label {
    color: var(--th-text);
  }

  /* Pale text colors (light blue/cyan/green) used for headers/labels in dark mode → switch to muted on light */
  & [class*="-kicker"],
  & [class*="-title"],
  & [class*="-subtitle"],
  & [class*="-label"],
  & [class*="-hint"] {
    color: var(--th-text);
  }

  /* Common kicker colors in dark mode (sky-blue, cyan-100, emerald-200) — invisible on white */
  & .tg-connect-kicker,
  & .tg-connect-step-label,
  & .tg-connect-list-title,
  & .tg-connect-list-meta,
  & .acct-callout-title,
  & .acct-callout-text,
  & [style*="color: #7dd3fc"],
  & [style*="color: #e0f2fe"],
  & [style*="color: #bae6fd"],
  & [style*="color: #86efac"],
  & [style*="color: #ecfdf5"],
  & [style*="color:#7dd3fc"],
  & [style*="color:#e0f2fe"],
  & [style*="color:#bae6fd"],
  & [style*="color:#86efac"],
  & [style*="color:#ecfdf5"] {
    color: var(--th-text) !important;
  }

  /* Light text + heavy weight = title-on-card → use strong */
  & strong, & b {
    color: inherit;
  }

  /* Muted text */
  & .muted, & [class*="-muted"], & [class*="-dim"], & [class*="-meta"] {
    color: var(--th-muted);
  }

  /* Inputs, selects, textareas — force readable text */
  & input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  & select,
  & textarea {
    color: var(--th-text);
    background-color: var(--th-surface);
  }
  & input::placeholder,
  & textarea::placeholder {
    color: var(--th-dim);
    opacity: 1;
  }

  /* Buttons that don't explicitly set color → readable dark text */
  & button:not([class*="--accent"]):not([class*="--primary"]):not([class*="--danger"]):not([class*="--green"]):not([class*="--red"]):not([class*="--blue"]):not([class*="--gold"]):not([class*="-cta"]):not(.btn-wa):not(.tg-btn-primary):not(.afx-connect-btn):not(.amini-btn--resume):not(.amini-btn--accent) {
    color: var(--th-text);
  }

  /* Code / mono pills: usually small badges with darker bg in dark mode → invert */
  & code, & .mono, & kbd {
    color: var(--th-text);
    background-color: var(--th-surface-2);
  }

  /* Cards / surfaces with rgba(255,255,255,0.0X) backgrounds (designed for dark)
     would be invisible on white — force them to use surface-2 */
  & [style*="background:rgba(255,255,255,0"],
  & [style*="background: rgba(255,255,255,0"],
  & [style*="background:rgba(255, 255, 255, 0"],
  & [style*="background: rgba(255, 255, 255, 0"] {
    background-color: var(--th-surface-2) !important;
  }
}
body:not(.page-chats) .glass-inset {
  background: var(--th-surface-flat);
  border-color: var(--th-border);
}

/* ───────────── GLOBAL BASE ────────────────────────────────────── */
html, body { background: var(--th-bg); }

body:not(.page-chats) {
  color: var(--th-text);
  font-family: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
  font-feature-settings: "cv11", "ss01", "ss03";
  letter-spacing: -0.005em;
  background: var(--th-bg) !important;
  background-image: none !important;
  background-attachment: fixed;
}

/* ───────────── KILL HARDCODED SLATE-BLUE BACKGROUNDS ────────── */
/* These are leftovers in style.css using hardcoded #0f172a / #1e293b
   (slate) instead of var(--th-bg). Force them to neutral zinc. */
body:not(.page-chats) .analytics-page {
  background: var(--th-bg) !important;
}
body:not(.page-chats) .phone-chassis {
  background: var(--th-surface) !important;
  border-color: var(--th-border) !important;
}
body:not(.page-chats) .phone-notch {
  background: #050505 !important;
}

body:not(.page-chats) ::selection {
  background: var(--th-accent-ring);
  color: var(--th-text-strong);
}

/* Scrollbar — subtle, modern */
body:not(.page-chats) * {
  scrollbar-width: thin;
  scrollbar-color: var(--th-border-strong) transparent;
}
body:not(.page-chats) *::-webkit-scrollbar { width: 10px; height: 10px; }
body:not(.page-chats) *::-webkit-scrollbar-track { background: transparent; }
body:not(.page-chats) *::-webkit-scrollbar-thumb {
  background: var(--th-border);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
body:not(.page-chats) *::-webkit-scrollbar-thumb:hover {
  background: var(--th-border-strong);
  background-clip: padding-box;
  border: 2px solid transparent;
}

/* Disable chat pages theming (they keep their own look) */
body.page-chats { background: var(--th-bg) !important; }

/* ───────────── LAYOUT FIXES ───────────────────────────────────── */
body:not(.page-chats) .app-layout {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--th-sidebar-w) 1fr;
  gap: 0;
}

html.sidenav-is-collapsed body:not(.page-chats) .app-layout {
  grid-template-columns: var(--th-sidebar-w-collapsed) 1fr;
}

@media (max-width: 960px) {
  body:not(.page-chats) .app-layout { grid-template-columns: 1fr; }
}

body:not(.page-chats) .main-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

body:not(.page-chats) .main-inner {
  max-width: 1500px;
  width: 100%;
  margin: 0 auto;
  padding: 28px 32px 48px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  animation: th-fade-in 0.42s var(--th-ease);
}

@keyframes th-fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}

@media (max-width: 720px) {
  body:not(.page-chats) .main-inner { padding: 20px 16px 40px; gap: 16px; }
}

/* ───────────── SIDEBAR (pitch-black, contrasts with page) ────── */
body .sidenav {
  background: var(--th-sidebar);
  border-right: 1px solid var(--th-border-strong);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  width: var(--th-sidebar-w);
  min-width: var(--th-sidebar-w);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 16px 12px 16px;
  gap: 14px;
  z-index: 60;
  box-shadow: 1px 0 0 rgba(0, 0, 0, 0.4);
  transition: width var(--th-dur) var(--th-ease);
}

html.sidenav-is-collapsed body .sidenav {
  width: var(--th-sidebar-w-collapsed);
  min-width: var(--th-sidebar-w-collapsed);
}

body .sidenav-brand-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 6px 10px;
  border-bottom: 1px solid var(--th-divider);
  margin-bottom: 4px;
}

body .sidenav-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--th-text-strong);
  text-decoration: none;
  padding: 4px;
  border-radius: var(--th-r);
  flex: 1;
  min-width: 0;
  transition: background var(--th-dur);
}
body .sidenav-brand:hover { background: var(--th-ghost); }

body .sidenav-brand-mark {
  width: 36px; height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  background: var(--th-accent);
  box-shadow: none;
  border: 1px solid var(--th-border);
  flex-shrink: 0;
}
body .sidenav-brand-mark svg {
  width: 22px;
  height: 22px;
  color: #FFFFFF;
  fill: currentColor;
}
body .sidenav-brand-text {
  display: flex; flex-direction: column; min-width: 0;
}
body .sidenav-brand-name {
  font-weight: 700;
  font-size: 14px;
  letter-spacing: -0.01em;
  color: var(--th-text-strong);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body .sidenav-brand-sub {
  font-size: 10.5px;
  color: var(--th-muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 600;
}

body .sidenav-collapse-btn {
  flex-shrink: 0;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  border-radius: 8px;
  background: transparent;
  border: 1px solid transparent;
  color: var(--th-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  transition: background var(--th-dur), color var(--th-dur), border-color var(--th-dur);
}
body .sidenav-collapse-btn svg { width: 16px; height: 16px; flex-shrink: 0; }
body .sidenav-collapse-btn:hover {
  background: var(--th-ghost);
  border-color: var(--th-border);
  color: var(--th-text);
}
html.sidenav-is-collapsed body .sidenav-collapse-ic-close { display: none; }
html:not(.sidenav-is-collapsed) body .sidenav-collapse-ic-open { display: none; }

/* Provider switcher */
body .sidenav-mode {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r);
}
body .sidenav-mode-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 6px;
  border-radius: calc(var(--th-r) - 4px);
  color: var(--th-muted);
  text-decoration: none;
  font-size: 12px;
  font-weight: 600;
  transition: background var(--th-dur), color var(--th-dur);
  min-width: 0;
}
body .sidenav-mode-pill span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body .sidenav-mode-pill svg { flex-shrink: 0; }
body .sidenav-mode-pill:hover { color: var(--th-text); }
body .sidenav-mode-pill.is-active {
  background: var(--th-surface);
  color: var(--th-text-strong);
  box-shadow: 0 1px 2px rgba(0,0,0,.22), 0 0 0 1px var(--th-border-strong);
}
body.provider-whatsapp:not(.page-chats) .sidenav-mode-pill.is-active { color: #25d366; }
body.provider-telegram:not(.page-chats) .sidenav-mode-pill.is-active { color: #2aabee; }

html.sidenav-is-collapsed body .sidenav-mode-pill span { display: none; }

/* Compose button */
body .sidenav-compose {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  font-weight: 600;
  font-size: 13px;
  text-decoration: none;
  box-shadow: none;
  border: 1px solid transparent;
  transition: background var(--th-dur);
}
body .sidenav-compose:hover {
  background: var(--th-accent-hi);
  filter: none;
  transform: none;
  box-shadow: none;
}
body .sidenav-compose:active { transform: none; }
body .sidenav-compose-ic {
  width: 22px; height: 22px;
  border-radius: 6px;
  background: rgba(255,255,255,.18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
body .sidenav-compose-text { flex: 1; min-width: 0; }
body .sidenav-compose-kbd {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(0,0,0,.2);
  color: rgba(255,255,255,.85);
}
html.sidenav-is-collapsed body .sidenav-compose-text,
html.sidenav-is-collapsed body .sidenav-compose-kbd { display: none; }
html.sidenav-is-collapsed body .sidenav-compose { justify-content: center; padding: 9px; }

/* Scroll section */
body .sidenav-scroll {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 2px;
  margin-right: -2px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

body .sidenav-section {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
body .sidenav-section-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--th-dim);
  padding: 6px 10px 4px;
}
html.sidenav-is-collapsed body .sidenav-section-label {
  opacity: 0;
  height: 6px;
  padding: 0;
  pointer-events: none;
}

body .sidenav-link {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 8px 10px;
  border-radius: var(--th-r-sm);
  color: var(--th-muted);
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  position: relative;
  transition: background var(--th-dur), color var(--th-dur);
}
body .sidenav-link-ic { flex-shrink: 0; }
body .sidenav-link:hover {
  background: var(--th-ghost);
  color: var(--th-text);
}
body .sidenav-link.is-active {
  background: var(--th-surface-2);
  color: var(--th-text-strong);
  box-shadow: none;
}
body .sidenav-link.is-active::before {
  content: "";
  position: absolute;
  left: 0; top: 22%; bottom: 22%;
  width: 2px;
  border-radius: 0 2px 2px 0;
  background: var(--th-accent);
  box-shadow: none;
}
body .sidenav-link.is-active .sidenav-link-ic { color: var(--th-accent); }

body .sidenav-link-text { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.sidenav-is-collapsed body .sidenav-link-text,
html.sidenav-is-collapsed body .sidenav-link-badge { display: none; }

body .sidenav-link-badge {
  min-width: 20px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--th-danger);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body .sidenav-live-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--th-ok);
  box-shadow: 0 0 0 3px rgba(34,197,94,.22);
  animation: th-pulse 1.8s ease-in-out infinite;
}
@keyframes th-pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50% { opacity: .55; transform: scale(.85); }
}

/* Collapsed state: keep icons centred, tooltip via data-tip */
html.sidenav-is-collapsed body .sidenav-link { justify-content: center; padding: 9px; }
html.sidenav-is-collapsed body .sidenav-brand-text { display: none; }
html.sidenav-is-collapsed body .sidenav-brand-row {
  flex-direction: column;
  border-bottom: 1px solid var(--th-divider);
  padding: 4px 0 10px;
  gap: 6px;
}

/* Data-tip tooltip (collapsed only) */
body:not(.page-chats) [data-tip] { position: relative; }
html.sidenav-is-collapsed body:not(.page-chats) [data-tip]:hover::after {
  content: attr(data-tip);
  position: absolute;
  left: calc(100% + 12px); top: 50%;
  transform: translateY(-50%);
  padding: 5px 9px;
  background: var(--th-surface-hi);
  color: var(--th-text-strong);
  border: 1px solid var(--th-border-strong);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  z-index: 80;
  pointer-events: none;
  box-shadow: var(--th-shadow);
  animation: th-fade-in .15s var(--th-ease);
}

/* Sidenav footer */
body .sidenav-foot {
  border-top: 1px solid var(--th-divider);
  padding: 12px 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
}
body .sidenav-status {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: transparent;
  border: 1px solid var(--th-border);
  border-radius: 10px;
}
body .sidenav-status-cell {
  display: flex; align-items: center; gap: 8px;
  flex: 1; min-width: 0;
  color: var(--th-text);
  text-decoration: none;
}
body .sidenav-status-cell--link {
  cursor: pointer;
  border-radius: 6px;
  padding: 2px 4px;
  margin: -2px -4px;
  transition: background 120ms ease;
}
body .sidenav-status-cell--link:hover {
  background: var(--th-ghost);
  color: var(--th-text-strong);
}
body .sidenav-status-divider {
  width: 1px; height: 22px; background: var(--th-divider);
}
body .sidenav-status-pulse {
  position: relative;
  width: 8px; height: 8px;
  flex: 0 0 8px;
}
body .sidenav-status-pulse-dot {
  position: absolute; inset: 0;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.16);
}
body .sidenav-status-pulse-ring { display: none; }
body .sidenav-status-info {
  display: flex; flex-direction: column; line-height: 1.15; min-width: 0;
}
body .sidenav-status-num {
  font-weight: 600; font-size: 13px; color: var(--th-text-strong);
  font-variant-numeric: tabular-nums;
}
body .sidenav-status-lbl {
  font-size: 10.5px; color: var(--th-muted); letter-spacing: .02em; font-weight: 500;
}
html.sidenav-is-collapsed body .sidenav-status { display: none; }

/* Sidenav utility row: single 34px band; .sidenav-ut-slot isolates the TZ control from popover layout. */
body .sidenav-utility-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  box-sizing: border-box;
  gap: 6px;
  margin: 0;
  padding: 0;
}
body .sidenav-utility-row > .sidenav-ut-slot {
  flex: 1 1 auto;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  position: relative;
  overflow: visible;
}
/* Inner [data-pop]: block so only the button affects height; pop is position:absolute + display:none. */
body .sidenav-utility-row > .sidenav-ut-slot > .sidenav-tz {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  height: 100%;
  max-height: 34px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
body .sidenav-utility-row > .sidenav-ut-slot .sidenav-utility-btn {
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  line-height: 1.15;
  box-sizing: border-box;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  margin: 0;
  padding: 0 10px;
}
/* Theme + logout: fixed square cells, no inline-flex baseline / descender shift */
body .sidenav-utility-row > .sidenav-utility-icon,
body .sidenav-utility-row > button.sidenav-utility-icon,
body .sidenav-utility-row > a.sidenav-utility-icon {
  flex: 0 0 34px;
  align-self: center;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  padding: 0 !important;
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  max-width: 34px;
  max-height: 34px;
  box-sizing: border-box;
  line-height: 0;
}
html.sidenav-is-collapsed body .sidenav-utility-row {
  flex-direction: column;
  height: auto;
  min-height: 0;
  max-height: none;
  align-items: center;
  gap: 6px;
}
html.sidenav-is-collapsed body .sidenav-utility-row > .sidenav-ut-slot {
  width: 100%;
  max-width: 100%;
  justify-content: center;
  height: 34px;
}
html.sidenav-is-collapsed body .sidenav-utility-row > .sidenav-ut-slot > .sidenav-tz {
  max-width: 34px;
  margin: 0 auto;
}
html.sidenav-is-collapsed body .sidenav-utility-row > .sidenav-utility-icon,
html.sidenav-is-collapsed body .sidenav-utility-row > a.sidenav-utility-icon,
html.sidenav-is-collapsed body .sidenav-utility-row > button.sidenav-utility-icon {
  width: 34px;
  flex: 0 0 34px;
}

body .sidenav-utility-btn {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  gap: 6px;
  padding: 0 10px;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  border-radius: 8px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
  font-weight: 600;
  transition: background var(--th-dur), color var(--th-dur);
  min-width: 0;
}
body .sidenav-utility-btn:hover { color: var(--th-text); }
body .sidenav-utility-btn-text {
  flex: 1; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  text-align: left;
}
body .sidenav-utility-caret { margin-left: auto; opacity: .6; }

body .sidenav-utility-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 34px;
  min-width: 34px;
  max-width: 34px;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  flex-shrink: 0;
  border-radius: 8px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  cursor: pointer;
  text-decoration: none;
  font-family: inherit;
  padding: 0;
  transition: background var(--th-dur), color var(--th-dur), border-color var(--th-dur);
}
body .sidenav-utility-icon:hover {
  color: var(--th-text);
  border-color: var(--th-border-strong);
  background: var(--th-surface-hi);
}
html[data-theme="dark"] body .sun-ic { display: none; }
html[data-theme="dark"] body .moon-ic { display: inline-block; }
html[data-theme="light"] body .sun-ic { display: inline-block; }
html[data-theme="light"] body .moon-ic { display: none; }
body .sidenav-utility-icon svg,
body .sidenav-utility-btn > svg {
  width: 16px; height: 16px; flex-shrink: 0;
}
body .sidenav-utility-btn-text {
  flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  text-align: left;
}
body .sidenav-utility-caret { width: 10px; height: 10px; flex-shrink: 0; opacity: 0.6; }

body .sidenav-profile {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 8px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r);
  text-decoration: none;
  transition: background 0.14s ease, border-color 0.14s ease;
  cursor: pointer;
}
body a.sidenav-profile:hover,
body a.sidenav-profile--admin:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
  text-decoration: none;
}
/* Admin profile — shield icon + chevron */
body .sidenav-profile--admin {
  background: color-mix(in srgb, var(--th-accent) 6%, var(--th-surface-2));
  border: 1px solid color-mix(in srgb, var(--th-accent) 20%, transparent);
  position: relative;
  overflow: hidden;
}
body .sidenav-profile--admin::before {
  content: '';
  position: absolute; inset: 0; border-radius: inherit;
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--th-accent) 6%, transparent),
    transparent 60%);
  pointer-events: none;
}
body .sidenav-profile-avatar--admin {
  background: linear-gradient(135deg,
    color-mix(in srgb, var(--th-accent) 25%, transparent),
    color-mix(in srgb, var(--th-accent) 10%, transparent));
  border: 1px solid color-mix(in srgb, var(--th-accent) 30%, transparent);
  color: var(--th-accent);
  box-shadow: 0 0 8px color-mix(in srgb, var(--th-accent) 20%, transparent);
}
body .sidenav-profile-status-dot--on {
  background: var(--th-accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--th-accent) 25%, transparent);
  animation: snPulseDot 2.5s ease-in-out infinite;
}
@keyframes snPulseDot {
  0%,100% { opacity:1; } 50% { opacity:0.55; }
}
body .sidenav-profile-chevron {
  margin-left: auto;
  flex-shrink: 0;
  opacity: 0.4;
  transition: opacity 0.14s ease;
}
body a.sidenav-profile--admin:hover .sidenav-profile-chevron { opacity: 0.75; }
html.sidenav-is-collapsed body .sidenav-profile-chevron { display: none; }
body .sidenav-profile-avatar {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
body .sidenav-profile-info { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
body .sidenav-profile-name {
  font-size: 12.5px; font-weight: 700; color: var(--th-text-strong);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body .sidenav-profile-meta {
  font-size: 11px; color: var(--th-muted); display: inline-flex; align-items: center; gap: 5px;
}
body .sidenav-profile-status-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--th-ok);
  box-shadow: 0 0 0 2px rgba(34,197,94,.2);
}
html.sidenav-is-collapsed body .sidenav-profile-info { display: none; }
html.sidenav-is-collapsed body .sidenav-profile { justify-content: center; padding: 5px; }

/* Mobile toggle */
body .sidenav-mobile-toggle {
  position: fixed;
  top: 14px; left: 14px;
  width: 42px; height: 42px;
  border-radius: 12px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  color: var(--th-text);
  box-shadow: var(--th-shadow);
  z-index: 70;
  display: none;
  align-items: center; justify-content: center;
  cursor: pointer;
}
@media (max-width: 960px) {
  body .sidenav-mobile-toggle { display: inline-flex; }
  body .sidenav {
    position: fixed;
    top: 0; left: 0;
    transform: translateX(-100%);
    transition: transform var(--th-dur-slow) var(--th-ease);
    height: 100vh;
    width: 280px;
    min-width: 280px;
  }
  body .sidenav.is-mobile-open { transform: translateX(0); }
  body .sidenav-backdrop {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.5);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--th-dur);
    z-index: 55;
  }
  body .sidenav-backdrop.is-shown { opacity: 1; pointer-events: auto; }
  body.sidenav-mobile-locked { overflow: hidden; }
  body:not(.page-chats) .main-inner { padding-top: 72px; }
}

/* ───────────── TYPOGRAPHY ─────────────────────────────────────── */
body:not(.page-chats) h1, body:not(.page-chats) h2,
body:not(.page-chats) h3, body:not(.page-chats) h4 {
  color: var(--th-text-strong);
  letter-spacing: -0.02em;
  margin: 0;
}

body:not(.page-chats) .page-head,
body:not(.page-chats) .page-head-lg {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin: 0 0 4px;
  padding: 4px 0 18px;
  border-bottom: 1px solid var(--th-divider);
}
body:not(.page-chats) .page-title {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.025em;
}
body:not(.page-chats) .page-head-lg .page-title { font-size: 32px; }
body:not(.page-chats) .page-sub {
  color: var(--th-muted);
  font-size: 13.5px;
  margin: 4px 0 0;
  font-weight: 500;
}

body:not(.page-chats) .muted { color: var(--th-muted); }
body:not(.page-chats) .small { font-size: 12px; }
body:not(.page-chats) .mono {
  font-family: "JetBrains Mono", "SF Mono", "Monaco", "Courier New", monospace;
  font-feature-settings: "tnum", "zero";
}

body:not(.page-chats) .text-link {
  color: var(--th-accent-hi);
  text-decoration: none;
  font-weight: 600;
  transition: color var(--th-dur);
}
body:not(.page-chats) .text-link:hover { color: var(--th-accent); filter: brightness(1.1); }

/* ───────────── CARDS / SURFACES ──────────────────────────────── */
body:not(.page-chats) .glass-card,
body:not(.page-chats) .card {
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r-lg);
  padding: 20px 22px;
  box-shadow: var(--th-shadow-sm);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transition: border-color var(--th-dur), box-shadow var(--th-dur);
}
body:not(.page-chats) .glass-card:hover,
body:not(.page-chats) .card:hover {
  border-color: var(--th-border-strong);
}
body:not(.page-chats) .glass-inset {
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r);
  padding: 14px 16px;
}

body:not(.page-chats) .card-title {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--th-text-strong);
  letter-spacing: -0.01em;
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
body:not(.page-chats) .card-subtitle {
  color: var(--th-muted);
  font-size: 12.5px;
  font-weight: 500;
}

body:not(.page-chats) .section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

/* ═══════════════════════════════════════════════════════════════
   UNIFIED BUTTON SYSTEM v3 — clean, premium, properly aligned.
   - Soft default bg using surface-2 (visible against page bg)
   - Subtle hover: gentle bg shift + 1px lift, no harsh glow
   - 40px square icon-only buttons (.btn-icon, .wa-iconbtn-style)
   - Consistent padding, font-size, height across all variants
   ═══════════════════════════════════════════════════════════════ */

/* — Base: every dashboard button class normalises onto this — */
body:not(.page-chats) button:not([class*="-"]):not(.wa-iconbtn):not(.wa-comp-tools-l button):not(.wa-comp-tools-r button):not(.wa-bub-menu-trigger):not(.wa-list-filter):not(.wa-list-tab):not(.wa-dd-item):not(.wa-info-action):not(.wa-info-btn):not(.wa-attach-pop-btn):not(.wa-bulk-clear):not(.wa-emoji-btn):not(.dx-tab):not(.dx-iconbtn):not(.dx-filter):not(.dx-cta):not(.dx-card-link):not(.snd-action):not(.snd-iconbtn):not(.snd-tool):not(.snd-preset):not(.snd-bulk-clear):not(.amini-iconbtn):not(.amini-btn):not(.ov4-feed-btn):not(.ov4-feed-iconbtn):not(.ov4-tag-btn):not(.cmdk-item):not(.th-toast):not(.sidenav-collapse-btn):not(.sidenav-utility-icon):not(.sidenav-utility-btn):not(.sidenav-mobile-toggle):not(.sidenav-mode-pill):not(.sidenav-link):not(.sidenav-compose):not(.acard-iconbtn):not(.snd-bulk-clear):not(.dx-feed-row-action):not(.snd-tab-n):not(.dx-search-trigger):not(.lgx-link-btn):not(.anx-export):not(.afx-cta):not(.setx-mode-link):not(.dbx-thread-open):not(.dbx-mini-btn):not(.dbx-tab):not(.dbx-link),
body:not(.page-chats) .btn,
body:not(.page-chats) .btn-wa,
body:not(.page-chats) .btn-wa-secondary,
body:not(.page-chats) .btn-wa-sm,
body:not(.page-chats) .btn-ghost,
body:not(.page-chats) .btn-tg-ghost,
body:not(.page-chats) .btn-global,
body:not(.page-chats) .btn-global-wa,
body:not(.page-chats) .btn-global-accent,
body:not(.page-chats) .btn-global-warn,
body:not(.page-chats) .btn-global-danger,
body:not(.page-chats) .btn-global-muted,
body:not(.page-chats) .btn-feed,
body:not(.page-chats) .btn-feed-muted,
body:not(.page-chats) .btn-feed-outline,
body:not(.page-chats) .btn-feed-link,
body:not(.page-chats) .btn-block,
body:not(.page-chats) .btn-danger,
body:not(.page-chats) .btn-danger-outline,
body:not(.page-chats) .btn-warn,
body:not(.page-chats) .btn-secondary,
body:not(.page-chats) .btn-primary,
body:not(.page-chats) .btn-icon,
body:not(.page-chats) .btn-analytics-export,
body:not(.page-chats) .btn-xs,
body:not(.page-chats) .acct3-btn,
body:not(.page-chats) .acct3-btn--primary,
body:not(.page-chats) .acct3-btn--ghost,
body:not(.page-chats) .acct3-btn--danger-ghost,
body:not(.page-chats) .acct3-btn--sm,
body:not(.page-chats) .acct3-btn--lg,
body:not(.page-chats) .acct3-cta,
body:not(.page-chats) .acct3-cta--lg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  min-height: 40px;
  height: 40px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.005em;
  white-space: nowrap;
  background: var(--th-surface-2);
  color: var(--th-text);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  cursor: pointer;
  user-select: none;
  text-decoration: none;
  text-shadow: none;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
  vertical-align: middle;
  flex-shrink: 0;
  transition:
    background-color 150ms ease,
    border-color    150ms ease,
    color           150ms ease,
    transform       120ms ease,
    box-shadow      150ms ease,
    filter          150ms ease;
}

/* SVG icons inside buttons — fixed size, no shrink */
body:not(.page-chats) .btn svg,
body:not(.page-chats) .btn-wa svg,
body:not(.page-chats) .btn-wa-secondary svg,
body:not(.page-chats) .btn-wa-sm svg,
body:not(.page-chats) .btn-ghost svg,
body:not(.page-chats) .btn-tg-ghost svg,
body:not(.page-chats) .btn-global svg,
body:not(.page-chats) .btn-feed svg,
body:not(.page-chats) .btn-feed-link svg,
body:not(.page-chats) .btn-block svg,
body:not(.page-chats) .btn-danger svg,
body:not(.page-chats) .btn-danger-outline svg,
body:not(.page-chats) .btn-warn svg,
body:not(.page-chats) .btn-secondary svg,
body:not(.page-chats) .btn-primary svg,
body:not(.page-chats) .btn-icon svg,
body:not(.page-chats) .btn-analytics-export svg,
body:not(.page-chats) .btn-xs svg,
body:not(.page-chats) .acct3-btn svg {
  flex-shrink: 0;
  pointer-events: none;
  width: 18px;
  height: 18px;
  stroke-width: 2;
  display: block;
}

/* — Default (secondary) hover: soft tint, slight lift — */
body:not(.page-chats) .btn:hover,
body:not(.page-chats) .btn-secondary:hover,
body:not(.page-chats) .btn-wa-secondary:hover,
body:not(.page-chats) .btn-global:hover,
body:not(.page-chats) .btn-feed:hover,
body:not(.page-chats) .btn-feed-muted:hover,
body:not(.page-chats) .btn-feed-outline:hover,
body:not(.page-chats) .btn-ghost:hover,
body:not(.page-chats) .btn-tg-ghost:hover,
body:not(.page-chats) .btn-icon:hover,
body:not(.page-chats) .acct3-btn--ghost:hover,
body:not(.page-chats) .acct3-btn:hover,
body:not(.page-chats) .btn-analytics-export:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
  color: var(--th-text-strong);
}

body:not(.page-chats) .btn:active,
body:not(.page-chats) .btn-secondary:active,
body:not(.page-chats) .btn-wa-secondary:active,
body:not(.page-chats) .btn-ghost:active,
body:not(.page-chats) .btn-feed:active,
body:not(.page-chats) .btn-global:active,
body:not(.page-chats) .btn-icon:active,
body:not(.page-chats) .acct3-btn:active {
  background: var(--th-surface-hi);
  transform: translateY(0);
  box-shadow: none;
}

/* Focus ring */
body:not(.page-chats) .btn:focus-visible,
body:not(.page-chats) .btn-secondary:focus-visible,
body:not(.page-chats) .btn-wa:focus-visible,
body:not(.page-chats) .btn-wa-secondary:focus-visible,
body:not(.page-chats) .btn-wa-sm:focus-visible,
body:not(.page-chats) .btn-ghost:focus-visible,
body:not(.page-chats) .btn-feed:focus-visible,
body:not(.page-chats) .btn-feed-link:focus-visible,
body:not(.page-chats) .btn-global:focus-visible,
body:not(.page-chats) .btn-danger:focus-visible,
body:not(.page-chats) .btn-warn:focus-visible,
body:not(.page-chats) .btn-icon:focus-visible,
body:not(.page-chats) .acct3-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--th-accent-ring);
  border-color: var(--th-accent);
}

/* Disabled */
body:not(.page-chats) .btn[disabled],
body:not(.page-chats) .btn-wa[disabled],
body:not(.page-chats) .btn-wa-sm[disabled],
body:not(.page-chats) .btn-secondary[disabled],
body:not(.page-chats) .btn-primary[disabled],
body:not(.page-chats) button[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

/* — PRIMARY (brand-tinted, single colour, NOT a gradient) — */
body:not(.page-chats) .btn-primary,
body:not(.page-chats) .btn-wa,
body:not(.page-chats) .btn-wa-sm,
body:not(.page-chats) .btn-global-wa,
body:not(.page-chats) .btn-global-accent,
body:not(.page-chats) .acct3-btn--primary,
body:not(.page-chats) .acct3-cta,
body:not(.page-chats) .acct3-cta--lg {
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  border-color: transparent;
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.10);
}
body:not(.page-chats) .btn-primary:hover,
body:not(.page-chats) .btn-wa:hover,
body:not(.page-chats) .btn-wa-sm:hover,
body:not(.page-chats) .btn-global-wa:hover,
body:not(.page-chats) .btn-global-accent:hover,
body:not(.page-chats) .acct3-btn--primary:hover,
body:not(.page-chats) .acct3-cta:hover {
  background: var(--th-accent-hi);
  color: var(--th-accent-contrast);
  border-color: transparent;
  transform: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.10);
}
body:not(.page-chats) .btn-primary:active,
body:not(.page-chats) .btn-wa:active,
body:not(.page-chats) .btn-wa-sm:active,
body:not(.page-chats) .acct3-btn--primary:active {
  background: var(--th-accent-deep);
  transform: translateY(0);
  box-shadow: none;
}

/* — DANGER — */
body:not(.page-chats) .btn-danger,
body:not(.page-chats) .btn-global-danger,
body:not(.page-chats) .btn-danger-outline,
body:not(.page-chats) .acct3-btn--danger-ghost {
  background: rgba(239, 68, 68, 0.08);
  color: #f87171;
  border-color: rgba(239, 68, 68, 0.25);
}
:root[data-theme="light"] body:not(.page-chats) .btn-danger,
:root[data-theme="light"] body:not(.page-chats) .btn-global-danger,
:root[data-theme="light"] body:not(.page-chats) .btn-danger-outline,
:root[data-theme="light"] body:not(.page-chats) .acct3-btn--danger-ghost {
  background: rgba(239, 68, 68, 0.06);
  color: #DC2626;
  border-color: rgba(239, 68, 68, 0.30);
}
body:not(.page-chats) .btn-danger:hover,
body:not(.page-chats) .btn-global-danger:hover,
body:not(.page-chats) .btn-danger-outline:hover,
body:not(.page-chats) .acct3-btn--danger-ghost:hover {
  background: rgba(239, 68, 68, 0.16);
  color: #fca5a5;
  border-color: rgba(239, 68, 68, 0.40);
  transform: none;
  box-shadow: none;
}

/* — WARN — */
body:not(.page-chats) .btn-warn,
body:not(.page-chats) .btn-global-warn {
  background: rgba(245, 158, 11, 0.08);
  color: #F59E0B;
  border-color: rgba(245, 158, 11, 0.25);
}
body:not(.page-chats) .btn-warn:hover,
body:not(.page-chats) .btn-global-warn:hover {
  background: rgba(245, 158, 11, 0.16);
  color: #fbbf24;
  border-color: rgba(245, 158, 11, 0.40);
  transform: none;
  box-shadow: none;
}

/* — MUTED (e.g. End boost) — */
body:not(.page-chats) .btn-global-muted {
  background: transparent;
  color: var(--th-muted);
  border: 1px dashed var(--th-border-strong);
}
body:not(.page-chats) .btn-global-muted:hover {
  background: var(--th-surface-2);
  color: var(--th-text);
  border-style: solid;
  border-color: var(--th-border-strong);
}

/* — Inline link-button (Open chat / similar accent CTA) — */
body:not(.page-chats) .btn-feed-link {
  background: transparent;
  color: var(--th-accent);
  border-color: var(--th-border);
  font-weight: 600;
}
body:not(.page-chats) .btn-feed-link:hover {
  background: var(--th-surface-2);
  color: var(--th-accent);
  border-color: var(--th-border-strong);
  box-shadow: none;
}

/* — ICON-ONLY BUTTON (40px square) — */
body:not(.page-chats) .btn-icon {
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  background: transparent;
  border-color: transparent;
  color: var(--th-muted);
  border-radius: 12px;
}
body:not(.page-chats) .btn-icon:hover {
  background: var(--th-surface-2);
  border-color: transparent;
  color: var(--th-text-strong);
  transform: none;
  box-shadow: none;
}
body:not(.page-chats) .btn-icon svg { width: 20px; height: 20px; }

/* — Sizes — */
body:not(.page-chats) .btn-wa-sm,
body:not(.page-chats) .acct3-btn--sm {
  height: 32px;
  min-height: 32px;
  padding: 0 14px;
  font-size: 12.5px;
  border-radius: 10px;
  gap: 6px;
}
body:not(.page-chats) .btn-wa-sm svg,
body:not(.page-chats) .acct3-btn--sm svg { width: 14px; height: 14px; }

body:not(.page-chats) .btn-xs {
  height: 28px;
  min-height: 28px;
  padding: 0 10px;
  font-size: 11.5px;
  font-weight: 500;
  border-radius: 8px;
  gap: 5px;
  box-shadow: none;
}
body:not(.page-chats) .btn-xs svg { width: 12px; height: 12px; }

body:not(.page-chats) .acct3-btn--lg,
body:not(.page-chats) .acct3-cta--lg {
  height: 44px;
  min-height: 44px;
  padding: 0 22px;
  font-size: 14px;
  border-radius: 14px;
}
body:not(.page-chats) .acct3-btn--lg svg,
body:not(.page-chats) .acct3-cta--lg svg { width: 20px; height: 20px; }

body:not(.page-chats) .btn-block { width: 100%; }

/* ───────────── FORMS / INPUTS ────────────────────────────────── */
body:not(.page-chats) input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([class*="agx-"]):not([class*="av3-"]):not(.av3 input),
body:not(.page-chats) select:not([class*="av3-"]):not(.av3 select),
body:not(.page-chats) textarea:not([class*="av3-"]):not(.av3 textarea),
body:not(.page-chats) .glass-input,
body:not(.page-chats) .acct3-input {
  background: var(--th-surface-2);
  color: var(--th-text);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r-sm);
  padding: 9px 12px;
  font-size: 13.5px;
  font-family: inherit;
  transition: border-color var(--th-dur), box-shadow var(--th-dur), background var(--th-dur);
  width: 100%;
  min-height: 38px;
}

body:not(.page-chats) textarea:not([class*="av3-"]) { line-height: 1.5; min-height: 72px; resize: vertical; }

body:not(.page-chats) input:not([class*="av3-"]):focus,
body:not(.page-chats) select:not([class*="av3-"]):focus,
body:not(.page-chats) textarea:not([class*="av3-"]):focus,
body:not(.page-chats) .glass-input:focus,
body:not(.page-chats) .acct3-input:focus {
  outline: none;
  border-color: var(--th-accent);
  box-shadow: var(--th-ring);
  background: var(--th-surface);
}

body:not(.page-chats) input::placeholder,
body:not(.page-chats) textarea::placeholder {
  color: var(--th-dim);
}

body:not(.page-chats) select { appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238b92a3' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 34px;
}

body:not(.page-chats) label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--th-text);
  letter-spacing: -0.005em;
}

body:not(.page-chats) .acct3-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
body:not(.page-chats) .acct3-field-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--th-muted);
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
body:not(.page-chats) .acct3-field-hint {
  font-size: 11.5px;
  color: var(--th-dim);
}

/* Checkbox / radio */
body:not(.page-chats) input[type="checkbox"],
body:not(.page-chats) input[type="radio"] {
  accent-color: var(--th-accent);
  width: 16px; height: 16px;
  cursor: pointer;
}

/* ───────────── PILLS / BADGES ────────────────────────────────── */
body:not(.page-chats) .pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  border: 1px solid transparent;
  text-transform: uppercase;
  line-height: 1.5;
}
body:not(.page-chats) .pill-ok {
  background: var(--th-ok-soft);
  color: #86efac;
  border-color: rgba(34,197,94,.3);
}
body:not(.page-chats) .pill-warn {
  background: var(--th-warn-soft);
  color: #fcd34d;
  border-color: rgba(245,158,11,.3);
}
body:not(.page-chats) .pill-danger {
  background: var(--th-danger-soft);
  color: #fca5a5;
  border-color: rgba(239,68,68,.3);
}
body:not(.page-chats) .pill-muted {
  background: var(--th-surface-2);
  color: var(--th-muted);
  border-color: var(--th-border);
}
body:not(.page-chats) .pill-pending {
  background: var(--th-info-soft);
  color: #93c5fd;
  border-color: rgba(96,165,250,.3);
  animation: th-pill-pulse 2s ease-in-out infinite;
}
@keyframes th-pill-pulse {
  0%,100% { opacity: 0.7; }
  50% { opacity: 1; }
}

body:not(.page-chats) .acct3-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: var(--th-surface-2);
  color: var(--th-muted);
  border: 1px solid var(--th-border);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

/* ───────────── TABLES ────────────────────────────────────────── */
body:not(.page-chats) .table,
body:not(.page-chats) table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
body:not(.page-chats) .table th,
body:not(.page-chats) .table td,
body:not(.page-chats) table th,
body:not(.page-chats) table td {
  padding: 11px 14px;
  text-align: left;
  border-bottom: 1px solid var(--th-divider);
}
body:not(.page-chats) .table th,
body:not(.page-chats) table th {
  font-size: 11.5px;
  color: var(--th-muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: var(--th-surface-2);
  white-space: nowrap;
}
body:not(.page-chats) .table tbody tr:hover,
body:not(.page-chats) table tbody tr:hover {
  background: var(--th-ghost);
}
body:not(.page-chats) .table-wrap {
  border: 1px solid var(--th-border);
  border-radius: var(--th-r);
  overflow: hidden;
  background: var(--th-surface);
}

/* ───────────── FLASH / BANNERS ───────────────────────────────── */
body:not(.page-chats) .flash {
  padding: 12px 16px;
  border-radius: var(--th-r);
  font-size: 13px;
  margin: 0 0 14px;
  border: 1px solid transparent;
  display: flex;
  align-items: center;
  gap: 10px;
  animation: th-fade-in 0.3s var(--th-ease);
}
body:not(.page-chats) .flash-ok {
  background: var(--th-ok-soft);
  color: #86efac;
  border-color: rgba(34,197,94,.3);
}
body:not(.page-chats) .flash-err {
  background: var(--th-danger-soft);
  color: #fca5a5;
  border-color: rgba(239,68,68,.3);
}

/* ───────────── GLOBAL ACTION BAR (overview control center) ─── */
body:not(.page-chats) .global-action-bar {
  padding: 14px 18px !important;
  border-radius: var(--th-r-lg) !important;
  background: linear-gradient(135deg, var(--th-surface), var(--th-surface-flat)) !important;
  border: 1px solid var(--th-border) !important;
}
body:not(.page-chats) .global-bar-inner {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
body:not(.page-chats) .global-bar-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--th-muted);
  padding-right: 8px;
  border-right: 1px solid var(--th-divider);
  display: inline-flex; align-items: center; gap: 6px;
}
body:not(.page-chats) .global-bar-btns {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
body:not(.page-chats) .global-bar-status {
  margin-left: auto;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

/* ───────────── KPI GRID ──────────────────────────────────────── */
body:not(.page-chats) .kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}
body:not(.page-chats) .kpi-card {
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
  overflow: hidden;
}
body:not(.page-chats) .kpi-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: var(--th-brand-grad);
  opacity: 0.9;
}
body:not(.page-chats) .kpi-label {
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--th-muted);
  font-weight: 700;
}
body:not(.page-chats) .kpi-value {
  font-size: 32px;
  font-weight: 800;
  color: var(--th-text-strong);
  letter-spacing: -0.03em;
  font-feature-settings: "tnum";
  line-height: 1.05;
}
body:not(.page-chats) .kpi-hint {
  font-size: 11.5px;
  color: var(--th-muted);
  font-weight: 500;
}
body:not(.page-chats) .kpi-na { color: var(--th-dim); }

/* ───────────── OVERVIEW V2/V3 SECTIONS ───────────────────────── */
body:not(.page-chats) .overview-v2-quick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}
body:not(.page-chats) .overview-v2-quick-card { padding: 18px 20px; }
body:not(.page-chats) .overview-v2-balance {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 12px 0 10px;
}
body:not(.page-chats) .overview-v2-balance > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: var(--th-r-sm);
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .overview-v2-balance-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--th-muted);
  font-weight: 600;
}
body:not(.page-chats) .overview-v2-balance-val {
  font-size: 22px;
  font-weight: 800;
  color: var(--th-accent-hi);
  font-family: "JetBrains Mono", monospace;
}

body:not(.page-chats) .overview-v2-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}
body:not(.page-chats) .overview-v2-shortcut {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 11px;
  border-radius: 999px;
  background: var(--th-surface-2);
  color: var(--th-text);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid var(--th-border);
  transition: all var(--th-dur);
}
body:not(.page-chats) .overview-v2-shortcut:hover {
  background: var(--th-accent-dim);
  border-color: var(--th-accent-ring);
  color: var(--th-accent-hi);
}

body:not(.page-chats) .overview-v2-notes { padding: 0; margin: 0; list-style: none; }
body:not(.page-chats) .overview-v2-notes li {
  padding: 6px 0 6px 20px;
  position: relative;
  font-size: 12.5px;
  line-height: 1.5;
}
body:not(.page-chats) .overview-v2-notes li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 13px;
  width: 6px;
  height: 6px;
  background: var(--th-accent);
  border-radius: 50%;
}

body:not(.page-chats) .overview-v2-head-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
body:not(.page-chats) .overview-route-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 700;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
}
body.provider-whatsapp:not(.page-chats) .overview-route-pill-wa {
  color: #86efac; border-color: rgba(34,197,94,.3); background: rgba(34,197,94,.1);
}
body.provider-telegram:not(.page-chats) .overview-route-pill-tg {
  color: #93c5fd; border-color: rgba(42,171,238,.3); background: rgba(42,171,238,.1);
}

body:not(.page-chats) .overview-v3-command {
  padding: 20px 22px;
}
body:not(.page-chats) .overview-v3-command-head { margin-bottom: 14px; }
body:not(.page-chats) .overview-v3-alert-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}
body:not(.page-chats) .overview-v3-alert-card {
  padding: 14px 16px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r);
  display: flex;
  flex-direction: column;
  gap: 4px;
  transition: border-color var(--th-dur), transform var(--th-dur);
}
body:not(.page-chats) .overview-v3-alert-card:hover {
  border-color: var(--th-border-strong);
  background: var(--th-surface-2);
}
body:not(.page-chats) .overview-v3-alert-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--th-muted);
  font-weight: 700;
}
body:not(.page-chats) .overview-v3-alert-val {
  font-size: 26px;
  font-weight: 800;
  color: var(--th-text-strong);
  letter-spacing: -0.02em;
}
body:not(.page-chats) .overview-v3-alert-meta {
  font-size: 11px;
  color: var(--th-muted);
}

body:not(.page-chats) .overview-v3-feed-tools {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
body:not(.page-chats) .overview-v3-feed-tools input[type="search"] {
  flex: 1;
  min-width: 200px;
  max-width: 340px;
}
body:not(.page-chats) .overview-v3-feed-filters {
  display: flex;
  gap: 4px;
  padding: 4px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r-sm);
}
body:not(.page-chats) .overview-v3-feed-btn {
  padding: 6px 10px;
  background: transparent;
  border: none;
  border-radius: 6px;
  color: var(--th-muted);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--th-dur);
}
body:not(.page-chats) .overview-v3-feed-btn:hover { color: var(--th-text); }
body:not(.page-chats) .overview-v3-feed-btn.is-active {
  background: var(--th-surface);
  color: var(--th-accent-hi);
  box-shadow: 0 1px 2px rgba(0,0,0,.18), 0 0 0 1px var(--th-border-strong);
}

/* ───────────── OVERVIEW GRID TOP (funnel / sentiment / risk) ─ */
body:not(.page-chats) .overview-grid-top {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 14px;
}
@media (max-width: 1080px) {
  body:not(.page-chats) .overview-grid-top { grid-template-columns: 1fr 1fr; }
  body:not(.page-chats) .overview-grid-top > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  body:not(.page-chats) .overview-grid-top { grid-template-columns: 1fr; }
  body:not(.page-chats) .overview-grid-top > :first-child { grid-column: auto; }
}

body:not(.page-chats) .funnel-queued-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px !important;
  margin: 0 0 14px;
  flex-wrap: wrap;
}
body:not(.page-chats) .funnel-queued-label {
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--th-muted);
}
body:not(.page-chats) .funnel-queued-val {
  font-size: 20px;
  font-weight: 800;
  color: var(--th-accent-hi);
}

/* Funnel */
body:not(.page-chats) .funnel-vertical {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
}
body:not(.page-chats) .funnel-step {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 4px 0;
}
body:not(.page-chats) .funnel-ring-wrap {
  width: 56px; height: 56px;
  flex-shrink: 0;
  position: relative;
  --fill: 0%;
}
body:not(.page-chats) .funnel-ring {
  position: relative;
  width: 100%; height: 100%;
  border-radius: 50%;
  background: conic-gradient(var(--th-accent) var(--fill), var(--th-surface-2) 0);
  box-shadow: inset 0 0 0 3px var(--th-surface);
}
body:not(.page-chats) .funnel-ring::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .funnel-count {
  position: absolute;
  inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800;
  font-size: 13px;
  color: var(--th-text-strong);
  z-index: 1;
  font-family: "JetBrains Mono", monospace;
}
body:not(.page-chats) .funnel-meta { flex: 1; min-width: 0; }
body:not(.page-chats) .funnel-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--th-text);
}
body:not(.page-chats) .funnel-connector {
  width: 2px;
  height: 14px;
  margin-left: 27px;
  background: linear-gradient(180deg, var(--th-accent-ring), transparent);
  border-radius: 2px;
}

/* Sentiment gauge */
body:not(.page-chats) .gauge-wrap {
  display: flex; flex-direction: column; align-items: center;
  gap: 8px; padding: 6px 0;
}
body:not(.page-chats) .gauge {
  --p: 50;
  width: 120px; height: 120px;
  border-radius: 50%;
  background: conic-gradient(from -90deg,
    var(--th-accent) calc(var(--p) * 1%),
    var(--th-surface-2) 0);
  position: relative;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 0 0 2px var(--th-surface);
}
body:not(.page-chats) .gauge::after {
  content: "";
  position: absolute;
  inset: 10px;
  border-radius: 50%;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .gauge-val {
  position: relative;
  z-index: 1;
  font-size: 24px;
  font-weight: 800;
  color: var(--th-text-strong);
  font-family: "JetBrains Mono", monospace;
}
body:not(.page-chats) .gauge-caption {
  font-size: 12px;
  color: var(--th-muted);
}

/* Risk meter */
body:not(.page-chats) .risk-track {
  height: 10px;
  background: var(--th-surface-2);
  border-radius: 999px;
  overflow: hidden;
  position: relative;
  margin: 14px 0 8px;
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .risk-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--th-ok), var(--th-warn) 60%, var(--th-danger));
  border-radius: 999px;
  transition: width 0.6s var(--th-ease);
  box-shadow: 0 0 12px rgba(239,68,68,.25);
}
body:not(.page-chats) .risk-axis {
  display: flex;
  justify-content: space-between;
  font-size: 10.5px;
  color: var(--th-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
body:not(.page-chats) .risk-num {
  font-size: 22px;
  font-weight: 800;
  color: var(--th-text-strong);
  margin: 6px 0 0;
  text-align: center;
}

/* ───────────── HEATMAP ──────────────────────────────────────── */
body:not(.page-chats) .heatmap {
  display: flex;
  gap: 3px;
  padding: 4px 0;
}
body:not(.page-chats) .heatmap-cell {
  --i: 0;
  flex: 1;
  aspect-ratio: 1;
  background: var(--th-surface-2);
  border-radius: 3px;
  position: relative;
  transition: transform var(--th-dur);
}
body:not(.page-chats) .heatmap-cell::before {
  content: "";
  position: absolute; inset: 0;
  background: var(--th-accent);
  opacity: calc(var(--i) * 0.9);
  border-radius: 3px;
}
body:not(.page-chats) .heatmap-cell:hover { transform: scaleY(1.15); }
body:not(.page-chats) .heatmap-axis {
  display: flex;
  justify-content: space-between;
  font-size: 10.5px;
  color: var(--th-muted);
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

body:not(.page-chats) .heatmap-7x24-wrap { overflow-x: auto; }
body:not(.page-chats) .heatmap-7x24 {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 620px;
}
body:not(.page-chats) .heatmap-row {
  display: grid;
  grid-template-columns: 52px repeat(24, 1fr);
  gap: 2px;
}
body:not(.page-chats) .heatmap-dow {
  font-size: 10.5px;
  color: var(--th-muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 18px;
}
body:not(.page-chats) .heatmap-cell-7x24 {
  --i: 0;
  height: 18px;
  background: var(--th-surface-2);
  border-radius: 3px;
  position: relative;
}
body:not(.page-chats) .heatmap-cell-7x24::before {
  content: "";
  position: absolute; inset: 0;
  background: var(--th-accent);
  opacity: calc(var(--i) * 0.9);
  border-radius: 3px;
}

/* ───────────── FEED CARDS ────────────────────────────────────── */
body:not(.page-chats) .feed-scroll {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 620px;
  overflow-y: auto;
  padding-right: 4px;
}
body:not(.page-chats) .feed-card {
  padding: 14px 16px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r);
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: border-color var(--th-dur), transform var(--th-dur);
}
body:not(.page-chats) .feed-card:hover {
  border-color: var(--th-accent-ring);
  transform: translateX(2px);
}
body:not(.page-chats) .feed-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}
body:not(.page-chats) .feed-identity {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
body:not(.page-chats) .feed-name {
  font-weight: 700;
  color: var(--th-text-strong);
  font-size: 13.5px;
}
body:not(.page-chats) .feed-phone {
  font-size: 11.5px;
  color: var(--th-muted);
}
body:not(.page-chats) .feed-status {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}
body:not(.page-chats) .feed-preview {
  color: var(--th-text);
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
body:not(.page-chats) .feed-meta {
  font-size: 11.5px;
  color: var(--th-muted);
}
body:not(.page-chats) .feed-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  padding-top: 4px;
  border-top: 1px dashed var(--th-divider);
}
body:not(.page-chats) .inline-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
body:not(.page-chats) .empty-feed {
  padding: 30px 0;
  text-align: center;
  color: var(--th-muted);
}

/* ───────────── ACCOUNT / SESSION SECTIONS ───────────────────── */
body:not(.page-chats) .acct-sessions-section {
  padding: 20px 22px;
}
body:not(.page-chats) .acct-sessions-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--th-divider);
  margin-bottom: 14px;
  flex-wrap: wrap;
}
body:not(.page-chats) .acct-sessions-icon {
  width: 40px; height: 40px;
  flex-shrink: 0;
  border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-accent);
}
body:not(.page-chats) .acct-sessions-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin-bottom: 2px;
}
body:not(.page-chats) .acct-sessions-subtitle {
  font-size: 12px;
  color: var(--th-muted);
}
body:not(.page-chats) .acct-sessions-head-tools {
  margin-left: auto;
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

body:not(.page-chats) .wa-inst-toolbar {
  display: inline-flex;
  padding: 3px;
  gap: 2px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
}
body:not(.page-chats) .wa-inst-layout-btn {
  width: 32px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent;
  border: none;
  border-radius: 7px;
  color: var(--th-muted);
  cursor: pointer;
  transition: all var(--th-dur);
}
body:not(.page-chats) .wa-inst-layout-btn:hover { color: var(--th-text); }
body:not(.page-chats) .wa-inst-layout-btn--primary,
body:not(.page-chats) .wa-inst-layout-btn[aria-pressed="true"] {
  background: var(--th-surface);
  color: var(--th-accent-hi);
  box-shadow: 0 1px 2px rgba(0,0,0,.18);
}

body:not(.page-chats) .wa-inst-summary-inline {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: var(--th-muted);
}
body:not(.page-chats) .wa-inst-summary-stat strong {
  color: var(--th-accent-hi);
  font-weight: 700;
}

body:not(.page-chats) .wa-inst-list {
  display: grid;
  gap: 14px;
  align-items: start;
}
body:not(.page-chats) .wa-inst-list[data-layout="compact"] {
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
}
body:not(.page-chats) .wa-inst-list[data-layout="list"] {
  grid-template-columns: 1fr;
}

/* ───────────── LOGIN PAGE ───────────────────────────────────── */
body.login-page,
body:not(.page-chats).login-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 20px;
}
body:not(.page-chats) .login-card,
body .login-card {
  width: 100%;
  max-width: 400px;
  padding: 32px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r-xl);
  box-shadow: var(--th-shadow-lg);
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* ───────────── POPOVERS ─────────────────────────────────────── */
body .sidenav-tz,
body [data-pop] {
  position: relative;
}
/* Closed: display:none only — NOT visibility:hidden (that still reserves layout in some cases). */
body .sidenav-tz-pop,
body .js-pop-panel {
  position: absolute !important;
  bottom: calc(100% + 8px);
  left: 0;
  right: auto;
  top: auto;
  min-width: 260px;
  padding: 12px;
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: var(--th-r);
  box-shadow: var(--th-shadow-lg);
  z-index: 90;
  display: none !important;
  margin: 0;
  box-sizing: border-box;
  transform: translateY(6px);
  transition: opacity var(--th-dur), transform var(--th-dur);
}
body [data-pop].is-open .js-pop-panel,
body [data-pop].is-open .sidenav-tz-pop {
  display: block !important;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

body .sidenav-tz-pop-hd {
  display: flex;
  gap: 6px;
  align-items: center;
  color: var(--th-muted);
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
}

/* ───────────── MISC UTILITY ─────────────────────────────────── */
body:not(.page-chats) .footer-links {
  text-align: center;
  padding: 20px 0 0;
  margin: 8px 0 0;
  border-top: 1px solid var(--th-divider);
  font-size: 12px;
  color: var(--th-muted);
}
body:not(.page-chats) .footer-links a {
  color: var(--th-muted);
  text-decoration: none;
  padding: 0 8px;
  transition: color var(--th-dur);
}
body:not(.page-chats) .footer-links a:hover { color: var(--th-accent-hi); }

body:not(.page-chats) code {
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  padding: 1px 6px;
  border-radius: 4px;
  font-family: "JetBrains Mono", "SF Mono", monospace;
  font-size: 0.9em;
  color: var(--th-accent-hi);
}

/* ───────────── COMMAND PALETTE (Ctrl/Cmd+K) ─────────────────── */
.cmdk-backdrop {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--th-dur);
  z-index: 200;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 14vh;
}
.cmdk-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}
.cmdk-panel {
  width: 100%;
  max-width: 560px;
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: var(--th-r-lg);
  box-shadow: var(--th-shadow-lg);
  overflow: hidden;
  transform: translateY(-12px) scale(.96);
  transition: transform var(--th-dur) var(--th-ease);
}
.cmdk-backdrop.is-open .cmdk-panel { transform: translateY(0) scale(1); }
.cmdk-input-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--th-divider);
}
.cmdk-input-wrap svg { color: var(--th-muted); flex-shrink: 0; }
.cmdk-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: var(--th-text-strong);
  font-size: 15px;
  font-family: inherit;
  width: 100%;
}
.cmdk-input::placeholder { color: var(--th-dim); }
.cmdk-close-kbd {
  font-size: 11px;
  padding: 2px 6px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 4px;
  color: var(--th-muted);
  font-weight: 600;
}
.cmdk-results {
  max-height: 50vh;
  overflow-y: auto;
  padding: 8px;
}
.cmdk-group {
  padding: 6px 10px 2px;
  font-size: 11px;
  color: var(--th-dim);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}
.cmdk-item {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 9px 12px;
  border-radius: var(--th-r-sm);
  text-decoration: none;
  color: var(--th-text);
  font-size: 13.5px;
  cursor: pointer;
  transition: background var(--th-dur);
}
.cmdk-item .cmdk-item-ic {
  width: 28px; height: 28px;
  border-radius: 8px;
  background: var(--th-surface-2);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--th-muted);
  flex-shrink: 0;
}
.cmdk-item-desc {
  font-size: 11.5px;
  color: var(--th-muted);
}
.cmdk-item.is-focus,
.cmdk-item:hover {
  background: var(--th-accent-dim);
  color: var(--th-text-strong);
}
.cmdk-item.is-focus .cmdk-item-ic,
.cmdk-item:hover .cmdk-item-ic {
  background: var(--th-accent);
  color: var(--th-accent-contrast);
}
.cmdk-footer {
  padding: 8px 14px;
  border-top: 1px solid var(--th-divider);
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 11px;
  color: var(--th-muted);
  background: var(--th-surface-2);
}
.cmdk-footer kbd {
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  padding: 1px 6px;
  border-radius: 4px;
  font-family: inherit;
  font-weight: 600;
  font-size: 10.5px;
  color: var(--th-text);
}

/* ───────────── TOAST SYSTEM ─────────────────────────────────── */
.th-toast-rack {
  position: fixed;
  bottom: 20px; right: 20px;
  display: flex;
  flex-direction: column-reverse;
  gap: 8px;
  z-index: 300;
  pointer-events: none;
  max-width: calc(100vw - 40px);
}
.th-toast {
  pointer-events: auto;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 11px 16px;
  border-radius: var(--th-r);
  background: var(--th-surface-hi);
  border: 1px solid var(--th-border-strong);
  box-shadow: var(--th-shadow-lg);
  font-size: 13px;
  font-weight: 500;
  color: var(--th-text);
  min-width: 260px;
  max-width: 380px;
  animation: th-toast-in .32s var(--th-ease);
}
@keyframes th-toast-in {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}
.th-toast.is-leaving { animation: th-toast-out .24s var(--th-ease) forwards; }
@keyframes th-toast-out {
  from { transform: translateX(0); opacity: 1; }
  to { transform: translateX(100%); opacity: 0; }
}
.th-toast-ic { width: 20px; height: 20px; flex-shrink: 0; color: var(--th-accent-hi); }
.th-toast--ok .th-toast-ic { color: var(--th-ok); }
.th-toast--warn .th-toast-ic { color: var(--th-warn); }
.th-toast--err .th-toast-ic { color: var(--th-danger); }

/* ───────────── SKELETON SHIMMER ─────────────────────────────── */
.th-skeleton {
  background: linear-gradient(
    90deg,
    var(--th-surface-2),
    var(--th-surface-hi),
    var(--th-surface-2)
  );
  background-size: 200% 100%;
  animation: th-shimmer 1.4s infinite;
  border-radius: 6px;
}
@keyframes th-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ───────────── KBD HINT BADGE ───────────────────────────────── */
.th-kbd {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px; height: 18px;
  padding: 0 5px;
  border-radius: 4px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border-strong);
  border-bottom-width: 2px;
  font-family: inherit;
  font-size: 10.5px;
  font-weight: 700;
  color: var(--th-muted);
  letter-spacing: 0.02em;
  line-height: 1;
}

/* ───────────── PRINT & REDUCED-MOTION ──────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
  }
}

/* ───────────── FOCUS RINGS ──────────────────────────────────── */
body:not(.page-chats) a:focus-visible,
body:not(.page-chats) button:focus-visible,
body:not(.page-chats) [role="button"]:focus-visible {
  outline: none;
  box-shadow: var(--th-ring);
  border-radius: 8px;
}

/* Make sure links default to no underline */
body:not(.page-chats) a { color: inherit; }

/* Responsive: collapse sidebar earlier on narrow desktops */
@media (max-width: 1180px) {
  :root { --th-sidebar-w: 220px; }
}

/* ───────────── SEARCH ICON HELPERS ──────────────────────────── */
body:not(.page-chats) .has-search-ic {
  position: relative;
}
body:not(.page-chats) .has-search-ic > svg.search-ic {
  position: absolute;
  left: 10px; top: 50%;
  transform: translateY(-50%);
  color: var(--th-muted);
  pointer-events: none;
}
body:not(.page-chats) .has-search-ic > input { padding-left: 34px; }

/* ───────────── ICON BUTTONS (square 36px) ───────────────────── */
body:not(.page-chats) .btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: var(--th-r-sm);
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  cursor: pointer;
  transition: all var(--th-dur);
  text-decoration: none;
  flex-shrink: 0;
}
body:not(.page-chats) .btn-icon:hover {
  color: var(--th-text);
  background: var(--th-surface-hi);
  border-color: var(--th-border-strong);
}

@media (hover: hover) {
  body:not(.page-chats) .glass-card.is-interactive:hover {
    border-color: var(--th-border-strong);
  }
}

/* ═════════════════════════════════════════════════════════════════════
   BRAND POLISH — provider-specific micro-touches.
   These layer ON TOP of the generic component styles to give each side
   a distinctive "feel" matching WhatsApp Web / Telegram Desktop.
   ═════════════════════════════════════════════════════════════════════ */

/* Sidebar — pure pitch-black (overrides earlier rule, no brand tint) */
body .sidenav {
  background: var(--th-sidebar);
  border-right: 1px solid var(--th-border-strong);
  box-shadow: 1px 0 0 rgba(0, 0, 0, 0.4);
}

/* (sidebar brand mark consolidated above — solid accent + white logo) */

/* Sidebar profile avatar — solid brand, no glow */
body .sidenav-profile-avatar {
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  box-shadow: none;
  border: 1px solid var(--th-border);
}

/* Active sidebar link — clean subtle highlight */
body .sidenav-link.is-active {
  background: var(--th-surface-2);
  color: var(--th-text-strong);
  box-shadow: none;
}
body .sidenav-link.is-active::before {
  content: "";
  position: absolute;
  left: 0; top: 22%; bottom: 22%;
  width: 2px;
  border-radius: 0 2px 2px 0;
  background: var(--th-accent);
  box-shadow: none;
}
body .sidenav-link.is-active .sidenav-link-ic {
  color: var(--th-accent);
}

/* Compose button — flat brand, no glow */
body .sidenav-compose {
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  box-shadow: none;
  border: 1px solid transparent;
  position: relative;
}
body .sidenav-compose:hover {
  background: var(--th-accent-hi);
  box-shadow: none;
  transform: none;
}

/* Provider switcher pill — active state */
body.provider-whatsapp:not(.page-chats) .sidenav-mode-pill.is-active {
  color: #2ee479;
  background: var(--th-surface);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.30), inset 0 0 0 1px rgba(37, 211, 102, 0.30);
}
body.provider-telegram:not(.page-chats) .sidenav-mode-pill.is-active {
  color: #5aaaf2;
  background: var(--th-surface);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.30), inset 0 0 0 1px rgba(51, 144, 236, 0.30);
}

/* Page heading — clean, no glowing underline */
body:not(.page-chats) .page-head,
body:not(.page-chats) .page-head-lg {
  position: relative;
  border-bottom: 1px solid var(--th-divider);
}
body:not(.page-chats) .page-head::after,
body:not(.page-chats) .page-head-lg::after { content: none; }

/* Cards — flat, neutral hover */
body:not(.page-chats) .glass-card,
body:not(.page-chats) .card {
  background: var(--th-surface);
  position: relative;
}
body:not(.page-chats) .glass-card:hover,
body:not(.page-chats) .card:hover {
  border-color: var(--th-border-strong);
  box-shadow: var(--th-shadow-sm);
}

/* KPI cards — clean, no top stripe */
body:not(.page-chats) .kpi-card::before { content: none; }
body:not(.page-chats) .kpi-value {
  color: var(--th-text-strong);
}

/* Overview balance values — strong accent */
body:not(.page-chats) .overview-v2-balance-val { color: var(--th-accent-hi); }
body:not(.page-chats) .funnel-queued-val { color: var(--th-accent-hi); }

/* Action-center alert cards — clean neutral hover */
body:not(.page-chats) .overview-v3-alert-card:hover {
  border-color: var(--th-border-strong);
  background: var(--th-surface-2);
}

/* Pills — brand-aligned ok pill */
body:not(.page-chats) .pill-ok {
  background: var(--th-accent-dim);
  color: var(--th-accent-hi);
  border-color: var(--th-accent-ring);
}

/* (intentionally empty — primary button styles consolidated above) */

/* (sidebar status block consolidated above — clean neutral) */

/* Account section icon — flat neutral with brand color */
body:not(.page-chats) .acct-sessions-icon {
  background: var(--th-surface-2);
  border-color: var(--th-border);
  color: var(--th-accent);
  box-shadow: none;
}

/* Heatmap cells — use accent for fill */
body:not(.page-chats) .heatmap-cell::before,
body:not(.page-chats) .heatmap-cell-7x24::before { background: var(--th-accent); }

/* Funnel ring uses accent, gauge too */
body:not(.page-chats) .funnel-ring {
  background: conic-gradient(var(--th-accent) var(--fill), var(--th-surface-2) 0);
}
body:not(.page-chats) .gauge {
  background: conic-gradient(from -90deg, var(--th-accent) calc(var(--p) * 1%), var(--th-surface-2) 0);
}

/* Risk meter — keeps semantic gradient (green→yellow→red) regardless of provider */

/* Feed card hover — clean neutral */
body:not(.page-chats) .feed-card:hover {
  border-color: var(--th-border-strong);
  background: var(--th-surface-2);
}

/* Live conversation feed open-chat pill — clean brand text on hover */
body:not(.page-chats) .btn-feed-link {
  color: var(--th-accent);
  background: var(--th-surface-2);
  border-color: var(--th-border);
}
body:not(.page-chats) .btn-feed-link:hover {
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  border-color: var(--th-accent);
  box-shadow: none;
}

/* Inputs — focus ring, subtle */
body:not(.page-chats) input:focus,
body:not(.page-chats) select:focus,
body:not(.page-chats) textarea:focus,
body:not(.page-chats) .glass-input:focus,
body:not(.page-chats) .acct3-input:focus {
  border-color: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
  background: var(--th-surface);
  outline: none;
}

/* Code chips — brand-coloured */
body:not(.page-chats) code {
  color: var(--th-accent-hi);
  background: var(--th-accent-dim);
  border-color: var(--th-accent-ring);
}

/* Subtle scrollbar tint */
body.provider-whatsapp:not(.page-chats) *::-webkit-scrollbar-thumb { background-color: rgba(0, 168, 132, 0.18); border: 2px solid transparent; background-clip: padding-box; }
body.provider-whatsapp:not(.page-chats) *::-webkit-scrollbar-thumb:hover { background-color: rgba(0, 168, 132, 0.34); }
body.provider-telegram:not(.page-chats) *::-webkit-scrollbar-thumb { background-color: rgba(51, 144, 236, 0.18); border: 2px solid transparent; background-clip: padding-box; }
body.provider-telegram:not(.page-chats) *::-webkit-scrollbar-thumb:hover { background-color: rgba(51, 144, 236, 0.36); }

/* Theme toggle button — neutral hover */
body .sidenav-utility-icon:hover {
  color: var(--th-text-strong);
  border-color: var(--th-border-strong);
  background: var(--th-surface-2);
}

/* Layout-toggle (grid/list) icons in sessions area */
body:not(.page-chats) .wa-inst-layout-btn--primary,
body:not(.page-chats) .wa-inst-layout-btn[aria-pressed="true"] {
  background: var(--th-surface);
  color: var(--th-accent-hi);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .22), inset 0 0 0 1px var(--th-accent-ring);
}

/* Filter pill row (overview-v3-feed-btn) — brand active glow */
body:not(.page-chats) .overview-v3-feed-btn.is-active {
  background: var(--th-accent-dim);
  color: var(--th-accent-hi);
  box-shadow: inset 0 0 0 1px var(--th-accent-ring);
}

/* Route pill (mode label) */
body.provider-whatsapp:not(.page-chats) .overview-route-pill-wa {
  color: #06cf9c;
  border-color: rgba(0, 168, 132, 0.40);
  background: rgba(0, 168, 132, 0.14);
}
body.provider-telegram:not(.page-chats) .overview-route-pill-tg {
  color: #4ea3f0;
  border-color: rgba(51, 144, 236, 0.40);
  background: rgba(51, 144, 236, 0.14);
}

body:not(.page-chats) .overview-v2-shortcut:hover {
  background: var(--th-surface-2);
  border-color: var(--th-border-strong);
  color: var(--th-text-strong);
}

body:not(.page-chats) .table th,
body:not(.page-chats) table th {
  background: var(--th-surface-2);
  color: var(--th-muted);
  border-bottom: 1px solid var(--th-border-strong);
}

/* Card title icon (the SVG before titles) — brand colour */
body:not(.page-chats) .card-title > svg:first-child {
  color: var(--th-accent-hi);
}

/* "muted small" hints stay readable */
body:not(.page-chats) .muted { color: var(--th-muted); }
body:not(.page-chats) .small { font-size: 12px; }

/* Flash bar — brand-tinted ok flash */
body:not(.page-chats) .flash-ok {
  background: var(--th-accent-dim);
  color: var(--th-accent-hi);
  border-color: var(--th-accent-ring);
}

/* Global control bar — brand-tinted left ribbon */
body:not(.page-chats) .global-action-bar {
  position: relative;
  overflow: hidden;
}
body:not(.page-chats) .global-action-bar::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 2px;
  background: var(--th-accent);
}
body:not(.page-chats) .global-bar-label {
  color: var(--th-accent-hi);
  border-right-color: var(--th-accent-ring);
}

/* Section heads small badge for live indicator — brand tinted */
body:not(.page-chats) .pill-pending {
  background: var(--th-accent-dim);
  color: var(--th-accent-hi);
  border-color: var(--th-accent-ring);
}

/* Login card — brand glow border */
body.login-page .auth-card,
body:not(.page-chats) .auth-card {
  border: 1px solid var(--th-border);
  box-shadow:
    0 30px 80px rgba(0, 0, 0, 0.55),
    0 0 0 1px var(--th-accent-ring),
    0 0 60px var(--th-accent-glow);
}

/* Sidenav scrollbar darker */
body .sidenav-scroll::-webkit-scrollbar-thumb { background-color: var(--th-border-strong); }

/* (secondary button hover styles consolidated above in unified button system) */

/* ═════════════════════════════════════════════════════════════════════
   DASHBRD X — overview design system (v6).
   Compact dashboard inspired by modern analytics dashboards.
   Components: topbar (breadcrumb), report card, KPI tiles inline,
   chart cards with tabs, donut, paired bars, table, world map,
   funnel, mini cards, accounts grid, alerts list.
   ═════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .dx {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Hide the leftover layout the old code defined */
body:not(.page-chats) .dx .wa-inst-list { display: none; }

/* ───────── Top bar / breadcrumb ───────── */
body:not(.page-chats) .dx-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 0 0 6px;
}
body:not(.page-chats) .dx-crumb {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--th-muted);
}
body:not(.page-chats) .dx-crumb-link {
  color: var(--th-muted);
  text-decoration: none;
  font-weight: 500;
  transition: color var(--th-dur);
}
body:not(.page-chats) .dx-crumb-link:hover { color: var(--th-text); }
body:not(.page-chats) .dx-crumb-sep { color: var(--th-dim); display: inline-flex; }
body:not(.page-chats) .dx-crumb-cur {
  color: var(--th-text-strong);
  font-weight: 600;
}
body:not(.page-chats) .dx-topbar-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
body:not(.page-chats) .dx-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--th-muted);
}
body:not(.page-chats) .dx-live-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--th-ok);
  box-shadow: 0 0 0 3px rgba(34,197,94,.18);
  animation: th-pulse 1.6s ease-in-out infinite;
}
body:not(.page-chats) .dx-iconbtn {
  width: 40px; height: 40px;
  border-radius: 12px;
  background: transparent;
  border: 1px solid transparent;
  color: var(--th-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 120ms ease;
  position: relative;
  flex-shrink: 0;
}
body:not(.page-chats) .dx-iconbtn svg {
  width: 20px;
  height: 20px;
}
body:not(.page-chats) .dx-iconbtn:hover {
  background: var(--th-surface-2);
  color: var(--th-text-strong);
  border-color: var(--th-border);
}
body:not(.page-chats) .dx-iconbtn:active {
  background: var(--th-surface-3);
  transform: translateY(0);
}
body:not(.page-chats) .dx-iconbtn--sm { width: 32px; height: 32px; border-radius: 10px; }
body:not(.page-chats) .dx-iconbtn--sm svg { width: 16px; height: 16px; }
body:not(.page-chats) .dx-iconbtn-dot {
  position: absolute;
  top: 5px; right: 5px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--th-danger);
  box-shadow: 0 0 0 2px var(--th-surface);
}
body:not(.page-chats) .dx-cta { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.10); }

/* ───────── Big analytics report card ───────── */
body:not(.page-chats) .dx-report {
  padding: 22px 24px !important;
  background: var(--th-surface);
}
body:not(.page-chats) .dx-report-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
body:not(.page-chats) .dx-report-title {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--th-text-strong);
  margin: 0 0 4px;
}
body:not(.page-chats) .dx-report-sub {
  font-size: 13px;
  color: var(--th-muted);
  margin: 0;
}
body:not(.page-chats) .dx-filter-row {
  display: inline-flex;
  gap: 8px;
  flex-wrap: wrap;
}
body:not(.page-chats) .dx-filter {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 14px;
  height: 36px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text);
  border-radius: 10px;
  font-size: 12.5px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 120ms ease;
  text-decoration: none;
  white-space: nowrap;
  letter-spacing: -0.005em;
}
body:not(.page-chats) .dx-filter:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
  color: var(--th-text-strong);
}
body:not(.page-chats) .dx-filter:active {
  background: var(--th-surface-hi);
}
body:not(.page-chats) .dx-filter > svg { color: var(--th-muted); flex-shrink: 0; }
body:not(.page-chats) .dx-filter > svg:last-child { opacity: 0.6; }

/* KPI inline tiles (image-style) */
body:not(.page-chats) .dx-kpi-row {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  padding: 14px 0 0;
  border-top: 1px solid var(--th-divider);
}
@media (max-width: 1280px) { body:not(.page-chats) .dx-kpi-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { body:not(.page-chats) .dx-kpi-row { grid-template-columns: repeat(2, 1fr); } }

body:not(.page-chats) .dx-kpi {
  padding: 6px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  border-right: 1px solid var(--th-divider);
}
body:not(.page-chats) .dx-kpi-row > .dx-kpi:last-child { border-right: none; }
@media (max-width: 1280px) { body:not(.page-chats) .dx-kpi { border-right: none; } }
body:not(.page-chats) .dx-kpi-line {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
body:not(.page-chats) .dx-kpi-num {
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--th-text-strong);
  font-feature-settings: "tnum";
  line-height: 1.05;
}
body:not(.page-chats) .dx-kpi-num--alert { color: var(--th-warn); }
body:not(.page-chats) .dx-kpi-unit {
  font-size: 16px;
  font-weight: 600;
  color: var(--th-muted);
  margin-left: 1px;
}
body:not(.page-chats) .dx-kpi-trend {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
  background: rgba(34, 197, 94, 0.14);
  color: #4ade80;
  border: 1px solid rgba(34, 197, 94, 0.30);
  text-transform: lowercase;
}
body:not(.page-chats) .dx-kpi-trend--down {
  background: rgba(245, 158, 11, 0.14);
  color: #fcd34d;
  border-color: rgba(245, 158, 11, 0.30);
}
body:not(.page-chats) .dx-kpi-trend--flat,
body:not(.page-chats) .dx-trend--flat {
  background: color-mix(in srgb, var(--th-muted, #64748b) 14%, transparent);
  color: var(--th-muted, #64748b);
  border: 1px solid color-mix(in srgb, var(--th-muted, #64748b) 25%, transparent);
}
body:not(.page-chats) .dx-kpi-lbl {
  font-size: 11.5px;
  color: var(--th-muted);
  font-weight: 500;
}

/* ───────── Inline control bar ───────── */
body:not(.page-chats) .dx-control {
  padding: 10px 14px !important;
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
body:not(.page-chats) .dx-control-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--th-accent-hi);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding-right: 12px;
  border-right: 1px solid var(--th-divider);
}
body:not(.page-chats) .dx-control-btns { display: flex; gap: 6px; flex-wrap: wrap; }
body:not(.page-chats) .dx-control-status { display: flex; gap: 5px; margin-left: auto; }

/* ───────── Section title shared ───────── */
body:not(.page-chats) .dx-section-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  letter-spacing: -0.005em;
}
body:not(.page-chats) .dx-section-title > svg { color: var(--th-accent-hi); flex-shrink: 0; }

body:not(.page-chats) .dx-card-link {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: var(--th-accent-hi);
  text-decoration: none;
  font-size: 12px;
  font-weight: 600;
  transition: color var(--th-dur);
}
body:not(.page-chats) .dx-card-link:hover { color: var(--th-accent); filter: brightness(1.1); }

body:not(.page-chats) .dx-chart-meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--th-muted);
}
body:not(.page-chats) .dx-chart-meta strong { color: var(--th-text-strong); font-weight: 700; }

body:not(.page-chats) .dx-chart-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
body:not(.page-chats) .dx-chart-head--col { align-items: center; }
body:not(.page-chats) .dx-chart-cap {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--th-muted);
}

/* ───────── Tabs (Year / Month / Week / Day style) ───────── */
body:not(.page-chats) .dx-tabs {
  display: inline-flex;
  padding: 4px;
  background: transparent;
  border: none;
  border-radius: 12px;
  gap: 2px;
}
body:not(.page-chats) .dx-tab {
  padding: 0 14px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  background: transparent;
  border: none;
  border-radius: 9px;
  color: var(--th-muted);
  font-size: 12.5px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  transition: background-color 150ms ease, color 150ms ease;
  white-space: nowrap;
  letter-spacing: -0.005em;
}
body:not(.page-chats) .dx-tab:hover { color: var(--th-text); }
body:not(.page-chats) .dx-tab:hover {
  color: var(--th-text);
  background: var(--th-surface-2);
}
body:not(.page-chats) .dx-tab.is-active {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.20), inset 0 0 0 1px var(--th-border);
}

/* ───────── Chart card shared ───────── */
body:not(.page-chats) .dx-chart-card,
body:not(.page-chats) .dx-donut-card,
body:not(.page-chats) .dx-feed-card,
body:not(.page-chats) .dx-map-card,
body:not(.page-chats) .dx-toplist-card,
body:not(.page-chats) .dx-funnel-card,
body:not(.page-chats) .dx-mini-card,
body:not(.page-chats) .dx-accts-card,
body:not(.page-chats) .dx-alerts-card {
  padding: 18px 20px !important;
}

body:not(.page-chats) .dx-chart-title-num {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--th-text-strong);
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  line-height: 1;
  font-feature-settings: "tnum";
}
body:not(.page-chats) .dx-trend {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(34, 197, 94, 0.14);
  color: #4ade80;
  border: 1px solid rgba(34, 197, 94, 0.30);
}

/* Legend */
body:not(.page-chats) .dx-legend {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
body:not(.page-chats) .dx-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--th-muted);
  font-weight: 600;
}
body:not(.page-chats) .dx-legend-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
}
body:not(.page-chats) .dx-legend-dot--sm { width: 6px; height: 6px; background: var(--th-accent); }
body:not(.page-chats) .dx-legend-dot--md { width: 8px; height: 8px; background: var(--th-accent); }
body:not(.page-chats) .dx-legend-dot--lg { width: 10px; height: 10px; background: var(--th-accent); }

body:not(.page-chats) .dx-chart-wrap {
  position: relative;
  width: 100%;
  height: 220px;
}

/* ───────── Grid 1: area chart + donut ───────── */
body:not(.page-chats) .dx-grid-1 {
  display: grid;
  grid-template-columns: minmax(0, 2.2fr) minmax(280px, 1fr);
  gap: 14px;
}
@media (max-width: 1080px) { body:not(.page-chats) .dx-grid-1 { grid-template-columns: 1fr; } }

body:not(.page-chats) .dx-donut-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
body:not(.page-chats) .dx-donut-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 0;
}
body:not(.page-chats) .dx-donut {
  --ai-pct: 60;
  --user-pct: 40;
  width: 168px; height: 168px;
  border-radius: 50%;
  background: conic-gradient(
    var(--th-accent) 0 calc(var(--ai-pct) * 1%),
    var(--th-info) calc(var(--ai-pct) * 1%) calc((var(--ai-pct) + var(--user-pct)) * 1%),
    var(--th-warn) calc((var(--ai-pct) + var(--user-pct)) * 1%) 100%
  );
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 4px 14px var(--th-accent-glow));
}
body:not(.page-chats) .dx-donut-inner {
  width: 76%; height: 76%;
  border-radius: 50%;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 2px;
}
body:not(.page-chats) .dx-donut-num {
  font-size: 26px;
  font-weight: 800;
  color: var(--th-text-strong);
  font-feature-settings: "tnum";
  letter-spacing: -0.02em;
}
body:not(.page-chats) .dx-donut-cap {
  font-size: 11px;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}
body:not(.page-chats) .dx-donut-legend {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  padding-top: 10px;
  border-top: 1px solid var(--th-divider);
}
body:not(.page-chats) .dx-donut-legend li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  text-align: center;
}
body:not(.page-chats) .dx-legend-name {
  font-size: 10.5px;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
}
body:not(.page-chats) .dx-legend-num {
  font-size: 16px;
  font-weight: 800;
  color: var(--th-text-strong);
  font-feature-settings: "tnum";
}

/* ───────── Grid 2: bars + feed table ───────── */
body:not(.page-chats) .dx-grid-2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 14px;
}
@media (max-width: 1080px) { body:not(.page-chats) .dx-grid-2 { grid-template-columns: 1fr; } }

body:not(.page-chats) .dx-feed-tools {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
body:not(.page-chats) .dx-search,
body:not(.page-chats) .snd-queue-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 1; min-width: 180px; max-width: 320px;
  padding: 0 12px;
  height: 36px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  color: var(--th-muted);
  transition: border-color var(--th-dur), background var(--th-dur), box-shadow var(--th-dur);
  margin: 0;
  box-sizing: border-box;
}
body:not(.page-chats) .dx-search:focus-within,
body:not(.page-chats) .snd-queue-search:focus-within {
  border-color: var(--th-accent);
  background: var(--th-surface);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
}
body:not(.page-chats) .dx-search > svg,
body:not(.page-chats) .snd-queue-search > svg { flex-shrink: 0; color: var(--th-muted); }
body:not(.page-chats) .dx-search > input,
body:not(.page-chats) .dx-search > input[type="search"],
body:not(.page-chats) .snd-queue-search > input,
body:not(.page-chats) .snd-queue-search > input[type="search"] {
  flex: 1;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  color: var(--th-text);
  font-family: inherit;
  font-size: 13px;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  border-radius: 0 !important;
  width: 100%;
  box-shadow: none !important;
}
body:not(.page-chats) .dx-search > input:focus { background: transparent; box-shadow: none; }
body:not(.page-chats) .dx-search > input::placeholder { color: var(--th-dim); }

body:not(.page-chats) .dx-table-wrap {
  max-height: 360px;
  overflow-y: auto;
  border-top: 1px solid var(--th-divider);
}
body:not(.page-chats) .dx-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
}
body:not(.page-chats) .dx-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: left;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--th-muted);
  padding: 10px 12px;
  background: var(--th-surface);
  border-bottom: 1px solid var(--th-divider);
}
body:not(.page-chats) .dx-table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--th-divider);
  vertical-align: middle;
}
body:not(.page-chats) .dx-table tbody tr:last-child td { border-bottom: none; }
body:not(.page-chats) .dx-table tbody tr {
  transition: background var(--th-dur);
}
body:not(.page-chats) .dx-table tbody tr:hover { background: var(--th-surface-2); }
body:not(.page-chats) .dx-feed-num { width: 30px; }
body:not(.page-chats) .dx-feed-contact {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
}
body:not(.page-chats) .dx-feed-avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 12px;
  flex-shrink: 0;
}
body:not(.page-chats) .dx-feed-id {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
body:not(.page-chats) .dx-feed-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--th-text-strong);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
}
body:not(.page-chats) .dx-feed-prev {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 220px;
}
body:not(.page-chats) .dx-feed-time {
  white-space: nowrap;
  font-feature-settings: "tnum";
}
body:not(.page-chats) .dx-feed-actions { width: 36px; text-align: right; }

/* Compact tag system */
body:not(.page-chats) .dx-tag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  border: 1px solid transparent;
  white-space: nowrap;
}
body:not(.page-chats) .dx-tag--ok {
  background: rgba(34, 197, 94, 0.14);
  color: #4ade80;
  border-color: rgba(34, 197, 94, 0.30);
}
body:not(.page-chats) .dx-tag--warn {
  background: rgba(245, 158, 11, 0.14);
  color: #fcd34d;
  border-color: rgba(245, 158, 11, 0.30);
}
body:not(.page-chats) .dx-tag--alert {
  background: var(--th-accent-dim);
  color: var(--th-accent-hi);
  border-color: var(--th-accent-ring);
}
body:not(.page-chats) .dx-tag--muted {
  background: var(--th-surface-3);
  color: var(--th-muted);
  border-color: var(--th-border);
}

/* ───────── Grid 3: world map + side toplists ───────── */
body:not(.page-chats) .dx-grid-3 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 14px;
}
@media (max-width: 1080px) { body:not(.page-chats) .dx-grid-3 { grid-template-columns: 1fr; } }

body:not(.page-chats) .dx-mapwrap {
  position: relative;
  width: 100%;
  border-radius: 16px;
  background: var(--th-surface-flat);
  overflow: hidden;
  border: 1px solid var(--th-border);
  padding: 18px 20px;
}

/* Inline SVG world map with country glow */
body:not(.page-chats) .wm {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 1;
  display: block;
}
body:not(.page-chats) .wm .world-svg {
  display: block;
  width: 100%;
  height: 100%;
  shape-rendering: geometricPrecision;
}
body:not(.page-chats) .wm .wm-data { display: none; }

/* Inactive countries — neutral, soft outlines */
body:not(.page-chats) .wm .cty {
  fill: rgba(148, 163, 184, 0.10);
  stroke: rgba(148, 163, 184, 0.18);
  stroke-width: 0.4;
  stroke-linejoin: round;
  transition: fill 220ms ease;
  cursor: default;
}
:root[data-theme="light"] body:not(.page-chats) .wm .cty {
  fill: #E2E8F0;
  stroke: #CBD5E1;
}

/* Active countries — bright brand fill with strong glow */
body:not(.page-chats) .wm .cty[data-active] {
  fill: var(--th-accent);
  stroke: var(--th-accent-hi);
  stroke-width: 0.6;
  cursor: pointer;
  filter:
    drop-shadow(0 0 6px var(--th-accent-glow))
    drop-shadow(0 0 14px var(--th-accent-glow));
  animation: wm-pulse 3s ease-in-out infinite;
}
body:not(.page-chats) .wm .cty[data-active]:hover {
  fill: var(--th-accent-hi);
  stroke: #FFFFFF;
  stroke-width: 0.8;
  filter:
    drop-shadow(0 0 10px var(--th-accent-glow))
    drop-shadow(0 0 22px var(--th-accent-glow));
  animation-play-state: paused;
}

/* Pulse animation — gentle "breathing" glow */
@keyframes wm-pulse {
  0%, 100% { filter: drop-shadow(0 0 4px var(--th-accent-glow)) drop-shadow(0 0 10px var(--th-accent-glow)); }
  50%      { filter: drop-shadow(0 0 10px var(--th-accent-glow)) drop-shadow(0 0 20px var(--th-accent-glow)); }
}

/* Tooltip */
body:not(.page-chats) .wm-tooltip {
  position: absolute;
  z-index: 20;
  padding: 8px 12px;
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.30);
  font-size: 12.5px;
  color: var(--th-text-strong);
  pointer-events: none;
  white-space: nowrap;
  transform: translate(-50%, calc(-100% - 8px));
}
body:not(.page-chats) .wm-tooltip strong { color: var(--th-accent-hi); }
body:not(.page-chats) .wm-tooltip .wm-tooltip-meta {
  display: block;
  color: var(--th-muted);
  font-size: 11px;
  margin-top: 2px;
}
body:not(.page-chats) .dx-map-empty {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}
body:not(.page-chats) .dx-map-tip {
  position: absolute;
  z-index: 10;
  padding: 8px 11px;
  background: var(--th-surface);
  border: 1px solid var(--th-accent-ring);
  border-radius: 8px;
  box-shadow: var(--th-shadow);
  font-size: 12px;
  color: var(--th-text-strong);
  pointer-events: none;
  max-width: 220px;
  line-height: 1.4;
}

/* Side stack of top-N lists */
body:not(.page-chats) .dx-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
body:not(.page-chats) .dx-toplist {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 4px;
}
body:not(.page-chats) .dx-toplist li {
  display: grid;
  grid-template-columns: 22px 28px minmax(0, 1fr) minmax(60px, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 6px 4px;
  border-radius: 6px;
  transition: background var(--th-dur);
}
body:not(.page-chats) .dx-toplist li:hover { background: var(--th-ghost); }
body:not(.page-chats) .dx-rank { font-size: 11px; }
body:not(.page-chats) .dx-iso {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 18px;
  background: var(--th-surface-3);
  border: 1px solid var(--th-border);
  border-radius: 4px;
  font-size: 10px;
  font-weight: 800;
  color: var(--th-text-strong);
  font-family: "JetBrains Mono", monospace;
}
body:not(.page-chats) .dx-tl-avatar {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
}
body:not(.page-chats) .dx-tl-name {
  font-size: 12.5px;
  color: var(--th-text);
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.page-chats) .dx-tl-bar {
  position: relative;
  height: 5px;
  background: var(--th-surface-2);
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .dx-tl-fill {
  display: block;
  height: 100%;
  background: var(--th-accent);
  border-radius: 999px;
}
body:not(.page-chats) .dx-tl-num {
  font-size: 11.5px;
  color: var(--th-text-strong);
  font-weight: 700;
  text-align: right;
  font-feature-settings: "tnum";
  min-width: 36px;
}

/* ───────── Grid 4: funnel + minis (sentiment / risk / lead) ───────── */
body:not(.page-chats) .dx-grid-4 {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 1240px) { body:not(.page-chats) .dx-grid-4 { grid-template-columns: 1fr 1fr; } body:not(.page-chats) .dx-funnel-card { grid-column: 1 / -1; } }
@media (max-width: 720px)  { body:not(.page-chats) .dx-grid-4 { grid-template-columns: 1fr; } body:not(.page-chats) .dx-funnel-card { grid-column: auto; } }

body:not(.page-chats) .dx-funnel { display: flex; flex-direction: column; gap: 8px; }
body:not(.page-chats) .dx-funnel-row {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}
body:not(.page-chats) .dx-funnel-step {
  font-size: 12px;
  font-weight: 600;
  color: var(--th-muted);
  text-align: right;
}
body:not(.page-chats) .dx-funnel-bar {
  position: relative;
  height: 24px;
  width: var(--w);
  background: var(--th-surface-2);
  border-radius: 6px;
  border: 1px solid var(--th-border);
  overflow: hidden;
}
body:not(.page-chats) .dx-funnel-fill {
  display: block;
  height: 100%;
  background: var(--th-accent);
  border-radius: 5px;
  transition: width .6s var(--th-ease);
}
body:not(.page-chats) .dx-funnel-num {
  position: absolute;
  right: 8px; top: 50%;
  transform: translateY(-50%);
  font-size: 11.5px;
  font-weight: 800;
  color: var(--th-text-strong);
  font-feature-settings: "tnum";
}

body:not(.page-chats) .dx-mini-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
body:not(.page-chats) .dx-mini-card .dx-section-title {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--th-muted);
  font-weight: 700;
}
body:not(.page-chats) .dx-mini-card .dx-section-title > svg { color: var(--th-accent-hi); }

body:not(.page-chats) .dx-mini-stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
body:not(.page-chats) .dx-mini-gauge {
  --p: 50;
  width: 100px; height: 100px;
  border-radius: 50%;
  background: conic-gradient(from -90deg, var(--th-accent) calc(var(--p) * 1%), var(--th-surface-3) 0);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
body:not(.page-chats) .dx-mini-gauge::after {
  content: "";
  position: absolute; inset: 12px;
  border-radius: 50%;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .dx-mini-gauge > strong {
  position: relative; z-index: 1;
  font-size: 22px;
  font-weight: 800;
  color: var(--th-text-strong);
  font-feature-settings: "tnum";
  letter-spacing: -0.02em;
}
body:not(.page-chats) .dx-mini-unit { font-size: 11px; color: var(--th-muted); margin-left: 1px; }
body:not(.page-chats) .dx-mini-cap { margin: 0; text-align: center; }

body:not(.page-chats) .dx-risk-track {
  position: relative;
  height: 8px;
  background: var(--th-surface-3);
  border-radius: 999px;
  overflow: visible;
}
body:not(.page-chats) .dx-risk-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--th-ok) 0%, var(--th-warn) 60%, var(--th-danger) 100%);
  transition: width .6s var(--th-ease);
}
body:not(.page-chats) .dx-risk-marker {
  position: absolute;
  top: 50%;
  width: 14px; height: 14px;
  background: var(--th-text-strong);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 3px var(--th-surface), 0 0 10px rgba(0,0,0,.4);
}
body:not(.page-chats) .dx-risk-foot {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 8px; margin-top: 6px;
}
body:not(.page-chats) .dx-risk-num { font-size: 18px; font-weight: 800; color: var(--th-text-strong); }

body:not(.page-chats) .dx-leadstat {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
body:not(.page-chats) .dx-leadstat li {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) 30px;
  gap: 8px;
  align-items: center;
}
body:not(.page-chats) .dx-leadstat-lbl {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--th-text);
  text-transform: capitalize;
}
body:not(.page-chats) .dx-leadstat-bar {
  display: block;
  height: 5px;
  background: var(--th-surface-3);
  border-radius: 999px;
  overflow: hidden;
}
body:not(.page-chats) .dx-leadstat-fill {
  display: block;
  height: 100%;
  background: var(--th-accent);
  border-radius: 999px;
}
body:not(.page-chats) .dx-leadstat-fill--sent       { background: var(--th-ok); }
body:not(.page-chats) .dx-leadstat-fill--pending    { background: var(--th-warn); }
body:not(.page-chats) .dx-leadstat-fill--processing { background: var(--th-info); }
body:not(.page-chats) .dx-leadstat-fill--failed     { background: var(--th-danger); }
body:not(.page-chats) .dx-leadstat-fill--cancelled  { background: var(--th-dim); }
body:not(.page-chats) .dx-leadstat-n {
  text-align: right;
  font-size: 11.5px;
  color: var(--th-text-strong);
  font-feature-settings: "tnum";
}

/* ───────── Grid 5: accounts + alerts ───────── */
body:not(.page-chats) .dx-grid-5 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 14px;
}
@media (max-width: 1080px) { body:not(.page-chats) .dx-grid-5 { grid-template-columns: 1fr; } }

body:not(.page-chats) .dx-accts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 10px;
}

body:not(.page-chats) .dx-alerts {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
body:not(.page-chats) .dx-alert {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  gap: 10px;
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 9px;
  align-items: center;
  transition: border-color var(--th-dur);
}
body:not(.page-chats) .dx-alert:hover { border-color: var(--th-accent-ring); }
body:not(.page-chats) .dx-alert-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--th-info);
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.16);
}
body:not(.page-chats) .dx-alert--warning .dx-alert-dot { background: var(--th-warn); box-shadow: 0 0 0 3px var(--th-warn-soft); }
body:not(.page-chats) .dx-alert--critical .dx-alert-dot,
body:not(.page-chats) .dx-alert--high .dx-alert-dot { background: var(--th-danger); box-shadow: 0 0 0 3px var(--th-danger-soft); }
body:not(.page-chats) .dx-alert--success .dx-alert-dot { background: var(--th-ok); box-shadow: 0 0 0 3px var(--th-ok-soft); }
body:not(.page-chats) .dx-alert-title { font-size: 12.5px; font-weight: 600; color: var(--th-text); }
body:not(.page-chats) .dx-alert-meta {
  display: flex;
  gap: 4px;
  align-items: center;
  font-size: 11px;
  color: var(--th-muted);
  margin-top: 2px;
}

/* ═════════════════════════════════════════════════════════════════════
   SENDER (outreach) — Dashbrd X visual language
   ═════════════════════════════════════════════════════════════════════ */

/* Bulk progress banner */
body:not(.page-chats) .snd-progress {
  padding: 14px 16px !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--th-surface);
  border-color: var(--th-border-strong) !important;
}
body:not(.page-chats) .snd-progress-head {
  display: flex;
  gap: 14px;
  align-items: center;
  flex-wrap: wrap;
}
body:not(.page-chats) .snd-progress-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--th-accent-hi);
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
body:not(.page-chats) .snd-progress-title > svg { color: var(--th-accent-hi); }
body:not(.page-chats) .snd-progress-stats {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  font-size: 12.5px;
  color: var(--th-text);
}
body:not(.page-chats) .snd-progress-stats strong { color: var(--th-text-strong); }
body:not(.page-chats) .snd-progress-fail { color: #fca5a5; }
body:not(.page-chats) .snd-progress-bar {
  position: relative;
  height: 8px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
  overflow: hidden;
}
body:not(.page-chats) .snd-progress-fill {
  height: 100%;
  background: var(--th-accent);
  border-radius: 999px;
  transition: width .6s var(--th-ease);
  position: relative;
  overflow: hidden;
}
body:not(.page-chats) .snd-progress-fill::after { content: none; }
@keyframes snd-shine {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(100%);  }
}
body:not(.page-chats) .snd-progress-msg { margin: 0; }

/* Main 8/4 grid */
body:not(.page-chats) .snd-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
  gap: 14px;
  align-items: flex-start;
}
@media (max-width: 1080px) { body:not(.page-chats) .snd-grid { grid-template-columns: 1fr; } }
body:not(.page-chats) .snd-col-l {
  display: flex; flex-direction: column; gap: 14px;
  min-width: 0;
}
body:not(.page-chats) .snd-col-r {
  display: flex; flex-direction: column; gap: 14px;
  position: sticky; top: 14px;
  align-self: flex-start;
  min-width: 0;
}
@media (max-width: 1080px) { body:not(.page-chats) .snd-col-r { position: static; } }

/* Composer */
body:not(.page-chats) .snd-composer { padding: 18px 20px !important; }
body:not(.page-chats) .snd-tab-toggle { flex-shrink: 0; }
body:not(.page-chats) .snd-block.hidden { display: none; }

body:not(.page-chats) .snd-toolbar {
  display: flex;
  gap: 4px;
  align-items: center;
  padding: 6px 8px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 9px 9px 0 0;
  border-bottom: none;
}
body:not(.page-chats) .snd-toolbar-grp {
  display: inline-flex;
  gap: 2px;
  align-items: center;
  padding: 0 4px;
  border-right: 1px solid var(--th-divider);
}
body:not(.page-chats) .snd-toolbar-grp:last-child { border-right: none; }

body:not(.page-chats) .snd-tool {
  height: 26px;
  min-width: 28px;
  padding: 0 7px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--th-muted);
  font-size: 11.5px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all var(--th-dur);
}
body:not(.page-chats) .snd-tool:hover {
  background: var(--th-surface);
  color: var(--th-text);
  border-color: var(--th-border);
}
body:not(.page-chats) .snd-tool--var {
  font-family: "JetBrains Mono", monospace;
  background: var(--th-accent-dim);
  color: var(--th-accent-hi);
  border-color: var(--th-accent-ring);
  font-weight: 600;
}
body:not(.page-chats) .snd-tool--var:hover {
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  border-color: var(--th-accent);
}
body:not(.page-chats) .snd-charcount {
  padding: 0 6px;
  font-feature-settings: "tnum";
}
body:not(.page-chats) .snd-charcount--warn { color: var(--th-warn); }

body:not(.page-chats) .snd-editor {
  min-height: 140px;
  padding: 12px 14px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-top: none;
  border-radius: 0 0 9px 9px;
  color: var(--th-text);
  font-size: 14px;
  line-height: 1.55;
  font-family: inherit;
  outline: none;
  white-space: pre-wrap;
  word-wrap: break-word;
  transition: border-color var(--th-dur);
  cursor: text;
}
body:not(.page-chats) .snd-editor:focus {
  border-color: var(--th-accent-ring);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
}
body:not(.page-chats) .snd-editor.is-empty::before {
  content: attr(data-placeholder);
  color: var(--th-dim);
  pointer-events: none;
  display: inline-block;
}

body:not(.page-chats) .snd-textarea {
  width: 100%;
  min-height: 100px;
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 9px;
  color: var(--th-text);
  font-family: inherit;
  font-size: 13.5px;
  line-height: 1.5;
  resize: vertical;
  transition: border-color var(--th-dur), box-shadow var(--th-dur);
}
body:not(.page-chats) .snd-textarea:focus {
  outline: none;
  border-color: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
}

body:not(.page-chats) .snd-field-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  color: var(--th-text);
  margin: 12px 0 6px;
}
body:not(.page-chats) .snd-field-label > svg { color: var(--th-accent-hi); }

body:not(.page-chats) .snd-account-row {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--th-divider);
}
body:not(.page-chats) .snd-select {
  width: 100%;
  height: 36px;
  padding: 0 32px 0 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 9px;
  color: var(--th-text);
  font-family: inherit;
  font-size: 13px;
  cursor: pointer;
  transition: border-color var(--th-dur);
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238696a0' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
}
body:not(.page-chats) .snd-select:focus { border-color: var(--th-accent); box-shadow: 0 0 0 3px var(--th-accent-ring); outline: none; }

body:not(.page-chats) .snd-help { margin: 6px 0 0; }

body:not(.page-chats) .snd-form-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--th-divider);
  flex-wrap: wrap;
}
body:not(.page-chats) .snd-foot-tip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
body:not(.page-chats) .snd-foot-tip > svg { color: var(--th-accent-hi); }

/* Pacing */
body:not(.page-chats) .snd-pacing { padding: 18px 20px !important; }
body:not(.page-chats) .snd-pacing-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 90px auto;
  gap: 10px;
  align-items: center;
  padding: 12px 0;
}
body:not(.page-chats) .snd-pacing-row input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
  outline: none;
  padding: 0;
  margin: 0;
}
body:not(.page-chats) .snd-pacing-row input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--th-accent);
  cursor: pointer;
  border: 2px solid var(--th-surface);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.30);
}
body:not(.page-chats) .snd-pacing-row input[type="range"]::-moz-range-thumb {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--th-accent);
  cursor: pointer;
  border: 2px solid var(--th-surface);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.30);
}
body:not(.page-chats) .snd-number {
  width: 90px;
  height: 32px;
  padding: 0 10px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 8px;
  color: var(--th-text);
  font-family: "JetBrains Mono", monospace;
  font-size: 13px;
  font-weight: 700;
  text-align: right;
  outline: none;
  min-height: auto;
}
body:not(.page-chats) .snd-number:focus {
  border-color: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
}
body:not(.page-chats) .snd-unit {
  font-size: 12px;
  color: var(--th-muted);
  font-weight: 600;
}

body:not(.page-chats) .snd-presets {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  margin: 12px 0;
  padding: 0;
}
body:not(.page-chats) .snd-presets-lbl {
  padding-right: 6px;
  font-size: 12px;
  color: var(--th-muted);
  align-self: center;
  white-space: nowrap;
}
body:not(.page-chats) .snd-preset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  min-height: 28px;
  padding: 0 11px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
  color: var(--th-muted);
  font-size: 12px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
  transition: all var(--th-dur);
}
body:not(.page-chats) .snd-preset:hover {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
  border-color: var(--th-border-strong);
}

body:not(.page-chats) .snd-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  color: var(--th-text);
  cursor: pointer;
  margin: 6px 0 12px;
}
body:not(.page-chats) .snd-check input[type="checkbox"] {
  accent-color: var(--th-accent);
  width: 16px; height: 16px;
  margin: 0;
}

body:not(.page-chats) .snd-pacing-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
@media (max-width: 720px) { body:not(.page-chats) .snd-pacing-grid { grid-template-columns: repeat(2, 1fr); } }
body:not(.page-chats) .snd-stat {
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 9px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
body:not(.page-chats) .snd-stat-l {
  font-size: 10.5px;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
}
body:not(.page-chats) .snd-stat-v {
  font-size: 17px;
  font-weight: 800;
  color: var(--th-text-strong);
  font-feature-settings: "tnum";
  letter-spacing: -0.02em;
}

/* Lead import */
body:not(.page-chats) .snd-import { padding: 18px 20px !important; }
body:not(.page-chats) .snd-import-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
@media (max-width: 720px) { body:not(.page-chats) .snd-import-form { grid-template-columns: 1fr; } }

body:not(.page-chats) .snd-dropzone {
  position: relative;
  border: 2px dashed var(--th-border-strong);
  border-radius: 12px;
  background: var(--th-surface-2);
  padding: 28px 18px;
  text-align: center;
  cursor: pointer;
  transition: all var(--th-dur);
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
}
body:not(.page-chats) .snd-dropzone:hover {
  border-color: var(--th-accent-ring);
  background: var(--th-accent-dim);
}
body:not(.page-chats) .snd-dropzone.is-active {
  border-color: var(--th-accent);
  background: var(--th-accent-dim);
  border-style: solid;
}
body:not(.page-chats) .snd-file-input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
body:not(.page-chats) .snd-dropzone-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  pointer-events: none;
}
body:not(.page-chats) .snd-dropzone-ic {
  width: 52px; height: 52px;
  border-radius: 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
body:not(.page-chats) .snd-dropzone-text {
  margin: 0;
  font-size: 13px;
  color: var(--th-text);
}
body:not(.page-chats) .snd-link {
  color: var(--th-accent-hi);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: var(--th-accent-ring);
  text-underline-offset: 2px;
  cursor: pointer;
  pointer-events: auto;
}
body:not(.page-chats) .snd-dropzone-hint { margin: 0; }

body:not(.page-chats) .snd-paste-wrap { display: flex; flex-direction: column; min-width: 0; }
body:not(.page-chats) .snd-paste-wrap .snd-field-label { margin-top: 0; }
body:not(.page-chats) .snd-paste-wrap span { padding-top: 6px; }

body:not(.page-chats) .snd-import-foot {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--th-divider);
  flex-wrap: wrap;
}
body:not(.page-chats) .snd-import-foot-actions {
  display: inline-flex;
  align-items: center;
  align-content: center;
  gap: 6px;
  flex-wrap: nowrap;
  flex-shrink: 0;
  line-height: 1;
}
/* The form wrapper should match the free-standing submit button, not add extra line box height. */
body:not(.page-chats) .snd-import-foot-actions form.inline-form {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0;
  line-height: 0;
}
body:not(.page-chats) .snd-import-foot-actions form.inline-form .btn-wa,
body:not(.page-chats) .snd-import-foot-actions form.inline-form .btn-wa-sm {
  line-height: 1;
  box-sizing: border-box;
}
/* Ensure both action buttons have same height and look polished.
   The first control is a native <button form="…">; the second sits inside
   .inline-form which (style.css) zeros margin on buttons. Without margin: 0
   here, .btn-wa { margin-top: 1rem } only applies to the first and misaligns. */
body:not(.page-chats) .snd-import-foot-actions .btn-wa,
body:not(.page-chats) .snd-import-foot-actions .btn-wa-sm {
  white-space: nowrap;
  height: 34px;
  min-height: 34px;
  padding: 0 14px;
  font-size: 13px;
  align-self: auto;
  margin: 0;
  line-height: 1;
  box-sizing: border-box;
}
/* "Send all" gets a secondary/outlined style to distinguish bulk action */
body:not(.page-chats) .snd-import-foot-actions form:last-child .btn-wa,
body:not(.page-chats) .snd-import-foot-actions form:last-child .btn-wa-sm {
  background: transparent;
  border: 1px solid rgba(37,211,102,0.45);
  color: #25d366;
}
body:not(.page-chats) .snd-import-foot-actions form:last-child .btn-wa:hover,
body:not(.page-chats) .snd-import-foot-actions form:last-child .btn-wa-sm:hover {
  background: rgba(37,211,102,0.08);
}
body:not(.page-chats) .snd-import-foot-actions form:last-child .btn-wa[disabled],
body:not(.page-chats) .snd-import-foot-actions form:last-child .btn-wa-sm[disabled] {
  opacity: 0.4;
  cursor: not-allowed;
}
body:not(.page-chats) .snd-help-block {
  flex: 1;
  min-width: 200px;
}
body:not(.page-chats) .snd-help-block ul {
  margin: 6px 0 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Phone preview */
body:not(.page-chats) .snd-preview-card { padding: 18px 20px !important; }
body:not(.page-chats) .snd-phone {
  position: relative;
  border-radius: 22px;
  background:
    radial-gradient(ellipse at top right, rgba(255,255,255,0.04), transparent 60%),
    var(--th-surface-flat);
  border: 1px solid var(--th-border);
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.40);
}
body:not(.page-chats) .snd-phone--wa { --pcol: #00a884; --pbg: #0b141a; --pchat: #111b21; --pbubble: #005c4b; }
body:not(.page-chats) .snd-phone--tg { --pcol: #3390ec; --pbg: #0e1621; --pchat: #17212b; --pbubble: #2b5278; }

body:not(.page-chats) .snd-phone-status {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 14px;
  font-size: 10px;
  color: rgba(255,255,255,.5);
  font-feature-settings: "tnum";
}
body:not(.page-chats) .snd-phone-status-icons { letter-spacing: -1px; }

body:not(.page-chats) .snd-phone-header {
  display: grid;
  grid-template-columns: 14px 36px minmax(0, 1fr) 16px;
  gap: 8px;
  align-items: center;
  padding: 10px 14px;
  background: var(--pcol);
  color: #fff;
}
body:not(.page-chats) .snd-phone--tg .snd-phone-header { background: var(--pcol); }
body:not(.page-chats) .snd-phone-back { font-size: 18px; opacity: .85; }
body:not(.page-chats) .snd-phone-avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
}
body:not(.page-chats) .snd-phone-id { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
body:not(.page-chats) .snd-phone-name {
  font-size: 14px; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body:not(.page-chats) .snd-phone-sub { font-size: 11px; opacity: .85; }
body:not(.page-chats) .snd-phone-actions { font-size: 16px; opacity: .85; text-align: right; }

body:not(.page-chats) .snd-phone-body {
  padding: 16px 12px;
  min-height: 180px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--pchat);
  background-image:
    radial-gradient(circle at 10% 20%, rgba(255,255,255,.025) 1px, transparent 1px),
    radial-gradient(circle at 70% 70%, rgba(255,255,255,.02) 1px, transparent 1px);
  background-size: 30px 30px;
}
body:not(.page-chats) .snd-bubble {
  align-self: flex-end;
  max-width: 80%;
  padding: 8px 11px;
  border-radius: 12px;
  background: var(--pbubble);
  color: #ffffff;
  font-size: 13px;
  line-height: 1.4;
  position: relative;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  word-wrap: break-word;
}
body:not(.page-chats) .snd-bubble--wa {
  border-bottom-right-radius: 4px;
}
body:not(.page-chats) .snd-bubble--tg {
  border-bottom-right-radius: 4px;
}
body:not(.page-chats) .snd-bubble-text {
  display: block;
  white-space: pre-wrap;
}
body:not(.page-chats) .snd-bubble-meta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.65);
  margin-top: 4px;
  float: right;
  margin-left: 8px;
}
body:not(.page-chats) .snd-bubble-tick { color: #5cd4ff; font-size: 12px; line-height: 1; }
body.provider-whatsapp:not(.page-chats) .snd-bubble-tick { color: #5cd4ff; }

/* Side cards */
body:not(.page-chats) .snd-side-card { padding: 14px 16px !important; }
body:not(.page-chats) .snd-country-list li {
  grid-template-columns: 28px minmax(0, 1fr) minmax(60px, 1fr) auto;
}

/* Campaign actions */
body:not(.page-chats) .snd-actions {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
body:not(.page-chats) .snd-action-form { width: 100%; }
body:not(.page-chats) .snd-action {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 9px;
  color: var(--th-text);
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  text-align: left;
  transition: all var(--th-dur);
  outline: none;
}
body:not(.page-chats) .snd-action:hover {
  background: var(--th-accent-dim);
  border-color: var(--th-accent-ring);
  color: var(--th-accent-hi);
  transform: translateX(2px);
}
body:not(.page-chats) .snd-action[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none !important;
}
body:not(.page-chats) .snd-action[disabled]:hover {
  background: var(--th-surface-2);
  border-color: var(--th-border);
  color: var(--th-text);
  transform: none;
}
body:not(.page-chats) .snd-action > svg { color: var(--th-accent-hi); flex-shrink: 0; }
body:not(.page-chats) .snd-action--ok {
  border-color: rgba(34, 197, 94, 0.30);
  background: rgba(34, 197, 94, 0.10);
  color: #4ade80;
}
body:not(.page-chats) .snd-action--ok:hover {
  background: rgba(34, 197, 94, 0.20);
  border-color: rgba(34, 197, 94, 0.50);
  color: #ffffff;
}
body:not(.page-chats) .snd-action--ok > svg { color: inherit; }
body:not(.page-chats) .snd-action--danger {
  border-color: rgba(239, 68, 68, 0.30);
  background: rgba(239, 68, 68, 0.08);
  color: #fca5a5;
}
body:not(.page-chats) .snd-action--danger:hover {
  background: rgba(239, 68, 68, 0.18);
  border-color: rgba(239, 68, 68, 0.55);
  color: #ffffff;
}
body:not(.page-chats) .snd-action--danger > svg { color: inherit; }

/* Lead queue */
body:not(.page-chats) .snd-queue { padding: 18px 20px !important; }
body:not(.page-chats) .snd-queue-tools {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
/* snd-queue-search styled as a .dx-search variant above */
body:not(.page-chats) .snd-tab-n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  padding: 0 5px;
  height: 14px;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 700;
  margin-left: 4px;
  color: var(--th-text);
}
body:not(.page-chats) .dx-tab.is-active .snd-tab-n {
  background: rgba(255, 255, 255, 0.2);
  color: var(--th-accent-contrast);
}

body:not(.page-chats) .snd-bulk-bar {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 8px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border-strong);
  border-radius: 10px;
  margin-bottom: 8px;
  animation: snd-bulk-in 0.2s var(--th-ease);
}
body:not(.page-chats) .snd-bulk-bar[hidden] { display: none !important; }
body:not(.page-chats) .snd-bulk-bar .inline-form { display: inline-flex; margin: 0; }
body:not(.page-chats) .snd-bulk-bar .btn-xs {
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  border-radius: 7px !important;
  gap: 4px !important;
}
body:not(.page-chats) .snd-bulk-bar .btn-xs svg {
  width: 12px !important;
  height: 12px !important;
}
body:not(.page-chats) .snd-bulk-clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  min-height: 28px;
  padding: 0 10px;
  background: transparent;
  border: 1px solid var(--th-border);
  border-radius: 7px;
  color: var(--th-muted);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  margin-left: auto;
  white-space: nowrap;
  font-family: inherit;
  transition: background var(--th-dur), color var(--th-dur), border-color var(--th-dur);
}
body:not(.page-chats) .snd-bulk-clear:hover {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
  border-color: var(--th-border-strong);
}
body:not(.page-chats) .snd-bulk-msg {
  font-size: 13px;
  color: var(--th-text);
  white-space: nowrap;
}
body:not(.page-chats) .snd-bulk-msg strong { color: var(--th-text-strong); font-weight: 700; }
@keyframes snd-bulk-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: none; }
}
body:not(.page-chats) .snd-bulk-msg {
  font-size: 12.5px;
  color: var(--th-accent-hi);
}
body:not(.page-chats) .snd-bulk-msg strong { color: var(--th-text-strong); margin-right: 2px; }
body:not(.page-chats) .snd-bulk-clear {
  margin-left: auto;
  padding: 0 10px;
  height: 26px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--th-muted);
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: all var(--th-dur);
}
body:not(.page-chats) .snd-bulk-clear:hover { color: var(--th-text); background: var(--th-surface-2); }

body:not(.page-chats) .snd-table-wrap {
  max-height: 580px;
  overflow-y: auto;
  border-top: 1px solid var(--th-divider);
}
body:not(.page-chats) .snd-table { font-size: 12.5px; }
body:not(.page-chats) .snd-table th { padding: 8px 12px; }
body:not(.page-chats) .snd-table td { padding: 8px 12px; vertical-align: middle; }
body:not(.page-chats) .snd-th-check { width: 30px; }
body:not(.page-chats) .snd-row { cursor: pointer; }
body:not(.page-chats) .snd-row-check {
  accent-color: var(--th-accent);
  width: 16px; height: 16px;
  cursor: pointer;
  margin: 0;
}
body:not(.page-chats) .snd-row-actions { width: 36px; text-align: right; }
body:not(.page-chats) .snd-err {
  color: #fca5a5;
  font-size: 11.5px;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}

/* Lead detail modal */
body:not(.page-chats) .snd-modal {
  border: none;
  padding: 0;
  background: transparent;
  color: var(--th-text);
  max-width: 460px;
  width: calc(100vw - 40px);
}
body:not(.page-chats) .snd-modal::backdrop {
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(4px);
}
body:not(.page-chats) .snd-modal-form {
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: 14px;
  box-shadow: var(--th-shadow-lg);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
body:not(.page-chats) .snd-modal-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
body:not(.page-chats) .snd-modal-title > svg { color: var(--th-accent-hi); }

body:not(.page-chats) .snd-detail-dl {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 8px 14px;
  margin: 0;
  font-size: 13px;
}
body:not(.page-chats) .snd-detail-dl dt {
  color: var(--th-muted);
  font-weight: 600;
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  align-self: center;
}
body:not(.page-chats) .snd-detail-dl dd {
  color: var(--th-text);
  margin: 0;
  word-wrap: break-word;
}

/* Visually-hidden helper */
body:not(.page-chats) .visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
body:not(.page-chats) .hidden { display: none !important; }



/* ═════════════════════════════════════════════════════════════════════
   PAGE-SPECIFIC OVERRIDES — pure-black palette propagation
   These rules force per-page custom classes onto the new neutral surfaces
   so every dashboard page (analytics, logs, db, training, settings, accounts,
   alerts, inbox, leads, personas, media) reads consistently.
   ═════════════════════════════════════════════════════════════════════ */

/* — Anything marked .glass-* picks up the neutral surface tokens — */
/* ───────── Analytics ───────── */
body:not(.page-chats) .analytics-header,
body:not(.page-chats) .analytics-quick-card,
body:not(.page-chats) .analytics-card,
body:not(.page-chats) .analytics-section,
body:not(.page-chats) .analytics-table-wrap,
body:not(.page-chats) .analytics-page > section {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .analytics-quick-label { color: var(--th-muted); }
body:not(.page-chats) .analytics-quick-val   { color: var(--th-text-strong); }

/* ───────── Logs ───────── */
body:not(.page-chats) .logs-head,
body:not(.page-chats) .logs-toolbar,
body:not(.page-chats) .logs-terminal,
body:not(.page-chats) .logs-kpi,
body:not(.page-chats) .logs-mini,
body:not(.page-chats) .logs-health-card,
body:not(.page-chats) .logs-side > * {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .logs-terminal-inner,
body:not(.page-chats) .logs-terminal-bar {
  background: var(--th-surface-flat);
}
body:not(.page-chats) .logs-row {
  border-color: var(--th-divider);
}
body:not(.page-chats) .logs-row:hover { background: var(--th-surface-3); }
body:not(.page-chats) .logs-badge {
  background: var(--th-surface-hi);
  color: var(--th-muted);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .logs-row.lv-error .logs-badge { color: #fca5a5; border-color: rgba(239,68,68,.4); background: rgba(239,68,68,.1); }
body:not(.page-chats) .logs-row.lv-warn  .logs-badge { color: #fcd34d; border-color: rgba(245,158,11,.4); background: rgba(245,158,11,.1); }
body:not(.page-chats) .logs-row.lv-ai    .logs-badge { color: var(--th-accent-hi); border-color: var(--th-accent-ring); background: var(--th-accent-dim); }

/* ───────── Database ───────── */
body:not(.page-chats) .db-hero,
body:not(.page-chats) .db-section,
body:not(.page-chats) .db-jump,
body:not(.page-chats) .db-stat,
body:not(.page-chats) .db-training-card {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .db-jump a {
  background: var(--th-surface-2);
  color: var(--th-text);
  border-color: var(--th-border);
}
body:not(.page-chats) .db-jump a:hover {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
}
body:not(.page-chats) .db-table thead th { background: var(--th-surface-2); color: var(--th-muted); border-color: var(--th-divider); }
body:not(.page-chats) .db-table tbody td { border-color: var(--th-divider); }
body:not(.page-chats) .db-table tbody tr:hover { background: var(--th-surface-3); }
body:not(.page-chats) .db-pre { background: var(--th-surface-flat); color: var(--th-text); border: 1px solid var(--th-border); }
body:not(.page-chats) .db-input { background: var(--th-surface-2) !important; }

/* ───────── Training ───────── */
body:not(.page-chats) .tr-hero,
body:not(.page-chats) .tr-threads-card,
body:not(.page-chats) .tr-personas-card,
body:not(.page-chats) .tr-chat-card,
body:not(.page-chats) .tr-thread-row,
body:not(.page-chats) .tr-stat,
body:not(.page-chats) .tr-msg,
body:not(.page-chats) .tr-side-card,
body:not(.page-chats) .tr-stat-grid > *,
body:not(.page-chats) .tr-fact,
body:not(.page-chats) .tr-fact-row {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .tr-thread-row:hover { background: var(--th-surface-3); }
body:not(.page-chats) .tr-thread-row--active { background: var(--th-accent-dim); border-color: var(--th-accent-ring); }
body:not(.page-chats) .tr-msg--user { background: var(--th-surface-2); color: var(--th-text); }
body:not(.page-chats) .tr-msg--assistant {
  background: var(--th-surface-2);
  color: var(--th-text);
  border-left: 2px solid var(--th-accent);
}
body:not(.page-chats) .tr-pill {
  background: var(--th-surface-2);
  color: var(--th-muted);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .tr-pill-mono { font-family: "JetBrains Mono", monospace; color: var(--th-accent-hi); }
body:not(.page-chats) .tr-pill-scope { background: var(--th-accent-dim); color: var(--th-accent-hi); border-color: var(--th-accent-ring); }
body:not(.page-chats) .tr-platform-badge { background: var(--th-surface-2); color: var(--th-text); border: 1px solid var(--th-border); }
body:not(.page-chats) .tr-platform-badge--wa { color: #25d366; border-color: rgba(37,211,102,.4); }
body:not(.page-chats) .tr-platform-badge--tg { color: #3390ec; border-color: rgba(51,144,236,.4); }
body:not(.page-chats) .tr-input,
body:not(.page-chats) .tr-textarea {
  background: var(--th-surface-2);
  color: var(--th-text);
  border-color: var(--th-border);
}
body:not(.page-chats) .tr-input:focus,
body:not(.page-chats) .tr-textarea:focus {
  border-color: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
}

/* ───────── Settings ───────── */
body:not(.page-chats) .settings-v2-card,
body:not(.page-chats) .settings-v2-pool,
body:not(.page-chats) .settings-v2-toc,
body:not(.page-chats) .settings-v2-details {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .settings-v2-toc a {
  background: var(--th-surface-2);
  color: var(--th-text);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .settings-v2-toc a:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
}
body:not(.page-chats) .settings-v2-pool-table {
  background: var(--th-surface-flat);
  border-color: var(--th-border);
}
body:not(.page-chats) .settings-v2-pool-table thead { background: var(--th-surface-2); }
body:not(.page-chats) .settings-v2-pool-table th { color: var(--th-muted); border-color: var(--th-divider); }
body:not(.page-chats) .settings-v2-pool-table td { border-color: var(--th-divider); color: var(--th-text); }
body:not(.page-chats) .settings-v2-details summary { background: var(--th-surface-2); color: var(--th-text); }
body:not(.page-chats) .acct-input { background: var(--th-surface-2); color: var(--th-text); border-color: var(--th-border); }
body:not(.page-chats) .acct-input:focus { border-color: var(--th-accent); box-shadow: 0 0 0 3px var(--th-accent-ring); }
body:not(.page-chats) .acct-step-card { background: var(--th-surface); border-color: var(--th-border); }
body:not(.page-chats) .acct-platform-badge { background: var(--th-surface-2); color: var(--th-text); border: 1px solid var(--th-border); }
body:not(.page-chats) .acct-platform-wa { color: #25d366; }
body:not(.page-chats) .acct-platform-tg { color: #3390ec; }

/* ───────── Accounts hub (acct3 / personas_hub) ───────── */
body:not(.page-chats) .acct3-card,
body:not(.page-chats) .acct3-modal-card,
body:not(.page-chats) .acct3-onboard,
body:not(.page-chats) .acct3-method-group,
body:not(.page-chats) .acct3-result,
body:not(.page-chats) .acct3-pair,
body:not(.page-chats) .acct3-personas-strip,
body:not(.page-chats) .tg-connect-hero,
body:not(.page-chats) .tg-connect-track,
body:not(.page-chats) .tg-accounts-wizard {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .acct3-card:hover { border-color: var(--th-border-strong); }
body:not(.page-chats) .acct3-input { background: var(--th-surface-2); color: var(--th-text); border-color: var(--th-border); }
body:not(.page-chats) .acct3-input:focus { border-color: var(--th-accent); box-shadow: 0 0 0 3px var(--th-accent-ring); }
body:not(.page-chats) .acct3-modal-bg { background: rgba(0,0,0,.65); backdrop-filter: blur(2px); }
body:not(.page-chats) .acct3-pill {
  background: var(--th-surface-2);
  color: var(--th-muted);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .acct-personas-section { background: var(--th-surface); border-color: var(--th-border); }
body:not(.page-chats) .acct-personas-icon-wrap { background: var(--th-surface-2); border-color: var(--th-border); }
body:not(.page-chats) .persona-card,
body:not(.page-chats) .persona-card-empty {
  background: var(--th-surface-2);
  border-color: var(--th-border);
  color: var(--th-text);
}
body:not(.page-chats) .persona-card:hover { background: var(--th-surface-3); border-color: var(--th-border-strong); }
body:not(.page-chats) .wa-inst-card {
  background: var(--th-surface);
  border-color: var(--th-border);
  box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
body:not(.page-chats) .wa-inst-card:hover { border-color: var(--th-border-strong); }
body:not(.page-chats) .wa-inst-quick-stats { background: var(--th-surface-2); border-color: var(--th-border); }
body:not(.page-chats) .wa-inst-details { border-color: var(--th-divider); }
body:not(.page-chats) .wa-inst-details-summary { background: var(--th-surface-2); color: var(--th-text); }
body:not(.page-chats) .wa-inst-details-inner { background: var(--th-surface-flat); border-color: var(--th-border); }
body:not(.page-chats) .wa-inst-field { background: var(--th-surface-2); border-color: var(--th-border); }
body:not(.page-chats) .wa-inst-val,
body:not(.page-chats) .wa-inst-val-mono { color: var(--th-text); }
body:not(.page-chats) .wa-inst-label { color: var(--th-muted); }

/* (alerts-v2-* legacy classes removed; new alerts UI uses .ax-* in
    static/alerts_v2.css) */

/* ───────── Inbox (legacy /dashboard/inbox) ───────── */
body:not(.page-chats) .wa-inbox-app { background: var(--th-bg); }
body:not(.page-chats) .wa-inbox-sidebar,
body:not(.page-chats) .wa-thread-header,
body:not(.page-chats) .wa-settings-panel,
body:not(.page-chats) .wa-compose {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .wa-chat-item {
  background: var(--th-surface-2);
  border-color: var(--th-border);
  color: var(--th-text);
}
body:not(.page-chats) .wa-chat-item:hover { background: var(--th-surface-3); }
body:not(.page-chats) .wa-chat-item.active { background: var(--th-accent-dim); border-color: var(--th-accent-ring); }

/* ───────── Tags / pills generic ───────── */
body:not(.page-chats) .tag {
  background: var(--th-surface-2);
  color: var(--th-text);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .tag-ok      { background: rgba(34,197,94,.14); color: #4ade80; border-color: rgba(34,197,94,.32); }
body:not(.page-chats) .tag-warn,
body:not(.page-chats) .tag-pending { background: rgba(245,158,11,.14); color: #fcd34d; border-color: rgba(245,158,11,.32); }
body:not(.page-chats) .tag-error,
body:not(.page-chats) .tag-paused  { background: rgba(239,68,68,.14); color: #fca5a5; border-color: rgba(239,68,68,.32); }
body:not(.page-chats) .tag-active  { background: var(--th-accent-dim); color: var(--th-accent-hi); border-color: var(--th-accent-ring); }
body:not(.page-chats) .tag-muted   { background: var(--th-surface-3); color: var(--th-muted); border-color: var(--th-border); }

/* ───────── Tables generic (.table, data-table) ───────── */
body:not(.page-chats) .data-table {
  background: var(--th-surface);
  border-color: var(--th-border);
}
body:not(.page-chats) .data-table thead th {
  background: var(--th-surface-2);
  color: var(--th-muted);
  border-color: var(--th-divider);
}
body:not(.page-chats) .data-table td {
  border-color: var(--th-divider);
  color: var(--th-text);
}
body:not(.page-chats) .data-table tbody tr:hover { background: var(--th-surface-3); }

/* ───────── Page-head text base ───────── */
body:not(.page-chats) .page-head,
body:not(.page-chats) .page-head-lg {
  border-color: var(--th-divider);
}

/* ───────── Drop the old radial mesh page-tints from style.css body ───── */
body.provider-whatsapp:not(.page-chats),
body.provider-telegram:not(.page-chats) {
  background: var(--th-bg) !important;
  background-image: none !important;
}

/* ═════════════════════════════════════════════════════════════════════
   ACCOUNT MINI CARDS (.amini)  — overview page accounts strip
   Premium compact card with sparkline, persona chip, schedule, actions
   ═════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .amini {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 22px;
  position: relative;
  transition: border-color 200ms ease, transform 150ms ease, box-shadow 200ms ease;
  overflow: hidden;
}
body:not(.page-chats) .amini::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: var(--th-border-strong);
  opacity: 0.6;
}
body:not(.page-chats) .amini--green::before {
  background: var(--th-accent);
  opacity: 1;
}
body:not(.page-chats) .amini--orange::before {
  background: linear-gradient(90deg, transparent, #F59E0B, transparent);
}
body:not(.page-chats) .amini--red::before {
  background: linear-gradient(90deg, transparent, #EF4444, transparent);
}
body:not(.page-chats) .amini:hover {
  border-color: var(--th-border-strong);
  background: var(--th-surface-2);
}

/* — Header — */
body:not(.page-chats) .amini-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
body:not(.page-chats) .amini-avatar-wrap {
  position: relative;
  flex-shrink: 0;
  width: 48px; height: 48px;
}
body:not(.page-chats) .amini-avatar,
body:not(.page-chats) .amini-avatar-fb {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  object-fit: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text-strong);
  font-weight: 700;
  font-size: 18px;
}
body:not(.page-chats) .amini--green .amini-avatar-wrap::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 14px;
  border: 1.5px solid var(--th-accent);
  opacity: 0.40;
  pointer-events: none;
}
body:not(.page-chats) .amini-status-dot {
  position: absolute;
  right: -2px; bottom: -2px;
  width: 14px; height: 14px;
  border-radius: 50%;
  border: 2.5px solid var(--th-surface);
  z-index: 1;
}
body:not(.page-chats) .amini-status-dot--green {
  background: var(--th-accent);
}
body:not(.page-chats) .amini-status-dot--orange { background: #F59E0B; }
body:not(.page-chats) .amini-status-dot--red,
body:not(.page-chats) .amini-status-dot--offline { background: #6B7280; }

body:not(.page-chats) .amini-id { flex: 1; min-width: 0; }
body:not(.page-chats) .amini-name-row {
  display: flex;
  align-items: center;
  gap: 6px;
}
body:not(.page-chats) .amini-name {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--th-text-strong);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body:not(.page-chats) .amini-platform {
  display: inline-flex;
  color: #25D366;
  flex-shrink: 0;
  opacity: 0.85;
}
body:not(.page-chats) .amini-platform--tg { color: #2AABEE; }
body:not(.page-chats) .amini-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 4px;
  color: var(--th-muted);
  font-size: 11.5px;
}
body:not(.page-chats) .amini-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
body:not(.page-chats) .amini-meta-item svg { opacity: 0.7; }
body:not(.page-chats) .amini-meta-sep { opacity: 0.5; }

body:not(.page-chats) .amini-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 999px;
  background: var(--th-surface-2);
  color: var(--th-muted);
  border: 1px solid var(--th-border);
  flex-shrink: 0;
  white-space: nowrap;
  text-transform: capitalize;
}
body:not(.page-chats) .amini-status-pulse {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--th-muted);
}
body:not(.page-chats) .amini-status--online,
body:not(.page-chats) .amini-status--ready {
  background: var(--th-accent-dim);
  color: var(--th-accent);
  border-color: var(--th-accent-ring);
}
body:not(.page-chats) .amini-status--online .amini-status-pulse {
  background: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
  animation: amini-pulse 1.6s ease-in-out infinite;
}
body:not(.page-chats) .amini-status--sleeping,
body:not(.page-chats) .amini-status--busy {
  background: rgba(245, 158, 11, 0.10);
  color: #F59E0B;
  border-color: rgba(245, 158, 11, 0.30);
}
body:not(.page-chats) .amini-status--paused {
  background: rgba(239, 68, 68, 0.08);
  color: #F87171;
  border-color: rgba(239, 68, 68, 0.25);
}
@keyframes amini-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.4; }
}

/* — Bio — */
body:not(.page-chats) .amini-bio {
  margin: 0;
  padding: 8px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  font-size: 12.5px;
  color: var(--th-text);
  font-style: italic;
  line-height: 1.4;
}

/* — Sparkline — */
body:not(.page-chats) .amini-spark-row {
  background: var(--th-surface-flat);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  padding: 10px 12px;
}
body:not(.page-chats) .amini-spark-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
body:not(.page-chats) .amini-spark-title {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
body:not(.page-chats) .amini-spark-title svg { color: var(--th-accent); }
body:not(.page-chats) .amini-spark-peak { font-size: 10.5px; }
body:not(.page-chats) .amini-spark {
  width: 100%;
  height: 36px;
  display: block;
}

/* — Stat tiles — */
body:not(.page-chats) .amini-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
body:not(.page-chats) .amini-stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  text-align: left;
}
body:not(.page-chats) .amini-stat-icon {
  color: var(--th-accent);
  display: inline-flex;
  margin-bottom: 4px;
}
body:not(.page-chats) .amini-stat-num {
  font-size: 17px;
  font-weight: 700;
  color: var(--th-text-strong);
  line-height: 1;
  letter-spacing: -0.02em;
  font-feature-settings: "tnum";
}
body:not(.page-chats) .amini-stat-lbl {
  font-size: 10.5px;
  color: var(--th-muted);
  text-transform: lowercase;
  font-weight: 500;
}

/* — Chips row (persona + schedule + uptime) — */
body:not(.page-chats) .amini-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
body:not(.page-chats) .amini-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px 4px 4px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
  font-size: 11.5px;
  color: var(--th-text);
  text-decoration: none;
  transition: background-color 150ms ease, border-color 150ms ease;
}
body:not(.page-chats) .amini-chip:hover { background: var(--th-surface-3); border-color: var(--th-border-strong); }
body:not(.page-chats) .amini-chip svg { opacity: 0.7; flex-shrink: 0; }
body:not(.page-chats) .amini-chip-text { font-weight: 500; }
body:not(.page-chats) .amini-chip-avatar {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  flex-shrink: 0;
}
body:not(.page-chats) .amini-chip--persona { padding-left: 4px; }
body:not(.page-chats) .amini-chip--persona:hover {
  background: var(--th-accent-dim);
  border-color: var(--th-accent-ring);
}
body:not(.page-chats) .amini-chip--missing {
  padding-left: 10px;
  background: rgba(239, 68, 68, 0.08);
  color: #F87171;
  border-color: rgba(239, 68, 68, 0.25);
}
body:not(.page-chats) .amini-chip--missing:hover {
  background: rgba(239, 68, 68, 0.18);
}
body:not(.page-chats) .amini-chip--missing svg { color: inherit; opacity: 1; }
body:not(.page-chats) .amini-chip--sched { padding-left: 10px; }
body:not(.page-chats) .amini-chip--sched-warn { color: #F59E0B; border-color: rgba(245, 158, 11, 0.30); background: rgba(245, 158, 11, 0.08); }
body:not(.page-chats) .amini-chip--sched-bad  { color: #F87171; border-color: rgba(239, 68, 68, 0.30); background: rgba(239, 68, 68, 0.08); }
body:not(.page-chats) .amini-chip--uptime { padding-left: 10px; color: var(--th-muted); }
body:not(.page-chats) .amini-chip--uptime svg { color: var(--th-accent); opacity: 1; }

/* — Action row — */
body:not(.page-chats) .amini-actions {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 5px;
  padding-top: 12px;
  border-top: 1px solid var(--th-divider);
  text-align: left;
}
body:not(.page-chats) .amini-form {
  display: block;
  margin: 0;
  padding: 0;
  min-width: 0;
}
body:not(.page-chats) .amini-form > .amini-btn { width: 100%; }
body:not(.page-chats) .amini-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 36px !important;
  min-height: 36px !important;
  min-width: 0 !important;
  padding: 0 !important;
  background: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  border-radius: 10px;
  color: var(--th-muted);
  cursor: pointer;
  text-decoration: none;
  box-sizing: border-box;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
body:not(.page-chats) .amini-btn:hover {
  background: var(--th-surface-3) !important;
  border-color: var(--th-border-strong) !important;
  color: var(--th-text-strong);
}
body:not(.page-chats) .amini-btn--pause:hover { color: #F59E0B; }
body:not(.page-chats) .amini-btn--resume {
  background: var(--th-accent-dim) !important;
  color: var(--th-accent);
  border-color: var(--th-accent-ring) !important;
}
body:not(.page-chats) .amini-btn--manage:hover { color: var(--th-accent); }
body:not(.page-chats) .amini-btn--danger {
  background: rgba(239,68,68,0.08) !important;
  border-color: rgba(239,68,68,0.25) !important;
  color: #F87171;
}
body:not(.page-chats) .amini-btn--danger:hover {
  background: rgba(239,68,68,0.18) !important;
  color: #ef4444;
}
body:not(.page-chats) .amini-btn--fw {
  width: 100% !important;
  font-size: 0.77rem;
  gap: 5px;
}
body:not(.page-chats) .amini-btn svg { width: 16px; height: 16px; }

/* — Footer error — */
body:not(.page-chats) .amini-foot {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 500;
}
body:not(.page-chats) .amini-foot--err {
  background: rgba(239, 68, 68, 0.08);
  color: #F87171;
  border: 1px solid rgba(239, 68, 68, 0.25);
}
body:not(.page-chats) .amini-foot-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ═════════════════════════════════════════════════════════════════════
   ACCOUNT FULL CARD (.acard) — /dashboard/accounts page
   Big premium card with rich detail, sparkline, persona panel, schedule
   ═════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .acard {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 22px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 16px;
  margin-bottom: 16px;
  position: relative;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}
body:not(.page-chats) .acard::before {
  content: "";
  position: absolute;
  top: 0; left: 22px; right: 22px;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: var(--th-border-strong);
  opacity: 0.5;
}
body:not(.page-chats) .acard--green::before {
  background: var(--th-accent);
  opacity: 1;
}
body:not(.page-chats) .acard--orange::before { background: #F59E0B; opacity: 1; }
body:not(.page-chats) .acard--red::before    { background: #EF4444; opacity: 1; }
body:not(.page-chats) .acard:hover {
  border-color: var(--th-border-strong);
}

/* — Header — */
body:not(.page-chats) .acard-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
}
body:not(.page-chats) .acard-id {
  display: flex;
  gap: 16px;
  align-items: center;
  min-width: 0;
}
body:not(.page-chats) .acard-avatar-wrap {
  position: relative;
  flex-shrink: 0;
  width: 64px; height: 64px;
}
body:not(.page-chats) .acard-avatar,
body:not(.page-chats) .acard-avatar-fb {
  width: 64px; height: 64px;
  border-radius: 16px;
  object-fit: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text-strong);
  font-weight: 700;
  font-size: 24px;
}
body:not(.page-chats) .acard--green .acard-avatar-wrap::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 18px;
  border: 1.5px solid var(--th-accent);
  opacity: 0.40;
  pointer-events: none;
}
body:not(.page-chats) .acard-status-dot {
  position: absolute;
  right: -2px; bottom: -2px;
  width: 16px; height: 16px;
  border-radius: 50%;
  border: 3px solid var(--th-surface);
}
body:not(.page-chats) .acard-status-dot--green  { background: var(--th-accent); }
body:not(.page-chats) .acard-status-dot--orange { background: #F59E0B; }
body:not(.page-chats) .acard-status-dot--red    { background: #6B7280; }

body:not(.page-chats) .acard-id-text { min-width: 0; flex: 1; }
body:not(.page-chats) .acard-name-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
body:not(.page-chats) .acard-name {
  font-size: 19px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin: 0;
  letter-spacing: -0.01em;
}
body:not(.page-chats) .acard-platform-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .acard-platform-badge--wa { color: #25D366; border-color: rgba(37, 211, 102, 0.30); }
body:not(.page-chats) .acard-platform-badge--tg { color: #2AABEE; border-color: rgba(42, 171, 238, 0.30); }
body:not(.page-chats) .acard-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
  color: var(--th-muted);
  font-size: 12.5px;
}
body:not(.page-chats) .acard-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
body:not(.page-chats) .acard-meta-item svg { opacity: 0.6; }
body:not(.page-chats) .acard-meta-sep { opacity: 0.4; }

body:not(.page-chats) .acard-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
body:not(.page-chats) .acard-form { display: contents; }
body:not(.page-chats) .acard-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 999px;
  background: var(--th-surface-2);
  color: var(--th-muted);
  border: 1px solid var(--th-border);
  text-transform: capitalize;
}
body:not(.page-chats) .acard-status-pulse {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--th-muted);
}
body:not(.page-chats) .acard-status-pill--online,
body:not(.page-chats) .acard-status-pill--ready {
  background: var(--th-accent-dim);
  color: var(--th-accent);
  border-color: var(--th-accent-ring);
}
body:not(.page-chats) .acard-status-pill--online .acard-status-pulse {
  background: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
  animation: amini-pulse 1.6s ease-in-out infinite;
}
body:not(.page-chats) .acard-status-pill--sleeping,
body:not(.page-chats) .acard-status-pill--busy {
  background: rgba(245, 158, 11, 0.10);
  color: #F59E0B;
  border-color: rgba(245, 158, 11, 0.30);
}

body:not(.page-chats) .acard-iconbtn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  color: var(--th-muted);
  cursor: pointer;
  text-decoration: none;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, transform 100ms ease;
}
body:not(.page-chats) .acard-iconbtn:hover {
  background: var(--th-surface-3) !important;
  border-color: var(--th-border-strong) !important;
  color: var(--th-text-strong);
}
body:not(.page-chats) .acard-iconbtn--accent {
  background: var(--th-accent-dim) !important;
  color: var(--th-accent);
  border-color: var(--th-accent-ring) !important;
}
body:not(.page-chats) .acard-iconbtn--danger:hover { color: #EF4444; border-color: rgba(239, 68, 68, 0.40) !important; }
body:not(.page-chats) .acard-iconbtn svg { width: 18px; height: 18px; }

/* — Bio — */
body:not(.page-chats) .acard-bio {
  margin: 0;
  padding: 10px 14px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  font-size: 13px;
  color: var(--th-text);
  font-style: italic;
  line-height: 1.45;
  display: flex;
  align-items: center;
  gap: 8px;
}
body:not(.page-chats) .acard-bio svg { color: var(--th-muted); flex-shrink: 0; }

/* — KPI tiles — */
body:not(.page-chats) .acard-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 720px) {
  body:not(.page-chats) .acard-kpis { grid-template-columns: repeat(2, 1fr); }
}
body:not(.page-chats) .acard-kpi {
  padding: 14px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative;
}
body:not(.page-chats) .acard-kpi-icon {
  display: inline-flex;
  width: 30px; height: 30px;
  border-radius: 8px;
  background: var(--th-accent-dim);
  color: var(--th-accent);
  align-items: center;
  justify-content: center;
  margin-bottom: 6px;
}
body:not(.page-chats) .acard-kpi-num {
  font-size: 22px;
  font-weight: 700;
  color: var(--th-text-strong);
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-feature-settings: "tnum";
}
body:not(.page-chats) .acard-kpi-lbl {
  font-size: 11.5px;
  color: var(--th-muted);
  text-transform: lowercase;
}

/* — Sparkline block — */
body:not(.page-chats) .acard-spark-block {
  background: var(--th-surface-flat);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  padding: 14px 16px;
}
body:not(.page-chats) .acard-spark-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
body:not(.page-chats) .acard-spark-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
body:not(.page-chats) .acard-spark-title svg { color: var(--th-accent); }
body:not(.page-chats) .acard-spark { width: 100%; height: 60px; display: block; }
body:not(.page-chats) .acard-spark-axis {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
  font-size: 10px;
  color: var(--th-muted);
}

/* — Section blocks — */
body:not(.page-chats) .acard-section {
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  padding: 14px 16px;
}
body:not(.page-chats) .acard-section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
body:not(.page-chats) .acard-section-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--th-text-strong);
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
body:not(.page-chats) .acard-section-title svg { color: var(--th-accent); }
body:not(.page-chats) .acard-section-link {
  font-size: 12px;
  color: var(--th-accent);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 500;
}
body:not(.page-chats) .acard-section-link:hover { text-decoration: underline; }
body:not(.page-chats) .acard-section-sub {
  font-size: 12px;
  color: var(--th-muted);
}

/* — Persona panel — */
body:not(.page-chats) .acard-persona-now {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: var(--th-accent-dim);
  border: 1px solid var(--th-accent-ring);
  border-radius: 10px;
  margin-bottom: 10px;
}
body:not(.page-chats) .acard-persona-avatar {
  width: 36px; height: 36px;
  border-radius: 10px;
  background: var(--th-accent);
  color: var(--th-accent-contrast);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  flex-shrink: 0;
}
body:not(.page-chats) .acard-persona-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
body:not(.page-chats) .acard-persona-name {
  font-size: 13.5px;
  color: var(--th-text-strong);
  font-weight: 600;
}
body:not(.page-chats) .acard-persona-sub {
  font-size: 11.5px;
  color: var(--th-muted);
}
body:not(.page-chats) .acard-persona-ok {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11.5px;
  color: var(--th-accent);
  font-weight: 600;
  flex-shrink: 0;
}
body:not(.page-chats) .acard-persona-warn {
  margin: 0 0 10px;
  padding: 10px 12px;
  background: rgba(245, 158, 11, 0.08);
  border: 1px solid rgba(245, 158, 11, 0.25);
  border-radius: 10px;
  color: #F59E0B;
  font-size: 12.5px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 6px;
}
body:not(.page-chats) .acard-persona-form {
  display: flex;
  gap: 8px;
  align-items: center;
}
body:not(.page-chats) .acard-persona-select,
body:not(.page-chats) .acard-input {
  flex: 1;
  height: 36px;
  padding: 0 12px;
  background: var(--th-surface-flat);
  border: 1px solid var(--th-border);
  border-radius: 9px;
  color: var(--th-text);
  font-family: inherit;
  font-size: 13px;
  outline: none;
  transition: border-color 150ms ease;
}
body:not(.page-chats) .acard-persona-select:focus,
body:not(.page-chats) .acard-input:focus {
  border-color: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
}

/* — Schedule block — */
body:not(.page-chats) .acard-section--sched-warn { border-color: rgba(245, 158, 11, 0.25); background: rgba(245, 158, 11, 0.06); }
body:not(.page-chats) .acard-section--sched-bad  { border-color: rgba(239, 68, 68, 0.25); background: rgba(239, 68, 68, 0.06); }
body:not(.page-chats) .acard-sched-line {
  margin: 0;
  font-size: 13px;
  color: var(--th-text);
  line-height: 1.5;
}
body:not(.page-chats) .acard-sched-countdown {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--th-divider);
}
body:not(.page-chats) .acard-sched-countdown-lbl { font-size: 12px; color: var(--th-muted); }
body:not(.page-chats) .acard-sched-countdown-val {
  font-size: 14px;
  font-weight: 700;
  color: var(--th-accent);
  font-feature-settings: "tnum";
}

/* — Inline form (TG session label) — */
body:not(.page-chats) .acard-inline-form {
  display: flex;
  gap: 8px;
  align-items: center;
}

/* — Details collapsible — */
body:not(.page-chats) .acard-details {
  background: var(--th-surface-flat);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  overflow: hidden;
}
body:not(.page-chats) .acard-details-summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px 16px;
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  user-select: none;
  transition: color 150ms ease, background 150ms ease;
}
body:not(.page-chats) .acard-details-summary::-webkit-details-marker { display: none; }
body:not(.page-chats) .acard-details-summary:hover { color: var(--th-text-strong); background: var(--th-surface-2); }
body:not(.page-chats) .acard-details-summary svg {
  transition: transform 150ms ease;
  color: var(--th-muted);
}
body:not(.page-chats) .acard-details[open] .acard-details-summary svg { transform: rotate(180deg); }
body:not(.page-chats) .acard-details-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  padding: 0 16px 14px;
}
@media (max-width: 720px) {
  body:not(.page-chats) .acard-details-grid { grid-template-columns: 1fr; }
}
body:not(.page-chats) .acard-details-row {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
body:not(.page-chats) .acard-details-row--full { grid-column: 1 / -1; }
body:not(.page-chats) .acard-details-lbl {
  font-size: 10.5px;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}
body:not(.page-chats) .acard-details-val {
  font-size: 12.5px;
  color: var(--th-text);
  word-break: break-word;
}

/* — Hint footer — */
body:not(.page-chats) .acard-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 12.5px;
  font-weight: 500;
}
body:not(.page-chats) .acard-hint--err {
  background: rgba(239, 68, 68, 0.08);
  color: #F87171;
  border: 1px solid rgba(239, 68, 68, 0.25);
}
body:not(.page-chats) .acard-hint--warn {
  background: rgba(245, 158, 11, 0.08);
  color: #F59E0B;
  border: 1px solid rgba(245, 158, 11, 0.25);
}

/* ═════════════════════════════════════════════════════════════════════════
   v26 — V2 page rebuilds matching the OVERVIEW (dx-) design system
   Same hero, same KPI strip pattern, same chart cards, same tabs, same
   filter pills, same section titles, same number sizes. Respects glass-card.
   ═════════════════════════════════════════════════════════════════════════ */

@keyframes vx-pulse {
  0% { transform: scale(1); opacity: 0.5; }
  70% { transform: scale(2.5); opacity: 0; }
  100% { transform: scale(1); opacity: 0; }
}

/* ────────────────────────────────────────────────────────────────────────
   SHARED hero block (dx-report style) — used by all 5 pages
   ──────────────────────────────────────────────────────────────────────── */
body:not(.page-chats) .setx, body:not(.page-chats) .lgx, body:not(.page-chats) .anx,
body:not(.page-chats) .afx, body:not(.page-chats) .dbx { display: flex; flex-direction: column; gap: 14px; padding-bottom: 40px; }

body:not(.page-chats) .setx-hero, body:not(.page-chats) .lgx-hero,
body:not(.page-chats) .anx-hero, body:not(.page-chats) .afx-hero, body:not(.page-chats) .dbx-hero {
  padding: 16px 18px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  box-shadow: none;
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
  position: relative;
}
body:not(.page-chats) .setx-hero { padding: 14px 18px; }
body:not(.page-chats) .setx-hero::before, body:not(.page-chats) .lgx-hero::before,
body:not(.page-chats) .anx-hero::before, body:not(.page-chats) .afx-hero::before, body:not(.page-chats) .dbx-hero::before {
  content: none;
}
body:not(.page-chats) .setx-hero-l, body:not(.page-chats) .lgx-hero-l, body:not(.page-chats) .anx-hero-l,
body:not(.page-chats) .afx-hero-l, body:not(.page-chats) .dbx-hero-l { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
body:not(.page-chats) .setx-hero-r, body:not(.page-chats) .lgx-hero-r, body:not(.page-chats) .anx-hero-r,
body:not(.page-chats) .afx-hero-r, body:not(.page-chats) .dbx-hero-r { display: inline-flex; gap: 8px; flex-wrap: wrap; align-items: center; }

body:not(.page-chats) .setx-title, body:not(.page-chats) .lgx-title, body:not(.page-chats) .anx-title,
body:not(.page-chats) .afx-title, body:not(.page-chats) .dbx-title {
  font-size: 20px; font-weight: 700; letter-spacing: -0.02em;
  color: var(--th-text-strong); margin: 0;
  display: inline-flex; align-items: center; gap: 8px;
  line-height: 1.2;
}
body:not(.page-chats) .setx-title { font-size: 18px; }
body:not(.page-chats) .setx-title > svg, body:not(.page-chats) .lgx-title > svg,
body:not(.page-chats) .anx-title > svg, body:not(.page-chats) .afx-title > svg, body:not(.page-chats) .dbx-title > svg {
  color: var(--th-accent-hi);
  flex-shrink: 0;
}
body:not(.page-chats) .setx-title-sub, body:not(.page-chats) .lgx-title-sub, body:not(.page-chats) .anx-title-sub,
body:not(.page-chats) .afx-title-sub, body:not(.page-chats) .dbx-title-sub { color: var(--th-muted); font-weight: 500; font-size: 13px; }
body:not(.page-chats) .setx-lead, body:not(.page-chats) .lgx-lead, body:not(.page-chats) .anx-lead,
body:not(.page-chats) .afx-lead, body:not(.page-chats) .dbx-lead { font-size: 12px; color: var(--th-muted); margin: 0; max-width: 720px; line-height: 1.5; }
body:not(.page-chats) .setx-lead { font-size: 11.5px; }

/* SHARED filter pill (matches .dx-filter exactly) */
body:not(.page-chats) .setx-mode-link, body:not(.page-chats) .lgx-link-btn, body:not(.page-chats) .anx-export,
body:not(.page-chats) .dbx-search-trigger, body:not(.page-chats) .afx-cta {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 0 14px; height: 36px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text);
  border-radius: 10px;
  font-size: 12.5px; font-weight: 500; font-family: inherit;
  cursor: pointer; text-decoration: none;
  transition: background-color 150ms, border-color 150ms, color 150ms, transform 120ms;
  white-space: nowrap; letter-spacing: -0.005em;
}
body:not(.page-chats) .setx-mode-link:hover, body:not(.page-chats) .lgx-link-btn:hover,
body:not(.page-chats) .anx-export:hover, body:not(.page-chats) .dbx-search-trigger:hover, body:not(.page-chats) .afx-cta:hover {
  background: var(--th-surface-3); border-color: var(--th-border-strong); color: var(--th-text-strong);
}
body:not(.page-chats) .lgx-link-btn--danger { color: #f87171; border-color: rgba(239,68,68,0.30); background: rgba(239,68,68,0.10); }
body:not(.page-chats) .lgx-link-btn--danger:hover { color: #ef4444; background: rgba(239,68,68,0.18); border-color: rgba(239,68,68,0.45); }
/* afx-cta: primary action accent */
body:not(.page-chats) .afx-cta { background: var(--th-accent); border-color: var(--th-accent); color: var(--th-accent-fg, #fff); font-weight: 600; }
body:not(.page-chats) .afx-cta:hover { filter: brightness(1.06); background: var(--th-accent); border-color: var(--th-accent); color: var(--th-accent-fg, #fff); }

/* SHARED section title (matches .dx-section-title) */
body:not(.page-chats) .lgx-section-title, body:not(.page-chats) .anx-section-title,
body:not(.page-chats) .dbx-section-title, body:not(.page-chats) .setx-card-title {
  font-size: 14px; font-weight: 700; color: var(--th-text-strong); margin: 0;
  display: inline-flex; align-items: center; gap: 7px; letter-spacing: -0.005em;
}
body:not(.page-chats) .lgx-section-title > svg, body:not(.page-chats) .anx-section-title > svg,
body:not(.page-chats) .dbx-section-title > svg, body:not(.page-chats) .setx-card-title > svg { color: var(--th-accent-hi); flex-shrink: 0; }

body:not(.page-chats) .setx-card-sub { font-size: 12.5px; color: var(--th-muted); margin: 4px 0 0; line-height: 1.5; }

body:not(.page-chats) .dbx-link {
  display: inline-flex; align-items: center; gap: 3px;
  color: var(--th-accent-hi); text-decoration: none;
  font-size: 12px; font-weight: 600;
}
body:not(.page-chats) .dbx-link:hover { color: var(--th-accent); filter: brightness(1.1); }

/* SHARED chip strip (matches .dx-tabs/.dx-tab) */
body:not(.page-chats) .lgx-chips, body:not(.page-chats) .anx-chips, body:not(.page-chats) .afx-status-chips, body:not(.page-chats) .setx-toc {
  display: inline-flex; padding: 3px; gap: 2px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  align-self: flex-start;
}
body:not(.page-chats) .setx-toc { padding: 3px; gap: 1px; flex-wrap: wrap; max-width: 100%; }
body:not(.page-chats) .setx-toc a { padding: 0 11px !important; height: 28px !important; font-size: 12px !important; border-radius: 7px !important; }
body:not(.page-chats) .setx-toc { flex-wrap: wrap; }
body:not(.page-chats) .lgx-chip, body:not(.page-chats) .anx-chip, body:not(.page-chats) .afx-chip, body:not(.page-chats) .setx-toc a {
  padding: 0 14px; height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  gap: 5px;
  background: transparent; border: none; border-radius: 9px;
  color: var(--th-muted);
  font-size: 12.5px; font-weight: 500;
  font-family: inherit; cursor: pointer; text-decoration: none;
  white-space: nowrap; letter-spacing: -0.005em;
  transition: background-color 150ms, color 150ms;
}
body:not(.page-chats) .lgx-chip:hover, body:not(.page-chats) .anx-chip:hover,
body:not(.page-chats) .afx-chip:hover, body:not(.page-chats) .setx-toc a:hover {
  color: var(--th-text); background: transparent;
}
body:not(.page-chats) .lgx-chip.is-active, body:not(.page-chats) .anx-chip.is-active,
body:not(.page-chats) .afx-chip.is-active, body:not(.page-chats) .setx-toc a.is-active,
body:not(.page-chats) .setx-toc a[aria-current="true"] {
  background: var(--th-surface-3); color: var(--th-text-strong); font-weight: 600;
  box-shadow: 0 1px 3px rgba(0,0,0,0.20), inset 0 0 0 1px var(--th-border);
}

/* Pulse dot (live indicator) */
body:not(.page-chats) .dbx-live-pulse, body:not(.page-chats) .anx-live-pulse {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; height: 30px;
  background: rgba(34,197,94,0.10);
  border: 1px solid rgba(34,197,94,0.25);
  border-radius: 999px;
}
body:not(.page-chats) .dbx-live-pulse-dot, body:not(.page-chats) .anx-live-pulse-dot, body:not(.page-chats) .lgx-term-pulse {
  width: 7px; height: 7px; border-radius: 50%;
  background: #4ade80;
  animation: vx-pulse 2s infinite;
}
body:not(.page-chats) .dbx-live-pulse-label, body:not(.page-chats) .anx-live-pulse-label {
  font-size: 11px; font-weight: 700; color: #4ade80;
  text-transform: uppercase; letter-spacing: 0.05em;
}

/* ════════════════════════════════════════════════════════════════════════════
   SETTINGS (setx-)
   ════════════════════════════════════════════════════════════════════════════ */
body:not(.page-chats) .setx-flash {
  padding: 12px 16px; border-radius: 10px;
  font-size: 13px; display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .setx-flash--ok { background: rgba(34,197,94,0.10); color: #4ade80; border-color: rgba(34,197,94,0.30); }
body:not(.page-chats) .setx-flash--err { background: rgba(239,68,68,0.10); color: #f87171; border-color: rgba(239,68,68,0.30); }

body:not(.page-chats) .setx-form { display: flex; flex-direction: column; gap: 14px; }

/* ════════════════════════════════════════════════════════════════════════
   SETTINGS — flat single-page (no cards, just section dividers)
   ════════════════════════════════════════════════════════════════════════ */

/* Outer page wrapper */
body:not(.page-chats) .setx { gap: 14px !important; padding-bottom: 24px !important; }
/* Wrap the form in one big surface so all sections sit inside a single panel */
body:not(.page-chats) .setx-form {
  padding: 22px 24px;
  background: var(--th-surface);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
}

/* ───── Flat settings layout — NO CARDS, NO BORDERS, just dividers between sections ───── */
body:not(.page-chats) .setx-card {
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  margin: 0 !important;
}
/* Section divider line ABOVE every section except the first */
body:not(.page-chats) .setx-card + .setx-card {
  margin-top: 18px !important;
  padding-top: 18px !important;
  border-top: 1px solid var(--th-divider) !important;
}
body:not(.page-chats) .setx-card::before,
body:not(.page-chats) .setx-card::after { display: none !important; content: none !important; }

body:not(.page-chats) .setx-card-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  border: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}
body:not(.page-chats) .setx-card-head > * {
  border: none !important;
  background: transparent !important;
}
body:not(.page-chats) .setx-card hr,
body:not(.page-chats) .setx-card-head hr { display: none !important; }
body:not(.page-chats) .setx-card-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--th-text-strong) !important;
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  letter-spacing: -0.005em;
  white-space: nowrap;
  flex-shrink: 0;
}
body:not(.page-chats) .setx-card-title > svg { color: var(--th-accent); flex-shrink: 0; }
body:not(.page-chats) .setx-card-sub {
  font-size: 11.5px !important;
  color: var(--th-muted) !important;
  margin: 0 !important;
  line-height: 1.4;
  flex: 1;
  min-width: 200px;
}

/* Field grids — denser */
body:not(.page-chats) .setx-fields { display: grid; gap: 10px 14px; grid-template-columns: 1fr; }
body:not(.page-chats) .setx-fields--2col { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
body:not(.page-chats) .setx-fields--3col { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
body:not(.page-chats) .setx-killswitch-grid { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }

/* Each form-field row — compact label, no uppercase shouting */
body:not(.page-chats) .setx-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
body:not(.page-chats) .setx-field-label {
  display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 12px;
  font-weight: 500;
  color: var(--th-text);
  text-transform: none;
  letter-spacing: -0.005em;
  margin-bottom: 1px;
}
body:not(.page-chats) .setx-field-optional { font-size: 11px; font-weight: 500; color: var(--th-muted); }
body:not(.page-chats) .setx-field-pill {
  display: inline-flex; padding: 0 6px;
  border-radius: 4px; font-size: 9.5px;
  font-weight: 600; background: var(--th-surface-2);
  color: var(--th-muted);
  text-transform: uppercase; letter-spacing: 0.04em;
  height: 16px; line-height: 16px;
}
body:not(.page-chats) .setx-field-pill--rand {
  background: rgba(74, 222, 128, 0.14);
  color: #4ade80;
}
body:not(.page-chats) .setx-field-pill--rand::before {
  content: "↻";
  margin-right: 3px;
  font-weight: 700;
}
body:not(.page-chats) .setx-field-hint {
  margin: 2px 0 0;
  font-size: 11px;
  color: var(--th-muted);
  line-height: 1.4;
}
body:not(.page-chats) .setx-field-hint code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 10.5px;
  padding: 0 4px;
  background: var(--th-surface-2);
  border-radius: 3px;
  color: var(--th-text);
}

/* Inputs — slimmer */
body:not(.page-chats) .setx-input {
  background: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important;
  padding: 7px 10px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-family: inherit !important;
  outline: none !important;
  width: 100%;
  height: 32px;
  min-height: 32px;
  transition: border-color var(--th-dur), box-shadow var(--th-dur), background var(--th-dur);
}
body:not(.page-chats) .setx-input:focus {
  border-color: var(--th-accent) !important;
  box-shadow: 0 0 0 3px var(--th-accent-ring) !important;
  background: var(--th-surface) !important;
}
body:not(.page-chats) .setx-input:hover:not(:focus) { border-color: var(--th-border-strong) !important; }
body:not(.page-chats) .setx-input--xs { max-width: 90px; }
body:not(.page-chats) textarea.setx-input,
body:not(.page-chats) .setx-input[name*="prompt"],
body:not(.page-chats) .setx-input[name*="phrases"] { height: auto; min-height: 32px; }

/* Toggle — compact card layout */
body:not(.page-chats) .setx-toggle {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color var(--th-dur), background var(--th-dur);
  position: relative;
}
body:not(.page-chats) .setx-toggle:hover {
  border-color: var(--th-border);
  background: var(--th-surface-3);
}
body:not(.page-chats) .setx-toggle input[type="checkbox"] {
  position: absolute; opacity: 0; pointer-events: none;
  width: 0; height: 0;
}
body:not(.page-chats) .setx-toggle-track {
  position: relative;
  display: inline-block;
  width: 34px; height: 20px;
  background: var(--th-border-strong);
  border-radius: 999px;
  transition: background 180ms ease;
}
body:not(.page-chats) .setx-toggle-thumb {
  position: absolute; top: 2px; left: 2px;
  width: 16px; height: 16px;
  background: #fff;
  border-radius: 50%;
  transition: left 180ms cubic-bezier(0.22, 1, 0.36, 1);
  box-shadow: 0 1px 3px rgba(0,0,0,0.30);
}
body:not(.page-chats) .setx-toggle input[type="checkbox"]:checked ~ .setx-toggle-track { background: var(--th-accent); }
body:not(.page-chats) .setx-toggle input[type="checkbox"]:checked ~ .setx-toggle-track .setx-toggle-thumb { left: 16px; }
body:not(.page-chats) .setx-toggle-text {
  display: flex; flex-direction: column; gap: 1px; min-width: 0;
}
body:not(.page-chats) .setx-toggle-text strong {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--th-text-strong);
  line-height: 1.3;
}
body:not(.page-chats) .setx-toggle-text .muted {
  font-size: 11px;
  color: var(--th-muted);
  line-height: 1.4;
}
body:not(.page-chats) .setx-toggle--inline {
  display: inline-flex;
  gap: 8px;
  padding: 0;
  background: transparent;
  border: none;
}
body:not(.page-chats) .setx-toggle--inline:hover {
  border: none;
  background: transparent;
}
body:not(.page-chats) .setx-toggle-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 6px 0;
}

/* Collapsible sub-section button (Burst follow-ups, Away-mode pacing) */
body:not(.page-chats) .setx-fields > details {
  grid-column: 1 / -1;
  border-top: 1px solid var(--th-divider);
  padding-top: 10px;
  margin-top: 4px;
}
body:not(.page-chats) .setx-fields > details > summary {
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  color: var(--th-text-strong);
  padding: 4px 0;
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
body:not(.page-chats) .setx-fields > details > summary::-webkit-details-marker { display: none; }
body:not(.page-chats) .setx-fields > details[open] > summary { color: var(--th-accent); }

body:not(.page-chats) .setx-mini-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0 14px; height: 32px;
  background: var(--th-surface-2); border: 1px solid var(--th-border); color: var(--th-text);
  border-radius: 9px; font-size: 12px; font-weight: 500; cursor: pointer;
  transition: background var(--th-dur), border-color var(--th-dur);
}
body:not(.page-chats) .setx-mini-btn:hover { background: var(--th-surface-3); border-color: var(--th-border-strong); }
body:not(.page-chats) .setx-mini-btn--accent { color: var(--th-accent-hi); border-color: rgba(34,197,94,0.30); background: rgba(34,197,94,0.08); }
body:not(.page-chats) .setx-mini-btn--accent:hover { background: rgba(34,197,94,0.16); }
body:not(.page-chats) .setx-mini-btn--danger { color: #f87171; border-color: rgba(239,68,68,0.30); background: rgba(239,68,68,0.08); }

body:not(.page-chats) .setx-savebar {
  position: sticky; bottom: 12px; z-index: 50;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 14px;
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.30);
}
body:not(.page-chats) .setx-save-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0 16px; height: 36px;
  background: var(--th-accent); color: var(--th-accent-fg, #fff);
  border: 1px solid var(--th-accent); border-radius: 9px;
  font-size: 12.5px; font-weight: 600; cursor: pointer;
  transition: filter var(--th-dur);
}
body:not(.page-chats) .setx-save-btn:hover { filter: brightness(1.08); }

body:not(.page-chats) .setx-card--env { background: var(--th-surface-2); }
body:not(.page-chats) .setx-env-grid { display: flex; flex-direction: column; gap: 1px; max-height: 420px; overflow-y: auto; border-radius: 8px; }
body:not(.page-chats) .setx-env-row {
  display: grid; grid-template-columns: 220px 1fr; gap: 12px; align-items: baseline;
  padding: 6px 10px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 11.5px;
}
body:not(.page-chats) .setx-env-row:nth-child(odd) { background: var(--th-surface); }
body:not(.page-chats) .setx-env-key { color: var(--th-muted); font-weight: 600; }
body:not(.page-chats) .setx-env-val { color: var(--th-text); word-break: break-all; }

body:not(.page-chats) .setx-pool-table-wrap { overflow-x: auto; }
body:not(.page-chats) .setx-pool-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
body:not(.page-chats) .setx-pool-table th, body:not(.page-chats) .setx-pool-table td { padding: 8px 10px; text-align: left; border-bottom: 1px solid var(--th-divider); }
body:not(.page-chats) .setx-pool-table th { color: var(--th-muted); font-weight: 600; font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; background: var(--th-surface-2); }
body:not(.page-chats) .setx-pool-add { display: flex; gap: 8px; align-items: end; flex-wrap: wrap; padding-top: 10px; border-top: 1px solid var(--th-divider); }
body:not(.page-chats) .setx-pool-country-form { display: flex; gap: 6px; align-items: end; }
body:not(.page-chats) .setx-details > summary { padding: 4px 0; cursor: pointer; color: var(--th-muted); font-size: 12px; list-style: none; font-weight: 500; }
body:not(.page-chats) .setx-details > summary::-webkit-details-marker { display: none; }
body:not(.page-chats) .setx-details > summary::before { content: "▸ "; color: var(--th-dim); }
body:not(.page-chats) .setx-details[open] > summary::before { content: "▾ "; color: var(--th-accent); }
body:not(.page-chats) .setx-details[open] > summary { color: var(--th-text-strong); }


/* ════════════════════════════════════════════════════════════════════════════
   ACCOUNTS (afx-)
   ════════════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .afx-fleet { display: block; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; }
body:not(.page-chats) .afx-fleet-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 1280px) { body:not(.page-chats) .afx-fleet-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { body:not(.page-chats) .afx-fleet-grid { grid-template-columns: repeat(2, 1fr); } }
body:not(.page-chats) .afx-fleet-cell {
  position: relative;
  padding: 12px 14px;
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 11px;
  overflow: hidden;
  transition: border-color var(--th-dur), background var(--th-dur);
}
body:not(.page-chats) .afx-fleet-cell:hover {
  border-color: var(--th-border-strong);
  background: var(--th-surface-3);
}
body:not(.page-chats) .afx-fleet-cell-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 6px; min-height: 28px;
}
body:not(.page-chats) .afx-fleet-ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  border-radius: 8px;
  background: var(--th-surface-3);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  flex-shrink: 0;
}
body:not(.page-chats) .afx-fleet-cell[data-tone="green"]  .afx-fleet-ic { background: rgba(34,197,94,0.14);  border-color: rgba(34,197,94,0.30);  color: #4ade80; }
body:not(.page-chats) .afx-fleet-cell[data-tone="blue"]   .afx-fleet-ic { background: rgba(59,130,246,0.14); border-color: rgba(59,130,246,0.30); color: #60a5fa; }
body:not(.page-chats) .afx-fleet-cell[data-tone="purple"] .afx-fleet-ic { background: rgba(167,139,250,0.14); border-color: rgba(167,139,250,0.30); color: #a78bfa; }
body:not(.page-chats) .afx-fleet-cell[data-tone="amber"]  .afx-fleet-ic { background: rgba(251,191,36,0.14); border-color: rgba(251,191,36,0.32); color: #fbbf24; }
body:not(.page-chats) .afx-fleet-cell[data-tone="red"]    .afx-fleet-ic { background: rgba(239,68,68,0.14);  border-color: rgba(239,68,68,0.30);  color: #f87171; }
body:not(.page-chats) .afx-fleet-cell[data-tone="gold"]   .afx-fleet-ic { background: rgba(245,158,11,0.14); border-color: rgba(245,158,11,0.30); color: #f59e0b; }
body:not(.page-chats) .afx-fleet-cell[data-tone="blue"]   .afx-fleet-spark { color: #60a5fa; }
body:not(.page-chats) .afx-fleet-status-dots { display: inline-flex; gap: 4px; }
body:not(.page-chats) .afx-fleet-dot {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px;
  padding: 0 4px;
  border-radius: 5px;
  font-size: 10.5px; font-weight: 700;
  font-variant-numeric: tabular-nums;
}
body:not(.page-chats) .afx-fleet-dot--good { background: rgba(34,197,94,0.18); color: #4ade80; }
body:not(.page-chats) .afx-fleet-dot--warn { background: rgba(251,191,36,0.18); color: #fbbf24; }
body:not(.page-chats) .afx-fleet-dot--bad  { background: rgba(239,68,68,0.18); color: #f87171; }
body:not(.page-chats) .afx-fleet-num { font-size: 22px; font-weight: 800; letter-spacing: -0.025em; color: var(--th-text-strong); font-feature-settings: "tnum"; line-height: 1.1; margin-top: 2px; }
body:not(.page-chats) .afx-fleet-lbl { font-size: 11.5px; color: var(--th-muted); font-weight: 500; line-height: 1.3; }
body:not(.page-chats) .afx-fleet-spark {
  display: block;
  width: 100%;
  height: 28px;
  max-height: 28px;
  margin-top: 6px;
  color: var(--th-accent);
}

body:not(.page-chats) .afx-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding: 8px 10px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  box-shadow: none;
}
body:not(.page-chats) .afx-toolbar::-webkit-scrollbar { height: 4px; }
body:not(.page-chats) .afx-toolbar::-webkit-scrollbar-thumb { background: var(--th-border-strong); border-radius: 2px; }
body:not(.page-chats) .afx-toolbar-meta {
  margin-left: auto;
  font-size: 11.5px;
  color: var(--th-muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  padding: 0 6px;
  flex-shrink: 0;
}
body:not(.page-chats) .afx-search {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 1 240px;
  min-width: 180px;
  max-width: 240px;
  height: 30px;
  padding: 0 10px;
  background: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  color: var(--th-muted);
  border-radius: 8px !important;
  transition: border-color var(--th-dur), box-shadow var(--th-dur);
}
body:not(.page-chats) .afx-search > svg { flex-shrink: 0; color: var(--th-muted); }
body:not(.page-chats) .afx-search > input,
body:not(.page-chats) .afx-q {
  flex: 1;
  min-width: 0;
  background: transparent !important;
  border: none !important;
  color: var(--th-text) !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  font-size: 12.5px !important;
  font-family: inherit !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
body:not(.page-chats) .afx-search:focus-within {
  border-color: var(--th-accent) !important;
  box-shadow: 0 0 0 3px var(--th-accent-ring) !important;
  background: var(--th-surface) !important;
}
body:not(.page-chats) .afx-sort {
  background: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important;
  height: 30px;
  padding: 0 28px 0 10px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-family: inherit !important;
  outline: none !important;
  min-width: 130px;
  flex-shrink: 0;
}
body:not(.page-chats) .afx-sort:focus {
  border-color: var(--th-accent) !important;
  box-shadow: 0 0 0 3px var(--th-accent-ring) !important;
}
body:not(.page-chats) .afx-chip-row {
  display: inline-flex;
  gap: 0;
  flex-wrap: nowrap;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 8px;
  padding: 0;
  flex-shrink: 0;
}
body:not(.page-chats) .afx-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 11px;
  background: transparent;
  border: none;
  color: var(--th-muted);
  font-size: 12px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  border-radius: 0;
  transition: background var(--th-dur), color var(--th-dur);
}
body:not(.page-chats) .afx-chip-row > .afx-chip:first-child { border-radius: 7px 0 0 7px; }
body:not(.page-chats) .afx-chip-row > .afx-chip:last-child { border-radius: 0 7px 7px 0; }
body:not(.page-chats) .afx-chip-row > .afx-chip + .afx-chip {
  border-left: 1px solid var(--th-divider);
}
body:not(.page-chats) .afx-chip:hover { color: var(--th-text-strong); background: var(--th-surface-3); }
body:not(.page-chats) .afx-chip.is-active {
  background: var(--th-accent);
  color: var(--th-accent-contrast, #fff);
  font-weight: 600;
}
body:not(.page-chats) .afx-chip-row > .afx-chip.is-active + .afx-chip,
body:not(.page-chats) .afx-chip-row > .afx-chip:has(+ .afx-chip.is-active) { border-left-color: transparent; }
body:not(.page-chats) .afx-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 1px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700;
  background: var(--th-surface-2); color: var(--th-muted);
}
body:not(.page-chats) .afx-pill--good { background: rgba(34,197,94,0.14); color: #4ade80; border: 1px solid rgba(34,197,94,0.30); }
body:not(.page-chats) .afx-pill--bad  { background: rgba(239,68,68,0.14); color: #f87171; border: 1px solid rgba(239,68,68,0.30); }
body:not(.page-chats) .afx-pill--warn { background: rgba(251,191,36,0.14); color: #fbbf24; border: 1px solid rgba(251,191,36,0.30); }
body:not(.page-chats) .afx-list {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  align-items: start;
}
body:not(.page-chats) .afx-visible-count { font-variant-numeric: tabular-nums; color: var(--th-text); font-weight: 600; }
body:not(.page-chats) .afx-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 1px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700;
  background: var(--th-surface-2); color: var(--th-muted);
}
body:not(.page-chats) .afx-pill--good { background: rgba(34,197,94,0.14); color: #4ade80; border: 1px solid rgba(34,197,94,0.30); }
body:not(.page-chats) .afx-pill--bad  { background: rgba(239,68,68,0.14); color: #f87171; border: 1px solid rgba(239,68,68,0.30); }

body:not(.page-chats) .afx-bulk-bar[hidden] { display: none !important; }
body:not(.page-chats) .afx-bulk-bar {
  position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 10px;
  padding: 10px 16px;
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: 999px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
  z-index: 90; font-size: 13px;
}
body:not(.page-chats) .afx-bulk-count { font-weight: 700; color: var(--th-text-strong); }
body:not(.page-chats) .afx-bulk-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 0 14px; height: 30px;
  background: var(--th-surface-2); border: 1px solid var(--th-border); color: var(--th-text);
  border-radius: 999px; font-size: 12px; cursor: pointer;
}
body:not(.page-chats) .afx-bulk-btn:hover { background: var(--th-surface-3); }
body:not(.page-chats) .afx-bulk-btn--ghost { border-color: transparent; color: var(--th-muted); background: transparent; }


/* ════════════════════════════════════════════════════════════════════════════
   LOGS (lgx-)
   ════════════════════════════════════════════════════════════════════════════ */
body:not(.page-chats) .lgx-rate-banner {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 16px;
  background: rgba(239,68,68,0.10);
  border: 1px solid rgba(239,68,68,0.30);
  border-radius: 12px; color: var(--th-text);
}
body:not(.page-chats) .lgx-rate-banner[hidden] { display: none !important; }
body:not(.page-chats) .lgx-rate-banner > svg { color: #f87171; flex-shrink: 0; }
body:not(.page-chats) .lgx-rate-banner-text { font-size: 13px; font-weight: 600; flex: 1; min-width: 0; color: var(--th-text-strong); }
body:not(.page-chats) .lgx-rate-banner-jump { padding: 6px 14px; background: #ef4444; color: #fff; border: none; border-radius: 8px; font-size: 12.5px; font-weight: 600; cursor: pointer; white-space: nowrap; font-family: inherit; }
body:not(.page-chats) .lgx-rate-banner-jump:hover { background: #dc2626; }

body:not(.page-chats) .lgx-volume { display: flex; flex-direction: column; gap: 12px; padding: 18px 20px !important; }
body:not(.page-chats) .lgx-volume-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
body:not(.page-chats) .lgx-volume-bars {
  display: flex;
  align-items: stretch;
  gap: 3px;
  height: 110px;
  padding: 8px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 8px;
}
body:not(.page-chats) .lgx-vol-col {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  border-radius: 2px;
  overflow: hidden;
  background: var(--th-surface-3);
  cursor: pointer;
  transition: opacity 100ms ease;
}
body:not(.page-chats) .lgx-vol-col:hover { opacity: 0.85; }
body:not(.page-chats) .lgx-vol-stack {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
body:not(.page-chats) .lgx-vol-seg { display: block; width: 100%; min-height: 0; }
body:not(.page-chats) .lgx-vol-seg--err  { background: #ef4444; }
body:not(.page-chats) .lgx-vol-seg--warn { background: #f59e0b; }
body:not(.page-chats) .lgx-vol-seg--ai   { background: var(--th-accent); }
body:not(.page-chats) .lgx-vol-seg--info { background: #60a5fa; opacity: 0.7; }
body:not(.page-chats) .lgx-volume-legend { display: inline-flex; gap: 14px; font-size: 11.5px; color: var(--th-muted); font-weight: 500; flex-wrap: wrap; }
body:not(.page-chats) .lgx-leg { display: inline-flex; align-items: center; gap: 6px; }
body:not(.page-chats) .lgx-leg::before { content: ""; width: 8px; height: 8px; border-radius: 2px; }
body:not(.page-chats) .lgx-leg--err::before  { background: #ef4444; }
body:not(.page-chats) .lgx-leg--warn::before { background: #f59e0b; }
body:not(.page-chats) .lgx-leg--ai::before   { background: var(--th-accent); }
body:not(.page-chats) .lgx-leg--info::before { background: #60a5fa; }

body:not(.page-chats) .lgx-toolbar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 16px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r-lg, 14px);
  box-shadow: var(--th-shadow-sm);
}
body:not(.page-chats) .lgx-toolbar-controls { display: flex; gap: 6px; align-items: center; margin-left: auto; flex-wrap: wrap; }
body:not(.page-chats) .lgx-search {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--th-surface-2); border: 1px solid var(--th-border);
  border-radius: 999px; padding: 0 12px; height: 32px; min-width: 280px;
  color: var(--th-muted); transition: all var(--th-dur);
}
body:not(.page-chats) .lgx-search:focus-within { border-color: var(--th-accent); box-shadow: 0 0 0 3px var(--th-accent-ring); background: var(--th-surface); }
body:not(.page-chats) .lgx-search input {
  background: transparent !important; border: none !important; color: var(--th-text) !important;
  padding: 0 !important; font-size: 12.5px !important; outline: none !important; flex: 1; min-width: 0;
}
body:not(.page-chats) .lgx-q {
  background: var(--th-surface-2) !important; border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important; padding: 7px 12px !important; border-radius: 10px !important;
  font-size: 12.5px !important; outline: none !important; min-width: 240px;
}

body:not(.page-chats) .lgx-chip-key { font-weight: 700; }
body:not(.page-chats) .lgx-chip-val { font-weight: 500; }
body:not(.page-chats) .lgx-chip-x { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; border-radius: 50%; background: rgba(0,0,0,0.20); font-size: 9px; cursor: pointer; }
body:not(.page-chats) .lgx-chip-empty { color: var(--th-muted); font-size: 12px; padding: 5px 11px; font-style: italic; }

body:not(.page-chats) .lgx-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 0 14px; height: 32px;
  background: var(--th-surface-2); border: 1px solid var(--th-border); color: var(--th-text);
  border-radius: 10px; font-size: 12.5px; font-weight: 500; cursor: pointer;
  transition: background-color 150ms;
}
body:not(.page-chats) .lgx-pill:hover { background: var(--th-surface-3); border-color: var(--th-border-strong); }
body:not(.page-chats) .lgx-pill--err { border-color: rgba(239,68,68,0.30); color: #f87171; }
body:not(.page-chats) .lgx-pill--err:hover { background: rgba(239,68,68,0.10); }
body:not(.page-chats) .lgx-pill--warn { border-color: rgba(245,158,11,0.30); color: #fbbf24; }
body:not(.page-chats) .lgx-pill--warn:hover { background: rgba(245,158,11,0.10); }
body:not(.page-chats) .lgx-pill--ai { border-color: rgba(34,197,94,0.30); color: #4ade80; }
body:not(.page-chats) .lgx-pill--ai:hover { background: rgba(34,197,94,0.10); }
body:not(.page-chats) .lgx-pause-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 0 14px; height: 32px;
  background: transparent; border: 1px solid var(--th-border); color: var(--th-muted);
  border-radius: 10px; font-size: 12px; cursor: pointer;
}
body:not(.page-chats) .lgx-pause-btn:hover { color: var(--th-text); background: var(--th-surface-2); }

body:not(.page-chats) .lgx-main { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr) 280px; align-items: start; }
@media (max-width: 1100px) { body:not(.page-chats) .lgx-main { grid-template-columns: 1fr; } }

body:not(.page-chats) .lgx-main > .lgx-terminal {
  padding: 0 !important;
  display: flex; flex-direction: column;
  min-height: 540px; max-height: calc(100vh - 240px); overflow: hidden;
}
body:not(.page-chats) .lgx-terminal-bar {
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
  padding: 12px 16px;
  background: var(--th-surface-2);
  border-bottom: 1px solid var(--th-divider);
  font-size: 12px;
}
body:not(.page-chats) .lgx-term-status { display: inline-flex; align-items: center; gap: 6px; color: var(--th-muted); font-weight: 500; }
body:not(.page-chats) .lgx-term-meta { color: var(--th-muted); font-size: 11.5px; margin-left: auto; }
body:not(.page-chats) .lgx-term-density { display: inline-flex; gap: 2px; padding: 3px; background: var(--th-surface); border-radius: 8px; }
body:not(.page-chats) .lgx-density-btn {
  display: inline-flex; align-items: center; padding: 4px 10px;
  background: transparent; border: none; color: var(--th-muted);
  border-radius: 6px; font-size: 11px; cursor: pointer;
  font-family: inherit; font-weight: 500;
}
body:not(.page-chats) .lgx-density-btn:hover { color: var(--th-text); }
body:not(.page-chats) .lgx-density-btn.is-active { background: var(--th-accent); color: var(--th-accent-fg, #fff); }

body:not(.page-chats) .lgx-main > .lgx-terminal > .lgx-terminal {
  flex: 1; overflow-y: auto; padding: 6px 0; min-height: 0;
  background: transparent; border: none;
  font-family: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, monospace;
  font-size: 12px; line-height: 1.5;
}
body:not(.page-chats) .lgx-terminal-empty { padding: 40px 20px; text-align: center; color: var(--th-muted); font-family: inherit; }

body:not(.page-chats) .lgx-row {
  display: block;
  padding: 4px 16px 4px 14px;
  border-left: 2px solid transparent;
  cursor: pointer;
}
body:not(.page-chats) .lgx-row:hover { background: var(--th-surface-2); }
body:not(.page-chats) .lgx-row--err { border-left-color: #ef4444; }
body:not(.page-chats) .lgx-row--warn { border-left-color: #f59e0b; }
body:not(.page-chats) .lgx-row--ai { border-left-color: var(--th-accent); }
body:not(.page-chats) .lgx-row--info { border-left-color: transparent; }
body:not(.page-chats) .lgx-row-id { display: none; }
body:not(.page-chats) .lgx-row-main {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  min-width: 0; line-height: 1.55;
}
body:not(.page-chats) .lgx-row-ts { color: var(--th-muted); font-variant-numeric: tabular-nums; font-size: 11px; flex-shrink: 0; }
body:not(.page-chats) .lgx-row-level { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.04em; flex-shrink: 0; }
body:not(.page-chats) .lgx-row-level--error, body:not(.page-chats) .lgx-row-level--err { color: #f87171; }
body:not(.page-chats) .lgx-row-level--warning, body:not(.page-chats) .lgx-row-level--warn { color: #fbbf24; }
body:not(.page-chats) .lgx-row-level--info { color: var(--th-muted); }
body:not(.page-chats) .lgx-row-level--debug { color: var(--th-border); }
body:not(.page-chats) .lgx-row-msg { color: var(--th-text); white-space: pre-wrap; word-break: break-word; flex: 1; min-width: 200px; }
body:not(.page-chats) .lgx-row-meta { display: inline-flex; align-items: center; gap: 8px; font-size: 10.5px; color: var(--th-muted); flex-wrap: wrap; flex-shrink: 0; }
body:not(.page-chats) .lgx-row-logger { font-weight: 600; }
body:not(.page-chats) .lgx-row-chat { background: var(--th-surface-3); padding: 1px 6px; border-radius: 4px; font-size: 10px; }
body:not(.page-chats) .lgx-row-repeat { display: inline-block; padding: 1px 6px; background: var(--th-surface-3); color: var(--th-muted); border-radius: 4px; font-size: 10px; }
body:not(.page-chats) .lgx-row-stack { background: var(--th-surface-2); padding: 8px 12px; border-radius: 6px; margin-top: 6px; max-height: 200px; overflow: auto; font-size: 10.5px; color: var(--th-muted); }
body:not(.page-chats) .lgx-row-stack-pill { display: inline-block; padding: 1px 6px; background: rgba(239,68,68,0.18); color: #f87171; border-radius: 4px; font-size: 10px; }
body:not(.page-chats) .lgx-row-context { background: var(--th-surface-2); margin-top: 6px; padding: 8px 12px; border-radius: 6px; }
body:not(.page-chats) .lgx-ctx-block { display: flex; flex-direction: column; gap: 4px; }
body:not(.page-chats) .lgx-ctx-block-title { font-size: 10px; color: var(--th-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; }
body:not(.page-chats) .lgx-ctx-row { display: flex; align-items: baseline; gap: 10px; font-size: 11px; opacity: 0.75; padding: 1px 0; flex-wrap: wrap; }

body:not(.page-chats) .lgx-side { display: flex; flex-direction: column; gap: 14px; }
body:not(.page-chats) .lgx-side-card { display: flex; flex-direction: column; gap: 10px; }
body:not(.page-chats) .lgx-side-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--th-divider); }

body:not(.page-chats) .lgx-logger-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .lgx-logger-row { display: grid; grid-template-columns: 1fr 70px 36px; gap: 8px; align-items: center; font-size: 11.5px; padding: 4px 0; cursor: pointer; }
body:not(.page-chats) .lgx-logger-name { color: var(--th-text); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body:not(.page-chats) .lgx-logger-bar { background: var(--th-surface-3); border-radius: 3px; height: 4px; overflow: hidden; }
body:not(.page-chats) .lgx-logger-fill { height: 100%; background: var(--th-accent); }
body:not(.page-chats) .lgx-logger-num { text-align: right; color: var(--th-muted); font-variant-numeric: tabular-nums; font-size: 11px; font-weight: 600; }

body:not(.page-chats) .lgx-recent-errors { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .lgx-rerr-row { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; background: var(--th-surface-2); border-left: 2px solid #ef4444; border-radius: 4px; cursor: pointer; }
body:not(.page-chats) .lgx-rerr-row:hover { background: var(--th-surface-3); }
body:not(.page-chats) .lgx-rerr-line { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
body:not(.page-chats) .lgx-rerr-msg { font-size: 11.5px; color: var(--th-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
body:not(.page-chats) .lgx-rerr-count { font-size: 10.5px; font-weight: 700; padding: 1px 7px; background: rgba(239,68,68,0.18); color: #f87171; border-radius: 999px; }
body:not(.page-chats) .lgx-rerr-meta { font-size: 10.5px; color: var(--th-muted); }

body:not(.page-chats) .lgx-statusbar {
  position: sticky; bottom: 12px; z-index: 30;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 10px 18px;
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: 999px;
  font-size: 12px; color: var(--th-muted);
  box-shadow: 0 6px 18px rgba(0,0,0,0.20);
}
body:not(.page-chats) .lgx-stat { display: inline-flex; align-items: center; gap: 5px; font-variant-numeric: tabular-nums; }
body:not(.page-chats) .lgx-stat strong { color: var(--th-text-strong); font-weight: 700; font-size: 13px; }
body:not(.page-chats) .lgx-stat--right { margin-left: auto; }
body:not(.page-chats) .lgx-jump-live {
  position: absolute; right: 24px; bottom: 14px; z-index: 5;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; background: var(--th-accent); color: var(--th-accent-fg, #fff);
  border: none; border-radius: 999px; font-size: 12.5px; font-weight: 700;
  box-shadow: 0 8px 22px rgba(0,0,0,0.30); cursor: pointer;
}


/* ════════════════════════════════════════════════════════════════════════════
   ANALYTICS (anx-)
   ════════════════════════════════════════════════════════════════════════════ */
body:not(.page-chats) .anx-pulse { display: flex; flex-direction: column; gap: 14px; padding: 18px 20px !important; }
body:not(.page-chats) .anx-pulse-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
body:not(.page-chats) .anx-pulse-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 1280px) { body:not(.page-chats) .anx-pulse-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { body:not(.page-chats) .anx-pulse-grid { grid-template-columns: repeat(2, 1fr); } }
body:not(.page-chats) .anx-pulse-cell {
  position: relative;
  padding: 14px;
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color var(--th-dur), background var(--th-dur);
}
body:not(.page-chats) .anx-pulse-cell:hover { border-color: var(--th-border-strong); background: var(--th-surface-3); }
body:not(.page-chats) .anx-pulse-cell-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 28px;
}
body:not(.page-chats) .anx-pulse-ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  border-radius: 8px;
  background: var(--th-surface-3);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  flex-shrink: 0;
}
body:not(.page-chats) .anx-pulse-cell--green  .anx-pulse-ic { background: rgba(34,197,94,0.14);  border-color: rgba(34,197,94,0.30);  color: #4ade80; }
body:not(.page-chats) .anx-pulse-cell--blue   .anx-pulse-ic { background: rgba(59,130,246,0.14); border-color: rgba(59,130,246,0.30); color: #60a5fa; }
body:not(.page-chats) .anx-pulse-cell--purple .anx-pulse-ic { background: rgba(167,139,250,0.14); border-color: rgba(167,139,250,0.30); color: #a78bfa; }
body:not(.page-chats) .anx-pulse-cell--amber  .anx-pulse-ic { background: rgba(251,191,36,0.14); border-color: rgba(251,191,36,0.32); color: #fbbf24; }
body:not(.page-chats) .anx-pulse-cell--cyan   .anx-pulse-ic { background: rgba(34,211,238,0.14); border-color: rgba(34,211,238,0.30); color: #22d3ee; }
body:not(.page-chats) .anx-pulse-cell--green  .anx-pulse-spark { color: #4ade80; }
body:not(.page-chats) .anx-pulse-cell--blue   .anx-pulse-spark { color: #60a5fa; }
body:not(.page-chats) .anx-pulse-cell--purple .anx-pulse-spark { color: #a78bfa; }
body:not(.page-chats) .anx-pulse-cell--amber  .anx-pulse-spark { color: #fbbf24; }
body:not(.page-chats) .anx-pulse-cell--cyan   .anx-pulse-spark { color: #22d3ee; }
body:not(.page-chats) .anx-pulse-num { font-size: 24px; font-weight: 800; letter-spacing: -0.025em; color: var(--th-text-strong); font-feature-settings: "tnum"; line-height: 1.1; margin-top: 2px; }
body:not(.page-chats) .anx-pulse-lbl { font-size: 11.5px; color: var(--th-muted); font-weight: 500; line-height: 1.3; }
body:not(.page-chats) .anx-pulse-spark { display: block; width: 100%; height: 28px; max-height: 28px; margin-top: 4px; }
body:not(.page-chats) .anx-pulse-anom { display: inline-flex; align-self: flex-start; font-size: 10px; padding: 1px 7px; border-radius: 999px; background: rgba(245,158,11,0.18); color: #fbbf24; font-weight: 700; text-transform: lowercase; border: 1px solid rgba(245,158,11,0.30); margin-top: 4px; }
body:not(.page-chats) .anx-pulse-anom--high { background: rgba(239,68,68,0.18); color: #f87171; border-color: rgba(239,68,68,0.30); }
body:not(.page-chats) .anx-pulse-ts { font-size: 10.5px; color: var(--th-muted); }
body:not(.page-chats) .anx-pulse-delta {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 10.5px; font-weight: 700;
  padding: 2px 7px; border-radius: 999px;
  background: var(--th-surface-3);
  color: var(--th-muted);
  white-space: nowrap;
}
body:not(.page-chats) .anx-pulse-delta--up   { background: rgba(34,197,94,0.14); color: #4ade80; }
body:not(.page-chats) .anx-pulse-delta--down { background: rgba(239,68,68,0.14); color: #f87171; }

body:not(.page-chats) .anx-section { display: flex; flex-direction: column; gap: 10px; }
body:not(.page-chats) .anx-section-head { display: flex; flex-direction: column; gap: 4px; }

body:not(.page-chats) .anx-insights { display: flex; flex-direction: column; gap: 10px; }
body:not(.page-chats) .anx-insights-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
body:not(.page-chats) .anx-insights-empty { padding: 30px 20px; text-align: center; color: var(--th-muted); border: 1px dashed var(--th-border); border-radius: 12px; }
body:not(.page-chats) .anx-insight {
  display: flex; flex-direction: column; gap: 8px;
  padding: 14px 16px;
  border-left: 3px solid var(--th-accent);
  position: relative;
  transition: border-color var(--th-dur), background var(--th-dur);
}
body:not(.page-chats) .anx-insight:hover { background: var(--th-surface-2); }
body:not(.page-chats) .anx-insight--info     { border-left-color: #60a5fa; }
body:not(.page-chats) .anx-insight--warn     { border-left-color: #fbbf24; }
body:not(.page-chats) .anx-insight--critical,
body:not(.page-chats) .anx-insight--bad,
body:not(.page-chats) .anx-insight--err      { border-left-color: #ef4444; }
body:not(.page-chats) .anx-insight--good     { border-left-color: #4ade80; }
body:not(.page-chats) .anx-insight-tag-row { display: flex; align-items: center; gap: 8px; }
body:not(.page-chats) .anx-insight-ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  border-radius: 6px;
  background: var(--th-surface-2);
  color: var(--th-muted);
  flex-shrink: 0;
}
body:not(.page-chats) .anx-insight--info     .anx-insight-ic { background: rgba(96,165,250,0.14); color: #60a5fa; }
body:not(.page-chats) .anx-insight--warn     .anx-insight-ic { background: rgba(251,191,36,0.14); color: #fbbf24; }
body:not(.page-chats) .anx-insight--critical .anx-insight-ic,
body:not(.page-chats) .anx-insight--bad      .anx-insight-ic,
body:not(.page-chats) .anx-insight--err      .anx-insight-ic { background: rgba(239,68,68,0.14); color: #f87171; }
body:not(.page-chats) .anx-insight--good     .anx-insight-ic { background: rgba(74,222,128,0.14); color: #4ade80; }
body:not(.page-chats) .anx-insight-headline { font-size: 13.5px; font-weight: 700; color: var(--th-text-strong); margin: 0; line-height: 1.4; }
body:not(.page-chats) .anx-insight-detail { font-size: 12px; color: var(--th-muted); line-height: 1.5; margin: 0; }
body:not(.page-chats) .anx-insight-tag { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 10px; background: var(--th-surface-2); color: var(--th-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; }
body:not(.page-chats) .anx-insight--info     .anx-insight-tag { background: rgba(96,165,250,0.14); color: #60a5fa; }
body:not(.page-chats) .anx-insight--warn     .anx-insight-tag { background: rgba(251,191,36,0.14); color: #fbbf24; }
body:not(.page-chats) .anx-insight--critical .anx-insight-tag,
body:not(.page-chats) .anx-insight--bad      .anx-insight-tag,
body:not(.page-chats) .anx-insight--err      .anx-insight-tag { background: rgba(239,68,68,0.14); color: #f87171; }
body:not(.page-chats) .anx-insight--good     .anx-insight-tag { background: rgba(74,222,128,0.14); color: #4ade80; }

body:not(.page-chats) .anx-scoreboard { display: flex; flex-direction: column; gap: 12px; }
body:not(.page-chats) .anx-sb-table-wrap { overflow-x: auto; }
body:not(.page-chats) .anx-sb-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
body:not(.page-chats) .anx-sb-table th, body:not(.page-chats) .anx-sb-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--th-divider); }
body:not(.page-chats) .anx-sb-table th { color: var(--th-muted); font-weight: 700; font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; background: var(--th-surface-2); }
body:not(.page-chats) .anx-sb-table td { color: var(--th-text); font-variant-numeric: tabular-nums; }
body:not(.page-chats) .anx-sb-leader td { background: rgba(245,158,11,0.06); }
body:not(.page-chats) .anx-sb-avatar { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--th-surface-3); border: 1px solid var(--th-border); color: var(--th-accent-hi); font-size: 11px; font-weight: 700; margin-right: 8px; vertical-align: middle; }
body:not(.page-chats) .anx-sb-name { color: var(--th-text-strong); font-weight: 700; vertical-align: middle; }
body:not(.page-chats) .anx-sb-crown { color: #fbbf24; margin-right: 4px; }

body:not(.page-chats) .anx-pipeline { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr) 220px; }
@media (max-width: 900px) { body:not(.page-chats) .anx-pipeline { grid-template-columns: 1fr; } }
body:not(.page-chats) .anx-pipeline-stages { display: flex; flex-direction: column; gap: 12px; }
body:not(.page-chats) .anx-pipe-stage { display: flex; flex-direction: column; gap: 5px; }
body:not(.page-chats) .anx-pipe-stage-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
body:not(.page-chats) .anx-pipe-stage-label { font-size: 13px; font-weight: 600; color: var(--th-text-strong); }
body:not(.page-chats) .anx-pipe-stage-num { font-size: 13px; color: var(--th-text-strong); font-weight: 700; font-variant-numeric: tabular-nums; }
body:not(.page-chats) .anx-pipe-stage-pct { font-size: 11px; color: var(--th-muted); margin-left: 6px; }
body:not(.page-chats) .anx-pipe-stage-bar { background: var(--th-surface-2); border-radius: 4px; height: 8px; overflow: hidden; }
body:not(.page-chats) .anx-pipe-stage-fill { height: 100%; background: var(--th-accent); border-radius: inherit; transition: width 600ms cubic-bezier(0.22, 1, 0.36, 1); }
body:not(.page-chats) .anx-pipe-stage-fill--0 { background: linear-gradient(90deg, #4ade80, #22c55e); }
body:not(.page-chats) .anx-pipe-stage-fill--1 { background: linear-gradient(90deg, #34d399, #10b981); }
body:not(.page-chats) .anx-pipe-stage-fill--2 { background: linear-gradient(90deg, #60a5fa, #3b82f6); }
body:not(.page-chats) .anx-pipe-stage-fill--3 { background: linear-gradient(90deg, #a78bfa, #8b5cf6); }
body:not(.page-chats) .anx-pipe-stage-fill--4 { background: linear-gradient(90deg, #fbbf24, #f59e0b); }
body:not(.page-chats) .anx-pipe-stage-fill--strong { background: #4ade80; }
body:not(.page-chats) .anx-pipe-stage-fill--mid { background: var(--th-accent); }
body:not(.page-chats) .anx-pipe-stage-fill--weak { background: #f59e0b; }
body:not(.page-chats) .anx-pipe-stage-drop { font-size: 10.5px; color: #f87171; }
body:not(.page-chats) .anx-pipeline-side { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; background: var(--th-surface-2); border-radius: 12px; }
body:not(.page-chats) .anx-pipe-stat { display: flex; flex-direction: column; gap: 1px; }
body:not(.page-chats) .anx-pipe-stat-num { font-size: 22px; font-weight: 800; color: var(--th-text-strong); font-variant-numeric: tabular-nums; letter-spacing: -0.025em; }
body:not(.page-chats) .anx-pipe-stat-lbl { font-size: 11px; color: var(--th-muted); }
body:not(.page-chats) .anx-pipe-stat--accent .anx-pipe-stat-num { color: var(--th-accent); }
body:not(.page-chats) .anx-pipe-stat--accent { padding-bottom: 12px; border-bottom: 1px solid var(--th-divider); }
body:not(.page-chats) .anx-pipe-value, body:not(.page-chats) .anx-pipe-won-value, body:not(.page-chats) .anx-pipe-won { color: #4ade80; }

body:not(.page-chats) .anx-ttc { display: flex; flex-direction: column; gap: 10px; }
body:not(.page-chats) .anx-ttc-head { display: flex; align-items: center; justify-content: space-between; }
body:not(.page-chats) .anx-ttc-bars { display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .anx-ttc-row { display: grid; grid-template-columns: 100px 1fr 50px; gap: 10px; align-items: center; font-size: 12px; }
body:not(.page-chats) .anx-ttc-label { color: var(--th-muted); }
body:not(.page-chats) .anx-ttc-bar { background: var(--th-surface-2); border-radius: 4px; height: 14px; overflow: hidden; }
body:not(.page-chats) .anx-ttc-fill { height: 100%; background: var(--th-accent); }
body:not(.page-chats) .anx-ttc-num { text-align: right; color: var(--th-text-strong); font-variant-numeric: tabular-nums; font-weight: 600; }
body:not(.page-chats) .anx-ttc-meta { font-size: 11px; color: var(--th-muted); }
body:not(.page-chats) .anx-tt-grid { display: grid; gap: 14px; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
@media (max-width: 1100px) { body:not(.page-chats) .anx-tt-grid { grid-template-columns: 1fr; } }

body:not(.page-chats) .anx-cohort { display: flex; flex-direction: column; gap: 8px; }
body:not(.page-chats) .anx-cohort-table-wrap { overflow-x: auto; }
body:not(.page-chats) .anx-cohort-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
body:not(.page-chats) .anx-cohort-table th, body:not(.page-chats) .anx-cohort-table td { padding: 6px 10px; text-align: center; border: 1px solid var(--th-divider); }
body:not(.page-chats) .anx-cohort-table th { background: var(--th-surface-2); color: var(--th-muted); font-weight: 700; font-size: 10.5px; }

body:not(.page-chats) .anx-health-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin-bottom: 12px; }
body:not(.page-chats) .anx-health-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: 14px 16px !important;
  position: relative;
}
body:not(.page-chats) .anx-health-ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px;
  border-radius: 8px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  margin-bottom: 6px;
}
body:not(.page-chats) .anx-health-card--red    .anx-health-ic { background: rgba(239,68,68,0.14); border-color: rgba(239,68,68,0.30); color: #f87171; }
body:not(.page-chats) .anx-health-card--green  .anx-health-ic { background: rgba(34,197,94,0.14); border-color: rgba(34,197,94,0.30); color: #4ade80; }
body:not(.page-chats) .anx-health-card--amber  .anx-health-ic { background: rgba(251,191,36,0.14); border-color: rgba(251,191,36,0.32); color: #fbbf24; }
body:not(.page-chats) .anx-health-card--purple .anx-health-ic { background: rgba(167,139,250,0.14); border-color: rgba(167,139,250,0.30); color: #a78bfa; }
body:not(.page-chats) .anx-health-card--blue   .anx-health-ic { background: rgba(96,165,250,0.14); border-color: rgba(96,165,250,0.30); color: #60a5fa; }
body:not(.page-chats) .anx-health-num { font-size: 24px; font-weight: 800; color: var(--th-text-strong); font-variant-numeric: tabular-nums; letter-spacing: -0.025em; line-height: 1.05; }
body:not(.page-chats) .anx-health-lbl { font-size: 11.5px; color: var(--th-muted); }
body:not(.page-chats) .anx-h-error-rate { color: #f87171; }
body:not(.page-chats) .anx-h-error-detail { font-size: 11px; color: var(--th-muted); margin-top: 4px; }
body:not(.page-chats) .anx-instances { display: flex; flex-direction: column; gap: 8px; }
body:not(.page-chats) .anx-instance-table { width: 100%; border-collapse: collapse; font-size: 12px; }
body:not(.page-chats) .anx-instance-table th, body:not(.page-chats) .anx-instance-table td { padding: 8px 12px; text-align: left; border-bottom: 1px solid var(--th-divider); }
body:not(.page-chats) .anx-instance-table th { background: var(--th-surface-2); color: var(--th-muted); font-weight: 700; font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; }

body:not(.page-chats) .anx-ticker { display: flex; flex-direction: column; gap: 8px; }
body:not(.page-chats) .anx-ticker-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; max-height: 360px; overflow-y: auto; }
body:not(.page-chats) .anx-ticker-empty { padding: 30px 20px; text-align: center; color: var(--th-muted); font-size: 12px; }
body:not(.page-chats) .anx-ticker-item { display: grid; grid-template-columns: 22px 1fr 60px; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 8px; font-size: 12px; border-left: 2px solid transparent; }
body:not(.page-chats) .anx-ticker-item:hover { background: var(--th-surface-2); }
body:not(.page-chats) .anx-ticker-item--good { border-left-color: #4ade80; }
body:not(.page-chats) .anx-ticker-item--err { border-left-color: #ef4444; }
body:not(.page-chats) .anx-ticker-item--warn { border-left-color: #f59e0b; }
body:not(.page-chats) .anx-ticker-ic { width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; color: var(--th-muted); }
body:not(.page-chats) .anx-ticker-title { color: var(--th-text); font-size: 12px; font-weight: 500; }
body:not(.page-chats) .anx-ticker-preview { color: var(--th-muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body:not(.page-chats) .anx-ticker-time { font-size: 10.5px; color: var(--th-muted); text-align: right; font-variant-numeric: tabular-nums; }
body:not(.page-chats) .anx-win { color: #4ade80; }
body:not(.page-chats) .anx-chip-spacer { width: 1px; background: var(--th-divider); margin: 0 2px; }

/* ─── ANX filter toolbar — proper grouped layout (overrides shared .lgx-chips block) ─── */
body:not(.page-chats) nav.anx-chips {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  align-self: stretch;
  margin: 4px 0 6px;
}
body:not(.page-chats) nav.anx-chips .anx-chip-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
  margin-right: -4px;
}
/* Each <button class="anx-chip"> is wrapped in its own group via adjacency.
   Use sibling selectors to give consecutive chips a shared pill background. */
body:not(.page-chats) nav.anx-chips > .anx-chip,
body:not(.page-chats) nav.anx-chips > .anx-chip + .anx-chip {
  position: relative;
}
/* Build the pill effect by giving each .anx-chip its own background + border,
   then collapsing the borders for adjacent chips so they look like a single segmented control. */
body:not(.page-chats) nav.anx-chips > .anx-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 14px;
  height: 32px;
  min-height: 32px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  font-size: 12.5px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  letter-spacing: -0.005em;
  border-radius: 0;
  margin-left: -1px;  /* collapse adjacent borders */
  transition: background var(--th-dur), color var(--th-dur), border-color var(--th-dur);
}
/* First chip in any consecutive group: round left + reset margin */
body:not(.page-chats) nav.anx-chips > .anx-chip-label + .anx-chip,
body:not(.page-chats) nav.anx-chips > .anx-chip:first-of-type {
  border-radius: 9px 0 0 9px;
  margin-left: 0;
}
/* Last chip before label/link/spacer: round right */
body:not(.page-chats) nav.anx-chips > .anx-chip:has(+ .anx-chip-label),
body:not(.page-chats) nav.anx-chips > .anx-chip:has(+ .anx-chip-link),
body:not(.page-chats) nav.anx-chips > .anx-chip:has(+ .anx-chip-spacer),
body:not(.page-chats) nav.anx-chips > .anx-chip:last-of-type {
  border-radius: 0 9px 9px 0;
}
/* Single chip in a group: full pill */
body:not(.page-chats) nav.anx-chips > .anx-chip-label + .anx-chip:has(+ .anx-chip-label),
body:not(.page-chats) nav.anx-chips > .anx-chip-label + .anx-chip:has(+ .anx-chip-link),
body:not(.page-chats) nav.anx-chips > .anx-chip-label + .anx-chip:last-of-type {
  border-radius: 9px;
}
body:not(.page-chats) nav.anx-chips > .anx-chip:hover {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
  border-color: var(--th-border-strong);
  z-index: 1;
}
body:not(.page-chats) nav.anx-chips > .anx-chip.is-active {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
  border-color: var(--th-accent);
  font-weight: 600;
  z-index: 2;
  box-shadow: inset 0 0 0 1px var(--th-accent);
}
body:not(.page-chats) nav.anx-chips > .anx-chip > svg {
  flex-shrink: 0;
}
/* CSV report — ghost button pushed to right via auto margin */
body:not(.page-chats) nav.anx-chips > .anx-chip-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 14px;
  height: 32px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text);
  border-radius: 9px;
  font-size: 12.5px;
  font-weight: 500;
  text-decoration: none;
  margin-left: auto;
  white-space: nowrap;
  transition: background var(--th-dur), color var(--th-dur), border-color var(--th-dur);
}
body:not(.page-chats) nav.anx-chips > .anx-chip-link:hover {
  background: var(--th-surface-3);
  color: var(--th-accent);
  border-color: var(--th-border-strong);
}
body:not(.page-chats) nav.anx-chips > .anx-chip-spacer {
  display: none;  /* no longer needed — labels handle visual grouping */
}
@media (max-width: 720px) {
  body:not(.page-chats) nav.anx-chips > .anx-chip-link { margin-left: 0; }
}


/* ════════════════════════════════════════════════════════════════════════════
   DATABASE (dbx-)
   ════════════════════════════════════════════════════════════════════════════ */
body:not(.page-chats) .dbx-search-trigger-text { color: var(--th-muted); }
body:not(.page-chats) .dbx-kbd {
  display: inline-flex; align-items: center; padding: 2px 7px;
  background: var(--th-surface-3); border: 1px solid var(--th-border); border-radius: 4px;
  font-size: 10.5px; font-family: ui-monospace, "SF Mono", Menlo, monospace;
  color: var(--th-muted); font-weight: 600;
}
body:not(.page-chats) .dbx-empty { padding: 30px 20px; text-align: center; color: var(--th-muted); }
body:not(.page-chats) .dbx-h3 { font-size: 13px; font-weight: 700; margin: 0; color: var(--th-text-strong); display: inline-flex; align-items: center; gap: 7px; }
body:not(.page-chats) .dbx-h3 > svg { color: var(--th-accent-hi); }
body:not(.page-chats) .dbx-mini-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 0 12px; height: 30px;
  border: 1px solid var(--th-border); background: var(--th-surface-2); color: var(--th-text);
  border-radius: 9px; font-size: 12px; font-weight: 500; cursor: pointer; text-decoration: none;
  transition: background var(--th-dur), border-color var(--th-dur);
}
body:not(.page-chats) .dbx-mini-btn:hover { background: var(--th-surface-3); border-color: var(--th-border-strong); }
body:not(.page-chats) .dbx-mini-btn--danger { color: #f87171; border-color: rgba(239,68,68,0.30); background: rgba(239,68,68,0.08); }

body:not(.page-chats) .dbx-storage { display: flex; flex-direction: column; gap: 14px; }
body:not(.page-chats) .dbx-storage-grid {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0;
  border-bottom: 1px solid var(--th-divider); padding-bottom: 14px;
}
@media (max-width: 1280px) { body:not(.page-chats) .dbx-storage-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { body:not(.page-chats) .dbx-storage-grid { grid-template-columns: repeat(2, 1fr); } }
body:not(.page-chats) .dbx-storage-headline {
  padding: 6px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-right: 1px solid var(--th-divider);
  min-width: 0;
}
body:not(.page-chats) .dbx-storage-grid > .dbx-storage-headline:last-child { border-right: none; }
@media (max-width: 1280px) { body:not(.page-chats) .dbx-storage-headline { border-right: none; } }
body:not(.page-chats) .dbx-storage-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .dbx-storage-ic[data-tone="green"]  { background: rgba(34,197,94,0.12);  border-color: rgba(34,197,94,0.30);  color: #4ade80; }
body:not(.page-chats) .dbx-storage-ic[data-tone="blue"]   { background: rgba(59,130,246,0.12); border-color: rgba(59,130,246,0.30); color: #60a5fa; }
body:not(.page-chats) .dbx-storage-ic[data-tone="purple"] { background: rgba(167,139,250,0.12); border-color: rgba(167,139,250,0.30); color: #a78bfa; }
body:not(.page-chats) .dbx-storage-ic[data-tone="cyan"]   { background: rgba(34,211,238,0.12); border-color: rgba(34,211,238,0.30); color: #22d3ee; }
body:not(.page-chats) .dbx-storage-ic[data-tone="amber"]  { background: rgba(251,191,36,0.12); border-color: rgba(251,191,36,0.30); color: #fbbf24; }
body:not(.page-chats) .dbx-storage-ic[data-tone="gold"]   { background: rgba(245,158,11,0.14); border-color: rgba(245,158,11,0.32); color: #f59e0b; }
body:not(.page-chats) .dbx-storage-body {
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0;
}
body:not(.page-chats) .dbx-storage-num { font-size: 22px; font-weight: 800; letter-spacing: -0.025em; color: var(--th-text-strong); font-feature-settings: "tnum"; line-height: 1.05; }
body:not(.page-chats) .dbx-storage-lbl { font-size: 11.5px; color: var(--th-muted); font-weight: 500; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; line-height: 1.2; }
/* Storage breakdown bar — stacked horizontal segments coloured per table */
body:not(.page-chats) .dbx-storage-bar,
body:not(.page-chats) .dbx-store-bar {
  display: flex;
  height: 10px;
  width: 100%;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 5px;
  overflow: hidden;
  position: relative;
}
body:not(.page-chats) .dbx-store-bar-seg {
  height: 100%;
  min-width: 2px;
  background: var(--th-accent);
  position: relative;
  border-right: 1px solid var(--th-bg);
  transition: filter 150ms ease;
}
body:not(.page-chats) .dbx-store-bar-seg:last-child { border-right: none; }
body:not(.page-chats) .dbx-store-bar-seg:hover { filter: brightness(1.25); }
/* Distinct hue per segment via nth-child rotation */
body:not(.page-chats) .dbx-store-bar-seg:nth-child(1) { background: #25D366; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(2) { background: #2AABEE; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(3) { background: #A78BFA; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(4) { background: #FBBF24; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(5) { background: #F472B6; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(6) { background: #34D399; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(7) { background: #60A5FA; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(8) { background: #F87171; }
body:not(.page-chats) .dbx-store-bar-seg:nth-child(n+9) { background: var(--th-muted); }
body:not(.page-chats) .dbx-store-bar-lbl { display: none; }

/* Storage legend — coloured chips below the bar */
body:not(.page-chats) .dbx-store-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 4px;
}
body:not(.page-chats) .dbx-store-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--th-muted);
  white-space: nowrap;
}
body:not(.page-chats) .dbx-store-legend-dot {
  width: 8px; height: 8px;
  border-radius: 2px;
  background: var(--th-muted);
  flex-shrink: 0;
}
body:not(.page-chats) .dbx-store-legend-dot[data-i="1"] { background: #25D366; }
body:not(.page-chats) .dbx-store-legend-dot[data-i="2"] { background: #2AABEE; }
body:not(.page-chats) .dbx-store-legend-dot[data-i="3"] { background: #A78BFA; }
body:not(.page-chats) .dbx-store-legend-dot[data-i="4"] { background: #FBBF24; }
body:not(.page-chats) .dbx-store-legend-dot[data-i="5"] { background: #F472B6; }
body:not(.page-chats) .dbx-store-legend-dot[data-i="6"] { background: #34D399; }
body:not(.page-chats) .dbx-store-legend-dot[data-i="7"] { background: #60A5FA; }
body:not(.page-chats) .dbx-store-legend-dot[data-i="8"] { background: #F87171; }
body:not(.page-chats) .dbx-store-legend-name {
  color: var(--th-text);
  font-weight: 500;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 11.5px;
}
body:not(.page-chats) .dbx-store-legend-val {
  color: var(--th-muted);
  font-variant-numeric: tabular-nums;
  font-size: 11px;
}

body:not(.page-chats) .dbx-ticker { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px !important; }
body:not(.page-chats) .dbx-ticker-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--th-divider); }
body:not(.page-chats) .dbx-ticker-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; max-height: 420px; overflow-y: auto; }
body:not(.page-chats) .dbx-ticker-empty { padding: 24px 20px; text-align: center; color: var(--th-muted); font-size: 12px; }
body:not(.page-chats) .dbx-ticker-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 12px;
  border-left: 2px solid transparent;
  background: var(--th-surface-2);
  transition: background var(--th-dur), border-color var(--th-dur);
  min-width: 0;
}
body:not(.page-chats) .dbx-ticker-item.is-clickable { cursor: pointer; }
body:not(.page-chats) .dbx-ticker-item:hover { background: var(--th-surface-3); border-color: var(--th-border-strong); }
body:not(.page-chats) .dbx-ticker-item--score { border-left-color: #fbbf24; }
body:not(.page-chats) .dbx-ticker-item--golden { border-left-color: #4ade80; }
body:not(.page-chats) .dbx-ticker-item--fact { border-left-color: var(--th-accent); }
body:not(.page-chats) .dbx-ticker-item--message { border-left-color: #60a5fa; }
body:not(.page-chats) .dbx-ticker-ic {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  background: var(--th-surface-3);
  color: var(--th-muted);
}
body:not(.page-chats) .dbx-ticker-item--score  .dbx-ticker-ic { background: rgba(251,191,36,0.14); color: #fbbf24; }
body:not(.page-chats) .dbx-ticker-item--golden .dbx-ticker-ic { background: rgba(74,222,128,0.14); color: #4ade80; }
body:not(.page-chats) .dbx-ticker-item--fact   .dbx-ticker-ic { background: var(--th-accent-dim); color: var(--th-accent); }
body:not(.page-chats) .dbx-ticker-item--message .dbx-ticker-ic { background: rgba(96,165,250,0.14); color: #60a5fa; }
body:not(.page-chats) .dbx-ticker-title {
  flex: 0 0 auto;
  max-width: 240px;
  color: var(--th-text);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body:not(.page-chats) .dbx-ticker-preview {
  flex: 1 1 0;
  min-width: 0;
  color: var(--th-muted);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body:not(.page-chats) .dbx-ticker-time {
  flex: 0 0 auto;
  margin-left: auto;
  font-size: 11px;
  color: var(--th-dim);
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

body:not(.page-chats) .dbx-section { display: flex; flex-direction: column; gap: 12px; }
body:not(.page-chats) .dbx-section-head { display: flex; flex-direction: column; gap: 4px; }
body:not(.page-chats) .dbx-section-head--with-tools { flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

body:not(.page-chats) .dbx-fp-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
body:not(.page-chats) .dbx-fp-loading { padding: 30px 20px; text-align: center; color: var(--th-muted); }
body:not(.page-chats) .dbx-fp-card { display: flex; flex-direction: column; gap: 12px; }
body:not(.page-chats) .dbx-fp-head { display: grid; grid-template-columns: 40px 1fr auto; gap: 10px; align-items: center; }
body:not(.page-chats) .dbx-fp-avatar { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--th-surface-3); border: 1px solid var(--th-border); color: var(--th-accent-hi); font-size: 16px; font-weight: 800; }
body:not(.page-chats) .dbx-fp-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
body:not(.page-chats) .dbx-fp-name { font-size: 14px; font-weight: 700; color: var(--th-text-strong); margin: 0; display: inline-flex; align-items: center; gap: 6px; }
body:not(.page-chats) .dbx-fp-badge { display: inline-block; padding: 1px 7px; background: rgba(34,197,94,0.14); color: #4ade80; border-radius: 999px; font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid rgba(34,197,94,0.30); }
body:not(.page-chats) .dbx-fp-score { font-size: 14px; font-weight: 800; color: #fbbf24; padding: 4px 10px; background: rgba(245,158,11,0.12); border: 1px solid rgba(245,158,11,0.30); border-radius: 999px; }
body:not(.page-chats) .dbx-fp-score--none { color: var(--th-muted); background: var(--th-surface-2); font-size: 12px; border-color: var(--th-border); }
body:not(.page-chats) .dbx-fp-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
body:not(.page-chats) .dbx-fp-stat { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; background: var(--th-surface-2); border-radius: 8px; }
body:not(.page-chats) .dbx-fp-stat strong { font-size: 15px; font-weight: 800; color: var(--th-text-strong); font-variant-numeric: tabular-nums; }
body:not(.page-chats) .dbx-fp-stat span { font-size: 10px; color: var(--th-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
body:not(.page-chats) .dbx-fp-phrases, body:not(.page-chats) .dbx-fp-openers { display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .dbx-fp-tag { display: inline-block; padding: 2px 8px; background: var(--th-surface-2); color: var(--th-text); border-radius: 999px; font-size: 11px; margin: 0 4px 4px 0; font-weight: 500; }
body:not(.page-chats) .dbx-fp-tag--soft { background: transparent; border: 1px solid var(--th-border); color: var(--th-muted); font-style: italic; }

body:not(.page-chats) .dbx-thread-tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
body:not(.page-chats) .dbx-thread-q, body:not(.page-chats) .dbx-thread-sort, body:not(.page-chats) .dbx-select {
  background: var(--th-surface-2) !important; border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important; padding: 7px 12px !important; border-radius: 10px !important;
  font-size: 12.5px !important; font-family: inherit !important; outline: none !important;
}
body:not(.page-chats) .dbx-thread-q { min-width: 240px; }
body:not(.page-chats) .dbx-search-inline { display: inline-flex; align-items: center; gap: 6px; }

/* ── Provider filter pills ── */
body:not(.page-chats) .dbx-thread-filters { display: inline-flex; gap: 4px; }
body:not(.page-chats) .dbx-filter-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 11px; border-radius: var(--th-r-pill); font-size: 12px; font-weight: 500;
  background: var(--th-surface-2); border: 1px solid var(--th-border); color: var(--th-muted);
  cursor: pointer; transition: all var(--th-dur); white-space: nowrap;
}
body:not(.page-chats) .dbx-filter-pill:hover { background: var(--th-surface-3); color: var(--th-text); }
body:not(.page-chats) .dbx-filter-pill.is-active { background: var(--th-accent-dim); border-color: var(--th-accent-ring); color: var(--th-accent); }

/* ── Thread table layout ── */
body:not(.page-chats) .dbx-thread-table-wrap {
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: var(--th-r);
  overflow: hidden;
}
body:not(.page-chats) .dbx-thread-table-head {
  display: grid;
  grid-template-columns: 260px 1fr 70px 56px 80px 36px;
  gap: 0;
  padding: 8px 14px;
  background: var(--th-surface-2);
  border-bottom: 1px solid var(--th-border);
  font-size: 10.5px; font-weight: 650; text-transform: uppercase;
  letter-spacing: 0.05em; color: var(--th-dim);
}
@media (max-width: 800px) {
  body:not(.page-chats) .dbx-thread-table-head { display: none; }
}
body:not(.page-chats) #dbx-thread-grid { display: flex; flex-direction: column; }
body:not(.page-chats) .dbx-thread-loading { padding: 28px 20px; text-align: center; color: var(--th-muted); font-size: 13px; }
body:not(.page-chats) .dbx-thread-empty { padding: 28px 20px; text-align: center; color: var(--th-muted); font-size: 13px; }

body:not(.page-chats) .dbx-thread-row {
  display: grid;
  grid-template-columns: 260px 1fr 70px 56px 80px 36px;
  gap: 0;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--th-border-soft);
  cursor: pointer;
  transition: background var(--th-dur);
}
body:not(.page-chats) .dbx-thread-row:last-child { border-bottom: none; }
body:not(.page-chats) .dbx-thread-row:hover { background: var(--th-ghost); }
body:not(.page-chats) .dbx-thread-row.is-promising { border-left: 2px solid var(--th-accent); }
body:not(.page-chats) .dbx-thread-row.is-takeover { border-left: 2px solid #f59e0b; }
@media (max-width: 800px) {
  body:not(.page-chats) .dbx-thread-row {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 4px 0;
  }
  body:not(.page-chats) .dbx-thread-col-preview,
  body:not(.page-chats) .dbx-thread-col-msgs,
  body:not(.page-chats) .dbx-thread-col-score { display: none; }
}

/* Thread row columns */
body:not(.page-chats) .dbx-thread-col-chat {
  display: flex; align-items: center; gap: 8px; min-width: 0;
}
body:not(.page-chats) .dbx-thread-av {
  width: 30px; height: 30px; border-radius: 8px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--th-surface-2); border: 1px solid var(--th-border);
  font-weight: 700; font-size: 12px; color: var(--th-accent);
}
body:not(.page-chats) .dbx-thread-av[data-prov="telegram"] { color: #2AABEE; }
body:not(.page-chats) .dbx-thread-id-wrap { min-width: 0; }
body:not(.page-chats) .dbx-thread-cid-row {
  display: flex; align-items: center; gap: 4px; flex-wrap: nowrap; min-width: 0;
}
body:not(.page-chats) .dbx-thread-cid {
  font-size: 12px; font-weight: 600; color: var(--th-text-strong);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: ui-monospace, monospace;
}

/* Provider badge */
body:not(.page-chats) .dbx-prov-badge {
  flex-shrink: 0; font-size: 9px; font-weight: 700; padding: 1px 5px;
  border-radius: 4px; letter-spacing: 0.04em; text-transform: uppercase;
}
body:not(.page-chats) .dbx-prov-badge--wa { background: rgba(37,211,102,0.12); color: #25d366; border: 1px solid rgba(37,211,102,0.25); }
body:not(.page-chats) .dbx-prov-badge--tg { background: rgba(42,171,238,0.12); color: #2AABEE; border: 1px solid rgba(42,171,238,0.25); }

/* Thread pills inline */
body:not(.page-chats) .dbx-tp {
  flex-shrink: 0; display: inline-block; padding: 1px 6px;
  border-radius: 5px; font-size: 10px; font-weight: 600;
  background: var(--th-surface-2); border: 1px solid var(--th-border); color: var(--th-muted);
}
body:not(.page-chats) .dbx-tp.persona { background: var(--th-accent-dim); border-color: var(--th-accent-ring); color: var(--th-accent); }
body:not(.page-chats) .dbx-tp.warn { background: rgba(245,158,11,0.12); border-color: rgba(245,158,11,0.28); color: #f59e0b; }

/* Preview column */
body:not(.page-chats) .dbx-thread-col-preview {
  display: flex; align-items: baseline; gap: 5px;
  min-width: 0; padding: 0 10px;
}
body:not(.page-chats) .dbx-thread-role {
  flex-shrink: 0; font-size: 10px; font-weight: 700;
  color: var(--th-dim); text-transform: uppercase; letter-spacing: 0.04em;
}
body:not(.page-chats) .dbx-thread-preview-text {
  font-size: 12.5px; color: var(--th-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Msgs column */
body:not(.page-chats) .dbx-thread-col-msgs {
  display: flex; flex-direction: column; align-items: flex-end; gap: 0;
  padding: 0 6px; text-align: right;
}
body:not(.page-chats) .dbx-thread-col-msgs strong { font-size: 13px; color: var(--th-text-strong); }
body:not(.page-chats) .dbx-thread-msg-sub { font-size: 10px; color: var(--th-dim); }

/* Score column */
body:not(.page-chats) .dbx-thread-col-score { display: flex; justify-content: center; padding: 0 4px; }
body:not(.page-chats) .dbx-thread-score {
  display: inline-block; padding: 2px 7px;
  border-radius: 6px; font-size: 11px; font-weight: 700;
}
body:not(.page-chats) .dbx-thread-score--hi   { background: rgba(34,197,94,0.12); color: #4ade80; }
body:not(.page-chats) .dbx-thread-score--mid  { background: rgba(251,191,36,0.12); color: #fbbf24; }
body:not(.page-chats) .dbx-thread-score--lo   { background: rgba(239,68,68,0.12); color: #f87171; }
body:not(.page-chats) .dbx-thread-score--none { color: var(--th-dim); font-weight: 400; font-size: 11px; }

/* Time column */
body:not(.page-chats) .dbx-thread-col-time { font-size: 11.5px; color: var(--th-muted); text-align: right; padding: 0 6px; }

/* Open button column */
body:not(.page-chats) .dbx-thread-col-open { display: flex; justify-content: flex-end; }
body:not(.page-chats) .dbx-open-btn {
  width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
  background: transparent; border: 1px solid var(--th-border); border-radius: 7px;
  color: var(--th-dim); font-size: 13px; font-weight: 700; cursor: pointer;
  transition: background var(--th-dur), color var(--th-dur), border-color var(--th-dur);
}
body:not(.page-chats) .dbx-open-btn:hover { background: var(--th-accent); color: #fff; border-color: var(--th-accent); }

/* Footer / load more */
body:not(.page-chats) .dbx-thread-footer {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 14px;
  background: var(--th-surface-2);
  border-top: 1px solid var(--th-border-soft);
}
body:not(.page-chats) .dbx-thread-footer[hidden] { display: none; }
body:not(.page-chats) .dbx-thread-count { font-size: 12px; color: var(--th-muted); }
body:not(.page-chats) .dbx-load-more {
  padding: 6px 16px; border-radius: var(--th-r-sm); font-size: 12.5px; font-weight: 600;
  background: var(--th-surface-3); border: 1px solid var(--th-border); color: var(--th-text);
  cursor: pointer; transition: background var(--th-dur), border-color var(--th-dur);
}
body:not(.page-chats) .dbx-load-more:hover { background: var(--th-accent-dim); border-color: var(--th-accent-ring); color: var(--th-accent); }
body:not(.page-chats) .dbx-load-more[hidden] { display: none; }

body:not(.page-chats) .dbx-quality-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
body:not(.page-chats) .dbx-quality-col { display: flex; flex-direction: column; gap: 12px; border-top: 3px solid var(--th-border); }
body:not(.page-chats) .dbx-quality-col--best { border-top-color: #4ade80; }
body:not(.page-chats) .dbx-quality-col--worst { border-top-color: #ef4444; }
body:not(.page-chats) .dbx-quality-col--golden { border-top-color: #fbbf24; }
body:not(.page-chats) .dbx-quality-head { display: flex; align-items: center; justify-content: space-between; }
body:not(.page-chats) .dbx-quality-label { display: inline-flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--th-surface-2); color: var(--th-muted); text-transform: uppercase; letter-spacing: 0.05em; }
body:not(.page-chats) .dbx-quality-label--good { background: rgba(34,197,94,0.14); color: #4ade80; border: 1px solid rgba(34,197,94,0.30); }
body:not(.page-chats) .dbx-quality-label--bad { background: rgba(239,68,68,0.14); color: #f87171; border: 1px solid rgba(239,68,68,0.30); }
body:not(.page-chats) .dbx-quality-label--gold { background: rgba(245,158,11,0.14); color: #fbbf24; border: 1px solid rgba(245,158,11,0.30); }
body:not(.page-chats) .dbx-quality-list { display: flex; flex-direction: column; gap: 8px; max-height: 480px; overflow-y: auto; padding-right: 4px; }

body:not(.page-chats) .dbx-q-card { padding: 10px 12px; background: var(--th-surface-2); border: 1px solid var(--th-border); border-radius: 10px; display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .dbx-q-card--bad { border-left: 2px solid #ef4444; }
body:not(.page-chats) .dbx-q-card--best { border-left: 2px solid #4ade80; }
body:not(.page-chats) .dbx-q-meta { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--th-muted); flex-wrap: wrap; }
body:not(.page-chats) .dbx-q-pill { padding: 1px 7px; border-radius: 999px; background: var(--th-surface-3); font-size: 10px; font-weight: 600; }
body:not(.page-chats) .dbx-q-stars { display: inline-flex; gap: 1px; font-size: 11px; color: #fbbf24; font-weight: 700; }
body:not(.page-chats) .dbx-q-stars--bad { color: #f87171; }
body:not(.page-chats) .dbx-q-user { font-size: 11.5px; color: var(--th-muted); padding: 6px 10px; background: var(--th-surface); border-radius: 6px; }
body:not(.page-chats) .dbx-q-ai { font-size: 12.5px; color: var(--th-text); line-height: 1.5; white-space: pre-wrap; }

body:not(.page-chats) .dbx-g-card { padding: 12px 14px; background: var(--th-surface-2); border: 1px solid var(--th-border); border-radius: 10px; display: flex; flex-direction: column; gap: 8px; }
body:not(.page-chats) .dbx-g-meta { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--th-muted); }
body:not(.page-chats) .dbx-g-row { display: grid; grid-template-columns: 50px 1fr; gap: 10px; align-items: baseline; padding: 8px 10px; background: var(--th-surface); border-radius: 8px; font-size: 12.5px; line-height: 1.5; }
body:not(.page-chats) .dbx-g-tag { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--th-muted); }
body:not(.page-chats) .dbx-g-tag--user { color: var(--th-muted); }
body:not(.page-chats) .dbx-g-tag--bad { color: #f87171; }
body:not(.page-chats) .dbx-g-tag--gold { color: #fbbf24; }
body:not(.page-chats) .dbx-g-row--strike { opacity: 0.6; text-decoration: line-through; }

body:not(.page-chats) .dbx-memory { display: flex; flex-direction: column; gap: 14px; }
body:not(.page-chats) .dbx-memory-tabs { display: inline-flex; padding: 4px; gap: 2px; background: var(--th-surface-2); border: 1px solid var(--th-border); border-radius: 12px; align-self: flex-start; }
body:not(.page-chats) .dbx-memory-tab { padding: 0 14px; height: 30px; background: transparent; border: none; border-radius: 9px; font-size: 12.5px; font-weight: 500; color: var(--th-muted); cursor: pointer; font-family: inherit; transition: background-color 150ms, color 150ms; }
body:not(.page-chats) .dbx-memory-tab:hover { color: var(--th-text); }
body:not(.page-chats) .dbx-memory-tab.is-active { background: var(--th-surface-3); color: var(--th-text-strong); font-weight: 600; box-shadow: 0 1px 3px rgba(0,0,0,0.20), inset 0 0 0 1px var(--th-border); }
body:not(.page-chats) .dbx-memory-pane { display: none; flex-direction: column; gap: 10px; }
body:not(.page-chats) .dbx-memory-pane.is-active { display: flex; }
body:not(.page-chats) .dbx-mem-block { padding: 14px 16px; background: var(--th-surface-2); border: 1px solid var(--th-border); border-radius: 12px; display: flex; flex-direction: column; gap: 8px; }
body:not(.page-chats) .dbx-mem-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
body:not(.page-chats) .dbx-mem-actions { display: flex; gap: 6px; }
body:not(.page-chats) .dbx-mem-ta {
  background: var(--th-surface) !important; border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important; padding: 10px 12px !important; border-radius: 8px !important;
  font-family: inherit !important; font-size: 12.5px; line-height: 1.5; resize: vertical; min-height: 80px;
  outline: none !important; width: 100%;
}
body:not(.page-chats) .dbx-fact-list { display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .dbx-fact-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: var(--th-surface); border: 1px solid var(--th-border); border-radius: 10px; }
body:not(.page-chats) .dbx-fact-text { flex: 1; font-size: 12.5px; color: var(--th-text); }
body:not(.page-chats) .dbx-fact-meta { display: inline-flex; gap: 8px; align-items: center; font-size: 10.5px; color: var(--th-muted); }

body:not(.page-chats) .dbx-maint-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
body:not(.page-chats) .dbx-cleanup-card, body:not(.page-chats) .dbx-export-card { display: flex; flex-direction: column; gap: 10px; }
body:not(.page-chats) .dbx-cleanup-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .dbx-cleanup-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; background: var(--th-surface-2); border-radius: 10px; }
body:not(.page-chats) .dbx-cleanup-label { font-size: 12.5px; color: var(--th-text); font-weight: 500; }
body:not(.page-chats) .dbx-export-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow-y: auto; }
body:not(.page-chats) .dbx-export-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; background: var(--th-surface-2); border-radius: 8px; }
body:not(.page-chats) .dbx-export-name { font-size: 12px; color: var(--th-text); font-family: ui-monospace, "SF Mono", Menlo, monospace; font-weight: 500; }
body:not(.page-chats) .dbx-export-actions { display: inline-flex; gap: 6px; }

body:not(.page-chats) .dbx-ai-see { display: flex; flex-direction: column; gap: 12px; }
body:not(.page-chats) .dbx-ai-see-tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
body:not(.page-chats) .dbx-ai-persona, body:not(.page-chats) .dbx-ai-provider {
  background: var(--th-surface-2) !important; border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important; padding: 7px 12px !important; border-radius: 10px !important;
  font-size: 12.5px !important;
}
body:not(.page-chats) .dbx-ai-refresh { padding: 0 14px; height: 32px; background: var(--th-surface-2); border: 1px solid var(--th-border); color: var(--th-text); border-radius: 9px; font-size: 12px; font-weight: 500; cursor: pointer; }
body:not(.page-chats) .dbx-ai-see-out {
  margin: 0; padding: 16px;
  background: var(--th-surface-2); border: 1px solid var(--th-border); border-radius: 12px;
  font-family: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, monospace;
  font-size: 11.5px; line-height: 1.6; color: var(--th-text);
  white-space: pre-wrap; word-break: break-word;
  max-height: 500px; overflow-y: auto;
}

body:not(.page-chats) .dbx-modal { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; }
body:not(.page-chats) .dbx-modal[hidden] { display: none; }
body:not(.page-chats) .dbx-modal-bg { position: absolute; inset: 0; background: rgba(0,0,0,0.65); backdrop-filter: blur(2px); }
body:not(.page-chats) .dbx-modal-card { position: relative; z-index: 1; width: min(720px, calc(100vw - 32px)); max-height: calc(100vh - 60px); overflow: hidden; display: flex; flex-direction: column; background: var(--th-surface); border: 1px solid var(--th-border-strong); border-radius: var(--th-r-lg, 14px); box-shadow: 0 20px 60px rgba(0,0,0,0.50); }
body:not(.page-chats) .dbx-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--th-divider); }
body:not(.page-chats) .dbx-modal-title { font-size: 15px; font-weight: 700; margin: 0; color: var(--th-text-strong); letter-spacing: -0.01em; }
body:not(.page-chats) .dbx-modal-sub { font-size: 12px; color: var(--th-muted); margin: 2px 0 0; }
body:not(.page-chats) .dbx-modal-close, body:not(.page-chats) .dbx-close { background: transparent; border: none; color: var(--th-muted); padding: 4px; cursor: pointer; border-radius: 6px; }
body:not(.page-chats) .dbx-modal-close:hover, body:not(.page-chats) .dbx-close:hover { background: var(--th-surface-2); color: var(--th-text); }
body:not(.page-chats) .dbx-modal-body { padding: 18px 20px; overflow-y: auto; }
body:not(.page-chats) .dbx-thread-modal .dbx-modal-card { width: min(820px, calc(100vw - 32px)); }
body:not(.page-chats) .dbx-thread-mod-summary { padding: 12px 14px; background: var(--th-surface-2); border-radius: 10px; font-size: 12.5px; color: var(--th-text); display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
body:not(.page-chats) .dbx-thread-mod-msgs { display: flex; flex-direction: column; gap: 6px; }
body:not(.page-chats) .dbx-thread-mod-op { display: flex; gap: 6px; padding: 10px 0 0; border-top: 1px solid var(--th-divider); }
body:not(.page-chats) .dbx-bubble { padding: 10px 14px; border-radius: 10px; background: var(--th-surface-2); border: 1px solid var(--th-border); margin-bottom: 6px; }
body:not(.page-chats) .dbx-bubble--user { background: rgba(34,197,94,0.08); border-color: rgba(34,197,94,0.20); }
body:not(.page-chats) .dbx-bubble--ai, body:not(.page-chats) .dbx-bubble--assistant { background: var(--th-surface-2); }
body:not(.page-chats) .dbx-bubble-meta { font-size: 10.5px; color: var(--th-muted); margin-bottom: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
body:not(.page-chats) .dbx-bubble-text { font-size: 13px; color: var(--th-text); white-space: pre-wrap; word-break: break-word; line-height: 1.5; }
body:not(.page-chats) .dbx-search-modal .dbx-modal-card { max-height: 600px; }
body:not(.page-chats) .dbx-search-input {
  background: var(--th-surface-2) !important; border: none !important;
  border-bottom: 1px solid var(--th-divider) !important;
  color: var(--th-text) !important; padding: 14px 18px !important;
  font-size: 15px !important; font-family: inherit !important; outline: none !important; width: 100%;
}
body:not(.page-chats) .dbx-search-head { padding: 14px 16px 0; }
body:not(.page-chats) .dbx-search-hint { font-size: 11.5px; color: var(--th-muted); padding: 8px 16px; }
body:not(.page-chats) .dbx-search-results { display: flex; flex-direction: column; gap: 14px; padding: 8px 16px 16px; max-height: 400px; overflow-y: auto; }
body:not(.page-chats) .dbx-search-group { display: flex; flex-direction: column; gap: 4px; }
body:not(.page-chats) .dbx-search-group-title { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--th-muted); padding: 4px 0; }
body:not(.page-chats) .dbx-search-item { padding: 10px 12px; background: var(--th-surface-2); border-radius: 8px; cursor: pointer; }
body:not(.page-chats) .dbx-search-item:hover { background: var(--th-surface-3); }
body:not(.page-chats) .dbx-search-snippet { font-size: 12px; color: var(--th-text); margin-top: 3px; }
body:not(.page-chats) .dbx-search-card { padding: 12px 14px; background: var(--th-surface-2); border: 1px solid var(--th-border); border-radius: 12px; display: flex; flex-direction: column; gap: 8px; }


/* ════════════════════════════════════════════════════════════════════════
   ANALYTICS V3 — chart cards, heatmap, legend
   ════════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .anx-charts-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}
@media (max-width: 1100px) {
  body:not(.page-chats) .anx-charts-row { grid-template-columns: 1fr; }
}

body:not(.page-chats) .anx-chart-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px 20px !important;
}
body:not(.page-chats) .anx-chart-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  flex-wrap: wrap;
}
body:not(.page-chats) .anx-chart-sub { margin-left: 6px; font-weight: 500; }
body:not(.page-chats) .anx-chart-wrap {
  position: relative;
  width: 100%;
  height: 240px;
}
body:not(.page-chats) .anx-chart-wrap canvas { width: 100% !important; height: 100% !important; }

body:not(.page-chats) .anx-legend {
  display: inline-flex; align-items: center; gap: 14px;
  font-size: 11.5px; color: var(--th-muted);
}
body:not(.page-chats) .anx-legend-item {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11.5px; color: var(--th-text);
}
body:not(.page-chats) .anx-legend-dot {
  width: 8px; height: 8px;
  border-radius: 2px;
  background: var(--th-accent);
  flex-shrink: 0;
}

/* Activity heatmap */
body:not(.page-chats) .anx-heatmap-card {
  display: flex; flex-direction: column; gap: 10px;
  padding: 18px 20px !important;
}
body:not(.page-chats) .anx-heatmap-wrap {
  width: 100%;
  overflow-x: auto;
}
body:not(.page-chats) .anx-hm-grid {
  display: grid;
  grid-template-columns: 36px repeat(24, minmax(20px, 1fr));
  gap: 2px;
  min-width: 600px;
}
body:not(.page-chats) .anx-hm-corner { height: 16px; }
body:not(.page-chats) .anx-hm-h {
  height: 16px;
  font-size: 9.5px;
  color: var(--th-muted);
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  display: inline-flex; align-items: center; justify-content: center;
}
body:not(.page-chats) .anx-hm-h-tick {
  display: inline-block;
  width: 1px; height: 4px;
  background: var(--th-border);
}
body:not(.page-chats) .anx-hm-d {
  font-size: 10.5px;
  color: var(--th-muted);
  font-weight: 600;
  display: inline-flex; align-items: center; justify-content: flex-end;
  padding-right: 8px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
body:not(.page-chats) .anx-hm-cell {
  height: 22px;
  border-radius: 3px;
  background: var(--th-surface-2);
  cursor: default;
  transition: transform 80ms ease, outline 80ms ease;
}
body:not(.page-chats) .anx-hm-cell:hover {
  outline: 2px solid var(--th-accent);
  outline-offset: 1px;
  transform: scale(1.06);
  z-index: 2;
  position: relative;
}
body:not(.page-chats) .anx-heatmap-meta { padding-top: 4px; border-top: 1px solid var(--th-divider); }


/* ════════════════════════════════════════════════════════════════════════
   ACCOUNTS — compact card system (acard-c-*) used by wa_instance_card macro
   3-column responsive grid, polished, dense, all features icon-only
   ════════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .acard {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 14px 12px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.20);
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
  overflow: hidden;
  isolation: isolate;
}
body:not(.page-chats) .acard:hover {
  border-color: var(--th-border-strong);
  box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}

/* Health-tinted top accent bar (3px) using ::before so it's purely decorative */
body:not(.page-chats) .acard::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--th-border-strong);
  z-index: 1;
}
body:not(.page-chats) .acard--green::before    { background: linear-gradient(90deg, #22c55e, #4ade80); }
body:not(.page-chats) .acard--yellow::before,
body:not(.page-chats) .acard--orange::before   { background: linear-gradient(90deg, #d97706, #fbbf24); }
body:not(.page-chats) .acard--red::before      { background: linear-gradient(90deg, #dc2626, #ef4444); }
body:not(.page-chats) .acard--no-persona       { box-shadow: 0 0 0 1px rgba(251,191,36,0.30), 0 1px 2px rgba(0,0,0,0.20); }

/* ─── Bulk-select checkbox (top-left corner overlay) ─── */
body:not(.page-chats) .acard-c-select {
  position: absolute; top: 10px; left: 10px;
  z-index: 3;
  width: 20px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
body:not(.page-chats) .acard-c-select-cb {
  position: absolute; opacity: 0; pointer-events: none;
  width: 0; height: 0;
}
body:not(.page-chats) .acard-c-select-mark {
  width: 18px; height: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--th-surface-2);
  border: 1.5px solid var(--th-border-strong);
  border-radius: 5px;
  color: transparent;
  transition: background var(--th-dur), border-color var(--th-dur), color var(--th-dur);
}
body:not(.page-chats) .acard-c-select:hover .acard-c-select-mark { border-color: var(--th-accent); }
body:not(.page-chats) .acard-c-select-cb:checked ~ .acard-c-select-mark {
  background: var(--th-accent);
  border-color: var(--th-accent);
  color: #fff;
}
body:not(.page-chats) .acard:has(.acard-c-select-cb:checked) {
  border-color: var(--th-accent);
  box-shadow: 0 0 0 2px var(--th-accent-ring), 0 4px 12px rgba(0,0,0,0.25);
}

/* ─── Header: avatar + name + status pill ─── */
body:not(.page-chats) .acard-c-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
  padding-left: 24px;  /* leaves room for the select checkbox */
  min-width: 0;
}
body:not(.page-chats) .acard-c-avatar-wrap {
  position: relative;
  flex-shrink: 0;
  width: 42px; height: 42px;
}
body:not(.page-chats) .acard-c-avatar,
body:not(.page-chats) .acard-c-avatar-fb {
  width: 42px; height: 42px;
  border-radius: 11px;
  object-fit: cover;
  display: inline-flex;
  align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700;
  color: var(--th-accent-contrast, #fff);
  background: var(--th-accent);
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .acard-c-status-dot {
  position: absolute;
  right: -2px; bottom: -2px;
  width: 12px; height: 12px;
  border-radius: 50%;
  border: 2.5px solid var(--th-surface);
  background: var(--th-muted);
  z-index: 1;
}
body:not(.page-chats) .acard-c-status-dot--green  { background: #22c55e; }
body:not(.page-chats) .acard-c-status-dot--yellow,
body:not(.page-chats) .acard-c-status-dot--orange { background: #fbbf24; }
body:not(.page-chats) .acard-c-status-dot--red    { background: #ef4444; }

body:not(.page-chats) .acard-c-id {
  flex: 1;
  min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
body:not(.page-chats) .acard-c-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin: 0;
  display: inline-flex; align-items: center; gap: 6px;
  letter-spacing: -0.01em;
  cursor: pointer;
  line-height: 1.2;
}
body:not(.page-chats) .js-acard-c-name-text {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-width: 0;
}
body:not(.page-chats) .acard-c-name-edit {
  display: inline-flex;
  width: 18px; height: 18px;
  align-items: center; justify-content: center;
  border-radius: 4px;
  background: transparent;
  border: none;
  color: var(--th-muted);
  cursor: pointer;
  opacity: 0;
  transition: opacity 120ms ease, background var(--th-dur), color var(--th-dur);
}
body:not(.page-chats) .acard:hover .acard-c-name-edit { opacity: 1; }
body:not(.page-chats) .acard-c-name-edit:hover { background: var(--th-surface-2); color: var(--th-accent); }

body:not(.page-chats) .acard-c-meta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11.5px;
  color: var(--th-muted);
  min-width: 0;
}
body:not(.page-chats) .acard-c-meta > svg { flex-shrink: 0; opacity: 0.7; }
body:not(.page-chats) .acard-c-meta-key {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-width: 0;
  font-size: 11px;
}
body:not(.page-chats) .acard-c-meta-sep { opacity: 0.5; }

body:not(.page-chats) .acard-c-status-pill {
  display: inline-flex; align-items: center; gap: 5px;
  flex-shrink: 0;
  padding: 3px 9px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
  font-size: 10.5px; font-weight: 600;
  color: var(--th-muted);
  text-transform: uppercase; letter-spacing: 0.04em;
  white-space: nowrap;
}
body:not(.page-chats) .acard-c-status-pill--ready,
body:not(.page-chats) .acard-c-status-pill--connected,
body:not(.page-chats) .acard-c-status-pill--active {
  background: rgba(34,197,94,0.14); color: #4ade80; border-color: rgba(34,197,94,0.30);
}
body:not(.page-chats) .acard-c-status-pill--sleeping {
  background: rgba(99,102,241,0.14); color: #a5b4fc; border-color: rgba(99,102,241,0.30);
}
body:not(.page-chats) .acard-c-status-pill--busy {
  background: rgba(251,191,36,0.14); color: #fbbf24; border-color: rgba(251,191,36,0.30);
}
body:not(.page-chats) .acard-c-status-pill--paused,
body:not(.page-chats) .acard-c-status-pill--off {
  background: rgba(148,163,184,0.14); color: #94a3b8; border-color: rgba(148,163,184,0.30);
}
body:not(.page-chats) .acard-c-status-pill--offline,
body:not(.page-chats) .acard-c-status-pill--disconnected,
body:not(.page-chats) .acard-c-status-pill--error {
  background: rgba(239,68,68,0.14); color: #f87171; border-color: rgba(239,68,68,0.30);
}
body:not(.page-chats) .acard-c-status-pulse {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
  box-shadow: 0 0 0 0 currentColor;
  animation: acard-c-pulse 2.5s ease-out infinite;
}
@keyframes acard-c-pulse {
  0%   { transform: scale(1); opacity: 1; }
  70%  { transform: scale(2); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

/* ─── Persona + countdown row ─── */
body:not(.page-chats) .acard-c-persona-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
body:not(.page-chats) .acard-c-persona-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px 4px 4px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
  font-size: 12px;
  color: var(--th-text);
  text-decoration: none;
  font-weight: 500;
  transition: background var(--th-dur), border-color var(--th-dur);
  min-width: 0;
}
body:not(.page-chats) .acard-c-persona-chip:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
}
body:not(.page-chats) .acard-c-persona-chip > svg { color: var(--th-muted); flex-shrink: 0; }
body:not(.page-chats) .acard-c-persona-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--th-accent);
  color: var(--th-accent-contrast, #fff);
  font-weight: 700; font-size: 11px;
  flex-shrink: 0;
}
body:not(.page-chats) .acard-c-persona-name {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  max-width: 110px;
}
body:not(.page-chats) .acard-c-persona-chip--missing {
  background: rgba(251,191,36,0.10);
  border-color: rgba(251,191,36,0.30);
  color: #fbbf24;
  font-size: 11.5px;
  padding: 4px 10px;
}
body:not(.page-chats) .acard-c-persona-chip--missing > svg { color: #fbbf24; }

body:not(.page-chats) .acard-c-countdown {
  display: inline-flex; align-items: center; gap: 5px;
  margin-left: auto;
  padding: 3px 9px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 6px;
  font-size: 11px;
  color: var(--th-muted);
}
body:not(.page-chats) .acard-c-countdown > svg { flex-shrink: 0; }
body:not(.page-chats) .acard-c-countdown-val {
  color: var(--th-text-strong);
  font-weight: 700;
}
body:not(.page-chats) .acard-c-countdown-lbl { opacity: 0.6; font-size: 10px; }
body:not(.page-chats) .acard-c-countdown-city { font-size: 10.5px; opacity: 0.7; }
body:not(.page-chats) .acard-c-countdown--good .acard-c-countdown-val { color: #4ade80; }
body:not(.page-chats) .acard-c-countdown--warn .acard-c-countdown-val { color: #fbbf24; }
body:not(.page-chats) .acard-c-countdown--info .acard-c-countdown-val { color: #60a5fa; }

/* ─── KPI tiles ─── */
body:not(.page-chats) .acard-c-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-top: 4px;
}
body:not(.page-chats) .acard-c-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 6px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 8px;
  position: relative;
  text-align: center;
  min-width: 0;
}
body:not(.page-chats) .acard-c-stat > svg {
  color: var(--th-muted);
  margin-bottom: 1px;
}
body:not(.page-chats) .acard-c-stat-num {
  font-size: 16px;
  font-weight: 700;
  color: var(--th-text-strong);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
body:not(.page-chats) .acard-c-stat-lbl {
  font-size: 9.5px;
  font-weight: 600;
  color: var(--th-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
body:not(.page-chats) .acard-c-stat--live .acard-c-stat-num { color: #4ade80; }
body:not(.page-chats) .acard-c-live-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #4ade80;
  margin-bottom: 2px;
  box-shadow: 0 0 0 0 rgba(74,222,128,0.45);
  animation: acard-c-live 1.8s ease-out infinite;
}
@keyframes acard-c-live {
  0%   { transform: scale(1); opacity: 0.55; }
  70%  { transform: scale(2.5); opacity: 0; }
  100% { transform: scale(1); opacity: 0; }
}

/* ─── Sparkline (24h activity) ─── */
body:not(.page-chats) .acard-c-spark {
  width: 100%;
  height: 32px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  padding: 3px 6px;
}
body:not(.page-chats) .acard-c-spark > svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* ─── Action row: icon-only buttons ─── */
body:not(.page-chats) .acard-c-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px solid var(--th-divider);
}
body:not(.page-chats) .acard-c-form {
  display: inline-flex;
  margin: 0;
}
body:not(.page-chats) .acard-c-form--inline-select {
  position: relative;
  flex: 1;
  min-width: 0;
}
body:not(.page-chats) .acard-c-form--inline-select > .acard-c-persona-select {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  opacity: 0;
  cursor: pointer;
}
body:not(.page-chats) .acard-c-form--inline-select > .acard-c-btn {
  width: 100%;
  height: 32px;
  padding: 0 10px;
  font-size: 11.5px;
  font-weight: 500;
  color: var(--th-muted);
  pointer-events: none;
}
body:not(.page-chats) .acard-c-form--inline-select::after {
  content: "▾";
  position: absolute;
  right: 8px; top: 50%; transform: translateY(-50%);
  color: var(--th-muted);
  pointer-events: none;
  font-size: 10px;
}

body:not(.page-chats) .acard-c-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  min-width: 32px; min-height: 32px;
  padding: 0;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 8px;
  color: var(--th-muted);
  cursor: pointer;
  text-decoration: none;
  flex-shrink: 0;
  font-family: inherit;
  transition: background var(--th-dur), color var(--th-dur), border-color var(--th-dur);
}
body:not(.page-chats) .acard-c-btn:hover {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
  border-color: var(--th-border-strong);
}
body:not(.page-chats) .acard-c-btn--accent {
  background: var(--th-accent-dim);
  border-color: var(--th-accent-ring);
  color: var(--th-accent);
}
body:not(.page-chats) .acard-c-btn--accent:hover {
  background: var(--th-accent);
  color: var(--th-accent-contrast, #fff);
  border-color: var(--th-accent);
}
body:not(.page-chats) .acard-c-btn--skip {
  background: rgba(251,191,36,0.14);
  border-color: rgba(251,191,36,0.30);
  color: #fbbf24;
}
body:not(.page-chats) .acard-c-btn--skip:hover {
  background: #fbbf24;
  color: #0a0a0a;
  border-color: #fbbf24;
}
body:not(.page-chats) .acard-c-btn--danger {
  background: rgba(239,68,68,0.10);
  border-color: rgba(239,68,68,0.25);
  color: #f87171;
  margin-left: auto;  /* push delete button to the right */
}
body:not(.page-chats) .acard-c-btn--danger:hover {
  background: rgba(239,68,68,0.22);
  color: #fca5a5;
  border-color: rgba(239,68,68,0.50);
}
body:not(.page-chats) .acard-c-persona-select {
  background: var(--th-surface-2);
  color: var(--th-text);
  border: 1px solid var(--th-border);
}

/* ─── Collapsible details panel (Info button toggle) ─── */
body:not(.page-chats) .acard-c-details {
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid var(--th-divider);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
body:not(.page-chats) .acard-c-details[hidden] { display: none; }
body:not(.page-chats) .acard-c-dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 10px;
  margin: 0;
}
body:not(.page-chats) .acard-c-dl-row {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
body:not(.page-chats) .acard-c-dl-row--full { grid-column: 1 / -1; }
body:not(.page-chats) .acard-c-dl dt {
  font-size: 10px;
  color: var(--th-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}
body:not(.page-chats) .acard-c-dl dd {
  margin: 0;
  font-size: 12px;
  color: var(--th-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:not(.page-chats) .acard-c-inline-form {
  display: flex;
  gap: 6px;
}
body:not(.page-chats) .acard-c-input {
  flex: 1;
  min-width: 0;
  padding: 0 10px;
  height: 32px;
  background: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-family: inherit !important;
  outline: none !important;
}
body:not(.page-chats) .acard-c-input:focus {
  border-color: var(--th-accent) !important;
  box-shadow: 0 0 0 3px var(--th-accent-ring) !important;
}

body:not(.page-chats) .acard-c-bio {
  margin: 4px 0 0;
  padding: 8px 10px;
  background: var(--th-surface-2);
  border-radius: 6px;
  font-size: 11.5px;
  color: var(--th-muted);
  line-height: 1.4;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
body:not(.page-chats) .acard-c-bio > svg { flex-shrink: 0; margin-top: 2px; opacity: 0.7; }

/* ─── Footer (errors, hints) ─── */
body:not(.page-chats) .acard-c-foot {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 -16px -14px;
  padding: 8px 16px;
  font-size: 11.5px;
  font-weight: 500;
  border-top: 1px solid var(--th-divider);
}
body:not(.page-chats) .acard-c-foot > svg { flex-shrink: 0; }
body:not(.page-chats) .acard-c-foot--err {
  background: rgba(239,68,68,0.08);
  color: #f87171;
  border-top-color: rgba(239,68,68,0.20);
}
body:not(.page-chats) .acard-c-foot--warn {
  background: rgba(251,191,36,0.08);
  color: #fbbf24;
  border-top-color: rgba(251,191,36,0.25);
}

/* Responsive: 1-up on small screens */
@media (max-width: 640px) {
  body:not(.page-chats) .acard-c-stats { grid-template-columns: 1fr 1fr 1fr; }
  body:not(.page-chats) .acard-c-actions { gap: 4px; }
  body:not(.page-chats) .acard-c-btn { width: 30px; height: 30px; min-width: 30px; min-height: 30px; }
}


/* ════════════════════════════════════════════════════════════════════════
   ACCOUNTS — Connect-new modal overlay (acct3-modal)
   ════════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .acct3-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  pointer-events: auto;
}
body:not(.page-chats) .acct3-modal[hidden] { display: none !important; }
body:not(.page-chats) .acct3-modal-bg {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(4px);
  cursor: pointer;
}
body:not(.page-chats) .acct3-modal-card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 460px;
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  padding: 22px 24px;
  background: var(--th-surface);
  border: 1px solid var(--th-border-strong);
  border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.50), 0 0 0 1px var(--th-border-strong);
  animation: acct3-modal-in 200ms cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes acct3-modal-in {
  from { opacity: 0; transform: translateY(12px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
body:not(.page-chats) .acct3-modal-close {
  position: absolute;
  top: 12px; right: 12px;
  width: 30px; height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 8px;
  color: var(--th-muted);
  cursor: pointer;
  z-index: 2;
  font-family: inherit;
  transition: background var(--th-dur), color var(--th-dur);
}
body:not(.page-chats) .acct3-modal-close:hover {
  background: var(--th-surface-3);
  color: var(--th-text-strong);
}
body:not(.page-chats) .acct3-step { display: flex; flex-direction: column; gap: 16px; }
body:not(.page-chats) .acct3-step[hidden] { display: none !important; }
body:not(.page-chats) .acct3-step-head {
  display: flex;
  gap: 12px;
  align-items: center;
  padding-right: 32px;  /* space for close button */
}
body:not(.page-chats) .acct3-step-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: 10px;
  background: var(--th-accent-dim);
  color: var(--th-accent);
  flex-shrink: 0;
  border: 1px solid var(--th-accent-ring);
}
body:not(.page-chats) .acct3-step-head-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
body:not(.page-chats) .acct3-modal-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin: 0;
  letter-spacing: -0.01em;
}
body:not(.page-chats) .acct3-modal-sub {
  font-size: 12px;
  color: var(--th-muted);
  margin: 0;
}

body:not(.page-chats) .acct3-modal-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* ─── Field group inside modal ─── */
body:not(.page-chats) .acct3-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
body:not(.page-chats) .acct3-field[hidden] { display: none !important; }
body:not(.page-chats) .acct3-field-label {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--th-text);
  letter-spacing: -0.005em;
}
body:not(.page-chats) .acct3-field-hint {
  font-size: 11px;
  color: var(--th-muted);
  line-height: 1.4;
}
body:not(.page-chats) .acct3-field-hint code {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 10.5px;
  padding: 0 4px;
  background: var(--th-surface-2);
  border-radius: 3px;
  color: var(--th-text);
}
body:not(.page-chats) .acct3-input {
  width: 100%;
  height: 36px;
  padding: 0 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text);
  border-radius: 8px;
  font-size: 13px;
  font-family: inherit;
  outline: none;
  transition: border-color var(--th-dur), box-shadow var(--th-dur);
}
body:not(.page-chats) .acct3-input.mono {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 12.5px;
}
body:not(.page-chats) .acct3-input:focus {
  border-color: var(--th-accent);
  box-shadow: 0 0 0 3px var(--th-accent-ring);
  background: var(--th-surface);
}

/* ─── Method picker (QR / Pairing code) ─── */
body:not(.page-chats) .acct3-method-group {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  background: transparent !important;
  border: none !important;
  padding: 0;
}
body:not(.page-chats) .acct3-method {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  color: var(--th-text);
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition: border-color var(--th-dur), background var(--th-dur);
}
body:not(.page-chats) .acct3-method:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
}
body:not(.page-chats) .acct3-method.is-active {
  background: var(--th-accent-dim);
  border-color: var(--th-accent);
  box-shadow: 0 0 0 1px var(--th-accent);
}
body:not(.page-chats) .acct3-method-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border-radius: 7px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  color: var(--th-muted);
  flex-shrink: 0;
}
body:not(.page-chats) .acct3-method.is-active .acct3-method-ic {
  background: var(--th-accent);
  border-color: var(--th-accent);
  color: var(--th-accent-contrast, #fff);
}
body:not(.page-chats) .acct3-method-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
body:not(.page-chats) .acct3-method-text strong {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--th-text-strong);
  line-height: 1.2;
}
body:not(.page-chats) .acct3-method-text span {
  font-size: 11px;
  color: var(--th-muted);
  line-height: 1.3;
}

/* ─── Modal action row (Cancel + Generate) ─── */
body:not(.page-chats) .acct3-modal-actions {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}
body:not(.page-chats) .acct3-modal-actions--split {
  justify-content: space-between;
}
body:not(.page-chats) .acct3-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text);
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background var(--th-dur), border-color var(--th-dur), color var(--th-dur);
}
body:not(.page-chats) .acct3-btn:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
  color: var(--th-text-strong);
}
body:not(.page-chats) .acct3-btn--ghost {
  background: transparent;
  color: var(--th-muted);
}
body:not(.page-chats) .acct3-btn--ghost:hover {
  background: var(--th-surface-2);
  color: var(--th-text);
  border-color: var(--th-border);
}
body:not(.page-chats) .acct3-btn--primary,
body:not(.page-chats) .acct3-cta,
body:not(.page-chats) .acct3-cta--lg {
  background: var(--th-accent);
  border-color: var(--th-accent);
  color: var(--th-accent-contrast, #fff);
  font-weight: 600;
}
body:not(.page-chats) .acct3-btn--primary:hover,
body:not(.page-chats) .acct3-cta:hover,
body:not(.page-chats) .acct3-cta--lg:hover {
  background: var(--th-accent-hi);
  border-color: var(--th-accent-hi);
  color: var(--th-accent-contrast, #fff);
}
body:not(.page-chats) .acct3-btn--primary:disabled,
body:not(.page-chats) .acct3-cta:disabled {
  opacity: 0.55; cursor: not-allowed;
}
body:not(.page-chats) .acct3-btn--lg,
body:not(.page-chats) .acct3-cta--lg {
  height: 38px; padding: 0 20px; font-size: 13px;
}
body:not(.page-chats) .acct3-btn.is-loading .acct3-go-spin {
  animation: acct3-spin 700ms linear infinite;
}
@keyframes acct3-spin { to { transform: rotate(360deg); } }

body:not(.page-chats) .acct3-error {
  margin: 0;
  padding: 10px 12px;
  background: rgba(239, 68, 68, 0.10);
  border: 1px solid rgba(239, 68, 68, 0.25);
  border-radius: 8px;
  color: #f87171;
  font-size: 12px;
  line-height: 1.4;
}
body:not(.page-chats) .acct3-error[hidden] { display: none !important; }

/* ─── Result step (QR display, pairing code display) ─── */
body:not(.page-chats) .acct3-result {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
}
body:not(.page-chats) .acct3-pair {
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: var(--th-text-strong);
  padding: 12px 20px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 8px;
}
body:not(.page-chats) .acct3-pair-hint {
  font-size: 11.5px;
  color: var(--th-muted);
  text-align: center;
  margin: 0;
  line-height: 1.4;
}

/* ─── Onboarding banner (shown when Evolution not configured) ─── */
body:not(.page-chats) .acct3-onboard {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: rgba(251, 191, 36, 0.08);
  border: 1px solid rgba(251, 191, 36, 0.25);
  border-radius: 10px;
}
body:not(.page-chats) .acct3-onboard-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  background: rgba(251, 191, 36, 0.18);
  color: #fbbf24;
  border-radius: 10px;
  flex-shrink: 0;
}
body:not(.page-chats) .acct3-onboard-text h2 {
  font-size: 14px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin: 0 0 2px;
}
body:not(.page-chats) .acct3-onboard-text p {
  font-size: 12px;
  color: var(--th-muted);
  margin: 0;
}

/* ─── Empty state (no accounts yet) ─── */
body:not(.page-chats) .acct3-empty {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 48px 24px;
  background: var(--th-surface);
  border: 1px dashed var(--th-border-strong);
  border-radius: 12px;
  text-align: center;
}
body:not(.page-chats) .acct3-empty-mark {
  width: 56px; height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--th-accent-dim);
  color: var(--th-accent);
  border-radius: 14px;
}
body:not(.page-chats) .acct3-empty-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--th-text-strong);
  margin: 0;
}
body:not(.page-chats) .acct3-empty-sub {
  font-size: 12.5px;
  color: var(--th-muted);
  margin: 0;
}

/* ─── Server settings collapsible ─── */
body:not(.page-chats) .acct3-settings {
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 12px;
}
body:not(.page-chats) .acct3-settings-sum {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  font-weight: 600;
  color: var(--th-text-strong);
}
body:not(.page-chats) .acct3-settings-sum::-webkit-details-marker { display: none; }
body:not(.page-chats) .acct3-settings-sum-l {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
body:not(.page-chats) .acct3-settings-sum-r {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--th-muted);
}
body:not(.page-chats) .acct3-settings-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 10px;
  background: rgba(34, 197, 94, 0.14);
  border: 1px solid rgba(34, 197, 94, 0.30);
  color: #4ade80;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
body:not(.page-chats) .acct3-settings-pill-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #4ade80;
}
body:not(.page-chats) .acct3-settings-chev {
  transition: transform var(--th-dur);
}
body:not(.page-chats) .acct3-settings[open] .acct3-settings-chev {
  transform: rotate(180deg);
}
body:not(.page-chats) .acct3-settings-form {
  padding: 0 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-top: 1px solid var(--th-divider);
  padding-top: 16px;
}
body:not(.page-chats) .acct3-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}
body:not(.page-chats) .acct3-settings-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 6px;
  border-top: 1px solid var(--th-divider);
}

/* ─── Checkbox (modal setting toggles) ─── */
body:not(.page-chats) .acct3-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 12px;
  color: var(--th-text);
  user-select: none;
}
body:not(.page-chats) .acct3-check input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
body:not(.page-chats) .acct3-check-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px; height: 18px;
  border: 1.5px solid var(--th-border-strong);
  border-radius: 5px;
  background: var(--th-surface-2);
  color: transparent;
  transition: background var(--th-dur), border-color var(--th-dur), color var(--th-dur);
}
body:not(.page-chats) .acct3-check input:checked ~ .acct3-check-mark {
  background: var(--th-accent);
  border-color: var(--th-accent);
  color: #fff;
}
body:not(.page-chats) .acct3-check-label { font-size: 12px; color: var(--th-text); }


/* ════════════════════════════════════════════════════════════════════════
   ACCOUNTS — main 2-col layout + sticky personas sidebar
   ════════════════════════════════════════════════════════════════════════ */

body:not(.page-chats) .afx-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: start;
}
@media (max-width: 1100px) {
  body:not(.page-chats) .afx-main-grid {
    grid-template-columns: 1fr;
  }
  body:not(.page-chats) .acct3-personas-strip--sticky {
    position: static !important;
    order: -1;  /* show personas above accounts on small screens */
  }
}

body:not(.page-chats) .acct3-personas-strip--sticky {
  position: sticky;
  top: 18px;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  background: var(--th-surface);
  border: 1px solid var(--th-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.20);
  max-height: calc(100vh - 36px);
  overflow-y: auto;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--th-divider);
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-text {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border-radius: 8px;
  background: var(--th-accent-dim);
  color: var(--th-accent);
  border: 1px solid var(--th-accent-ring);
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--th-text-strong);
  letter-spacing: -0.005em;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-count {
  font-size: 11px;
  font-weight: 600;
  color: var(--th-muted);
  padding: 1px 7px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 999px;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-item {
  display: block;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  text-decoration: none;
  color: var(--th-text);
  cursor: pointer;
  transition: background var(--th-dur), border-color var(--th-dur);
  min-width: 0;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-link:hover {
  background: var(--th-surface-3);
  border-color: var(--th-border-strong);
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 11px;
  background: var(--th-accent);
  color: var(--th-accent-contrast, #fff);
  font-size: 15px;
  font-weight: 700;
  border: 1px solid var(--th-border);
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-name {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--th-text-strong);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  background: rgba(34, 197, 94, 0.14);
  color: #4ade80;
  border: 1px solid rgba(34, 197, 94, 0.30);
  border-radius: 4px;
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-slug {
  font-size: 11px;
  color: var(--th-muted);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: transparent;
  color: var(--th-muted);
  flex-shrink: 0;
  transition: background var(--th-dur), color var(--th-dur);
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-link:hover .acct3-personas-strip-edit {
  background: var(--th-accent-dim);
  color: var(--th-accent);
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 24px 12px;
  text-align: center;
}
body:not(.page-chats) .acct3-personas-strip--sticky .acct3-personas-strip-empty p {
  margin: 0;
  font-size: 12px;
  color: var(--th-muted);
}

/* #sidenav utility row — id specificity beats stray global button/flex rules */
#sidenav .sidenav-utility-row {
  display: flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  box-sizing: border-box;
  gap: 6px;
  margin: 0;
  padding: 0;
}
#sidenav .sidenav-utility-row > .sidenav-ut-slot {
  flex: 1 1 auto;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  display: flex;
  align-items: center;
  position: relative;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  overflow: visible;
}
#sidenav .sidenav-utility-row > .sidenav-ut-slot > .sidenav-tz {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: 34px;
  margin: 0;
  padding: 0;
  position: relative;
  box-sizing: border-box;
}
#sidenav .sidenav-utility-row > .sidenav-ut-slot .sidenav-utility-btn {
  display: flex !important;
  align-items: center;
  box-sizing: border-box !important;
  width: 100%;
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  margin: 0;
  padding: 0 10px;
}
/* Popover must never participate in #sidenav layout */
#sidenav .sidenav-ut-slot .sidenav-tz-pop,
#sidenav .sidenav-ut-slot .js-pop-panel {
  position: absolute !important;
  left: 0;
  right: auto;
  top: auto;
  bottom: calc(100% + 8px) !important;
  display: none !important;
  margin: 0 !important;
}
#sidenav [data-pop].is-open .sidenav-tz-pop,
#sidenav [data-pop].is-open .js-pop-panel {
  display: block !important;
}
#sidenav .sidenav-utility-row > .sidenav-utility-icon,
#sidenav .sidenav-utility-row > button#sidenav-theme,
#sidenav .sidenav-utility-row > a.sidenav-utility-icon {
  display: flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box !important;
  flex: 0 0 34px;
  width: 34px !important;
  min-width: 34px;
  max-width: 34px;
  height: 34px !important;
  min-height: 34px;
  max-height: 34px;
  margin: 0 !important;
  padding: 0 !important;
  align-self: center;
}
#sidenav .sidenav-utility-icon > svg,
#sidenav .sidenav-utility-btn > svg {
  display: block;
  margin: 0;
  vertical-align: middle;
}
html.sidenav-is-collapsed #sidenav .sidenav-utility-row {
  flex-direction: column !important;
  height: auto;
  min-height: 0;
  max-height: none;
  align-items: center;
  gap: 6px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   GLOBAL PERFORMANCE OVERRIDES (apply to ALL themes, ALL providers, ALL pages)
   These eliminate the most expensive paint/composite operations across the
   dashboard. Scoped to non-chat pages so the WA/TG chat clones still look
   exactly the same.
═══════════════════════════════════════════════════════════════════════════ */

/* 1. Kill backdrop-filter EVERYWHERE in the dashboard.
      It's the single most expensive CSS effect (forces GPU re-composite of
      every layer underneath on every paint). Already disabled in light mode;
      now removing in dark mode too — `--th-surface` is opaque so blurs add
      zero visual value, only cost. The 61 backdrop-filter rules across CSS
      files are now no-ops on /dashboard pages. */
body:not(.page-chats):not(.page-telegram-chats) *,
body:not(.page-chats):not(.page-telegram-chats) *::before,
body:not(.page-chats):not(.page-telegram-chats) *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 2. Pause all CSS animations when the tab is hidden.
      Saves CPU on background tabs (~20+ keyframe animations across the site). */
@media (prefers-reduced-motion: no-preference) {
  body:not(.page-chats):not(.page-telegram-chats):where(:not(:focus-within)) *:not(:hover) {
    /* no-op selector — kept for spec parsing */
  }
}
/* When document is hidden via PageVisibility API, pause via JS (see app_shell.html). */
html.is-tab-hidden body * {
  animation-play-state: paused !important;
  transition: none !important;
}

/* 3. Replace `transition: all` with explicit properties wherever the engine
      hits this rule. `all` makes the browser observe and possibly transition
      every animatable property — costly on large hover trees. The spec rules
      below convert `all` keywords to neutral defaults that browsers optimize. */
body:not(.page-chats):not(.page-telegram-chats) [class*="-row"],
body:not(.page-chats):not(.page-telegram-chats) [class*="-card"],
body:not(.page-chats):not(.page-telegram-chats) [class*="-chip"],
body:not(.page-chats):not(.page-telegram-chats) [class*="-pill"],
body:not(.page-chats):not(.page-telegram-chats) [class*="-btn"],
body:not(.page-chats):not(.page-telegram-chats) [class*="-tab"] {
  transition-property: background-color, border-color, color, box-shadow, transform, opacity;
}

/* 4. CSS containment on big repeating lists — tells the browser these
      subtrees can't affect anything outside their box, so layout/paint
      gets isolated. Massive win when scrolling lists with 100+ items.
      `content-visibility: auto` makes off-screen items skip rendering entirely. */
body:not(.page-chats):not(.page-telegram-chats) .acard,
body:not(.page-chats):not(.page-telegram-chats) .amini,
body:not(.page-chats):not(.page-telegram-chats) .dbx-thread-row,
body:not(.page-chats):not(.page-telegram-chats) .wa-chat,
body:not(.page-chats):not(.page-telegram-chats) .tr-msg,
body:not(.page-chats):not(.page-telegram-chats) .acct-card,
body:not(.page-chats):not(.page-telegram-chats) .nd-row,
body:not(.page-chats):not(.page-telegram-chats) .ov4-card,
body:not(.page-chats):not(.page-telegram-chats) .lgx-row {
  contain: layout style;
}

/* 5. Off-screen rendering skip on big scroll containers. */
body:not(.page-chats):not(.page-telegram-chats) .afx-cards-col,
body:not(.page-chats):not(.page-telegram-chats) #dbx-thread-grid,
body:not(.page-chats):not(.page-telegram-chats) #wa-chats-list,
body:not(.page-chats):not(.page-telegram-chats) #tg-chats-list,
body:not(.page-chats):not(.page-telegram-chats) .lgx-list,
body:not(.page-chats):not(.page-telegram-chats) .nd-grid {
  contain: layout;
}

body:not(.page-chats):not(.page-telegram-chats) .acard,
body:not(.page-chats):not(.page-telegram-chats) .amini,
body:not(.page-chats):not(.page-telegram-chats) .dbx-thread-row,
body:not(.page-chats):not(.page-telegram-chats) .ov4-card {
  content-visibility: auto;
  contain-intrinsic-size: auto 320px;
}

/* 6. Reduce dark-mode shadow weight too. Was rgba(0,0,0,0.55) on lg shadows
      — even on dark backgrounds that's expensive blur radius math. Cut to
      ~half intensity, same visual feel. */
:root[data-theme="dark"] body:not(.page-chats):not(.page-telegram-chats) {
  --th-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.20);
  --th-shadow:    0 4px 14px rgba(0, 0, 0, 0.22), 0 1px 2px rgba(0, 0, 0, 0.24);
  --th-shadow-lg: 0 12px 36px rgba(0, 0, 0, 0.32), 0 2px 6px rgba(0, 0, 0, 0.24);
}

/* 7. Reduce expensive transform animations on hover. Cards previously did
      `transform: translateY(-2px)` on every hover — repaints + relayouts. */
body:not(.page-chats):not(.page-telegram-chats) .acard:hover,
body:not(.page-chats):not(.page-telegram-chats) .amini:hover,
body:not(.page-chats):not(.page-telegram-chats) .ov4-card:hover {
  transform: none;
}

/* ── Fix: inputs inside styled label-wrappers get ghost borders from global rule ──
   Any <label> that is itself visually styled as an input container (search bars, etc.)
   must strip the border/background from the raw <input> inside it, so only ONE box
   is visible. Covers alx-search (Alerts), tr-toolbar-search (Training), and any
   future label-as-container pattern. */
body:not(.page-chats) label.alx-search > input,
body:not(.page-chats) label.alx-search > input[type="search"],
body:not(.page-chats) label.tr-toolbar-search > input,
body:not(.page-chats) label.tr-toolbar-search > input[type="search"],
body:not(.page-chats) label.has-search-ic > input,
body:not(.page-chats) label.has-search-ic > input[type="search"] {
  width: auto !important;
  flex: 1 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  min-height: 0 !important;
  height: auto !important;
  font-size: inherit !important;
  color: var(--th-text) !important;
}
body:not(.page-chats) label.alx-search > input:focus,
body:not(.page-chats) label.tr-toolbar-search > input:focus,
body:not(.page-chats) label.has-search-ic > input:focus {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* END OF THEME */

/* ── Account card proxy chip (global — used on overview + accounts pages) ── */
.amini-proxy-row {
  padding: 0 14px 10px;
  position: relative;
}
.amini-proxy-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 9px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 500;
  background: var(--th-surface-2, rgba(255,255,255,.05));
  border: 1px solid var(--th-border, rgba(255,255,255,.1));
  color: var(--th-muted);
  cursor: pointer;
  font-family: inherit;
  transition: background 120ms, border-color 120ms;
  max-width: 100%;
}
.amini-proxy-chip:hover {
  background: var(--th-ghost, rgba(255,255,255,.08));
  color: var(--th-text);
  border-color: var(--th-accent);
}
.amini-proxy-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 130px;
}
.amini-proxy-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.amini-proxy-dot--ok  { background: #22c55e; }
.amini-proxy-dot--bad { background: #f87171; }
.amini-proxy-pop {
  position: absolute;
  bottom: calc(100% - 6px);
  left: 14px;
  right: 14px;
  z-index: 30;
  background: var(--th-surface, #1e2433);
  border: 1px solid var(--th-border);
  border-radius: 10px;
  padding: 10px 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.amini-proxy-pop[hidden] { display: none !important; }
.amini-proxy-pop-label {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--th-muted);
}
.amini-proxy-pop-select {
  all: unset;
  display: block;
  width: 100%;
  box-sizing: border-box;
  font-size: 12.5px;
  padding: 5px 9px;
  border-radius: 7px;
  background: var(--th-surface-2);
  border: 1px solid var(--th-border);
  color: var(--th-text);
  cursor: pointer;
  font-family: inherit;
}
.amini-proxy-pop-select:focus { border-color: var(--th-accent); }
.amini-proxy-pop-actions { display: flex; gap: 6px; }
.amini-proxy-pop-save {
  flex: 1; padding: 5px 0; border-radius: 7px;
  font-size: 12px; font-weight: 600;
  background: var(--th-accent-dim, rgba(129,140,248,.12));
  border: 1px solid var(--th-accent-ring, rgba(129,140,248,.25));
  color: var(--th-accent); cursor: pointer; font-family: inherit;
  transition: opacity 120ms;
}
.amini-proxy-pop-save:hover { opacity: .82; }
.amini-proxy-pop-cancel {
  padding: 5px 10px; border-radius: 7px;
  font-size: 12px; font-weight: 500;
  background: transparent; border: 1px solid var(--th-border);
  color: var(--th-muted); cursor: pointer; font-family: inherit;
  transition: background 120ms;
}
.amini-proxy-pop-cancel:hover { background: var(--th-ghost); color: var(--th-text); }

/* ── Sidebar admin panel button — accent-tinted background, matches nav style ─ */
.sidenav-admin-btn {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 11px;
  border-radius: 9px;
  /* Persistent subtle accent background — stands out from plain nav links */
  background: color-mix(in srgb, var(--sn-accent) 9%, transparent);
  border: 1px solid color-mix(in srgb, var(--sn-accent) 18%, transparent);
  color: var(--sn-fg);
  text-decoration: none;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.005em;
  white-space: nowrap;
  overflow: hidden;
  min-width: 0;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.sidenav-admin-btn:hover {
  background: color-mix(in srgb, var(--sn-accent) 16%, transparent);
  border-color: color-mix(in srgb, var(--sn-accent) 35%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--sn-accent) 10%, transparent);
}
/* Accent left-bar — always visible */
.sidenav-admin-btn::before {
  content: '';
  position: absolute;
  left: -8px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--sn-accent);
  box-shadow: 0 0 12px var(--sn-accent-glow);
}
.sidenav-admin-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--sn-accent) 22%, transparent);
  color: var(--sn-accent);
  border: 1px solid color-mix(in srgb, var(--sn-accent) 30%, transparent);
}
.sidenav-admin-icon svg { display: block; }
.sidenav-admin-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.sidenav-admin-arrow {
  flex-shrink: 0;
  color: var(--sn-accent);
  opacity: 0.6;
  transition: transform 140ms, opacity 140ms;
}
.sidenav-admin-btn:hover .sidenav-admin-arrow { transform: translateX(2px); opacity: 1; }

/* Collapsed sidebar — icon-only */
html.sidenav-is-collapsed .sidenav-admin-btn {
  padding: 8px 0;
  justify-content: center;
  border-color: transparent;
  background: transparent;
}
html.sidenav-is-collapsed .sidenav-admin-btn:hover {
  background: color-mix(in srgb, var(--sn-accent) 12%, transparent);
}
html.sidenav-is-collapsed .sidenav-admin-text,
html.sidenav-is-collapsed .sidenav-admin-arrow { display: none; }
html.sidenav-is-collapsed .sidenav-admin-icon { width: 28px; height: 28px; border-radius: 8px; }