:root{color-scheme:dark;--page: #080b11;--surface: rgba(18, 24, 38, .65);--surface-2: rgba(28, 36, 56, .6);--surface-glass: rgba(255, 255, 255, .04);--ink: #ffffff;--ink-2: #d1d7e3;--muted: #828fa6;--grid: rgba(255, 255, 255, .06);--baseline: rgba(255, 255, 255, .12);--border: rgba(255, 255, 255, .12);--border-light: rgba(255, 255, 255, .22);--s1: #38bdf8;--s1-gradient: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%);--s1-soft: rgba(56, 189, 248, .16);--good: #34d399;--good-gradient: linear-gradient(135deg, #10b981 0%, #059669 100%);--warning: #fbbf24;--critical: #f87171;--good-soft: rgba(52, 211, 153, .16);--critical-soft: rgba(248, 113, 113, .16);--glass-shadow: 0 16px 40px -8px rgba(0, 0, 0, .5), inset 0 1px 1px 0 rgba(255, 255, 255, .2);--glass-glow: 0 0 20px rgba(56, 189, 248, .25)}:root[data-theme=light]{color-scheme:light;--page: #f1f5f9;--surface: rgba(255, 255, 255, .75);--surface-2: rgba(241, 245, 249, .8);--surface-glass: rgba(255, 255, 255, .5);--ink: #0f172a;--ink-2: #334155;--muted: #64748b;--grid: rgba(0, 0, 0, .06);--baseline: rgba(0, 0, 0, .12);--border: rgba(0, 0, 0, .08);--border-light: rgba(255, 255, 255, .8);--s1: #0284c7;--s1-gradient: linear-gradient(135deg, #0284c7 0%, #0369a1 100%);--s1-soft: rgba(2, 132, 199, .12);--good: #059669;--warning: #d97706;--critical: #dc2626;--good-soft: rgba(5, 150, 105, .12);--critical-soft: rgba(220, 38, 38, .12);--glass-shadow: 0 10px 30px -5px rgba(0, 0, 0, .08), inset 0 1px 1px 0 rgba(255, 255, 255, .9);--glass-glow: 0 0 15px rgba(2, 132, 199, .15)}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%}body{font-family:Plus Jakarta Sans,system-ui,-apple-system,sans-serif;background:var(--page);background-image:radial-gradient(circle at 10% 10%,rgba(56,189,248,.08) 0%,transparent 40%),radial-gradient(circle at 90% 90%,rgba(168,85,247,.08) 0%,transparent 40%),radial-gradient(circle at 50% 50%,rgba(16,185,129,.04) 0%,transparent 60%);background-attachment:fixed;color:var(--ink);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}.app{display:flex;min-height:100vh}.sidebar{width:230px;flex-shrink:0;background:var(--surface);backdrop-filter:blur(24px) saturate(200%);-webkit-backdrop-filter:blur(24px) saturate(200%);border-right:1px solid var(--border);border-top:1px solid var(--border-light);padding:20px 14px;display:flex;flex-direction:column;gap:6px;box-shadow:4px 0 24px #00000026;z-index:10}.logo-wrap{padding:6px 10px 18px}.logo-word{height:32px;display:none}.logo-for-dark,.logo-for-light{display:none}:root:not([data-theme=light]) .logo-for-dark{display:block;filter:drop-shadow(0 2px 8px rgba(255,255,255,.15))}:root[data-theme=light] .logo-for-light{display:block}.logo-sat{font-size:10.5px;color:var(--muted);margin-top:7px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}.nav-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:12px;color:var(--ink-2);cursor:pointer;font-size:13.5px;font-weight:500;text-decoration:none;border:1px solid transparent;background:transparent;width:100%;text-align:left;transition:all .25s cubic-bezier(.16,1,.3,1)}.nav-item svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;transition:transform .25s ease}.nav-item.active{background:var(--s1-gradient);color:#fff;font-weight:700;box-shadow:0 4px 20px -2px #38bdf873;border:1px solid rgba(255,255,255,.25)}.nav-item.active svg{transform:scale(1.1)}.nav-item:hover:not(.active){background:var(--surface-glass);border-color:var(--border);color:var(--ink);transform:translate(3px)}.badge-alerta-telefono{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;font-size:11px;font-weight:800;line-height:1;color:#fff;background:linear-gradient(135deg,#ef4444,#dc2626);border-radius:999px;margin-left:auto;box-shadow:0 2px 8px #ef44448c,0 0 0 1.5px #ffffff26;animation:pulsoBadgeTelefono 2.2s infinite ease-in-out;transition:transform .2s ease}.nav-item.active .badge-alerta-telefono{background:#fff;color:#ef4444;box-shadow:0 2px 8px #00000040;animation:none}@keyframes pulsoBadgeTelefono{0%{transform:scale(1);box-shadow:0 0 #ef4444b3}50%{transform:scale(1.1);box-shadow:0 0 0 5px #ef444400}to{transform:scale(1);box-shadow:0 0 #ef444400}}.sidebar .foot{margin-top:auto;padding:12px 14px;font-size:11.5px;color:var(--muted);border-top:1px solid var(--border);background:#ffffff05;border-radius:10px}.main{flex:1;padding:26px 32px;min-width:0}.topbar{display:flex;align-items:center;gap:16px;margin-bottom:24px;flex-wrap:wrap}.topbar h1{font-family:Outfit,sans-serif;font-size:22px;font-weight:700;letter-spacing:-.02em}.topbar .spacer{flex:1}.chips{display:flex;gap:8px;flex-wrap:wrap}.chip{padding:7px 16px;border-radius:999px;border:1px solid var(--border);border-top:1px solid var(--border-light);color:var(--ink-2);font-size:12.5px;font-weight:500;cursor:pointer;background:var(--surface-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:all .25s ease}.chip:hover{border-color:var(--s1);color:var(--ink);transform:translateY(-1px)}.chip.active{background:var(--s1-gradient);border-color:#ffffff4d;color:#fff;font-weight:700;box-shadow:0 4px 16px #38bdf859}select.chip,input.chip{outline:none;background:var(--surface-glass);backdrop-filter:blur(14px) saturate(180%);-webkit-backdrop-filter:blur(14px) saturate(180%);border:1px solid var(--border);border-top:1px solid var(--border-light);border-radius:999px;padding:6px 16px;height:34px;font-size:12.5px;font-weight:500;color:var(--ink-2);color-scheme:dark;box-shadow:var(--glass-shadow);transition:all .25s ease;font-family:inherit;cursor:pointer}select.chip{appearance:none;-webkit-appearance:none;padding-right:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23828fa6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}select.chip:hover,input.chip:hover{border-color:var(--s1);color:var(--ink);transform:translateY(-1px);box-shadow:0 4px 16px #38bdf840,inset 0 1px 1px #ffffff4d}select.chip:focus,input.chip:focus{border-color:var(--s1);box-shadow:0 0 0 2px var(--s1-soft),var(--glass-shadow)}select.chip option{background-color:#0d131f;color:#f1f5f9}.userchip{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 7px;border:1px solid var(--border);border-top:1px solid var(--border-light);border-radius:999px;background:var(--surface);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--glass-shadow)}.avatar{width:28px;height:28px;border-radius:50%;background:var(--s1-gradient);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0003}.userchip small{color:var(--muted);display:block;font-size:10.5px}.card{background:var(--surface);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--border);border-top:1px solid var(--border-light);border-radius:18px;padding:20px 22px;box-shadow:var(--glass-shadow);transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s ease;position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);pointer-events:none}.card:hover{border-color:#ffffff40;box-shadow:0 20px 48px -10px #00000080,inset 0 1px 1px #ffffff4d}.card h3{font-family:Outfit,sans-serif;font-size:14.5px;font-weight:700;color:var(--ink);margin-bottom:2px;letter-spacing:-.01em}.card .sub{font-size:12px;color:var(--muted);margin-bottom:14px}.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:18px}.kpi{position:relative;overflow:hidden;background:linear-gradient(145deg,#ffffff0d,#ffffff03),var(--surface)}.kpi:after{content:"";position:absolute;bottom:0;left:15%;right:15%;height:2px;background:var(--s1-gradient);border-radius:2px;box-shadow:0 0 12px var(--s1);opacity:.7}.kpi .label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:700}.kpi .value{font-family:Outfit,sans-serif;font-size:28px;font-weight:800;margin-top:6px;letter-spacing:-.02em;background:linear-gradient(180deg,#fff 30%,#cfd7e6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 2px 10px rgba(0,0,0,.3)}:root[data-theme=light] .kpi .value{background:linear-gradient(180deg,#0f172a,#334155);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.kpi .delta{font-size:11.5px;margin-top:4px;color:var(--muted);font-weight:500}.grid-2{display:grid;grid-template-columns:3fr 2fr;gap:14px;margin-bottom:18px}.grid-2b{display:grid;grid-template-columns:2fr 3fr;gap:14px;margin-bottom:18px}@media(max-width:1100px){.kpis{grid-template-columns:repeat(2,1fr)}.grid-2,.grid-2b{grid-template-columns:1fr}}table{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}th{text-align:left;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.07em;padding:10px 12px;border-bottom:1px solid var(--grid);background:#ffffff05}td{padding:11px 12px;border-bottom:1px solid var(--grid);font-variant-numeric:tabular-nums;transition:background .2s ease}tr:hover td{background:#ffffff08}tr:last-child td{border-bottom:none}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#00f2fe;box-shadow:0 0 8px #00f2fe;margin-right:10px}.pct-track{background:#0000004d;border:1px solid var(--border);border-radius:20px;height:8px;width:85px;display:inline-block;vertical-align:middle;margin-right:10px;overflow:hidden;position:relative}.pct-fill{background:var(--s1-gradient);border-radius:20px;height:100%;display:block;box-shadow:0 0 10px #38bdf899;transition:width .6s cubic-bezier(.16,1,.3,1)}.pop-wrap{max-width:960px;margin:0 auto}.waiting{text-align:center;padding:22px 0 16px;color:var(--muted);font-size:13.5px}.pulse{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:10px;vertical-align:middle;box-shadow:0 0 10px #34d39999;animation:pul 1.6s infinite ease-in-out}.pulse.on{background:var(--good)}.pulse.off{background:var(--critical);animation:none;box-shadow:0 0 10px #f8717199}@keyframes pul{0%,to{opacity:1;transform:scale(1);box-shadow:0 0 12px var(--good)}50%{opacity:.4;transform:scale(.85);box-shadow:0 0 4px var(--good)}}.callcard{border-radius:16px;overflow:hidden;border:1px solid var(--border);border-top:1px solid var(--border-light);background:var(--surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);margin-bottom:12px;box-shadow:var(--glass-shadow);transition:all .3s ease}.callcard.sonando{border-color:#f59e0b;box-shadow:0 0 30px #f59e0b66,inset 0 1px 1px #fff6;animation:amberGlow 1.8s infinite ease-in-out}@keyframes amberGlow{0%,to{box-shadow:0 0 20px #f59e0b4d;border-color:#f59e0bcc}50%{box-shadow:0 0 40px #f59e0ba6;border-color:#fbbf24}}.callcard.contestada{border-color:#10b981;box-shadow:0 0 30px #34d39966,inset 0 1px 1px #fff6;animation:greenGlow 2.2s infinite ease-in-out}@keyframes greenGlow{0%,to{box-shadow:0 0 20px #34d3994d;border-color:#34d399cc}50%{box-shadow:0 0 40px #34d39999;border-color:#34d399}}.logout-btn{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border:1px solid var(--border);border-top:1px solid var(--border-light);border-radius:999px;background:var(--surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink-2);cursor:pointer;font-size:12.5px;font-weight:500;transition:all .25s ease}.logout-btn:hover{background:#ffffff1a;color:var(--ink);transform:translateY(-1px)}.callcard .head{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#ffffff0a;border-bottom:1px solid var(--border)}.ringicon{width:32px;height:32px;border-radius:50%;background:var(--s1-soft);color:var(--s1);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 0 12px #38bdf84d}.ext-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin-top:12px}.ext-card{border:1px solid var(--border);border-top:1px solid var(--border-light);border-radius:14px;padding:14px 16px;background:var(--surface);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--glass-shadow);transition:all .25s ease}.ext-card:hover{transform:translateY(-2px);border-color:#ffffff40}.ext-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.ext-num{font-size:16px;font-weight:800;color:var(--ink)}.ext-estado{font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.5px}.ext-card.libre .ext-estado{background:#ffffff14;color:var(--muted)}.ext-card.sonando .ext-estado{background:#38bdf833;color:var(--s1);box-shadow:0 0 8px #38bdf84d}.ext-card.contestada .ext-estado,.ext-card.en_llamada .ext-estado{background:#34d39933;color:var(--good);box-shadow:0 0 8px #34d3994d}.ext-nombre{font-size:13.5px;font-weight:600;color:var(--ink-2);margin-bottom:6px}.ext-info{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}.ext-cli{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--s1);font-weight:600;font-size:12px}.ext-timer{font-weight:700;font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink);flex-shrink:0}.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;font-size:12px;font-weight:700;margin-top:10px}.badge svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0}.badge.ok{background:#34d39926;color:var(--good);border:1px solid rgba(52,211,153,.3)}.badge.no{background:#f8717126;color:var(--critical);border:1px solid rgba(248,113,113,.3)}.mant-list{margin-top:12px;display:flex;flex-direction:column;gap:6px}.mant-list .row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 10px;border-radius:8px;background:#ffffff08;font-size:12px}.mant-list .row span:last-child{flex-shrink:0;color:var(--muted);font-size:11.5px}.mant-toggle-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:6px;padding:8px 14px;border-radius:12px;background:var(--surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border);border-top:1px solid var(--border-light);color:var(--s1);font-size:12px;font-weight:700;cursor:pointer;box-shadow:var(--glass-shadow);transition:all .25s ease}.mant-toggle-btn:hover{background:#38bdf826;border-color:#38bdf866;color:#fff;transform:translateY(-1px)}.modal-box{background:var(--surface);backdrop-filter:blur(28px) saturate(200%);-webkit-backdrop-filter:blur(28px) saturate(200%);border:1px solid var(--border);border-top:1px solid var(--border-light);border-radius:20px;padding:26px 28px;width:100%;max-width:500px;box-shadow:0 24px 64px #0009,inset 0 1px 1px #fff3}.empresa-chip{display:inline-flex;align-items:center;gap:8px;margin-left:14px;padding:6px 14px;border-radius:999px;background:var(--surface-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border);border-top:1px solid var(--border-light);color:var(--s1);font-size:12.5px;font-weight:700;white-space:nowrap;box-shadow:var(--glass-shadow);height:34px;transition:all .25s ease}.empresa-chip svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0}.empresa-btn{cursor:pointer;background:var(--surface)}.empresa-btn:hover{background:#ffffff1a;transform:translateY(-1px)}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bg-ambient)}.login-card{width:100%;max-width:440px;padding:40px 32px;text-align:center;border-radius:24px;background:var(--surface);backdrop-filter:blur(28px) saturate(200%);-webkit-backdrop-filter:blur(28px) saturate(200%);border:1px solid var(--border);border-top:1px solid var(--border-light);box-shadow:0 24px 64px #0009,inset 0 1px 1px #fff3}.login-logo{height:48px;margin:0 auto 20px}.login-card h2{font-family:Outfit,sans-serif;font-size:18px;font-weight:700;color:var(--ink);margin-bottom:6px}.login-card p{color:var(--muted);font-size:13.5px;margin-bottom:24px}.gbtn{display:inline-flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:12px 20px;border-radius:12px;background:#fff;color:#1f2937;font-weight:700;font-size:14px;text-decoration:none;box-shadow:0 4px 16px #0003;transition:all .25s ease}.gbtn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.login-card .note{margin-top:24px;font-size:12px;color:var(--muted);line-height:1.5}