@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Manrope:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@500;600&display=swap');
:root{
  /* marca Gallegos & García */
  --navy:#123A63;--navy-deep:#0C243F;--navy-mid:#1C6197;
  --gold:#FBC311;--gold-deep:#E0A500;--gold-soft:#FDE9A6;
  --ink:#16202E;--muted:#66748A;--line:#E6EAF1;--bg:#F5F7FB;--card:#FFFFFF;
  --ok:#1E9E6A;--ok-bg:#E3F5EC;--warn:#C8860A;--warn-bg:#FBF0D8;--danger:#D64545;--danger-bg:#FBE8E8;
  --wa:#25D366;--wa-dark:#128C7E;
  --shadow:0 1px 2px rgba(12,36,63,.05),0 8px 24px rgba(12,36,63,.06);
  --shadow-lg:0 20px 60px rgba(12,36,63,.16);
  --ring:0 0 0 3px rgba(28,97,151,.18);
}
*{box-sizing:border-box}html,body{margin:0}
body{font-family:'Manrope',system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}
.mono{font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums}
.serif{font-family:'Fraunces',Georgia,serif}
button{font-family:inherit;cursor:pointer}h1,h2,h3{margin:0}
::selection{background:var(--gold-soft)}
a{color:var(--navy-mid)}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:8px}

