/* GENERATED by tools/build_glass.py from static/src/glass.src.css, do not edit */
/* =====================================================================
   Aurora Glass — design system layer (loads last, owns the whole look)
   Tokens first, then shell, surfaces, controls, data, motion.
   Dark is the default; html[data-theme="light"] swaps the tokens.
   White-label: change --brand-h (0-360) to re-tint the entire product.
   ===================================================================== */
:root,body.modern-crm,body.login-body{
  --brand-h:224;
  --brand-s:92%;
  --brand:hsl(var(--brand-h) var(--brand-s) 68%);
  --brand-2:hsl(calc(var(--brand-h) + 18) 78% 58%);
  --brand-3:hsl(calc(var(--brand-h) - 10) 92% 54%);
  --grad:linear-gradient(135deg,var(--brand-2),var(--brand) 55%,var(--brand-3));
  --grad-soft:linear-gradient(135deg,hsl(calc(var(--brand-h) + 18) 80% 60% /.14),hsl(calc(var(--brand-h) - 10) 90% 56% /.10));

  --bg:#070a18;
  --bg-2:#0c1226;
  --ink:#eef2ff;
  --ink-soft:#c3cdee;
  --muted:#8b97bf;
  --line:rgba(255,255,255,.085);
  --line-strong:rgba(255,255,255,.16);

  --glass:rgba(255,255,255,.055);
  --glass-strong:rgba(18,24,48,.72);
  --glass-hi:rgba(255,255,255,.10);
  --glass-border:rgba(255,255,255,.13);
  --glass-edge:rgba(255,255,255,.28);
  --field:rgba(6,9,22,.45);
  --field-hover:rgba(6,9,22,.6);
  --pop:#10172f;

  --good:#34d399; --good-bg:rgba(52,211,153,.13);
  --danger:#fb7185; --danger-bg:rgba(251,113,133,.13);
  --amber:#fbbf24; --amber-bg:rgba(251,191,36,.13);
  --info:#60a5fa; --info-bg:rgba(96,165,250,.13);

  --accent:var(--brand); --accent2:hsl(var(--brand-h) 95% 76%);
  --g1:hsl(calc(var(--brand-h) - 48) 95% 62%); --g2:var(--brand); --g3:hsl(calc(var(--brand-h) + 78) 90% 62%);

  --shadow:0 10px 30px rgba(2,4,16,.38),0 2px 6px rgba(2,4,16,.3);
  --shadow-lg:0 30px 80px rgba(2,4,16,.55),0 6px 20px rgba(2,4,16,.35);
  --glow:0 0 0 1px hsl(var(--brand-h) 90% 70% /.35),0 10px 34px hsl(var(--brand-h) 90% 60% /.38);
  --radius:20px; --radius-sm:13px;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:light;
}
:root,body.modern-crm,body.login-body{
  --bg:#ffffff; --bg-2:#f5f6fb;
  --ink:#141a33; --ink-soft:#3b4468; --muted:#6a7399;
  --line:rgba(24,32,70,.09); --line-strong:rgba(24,32,70,.16);
  --glass:#ffffff; --glass-strong:#ffffff;
  --glass-hi:#ffffff; --glass-border:rgba(30,40,90,.10); --glass-edge:rgba(255,255,255,0);
  --field:#f6f7fc; --field-hover:#fff; --pop:#fff;
  --good:#0f9d6e; --good-bg:rgba(15,157,110,.12);
  --danger:#dc3a56; --danger-bg:rgba(220,58,86,.1);
  --amber:#b7740f; --amber-bg:rgba(183,116,15,.12);
  --info:#2563eb; --info-bg:rgba(37,99,235,.1);
  --brand:hsl(var(--brand-h) 82% 56%);
  --accent2:hsl(var(--brand-h) 82% 46%);
  --shadow:0 10px 30px rgba(50,60,130,.12),0 2px 6px rgba(50,60,130,.07);
  --shadow-lg:0 30px 70px rgba(50,60,130,.2),0 6px 18px rgba(50,60,130,.1);
  --glow:0 0 0 1px hsl(var(--brand-h) 80% 60% /.3),0 10px 30px hsl(var(--brand-h) 85% 60% /.3);
  color-scheme:light;
}

/* ---------- base ---------- */
html{background:var(--bg)}
body,body.modern-crm,body.login-body{
  color:var(--ink); background:var(--bg); font-family:"Inter",ui-sans-serif,system-ui,sans-serif;
  font-feature-settings:"cv11","ss01"; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:"Outfit","Inter",sans-serif; letter-spacing:-.01em; color:var(--ink)}