/* login premium */
.login-bg{min-height:100vh;display:grid;place-items:center;position:relative;overflow:hidden;
  background:radial-gradient(1200px 700px at 15% -10%,#1C6197 0%,transparent 55%),linear-gradient(155deg,#0C243F 0%,#123A63 60%,#0C243F 100%)}
.login-bg::before{content:"";position:absolute;inset:0;opacity:.06;
  background-image:linear-gradient(var(--gold) 1px,transparent 1px),linear-gradient(90deg,var(--gold) 1px,transparent 1px);
  background-size:44px 44px;mask-image:radial-gradient(circle at 50% 40%,#000 30%,transparent 75%)}
.login-card{background:var(--card);border-radius:20px;padding:0;width:min(410px,92vw);box-shadow:var(--shadow-lg);text-align:center;overflow:hidden;position:relative;z-index:2}
.login-crown{background:linear-gradient(150deg,#0C243F,#123A63);padding:30px 36px 22px;position:relative}
.login-crown::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.login-logo{height:96px;filter:drop-shadow(0 6px 18px rgba(0,0,0,.3))}
.login-body{padding:26px 34px 30px}
.login-card h1{font-size:16px;color:var(--navy);font-weight:800;letter-spacing:.01em}
.login-sub{font-size:11.5px;color:var(--muted);margin:5px 0 20px;font-weight:600}
.login-card form{text-align:left;display:flex;flex-direction:column;gap:8px}
.login-card label{font-size:10.5px;font-weight:800;color:var(--navy);text-transform:uppercase;letter-spacing:.06em}
.login-err{background:var(--danger-bg);color:var(--danger);border-radius:10px;padding:10px 13px;font-size:12.5px;font-weight:700;margin-bottom:12px}
.login-foot{font-size:10px;color:var(--muted);margin-top:18px;display:flex;align-items:center;justify-content:center;gap:6px}
.login-foot::before{content:"🔒";font-size:10px}
.w100{width:100%;margin-top:12px}

/* topbar y layout */
.topbar{position:sticky;top:0;z-index:40;background:linear-gradient(180deg,#123A63,#0F3358);border-bottom:2px solid var(--gold);display:flex;align-items:center;gap:16px;padding:11px 24px;flex-wrap:wrap;box-shadow:0 2px 16px rgba(12,36,63,.12)}
.brand{display:flex;align-items:center;gap:13px}
.brand img{height:40px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.25))}
.brand .sys{display:flex;flex-direction:column;line-height:1.1;border-left:2px solid var(--gold);padding-left:13px}
.brand .sys b{font-size:13px;letter-spacing:.06em;color:#fff;text-transform:uppercase;font-weight:800}
.brand .sys span{font-size:11px;color:#AFC4DC}
.spacer{flex:1}
.userchip{display:flex;align-items:center;gap:9px;padding:4px 12px 4px 5px;border:1px solid rgba(255,255,255,.15);border-radius:30px;background:rgba(255,255,255,.08)}
.avatar{width:31px;height:31px;border-radius:50%;background:linear-gradient(180deg,#FCCB2E,#E0A500);color:var(--navy-deep);font-weight:800;display:grid;place-items:center;font-size:13px}
.userchip small{display:block;color:#AFC4DC;font-size:11px;line-height:1}
.userchip b{font-size:12.5px;color:#fff}
.linkout{font-size:12px;font-weight:700;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.2);padding:8px 13px;border-radius:9px;background:rgba(255,255,255,.06)}
.linkout:hover{background:var(--danger);border-color:var(--danger)}
.wrap{max-width:1320px;margin:0 auto;padding:24px}

/* kpis, paneles, tablas (idéntico a la línea del demo) */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform .12s,box-shadow .12s}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--gold),var(--gold-deep))}
.kpi.alt::before{background:linear-gradient(180deg,var(--navy-mid),var(--navy))}.kpi.good::before{background:var(--ok)}.kpi.bad::before{background:var(--danger)}
.kpi .lab{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800}
.kpi .val{font-size:26px;font-weight:800;color:var(--navy);margin-top:5px;letter-spacing:-.01em}
.kpi.good .val{color:var(--ok)}
.kpi .val small{font-size:13px;color:var(--muted);font-weight:600}
.kpi .meta{font-size:10.5px;font-weight:700;margin-top:3px}
.kpi .meta.ok{color:var(--ok)}.kpi .meta.no{color:var(--danger)}
.panel{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);margin-bottom:18px}
.panel-h{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.panel-h h3{font-size:14px;color:var(--navy);font-weight:800}
.panel-h .sub{font-size:11.5px;color:var(--muted);font-weight:600}
.panel-b{padding:16px 18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.grid-g{display:grid;grid-template-columns:360px 1fr;gap:18px;align-items:start}
.grid-g.collapsed{grid-template-columns:1fr}
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:8px 10px;border-bottom:2px solid var(--line)}
.tbl td{padding:9px 10px;border-bottom:1px solid var(--line)}
.tbl tr:hover td{background:#FAFBFE}

input,select,textarea{font-family:inherit;font-size:13px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:var(--ink);background:#fff;width:100%;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--navy-mid);box-shadow:var(--ring)}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%2366748A' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;padding-right:30px}
.btn{border:0;border-radius:10px;padding:10px 16px;font-weight:700;font-size:13px;display:inline-flex;align-items:center;gap:7px;transition:transform .08s,box-shadow .15s,filter .15s}
.btn-gold{background:linear-gradient(180deg,#FCCB2E,#F0B400);color:var(--navy-deep);box-shadow:0 2px 8px rgba(224,165,0,.35)}
.btn-navy{background:linear-gradient(180deg,#1C6197,#123A63);color:#fff;box-shadow:0 2px 8px rgba(18,58,99,.3)}
.btn-ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
.btn:hover{filter:brightness(1.04);transform:translateY(-1px)}.btn:active{transform:translateY(0)}
.btn-sm{padding:8px 13px;font-size:12px}

.chip{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em}
.c-none{background:#EEF1F6;color:#6B7686}.c-no{background:var(--danger-bg);color:var(--danger)}
.c-si{background:var(--ok-bg);color:var(--ok)}.c-prom{background:var(--warn-bg);color:var(--warn)}
.badge{font-size:10px;font-weight:800;padding:2px 7px;border-radius:6px;background:var(--navy);color:#fff;letter-spacing:.04em}
.badge.port{background:#EDEFF5;color:var(--navy)}

/* gestor */
.cartera-toggle{display:flex;align-items:center;gap:10px;background:var(--navy);color:#fff;border:0;border-radius:12px;padding:12px 16px;font-weight:800;font-size:13px;width:100%;box-shadow:var(--shadow);margin-bottom:14px}
.cartera-toggle .cnt{background:var(--gold);color:var(--navy-deep);border-radius:20px;padding:2px 10px;font-size:12px}
.cartera-toggle .arw{margin-left:auto;transition:transform .2s}
.cartera-toggle.open .arw{transform:rotate(180deg)}
#carteraPanel{display:none}#carteraPanel.open{display:block}
.acct-list{max-height:68vh;overflow:auto}
.acct{display:flex;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line);cursor:pointer;align-items:flex-start;transition:background .12s}
.acct:hover{background:#F7FAFE}
.acct.sel{background:linear-gradient(90deg,#FFF9E6,#fff);box-shadow:inset 3px 0 0 var(--gold)}
.acct .nm{font-weight:700;font-size:13px;line-height:1.2;color:var(--ink)}
.acct .meta{font-size:11px;color:var(--muted);margin-top:3px}
.acct .amt{margin-left:auto;text-align:right;font-weight:800;color:var(--navy);font-size:14px;white-space:nowrap;font-variant-numeric:tabular-nums}
.dot{width:9px;height:9px;border-radius:50%;margin-top:4px;flex:none}
.dot.s0{background:#C3C9D4}.dot.s1{background:var(--danger)}.dot.s2{background:var(--ok)}.dot.s3{background:var(--warn)}

.det-head{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:flex-start}
.det-head .who h2{font-size:18px;color:var(--navy);font-weight:800}
.det-head .who .id{font-size:12px;color:var(--muted);margin-top:2px}
.saldo-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.saldo{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#FBFCFE}
.saldo .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.saldo .v{font-size:20px;font-weight:800;margin-top:3px}
.saldo.da .v{color:var(--navy)}.saldo.mc .v{color:var(--danger)}.saldo.dd .v{color:var(--ok)}
.saldo .hint{font-size:10px;color:var(--muted);margin-top:2px}
.proj{border:1px dashed var(--gold);background:#FFFCF2;border-radius:12px;padding:14px;margin-bottom:16px}
.proj .t{font-size:12px;font-weight:800;color:var(--navy);margin-bottom:9px}
.proj-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.proj-out{margin-top:11px;display:flex;gap:18px;flex-wrap:wrap;font-size:13px}
.proj-out b{color:var(--navy)}.proj-out .g{color:var(--muted)}
.sect{margin-top:18px}
.sect>.st{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800;margin-bottom:9px;display:flex;align-items:center;gap:8px}
.sect>.st::after{content:"";flex:1;height:1px;background:var(--line)}
.contacts{display:flex;flex-direction:column;gap:7px}
.contact{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:8px 11px;background:#fff;flex-wrap:wrap}
.contact .ph{font-weight:700;font-size:13px}
.contact .tag{font-size:10px;color:var(--muted);font-weight:700}
.contact .tag.new{color:var(--ok)}
.contact .btns{margin-left:auto;display:flex;gap:7px}
.call,.wapp{display:inline-flex;align-items:center;gap:6px;border-radius:8px;padding:6px 11px;font-weight:700;font-size:12px;border:1px solid;background:#fff}
.call{border-color:var(--navy);color:var(--navy)}.call:hover{background:var(--navy);color:#fff}
.wapp{border-color:var(--wa-dark);color:var(--wa-dark)}.wapp:hover{background:var(--wa);color:#fff;border-color:var(--wa)}
.addbox{display:flex;gap:8px;margin-top:8px}
.tree{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.fld{display:flex;flex-direction:column;gap:5px}
.fld label{font-size:11px;font-weight:700;color:var(--navy)}
.fld.full{grid-column:1/-1}
#compromisoFld{display:none;grid-column:1/-1;background:var(--warn-bg);border:1px solid #F0D79A;border-radius:10px;padding:11px 13px}
#compromisoFld.show{display:block}
#compromisoFld label{color:var(--warn)}
.save-row{display:flex;gap:10px;align-items:center;margin-top:16px;padding-top:15px;border-top:1px solid var(--line);flex-wrap:wrap}
.save-note{font-size:12px;color:var(--muted)}
.hist{font-size:12px;border-left:3px solid var(--line);padding-left:12px;margin-bottom:9px}
.hist b{color:var(--navy)}.hist .hd{color:var(--muted);font-size:11px}

/* supervisor */
.gestor-row{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.gestor-row:last-child{border-bottom:0}
.bar{flex:1;height:8px;border-radius:5px;background:#EDEFF5;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--gold)}
.upload{border:2px dashed var(--line);border-radius:14px;padding:18px;text-align:center;background:#FBFCFE}
.upload .big{font-size:13px;font-weight:700;color:var(--navy)}
.upload .sm{font-size:12px;color:var(--muted);margin-top:4px}

/* auditor */
.filters{display:flex;gap:12px;flex-wrap:wrap;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin-bottom:18px;box-shadow:var(--shadow)}
.seg{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:3px;flex-wrap:wrap}
.seg button{border:0;background:transparent;padding:7px 13px;border-radius:6px;font-weight:700;font-size:12px;color:var(--muted)}
.seg button.on{background:var(--gold);color:var(--navy-deep)}
.filters .lbl{font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.gbar-row{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.gbar-row:last-child{border-bottom:0}
.gbar-row .nm{width:110px;font-weight:700;font-size:13px}
.gbar{flex:1;height:22px;border-radius:6px;background:#EDEFF5;overflow:hidden;position:relative}
.gbar>i{display:block;height:100%;background:linear-gradient(90deg,var(--navy),#2B5B9E)}
.gbar .txt{position:absolute;right:8px;top:0;line-height:22px;font-size:11px;font-weight:800;color:#123}

/* discador y modales */
.dialcfg{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:9px;padding:4px 8px;background:#fff}
.dialcfg>span{font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.dialcfg select{width:auto;padding:5px 26px 5px 9px;font-size:12px;font-weight:700;font-family:'IBM Plex Mono',monospace;border-radius:7px}
.dialhelp{width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--muted);font-weight:800;font-size:12px;line-height:1}
.dialhelp:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.overlay{position:fixed;inset:0;background:rgba(11,34,68,.45);display:none;place-items:center;z-index:60;padding:20px}
.overlay.on{display:grid}
.modal{background:#fff;border-radius:16px;max-width:640px;width:100%;max-height:88vh;overflow:auto;box-shadow:0 24px 60px rgba(11,34,68,.3)}
.modal-h{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff}
.modal-h h3{color:var(--navy);font-size:15px}
.modal-b{padding:20px}
.x{margin-left:auto;border:0;background:#F0F2F7;width:30px;height:30px;border-radius:8px;font-size:16px;color:var(--muted)}
.dialopt{border:1px solid var(--line);border-radius:12px;padding:13px 15px;margin-bottom:12px;background:#FBFCFE}
.dialopt .dt{font-size:13px;font-weight:800;color:var(--navy);display:flex;align-items:center;gap:9px;margin-bottom:8px;flex-wrap:wrap}
.dialopt .pill{color:#fff;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px}
.dialopt ol{margin:0;padding-left:20px;font-size:12.5px;line-height:1.6}
.dialopt code,.config-note code{background:#fff;border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-family:'IBM Plex Mono',monospace;font-size:11.5px}
.config-note{font-size:12px;color:var(--navy);background:#EEF3FB;border:1px solid #D5E1F2;border-radius:10px;padding:11px 13px;margin-top:10px}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--navy-deep);color:#fff;padding:12px 20px;border-radius:11px;font-weight:600;font-size:13px;box-shadow:0 12px 30px rgba(11,34,68,.35);opacity:0;transition:.25s;z-index:80}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.aging-row{display:flex;align-items:center;gap:10px;font-size:12px;margin-bottom:8px}
.aging-row .lb{width:80px;color:var(--muted);font-weight:700}
.aging-bar{flex:1;height:16px;border-radius:5px;background:#EDEFF5;overflow:hidden}
.aging-bar>i{display:block;height:100%}
.aging-row .pc{width:44px;text-align:right;font-weight:800;font-size:11.5px}
@media(max-width:960px){.grid-g,.grid2{grid-template-columns:1fr}.acct-list{max-height:none}}

/* indicador de prioridad de cobro (Oportunidad 2) */
.prio{width:6px;align-self:stretch;border-radius:4px;flex:none;min-height:38px}
.acct .amt{display:flex;flex-direction:column;align-items:flex-end}

/* Motor 2: contactabilidad por número */
.numstat{font-size:10px;font-weight:800;padding:2px 8px;border-radius:12px;letter-spacing:.02em;white-space:nowrap}
.numstat.good{background:var(--ok-bg);color:var(--ok)}
.numstat.mid{background:#EEF1F6;color:var(--muted)}
.numstat.dead{background:var(--danger-bg);color:var(--danger)}
.contact.is-dead{opacity:.55}
.askres{position:fixed;bottom:74px;left:50%;transform:translateX(-50%) translateY(16px);background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:flex;gap:9px;align-items:center;font-size:13px;font-weight:700;box-shadow:0 14px 36px rgba(11,34,68,.25);opacity:0;pointer-events:none;transition:.2s;z-index:90}
.askres.on{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.askres .btn-si{background:var(--ok);color:#fff;border:0;border-radius:8px;padding:7px 14px;font-weight:800}
.askres .btn-no{background:var(--danger);color:#fff;border:0;border-radius:8px;padding:7px 14px;font-weight:800}
.askres .btn-x{background:#EEF1F6;color:var(--muted);border:0;border-radius:8px;padding:7px 10px;font-weight:700;font-size:12px}
.chip.c-exp{background:#E6F1FB;color:#185FA5}

/* panel de estado de telefonía */
.tel-status{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:12px;margin-bottom:16px;font-size:13px;border:1px solid var(--line)}
.tel-status.on{background:var(--ok-bg)}
.tel-status.off{background:#FFF6E6}
.tel-status .dot{width:10px;height:10px;border-radius:50%;flex:none}
.tel-status.on .dot{background:var(--ok)}
.tel-status.off .dot{background:#C8860A}
.tel-status .tel-hint{color:var(--muted);font-size:12px;margin-left:auto}
.btn-sm{background:var(--navy);color:#fff;border:0;border-radius:8px;padding:6px 12px;font-weight:700;font-size:12px;cursor:pointer}

/* ============ pantalla de carga premium ============ */
#splash{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;
  background:radial-gradient(900px 600px at 50% 35%,#1C6197 0%,transparent 60%),linear-gradient(155deg,#0C243F,#123A63 60%,#0C243F);
  transition:opacity .6s ease,visibility .6s;
  /* CORREGIDO: el splash se apaga SOLO, por CSS puro, en las 3 vistas.
     Antes lo apagaba app.js, que solo carga gestor.php → supervisor.php y
     auditor.php se quedaban colgados en la pantalla de carga para siempre. */
  animation:splashOut .6s ease 1.6s forwards}
@keyframes splashOut{to{opacity:0;visibility:hidden;pointer-events:none}}
#splash.hide{opacity:0;visibility:hidden;pointer-events:none}
.splash-in{text-align:center;animation:splashUp .8s cubic-bezier(.2,.8,.2,1)}
.splash-in img{height:130px;filter:drop-shadow(0 10px 30px rgba(0,0,0,.4));animation:splashPulse 2s ease-in-out infinite}
.splash-line{width:0;height:2px;margin:26px auto 0;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:splashLine 1.4s ease-out forwards}
.splash-tag{color:#AFC4DC;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-top:18px;opacity:0;animation:splashFade .6s ease-out .5s forwards}
.splash-sys{color:#fff;font-family:'Fraunces',serif;font-size:22px;font-weight:700;margin-top:6px;opacity:0;animation:splashFade .6s ease-out .7s forwards}
@keyframes splashUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes splashPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes splashLine{to{width:220px}}
@keyframes splashFade{to{opacity:1}}
@media(prefers-reduced-motion:reduce){.splash-in,.splash-in img,.splash-line,.splash-tag,.splash-sys{animation:none}.splash-line{width:220px}.splash-tag,.splash-sys{opacity:1}}

/* ============ LOGIN 2.0 · dos paneles con imagen ============ */
.login2{min-height:100vh;background:var(--navy-deep)}
.login2-grid{display:grid;grid-template-columns:1.1fr .9fr;min-height:100vh}
.login2-hero{position:relative;background:linear-gradient(155deg,#0C243F,#123A63 60%,#0C243F);background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:44px;transition:background-image .4s}
.login2-hero .hero-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(12,36,63,.85),transparent 55%)}
.hero-brand{position:relative;z-index:2}
.hero-brand img{height:82px;margin-bottom:16px;filter:drop-shadow(0 8px 24px rgba(0,0,0,.4))}
.hero-tag{color:#fff;font-family:'Fraunces',serif;font-size:22px;font-weight:600;max-width:420px;line-height:1.3;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.login2-panel{display:grid;place-items:center;padding:40px;background:var(--bg)}
.login2-box{width:min(400px,100%)}
.login2-box h1{font-size:22px;color:var(--navy);font-weight:800}
.login2-box .login-sub{margin:5px 0 22px}
.mode-tabs{display:flex;gap:6px;background:#EAF0F7;padding:5px;border-radius:12px;margin-bottom:20px}
.mode-tabs .mt{flex:1;border:0;background:transparent;padding:9px 8px;border-radius:8px;font-weight:800;font-size:12.5px;color:var(--muted);transition:.15s}
.mode-tabs .mt.active{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(12,36,63,.1)}
.login2-box form{display:flex;flex-direction:column;gap:8px}
.login2-box label{font-size:10.5px;font-weight:800;color:var(--navy);text-transform:uppercase;letter-spacing:.06em}
.dir-pick{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:8px}
.doc-card{background:#fff;border:2px solid var(--line);border-radius:14px;padding:12px;text-align:center;transition:.18s;cursor:pointer}
.doc-card:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.doc-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;margin-bottom:9px}
.doc-card .doc-name{font-size:12.5px;font-weight:800;color:var(--navy);line-height:1.2}
.doc-card .doc-role{font-size:10.5px;color:var(--gold-deep);font-weight:700;margin-top:2px}
.picked-doc{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 12px;margin-bottom:4px}
.picked-doc img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid var(--gold)}
.picked-doc b{font-size:13px;color:var(--navy);display:block}
.picked-doc small{font-size:11px;color:var(--muted)}
.picked-doc .pd-change{margin-left:auto;background:#EEF1F6;border:0;border-radius:8px;padding:6px 11px;font-size:11px;font-weight:700;color:var(--navy-mid)}
@media(max-width:860px){.login2-grid{grid-template-columns:1fr}.login2-hero{min-height:200px;padding:24px}.hero-brand img{height:60px}.hero-tag{font-size:17px}}

/* avatar con foto (directores) */
.avatar-img{width:31px;height:31px;border-radius:50%;object-fit:cover;border:2px solid var(--gold)}

/* bienvenida ejecutiva de dirección */
.dir-welcome{max-width:1320px;margin:22px auto 0;padding:0 24px;display:flex;align-items:center;gap:18px}
.dir-welcome>img{width:64px;height:64px;border-radius:16px;object-fit:cover;border:3px solid #fff;box-shadow:var(--shadow-lg)}
.dw-text .dw-hi{font-family:'Fraunces',serif;font-size:24px;font-weight:700;color:var(--navy);line-height:1.1}
.dw-text .dw-sub{font-size:12px;color:var(--muted);font-weight:600;margin-top:3px}
.dw-badge{margin-left:auto;background:linear-gradient(180deg,#123A63,#0C243F);color:var(--gold);font-weight:800;font-size:12px;padding:9px 16px;border-radius:30px;letter-spacing:.04em;border:1px solid var(--gold)}
@media(max-width:700px){.dw-badge{display:none}.dw-text .dw-hi{font-size:19px}}

/* modo consulta (directores en panel supervisor) */
.ro-banner{display:flex;align-items:center;gap:12px;background:#EAF2FB;border:1px solid #C5DBF2;border-radius:12px;padding:12px 16px;margin-bottom:16px;font-size:13px;color:var(--navy)}
.ro-banner .ro-ico{font-size:18px}
/* en modo lectura, los botones de acción se ven pero no se pueden usar */
body.is-ro .upload button,
body.is-ro button[onclick*="accion"],
body.is-ro button[onclick*="openModal"],
body.is-ro button[onclick*="toggleUsr"],
body.is-ro button[onclick*="pagar"],
body.is-ro button[onclick*="probarCentral"]{opacity:.4;pointer-events:none;filter:grayscale(.6)}
body.is-ro .upload{opacity:.5;pointer-events:none}

/* ══════════════════════════════════════════════════════════════════════
   PATCH v2 · Modo foco + barra de tipificación
   ════════════════════════════════════════════════════════════════════ */

/* --- barra de foco: siguiente cuenta + progreso del día --- */
.focusbar{display:flex;align-items:center;gap:14px;background:var(--navy,#1C6197);
  border-radius:12px;padding:12px 16px;margin:0 0 12px;flex-wrap:wrap}
.btn-next{background:var(--gold,#FBC311);color:#0B2244;border:0;border-radius:9px;
  padding:11px 18px;font-size:14px;font-weight:800;cursor:pointer;white-space:nowrap;
  display:flex;align-items:center;gap:8px}
.btn-next:hover{filter:brightness(1.08)}
.fb-prog{flex:1;min-width:220px}
#fbTxt{display:block;color:#fff;font-size:12px;font-weight:700;margin-bottom:5px;opacity:.95}
.fb-bar{height:6px;background:rgba(255,255,255,.22);border-radius:4px;overflow:hidden}
.fb-bar i{display:block;height:100%;background:var(--gold,#FBC311);border-radius:4px;
  transition:width .5s ease}
.fb-note{color:rgba(255,255,255,.7);font-size:11px;font-weight:600}
.kbd{display:inline-block;background:rgba(0,0,0,.18);border-radius:4px;padding:1px 6px;
  font-size:10.5px;font-weight:800;font-family:ui-monospace,monospace}
.btn-next .kbd{background:rgba(0,0,0,.14)}

/* --- barra de tipificación (reemplaza al ¿contestaron? sí/no/luego) ---
   Sobrescribe la píldora blanca original: ahora es un panel oscuro y ancho. */
.askres{display:block;background:#0F2A4A;border-color:#0F2A4A;padding:14px 16px;
  width:min(760px,calc(100vw - 32px));box-sizing:border-box}
.tf-head{font-size:13px;font-weight:800;color:#fff;margin-bottom:10px}
.tf-head b{color:var(--gold,#FBC311)}
.tf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:7px}
.tf{display:flex;align-items:center;gap:7px;border:0;border-radius:8px;cursor:pointer;
  padding:10px 11px;font-size:12.5px;font-weight:700;text-align:left;line-height:1.25;
  transition:transform .08s,filter .12s}
.tf:hover{filter:brightness(1.1);transform:translateY(-1px)}
.tf .kbd{background:rgba(0,0,0,.16);flex:0 0 auto}
.tf-ok  {background:#1E9E6A;color:#fff}   /* contacto efectivo → sale de la cola   */
.tf-vivo{background:#C8860A;color:#fff}   /* cuelga → número VIVO, vuelve a la cola */
.tf-no  {background:#5A6C86;color:#fff}   /* no contesta / buzón / apagado          */
.tf-err {background:#C6384B;color:#fff}   /* número errado → se descarta            */

/* --- badge del número que cuelga: está VIVO, no lo mates --- */
.numstat.live{background:#FBF0D8;color:#8a5b00;border:1px solid #E8C26A;
  font-weight:800}

/* ══════════════════════════════════════════════════════════════════════
   PATCH v3 · Lupa de búsqueda + contactos en desplegable
   ════════════════════════════════════════════════════════════════════ */

/* --- lupa en la topbar (llamada entrante) --- */
.searchbox{position:relative;min-width:200px;max-width:340px;flex:1}
.searchbox input{width:100%;box-sizing:border-box;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);border-radius:9px;color:#fff;
  padding:9px 12px;font-size:13px;font-weight:600;outline:none;transition:.15s}
.searchbox input::placeholder{color:rgba(255,255,255,.55)}
.searchbox input:focus{background:rgba(255,255,255,.18);border-color:var(--gold,#FBC311)}
.search-pop{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;
  background:#fff;border:1px solid var(--line,#E3E8F0);border-radius:12px;
  box-shadow:0 18px 48px rgba(11,34,68,.28);overflow:hidden;z-index:200;
  max-height:340px;overflow-y:auto}
.search-pop.on{display:block}
.sr-hint{padding:14px;font-size:12.5px;color:var(--muted,#6B7A93);font-weight:600}
.sr-item{padding:11px 14px;cursor:pointer;border-bottom:1px solid #F0F3F8;transition:.1s}
.sr-item:hover{background:#F4F8FD}
.sr-item:last-child{border-bottom:0}
.sr-nm{font-size:13px;font-weight:800;color:#12315E}
.sr-meta{font-size:11.5px;color:var(--muted,#6B7A93);margin-top:2px;font-weight:600}
.sr-ajena{color:#C8860A;font-weight:800}
.sr-chip{background:#E4F5EC;color:#1E9E6A;border-radius:5px;padding:1px 6px;
  font-size:10px;font-weight:800;vertical-align:1px}
.sr-pag{opacity:.65}

/* --- cuenta de otra cartera (llamada entrante) --- */
.ajena-banner{background:#FBF0D8;color:#8a5b00;border:1px solid #E8C26A;
  border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:700;
  margin-bottom:14px}

/* --- contactos: desplegable + un solo control --- */
.contact-one{display:flex;gap:8px;align-items:stretch}
.contact-one select{flex:1;min-width:0;border:1px solid var(--line,#dde3ec);
  border-radius:9px;padding:10px 11px;font-size:13px;font-weight:700;
  color:#12315E;background:#fff;cursor:pointer}
.opt-dead{color:#98A3B5}
.btn-contactar{background:var(--ok,#1E9E6A);color:#fff;border:0;border-radius:9px;
  padding:10px 18px;font-size:13.5px;font-weight:800;cursor:pointer;white-space:nowrap}
.btn-contactar:hover{filter:brightness(1.08)}
.btn-wapp-one{background:#25D366;color:#fff;border:0;border-radius:9px;
  padding:10px 13px;font-size:15px;font-weight:800;cursor:pointer}
.btn-wapp-one:hover{filter:brightness(1.06)}
.num-info{margin-top:8px;font-size:12px;font-weight:700;min-height:0}
.ni-dead{color:#C6384B}
.ni-live{color:#8a5b00;background:#FBF0D8;border:1px solid #E8C26A;
  border-radius:8px;padding:7px 10px;display:inline-block}
.num-email{margin-top:8px;font-size:12.5px;color:var(--muted,#6B7A93);font-weight:700}

@media(max-width:900px){.searchbox{min-width:140px}}