a{color:var(--accent2)}
::selection{background:hsl(var(--brand-h) 90% 60% /.45); color:#fff}
.muted,small{color:var(--muted)}
hr{border:0; border-top:1px solid var(--line)}
*{scrollbar-width:thin; scrollbar-color:var(--line-strong) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:9px;border:2px solid transparent;background-clip:padding-box}

/* aurora backdrop (fixed, behind everything) */
.aurora{position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none}
.aurora i{position:absolute; border-radius:50%; filter:blur(110px); opacity:.30; will-change:transform}
.aurora i:nth-child(1){width:60vmax;height:60vmax;left:-18vmax;top:-22vmax;background:hsl(var(--brand-h) 90% 55%);animation:drift1 26s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:50vmax;height:50vmax;right:-16vmax;top:-10vmax;background:hsl(calc(var(--brand-h) + 78) 90% 52%);opacity:.18;animation:drift2 32s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:46vmax;height:46vmax;left:30vw;bottom:-26vmax;background:hsl(calc(var(--brand-h) - 48) 95% 55%);opacity:.16;animation:drift3 38s ease-in-out infinite alternate}
.aurora:after{content:"";position:absolute;inset:0;background:
  radial-gradient(circle at 1px 1px,rgba(255,255,255,.07) 1px,transparent 0) 0 0/26px 26px;
  mask-image:radial-gradient(ellipse at 50% 0%,#000 0%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 0%,transparent 75%)}
.aurora i{opacity:.4}
.aurora:after{background:radial-gradient(circle at 1px 1px,rgba(30,40,100,.08) 1px,transparent 0) 0 0/26px 26px}
@keyframes drift1{to{transform:translate(9vmax,7vmax) scale(1.12)}}
@keyframes drift2{to{transform:translate(-8vmax,10vmax) scale(.92)}}
@keyframes drift3{to{transform:translate(-10vmax,-6vmax) scale(1.15)}}

body:not(#x) .app-frame{position:relative; z-index:1; padding:14px}
body:not(#x) .app-shell{display:flex; gap:14px; height:calc(100vh - 28px);
  background:transparent!important; border:0!important; box-shadow:none!important; border-radius:0!important; overflow:visible;}
body:not(#x) body.login-body .app-frame{padding:0}
body:not(#x) body.login-body .app-shell{height:auto; min-height:100vh}
body:not(#x) .sidebar{width:262px; border-radius:var(--radius); padding:18px 12px 14px;
  background:linear-gradient(180deg,var(--glass-hi),var(--glass))!important;
  backdrop-filter:blur(26px) saturate(150%); -webkit-backdrop-filter:blur(26px) saturate(150%);
  border:1px solid var(--glass-border)!important; box-shadow:var(--shadow), inset 0 1px 0 var(--glass-edge);
  scrollbar-width:none;}
body:not(#x) .sidebar::-webkit-scrollbar{display:none}
body:not(#x) .brand{padding:2px 8px 6px}
body:not(#x) .brand-mark{background:var(--grad)!important; box-shadow:var(--glow); border-radius:13px; font-family:"Outfit",sans-serif}
body:not(#x) .brand strong{color:var(--ink); font-size:15px}
body:not(#x) .brand small{color:var(--muted)}
body:not(#x) .sidebar nav{margin-top:14px}
body:not(#x) .sidebar nav a{color:var(--ink-soft); border-radius:12px; padding:8px 10px; position:relative; font-weight:500}
body:not(#x) .sidebar nav a:hover{background:var(--glass-hi); color:var(--ink); transform:translateX(2px)}
body:not(#x) .sidebar nav a.active{background:var(--grad-soft)!important; color:var(--ink)!important; font-weight:650;
  box-shadow:inset 0 0 0 1px hsl(var(--brand-h) 90% 70% /.32), 0 8px 22px hsl(var(--brand-h) 90% 55% /.18)!important;}
body:not(#x) .sidebar nav a.active:before{content:"";position:absolute;left:-12px;top:22%;bottom:22%;width:3px;border-radius:3px;background:var(--grad);box-shadow:0 0 12px var(--brand)}
body:not(#x) .nav-ic{border-radius:9px}
body:not(#x) .ic-violet{background:hsl(var(--brand-h) 90% 66% /.2); color:var(--accent2)}
body:not(#x) .ic-blue{background:rgba(96,165,250,.18); color:#8dbdff}
body:not(#x) .ic-amber{background:rgba(251,191,36,.17); color:#fcd34d}
body:not(#x) .ic-green{background:rgba(52,211,153,.17); color:#6ee7b7}
body:not(#x) .ic-pink{background:rgba(244,114,182,.17); color:#f9a8d4}
body:not(#x) .ic-teal{background:rgba(45,212,191,.17); color:#5eead4}
body:not(#x) .ic-indigo{background:rgba(129,140,248,.2); color:#a5b4fc}
body:not(#x) .nav-label{color:var(--muted); letter-spacing:1.4px; opacity:.85}
body:not(#x) .sidebar-user{border-top:1px solid var(--line)}
body:not(#x) .sidebar-user strong{color:var(--ink)}
body:not(#x) .user-chip{background:var(--grad)!important; color:#fff!important}
body:not(#x) .logout-ic{background:var(--glass-hi); color:var(--muted)}
body:not(#x) .logout-ic:hover{background:var(--danger-bg); color:var(--danger)}
body:not(#x) .sb-tooltip{background:var(--pop); color:var(--ink); border:1px solid var(--glass-border)}
body:not(#x) .content{padding:6px 18px 56px 4px; border-radius:var(--radius); scrollbar-gutter:stable;}
body:not(#x) .content-inner{max-width:1420px}
body:not(#x) .content-login{padding:20px}
body:not(#x) .workspace-context{color:var(--muted); font-size:12px; margin:-6px 0 14px; letter-spacing:.2px}
body:not(#x) .workspace-context a{color:var(--accent2)}
body:not(#x) .topbar{position:sticky; top:0; z-index:30; margin:0 0 18px; padding:9px 12px; gap:10px; flex-wrap:nowrap;
  background:linear-gradient(180deg,var(--glass-hi),var(--glass));
  backdrop-filter:blur(24px) saturate(150%); -webkit-backdrop-filter:blur(24px) saturate(150%);
  border:1px solid var(--glass-border); border-radius:16px; box-shadow:var(--shadow), inset 0 1px 0 var(--glass-edge);}
body:not(#x) .icon-btn{background:var(--glass-hi); border:1px solid var(--glass-border); color:var(--ink-soft); border-radius:11px}
body:not(#x) .icon-btn:hover{background:var(--glass-edge); color:var(--ink); box-shadow:none}
body:not(#x) .nav-back-group{display:none}
body:not(#x) .topbar-search{background:var(--field); border:1px solid var(--line); max-width:520px}
body:not(#x) .topbar-search:focus-within{background:var(--field-hover); border-color:hsl(var(--brand-h) 90% 70% /.6); box-shadow:0 0 0 4px hsl(var(--brand-h) 90% 60% /.18)}
body:not(#x) .topbar-search input{color:var(--ink)}
body:not(#x) .jump-button{display:inline-flex; align-items:center; gap:8px; height:36px; padding:0 8px 0 12px; border-radius:11px; cursor:pointer;
  background:var(--glass-hi); border:1px solid var(--glass-border); color:var(--ink-soft); font:600 12.5px "Inter",sans-serif;}
body:not(#x) .jump-button:hover{color:var(--ink); border-color:var(--line-strong)}
body:not(#x) kbd{font:600 10.5px "Inter",sans-serif; padding:3px 6px; border-radius:6px; background:var(--field); color:var(--muted); border:1px solid var(--line)}
body:not(#x) .topbar-add{margin-left:0}
body:not(#x) .theme-toggle .material-symbols-rounded{transition:transform .5s var(--ease)}
body:not(#x) .theme-toggle:hover .material-symbols-rounded{transform:rotate(40deg)}
body:not(#x) .profile-control{display:flex;align-items:center;gap:9px;padding:3px 10px 3px 4px;border-radius:999px;background:var(--glass-hi);border:1px solid var(--glass-border);margin-left:auto}
body:not(#x) .topbar-add + .theme-toggle,body:not(#x) .jump-button ~ .theme-toggle{margin-left:0}
body:not(#x) .profile-control img{width:30px;height:30px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px hsl(var(--brand-h) 90% 70% /.5)}
body:not(#x) .profile-control strong{display:block;font-size:12.5px;color:var(--ink);line-height:1.15}
body:not(#x) .profile-control small{display:block;font-size:10.5px;color:var(--muted)}
body:not(#x) .topbar>.jump-button{margin-left:auto}
body:not(#x) .topbar .profile-control{margin-left:0}
body:not(#x) .card,body:not(#x) .metric,body:not(#x) .stat-tile,body:not(#x) .dial-card,body:not(#x) .integration-card,body:not(#x) .integration-mini,body:not(#x) .qc-call-card,body:not(#x) .org-row,body:not(#x) .empty-state,body:not(#x) .monitor-row,body:not(#x) .did-row,body:not(#x) .webhook-box,body:not(#x) .finder-panel,body:not(#x) .page-hero,body:not(#x) .lead-hero,body:not(#x) .qc-card,body:not(#x) .panel{background:linear-gradient(160deg,var(--glass-hi),var(--glass))!important;
  backdrop-filter:blur(22px) saturate(140%); -webkit-backdrop-filter:blur(22px) saturate(140%);
  border:1px solid var(--glass-border)!important; border-radius:var(--radius)!important;
  box-shadow:var(--shadow), inset 0 1px 0 var(--glass-edge)!important; color:var(--ink);}
body:not(#x) .card{position:relative; padding:20px 22px; transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .25s}
body:not(#x) .card h2{font-size:17px; margin:0 0 4px}
body:not(#x) .card h3{font-size:14.5px}
body:not(#x) .card-head p,body:not(#x) .page-head p{color:var(--muted)}
body:not(#x) .card:hover{border-color:var(--line-strong)!important}
body:not(#x) .login-card{background:linear-gradient(160deg,var(--glass-hi),var(--glass-strong))!important;border:1px solid var(--glass-border)!important;box-shadow:var(--shadow-lg), inset 0 1px 0 var(--glass-edge)!important}
body:not(#x) .page-head{margin-bottom:20px}
body:not(#x) .page-head h1,body:not(#x) .lead-header h1{font-size:30px; font-weight:750; letter-spacing:-.02em}
body:not(#x) .page-head h1,body:not(#x) .title-row h1{background:linear-gradient(120deg,var(--ink) 30%,var(--accent2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body:not(#x) .title-ic{border-radius:14px; box-shadow:var(--glow)}
body:not(#x) .title-ic.ic-bg-violet,body:not(#x) .title-ic.ic-bg-indigo{background:var(--grad)!important;color:#fff!important}
body:not(#x) .title-ic.ic-bg-blue{background:linear-gradient(135deg,#38bdf8,#6366f1)!important;color:#fff!important}
body:not(#x) .title-ic.ic-bg-amber{background:linear-gradient(135deg,#fbbf24,#f97316)!important;color:#fff!important}
body:not(#x) .title-ic.ic-bg-green{background:linear-gradient(135deg,#38bdf8,#3b82f6)!important;color:#fff!important}
body:not(#x) .title-ic.ic-bg-pink{background:linear-gradient(135deg,#818cf8,#6366f1)!important;color:#fff!important}
body:not(#x) .title-ic.ic-bg-teal{background:linear-gradient(135deg,#60a5fa,#4f46e5)!important;color:#fff!important}
body:not(#x) .title-ic.ic-bg-red{background:linear-gradient(135deg,#fb7185,#f97316)!important;color:#fff!important}
body:not(#x) .metrics{gap:14px}
body:not(#x) .metric,body:not(#x) .stat-tile{padding:18px 20px; transform-style:preserve-3d; transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .25s var(--ease), box-shadow .3s, border-color .3s; overflow:hidden; position:relative}
body:not(#x) .metric:hover,body:not(#x) .stat-tile:hover{box-shadow:var(--shadow-lg), var(--glow)!important; border-color:hsl(var(--brand-h) 90% 70% /.45)!important}
body:not(#x) .metric:before{content:"";position:absolute;inset:0;background:radial-gradient(240px circle at var(--mx,80%) var(--my,0%),hsl(var(--brand-h) 100% 75% /.22),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
body:not(#x) .metric:hover:before{opacity:1}
body:not(#x) .metric small{color:var(--muted); font-weight:600; letter-spacing:.3px}
body:not(#x) .metric strong{font-size:32px; font-weight:750; color:var(--ink); letter-spacing:-.02em; transform:translateZ(30px)}
body:not(#x) .metric span{color:var(--muted)}
body:not(#x) .icon-chip{border-radius:12px; transform:translateZ(24px)}
body:not(#x) .chip-violet{background:hsl(var(--brand-h) 90% 66% /.2)!important;color:var(--accent2)!important}
body:not(#x) .chip-blue{background:rgba(96,165,250,.18)!important;color:#8dbdff!important}
body:not(#x) .chip-amber{background:rgba(251,191,36,.18)!important;color:#fcd34d!important}
body:not(#x) .chip-green{background:rgba(52,211,153,.18)!important;color:#6ee7b7!important}
body:not(#x) .chip-pink{background:rgba(244,114,182,.18)!important;color:#f9a8d4!important}
body:not(#x) label{color:var(--ink-soft)}
body:not(#x) input,body:not(#x) select,body:not(#x) textarea{background:var(--field)!important; color:var(--ink)!important; border:1px solid var(--line-strong)!important; border-radius:12px!important;
  transition:border-color .2s, box-shadow .2s, background .2s;}
body:not(#x) input::placeholder,body:not(#x) textarea::placeholder{color:var(--muted)}
body:not(#x) input:hover,body:not(#x) select:hover,body:not(#x) textarea:hover{background:var(--field-hover)!important}
body:not(#x) input:focus,body:not(#x) select:focus,body:not(#x) textarea:focus{outline:none!important; border-color:hsl(var(--brand-h) 90% 72% /.75)!important; box-shadow:0 0 0 4px hsl(var(--brand-h) 90% 60% /.2)!important}
body:not(#x) select option{background:var(--pop); color:var(--ink)}
body:not(#x) input[type=checkbox],body:not(#x) input[type=radio]{accent-color:var(--brand)}
body:not(#x) .btn{background:var(--glass-hi); color:var(--ink); border:1px solid var(--glass-border); border-radius:12px; font-weight:600;
  transition:transform .2s var(--ease), box-shadow .25s, background .2s, border-color .2s;}
body:not(#x) .btn:hover{background:rgba(255,255,255,.16); border-color:var(--line-strong); transform:translateY(-1px)}
body:not(#x) .btn:active{transform:translateY(0) scale(.98)}
body:not(#x) .btn.primary{background:var(--grad)!important; color:#fff!important; border:0!important; box-shadow:var(--glow); position:relative; overflow:hidden}
body:not(#x) .btn.primary:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s var(--ease)}
body:not(#x) .btn.primary:hover:after{transform:translateX(120%)}
body:not(#x) .btn.primary:hover{box-shadow:0 0 0 1px hsl(var(--brand-h) 90% 75% /.5),0 14px 40px hsl(var(--brand-h) 90% 60% /.5)}
body:not(#x) .btn.call{background:linear-gradient(135deg,#10b981,#06b6d4)!important;color:#fff!important;border:0!important;box-shadow:0 10px 28px rgba(16,185,129,.4)}
body:not(#x) .btn.danger-outline{color:var(--danger); border-color:rgba(251,113,133,.45); background:var(--danger-bg)}
body:not(#x) .btn.danger-outline:hover{background:rgba(251,113,133,.24)}
body:not(#x) .tab-bar{display:inline-flex; gap:4px; padding:4px; background:var(--field); border:1px solid var(--line); border-radius:14px; flex-wrap:wrap}
body:not(#x) .tab-btn,body:not(#x) .tab-bar button{background:transparent!important; color:var(--muted)!important; border:0!important; border-radius:10px!important; padding:8px 14px; font-weight:600; transition:all .25s var(--ease)}
body:not(#x) .tab-btn:hover,body:not(#x) .tab-bar button:hover{color:var(--ink)!important; background:var(--glass-hi)!important}
body:not(#x) .tab-btn.active,body:not(#x) .tab-bar button.active{background:var(--grad)!important; color:#fff!important; box-shadow:0 6px 18px hsl(var(--brand-h) 90% 55% /.4)}
body:not(#x) .tab-btn.active .count-badge{background:rgba(255,255,255,.25)!important;color:#fff!important}
body:not(#x) .badge,body:not(#x) .status-pill,body:not(#x) .stage-pill,body:not(#x) .count-badge,body:not(#x) .score-chip,body:not(#x) .org-tag{border-radius:999px; font-weight:650; letter-spacing:.2px}
body:not(#x) .status-pill.ok,body:not(#x) .badge.ok,body:not(#x) .badge.good{background:var(--good-bg)!important;color:var(--good)!important}
body:not(#x) .status-pill.bad,body:not(#x) .badge.bad{background:var(--danger-bg)!important;color:var(--danger)!important}
body:not(#x) .status-pill.off,body:not(#x) .badge{background:var(--glass-hi);color:var(--ink-soft)}
body:not(#x) .stage-pill{background:var(--info-bg); color:var(--info)}
body:not(#x) .count-badge{background:hsl(var(--brand-h) 90% 66% /.2); color:var(--accent2)}
body:not(#x) .count-badge.danger{background:var(--danger-bg);color:var(--danger)}
body:not(#x) .count-badge.warning{background:var(--amber-bg);color:var(--amber)}
body:not(#x) .score-chip{background:var(--amber-bg);color:var(--amber)}
body:not(#x) .score-chip.high{background:var(--good-bg);color:var(--good)}
body:not(#x) .score-chip.low{background:var(--danger-bg);color:var(--danger)}
body:not(#x) .stage-select,body:not(#x) .followup-input{background:var(--field)!important}
body:not(#x) .flash{background:var(--glass-strong)!important; border:1px solid var(--glass-border); border-left:3px solid var(--info); border-radius:14px; color:var(--ink); backdrop-filter:blur(18px); animation:rise .5s var(--ease) both}
body:not(#x) .flash.success{border-left-color:var(--good)}
body:not(#x) .flash.error{border-left-color:var(--danger)}
body:not(#x) .toast{background:var(--pop)!important;color:var(--ink)!important;border:1px solid var(--glass-border);box-shadow:var(--shadow-lg);border-radius:14px}
body:not(#x) .table-wrap{border-radius:16px; border:1px solid var(--line); background:rgba(0,0,0,.08); overflow:auto}
body:not(#x) table{color:var(--ink); background:transparent!important}
body:not(#x) th{color:var(--muted)!important; font-size:11px!important; text-transform:uppercase; letter-spacing:.9px; font-weight:700!important; background:transparent!important; border-bottom:1px solid var(--line-strong)!important}
body:not(#x) td{border-bottom:1px solid var(--line)!important; color:var(--ink-soft)}
body:not(#x) td strong,body:not(#x) td a{color:var(--ink)}
body:not(#x) tbody tr{transition:background .2s}
body:not(#x) tbody tr:hover{background:linear-gradient(90deg,hsl(var(--brand-h) 90% 66% /.12),transparent)!important}
body:not(#x) dialog{background:var(--pop); color:var(--ink); border:1px solid var(--glass-border); border-radius:22px; box-shadow:var(--shadow-lg)}
body:not(#x) dialog::backdrop{background:rgba(3,5,15,.6); backdrop-filter:blur(8px)}
body:not(#x) .finder-list a,body:not(#x) .finder-list button{color:var(--ink-soft)}
body:not(#x) .finder-list a:hover,body:not(#x) .finder-list button:hover,body:not(#x) .finder-list .active{background:var(--grad-soft); color:var(--ink)}
body:not(#x) .dialer-widget,body:not(#x) .wa-widget,body:not(#x) .call-screen-panel{background:var(--glass-strong)!important;color:var(--ink);border:1px solid var(--glass-border)!important;backdrop-filter:blur(26px);box-shadow:var(--shadow-lg)}
body:not(#x) .dialer-fab{background:linear-gradient(135deg,#10b981,#06b6d4)!important;box-shadow:0 12px 32px rgba(16,185,129,.5)}
body:not(#x) .keypad-btn{background:var(--glass-hi)!important;color:var(--ink)!important;border:1px solid var(--glass-border)!important}
@media (max-width:760px){body:not(#x) .app-frame{padding:8px}
body:not(#x) .app-shell{height:auto; min-height:calc(100vh - 16px)}
body:not(#x) .content{padding:0 2px 80px; overflow:visible}
body:not(#x) .topbar{flex-wrap:wrap; top:4px}
body:not(#x) .jump-button,body:not(#x) .profile-control span{display:none}
body:not(#x) .profile-control{padding:3px}
body:not(#x) .topbar-search{flex:1 1 100%; order:5; max-width:none}
body:not(#x) .page-head h1{font-size:24px}
body:not(#x) .sidebar{position:fixed; left:8px; top:8px; bottom:8px; z-index:60}}

body:not(#x) .ic-violet{color:hsl(var(--brand-h) 70% 46%)}
body:not(#x) .ic-blue{color:#2563eb} .ic-amber{color:#b7740f}
body:not(#x) .ic-green{color:#0f9d6e} .ic-pink{color:#db2f86}
body:not(#x) .ic-teal{color:#0f8f84} .ic-indigo{color:#4f46e5}
body:not(#x) .btn:hover{background:#fff}
body:not(#x) .count-badge{color:var(--accent2)}
body:not(#x) .table-wrap{background:rgba(255,255,255,.4)}
/* ---------- motion ---------- */
@keyframes rise{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
.reveal{opacity:0}
.reveal.in{animation:rise .7s var(--ease) both; animation-delay:calc(var(--i,0) * 55ms)}
@media (prefers-reduced-motion:reduce){
  .aurora i,.reveal.in{animation:none!important} .reveal{opacity:1}
  .metric,.stat-tile{transform:none!important} *{transition-duration:.01ms!important}
}


/* ======================= admin & shared page families ======================= */
body:not(#x) h1,body:not(#x) h2,body:not(#x) h3,body:not(#x) h4{color:var(--ink)}
body:not(#x) p{color:var(--ink-soft)}
body:not(#x) .page-head h1,body:not(#x) .title-row h1{background:none; -webkit-text-fill-color:currentColor; color:var(--ink)}
body:not(#x) .page-head p{color:var(--muted)}
body:not(#x) .eyebrow{color:var(--accent2); font-size:10.5px; letter-spacing:.2em; font-weight:700}
body:not(#x) .avatar{background:var(--grad)!important; color:#fff!important; border-radius:12px; box-shadow:0 6px 16px hsl(var(--brand-h) 90% 55% /.35)}
body:not(#x) a.text-link,body:not(#x) .admin-shortcuts span{color:var(--accent2); font-weight:600}
body:not(#x) .card+.card{margin-top:0}
body:not(#x) .admin-filters{align-items:flex-end}
body:not(#x) .admin-kpis{gap:16px}
body:not(#x) .admin-kpis article{position:relative; overflow:hidden; padding:20px 22px;
    background:linear-gradient(160deg,var(--glass-hi),var(--glass)); backdrop-filter:blur(22px) saturate(140%);
    border:1px solid var(--glass-border); border-radius:var(--radius); box-shadow:var(--shadow), inset 0 1px 0 var(--glass-edge);
    transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .25s var(--ease), box-shadow .3s, border-color .3s;}
body:not(#x) .admin-kpis article:before{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;background:var(--grad);opacity:.22;filter:blur(26px);transition:opacity .3s}
body:not(#x) .admin-kpis article:hover{box-shadow:var(--shadow-lg), var(--glow); border-color:hsl(var(--brand-h) 90% 70% /.45)}
body:not(#x) .admin-kpis article:hover:before{opacity:.45}
body:not(#x) .admin-kpis article>span{color:var(--muted); font-weight:650; letter-spacing:.3px; font-size:12px}
body:not(#x) .admin-kpis strong{color:var(--ink); font-size:36px; font-weight:750; letter-spacing:-.03em; margin:12px 0 8px; font-family:"Outfit",sans-serif}
body:not(#x) .admin-kpis small{color:var(--muted)}
body:not(#x) .admin-shortcuts{gap:16px}
body:not(#x) .admin-shortcuts .card{transition:transform .3s var(--ease), box-shadow .3s}
body:not(#x) .admin-shortcuts .card:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg), var(--glow)!important}
body:not(#x) .admin-alert{background:linear-gradient(120deg,rgba(251,113,133,.16),rgba(251,113,133,.05)); border:1px solid rgba(251,113,133,.35); border-left:3px solid var(--danger); color:var(--ink); border-radius:var(--radius); backdrop-filter:blur(18px)}
body:not(#x) .admin-alert p{color:var(--ink-soft)}
body:not(#x) .admin-alert strong{color:var(--ink)}
body:not(#x) .admin-alert-events a{color:var(--danger)}
body:not(#x) .admin-status{border-radius:999px; padding:5px 11px}
body:not(#x) .admin-status.neutral{background:var(--glass-hi); color:var(--ink-soft)}
body:not(#x) .admin-status.won{background:var(--good-bg); color:var(--good)}
body:not(#x) .admin-status.interested{background:var(--info-bg); color:var(--info)}
body:not(#x) .admin-status.attention{background:var(--amber-bg); color:var(--amber)}
body:not(#x) .premium-table th,body:not(#x) table th{background:transparent!important; color:var(--muted)!important}
body:not(#x) table td,body:not(#x) table th{border-bottom:1px solid var(--line)!important; padding:15px 18px}
body:not(#x) table tbody tr:nth-child(even){background:transparent}
body:not(#x) table td{color:var(--ink-soft)}
body:not(#x) .lead-name{display:flex; align-items:center; gap:11px; color:var(--ink)}
body:not(#x) .lead-name .avatar{width:34px;height:34px;display:grid;place-items:center;font-size:14px}
body:not(#x) .employee-card,body:not(#x) .lead-pick-card{background:linear-gradient(160deg,var(--glass-hi),var(--glass)); backdrop-filter:blur(22px); color:var(--ink-soft);
    border:1px solid var(--glass-border); border-radius:var(--radius); box-shadow:var(--shadow), inset 0 1px 0 var(--glass-edge);
    transition:transform .3s var(--ease), box-shadow .3s, border-color .3s;}
body:not(#x) .employee-card:hover{transform:translateY(-5px); border-color:hsl(var(--brand-h) 90% 70% /.5); box-shadow:var(--shadow-lg), var(--glow)}
body:not(#x) .employee-stats{border-top:1px solid var(--line)}
body:not(#x) .employee-stats dt{color:var(--muted)}
body:not(#x) .employee-stats dd{color:var(--ink)}
body:not(#x) .lead-pick-card:has(input:checked){background:linear-gradient(160deg,hsl(var(--brand-h) 90% 60% /.25),var(--glass)); border:1px solid hsl(var(--brand-h) 90% 70% /.7); box-shadow:var(--glow); padding:24px}
body:not(#x) .lead-pick-card dt{color:var(--muted)}
body:not(#x) .lead-pick-card dd{color:var(--ink)}
body:not(#x) .transfer-bar{background:var(--field); border:1px solid var(--line)}
body:not(#x) .focus-tabs,body:not(#x) .admin-tabs{display:inline-flex; gap:4px; padding:4px; background:var(--field); border:1px solid var(--line)!important; border-radius:14px; margin:6px 0 22px}
body:not(#x) .focus-tabs button,body:not(#x) .admin-tabs a{color:var(--muted); border-radius:10px; padding:8px 15px; transition:all .25s var(--ease)}
body:not(#x) .focus-tabs button:hover,body:not(#x) .admin-tabs a:hover{color:var(--ink); background:var(--glass-hi)}
body:not(#x) .focus-tabs button[aria-selected=true],body:not(#x) .admin-tabs a.active{background:var(--grad); color:#fff; box-shadow:0 6px 18px hsl(var(--brand-h) 90% 55% /.4)}
body:not(#x) .audit-timeline article{border-bottom:1px solid var(--line)}
body:not(#x) .conversation-contact{border-bottom:1px solid var(--line); color:var(--ink-soft)}
body:not(#x) .conversation-contact:hover{background:var(--glass-hi)}
body:not(#x) .conversation-contact.active{background:var(--grad-soft); color:var(--ink); box-shadow:inset 0 0 0 1px hsl(var(--brand-h) 90% 70% /.3)}
body:not(#x) .chat-history{background:var(--field); border:1px solid var(--line)}
body:not(#x) .chat-bubble{background:var(--glass-hi); border:1px solid var(--glass-border); color:var(--ink)}
body:not(#x) .chat-bubble.outgoing,body:not(#x) .chat-bubble.out{background:linear-gradient(135deg,hsl(var(--brand-h) 90% 60% /.38),hsl(calc(var(--brand-h) + 60) 90% 60% /.28)); border-color:hsl(var(--brand-h) 90% 70% /.4)}
body:not(#x) .chat-bubble strong{color:var(--accent2)}
body:not(#x) .chat-bubble p{color:var(--ink)}
body:not(#x) .chat-bubble small{color:var(--muted)}


/* ======================= legacy-family cleanup (light) ======================= */
body:not(#x) .content details,body:not(#x) .report-summary>div,body:not(#x) .cal-day,body:not(#x) .stat-tile,body:not(#x) .kpi-tile,body:not(#x) .integration-summary>*,body:not(#x) .insight-card,body:not(#x) .focus-banner,body:not(#x) .info-grid>div{background:linear-gradient(160deg,rgba(255,255,255,.8),rgba(255,255,255,.45))!important;
    border:1px solid var(--glass-border)!important; border-radius:16px; color:var(--ink);
    box-shadow:0 4px 14px rgba(50,60,130,.07), inset 0 1px 0 #fff;}
body:not(#x) details>summary{color:var(--ink); font-weight:650; cursor:pointer}
body:not(#x) .report-summary span,body:not(#x) .stat-tile>span,body:not(#x) .metric.stat-tile>span{color:var(--muted)!important}
body:not(#x) .report-summary strong,body:not(#x) .stat-tile strong{color:var(--ink)!important; font-weight:750}
body:not(#x) .cal-day{border-radius:14px; transition:transform .2s var(--ease), box-shadow .2s}
body:not(#x) .cal-day:hover{transform:translateY(-2px); box-shadow:var(--shadow)}
body:not(#x) .cal-day.other-month{opacity:.45; background:rgba(255,255,255,.3)!important}
body:not(#x) .cal-day.is-today{background:var(--grad-soft)!important; border-color:hsl(var(--brand-h) 90% 65% /.6)!important; box-shadow:0 0 0 3px hsl(var(--brand-h) 90% 60% /.18)}
body:not(#x) .cal-day.is-today .cal-day-num{color:var(--accent2)}
body:not(#x) .cal-weekday{color:var(--muted)}
body:not(#x) .cal-event{background:var(--grad-soft)!important; border-left:3px solid var(--brand)!important; color:var(--ink)!important; border-radius:8px}
body:not(#x) .cal-event:hover{background:hsl(var(--brand-h) 90% 62% /.28)!important}
body:not(#x) .chart-visual,body:not(#x) .donut-wrap{color:var(--ink)}
body:not(#x) .chart-tooltip{background:var(--pop); color:var(--ink); border:1px solid var(--glass-border); box-shadow:var(--shadow-lg); border-radius:12px}
body:not(#x) .chart-legend span,body:not(#x) .chart-key span{color:var(--ink-soft)}
body:not(#x) .pipeline-row:hover{background:var(--glass-hi)}
body:not(#x) .pipeline-bar{background:rgba(100,110,180,.12)}
body:not(#x) .pipeline-bar i{background:var(--grad)!important}
body:not(#x) .filters form,body:not(#x) .admin-filters,body:not(#x) .filters{row-gap:12px}
body:not(#x) .admin-filters label,body:not(#x) .filters label{flex:1 1 150px; min-width:140px}
body:not(#x) .admin-filters .btn,body:not(#x) .filters .btn{flex:0 0 auto}
body:not(#x) .badge,body:not(#x) .org-tag{background:rgba(100,110,180,.12)}
body:not(#x) .focus-banner{background:var(--grad)!important; color:#fff!important; border:0!important; box-shadow:var(--glow)}
body:not(#x) .focus-banner *{color:#fff!important}
body:not(#x) .focus-banner .eyebrow{color:rgba(255,255,255,.8)!important}
body:not(#x) .empty-state-icon{background:var(--grad-soft); color:var(--accent2)}


body:not(#x) .focus-banner .btn{background:#fff!important; color:var(--accent2)!important; border:0!important}
body:not(#x) .focus-banner .btn *{color:var(--accent2)!important}
body:not(#x) .sidebar details.admin-navigation>summary{background:transparent!important; box-shadow:none!important; border:0!important}
body:not(#x) .lead-count,body:not(#x) .leads-summary strong{color:var(--ink)!important}
body:not(#x) .brand-login,body:not(#x) .login-card .brand{color:var(--ink)}


/* ======================= login ======================= */
body:not(#x) .login-layout{border-radius:28px!important; overflow:hidden; box-shadow:var(--shadow-lg), 0 0 0 1px var(--glass-border)!important; background:var(--glass-strong)!important; backdrop-filter:blur(30px)}
body:not(#x) .login-story{background:
      radial-gradient(520px circle at 85% 90%,hsl(calc(var(--brand-h) + 78) 95% 65% /.7),transparent 60%),
      radial-gradient(560px circle at 10% 0%,hsl(calc(var(--brand-h) - 48) 95% 65% /.6),transparent 55%),
      linear-gradient(145deg,hsl(var(--brand-h) 70% 38%),hsl(calc(var(--brand-h) + 30) 75% 30%))!important;
    color:#fff!important;}
body:not(#x) .login-story *{color:#fff!important}
body:not(#x) .login-story h2{color:#fff!important; text-shadow:0 6px 30px rgba(20,10,60,.35)}
body:not(#x) .login-story p,body:not(#x) .login-story .brand small{color:rgba(255,255,255,.78)!important}
body:not(#x) .login-story .eyebrow{color:rgba(255,255,255,.85)!important}
body:not(#x) .login-story .brand strong{color:#fff!important}
body:not(#x) .login-story .clay-orb{background:linear-gradient(135deg,rgba(255,255,255,.55),rgba(255,255,255,.18))!important; border:1px solid rgba(255,255,255,.5); backdrop-filter:blur(10px); box-shadow:0 20px 50px rgba(20,10,60,.4); animation:float 6s ease-in-out infinite}
body:not(#x) .login-story .orbit{border-color:rgba(255,255,255,.3)!important; animation:spin 40s linear infinite}
body:not(#x) .login-story .login-pill,body:not(#x) .login-story .pill,body:not(#x) .login-story li,body:not(#x) .login-story .chip{background:rgba(255,255,255,.16)!important; border:1px solid rgba(255,255,255,.35)!important; backdrop-filter:blur(8px)}
body:not(#x) .login-card{box-shadow:none!important; background:transparent!important; border:0!important}
body:not(#x) .login-note{color:var(--muted)}

@keyframes float{50%{transform:translateY(-10px) rotate(4deg)}}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:760px){
  body:not(#x) .sidebar{transform:translateX(-120%)!important}
  html.sidebar-open body:not(#x) .sidebar{transform:translateX(0)!important}
}

body:not(#x) .help-center,body:not(#x) .help-center h1,body:not(#x) .help-center h2,body:not(#x) .help-center h3{color:var(--ink)}
body:not(#x) .help-center p{color:var(--ink-soft)}
body:not(#x) .help-center a,body:not(#x) .help-center .eyebrow,body:not(#x) .help-center .help-kicker{color:var(--accent2)}
body:not(#x) .help-center [class*="help-start"],body:not(#x) .help-center [class*="help-intro"],body:not(#x) .help-center [class*="callout"],body:not(#x) .help-center .help-banner{background:var(--grad-soft)!important; border:1px solid var(--glass-border)!important; border-radius:var(--radius)}
body:not(#x) .wa-connect,body:not(#x) .wa-step,body:not(#x) .wa-panel{color:var(--ink)}


body:not(#x) td .avatar{margin-right:10px; vertical-align:middle; display:inline-grid; place-items:center}


/* ======================= global branch switcher ======================= */
body:not(#x) .scope-switch{display:flex; align-items:center; gap:9px; height:40px; padding:0 8px 0 11px; border-radius:13px; flex:0 0 auto; margin:0;
    background:var(--glass-hi); border:1px solid var(--glass-border); transition:all .25s var(--ease)}
body:not(#x) .scope-switch>.material-symbols-rounded{font-size:20px; color:var(--accent2)}
body:not(#x) .scope-switch label{display:block; margin:0; position:relative}
body:not(#x) .scope-switch small{display:block; font-size:9.5px; letter-spacing:1.1px; text-transform:uppercase; color:var(--muted); font-weight:700; line-height:1; margin-bottom:2px}
body:not(#x) .scope-switch select{border:0!important; background:transparent!important; box-shadow:none!important; padding:0 18px 0 0!important; height:auto!important; min-height:0!important; font:650 13.5px "Inter",sans-serif; color:var(--ink)!important; cursor:pointer; width:auto; max-width:170px}
body:not(#x) .scope-switch:hover{border-color:var(--line-strong)}
body:not(#x) .scope-switch.is-scoped{background:var(--grad)!important; border-color:transparent; box-shadow:var(--glow)}
body:not(#x) .scope-switch.is-scoped>.material-symbols-rounded,body:not(#x) .scope-switch.is-scoped small,body:not(#x) .scope-switch.is-scoped select{color:#fff!important}
body:not(#x) .scope-switch.is-scoped select option{color:var(--ink)}

@media (max-width:760px){body:not(#x) .scope-switch{order:4; flex:1 1 100%}}

/* Shared date controls. The dialog is in the top layer, including inside CRM modals. */
body:not(#x) .crm-date-field{display:block;position:relative;min-width:0;margin-top:6px}
body:not(#x) .crm-date-field.crm-date-range{flex:0 1 310px;width:310px;max-width:100%;margin:0}
body:not(#x) .crm-date-source{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap;pointer-events:none}
body:not(#x) .crm-date-source *{pointer-events:none}
body:not(#x) .crm-date-label{display:block!important;font-size:12.5px!important;max-width:none!important}
body:not(#x) .crm-date-trigger{display:flex;align-items:center;gap:9px;width:100%;min-height:42px;padding:9px 12px;margin:0;border:1px solid var(--line-strong);border-radius:12px;background:var(--field);color:var(--ink-soft);font:500 13px/1.35 "Inter",sans-serif;text-align:left;cursor:pointer;box-shadow:inset 0 1px 2px #1e285905}
body:not(#x) .crm-date-trigger>span:nth-child(2){flex:1;min-width:0;overflow-wrap:anywhere}
body:not(#x) .crm-date-trigger .material-symbols-rounded{font-size:19px;flex:none;color:var(--accent2)}
body:not(#x) .crm-date-trigger:hover,body:not(#x) .crm-date-trigger[aria-expanded=true]{border-color:var(--accent2);background:#fff}
body:not(#x) .crm-date-trigger:disabled{opacity:.55;cursor:not-allowed}
body:not(#x) .crm-date-trigger:focus-visible,body:not(#x) .crm-date-dialog button:focus-visible,body:not(#x) .crm-date-dialog select:focus-visible,body:not(#x) .crm-date-dialog input:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
body:not(#x) .crm-date-dialog{position:fixed;inset:auto;margin:0;padding:18px;width:350px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;box-sizing:border-box;border:1px solid #dbe1ef;border-radius:20px;background:#fff;color:#25304a;box-shadow:0 18px 60px #26325b30;font:500 13px/1.4 "Inter",sans-serif}
body:not(#x) .crm-date-dialog::backdrop{background:rgba(22,30,58,.08);backdrop-filter:none}
body:not(#x) .crm-date-dialog [hidden]{display:none!important}
body:not(#x) .crm-date-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
body:not(#x) .crm-date-heading strong{font-size:16px}
body:not(#x) .crm-date-dialog button{font:inherit;cursor:pointer;box-shadow:none;transition:background .15s;border:0}
body:not(#x) .crm-date-dialog .crm-date-icon{display:grid;place-items:center;width:32px;height:32px;padding:0;background:transparent;border-radius:9px;color:#56627d;flex:none}
body:not(#x) .crm-date-dialog .crm-date-icon:hover{background:#f0f2fa}
body:not(#x) .crm-date-modes{display:flex;gap:4px;padding:4px;background:#f0f2f9;border-radius:11px;margin-bottom:12px}
body:not(#x) .crm-date-modes button{flex:1;padding:8px;border-radius:8px;background:transparent;color:#65708a}
body:not(#x) .crm-date-modes button[aria-pressed=true]{background:#fff;color:#4938d1;box-shadow:0 1px 4px #24315816;font-weight:650}
body:not(#x) .crm-date-presets{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 14px}
body:not(#x) .crm-date-presets button{padding:6px 8px;border:1px solid #e1e5f0;border-radius:8px;background:#fff;color:#56627d;font-size:11px}
body:not(#x) .crm-date-presets button:hover{background:#eef0ff;color:#4938d1}
body:not(#x) .crm-date-navigation{display:flex;gap:8px;align-items:center;margin-bottom:12px}
body:not(#x) .crm-date-dialog .crm-date-navigation select,body:not(#x) .crm-date-dialog .crm-date-navigation input{height:34px;min-width:0;margin:0;padding:0 6px;border:1px solid #e1e5f0;border-radius:8px;background:#fff;color:#25304a;font:600 13px "Inter",sans-serif;box-shadow:none}
body:not(#x) .crm-date-navigation select{flex:1;width:110px}
body:not(#x) .crm-date-navigation input{width:70px}
body:not(#x) .crm-date-weekdays,body:not(#x) .crm-date-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
body:not(#x) .crm-date-weekdays{margin-bottom:6px;text-align:center;font-size:11px;color:#778198}
body:not(#x) .crm-date-dialog .crm-date-day{display:grid;place-items:center;width:100%;height:36px;min-height:0;padding:0;margin:0;background:transparent;color:#35405b;border-radius:9px;font-size:12px}
body:not(#x) .crm-date-dialog .crm-date-day.outside{color:#9da5b6}
body:not(#x) .crm-date-dialog .crm-date-day.in-range{background:#eeedff;color:#4938d1}
body:not(#x) .crm-date-dialog .crm-date-day.endpoint{background:#5b4ce3;color:#fff;font-weight:700}
body:not(#x) .crm-date-dialog .crm-date-day[aria-current=date]{box-shadow:inset 0 0 0 1px #9589ef}
body:not(#x) .crm-date-dialog .crm-date-day:hover:not(:disabled){background:#dfdcfc;color:#382aa1}
body:not(#x) .crm-date-dialog button:disabled{opacity:.4;cursor:not-allowed}
body:not(#x) .crm-date-status{min-height:36px;margin:12px 0 0!important;font-size:12px;line-height:1.5;color:#65708a}
body:not(#x) .crm-date-time{display:flex;align-items:center;gap:12px;margin-top:8px;font-weight:600}
body:not(#x) .crm-date-dialog .crm-date-time input{flex:1;min-width:0;height:38px;margin:0;border:1px solid #dbe1ef;border-radius:9px;background:#f8f9fc;color:#25304a;padding:6px 10px}
body:not(#x) .crm-date-zone{display:block;margin-top:6px;font-size:11px;color:#65708a}
body:not(#x) .crm-date-error{color:#b42338;font-size:12px;margin:6px 0}
body:not(#x) .crm-date-error:empty{display:none}
body:not(#x) .crm-date-footer{display:flex;gap:7px;justify-content:flex-end;border-top:1px solid #edf0f6;padding-top:12px;margin-top:8px}
body:not(#x) .crm-date-footer button{border-radius:9px;padding:9px 12px;background:#f2f4f9;color:#56627d}
body:not(#x) .crm-date-footer button:first-child{margin-right:auto;background:transparent}
body:not(#x) .crm-date-footer .crm-date-apply{background:#5b4ce3;color:#fff;font-weight:650}

@media(max-width:600px){body:not(#x) .crm-date-field.crm-date-range{flex:1 1 100%;width:100%}body:not(#x) .crm-date-dialog{padding:16px}body:not(#x) .crm-date-dialog .crm-date-day{height:40px}}

body:not(#x) .deletion-card{max-width:760px;margin:0 auto}
body:not(#x) .deletion-card p{line-height:1.7;margin:16px 0}
body:not(#x) .deletion-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:#fff1f2;color:#be123c;font-size:26px;margin-bottom:16px}
body:not(#x) .deletion-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end;margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
body:not(#x) .record-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

@media(max-width:640px){
  body:not(#x) .deleted-records-table{display:block;min-width:0!important;width:100%}
  body:not(#x) .deleted-records-table thead{display:none}
  body:not(#x) .deleted-records-table tbody{display:block}
  body:not(#x) .deleted-records-table tr{display:block;padding:10px 0;border-bottom:1px solid var(--line)}
  body:not(#x) .deleted-records-table tr:last-child{border-bottom:0}
  body:not(#x) .deleted-records-table td{display:flex;align-items:center;justify-content:space-between;gap:14px;white-space:normal!important;overflow-wrap:anywhere;padding:8px 12px!important;border:0;text-align:right}
  body:not(#x) .deleted-records-table td[data-label]:before{content:attr(data-label);font-weight:650;color:var(--muted);flex:0 0 auto;text-align:left}
}

/* ======================= Call queue + Demo calendar ======================= */
body:not(#x) .hero-actions{display:flex; gap:10px; flex-wrap:wrap}
body:not(#x) .integration-note{display:flex; align-items:center; gap:10px; padding:10px 16px; margin:0 0 18px; border-radius:14px; background:var(--amber-bg); border:0; color:var(--ink-soft); font-size:13px}
body:not(#x) .integration-note strong{color:var(--amber)}
body:not(#x) .integration-note a{margin-left:auto; font-weight:650}
body:not(#x) .dial-layout{display:grid; gap:18px; align-items:start}
body:not(#x) .dial-layout.has-lead{grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr)}
body:not(#x) .dial-layout>.card,body:not(#x) .dial-layout>.dial-card{margin:0}
body:not(#x) .dial-card.classic-dial{display:grid; justify-items:center; text-align:center; gap:6px; padding:30px 32px; position:relative; overflow:hidden}
body:not(#x) .dial-card.classic-dial:before{content:""; position:absolute; inset:0 0 auto 0; height:120px; background:var(--grad-soft); z-index:0}
body:not(#x) .dial-card.classic-dial>*{position:relative; z-index:1}
body:not(#x) .dial-top{display:flex; justify-content:space-between; width:100%; align-items:center}
body:not(#x) .dial-top .score{font-size:12px; font-weight:700; color:var(--accent2); background:#fff; padding:4px 12px; border-radius:999px; border:1px solid var(--line)}
body:not(#x) .avatar.xl{width:84px; height:84px; font-size:34px; border-radius:26px; display:grid; place-items:center; box-shadow:var(--glow); margin-top:4px}
body:not(#x) .dial-card h2{font-size:26px; margin:10px 0 0}
body:not(#x) .big-phone{font:700 28px "Outfit",sans-serif; letter-spacing:.02em; color:var(--ink)}
body:not(#x) .dial-card>p{margin:0; color:var(--muted)}
body:not(#x) .dial-card #startCall{width:100%; max-width:380px; height:56px; font-size:17px; border-radius:16px; margin-top:12px; animation:ring 2.8s ease-in-out infinite}
body:not(#x) .dial-card hr{width:100%; margin:20px 0 6px}
body:not(#x) .dial-card form.stack{width:100%; text-align:left}
body:not(#x) .dial-card form h3{margin:0 0 4px}
@keyframes ring{0%,100%{box-shadow:0 10px 28px rgba(16,185,129,.4)} 50%{box-shadow:0 10px 44px rgba(16,185,129,.7), 0 0 0 8px rgba(16,185,129,.12)}}
body:not(#x) .queue-card{position:sticky; top:84px}
body:not(#x) .queue-list{display:grid; gap:8px}
body:not(#x) .queue-row{display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:14px; border:1px solid var(--line); background:#fff; color:var(--ink); transition:all .25s var(--ease)}
body:not(#x) .queue-row .avatar{width:36px; height:36px; display:grid; place-items:center; flex:0 0 auto}
body:not(#x) .queue-row .q-main{flex:1; min-width:0}
body:not(#x) .queue-row .q-main strong{display:block; font-size:13.5px}
body:not(#x) .queue-row .q-main small{color:var(--muted); font-size:12px}
body:not(#x) .queue-row .q-go{width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-size:18px; color:#fff; background:linear-gradient(135deg,#10b981,#06b6d4); opacity:.9}
body:not(#x) .queue-row:hover{transform:translateX(3px); border-color:hsl(var(--brand-h) 90% 70% /.5); box-shadow:var(--shadow)}
body:not(#x) .queue-row.current{background:var(--grad-soft); border-color:hsl(var(--brand-h) 90% 70% /.5)}
body:not(#x) .empty-state h2{margin:0 0 6px}
body:not(#x) .cal-layout{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:18px; align-items:start}
body:not(#x) .cal-layout>.card{margin:0}
body:not(#x) .cal-nav-controls{display:flex; gap:8px}
body:not(#x) .cal-card .cal-nav{margin-bottom:10px}
body:not(#x) .cal-month-label{font-size:20px; margin:0}
body:not(#x) .cal-grid{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px}
body:not(#x) .cal-weekday{text-align:center; font-size:11px; font-weight:700; letter-spacing:.9px; text-transform:uppercase; color:var(--muted); padding:6px 0}
body:not(#x) .cal-day{min-height:104px; padding:8px; border-radius:14px; background:#fff!important; border:1px solid var(--line)!important; box-shadow:none; display:flex; flex-direction:column; gap:4px; min-width:0; overflow:hidden}
body:not(#x) .cal-day.is-weekend{background:var(--bg-2)!important}
body:not(#x) .cal-day.other-month{opacity:.4}
body:not(#x) .cal-day.has-events{border-color:hsl(var(--brand-h) 80% 85%)!important}
body:not(#x) .cal-day.is-today{background:var(--grad-soft)!important; border-color:var(--brand)!important; box-shadow:0 0 0 3px hsl(var(--brand-h) 90% 60% /.18)}
body:not(#x) .cal-day-num{display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--ink-soft)}
body:not(#x) .cal-day.is-today .cal-day-num{color:#fff}
body:not(#x) .cal-day.is-today .cal-day-num{width:26px; height:26px; border-radius:50%; background:var(--grad); justify-content:center}
body:not(#x) .cal-dot{width:6px; height:6px; border-radius:50%; background:var(--brand)}
body:not(#x) .cal-day.is-today .cal-dot{display:none}
body:not(#x) .cal-event{display:block; font-size:11.5px; padding:3px 7px; border-radius:7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:hsl(var(--brand-h) 90% 96%)!important; color:var(--accent2)!important; border-left:3px solid var(--brand)!important}
body:not(#x) .cal-event b{font-weight:700}
body:not(#x) .cal-more{font-size:11px; color:var(--muted); padding-left:4px}
body:not(#x) .agenda-card{position:sticky; top:84px}
body:not(#x) .agenda{list-style:none; margin:0; padding:0; display:grid; gap:8px}
body:not(#x) .agenda a{display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:14px; border:1px solid var(--line); color:var(--ink); background:#fff; transition:all .25s var(--ease)}
body:not(#x) .agenda a:hover{transform:translateX(3px); box-shadow:var(--shadow); border-color:hsl(var(--brand-h) 90% 70% /.5)}
body:not(#x) .ag-date{width:46px; height:50px; border-radius:12px; background:var(--grad); color:#fff; display:grid; place-content:center; text-align:center; flex:0 0 auto}
body:not(#x) .ag-date b{font:750 18px/1 "Outfit",sans-serif}
body:not(#x) .ag-date small{font-size:10px; text-transform:uppercase; letter-spacing:.8px; opacity:.9}
body:not(#x) .ag-main{flex:1; min-width:0}
body:not(#x) .ag-main strong{display:block; font-size:13.5px}
body:not(#x) .ag-main small{color:var(--muted); font-size:12px}
body:not(#x) .agenda a>.material-symbols-rounded{color:var(--muted)}

@media (max-width:1100px){
  body:not(#x) .dial-layout.has-lead,body:not(#x) .cal-layout{grid-template-columns:1fr}
  body:not(#x) .queue-card,body:not(#x) .agenda-card{position:static}
}
@media (max-width:760px){
  body:not(#x) .cal-grid{gap:4px}
  body:not(#x) .cal-day{min-height:62px; padding:4px; border-radius:10px}
  body:not(#x) .cal-event{font-size:0; padding:0; height:6px; border-radius:3px; border-left-width:0!important; background:var(--brand)!important; margin:0}
  body:not(#x) .cal-more{display:none}
  body:not(#x) .dial-card.classic-dial{padding:22px 16px}
  body:not(#x) .big-phone{font-size:22px}
}

body:not(#x) .ov-hero .hero-actions,body:not(#x) .ov-hero>.cal-nav-controls,body:not(#x) .ov-hero>.btn{margin-left:auto}
body:not(#x) .ag-date small{color:#fff!important; opacity:.9}
body:not(#x) .agenda-card .card-head,body:not(#x) .queue-card .card-head{flex-wrap:nowrap}


body:not(#x) .queue-row .q-go{width:auto; height:auto; border-radius:999px; padding:6px 12px 6px 8px; display:inline-flex; align-items:center; gap:5px; font:650 12px "Inter",sans-serif; opacity:1}
body:not(#x) .queue-row .q-go .material-symbols-rounded{font-size:16px}


/* ======================= "About this page" strip ======================= */
body:not(#x) .page-intro{margin:-4px 0 18px; border-radius:16px; background:hsl(var(--brand-h) 90% 97%); border:1px solid hsl(var(--brand-h) 70% 90%); overflow:hidden; transition:box-shadow .25s}
body:not(#x) .page-intro.open{background:#fff; box-shadow:0 10px 30px rgba(30,40,90,.08)}
body:not(#x) .pi-row{display:flex; align-items:center; gap:12px; padding:10px 12px 10px 14px}
body:not(#x) .pi-ic{width:30px; height:30px; flex:0 0 30px; border-radius:10px; display:grid; place-items:center; font-size:18px; color:#fff; background:var(--grad)}
body:not(#x) .pi-purpose{flex:1; margin:0; font-size:13.5px; line-height:1.45; color:var(--ink); font-weight:550; min-width:0}
body:not(#x) .pi-section{display:inline-block; margin-right:8px; padding:1px 8px; border-radius:999px; font-size:10.5px; font-weight:750; letter-spacing:.6px; text-transform:uppercase; background:#fff; color:var(--accent2); border:1px solid hsl(var(--brand-h) 70% 88%); vertical-align:1px}
body:not(#x) .pi-toggle{flex:0 0 auto; display:inline-flex; align-items:center; gap:6px; height:32px; padding:0 12px; border-radius:10px; border:1px solid hsl(var(--brand-h) 70% 86%); background:#fff; color:var(--accent2); font:650 12.5px "Inter",sans-serif; cursor:pointer}
body:not(#x) .pi-toggle .material-symbols-rounded{font-size:17px}
body:not(#x) .pi-toggle:hover{background:var(--grad); color:#fff; border-color:transparent}
body:not(#x) .pi-body{padding:4px 14px 14px 56px}
body:not(#x) .pi-steps{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
body:not(#x) .pi-steps li{display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border-radius:12px; background:var(--field); border:1px solid var(--line); font-size:13px; line-height:1.45; color:var(--ink-soft)}
body:not(#x) .pi-steps b{flex:0 0 22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:11.5px; color:#fff; background:var(--grad)}
body:not(#x) .pi-meta{display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; margin-top:12px; font-size:12px; color:var(--muted)}
body:not(#x) .pi-meta>span{display:inline-flex; align-items:center; gap:5px}
body:not(#x) .pi-meta .material-symbols-rounded{font-size:15px; color:var(--accent2)}
body:not(#x) .pi-guide{font-weight:650; color:var(--accent2); margin-left:auto}
body:not(#x) .pi-done{height:28px; padding:0 12px; border-radius:8px; border:0; background:var(--grad); color:#fff; font:650 12px "Inter",sans-serif; cursor:pointer}
body:not(#x) .workspace-context{display:none}

@media (max-width:900px){ body:not(#x) .pi-steps{grid-template-columns:1fr} body:not(#x) .pi-body{padding-left:14px} }
@media (max-width:560px){ body:not(#x) .pi-section{display:none} body:not(#x) .pi-toggle-label{display:none} body:not(#x) .pi-toggle{padding:0 8px} body:not(#x) .pi-guide{margin-left:0} }

/* ---- Help article: At a glance ---- */
body:not(#x) .help-glance{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:0 0 22px; padding:18px; border-radius:var(--radius); background:#fff; border:1px solid rgba(30,40,90,.09); box-shadow:0 8px 24px rgba(30,40,90,.06)}
body:not(#x) .hg-item{display:flex; gap:12px; align-items:flex-start; padding:12px; border-radius:14px; background:var(--field)}
body:not(#x) .hg-item>.material-symbols-rounded{width:34px; height:34px; flex:0 0 34px; border-radius:11px; display:grid; place-items:center; color:#fff; background:var(--grad); font-size:19px}
body:not(#x) .hg-item small,body:not(#x) .hg-quick small{display:block; font-size:10.5px; font-weight:750; letter-spacing:.8px; text-transform:uppercase; color:var(--muted); margin-bottom:3px}
body:not(#x) .hg-item p{margin:0!important; font-size:13.5px; line-height:1.5; color:var(--ink)!important}
body:not(#x) .hg-quick{grid-column:1/-1}
body:not(#x) .hg-quick ol{list-style:none; margin:6px 0 0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
body:not(#x) .hg-quick li{display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border-radius:12px; border:1px solid var(--line); font-size:13.5px; color:var(--ink-soft); line-height:1.45}
body:not(#x) .hg-quick b{flex:0 0 22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:11.5px; color:#fff; background:var(--grad)}
body:not(#x) .help-center{color:var(--ink)}
body:not(#x) .help-article-head h1{font-size:30px}
body:not(#x) .help-steps li{line-height:1.6}

@media (max-width:900px){ body:not(#x) .help-glance,body:not(#x) .hg-quick ol{grid-template-columns:1fr} }

body:not(#x) .page-intro ~ .page-head p:not(.eyebrow){display:none}
body:not(#x) .page-intro ~ .page-head{margin-bottom:16px}
body:not(#x) .content details.more-info{margin:10px 0; padding:0!important; border:0!important; background:none!important; box-shadow:none!important}
body:not(#x) .content details.more-info>summary{display:inline-flex!important; align-items:center; gap:6px; padding:5px 10px!important; border-radius:999px; border:1px solid var(--line)!important; font-size:12px!important; font-weight:650; color:var(--muted)!important; background:var(--field)}
body:not(#x) .content details.more-info>summary:before{display:none!important}
body:not(#x) .content details.more-info>summary .material-symbols-rounded{font-size:16px; color:var(--accent2)}
body:not(#x) .content details.more-info[open]>summary{border-bottom:1px solid var(--line)!important; margin-bottom:8px}
body:not(#x) .content details.more-info>p{padding:0!important; margin:6px 0!important; font-size:13px; color:var(--muted)}
body:not(#x) .admin-alert{padding:14px 18px!important; gap:10px 16px!important}
body:not(#x) .admin-alert p{display:none}
body:not(#x) .admin-alert-events{gap:8px!important}
body:not(#x) .admin-alert-events a{text-decoration:none!important; padding:4px 10px; border-radius:999px; background:#fff; border:1px solid rgba(251,113,133,.35); font-weight:600}


/* ---- Help & Docs in the brand palette ---- */
body:not(#x) .help-center,body:not(#x) .help-center h1,body:not(#x) .help-center h2,body:not(#x) .help-center h3{color:var(--ink)!important}
body:not(#x) .help-center p{color:var(--ink-soft)!important}
body:not(#x) .help-center a{color:var(--accent2)}
body:not(#x) .help-search,body:not(#x) .help-card,body:not(#x) .help-section,body:not(#x) .help-trouble,body:not(#x) .help-note,body:not(#x) .help-check{background:#fff!important; border:1px solid rgba(30,40,90,.09)!important; border-radius:var(--radius)!important; box-shadow:0 1px 2px rgba(30,40,90,.05),0 8px 24px rgba(30,40,90,.06)}
body:not(#x) .help-start{background:var(--grad-soft)!important; border:1px solid hsl(var(--brand-h) 70% 88%)!important}
body:not(#x) .help-check{border-left:4px solid var(--good)!important}
body:not(#x) .help-note{border-left:4px solid var(--amber)!important}
body:not(#x) .help-category{color:var(--accent2)!important; text-transform:uppercase; letter-spacing:.08em; font-size:11px}
body:not(#x) .help-card:hover{border-color:hsl(var(--brand-h) 80% 70%)!important; box-shadow:var(--shadow-lg)}
body:not(#x) .help-steps li:before{background:var(--grad)!important; color:#fff!important; border:0!important}
body:not(#x) .help-who{display:inline-flex; align-items:center; gap:5px; margin:2px 0 10px; font-size:12px; font-weight:600; color:var(--muted)}
body:not(#x) .help-who .material-symbols-rounded{font-size:15px; color:var(--accent2)}
body:not(#x) .help-trouble summary{color:var(--ink)!important}


/* ---- Leads list: tidy toolbar ---- */
body:not(#x) .lead-toolbar .tb-search input{padding-left:38px!important}
body:not(#x) .list-context>div:last-child{display:none}
body:not(#x) .leads-card{display:flex; flex-direction:column}
body:not(#x) .leads-card>.lead-toolbar{order:1}
body:not(#x) .leads-card>.lead-bar{order:2; align-self:flex-end; margin:-52px 12px 0 0; padding:0!important; position:relative; z-index:2}
body:not(#x) .leads-card>.lead-bar:has(.chip-link){align-self:stretch; margin:0; padding:0 12px 8px!important}
body:not(#x) .leads-card>*:not(.lead-toolbar):not(.lead-bar){order:3}
body:not(#x) .bulk-actions{background:transparent!important; border:1px dashed var(--line-strong)!important}
body:not(#x) .bulk-actions>summary{font-size:12.5px!important; color:var(--muted)!important}

body:not(#x) .content details.bulk-actions{background:transparent!important; border:1px dashed var(--line-strong)!important; box-shadow:none!important}
body:not(#x) .save-view>summary{height:34px}


/* ======================= Lists: stage rail + toolbar ======================= */
body:not(#x) .stage-rail{display:flex; gap:8px; overflow-x:auto; padding:2px 2px 12px; margin-bottom:6px; scrollbar-width:none}
body:not(#x) .stage-rail::-webkit-scrollbar{display:none}
body:not(#x) .stage-chip{display:inline-flex; align-items:center; gap:9px; padding:8px 8px 8px 14px; border-radius:999px; white-space:nowrap; flex:0 0 auto;
    color:var(--ink-soft); font-weight:600; font-size:13px; background:var(--glass-hi); border:1px solid var(--glass-border); transition:all .25s var(--ease)}
body:not(#x) .stage-chip b{min-width:26px; text-align:center; padding:2px 8px; border-radius:999px; font-size:11.5px; background:rgba(100,110,180,.14); color:var(--ink)}
body:not(#x) .stage-chip:hover{transform:translateY(-2px); box-shadow:var(--shadow); color:var(--ink)}
body:not(#x) .stage-chip.on{background:var(--grad); color:#fff; border-color:transparent; box-shadow:var(--glow)}
body:not(#x) .stage-chip.on b{background:rgba(255,255,255,.28); color:#fff}
body:not(#x) .lead-toolbar{display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; padding:12px; margin-bottom:16px; border-radius:16px;
    background:var(--glass-hi); border:1px solid var(--glass-border); backdrop-filter:blur(18px)}
body:not(#x) .lead-toolbar label{display:grid; gap:3px; margin:0; flex:0 1 auto}
body:not(#x) .lead-toolbar label>span:not(.material-symbols-rounded){font-size:10px; letter-spacing:.9px; text-transform:uppercase; font-weight:700; color:var(--muted)}
body:not(#x) .lead-toolbar select,body:not(#x) .lead-toolbar input{height:38px; padding:0 10px; font-size:13px; min-width:130px}
body:not(#x) .lead-toolbar .tb-search{display:flex; align-items:center; gap:8px; flex:1 1 220px; position:relative}
body:not(#x) .lead-toolbar .tb-search .material-symbols-rounded{position:absolute; left:11px; color:var(--muted); font-size:19px; pointer-events:none}
body:not(#x) .lead-toolbar .tb-search input{width:100%; padding-left:36px}
body:not(#x) .lead-toolbar .btn{height:38px}
body:not(#x) .card.flush{padding:6px}
body:not(#x) .card.flush .table-wrap{border:0; background:transparent}
body:not(#x) .card.flush .pager,body:not(#x) .card.flush nav.pager{padding:10px 14px}


body:not(#x) .lead-toolbar label,body:not(#x) .ov-filters label{font-size:10px; letter-spacing:.9px; text-transform:uppercase; font-weight:700; color:var(--muted)}
body:not(#x) .lead-toolbar select{max-width:200px}
body:not(#x) .lead-toolbar input,body:not(#x) .lead-toolbar select,body:not(#x) .ov-filters input,body:not(#x) .ov-filters select{text-transform:none; letter-spacing:0; font-weight:500; color:var(--ink)}


/* Keep the two everyday lead actions visible without an overflow menu. */
body:not(#x) .mobile-leads .lead-name-actions{display:flex; align-items:center; gap:12px}
body:not(#x) .mobile-leads .lead-name{min-width:130px; max-width:220px; white-space:normal}
body:not(#x) .mobile-leads .lead-name strong{overflow-wrap:anywhere}
body:not(#x) .mobile-leads .lead-name .avatar{flex-shrink:0}
body:not(#x) .mobile-leads .btn.lead-row-action{display:inline-flex; align-items:center; justify-content:center; gap:6px; flex-shrink:0; min-height:40px!important; padding:8px 12px!important; border-radius:10px!important; white-space:nowrap; font-size:12px; font-weight:650; box-shadow:none}
body:not(#x) .mobile-leads .lead-row-action .material-symbols-rounded{font-size:18px}
body:not(#x) .mobile-leads .lead-call-action{background:#eef2ff; border-color:#c7d2fe; color:#3730a3}
body:not(#x) .mobile-leads .lead-call-action:hover:not(:disabled){background:#e0e7ff; border-color:#a5b4fc}
body:not(#x) .mobile-leads .lead-whatsapp-action{background:#ecfdf5; border-color:#a7f3d0; color:#166534}
body:not(#x) .mobile-leads .lead-whatsapp-action:hover{background:#d1fae5; border-color:#6ee7b7}
body:not(#x) .mobile-leads .lead-row-action:disabled{background:#f1f5f9; border-color:#e2e8f0; color:#64748b; cursor:not-allowed; box-shadow:none; transform:none}
body:not(#x) .mobile-leads .lead-identity-cell .dnc-badge{margin-top:8px}
body:not(#x) .mobile-leads .sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0}
@media(min-width:641px){body:not(#x) .mobile-leads th,body:not(#x) .mobile-leads td{padding-left:12px; padding-right:12px}
body:not(#x) .mobile-leads .row-actions,body:not(#x) .mobile-leads th:last-child{position:sticky; right:0; z-index:1; background:#fff; box-shadow:-8px 0 12px -12px #64748b}}
@media(max-width:640px){body:not(#x) .leads-card .table-wrap .mobile-leads{min-width:0}
body:not(#x) .mobile-leads .lead-identity-cell{display:block}
body:not(#x) .mobile-leads .lead-name-actions{justify-content:space-between; flex-wrap:wrap}
body:not(#x) .mobile-leads .lead-name{flex:1 1 130px; min-width:0}
body:not(#x) .mobile-leads .row-actions{justify-content:flex-end}
body:not(#x) .mobile-leads .btn.lead-row-action{min-height:44px!important}}


/* Keep login help text clear of the submit button and reserve room for the eye. */
body:not(#x) .content .login-card .login-note{margin:24px 0 0!important;align-items:flex-start;line-height:1.6}
body:not(#x) .login-note .material-symbols-rounded{flex:0 0 auto;margin-top:2px}
body:not(#x) .login-form input:not([type=hidden]){min-height:48px}
body:not(#x) .login-password-field{min-width:0}
body:not(#x) .login-password-control{position:relative;margin-top:8px}
body:not(#x) .login-password-control input{margin:0!important;padding-right:56px!important;width:100%}
body:not(#x) .login-password-control .password-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:44px;height:44px;min-height:0;margin:0;padding:0;border:0;border-radius:10px;background:transparent;box-shadow:none;color:var(--ink-soft);cursor:pointer}
body:not(#x) .login-password-control .password-toggle[hidden]{display:none}
body:not(#x) .login-password-control .password-toggle:hover{background:rgba(79,70,229,.08);color:var(--accent2)}
body:not(#x) .login-password-control .password-toggle:focus-visible{outline:2px solid var(--accent2);outline-offset:-3px}
body:not(#x) .password-toggle .password-eye-slash{display:none}
body:not(#x) .password-toggle[aria-pressed="true"] .password-eye-slash{display:block}


/* ======================= Admin overview — command center ======================= */
body:not(#x) .ov-hero{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin:6px 0 22px}
body:not(#x) .ov-hero h1{font-size:34px; margin:4px 0 6px}
body:not(#x) .ov-sub{margin:0; color:var(--muted); font-size:13px}
body:not(#x) .ov-sub strong{color:var(--accent2)}
body:not(#x) .ov-filters{display:flex; gap:8px; align-items:flex-end; flex-wrap:wrap; padding:10px; border-radius:16px; background:var(--glass-hi); border:1px solid var(--glass-border); backdrop-filter:blur(18px)}
body:not(#x) .ov-filters label{display:grid; gap:3px; margin:0}
body:not(#x) .ov-filters label span{font-size:10px; letter-spacing:.9px; text-transform:uppercase; font-weight:700; color:var(--muted)}
body:not(#x) .ov-filters select,body:not(#x) .ov-filters input{height:36px; padding:0 10px; font-size:12.5px; min-width:120px}
body:not(#x) .ov-filters .btn{height:36px}
body:not(#x) .ov-kpis{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:18px}
body:not(#x) .ov-kpi{display:flex; gap:14px; align-items:center; padding:18px 20px; border-radius:var(--radius); color:var(--ink);
    background:linear-gradient(160deg,var(--glass-hi),var(--glass)); border:1px solid var(--glass-border); box-shadow:var(--shadow), inset 0 1px 0 var(--glass-edge); backdrop-filter:blur(22px);
    transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition:transform .25s var(--ease), box-shadow .3s, border-color .3s}
body:not(#x) .ov-kpi:hover{box-shadow:var(--shadow-lg), var(--glow); border-color:hsl(var(--brand-h) 90% 70% /.5)}
body:not(#x) .ov-ic{width:52px; height:52px; border-radius:16px; display:grid; place-items:center; color:#fff; flex:0 0 auto; box-shadow:var(--glow)}
body:not(#x) .ov-ic .material-symbols-rounded{font-size:26px}
body:not(#x) .ov-kpi small{display:block; color:var(--muted); font-weight:650; font-size:12px}
body:not(#x) .ov-kpi strong{display:block; font:750 32px/1.1 "Outfit",sans-serif; letter-spacing:-.02em; margin:2px 0}
body:not(#x) .ov-kpi em{font-style:normal; color:var(--muted); font-size:11.5px}
body:not(#x) .ov-grid{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; align-items:stretch}
body:not(#x) .ov-grid>.card{margin:0; min-width:0}
body:not(#x) .ov-trend{grid-column:span 8}
body:not(#x) .ov-stages{grid-column:span 4}
body:not(#x) .ov-leads{grid-column:span 8}
body:not(#x) .ov-leaders{grid-column:span 4}
body:not(#x) .leaderboard{list-style:none; margin:6px 0 0; padding:0; display:grid; gap:14px}
body:not(#x) .leaderboard a{display:flex; align-items:center; gap:12px; color:var(--ink)}
body:not(#x) .leaderboard .avatar{width:36px; height:36px; display:grid; place-items:center; flex:0 0 auto}
body:not(#x) .lb-main{flex:1; min-width:0}
body:not(#x) .lb-main strong{display:block; font-size:13px; margin-bottom:6px}
body:not(#x) .lb-main i{display:block; height:7px; border-radius:7px; background:rgba(100,110,180,.14); position:relative; overflow:hidden}
body:not(#x) .lb-main i:after{content:""; position:absolute; inset:0; width:var(--w); border-radius:7px; background:var(--grad); animation:grow .9s var(--ease) both}
body:not(#x) .leaderboard b{font:750 15px "Outfit",sans-serif}
body:not(#x) .ov-shortcuts{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:18px}
body:not(#x) .ov-shortcuts a{display:flex; gap:12px; align-items:center; padding:16px 18px; border-radius:var(--radius-sm); color:var(--ink);
    background:var(--glass); border:1px dashed var(--line-strong); transition:all .3s var(--ease)}
body:not(#x) .ov-shortcuts a:hover{border-style:solid; border-color:hsl(var(--brand-h) 90% 70% /.55); background:var(--glass-hi); transform:translateY(-3px); box-shadow:var(--shadow)}
body:not(#x) .ov-shortcuts .material-symbols-rounded{font-size:24px; color:var(--accent2)}
body:not(#x) .ov-shortcuts strong{display:block; font-size:13.5px}
body:not(#x) .ov-shortcuts small{color:var(--muted)}
body:not(#x) .donut-wrap{position:relative; max-width:220px; margin:6px auto}
body:not(#x) .donut-center{position:absolute; inset:0; display:grid; place-content:center; text-align:center}
body:not(#x) .donut-center b{font:750 30px "Outfit",sans-serif; color:var(--ink)}
body:not(#x) .donut-center small{color:var(--muted)}
body:not(#x) .chart-legend{display:flex; flex-wrap:wrap; gap:8px 14px; margin-top:10px}
body:not(#x) .chart-key{display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--ink-soft); background:none; border:0; cursor:pointer}
body:not(#x) .chart-key i{width:9px; height:9px; border-radius:50%; background:var(--series)}
body:not(#x) .chart-key[aria-pressed=false]{opacity:.4}
body:not(#x) .chart-data{margin-top:8px}

@keyframes grow{from{width:0}}
@media (max-width:1100px){
  body:not(#x) .ov-kpis,body:not(#x) .ov-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(#x) .ov-trend,body:not(#x) .ov-stages,body:not(#x) .ov-leads,body:not(#x) .ov-leaders{grid-column:1/-1}
}
@media (max-width:560px){body:not(#x) .ov-kpis,body:not(#x) .ov-shortcuts{grid-template-columns:1fr}}

.chart-line{stroke-dasharray:1; stroke-dashoffset:1; animation:draw 1.4s var(--ease) .15s forwards}
.chart-area{animation:fadein 1.2s ease .3s both}
.donut-wrap svg circle{transition:stroke-width .2s}
.donut-wrap svg circle:hover{stroke-width:27}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fadein{from{opacity:0}}

body:not(#x) .ov-ic.ic-bg-violet{background:var(--grad)}
body:not(#x) .ov-ic.ic-bg-blue{background:linear-gradient(135deg,#38bdf8,#6366f1)}
body:not(#x) .ov-ic.ic-bg-green{background:linear-gradient(135deg,#38bdf8,#3b82f6)}
body:not(#x) .ov-ic.ic-bg-pink{background:linear-gradient(135deg,#818cf8,#6366f1)}
body:not(#x) .ov-hero>div{flex:1 1 340px}
body:not(#x) .ov-filters{flex:0 1 auto}


body:not(#x) .ov-leads td,body:not(#x) .ov-leads th{padding:13px 10px}
body:not(#x) .ov-leads .table-wrap{overflow-x:auto}


/* ---- clean white canvas ---- */
.aurora{display:none!important}
html,body,body.modern-crm{background:#fff!important}
body:not(#x) .card,body:not(#x) .metric,body:not(#x) .stat-tile,body:not(#x) .ov-kpi,body:not(#x) .admin-kpis article,body:not(#x) .employee-card,body:not(#x) .lead-pick-card,body:not(#x) .topbar,body:not(#x) .sidebar,body:not(#x) .lead-toolbar,body:not(#x) .ov-filters,body:not(#x) .scope-switch:not(.is-scoped){background:#fff!important; border:1px solid rgba(30,40,90,.09)!important;
    box-shadow:0 1px 2px rgba(30,40,90,.05),0 8px 24px rgba(30,40,90,.06)!important; backdrop-filter:none;}
body:not(#x) .sidebar{background:#fbfbfe!important}
body:not(#x) .sidebar nav a.active{background:hsl(var(--brand-h) 90% 96%)!important; box-shadow:inset 0 0 0 1px hsl(var(--brand-h) 80% 88%)!important}
body:not(#x) .card:hover,body:not(#x) .ov-kpi:hover,body:not(#x) .employee-card:hover{box-shadow:0 2px 4px rgba(30,40,90,.06),0 16px 40px rgba(30,40,90,.12)!important}
body:not(#x) .login-layout{background:#fff!important}
body:not(#x) .table-wrap{background:#fff; border-color:rgba(30,40,90,.08)}
body:not(#x) .btn{background:#fff; border-color:rgba(30,40,90,.14)}
body:not(#x) .stage-chip,body:not(#x) .tab-bar,body:not(#x) .focus-tabs,body:not(#x) .admin-tabs{background:#f4f5fb}
body:not(#x) .stage-chip.on,body:not(#x) .tab-btn.active,body:not(#x) .tab-bar button.active{background:var(--grad)}
body:not(#x) .metric:before,body:not(#x) .admin-kpis article:before{opacity:.12}


/* ======================= Live status + Live Team board ======================= */
:root{--s-available:#10b981; --s-on_call:#3b82f6; --s-break:#f59e0b; --s-lunch:#f97316; --s-meeting:#8b5cf6; --s-training:#06b6d4; --s-offline:#9aa3bf}
body:not(#x) .presence-pill{position:relative; flex:0 0 auto}
body:not(#x) .pp-btn{display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 8px 0 12px; border-radius:12px; border:1px solid var(--glass-border); background:#fff; font:650 13px "Inter",sans-serif; color:var(--ink); cursor:pointer}
body:not(#x) .pp-btn .material-symbols-rounded{font-size:18px; color:var(--muted)}
body:not(#x) .pp-dot{width:10px; height:10px; border-radius:50%; background:var(--s-available); box-shadow:0 0 0 3px rgba(16,185,129,.18); flex:0 0 auto; display:inline-block}
body:not(#x) .presence-pill[data-status="break"] .pp-btn .pp-dot{background:var(--s-break); box-shadow:0 0 0 3px rgba(245,158,11,.2)}
body:not(#x) .presence-pill[data-status="lunch"] .pp-btn .pp-dot{background:var(--s-lunch); box-shadow:0 0 0 3px rgba(249,115,22,.2)}
body:not(#x) .presence-pill[data-status="meeting"] .pp-btn .pp-dot{background:var(--s-meeting); box-shadow:0 0 0 3px rgba(139,92,246,.2)}
body:not(#x) .presence-pill[data-status="training"] .pp-btn .pp-dot{background:var(--s-training); box-shadow:0 0 0 3px rgba(6,182,212,.2)}
body:not(#x) .presence-pill[data-status="on_call"] .pp-btn .pp-dot{background:var(--s-on_call); box-shadow:0 0 0 3px rgba(59,130,246,.22); animation:ppPulse 1.6s ease-in-out infinite}
body:not(#x) .presence-pill[data-status="available"] .pp-btn .pp-dot{animation:ppPulse 2.4s ease-in-out infinite}
body:not(#x) .pp-menu{position:absolute; top:calc(100% + 8px); right:0; z-index:120; min-width:190px; padding:6px; border-radius:14px; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-lg); display:grid; gap:2px}
body:not(#x) .pp-menu[hidden]{display:none}
body:not(#x) .pp-menu button{display:flex; align-items:center; gap:10px; padding:9px 10px; border:0; border-radius:10px; background:none; font:600 13px "Inter",sans-serif; color:var(--ink-soft); cursor:pointer; text-align:left}
body:not(#x) .pp-menu button:hover{background:var(--field); color:var(--ink)}
body:not(#x) .pp-menu button.on{background:hsl(var(--brand-h) 90% 96%); color:var(--accent2)}
body:not(#x) .pp-menu .pp-dot{box-shadow:none}
body:not(#x) .pp-menu .s-available{background:var(--s-available)}
body:not(#x) .pp-menu .s-break{background:var(--s-break)}
body:not(#x) .pp-menu .s-lunch{background:var(--s-lunch)}
body:not(#x) .pp-menu .s-meeting{background:var(--s-meeting)}
body:not(#x) .pp-menu .s-training{background:var(--s-training)}
body:not(#x) .live-counts{display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; margin:0 0 14px}
body:not(#x) .lc{display:grid; justify-items:start; gap:2px; padding:12px 14px; border-radius:14px; background:#fff; border:1px solid var(--line); border-top:3px solid var(--c,#9aa3bf)}
body:not(#x) .lc .material-symbols-rounded{font-size:19px; color:var(--c,#9aa3bf)}
body:not(#x) .lc b{font:750 24px "Outfit",sans-serif; color:var(--ink)}
body:not(#x) .lc small{font-size:11.5px; color:var(--muted); font-weight:600}
body:not(#x) .lc.s-on_call{--c:var(--s-on_call)}
body:not(#x) .lc.s-available{--c:var(--s-available)}
body:not(#x) .lc.s-break{--c:var(--s-break)}
body:not(#x) .lc.s-lunch{--c:var(--s-lunch)}
body:not(#x) .lc.s-meeting{--c:var(--s-meeting)}
body:not(#x) .lc.s-training{--c:var(--s-training)}
body:not(#x) .lc.s-offline{--c:var(--s-offline)}
body:not(#x) .lc.pool{--c:var(--accent2)}
body:not(#x) .dist-card{display:flex; align-items:center; justify-content:space-between; gap:14px 20px; flex-wrap:wrap; margin:0 0 14px!important}
body:not(#x) .dist-main{display:flex; gap:12px; align-items:center; flex:1 1 360px}
body:not(#x) .dist-ic{width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:var(--grad); color:#fff; font-size:21px; flex:0 0 40px}
body:not(#x) .dist-main h2{margin:0}
body:not(#x) .dist-main p{margin:2px 0 0!important; font-size:12.5px!important; color:var(--muted)!important}
body:not(#x) .dist-controls{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
body:not(#x) .dist-controls label:not(.check){display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); font-weight:650}
body:not(#x) .dist-controls select{height:36px!important; width:auto!important; margin:0!important}
body:not(#x) .dist-controls .btn{height:36px}
body:not(#x) .live-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:12px}
body:not(#x) .agent-card{padding:14px 16px; border-radius:16px; background:#fff; border:1px solid var(--line); border-left:4px solid var(--c,#9aa3bf); box-shadow:0 1px 2px rgba(30,40,90,.04); display:grid; gap:10px}
body:not(#x) .agent-card.s-on_call{--c:var(--s-on_call); background:linear-gradient(180deg,rgba(59,130,246,.06),#fff 60%)}
body:not(#x) .agent-card.s-available{--c:var(--s-available)}
body:not(#x) .agent-card.s-break{--c:var(--s-break)}
body:not(#x) .agent-card.s-lunch{--c:var(--s-lunch)}
body:not(#x) .agent-card.s-meeting{--c:var(--s-meeting)}
body:not(#x) .agent-card.s-training{--c:var(--s-training)}
body:not(#x) .agent-card.s-offline{--c:var(--s-offline); opacity:.72}
body:not(#x) .ac-top{display:flex; align-items:center; gap:10px}
body:not(#x) .ac-top .avatar{position:relative; width:38px; height:38px; display:grid; place-items:center; flex:0 0 auto}
body:not(#x) .ac-dot{position:absolute; right:-3px; bottom:-3px; width:12px; height:12px; border-radius:50%; background:var(--c,#9aa3bf); border:2px solid #fff}
body:not(#x) .ac-top .grow{min-width:0}
body:not(#x) .ac-top strong{display:block; font-size:14px}
body:not(#x) .ac-top small{display:block; font-size:11.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
body:not(#x) .ac-status{flex:0 0 auto; padding:4px 10px; border-radius:999px; font-size:11.5px; font-weight:700; color:var(--c,#9aa3bf); background:var(--field)}
body:not(#x) .ac-status em{font-style:normal; font-weight:600; opacity:.85}
body:not(#x) .ac-lead{display:flex; align-items:center; gap:6px; margin:0!important; font-size:12.5px!important; color:var(--s-on_call)!important; font-weight:650}
body:not(#x) .ac-lead .material-symbols-rounded{font-size:16px}
body:not(#x) .ac-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin:0}
body:not(#x) .ac-stats div{padding:6px 8px; border-radius:10px; background:var(--field); text-align:center}
body:not(#x) .ac-stats dt{font-size:10.5px; color:var(--muted); font-weight:650}
body:not(#x) .ac-stats dd{margin:0; font:750 16px "Outfit",sans-serif; color:var(--ink)}
body:not(#x) .ac-foot{display:flex; flex-wrap:wrap; gap:4px 12px; font-size:11.5px; color:var(--muted)}

@keyframes ppPulse{50%{box-shadow:0 0 0 6px rgba(16,185,129,0)}}
@media (max-width:1200px){ body:not(#x) .live-counts{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:760px){ body:not(#x) .live-counts{grid-template-columns:repeat(2,minmax(0,1fr))} body:not(#x) .pp-label{display:none} }

body:not(#x) .live-tools{display:flex; justify-content:flex-end; margin:-4px 0 10px}
body:not(#x) .live-tools .check{font-size:12.5px!important; font-weight:600; color:var(--muted)}
body:not(#x) .live-grid.hide-offline .agent-card.s-offline{display:none}


/* ======================= Lead record cockpit + Follow-up board ======================= */
body:not(#x) .lead-hero{margin:0 0 18px; padding:22px 24px; border-radius:var(--radius); background:#fff; border:1px solid rgba(30,40,90,.09); box-shadow:0 1px 2px rgba(30,40,90,.05),0 10px 30px rgba(30,40,90,.07); position:relative; overflow:hidden}
body:not(#x) .lead-hero:before{content:""; position:absolute; inset:0 0 auto 0; height:4px; background:var(--grad)}
body:not(#x) .lead-hero-main{display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap}
body:not(#x) .lead-hero .avatar.lg{width:68px; height:68px; font-size:28px; border-radius:20px; display:grid; place-items:center; flex:0 0 auto}
body:not(#x) .lead-hero-id{flex:1 1 320px; min-width:0}
body:not(#x) .lead-hero-id h1{font-size:30px; margin:2px 0 6px}
body:not(#x) .lead-contact-line{display:flex; align-items:center; flex-wrap:wrap; gap:6px 8px; margin:0 0 12px; color:var(--ink-soft); font-size:13.5px}
body:not(#x) .lead-contact-line .material-symbols-rounded{font-size:17px; color:var(--accent2)}
body:not(#x) .lead-contact-line .material-symbols-rounded:not(:first-child){margin-left:10px}
body:not(#x) .lead-chips{display:flex; flex-wrap:wrap; gap:8px}
body:not(#x) .meta-chip{display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:999px; font-size:12.5px; font-weight:600; color:var(--ink-soft); background:var(--field); border:1px solid var(--line)}
body:not(#x) .meta-chip .material-symbols-rounded{font-size:16px; color:var(--accent2)}
body:not(#x) .meta-chip.warn{background:var(--amber-bg); color:var(--amber); border-color:transparent}
body:not(#x) .meta-chip.warn .material-symbols-rounded{color:var(--amber)}
body:not(#x) .stage-pill.large{padding:6px 14px; font-size:12.5px; background:var(--grad); color:#fff}
body:not(#x) .lead-hero-actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-left:auto}
body:not(#x) .lead-hero-actions .btn{height:44px; padding:0 18px; font-size:14px}
body:not(#x) .lead-hero-actions .btn.call{padding:0 26px; font-size:15px}
body:not(#x) .lead-hero .call-status{margin-top:10px}
body:not(#x) .lead-hero .call-status:empty{display:none}
body:not(#x) .stepper{list-style:none; display:flex; margin:22px 0 0; padding:0; gap:0; overflow-x:auto; scrollbar-width:none}
body:not(#x) .stepper::-webkit-scrollbar{display:none}
body:not(#x) .stepper li{flex:1 1 0; min-width:92px; display:grid; justify-items:center; gap:8px; position:relative; text-align:center; font-size:11.5px; font-weight:600; color:var(--muted)}
body:not(#x) .stepper li:before{content:""; position:absolute; top:13px; left:-50%; width:100%; height:3px; border-radius:3px; background:var(--line-strong); z-index:0}
body:not(#x) .stepper li:first-child:before{display:none}
body:not(#x) .stepper li.done:before,body:not(#x) .stepper li.current:before{background:var(--grad)}
body:not(#x) .stepper li i{position:relative; z-index:1; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; font-style:normal; font-size:12px; font-weight:700; background:#fff; border:2px solid var(--line-strong); color:var(--muted)}
body:not(#x) .stepper li i .material-symbols-rounded{font-size:16px}
body:not(#x) .stepper li.done i{background:var(--grad); border-color:transparent; color:#fff}
body:not(#x) .stepper li.current i{background:#fff; border-color:var(--brand); color:var(--accent2); box-shadow:0 0 0 5px hsl(var(--brand-h) 90% 60% /.2); animation:pulse 2.2s ease-in-out infinite}
body:not(#x) .stepper li.done,body:not(#x) .stepper li.current{color:var(--ink)}
body:not(#x) .stepper li.current{font-weight:750}
body:not(#x) .off-path{margin:14px 0 0; font-size:12.5px; color:var(--muted)}
body:not(#x) .record-nav{display:none}
body:not(#x) .lead-workspace{display:grid; grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr); gap:18px; align-items:start}
body:not(#x) .lead-workspace>.card{margin:0}
body:not(#x) .quick-card .stage-actions{display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:8px}
body:not(#x) .stage-btn{padding:10px 12px; border-radius:12px; font-weight:600; background:#fff; border:1px solid var(--line-strong); cursor:pointer; transition:all .2s var(--ease)}
body:not(#x) .stage-btn:hover{transform:translateY(-2px); border-color:var(--brand); box-shadow:var(--shadow)}
body:not(#x) .stage-btn.current{background:var(--grad); color:#fff; border-color:transparent}
body:not(#x) .stage-btn.success:hover{border-color:var(--good)}
body:not(#x) .stage-btn.danger:hover{border-color:var(--danger)}
body:not(#x) .followup-actions{display:flex; flex-wrap:wrap; gap:8px}
body:not(#x) .qu-section{padding:14px 0; border-top:1px solid var(--line)}
body:not(#x) .qu-section:first-child{border-top:0; padding-top:0}
body:not(#x) .quick-label{font-size:11px; letter-spacing:.9px; text-transform:uppercase; font-weight:700; color:var(--muted); margin-bottom:8px; display:flex; gap:8px; align-items:baseline}
body:not(#x) .quick-hint{text-transform:none; letter-spacing:0; font-weight:500; color:var(--muted)}
body:not(#x) .contact-card{position:sticky; top:84px}
body:not(#x) .contact-meta{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:10px 0 14px}
body:not(#x) .contact-meta>div{padding:10px 12px; border-radius:12px; background:var(--field); border:1px solid var(--line)}
body:not(#x) .contact-meta small{display:block; font-size:10.5px; color:var(--muted)}
body:not(#x) .contact-meta strong{font-size:12.5px; color:var(--ink); font-weight:650; overflow-wrap:anywhere}
body:not(#x) .contact-quick-block{padding:14px 0; border-top:1px solid var(--line)}
body:not(#x) .call-row{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1.6fr) auto; gap:14px; align-items:center; padding:14px 16px; border:1px solid var(--line); border-radius:14px; margin-bottom:10px; background:#fff}
body:not(#x) .call-row audio{width:100%; height:38px}
body:not(#x) .call-qc{display:flex; gap:8px; align-items:center}
body:not(#x) .call-main strong{display:block; font-size:13.5px}
body:not(#x) .call-main span{color:var(--muted); font-size:12.5px}
body:not(#x) .whatsapp-card .chat-thread{background:var(--field); border:1px solid var(--line); border-radius:16px; padding:16px; min-height:180px; max-height:380px; overflow:auto; display:flex; flex-direction:column; gap:10px}
body:not(#x) .chat-bubble.in{align-self:flex-start; background:#fff; border:1px solid var(--line); border-radius:16px 16px 16px 4px; max-width:78%; padding:10px 14px}
body:not(#x) .chat-bubble.out{align-self:flex-end; background:var(--grad); color:#fff; border-radius:16px 16px 4px 16px; max-width:78%; padding:10px 14px; border:0}
body:not(#x) .chat-bubble.out .chat-meta{color:rgba(255,255,255,.8)}
body:not(#x) .chat-meta{font-size:10.5px; color:var(--muted); margin-top:4px}
body:not(#x) .chat-composer{display:flex; gap:10px; margin-top:12px; align-items:flex-end}
body:not(#x) .chat-composer textarea{flex:1}
body:not(#x) .fup-tabs{display:none}
body:not(#x) .fup-board{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:start}
body:not(#x) .fup-board .tab-panel[hidden]{display:block!important}
body:not(#x) .fup-col{background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius); padding:14px; min-height:260px}
body:not(#x) .fup-head{display:flex; align-items:center; gap:10px; margin:2px 4px 14px}
body:not(#x) .fup-head h2{margin:0; font-size:15px; flex:1}
body:not(#x) .fup-head .material-symbols-rounded{width:32px; height:32px; border-radius:10px; display:grid; place-items:center; font-size:19px; color:#fff}
body:not(#x) .fup-col.overdue .fup-head .material-symbols-rounded{background:linear-gradient(135deg,#fb7185,#f97316)}
body:not(#x) .fup-col.today .fup-head .material-symbols-rounded{background:linear-gradient(135deg,#fbbf24,#f97316)}
body:not(#x) .fup-col.upcoming .fup-head .material-symbols-rounded{background:var(--grad)}
body:not(#x) .fup-head b{min-width:28px; text-align:center; padding:3px 9px; border-radius:999px; background:#fff; border:1px solid var(--line); font-size:12px}
body:not(#x) .followup-list{display:grid; gap:12px}
body:not(#x) .fup-card{padding:14px 16px; border-radius:16px; background:#fff; border:1px solid var(--line); box-shadow:0 1px 2px rgba(30,40,90,.04); display:grid; gap:12px; transition:transform .25s var(--ease), box-shadow .25s}
body:not(#x) .fup-card:hover{transform:translateY(-3px); box-shadow:var(--shadow)}
body:not(#x) .fup-card.overdue{border-left:3px solid var(--danger)}
body:not(#x) .fup-card.today{border-left:3px solid var(--amber)}
body:not(#x) .fup-card.upcoming{border-left:3px solid var(--brand)}
body:not(#x) .fup-top{display:flex; gap:12px; align-items:center}
body:not(#x) .fup-top .avatar{width:38px; height:38px; display:grid; place-items:center; flex:0 0 auto}
body:not(#x) .fup-top .grow{min-width:0}
body:not(#x) .fup-name{display:block; font-weight:700; color:var(--ink); font-size:14.5px}
body:not(#x) .fup-sub{display:block; font-size:12px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
body:not(#x) .fup-meta{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
body:not(#x) .due-chip{display:inline-flex; align-items:center; gap:6px; font-size:12px; padding:4px 10px; border-radius:999px; background:var(--field); color:var(--ink-soft)}
body:not(#x) .due-chip .material-symbols-rounded{font-size:15px}
body:not(#x) .due-chip b{font-weight:650}
body:not(#x) .due-chip em{font-style:normal; color:var(--muted)}
body:not(#x) .due-chip.is-late{background:var(--danger-bg); color:var(--danger)}
body:not(#x) .due-chip.is-late em{color:var(--danger)}
body:not(#x) .fup-actions{display:flex; gap:8px}
body:not(#x) .fup-empty{display:grid; justify-items:center; gap:4px; padding:36px 10px; color:var(--muted); text-align:center}
body:not(#x) .fup-empty .material-symbols-rounded{font-size:34px; color:var(--good); opacity:.8}
body:not(#x) .fup-empty strong{color:var(--ink)}

@keyframes pulse{50%{box-shadow:0 0 0 9px hsl(var(--brand-h) 90% 60% /.08)}}
@media (max-width:1100px){
  body:not(#x) .lead-workspace{grid-template-columns:1fr}
  body:not(#x) .contact-card{position:static}
  body:not(#x) .fup-tabs{display:inline-flex}
  body:not(#x) .fup-board{grid-template-columns:1fr}
  body:not(#x) .fup-board .tab-panel[hidden]{display:none!important}
  body:not(#x) .fup-col{background:none; border:0; padding:0}
  body:not(#x) .fup-head{display:none}
}
@media (max-width:760px){
  body:not(#x) .call-row{grid-template-columns:1fr}
  body:not(#x) .lead-hero-actions{margin-left:0; width:100%}
  body:not(#x) .lead-hero-actions .btn{flex:1 1 140px}
  body:not(#x) .contact-meta{grid-template-columns:1fr 1fr}
}

body:not(#x) .lead-workspace>.card+.card{margin-top:0}
body:not(#x) .quick-card .stack{gap:0}


/* ======================= Reports + Call quality ======================= */
body:not(#x) form.filters,body:not(#x) .report-filter form{display:flex!important; flex-wrap:wrap; gap:10px; align-items:flex-end; padding:12px!important; margin:0 0 18px!important;
    border-radius:16px!important; background:#fff!important; border:1px solid rgba(30,40,90,.09)!important;
    box-shadow:0 1px 2px rgba(30,40,90,.05),0 6px 18px rgba(30,40,90,.05)!important;}
body:not(#x) form.filters label,body:not(#x) .report-filter form label{display:grid; gap:4px; margin:0; flex:1 1 150px; min-width:130px; max-width:240px; font-size:10px; letter-spacing:.9px; text-transform:uppercase; font-weight:700; color:var(--muted)}
body:not(#x) form.filters select,body:not(#x) form.filters input,body:not(#x) .report-filter select,body:not(#x) .report-filter input{height:38px; padding:0 10px; font-size:13px; text-transform:none; letter-spacing:0; font-weight:500; color:var(--ink); width:100%}
body:not(#x) form.filters>.btn,body:not(#x) .report-filter form>.btn,body:not(#x) .report-filter .form-end{height:38px; flex:0 0 auto}
body:not(#x) .report-filter .form-end{display:flex; gap:8px}
body:not(#x) .report-summary{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:0 0 20px}
body:not(#x) .report-summary.three{grid-template-columns:repeat(3,minmax(0,1fr))}
body:not(#x) .report-summary>div{position:relative; overflow:hidden; padding:18px 20px 18px 24px!important; border-radius:var(--radius)!important; background:#fff!important; border:1px solid rgba(30,40,90,.09)!important; box-shadow:0 1px 2px rgba(30,40,90,.05),0 8px 24px rgba(30,40,90,.06)!important; transition:transform .25s var(--ease), box-shadow .3s}
body:not(#x) .report-summary>div:before{content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--grad)}
body:not(#x) .report-summary>div:nth-child(2):before{background:linear-gradient(180deg,#38bdf8,#6366f1)}
body:not(#x) .report-summary>div:nth-child(3):before{background:linear-gradient(180deg,#38bdf8,#3b82f6)}
body:not(#x) .report-summary>div:nth-child(4):before{background:linear-gradient(180deg,#818cf8,#6366f1)}
body:not(#x) .report-summary>div:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg)!important}
body:not(#x) .report-summary strong{font-family:"Outfit",sans-serif; font-weight:750!important; font-size:34px!important}
body:not(#x) .rate{display:inline-flex; align-items:center; gap:10px; min-width:130px}
body:not(#x) .rate-bar{flex:0 0 64px; height:6px; border-radius:6px; background:rgba(100,110,180,.14); position:relative; overflow:hidden}
body:not(#x) .rate-bar i{position:absolute; inset:0; width:var(--w); border-radius:6px; background:var(--grad); animation:grow .9s var(--ease) both}
body:not(#x) .rate-bar.alt i{background:linear-gradient(90deg,#38bdf8,#3b82f6)}
body:not(#x) .campaign-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(420px,1fr)); gap:18px}
body:not(#x) .campaign-card{margin:0!important}
body:not(#x) .funnel{display:grid; gap:10px; margin:6px 0 16px}
body:not(#x) .fn-row{display:grid; grid-template-columns:104px 1fr 38px; align-items:center; gap:12px; font-size:12.5px; color:var(--ink-soft)}
body:not(#x) .fn-row b{text-align:right; font:750 15px "Outfit",sans-serif; color:var(--ink)}
body:not(#x) .fn-bar{height:14px; border-radius:14px; background:rgba(100,110,180,.12); overflow:hidden}
body:not(#x) .fn-bar i{display:block; width:var(--w); min-width:6px; height:100%; border-radius:14px; background:var(--grad); animation:grow .9s var(--ease) both}
body:not(#x) .fn-row:nth-child(2) .fn-bar i{background:linear-gradient(90deg,#38bdf8,#6366f1)}
body:not(#x) .fn-row:nth-child(3) .fn-bar i{background:linear-gradient(90deg,#fbbf24,#f97316)}
body:not(#x) .fn-row:nth-child(4) .fn-bar i{background:linear-gradient(90deg,#38bdf8,#3b82f6)}
body:not(#x) .cost-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin:0}
body:not(#x) .cost-grid>div{padding:10px 12px; border-radius:12px; background:var(--field); border:1px solid var(--line)}
body:not(#x) .cost-grid>div.wide{grid-column:1/-1}
body:not(#x) .cost-grid dt{font-size:11px; color:var(--muted); font-weight:600}
body:not(#x) .cost-grid dd{margin:2px 0 0; font:700 15px "Outfit",sans-serif; color:var(--ink)}
body:not(#x) .qc-summary{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:18px}
body:not(#x) .qc-stat{display:flex; align-items:center; gap:20px; padding:18px 22px; border-radius:var(--radius); background:#fff; border:1px solid rgba(30,40,90,.09); box-shadow:0 1px 2px rgba(30,40,90,.05),0 8px 24px rgba(30,40,90,.06)}
body:not(#x) .qc-stat small{display:block; color:var(--muted); font-weight:650; font-size:12px}
body:not(#x) .qc-stat strong{display:block; font:750 26px "Outfit",sans-serif; margin:2px 0}
body:not(#x) .qc-stat span{color:var(--muted); font-size:12px}
body:not(#x) .qc-ring-lg{--c:var(--brand); width:96px; height:96px; border-radius:50%; flex:0 0 auto; position:relative; display:grid; place-content:center; text-align:center;
    background:conic-gradient(var(--c) calc(var(--p) * 1%), rgba(100,110,180,.14) 0)}
body:not(#x) .qc-ring-lg:before{content:""; position:absolute; inset:9px; border-radius:50%; background:#fff}
body:not(#x) .qc-ring-lg b,body:not(#x) .qc-ring-lg small{position:relative; z-index:1; line-height:1.1}
body:not(#x) .qc-ring-lg b{font:750 26px "Outfit",sans-serif; color:var(--ink)}
body:not(#x) .qc-ring-lg small{font-size:10.5px!important; color:var(--muted)}
body:not(#x) .qc-ring-lg.alt{--c:#10b981}
body:not(#x) .qc-toolbar{align-items:flex-end}
body:not(#x) .call-library{display:grid; grid-template-columns:repeat(auto-fill,minmax(440px,1fr)); gap:16px; margin-bottom:18px}
body:not(#x) .qc-call-card{padding:18px!important; display:grid; gap:12px; margin:0!important; background:#fff!important; transition:transform .25s var(--ease), box-shadow .25s}
body:not(#x) .qc-call-card:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg)!important}
body:not(#x) .qc-call-card.is-low{border-left:4px solid var(--danger)!important}
body:not(#x) .qc-call-top{display:flex; align-items:center; gap:12px}
body:not(#x) .qc-call-top .avatar{width:40px; height:40px; display:grid; place-items:center; flex:0 0 auto}
body:not(#x) .qc-call-top strong{display:block; font-size:14.5px}
body:not(#x) .qc-call-top span:not(.avatar):not(.score-ring):not(.status-pill){color:var(--muted); font-size:12px}
body:not(#x) .qc-call-card audio{width:100%; height:38px}
body:not(#x) .qc-call-bottom{display:flex; gap:12px; align-items:center; font-size:12.5px; color:var(--ink-soft)}
body:not(#x) .score-ring{--c:var(--amber); width:52px; height:52px; border-radius:50%; flex:0 0 auto; position:relative; display:grid; place-items:center;
    background:conic-gradient(var(--c) calc(var(--p) * 1%), rgba(100,110,180,.14) 0)}
body:not(#x) .score-ring:before{content:""; position:absolute; inset:5px; border-radius:50%; background:#fff}
body:not(#x) .score-ring b{position:relative; font:750 14px "Outfit",sans-serif; color:var(--ink)}
body:not(#x) .score-ring.high{--c:#10b981}
body:not(#x) .score-ring.low{--c:#f43f5e}
body:not(#x) .score-ring.mid{--c:#f59e0b}

@media (max-width:1100px){
  body:not(#x) .report-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(#x) .qc-summary{grid-template-columns:1fr}
}
@media (max-width:560px){
  body:not(#x) .report-summary,body:not(#x) .report-summary.three{grid-template-columns:1fr}
  body:not(#x) .campaign-grid,body:not(#x) .call-library{grid-template-columns:1fr}
  body:not(#x) .fn-row{grid-template-columns:84px 1fr 34px}
}

body:not(#x) .call-review-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:18px; align-items:start}
body:not(#x) .call-review-grid>.card{margin:0!important}
body:not(#x) .info-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:10px}
body:not(#x) .info-grid>div{background:var(--field)!important; border:1px solid var(--line)!important; box-shadow:none!important; padding:12px 14px!important; border-radius:12px!important}
body:not(#x) .info-grid small{color:var(--muted); font-size:11px}
body:not(#x) .info-grid strong{display:block; color:var(--ink); font-size:14px}
body:not(#x) .ai-action-panel .big-score,body:not(#x) .big-score{font:750 64px/1 "Outfit",sans-serif; background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent}
body:not(#x) .big-score small{-webkit-text-fill-color:var(--muted); font-size:18px}

@media (max-width:1100px){body:not(#x) .call-review-grid{grid-template-columns:1fr}}

body:not(#x) .call-facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:10px}
body:not(#x) .call-facts>div{background:var(--field)!important; border:1px solid var(--line)!important; border-radius:12px!important; padding:12px 14px!important}
body:not(#x) .call-facts small{display:block; color:var(--muted); font-size:11px}
body:not(#x) .call-facts strong{color:var(--ink); font-size:14px}


/* ======================= Data security ======================= */
.sec-watermark{position:fixed; inset:0; z-index:250; pointer-events:none; background-repeat:repeat}
body.sec-nocopy .content .lead-hero,body.sec-nocopy .content table,body.sec-nocopy .content .call-library,body.sec-nocopy .content .chat-history,body.sec-nocopy .content .contact-card,body.sec-nocopy .content .fup-board,body.sec-nocopy .content .dial-card{-webkit-user-select:none; user-select:none}
body.sec-nocopy .content input,body.sec-nocopy .content textarea{-webkit-user-select:text; user-select:text}
@media print{ body.sec-nocopy .app-frame{display:none!important} body.sec-nocopy:after{content:"Printing is disabled for this account."; display:block; padding:40px; font:600 18px sans-serif} }
body:not(#x) .sec-status{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px}
body:not(#x) .sec-pill{display:inline-flex; align-items:center; gap:7px; padding:6px 12px; border-radius:999px; font-size:12.5px; font-weight:650; border:1px solid var(--line); background:#fff; color:var(--ink-soft)}
body:not(#x) .sec-pill .material-symbols-rounded{font-size:17px}
body:not(#x) .sec-pill.ok .material-symbols-rounded{color:var(--good)}
body:not(#x) .sec-pill.off .material-symbols-rounded{color:var(--muted)}
body:not(#x) .sec-grid{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:14px; align-items:start; margin-bottom:14px}
body:not(#x) .sec-grid>.card{margin:0!important}
body:not(#x) .sec-events{display:grid; gap:10px}
body:not(#x) .sec-event{display:flex; gap:12px; align-items:flex-start; padding:12px 14px; border-radius:14px; border:1px solid var(--line); border-left:4px solid var(--amber); background:#fff}
body:not(#x) .sec-event.sev-high{border-left-color:var(--danger)}
body:not(#x) .sec-event.sev-low{border-left-color:var(--info)}
body:not(#x) .sec-event.done{opacity:.65}
body:not(#x) .sec-ic{width:34px; height:34px; flex:0 0 34px; border-radius:11px; display:grid; place-items:center; background:var(--field); color:var(--accent2); font-size:19px}
body:not(#x) .sec-event strong{display:block; font-size:13.5px}
body:not(#x) .sec-event span{font-size:12px; color:var(--muted)}
body:not(#x) .sec-event p{margin:4px 0 0!important; font-size:12.5px!important; color:var(--ink-soft)!important}
body:not(#x) .sec-actions{display:flex; flex-direction:column; gap:6px; align-items:flex-end}
body:not(#x) .sec-row-actions{display:flex; gap:6px; justify-content:flex-end}
body:not(#x) .sec-settings-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px}
body:not(#x) .sec-settings fieldset{display:grid; gap:10px; align-content:start}
body:not(#x) .day-chips{display:flex; flex-wrap:wrap; gap:6px}
body:not(#x) .sec-alert{background:linear-gradient(120deg,rgba(245,158,11,.14),rgba(245,158,11,.04))!important; border-color:rgba(245,158,11,.4)!important; border-left-color:var(--amber)!important}
body:not(#x) .sec-alert strong{display:inline-flex; align-items:center; gap:6px}
body:not(#x) .sec-alert strong .material-symbols-rounded{color:var(--amber)}
body:not(#x) .sec-alert .admin-alert-events a{color:var(--amber)!important; border-color:rgba(245,158,11,.4)!important}

@media (max-width:1000px){ body:not(#x) .sec-grid,body:not(#x) .sec-settings-grid{grid-template-columns:1fr} }

/* ======================= Settings & forms polish ======================= */
body:not(#x) .content .card>p,body:not(#x) .content .card form>p,body:not(#x) .content .card .stack>p{font-size:13px; line-height:1.6; color:var(--muted); max-width:760px; margin:6px 0 12px}
body:not(#x) .content .card h2{font-size:17px; margin:0 0 4px}
body:not(#x) .content .card .muted{color:var(--muted)}
body:not(#x) .content .card small,body:not(#x) .field-hint{display:block; font-size:12px; line-height:1.5; color:var(--muted); margin-top:5px}
body:not(#x) .content .stack{display:grid; gap:14px}
body:not(#x) .content .form-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px 16px; align-items:start}
body:not(#x) .content .form-grid .span-2{grid-column:span 2}
body:not(#x) .content .form-grid .span-3{grid-column:1/-1}
body:not(#x) .content label{font-size:12.5px; font-weight:650; color:var(--ink-soft)}
body:not(#x) .content label>input,body:not(#x) .content label>select,body:not(#x) .content label>textarea{margin-top:6px; width:100%}
body:not(#x) .content input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=search]),body:not(#x) .content select{height:42px; padding:0 12px}
body:not(#x) .content textarea{padding:10px 12px; line-height:1.5}
body:not(#x) .content fieldset{border:1px solid var(--line); border-radius:14px; padding:12px 16px; margin:0}
body:not(#x) .content legend{padding:0 8px; font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.8px}
body:not(#x) .content fieldset .check{display:inline-flex; margin:4px 18px 4px 0}
body:not(#x) .check{display:flex!important; align-items:center; gap:12px; margin:6px 0; cursor:pointer; font-weight:600; color:var(--ink)}
body:not(#x) .check input[type=checkbox]{appearance:none; -webkit-appearance:none; flex:0 0 auto; width:42px!important; height:24px!important; padding:0!important; margin:0!important; border-radius:999px!important; position:relative; cursor:pointer;
    background:#d6daea!important; border:0!important; transition:background .25s var(--ease)}
body:not(#x) .check input[type=checkbox]:after{content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(20,30,80,.3); transition:transform .25s var(--ease)}
body:not(#x) .check input[type=checkbox]:checked{background:var(--grad)!important}
body:not(#x) .check input[type=checkbox]:checked:after{transform:translateX(18px)}
body:not(#x) .check input[type=checkbox]:focus-visible{outline:3px solid hsl(var(--brand-h) 90% 60% /.35)!important; outline-offset:2px}
body:not(#x) td input[type=checkbox],body:not(#x) .did-agent-chip input,body:not(#x) .lead-pick-card input,body:not(#x) th input[type=checkbox]{width:18px; height:18px; accent-color:var(--brand)}
body:not(#x) .did-agent-chip{display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; background:var(--field); border:1px solid var(--line); font-size:12.5px; font-weight:600}
body:not(#x) .did-agent-chip:has(input:checked){background:var(--grad-soft); border-color:hsl(var(--brand-h) 90% 70% /.5); color:var(--accent2)}
body:not(#x) .did-agent-chip input{margin:0}
body:not(#x) form>div:last-child:has(>button.btn.primary),body:not(#x) .form-end{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
body:not(#x) form.stack>div:last-child:has(>.btn.primary[type=submit]){position:sticky; bottom:12px; z-index:5; padding:12px 16px; border-radius:16px; background:rgba(255,255,255,.92); backdrop-filter:blur(14px); border:1px solid rgba(30,40,90,.1); box-shadow:var(--shadow-lg)}
body:not(#x) .integration-card,body:not(#x) .integration-mini{padding:20px 22px!important}
body:not(#x) .integration-summary{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px}
body:not(#x) .integration-title{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
body:not(#x) .integration-title h2{margin:0}
body:not(#x) .webhook-box{padding:12px 14px!important; border-radius:12px!important; background:var(--field)!important; box-shadow:none!important; font-size:12.5px; overflow-wrap:anywhere}
body:not(#x) .copy-row,body:not(#x) .secret-row{display:flex; gap:8px; align-items:center}
body:not(#x) .copy-row input,body:not(#x) .secret-row input{flex:1}
body:not(#x) .copy-btn,body:not(#x) .reveal-secret{white-space:nowrap}
body:not(#x) .org-list{display:grid; gap:10px}
body:not(#x) .org-row{display:flex; align-items:center; gap:12px; padding:12px 14px!important; margin:0!important}
body:not(#x) .org-ic{width:36px; height:36px; border-radius:11px; display:grid; place-items:center; background:var(--grad-soft); color:var(--accent2)}
body:not(#x) .org-label{flex:1; font-weight:650}
body:not(#x) .did-row{display:grid; grid-template-columns:auto 1fr auto; gap:12px 14px; align-items:start; padding:16px 18px!important; margin-bottom:12px}
body:not(#x) .did-row>.grow{min-width:0}
body:not(#x) .did-agent-checks{display:flex; flex-wrap:wrap; gap:8px; margin:10px 0}
body:not(#x) dialog.modal{border:0; padding:0; width:min(640px,94vw); border-radius:22px; box-shadow:var(--shadow-lg); background:#fff; color:var(--ink)}
body:not(#x) dialog.modal::backdrop{background:rgba(20,24,60,.45); backdrop-filter:blur(6px)}
body:not(#x) .modal-head{display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid var(--line)}
body:not(#x) .modal-head h2{margin:0; font-size:18px}
body:not(#x) .modal-body{padding:20px 22px 24px}
body:not(#x) .modal-close{width:34px; height:34px; border-radius:10px; border:0; background:var(--field); cursor:pointer; display:grid; place-items:center; color:var(--ink-soft)}
body:not(#x) .modal-close:hover{background:var(--danger-bg); color:var(--danger)}
body:not(#x) .flash{padding:12px 16px; margin-bottom:14px; font-weight:600}
body:not(#x) .notice{padding:12px 16px; border-radius:12px; background:var(--info-bg); color:var(--ink-soft); font-size:13px}

@media (max-width:760px){
  body:not(#x) .content .form-grid .span-2{grid-column:1/-1}
  body:not(#x) .did-row{grid-template-columns:1fr}
}

body:not(#x) .content label>input[type=checkbox],body:not(#x) .content label>input[type=radio]{width:auto; margin-top:0}
body:not(#x) .did-agent-chip{display:inline-flex!important; font-weight:600}
body:not(#x) .did-agent-chip input[type=checkbox]{width:18px!important; height:18px!important; margin:0!important; flex:0 0 auto}
body:not(#x) .topbar input{height:100%!important; padding:0!important}
body:not(#x) .topbar-search input{margin:0!important}
body:not(#x) .scope-switch select{height:auto!important; padding:0 18px 0 0!important}
body:not(#x) form.stack>div:last-child:has(>.btn.primary[type=submit]){position:static; padding:0; background:none; border:0; box-shadow:none; backdrop-filter:none}
body:not(#x) .did-agent-checks{display:flex; flex-wrap:wrap; gap:8px}


body:not(#x) form.form-grid label.check,body:not(#x) .content label.check{text-transform:none!important; letter-spacing:0!important; font-size:13.5px!important; color:var(--ink)!important; max-width:none!important}
body:not(#x) form.form-grid label small,body:not(#x) form.filters label small,body:not(#x) .admin-filters label small{text-transform:none!important; letter-spacing:0!important; font-weight:500!important; font-size:12px!important; color:var(--muted)!important}
body:not(#x) .content .card form.form-grid{display:grid!important; padding:0!important; margin:0!important; background:none!important; border:0!important; box-shadow:none!important}
body:not(#x) .content .card form.form-grid label{max-width:none; text-transform:none; letter-spacing:0; font-size:12.5px; color:var(--ink-soft)}
body:not(#x) .content .card form.form-grid label>input,body:not(#x) .content .card form.form-grid label>select{height:42px}


body:not(#x) .content strong,body:not(#x) .content td,body:not(#x) .content dd{overflow-wrap:anywhere}
body:not(#x) .integration-note,body:not(#x) .webhook-box{overflow-wrap:anywhere; min-width:0}


@media (max-width:760px){
  body:not(#x) .page-head,body:not(#x) .ov-hero{flex-direction:row!important; align-items:flex-start}
  body:not(#x) .page-head>div:first-child,body:not(#x) .ov-hero>div:first-child{flex:1 1 100%}
  body:not(#x) .page-head>.btn,body:not(#x) .page-head>.actions{margin-left:0}
}

body:not(#x) .call-supervision{padding:22px; margin-bottom:20px; border:1px solid #dbe4f0; background:#fff}
body:not(#x) .supervision-heading{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px}
body:not(#x) .supervision-heading > div{flex:1; min-width:180px}
body:not(#x) .supervision-heading h2{margin:0; font-size:18px; color:#17223b}
body:not(#x) .supervision-heading p{margin:5px 0 0; font-size:13px; color:#526078}
body:not(#x) .supervision-icon{display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:#eef2ff; color:#4f46e5}
body:not(#x) #supervisionSetup p{font-size:13px; color:#475569; margin:0 0 9px}
body:not(#x) .supervision-links{display:flex; flex-wrap:wrap; gap:10px 20px; font-size:12px}
body:not(#x) .supervision-links a{color:#4338ca; text-decoration:underline; text-underline-offset:3px}
body:not(#x) #supervisionSession{margin-top:18px; padding:18px; background:#f8fafc; border-radius:12px; border:1px solid #e2e8f0}
body:not(#x) .supervision-current{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px}
body:not(#x) .supervision-current strong{display:block; font-size:16px; color:#17223b}
body:not(#x) .supervision-current #supervisionLead{display:block; margin-top:4px; color:#526078; font-size:13px; overflow-wrap:anywhere}
body:not(#x) .supervision-state{display:inline-block; border-radius:20px; padding:7px 11px; font-size:12px; font-weight:700; background:#e2e8f0; color:#334155}
body:not(#x) .supervision-state[data-state="listening"]{color:#166534; background:#dcfce7}
body:not(#x) .supervision-state[data-state="whispering"],body:not(#x) .supervision-state[data-state="switching"]{color:#9a3412; background:#ffedd5}
body:not(#x) .supervision-state[data-state="unknown"],body:not(#x) .supervision-state[data-state="failed"]{color:#991b1b; background:#fee2e2}
body:not(#x) #supervisionMessage{font-size:14px; line-height:1.6; color:#334155; margin:14px 0 6px}
body:not(#x) #supervisionPhone{display:block; color:#526078; font-size:12px}
body:not(#x) .supervision-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px}
body:not(#x) .supervision-actions .btn,body:not(#x) .ac-supervision .btn{display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:42px}
body:not(#x) .supervision-actions .material-symbols-rounded,body:not(#x) .ac-supervision .material-symbols-rounded{font-size:18px}
body:not(#x) .supervision-stop{color:#b91c1c; border-color:#fecaca; background:#fff}
body:not(#x) .supervision-footnote{font-size:12px; line-height:1.6; color:#526078; margin:12px 0 0}
body:not(#x) .supervision-error{padding:12px; color:#991b1b; background:#fef2f2; border:1px solid #fecaca; border-radius:10px; font-size:13px; line-height:1.5; margin-bottom:0}
body:not(#x) .ac-supervision{border-top:1px solid #e2e8f0; padding-top:12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap}
body:not(#x) .ac-supervision small{font-size:11px; color:#526078}
body:not(#x) .call-supervision [hidden]{display:none!important}
@media(max-width:600px){body:not(#x) .call-supervision{padding:16px}
body:not(#x) #supervisionSession{padding:14px}
body:not(#x) .supervision-actions .btn{width:100%}
body:not(#x) .supervision-heading > .btn{margin-left:58px}}


/* ======================= System-wide consistency pass ======================= */
body:not(#x) .page-head{display:flex; align-items:flex-end; justify-content:space-between; gap:18px; flex-wrap:wrap; margin:6px 0 20px}
body:not(#x) .page-head>div:first-child{flex:1 1 340px; min-width:0}
body:not(#x) .page-head h1,body:not(#x) .lead-header h1{font-size:30px; line-height:1.15; margin:0 0 6px}
body:not(#x) .page-head p:not(.eyebrow){margin:0; font-size:13.5px; max-width:720px; line-height:1.55}
body:not(#x) .page-head .eyebrow{margin:0 0 6px}
body:not(#x) .page-head .actions,body:not(#x) .page-head>.btn,body:not(#x) .page-head>a.btn{flex:0 0 auto}
body:not(#x) .title-row{display:flex; align-items:center; gap:14px}
body:not(#x) .title-ic{width:52px; height:52px; flex:0 0 auto; display:grid; place-items:center; color:#fff}
body:not(#x) .content-inner>.page-head+.page-head{margin-top:0}
body:not(#x) .admin-filters,body:not(#x) .filters form,body:not(#x) .qa-form,body:not(#x) form.report-filters{display:flex!important; flex-wrap:wrap; gap:10px; align-items:flex-end; padding:12px!important; margin:0 0 18px!important;
    border-radius:16px!important; background:#fff!important; border:1px solid rgba(30,40,90,.09)!important;
    box-shadow:0 1px 2px rgba(30,40,90,.05),0 6px 18px rgba(30,40,90,.05)!important;}
body:not(#x) .admin-filters label,body:not(#x) .filters form label,body:not(#x) .qa-form label,body:not(#x) form.report-filters label{display:grid; gap:4px; margin:0; flex:1 1 150px; min-width:130px; max-width:240px;
    font-size:10px; letter-spacing:.9px; text-transform:uppercase; font-weight:700; color:var(--muted);}
body:not(#x) .admin-filters input,body:not(#x) .admin-filters select,body:not(#x) .filters form input,body:not(#x) .filters form select,body:not(#x) .qa-form input,body:not(#x) .qa-form select{height:38px; padding:0 10px; font-size:13px; text-transform:none; letter-spacing:0; font-weight:500; color:var(--ink); width:100%; max-width:none;}
body:not(#x) .admin-filters>.btn,body:not(#x) .filters form>.btn,body:not(#x) .qa-form>.btn,body:not(#x) .admin-filters>button,body:not(#x) .filters form>button{height:38px; flex:0 0 auto}
body:not(#x) .metric small,body:not(#x) .stat-tile>span,body:not(#x) .report-summary span,body:not(#x) .admin-kpis article>span,body:not(#x) .metric>span:first-child{font-size:12px!important; font-weight:650; letter-spacing:.2px; color:var(--muted)!important; text-transform:none}
body:not(#x) .metric strong,body:not(#x) .report-summary strong{font-size:30px!important; letter-spacing:-.02em}
body:not(#x) .report-summary{gap:16px}
body:not(#x) .report-summary>div{padding:18px 20px}
body:not(#x) .metrics{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:16px; margin-bottom:20px}
body:not(#x) table th,body:not(#x) table td{padding:13px 14px!important}
body:not(#x) table th{white-space:nowrap}
body:not(#x) .table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch}
body:not(#x) .table-wrap table{min-width:640px}
body:not(#x) tbody tr:last-child td{border-bottom:0!important}
body:not(#x) td[colspan]{text-align:center; color:var(--muted); padding:34px 14px!important}
body:not(#x) .card-head{display:flex; align-items:flex-start; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:14px}
body:not(#x) .card-head h2{margin:0}
body:not(#x) .card-head p{margin:3px 0 0; font-size:12.5px}
body:not(#x) .card+.card{margin-top:18px}
body:not(#x) .grid-2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:start}
body:not(#x) .grid-2>.card{margin:0}
body:not(#x) .employee-grid,body:not(#x) .lead-card-grid{gap:18px}
body:not(#x) .employee-card{display:flex; flex-direction:column}
body:not(#x) .employee-card .text-link,body:not(#x) .employee-card-link{margin-top:auto; color:var(--accent2); font-weight:650}
body:not(#x) .employee-card-head p{text-transform:capitalize}
body:not(#x) .content details>summary{padding:14px 18px; list-style:none; display:flex; align-items:center; gap:10px}
body:not(#x) .content details>summary::-webkit-details-marker{display:none}
body:not(#x) .content details>summary:before{content:"chevron_right"; font-family:"Material Symbols Rounded"; font-size:20px; color:var(--accent2); transition:transform .25s var(--ease)}
body:not(#x) .content details[open]>summary:before{transform:rotate(90deg)}
body:not(#x) .content details[open]>summary{border-bottom:1px solid var(--line)}
body:not(#x) .content details>:not(summary){padding-left:18px; padding-right:18px}
body:not(#x) .content details>:last-child{padding-bottom:16px}
body:not(#x) .empty-state{text-align:center; padding:48px 24px}
body:not(#x) .empty-state-icon{width:64px; height:64px; border-radius:20px; display:grid; place-items:center; margin:0 auto 14px}

@media (max-width:900px){
  body:not(#x) .grid-2{grid-template-columns:1fr}
}
@media (max-width:760px){
  body:not(#x) .admin-filters label,body:not(#x) .filters form label{flex:1 1 100%; max-width:none}
}

/* ---- sidebar groups ---- */
body:not(#x) .sidebar details.nav-group{margin:6px 0 0; padding:0; background:none!important; border:0!important; box-shadow:none!important}
body:not(#x) .sidebar details.nav-group>summary{display:flex; align-items:center; gap:8px; cursor:pointer; list-style:none; margin:12px 6px 4px; padding:7px 8px; border-radius:10px; transition:background .2s}
body:not(#x) .sidebar details.nav-group>summary:before{display:none}
body:not(#x) .sidebar details.nav-group>summary::-webkit-details-marker{display:none}
body:not(#x) .sidebar details.nav-group>summary:hover{background:var(--glass-hi)}
body:not(#x) .sidebar details.nav-group>summary .material-symbols-rounded{font-size:17px; color:var(--accent2)}
body:not(#x) .sidebar details.nav-group>summary:after{content:"expand_more"; font-family:"Material Symbols Rounded"; font-size:18px; margin-left:auto; color:var(--muted); transition:transform .25s var(--ease)}
body:not(#x) .sidebar details.nav-group:not([open])>summary:after{transform:rotate(-90deg)}
body:not(#x) .sidebar details.nav-group[open]>summary{color:var(--ink)}
body:not(#x) .sidebar details.nav-group .secondary-nav{margin:0 0 4px 8px; padding-left:8px; border-left:1px solid var(--line)}
body:not(#x) .sidebar details.nav-group .secondary-nav a{padding:7px 10px!important}
body:not(#x) .sidebar details.nav-group .secondary-nav a.active:before{left:-9px}


body:not(#x) .content details{padding:0!important}
body:not(#x) .content details>summary{padding:13px 18px!important; font-size:14px}
body:not(#x) .sidebar details.nav-group>summary{font-size:10px; letter-spacing:1px; line-height:1.25; margin:8px 4px 2px; padding:8px}
body:not(#x) .sidebar details.nav-group>summary.nav-label{margin-top:8px}


body:not(#x) .btn.small{min-height:30px!important; height:auto; padding:5px 12px!important; font-size:12px!important; border-radius:9px!important}
body:not(#x) td .btn{min-height:30px; padding:5px 12px; font-size:12px; border-radius:9px}
body:not(#x) td form{display:inline-block; margin:0 2px 0 0}
body:not(#x) .role-chip{display:inline-block; padding:3px 10px; border-radius:999px; font-size:11.5px; font-weight:650; background:hsl(var(--brand-h) 90% 96%); color:var(--accent2); text-transform:capitalize}


/* ---- message monitoring ---- */
body:not(#x) form.form-grid{display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; margin-bottom:16px}
body:not(#x) form.form-grid label{display:grid; gap:4px; margin:0; flex:1 1 150px; max-width:240px; font-size:10px; letter-spacing:.9px; text-transform:uppercase; font-weight:700; color:var(--muted)}
body:not(#x) form.form-grid select,body:not(#x) form.form-grid input:not([type=checkbox]){height:38px; padding:0 10px; font-size:13px; text-transform:none; letter-spacing:0; font-weight:500; color:var(--ink)}
body:not(#x) form.form-grid>.btn{height:38px; flex:0 0 auto}
body:not(#x) .policy-events{display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:16px; margin-top:14px}
body:not(#x) .policy-event{margin:0!important; padding:18px 20px!important; background:#fff!important; color:var(--ink)!important; border:1px solid var(--line)!important; border-left:4px solid var(--danger)!important; border-radius:16px!important; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:6px}
body:not(#x) .policy-event.policy-error{border-left-color:var(--amber)!important}
body:not(#x) .policy-event h3{margin:6px 0 0; font-size:15px}
body:not(#x) .policy-event p{margin:0; color:var(--ink-soft)}
body:not(#x) .policy-event small{color:var(--muted)}
body:not(#x) .policy-event .actions{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:8px; padding-top:12px; border-top:1px solid var(--line)}
body:not(#x) .policy-event .actions small{background:var(--field); padding:3px 9px; border-radius:999px; font-size:11px}
body:not(#x) .policy-badge{align-self:flex-start; border-radius:999px!important; padding:4px 11px!important; font-size:11.5px!important}
body:not(#x) .policy-badge.blocked{background:var(--danger-bg)!important; color:var(--danger)!important}
body:not(#x) .policy-badge.error{background:var(--amber-bg)!important; color:var(--amber)!important}
body:not(#x) .policy-badge.neutral{background:var(--field)!important; color:var(--ink-soft)!important}


/* ---- agent leads ---- */
body:not(#x) .list-context{margin:0 0 10px; padding:0 2px}
body:not(#x) .list-context strong{color:var(--ink)!important; font-size:15px!important}
body:not(#x) .surface-tag{background:hsl(var(--brand-h) 90% 96%)!important; border:0!important; color:var(--accent2)!important; border-radius:999px!important}
body:not(#x) .leads-card{padding:6px!important}
body:not(#x) .lead-bar{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:10px 12px 0}
body:not(#x) .lead-bar-views{display:flex; gap:8px; flex-wrap:wrap}
body:not(#x) .chip-link{display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; font-size:12.5px; font-weight:600; color:var(--accent2); background:hsl(var(--brand-h) 90% 96%)}
body:not(#x) .chip-link .material-symbols-rounded{font-size:16px}
body:not(#x) .chip-link:hover{background:hsl(var(--brand-h) 90% 92%)}
body:not(#x) .save-view{position:relative; margin-left:auto; padding:0!important; border:0!important; background:none!important; box-shadow:none!important}
body:not(#x) .save-view>summary{padding:6px 12px!important; border-radius:10px; font-size:12.5px!important; font-weight:600; color:var(--ink-soft); border:1px solid var(--line)!important}
body:not(#x) .save-view>summary:before{display:none!important}
body:not(#x) .save-view>summary .material-symbols-rounded{font-size:17px; color:var(--accent2)}
body:not(#x) .save-view[open]>summary{border-bottom:1px solid var(--line)!important}
body:not(#x) .save-view form{position:absolute; right:0; top:calc(100% + 8px); z-index:20; width:300px; display:grid; gap:10px; padding:16px!important; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-lg)}
body:not(#x) .lead-toolbar.flat{background:none!important; border:0!important; box-shadow:none!important; padding:12px!important; margin:0!important; backdrop-filter:none; align-items:center}
body:not(#x) .lead-toolbar.flat select{height:38px; min-width:160px}
body:not(#x) .lead-toolbar.flat .advanced-filters{flex:1 1 100%; padding:0!important; border:0!important; background:none!important; box-shadow:none!important}
body:not(#x) .lead-toolbar.flat .advanced-filters>summary{display:inline-flex!important; padding:6px 12px!important; font-size:12.5px!important; font-weight:600; color:var(--ink-soft); border:1px solid var(--line)!important; border-radius:10px}
body:not(#x) .lead-toolbar.flat .advanced-filters>summary:before{display:none!important}
body:not(#x) .lead-toolbar.flat .advanced-filters>summary .material-symbols-rounded{font-size:17px; color:var(--accent2)}
body:not(#x) .lead-toolbar.flat .advanced-filters .stack{display:flex; flex-wrap:wrap; gap:10px; padding:12px 0 2px!important}
body:not(#x) .lead-toolbar.flat .advanced-filters .stack>*{flex:1 1 170px; max-width:240px}
body:not(#x) .bulk-actions{margin:0 12px 10px; padding:0!important; border-radius:12px!important; background:var(--field)!important}
body:not(#x) .bulk-actions>summary{padding:10px 14px!important; font-size:13px!important; color:var(--ink-soft)}
body:not(#x) .bulk-actions form.filters{box-shadow:none!important; border:0!important; background:none!important; padding:4px 14px 14px!important}


body:not(#x) .lead-bar{padding:8px 12px 0}
body:not(#x) .lead-bar:not(:has(.chip-link)){justify-content:flex-end; padding-bottom:0}
body:not(#x) .save-view>summary{padding:4px 10px!important; font-size:12px!important}


@media (max-width:760px){
  body:not(#x) .topbar{padding:8px; gap:8px}
  body:not(#x) #sidebarToggle{order:1}
  body:not(#x) .scope-switch{order:2; flex:1 1 0; min-width:0}
  body:not(#x) .scope-switch select{max-width:100%}
  body:not(#x) .topbar-add{order:3}
  body:not(#x) .profile-control{order:4}
  body:not(#x) .topbar-search{order:5; flex:1 1 100%}
}

/* ---- topbar: one row, one height, no nested boxes ---- */
body:not(#x) .topbar{align-items:center; min-height:60px}
body:not(#x) .topbar>*{flex:0 0 auto; height:40px; margin-top:0; margin-bottom:0}
body:not(#x) .topbar-search{flex:1 1 220px!important; min-width:0; height:40px; padding:0 12px; display:flex; align-items:center; gap:8px}
body:not(#x) .topbar-search input,body:not(#x) .topbar-search input:hover,body:not(#x) .topbar-search input:focus{border:0!important; background:transparent!important; box-shadow:none!important; outline:none!important; height:100%!important; width:100%; padding:0!important; margin:0!important; border-radius:0!important; font-size:13.5px}
body:not(#x) .scope-switch{height:40px; padding:0 8px 0 12px; align-items:center}
body:not(#x) .scope-switch label{display:flex; flex-direction:column; justify-content:center; height:100%; margin:0}
body:not(#x) .scope-switch small{margin:0 0 1px; line-height:1}
body:not(#x) .scope-switch select{height:auto!important; line-height:1.2; padding:0 18px 0 0!important}
body:not(#x) .jump-button,body:not(#x) .profile-control,body:not(#x) .topbar .icon-btn,body:not(#x) .topbar-add{height:40px}
body:not(#x) .profile-control{display:flex; align-items:center}
body:not(#x) .topbar .jump-button{margin-left:auto}
body:not(#x) .topbar .profile-control{margin-left:0}

@media (max-width:760px){
  body:not(#x) .topbar>*{height:40px}
  body:not(#x) .topbar-search{flex:1 1 100%!important; order:5}
}

body:not(#x) .scope-switch label{gap:2px}
body:not(#x) .scope-switch small{font-size:9px; height:10px; line-height:10px; margin:0}
body:not(#x) .scope-switch select{height:18px!important; min-height:0!important; line-height:18px!important; padding:0 20px 0 0!important; margin:0!important; font-size:13.5px; appearance:none; -webkit-appearance:none;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236a7399' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 2px center!important}
body:not(#x) .scope-switch.is-scoped select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='white' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")!important}


/* ---- anchors never hide under the sticky bar; wrapping rows never overlap ---- */
html{scroll-padding-top:96px}
body:not(#x) [id],body:not(#x) .content section,body:not(#x) .content [data-focus-panel]{scroll-margin-top:96px}
body:not(#x) .did-row .grow>div:first-child,body:not(#x) .did-row .did-title{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px}
body:not(#x) .did-row strong{margin-right:4px}
body:not(#x) .org-tag{display:inline-block; white-space:nowrap; margin:0}
body:not(#x) .content input[type=datetime-local],body:not(#x) .content input[type=date],body:not(#x) .content input[type=time]{min-width:0; max-width:100%; width:100%}
body:not(#x) .content label{min-width:0; overflow-wrap:anywhere}
body:not(#x) .inline{display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end}
body:not(#x) .inline>label{flex:1 1 180px; min-width:0}


/* ======================= floating alerts: top-right for everything ======================= */
body:not(#x) .flash-wrap,body:not(#x) .toast-wrap{position:fixed!important; top:84px; right:20px; left:auto!important; bottom:auto!important; transform:none!important; width:min(380px,calc(100vw - 32px)); z-index:300; display:grid; gap:10px; justify-items:stretch; pointer-events:none; margin:0}
body:not(#x) .flash,body:not(#x) .toast{pointer-events:auto; display:flex; align-items:flex-start; gap:12px; padding:14px 16px!important; margin:0!important; border-radius:16px!important;
    background:#fff!important; color:var(--ink)!important; border:1px solid rgba(30,40,90,.1)!important; border-left:4px solid var(--info)!important;
    box-shadow:0 18px 50px rgba(30,40,90,.22),0 2px 6px rgba(30,40,90,.08)!important; font-size:13.5px; font-weight:600; line-height:1.45; animation:alertIn .45s var(--ease) both; position:relative; overflow:hidden}
body:not(#x) .flash:before,body:not(#x) .toast:before{content:"info"; font-family:"Material Symbols Rounded"; font-size:22px; color:var(--info); flex:0 0 auto; line-height:1}
body:not(#x) .flash.success,body:not(#x) .toast:not(.toast-error){border-left-color:var(--good)!important}
body:not(#x) .flash.success:before,body:not(#x) .toast:not(.toast-error):before{content:"check_circle"; color:var(--good)}
body:not(#x) .flash.error,body:not(#x) .toast-error{border-left-color:var(--danger)!important}
body:not(#x) .flash.error:before,body:not(#x) .toast-error:before{content:"error"; color:var(--danger)}
body:not(#x) .flash.warning{border-left-color:var(--amber)!important}
body:not(#x) .flash.warning:before{content:"warning"; color:var(--amber)}
body:not(#x) .toast-error{background:#fff!important}
body:not(#x) .alert-x{margin-left:auto; flex:0 0 auto; width:26px; height:26px; border:0; border-radius:8px; background:var(--field); color:var(--muted); cursor:pointer; display:grid; place-items:center; padding:0}
body:not(#x) .alert-x:hover{background:var(--danger-bg); color:var(--danger)}
body:not(#x) .alert-x .material-symbols-rounded{font-size:16px}
body:not(#x) .flash:after,body:not(#x) .toast:after{content:""; position:absolute; left:0; bottom:0; height:3px; width:100%; background:currentColor; opacity:.18; transform-origin:left; animation:alertBar var(--life,6s) linear forwards}
body:not(#x) .flash.leaving,body:not(#x) .toast-out{opacity:0!important; transform:translateX(24px)!important; transition:all .3s var(--ease)}

@keyframes alertIn{from{opacity:0; transform:translateX(40px) scale(.96)}to{opacity:1; transform:none}}
@keyframes alertBar{to{transform:scaleX(0)}}
@media (max-width:760px){body:not(#x) .flash-wrap,body:not(#x) .toast-wrap{top:72px; right:12px; width:calc(100vw - 24px)}}

/* ---- collapsed sidebar (desktop): slim icon rail ---- */
@media (min-width:761px){
  html.sidebar-collapsed body:not(#x) .sidebar{width:78px; padding:16px 10px; overflow:visible; flex:0 0 78px}
  html.sidebar-collapsed body:not(#x) .brand{justify-content:center; padding:0 0 6px}
  html.sidebar-collapsed body:not(#x) .brand>div,
  html.sidebar-collapsed body:not(#x) .nav-text,
  html.sidebar-collapsed body:not(#x) .sidebar>.nav-label,
  html.sidebar-collapsed body:not(#x) .sidebar-user .grow{display:none}
  html.sidebar-collapsed body:not(#x) .sidebar nav a{justify-content:center; padding:10px 0; gap:0}
  html.sidebar-collapsed body:not(#x) .sidebar nav a.active:before{left:-10px}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group{margin:4px 0}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary{justify-content:center; padding:8px 0; margin:2px 0; font-size:0}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary:after{display:none}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary .material-symbols-rounded{font-size:21px}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group .secondary-nav{margin:0; padding:0; border:0}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group:not([open])>.secondary-nav{display:none}
  html.sidebar-collapsed body:not(#x) .sidebar-user{flex-direction:column; gap:10px; align-items:center}
  html.sidebar-collapsed body:not(#x) .logout-ic{margin:0}
  html.sidebar-collapsed body:not(#x) .secondary-nav a{padding:10px 0!important}
}
@media (min-width:761px){
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary,
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary.nav-label{margin:2px 0!important; width:100%; padding:10px 0!important}
}

/* ---- collapsed rail: floating sub-menu on hover ---- */
@media (min-width:761px){
  html.sidebar-collapsed body:not(#x) .sidebar{position:relative; z-index:60}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group{position:relative}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>.secondary-nav,
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group[open]>.secondary-nav{display:none}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group.fly>.secondary-nav{
    display:grid; gap:2px; position:absolute; left:calc(100% + 6px); top:-6px; min-width:236px; padding:10px 8px 8px!important; margin:0!important;
    background:#fff; border:1px solid rgba(30,40,90,.1)!important; border-radius:16px; box-shadow:0 22px 60px rgba(30,40,90,.25),0 3px 8px rgba(30,40,90,.08); z-index:80; opacity:1!important; visibility:visible!important}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group.fly>.secondary-nav:before{
    content:attr(data-flyout-title); display:block; padding:2px 10px 8px; font-size:10.5px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:var(--muted)}
  /* invisible bridge so the pointer can travel from icon to menu */
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group.fly>.secondary-nav:after{content:""; position:absolute; left:-14px; top:0; width:14px; height:100%}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>.secondary-nav a{justify-content:flex-start; gap:10px; padding:9px 10px!important; border-radius:10px; width:100%}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>.secondary-nav .nav-text{display:inline!important; white-space:nowrap}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>.secondary-nav a.active:before{display:none}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary:hover{background:var(--grad-soft)}
}
@keyframes navFly{from{opacity:0; transform:translateX(-6px)}to{opacity:1; transform:translateX(0)}}

/* ---- collapsed rail: every icon in one centered column, same size and colour ---- */
@media (min-width:761px){
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary{display:flex!important; justify-content:center!important; align-items:center; padding:0!important; height:43px; border-radius:12px; gap:0!important}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary .material-symbols-rounded{width:26px; height:26px; display:grid; place-items:center; font-size:20px!important; color:var(--ink-soft)!important; margin:0; flex:0 0 26px; font-variation-settings:'FILL' 0,'wght' 500,'GRAD' 0,'opsz' 22}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group.fly>summary,
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary:hover{background:var(--grad-soft)}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group.fly>summary .material-symbols-rounded{color:var(--accent2)!important}
  html.sidebar-collapsed body:not(#x) .sidebar nav a .nav-ic{width:26px; height:26px; flex:0 0 26px; margin:0}
  html.sidebar-collapsed body:not(#x) .sidebar .primary-nav{gap:3px}
}
@media (min-width:761px){
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary{letter-spacing:0!important; word-spacing:0!important; text-indent:0!important}
}

/* ---- collapsed rail must always fit inside its glass panel ---- */
@media (min-width:761px){
  html.sidebar-collapsed body:not(#x) .sidebar{padding:12px 10px; display:flex; flex-direction:column}
  html.sidebar-collapsed body:not(#x) .sidebar nav{margin-top:6px!important}
  html.sidebar-collapsed body:not(#x) .sidebar nav a{min-height:38px; height:38px; padding:0}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group{margin:0}
  html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary{height:38px}
  html.sidebar-collapsed body:not(#x) .sidebar .primary-nav,html.sidebar-collapsed body:not(#x) .sidebar .secondary-nav{gap:2px}
  html.sidebar-collapsed body:not(#x) .brand{padding:0; margin-bottom:2px}
  html.sidebar-collapsed body:not(#x) .brand-mark{width:38px; height:38px}
  html.sidebar-collapsed body:not(#x) .sidebar-user{margin-top:auto; padding:8px 0 0; gap:6px}
  html.sidebar-collapsed body:not(#x) .logout-ic{width:34px; height:34px}
}
@media (min-width:761px) and (max-height:820px){
  html.sidebar-collapsed body:not(#x) .sidebar nav a,html.sidebar-collapsed body:not(#x) .sidebar details.nav-group>summary{height:33px; min-height:33px}
  html.sidebar-collapsed body:not(#x) .sidebar nav{margin-top:2px!important}
  html.sidebar-collapsed body:not(#x) .sidebar{padding:8px 10px}
}

/* ======================= Telecalling helpers: goal + call script ======================= */
body:not(#x) .goal-card{display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin:0 0 14px!important}
body:not(#x) .goal-ring{--c:#10b981; width:96px!important; height:96px!important}
body:not(#x) .goal-text{flex:1 1 280px; min-width:0}
body:not(#x) .goal-text h2{margin:0 0 4px}
body:not(#x) .goal-text p{margin:0 0 8px!important; color:var(--muted)!important; font-size:13px!important}
body:not(#x) .goal-stats{display:flex; flex-wrap:wrap; gap:8px}
body:not(#x) .goal-stats span{padding:4px 10px; border-radius:999px; background:var(--field); font-size:12px; color:var(--muted)}
body:not(#x) .goal-stats b{color:var(--ink)}
body:not(#x) .goal-card .btn.call{height:44px; padding:0 22px}
body:not(#x) .dial-side{display:grid; gap:14px; align-content:start}
body:not(#x) .dial-side>.card{margin:0!important}
body:not(#x) .script-card h2{display:flex; align-items:center; gap:8px}
body:not(#x) .script-card h2 .material-symbols-rounded{font-size:20px; color:var(--accent2)}
body:not(#x) .script-block{padding:10px 12px; border-radius:12px; background:var(--field); border:1px solid var(--line); margin-bottom:8px}
body:not(#x) .script-block h3{margin:0 0 4px; font-size:11px; letter-spacing:.8px; text-transform:uppercase; color:var(--muted)}
body:not(#x) .script-block p,body:not(#x) .script-block li{margin:0; font-size:13px; line-height:1.55; color:var(--ink); white-space:pre-line}
body:not(#x) .script-block ul{margin:0; padding-left:18px}
body:not(#x) .script-block.warn{background:var(--danger-bg); border-color:rgba(220,58,86,.25)}
body:not(#x) .script-block.warn h3{color:var(--danger)}
body:not(#x) .dial-layout.has-lead .queue-card{position:static}


/* ======================= Calm pass: fewer layers, smaller type, compact filters ======================= */
body:not(#x) .pi-anchor{position:relative; display:inline-flex; vertical-align:middle; margin-left:10px}
body:not(#x) .pi-help{width:28px; height:28px; border-radius:50%; border:1px solid var(--line-strong); background:#fff; color:var(--muted); display:grid; place-items:center; cursor:pointer; padding:0; transition:all .2s}
body:not(#x) .pi-help .material-symbols-rounded{font-size:18px}
body:not(#x) .pi-help:hover,body:not(#x) .pi-help.on{background:var(--grad); color:#fff; border-color:transparent}
body:not(#x) .pi-pop{position:absolute; top:calc(100% + 10px); left:-8px; z-index:90; width:min(420px,86vw); padding:16px; border-radius:16px; background:#fff; border:1px solid rgba(30,40,90,.1); box-shadow:0 24px 60px rgba(30,40,90,.22); font:500 13px/1.5 "Inter",sans-serif; color:var(--ink-soft); letter-spacing:0; text-transform:none; -webkit-text-fill-color:currentColor}
body:not(#x) .pi-pop-purpose{margin:0 0 12px!important; font-size:14px!important; font-weight:600; color:var(--ink)!important; max-width:none!important}
body:not(#x) .pi-pop .pi-body{padding:0!important}
body:not(#x) .pi-pop .pi-steps{grid-template-columns:1fr!important; gap:6px}
body:not(#x) .pi-pop .pi-steps li{padding:8px 10px}
body:not(#x) .pi-pop .pi-meta{flex-direction:column; align-items:flex-start; gap:6px}
body:not(#x) .pi-pop .pi-guide{margin-left:0}
body:not(#x) .pi-pop .pi-done{align-self:flex-end}
body:not(#x) .pi-floating{margin:0 0 12px}
body:not(#x) .content .page-head .eyebrow,body:not(#x) .content .ov-hero .eyebrow{display:none}
body:not(#x) .content .page-head,body:not(#x) .content .ov-hero{margin:4px 0 16px!important; align-items:center!important; gap:12px 16px}
body:not(#x) .content .page-head h1,body:not(#x) .content .ov-hero h1{font-size:24px!important; margin:0!important; line-height:1.25; display:flex; align-items:center}
body:not(#x) .content .page-head p:not(.eyebrow),body:not(#x) .content .ov-sub{display:block!important; margin:4px 0 0!important; font-size:13px!important; color:var(--muted)!important; max-width:680px}
body:not(#x) .content .title-ic{width:40px!important; height:40px!important; border-radius:12px!important; font-size:20px!important}
body:not(#x) .content .page-head .btn,body:not(#x) .content .ov-hero .btn{height:36px; font-size:13px}
body:not(#x) .admin-filters,body:not(#x) .lead-toolbar,body:not(#x) form.filters,body:not(#x) .ov-filters,body:not(#x) .report-filter form,body:not(#x) form.form-grid:not(.card form){padding:8px!important; gap:8px!important; margin-bottom:16px!important; align-items:flex-end!important; box-shadow:none!important; border-radius:14px!important}
body:not(#x) .admin-filters label,body:not(#x) .lead-toolbar label,body:not(#x) form.filters label,body:not(#x) .ov-filters label,body:not(#x) .report-filter form label{font-size:12px!important; line-height:1.4; font-weight:600; color:var(--ink-soft); text-transform:none; letter-spacing:0!important; gap:6px!important; flex:1 1 140px!important; min-width:120px!important; max-width:220px!important; margin:0!important}
body:not(#x) .admin-filters label,body:not(#x) .lead-toolbar label:not(.tb-search),body:not(#x) form.filters label,body:not(#x) .ov-filters label,body:not(#x) .report-filter form label{display:grid}
body:not(#x) .admin-filters label:has(input[type=date]),body:not(#x) .lead-toolbar label:has(input[type=date]),body:not(#x) form.filters label:has(input[type=date]),body:not(#x) .ov-filters label:has(input[type=date]),body:not(#x) .report-filter label:has(input[type=date]){display:flex!important; align-items:center; font-size:11.5px!important; font-weight:650; color:var(--muted); text-transform:none; gap:6px!important; flex:0 1 190px!important}
body:not(#x) .admin-filters label:has(input[type=date]) input,body:not(#x) .lead-toolbar label:has(input[type=date]) input,body:not(#x) form.filters label:has(input[type=date]) input,body:not(#x) .ov-filters label:has(input[type=date]) input,body:not(#x) .report-filter label:has(input[type=date]) input{margin:0!important}
body:not(#x) .admin-filters input,body:not(#x) .admin-filters select,body:not(#x) .lead-toolbar input,body:not(#x) .lead-toolbar select,body:not(#x) form.filters input,body:not(#x) form.filters select,body:not(#x) .ov-filters input,body:not(#x) .ov-filters select,body:not(#x) .report-filter input,body:not(#x) .report-filter select{height:36px!important; font-size:13px!important; margin:0!important; padding:0 10px!important}
body:not(#x) .lead-toolbar .tb-search input{padding-left:34px!important}
body:not(#x) .admin-filters .btn,body:not(#x) .lead-toolbar .btn,body:not(#x) form.filters .btn,body:not(#x) .ov-filters .btn,body:not(#x) .report-filter .btn{height:36px!important; padding:0 14px; font-size:13px}
body:not(#x) .ov-hero .ov-filters{flex:1 1 560px; justify-content:flex-end; background:transparent!important; border:0!important; padding:0!important; backdrop-filter:none}
body:not(#x) .ov-hero>div:first-child{flex:0 1 auto!important}
body:not(#x) .card,body:not(#x) .ov-kpi,body:not(#x) .metric,body:not(#x) .employee-card,body:not(#x) .report-summary>div,body:not(#x) .qc-stat{box-shadow:0 1px 2px rgba(30,40,90,.04),0 4px 14px rgba(30,40,90,.04)!important}
body:not(#x) .card{padding:18px 20px!important}
body:not(#x) .card h2{font-size:15.5px!important}
body:not(#x) .ov-kpi{padding:14px 16px!important; gap:12px!important}
body:not(#x) .ov-ic{width:40px!important; height:40px!important; border-radius:12px!important; box-shadow:none!important}
body:not(#x) .ov-ic .material-symbols-rounded{font-size:21px!important}
body:not(#x) .ov-kpi strong{font-size:26px!important}
body:not(#x) .ov-kpi small{font-size:11.5px!important}
body:not(#x) .ov-kpis{gap:12px!important; margin-bottom:14px!important}
body:not(#x) .ov-grid{gap:14px!important}
body:not(#x) .admin-alert{padding:10px 14px!important; margin:0 0 14px!important; border-radius:14px!important}
body:not(#x) .admin-alert strong{font-size:13.5px}
body:not(#x) .admin-alert .btn{height:32px; font-size:12.5px}
body:not(#x) .employee-grid{gap:14px!important; margin:0 0 14px!important}
body:not(#x) .employee-card{padding:16px 18px!important}
body:not(#x) .employee-card-head h2{font-size:15.5px!important}
body:not(#x) .employee-card .avatar,body:not(#x) .employee-avatar{width:38px!important; height:38px!important; font-size:16px!important}
body:not(#x) .employee-stats{margin:12px 0!important; padding-top:12px!important}
body:not(#x) .employee-stats dd{font-size:18px!important}
body:not(#x) .content .card+p,body:not(#x) .content form+p,body:not(#x) .content .admin-filters+p{font-size:12.5px!important; color:var(--muted)!important; margin:-6px 0 12px!important}
body:not(#x) .content>.content-inner>p:not([class]){font-size:12.5px; color:var(--muted)}

@media (max-width:760px){
  body:not(#x) .admin-filters label,body:not(#x) .lead-toolbar label,body:not(#x) form.filters label{flex:1 1 calc(50% - 8px)!important; max-width:none!important}
  body:not(#x) .content .page-head h1,body:not(#x) .content .ov-hero h1{font-size:21px!important}
  body:not(#x) .pi-pop{left:auto; right:-8px}
}

body:not(#x) .card.admin-filters,body:not(#x) form.card{padding:8px!important}
body:not(#x) .admin-filters label:has(input[type=date]),body:not(#x) .lead-toolbar label:has(input[type=date]),body:not(#x) form.filters label:has(input[type=date]),body:not(#x) .ov-filters label:has(input[type=date]),body:not(#x) .report-filter label:has(input[type=date]){white-space:nowrap; min-width:170px!important}
body:not(#x) .admin-filters,body:not(#x) .lead-toolbar,body:not(#x) form.filters,body:not(#x) .report-filter form{flex-wrap:wrap}
body:not(#x) .admin-filters>.btn,body:not(#x) .admin-filters>button{margin-left:auto}


body:not(#x) .card-head .eyebrow{display:none}
body:not(#x) .content>.content-inner>details.quiet-details,body:not(#x) .content-inner>details.quiet-details{display:inline-block; width:auto; margin:0 0 14px!important; border:0!important; background:none!important; box-shadow:none!important}
body:not(#x) .content-inner>details.quiet-details>summary{display:inline-flex!important; padding:5px 12px!important; border-radius:999px; border:1px solid var(--line)!important; background:var(--field); font-size:12px!important; font-weight:650; color:var(--muted)}
body:not(#x) .content-inner>details.quiet-details[open]{display:block; background:#fff!important; border:1px solid var(--line)!important; border-radius:14px!important; padding-bottom:6px!important}
body:not(#x) .report-summary{gap:12px!important; margin-bottom:14px!important}
body:not(#x) .report-summary>div{padding:14px 16px 14px 20px!important}
body:not(#x) .report-summary strong{font-size:26px!important}
body:not(#x) .qc-stat{padding:14px 18px!important}
body:not(#x) .qc-ring-lg{width:72px!important; height:72px!important}
body:not(#x) .qc-ring-lg b{font-size:20px!important}
body:not(#x) .admin-filters label,body:not(#x) .lead-toolbar label,body:not(#x) form.filters label{flex:1 1 120px!important}
body:not(#x) .admin-filters label:has(input[type=date]),body:not(#x) .lead-toolbar label:has(input[type=date]),body:not(#x) form.filters label:has(input[type=date]){min-width:160px!important; flex:0 1 175px!important}
body:not(#x) .focus-tabs,body:not(#x) .admin-tabs,body:not(#x) .tab-bar{margin:0 0 14px!important}
body:not(#x) .focus-tabs button,body:not(#x) .tab-bar button,body:not(#x) .admin-tabs a{padding:6px 13px!important; font-size:13px}


/* ---- Leads list: one clean toolbar row ---- */
body:not(#x) .list-context{display:none!important}
body:not(#x) .leads-card{position:relative}
body:not(#x) .leads-card>.lead-bar:not(:has(.chip-link)){position:absolute!important; top:14px; right:14px; margin:0!important; padding:0!important}
body:not(#x) .leads-card>.lead-toolbar.flat{padding:8px 170px 8px 8px!important; align-items:flex-end!important}
body:not(#x) .lead-toolbar.flat .tb-search{flex:1 1 260px!important; max-width:none!important}
body:not(#x) .lead-toolbar.flat .advanced-filters{flex:0 0 auto!important}
body:not(#x) .lead-toolbar.flat .advanced-filters[open]{flex:1 1 100%!important}
body:not(#x) .content details.bulk-actions{background:#fff!important; margin:0 12px 6px!important}
body:not(#x) .content details.bulk-actions>summary{padding:8px 14px!important}

@media (max-width:760px){ body:not(#x) .leads-card>.lead-toolbar.flat{padding-right:8px!important} body:not(#x) .leads-card>.lead-bar{position:static!important; padding:8px 8px 0!important} }
body:not(#x) .content .leads-card details.bulk-actions{background:#fff!important; background-image:none!important}


.pi-pop{position:fixed!important; z-index:400!important; top:0; left:0}

/* ---- Conversations: left list stays in view while reading ---- */
body:not(#x) .conversation-layout{align-items:start!important}
body:not(#x) .conversation-layout>.conversation-list{position:sticky; top:84px; max-height:calc(100vh - 110px); overflow-y:auto; align-self:start}
body:not(#x) .chat-bubble.outgoing,body:not(#x) .chat-bubble.out{background:hsl(var(--brand-h) 90% 96%)!important; border:1px solid hsl(var(--brand-h) 70% 86%)!important; color:var(--ink)!important}
body:not(#x) .chat-bubble.outgoing strong,body:not(#x) .chat-bubble.outgoing small{color:var(--accent2)}

@media (max-width:900px){ body:not(#x) .conversation-layout>.conversation-list{position:static; max-height:none} }
body:not(#x) .topbar{box-shadow:0 -24px 0 6px #fff, 0 1px 2px rgba(30,40,90,.05),0 8px 24px rgba(30,40,90,.06)!important}


/* ---- popup viewer ---- */
body:not(#x) dialog.crm-modal{width:min(820px,94vw); max-height:88vh; display:none; flex-direction:column; padding:0}
body:not(#x) dialog.crm-modal[open]{display:flex}
body:not(#x) .crm-modal .modal-head{flex:0 0 auto; gap:12px}
body:not(#x) .crm-modal .cm-title{font-size:17px; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
body:not(#x) .crm-modal .cm-tools{display:flex; gap:8px; align-items:center; flex:0 0 auto}
body:not(#x) .crm-modal .cm-body{overflow-y:auto; flex:1 1 auto; padding:16px 20px 20px}
body:not(#x) .crm-modal .cm-body>section,body:not(#x) .crm-modal .cm-body .card{box-shadow:none!important; border:0!important; padding:0!important; margin:0 0 12px!important; background:transparent!important}
body:not(#x) .crm-modal .chat-history{max-height:none; border-radius:14px}
body:not(#x) .crm-modal .admin-tabs{margin:0 0 12px!important}
body:not(#x) .conversation-layout.modal-mode{grid-template-columns:1fr!important}
body:not(#x) .conversation-layout.modal-mode>.conversation-thread{display:none}
body:not(#x) .conversation-layout.modal-mode>.conversation-list{position:static; max-height:none}
body:not(#x) .conversation-layout.modal-mode .conversation-list{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:10px; align-items:start}
body:not(#x) .conversation-layout.modal-mode .conversation-list>h2,body:not(#x) .conversation-layout.modal-mode .conversation-list>p,body:not(#x) .conversation-layout.modal-mode .conversation-list>nav,body:not(#x) .conversation-layout.modal-mode .conversation-list>.pager{grid-column:1/-1; margin:0}
body:not(#x) .conversation-layout.modal-mode .conversation-contact{border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin:0}

body:not(#x) dialog.modal .modal-head,body:not(#x) .crm-modal .modal-head{background:#fff!important}
body:not(#x) .crm-modal dl{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:8px; margin:10px 0}
body:not(#x) .crm-modal dl>dt{font-size:11px; color:var(--muted); font-weight:650}
body:not(#x) .crm-modal dl>dd{margin:0 0 6px; font-weight:600; color:var(--ink)}


body:not(#x) .pop-trigger{display:inline-flex; align-items:center; gap:7px; height:34px; padding:0 14px; margin:0 8px 12px 0; border-radius:999px; border:1px solid var(--line-strong); background:#fff; color:var(--ink-soft); font:650 12.5px "Inter",sans-serif; cursor:pointer; transition:all .2s var(--ease)}
body:not(#x) .pop-trigger .material-symbols-rounded{font-size:17px; color:var(--accent2)}
body:not(#x) .pop-trigger:hover{border-color:hsl(var(--brand-h) 80% 70%); color:var(--accent2); box-shadow:0 4px 14px rgba(30,40,90,.1)}
body:not(#x) .crm-modal .cm-holder>p{font-size:14px; line-height:1.6; color:var(--ink-soft)}
body:not(#x) .crm-modal .cm-holder .grid-2{grid-template-columns:1fr}

body:not(#x) .info-pop{max-width:min(440px,90vw)}
body:not(#x) .info-pop .cm-holder>p,body:not(#x) .info-pop p:not(.pi-pop-purpose){margin:0 0 8px!important; font-size:13px; line-height:1.55; color:var(--ink-soft)}
body:not(#x) .pop-trigger.on{background:var(--grad); color:#fff; border-color:transparent}
body:not(#x) .pop-trigger.on .material-symbols-rounded{color:#fff}


/* ---- Conversations: chat-app split, both panes aligned, messages scroll inside ---- */
body:not(#x) .conversation-layout>.card{margin:0!important}
body:not(#x) .conversation-layout>.conversation-thread{position:sticky; top:84px}
body:not(#x) .conversation-thread .chat-history{max-height:calc(100vh - 330px); min-height:280px; overflow-y:auto}
body:not(#x) .conversation-contact{margin:0 0 6px}

@media (max-width:900px){ body:not(#x) .conversation-layout>.conversation-thread{position:static} body:not(#x) .conversation-thread .chat-history{max-height:none} }

/* Lead history and call wrap-up use the same readable layout on every screen. */
body:not(#x) .lead-main-stack{display:grid; gap:18px; min-width:0}
body:not(#x) .lead-main-stack>.card{margin:0}
body:not(#x) .lead-update-timeline{list-style:none; padding:0; margin:0}
body:not(#x) .lead-update-timeline>li{position:relative; display:flex; gap:14px; padding:0 0 24px; min-width:0}
body:not(#x) .lead-update-timeline>li:not(:last-child)::before{content:""; position:absolute; left:17px; top:36px; bottom:0; width:2px; background:#e2e8f0}
body:not(#x) .update-marker{display:grid; place-items:center; width:36px; height:36px; flex:0 0 36px; border-radius:50%; background:#eef2ff; color:#4338ca; font-size:20px}
body:not(#x) .update-content{min-width:0; flex:1; padding:2px 0}
body:not(#x) .update-meta{display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; font-size:12px}
body:not(#x) .update-meta time{color:#64748b}
body:not(#x) .update-content h3{font-size:14px; margin:7px 0 4px; color:var(--ink)}
body:not(#x) .update-content p{margin:0; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.65; color:var(--ink-soft)}
body:not(#x) .lead-quick-update>summary{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0!important; list-style:none; cursor:pointer}
body:not(#x) .lead-quick-update>summary::-webkit-details-marker{display:none}
body:not(#x) .lead-quick-update>summary::before{display:none!important}
body:not(#x) .lead-quick-update>summary strong{display:block; font-size:17px; color:var(--ink)}
body:not(#x) .lead-quick-update>summary small{display:block; margin-top:5px; font-weight:400; color:var(--muted); font-size:13px}
body:not(#x) .lead-quick-update[open]>summary{padding-bottom:18px!important; margin-bottom:16px; border-bottom:1px solid var(--line)}
body:not(#x) .lead-quick-update[open]>summary>.material-symbols-rounded{transform:rotate(180deg)}
body:not(#x) .call-wrapup{width:min(560px,calc(100vw - 24px)); max-height:calc(100dvh - 32px); overflow:auto}
body:not(#x) .call-wrapup .modal-head p{margin:5px 0 0; color:var(--ink-soft)}
body:not(#x) .call-wrapup .modal-body{gap:16px}
body:not(#x) .call-wrapup .error{color:#b91c1c; padding:10px; background:#fef2f2; border-radius:8px}
body:not(#x) .call-wrapup .form-end{display:flex; flex-wrap:wrap; gap:10px}
body:not(#x) .leads-card>.lead-bar,body:not(#x) .leads-card>.lead-bar:not(:has(.chip-link)){position:static!important; align-self:stretch; margin:0!important; padding:10px 12px!important; order:2}
body:not(#x) .leads-card>.lead-toolbar.flat{padding-right:12px!important}
body:not(#x) .saved-lead-view{display:inline-flex; align-items:center; border-radius:999px; background:#eef2ff; border:1px solid #dbe4ff; max-width:100%}
body:not(#x) .saved-lead-view .chip-link{border:0; background:transparent; margin:0; min-width:0; overflow-wrap:anywhere; white-space:normal}
body:not(#x) .saved-lead-view .delete-saved-view{display:flex; padding:0!important; margin:0; background:none; border:0; box-shadow:none}
body:not(#x) .delete-view-button{display:grid; place-items:center; width:34px; height:34px; padding:0; border:0; border-radius:50%; background:transparent; color:#64748b; cursor:pointer}
body:not(#x) .delete-view-button:hover{color:#b91c1c; background:#fee2e2}
body:not(#x) .save-view-button{margin-left:auto; white-space:nowrap}
@media(max-width:760px){body:not(#x) .lead-workspace .contact-card{order:0}
body:not(#x) .lead-main-stack{order:-1}
body:not(#x) .delete-view-button{width:40px; height:40px}
body:not(#x) .call-wrapup .form-end .btn{width:100%}}

.lead-intelligence{border-bottom:1px solid #e2e8f0;padding-bottom:24px;margin-bottom:24px}
.intelligence-metrics,.intelligence-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.intelligence-metrics>div{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:14px}
.intelligence-metrics small{display:block;color:#64748b}.intelligence-metrics strong{display:block;font-size:28px;color:#0f172a;margin-top:4px}
.intelligence-metrics strong span{font-size:13px;color:#64748b;margin-left:3px}
.intelligence-mode{color:#4338ca;font-weight:600;font-size:13px}.intelligence-reason{line-height:1.6;overflow-wrap:anywhere}
.intelligence-action{margin-top:12px}.intelligence-fields input{min-width:0;width:100%}
.call-context{text-align:left;border:1px solid #dbe4f0;border-radius:12px;padding:16px;background:#f8fafc;color:#1e293b;overflow-wrap:anywhere}
.call-context h3{font-size:17px;margin:0 0 14px;color:#0f172a}.call-context>div+div{border-top:1px solid #e2e8f0;padding-top:12px;margin-top:12px}
.call-context strong{font-size:13px;color:#334155}.call-context p{white-space:pre-wrap;font-size:14px;line-height:1.55;margin:6px 0;color:#334155}.call-context small{font-size:12px;color:#64748b}
body:not(#x) .call-screen{width:min(620px,calc(100vw - 24px));z-index:1300}
body:not(#x) .call-screen-panel{width:100%;box-sizing:border-box;max-height:calc(100dvh - 32px);overflow:auto}
body:not(#x) .call-screen-avatar{width:52px;height:52px;font-size:24px;margin:12px auto}
body:not(#x) .call-screen-btn,body:not(#x) .call-screen-minimize{color:#334155}
body:not(#x) .call-screen-btn .material-symbols-rounded,body:not(#x) .call-screen-minimize{background:#eef2ff}
body:not(#x) .call-screen-help{max-width:none;color:#64748b;font-size:13px;line-height:1.5}