
:root{
  --bg:#f4f6fa;--card:#fff;--ink:#0f172a;--mut:#64748b;--line:#e5e9f0;--soft:#f8fafc;
  --pri:#007bff;--pri-d:#0063cc;--pri-s:#e6f1ff;--side:#0b1220;--side2:#131c2e;
  --ok:#0e9f6e;--ok-s:#e3f8ef;--warn:#d97706;--warn-s:#fef3c7;--bad:#dc2626;--bad-s:#fee2e2;--vio:#7c3aed;--vio-s:#ede9fe;--gold:#c9a54e;
  --r:14px;--sh:0 1px 2px rgba(15,23,42,.04),0 6px 20px rgba(15,23,42,.06);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Plus Jakarta Sans',Inter,system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,select,textarea{font:inherit;color:inherit}
.app{display:grid;grid-template-columns:248px 1fr;height:100vh}
/* sidebar */
.side{background:var(--side);color:#cbd5e1;display:flex;flex-direction:column;padding:18px 14px;overflow-y:auto}
.brand{display:flex;align-items:center;gap:10px;padding:4px 8px 18px;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:12px}
.brand-l{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#007bff,#7c3aed);display:grid;place-items:center;color:#fff;font-weight:800;font-size:15px;letter-spacing:-.5px}
.brand b{display:block;color:#fff;font-size:16px;letter-spacing:.5px}.brand small{font-size:11.5px;color:#94a3b8}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:10px;color:#cbd5e1;text-decoration:none;font-weight:500;font-size:13.5px;margin-bottom:2px}
.nav a:hover{background:var(--side2);color:#fff}
.nav a.on{background:var(--pri);color:#fff}
.nav a svg{width:18px;height:18px}
.nav .cnt{margin-left:auto;font-size:11px;background:rgba(255,255,255,.12);padding:1px 8px;border-radius:20px}
.nav-t{font-size:10.5px;letter-spacing:1.4px;color:#64748b;font-weight:700;padding:14px 11px 6px}
.side-foot{margin-top:auto;padding:12px;border-radius:12px;background:var(--side2);font-size:12px;color:#94a3b8}
.side-foot b{color:#fff;display:block;margin-bottom:2px}
/* main */
.main{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.top{display:flex;align-items:center;gap:12px;padding:12px 24px;background:#fff;border-bottom:1px solid var(--line)}
.search{flex:1;min-width:320px;max-width:460px;display:flex;align-items:center;gap:8px;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:8px 12px}
.search input{border:0;background:none;outline:none;width:100%}
.search svg{width:16px;height:16px;color:var(--mut)}
.demo{display:flex;align-items:center;gap:8px;font-size:12px;color:#92400e;background:var(--warn-s);border:1px solid #fde68a;padding:6px 10px;border-radius:9px;white-space:nowrap}
.demo svg{width:15px;height:15px}
.sp{flex:1}
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:10px;font-weight:600;font-size:13px;white-space:nowrap;transition:background .15s}
.btn svg{width:16px;height:16px}
.btn-p{background:var(--pri);color:#fff}.btn-p:hover{background:var(--pri-d)}
.btn-g{background:#fff;border:1px solid var(--line)}.btn-g:hover{background:var(--soft)}
.btn-a{background:linear-gradient(135deg,#0b1220,#1e293b);color:#fff}
.btn-a .dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.25)}
.view{flex:1;overflow-y:auto;padding:22px 24px 40px}
.h1{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.h1 h1{font-size:22px;font-weight:800;letter-spacing:-.4px}
.h1 p{color:var(--mut);font-size:13.5px;margin-top:2px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}
.pad{padding:18px}
.ct{font-size:13px;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.ct svg{width:16px;height:16px;color:var(--pri)}
.ct .sp2{margin-left:auto;font-weight:500;color:var(--mut);font-size:12px}
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:16px}
@media(max-width:1350px){.kpis{grid-template-columns:repeat(3,1fr)}}
.kpi{padding:16px}
.kpi .l{font-size:12px;color:var(--mut);font-weight:600;display:flex;align-items:center;gap:6px}
.kpi .l svg{width:14px;height:14px}
.kpi .v{font-size:23px;font-weight:800;letter-spacing:-.6px;margin-top:4px}
.kpi .s{font-size:11.5px;color:var(--mut)}
.kpi .s b{color:var(--ok)}
.g2{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;margin-bottom:16px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:1200px){.g2,.g3{grid-template-columns:1fr}}
/* funnel */
.fun-row{display:grid;grid-template-columns:150px 1fr 120px;gap:10px;align-items:center;padding:5px 0;font-size:12.5px;cursor:pointer}
.fun-row:hover .fun-bar i{filter:brightness(1.08)}
.fun-bar{background:var(--soft);border-radius:6px;height:22px;overflow:hidden}
.fun-bar i{display:flex;align-items:center;height:100%;border-radius:6px;background:var(--pri);color:#fff;font-style:normal;font-size:11px;font-weight:700;padding-left:8px;min-width:26px}
.fun-row .m{text-align:right;color:var(--mut);font-weight:600}
/* lists */
.li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer}
.li:last-child{border-bottom:0}
.li:hover .li-t{color:var(--pri)}
.li-ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:0 0 36px}
.li-ic svg{width:17px;height:17px}
.li-t{font-weight:600;font-size:13.5px}
.li-s{font-size:12px;color:var(--mut)}
.li-r{margin-left:auto;text-align:right;font-size:12.5px;font-weight:700;white-space:nowrap}
.li-r small{display:block;font-weight:500;color:var(--mut)}
.c-blue{background:var(--pri-s);color:var(--pri)}.c-ok{background:var(--ok-s);color:var(--ok)}.c-warn{background:var(--warn-s);color:var(--warn)}.c-bad{background:var(--bad-s);color:var(--bad)}.c-vio{background:var(--vio-s);color:var(--vio)}
/* pills */
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap}
.e0{background:#f1f5f9;color:#475569}.e1{background:#e0f2fe;color:#0369a1}.e2{background:#e6f1ff;color:#0057b8}.e3{background:#ede9fe;color:#6d28d9}.e4{background:#fef3c7;color:#b45309}
.e5{background:#ffedd5;color:#c2410c}.e6{background:#dcfce7;color:#15803d}.e7{background:#ccfbf1;color:#0f766e}.e8{background:#d1fae5;color:#047857}
.nv{font-size:11px;font-weight:800;padding:2px 7px;border-radius:6px}
.nvA{background:#0b1220;color:#fff}.nvB{background:#e2e8f0;color:#334155}.nvC{background:var(--ok-s);color:var(--ok)}
/* table */
.tools{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.sel,.inp{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 11px;outline:none;font-size:13px}
.inp:focus,.sel:focus{border-color:var(--pri)}
.tabs-s{display:flex;background:#fff;border:1px solid var(--line);border-radius:10px;padding:3px}
.tabs-s button{padding:6px 12px;border-radius:8px;font-size:12.5px;font-weight:600;color:var(--mut)}
.tabs-s button.on{background:var(--ink);color:#fff}
table.t{width:100%;border-collapse:collapse}
.t th{text-align:left;font-size:11.5px;color:var(--mut);font-weight:700;letter-spacing:.3px;padding:11px 14px;border-bottom:1px solid var(--line);background:var(--soft);position:sticky;top:0}
.t td{padding:11px 14px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:middle}
.t tr.r{cursor:pointer}.t tr.r:hover td{background:#f8fbff}
.t .nm{font-weight:700}.t td.nw,.t th.nw{white-space:nowrap}.t .dm{font-size:11.5px;color:var(--mut)}
.score{display:flex;align-items:center;gap:7px;font-weight:700;font-size:12.5px}
.score i{display:block;width:46px;height:6px;border-radius:4px;background:var(--line);overflow:hidden;position:relative}
.score i b{position:absolute;inset:0;border-radius:4px;background:var(--pri)}
.pager{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;font-size:12.5px;color:var(--mut)}
/* ficha */
.back{display:inline-flex;align-items:center;gap:6px;color:var(--mut);font-weight:600;font-size:13px;margin-bottom:12px}
.back svg{width:16px;height:16px}
.fh{display:flex;gap:18px;align-items:flex-start;padding:20px;flex-wrap:wrap}
.av{width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,#0b1220,#334155);color:#fff;display:grid;place-items:center;font-weight:800;font-size:20px;flex:0 0 58px}
.fh h2{font-size:21px;font-weight:800;letter-spacing:-.4px}
.fh .meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px;align-items:center;font-size:12.5px;color:var(--mut)}
.fh .acts{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.ring{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:17px;position:relative}
.ring small{position:absolute;bottom:-17px;font-size:10.5px;color:var(--mut);font-weight:600;white-space:nowrap}
.stepper{display:flex;gap:4px;padding:0 20px 18px;overflow-x:auto}
.stepper button{flex:1;min-width:92px;font-size:11px;font-weight:700;padding:8px 6px;border-radius:8px;background:var(--soft);color:var(--mut);border:1px solid var(--line)}
.stepper button.done{background:var(--pri-s);color:var(--pri);border-color:#bfdbfe}
.stepper button.cur{background:var(--pri);color:#fff;border-color:var(--pri)}
.ftabs{display:flex;gap:4px;border-bottom:1px solid var(--line);padding:0 14px}
.ftabs button{padding:12px 14px;font-weight:600;font-size:13px;color:var(--mut);border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;gap:7px;align-items:center}
.ftabs button svg{width:15px;height:15px}
.ftabs button.on{color:var(--pri);border-color:var(--pri)}
.ejes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:1100px){.ejes{grid-template-columns:repeat(2,1fr)}}
.eje{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--soft)}
.eje .k{font-size:11px;font-weight:700;color:var(--mut);display:flex;gap:6px;align-items:center;letter-spacing:.3px;text-transform:uppercase}
.eje .k svg{width:14px;height:14px;color:var(--pri)}
.eje .k em{font-style:normal;margin-left:auto;background:#fff;border:1px solid var(--line);border-radius:6px;padding:0 6px;font-size:10.5px}
.eje .v{font-weight:700;margin-top:5px;font-size:13.5px}
.eje.vacio .v{color:#94a3b8;font-weight:500}
.kv{display:grid;grid-template-columns:130px 1fr;gap:6px 12px;font-size:13px}
.kv span{color:var(--mut)}
/* timeline */
.tl{position:relative;padding-left:4px}
.tm{display:flex;gap:12px;margin-bottom:14px}
.tm-ic{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:0 0 32px}
.tm-ic svg{width:15px;height:15px}
.tm-b{flex:1;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:10px 13px}
.tm-b.ag{background:#f5f3ff;border-color:#ddd6fe}
.tm-b.cl{background:#fff}
.tm-h{font-size:11.5px;color:var(--mut);display:flex;gap:8px;margin-bottom:3px}
.tm-h b{color:var(--ink)}
.tm-x{font-size:13.2px}
/* kanban */
.kb{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px;min-height:calc(100vh - 190px)}
.col{flex:0 0 250px;background:#eef2f7;border-radius:14px;padding:10px;display:flex;flex-direction:column}
.col.over{outline:2px dashed var(--pri);background:#e6f1ff}
.col-h{display:flex;align-items:center;gap:7px;padding:4px 4px 10px;font-weight:700;font-size:12.5px}
.col-h .n{background:#fff;border-radius:20px;padding:0 8px;font-size:11.5px;color:var(--mut)}
.col-h .sum{margin-left:auto;font-size:11.5px;color:var(--mut);font-weight:600}
.kc{background:#fff;border:1px solid var(--line);border-radius:11px;padding:11px;margin-bottom:8px;cursor:grab;box-shadow:0 1px 2px rgba(15,23,42,.05)}
.kc:hover{border-color:#bfdbfe}
.kc.drag{opacity:.4}
.kc .n{font-weight:700;font-size:13px;line-height:1.3}
.kc .e{font-size:12px;color:var(--mut);margin:4px 0 8px}
.kc .f{display:flex;justify-content:space-between;align-items:center;font-size:12px}
.kc .f b{font-size:12.5px}
.kc .who{font-size:11px;color:var(--mut);display:flex;align-items:center;gap:4px}
.kc .who svg{width:12px;height:12px}
/* inbox */
.inbox{display:grid;grid-template-columns:340px 1fr;height:calc(100vh - 150px);overflow:hidden;padding:0}
.ib-l{border-right:1px solid var(--line);overflow-y:auto}
.ib-i{padding:13px 15px;border-bottom:1px solid var(--line);cursor:pointer}
.ib-i:hover{background:var(--soft)}.ib-i.on{background:var(--pri-s)}
.ib-i .n{font-weight:700;font-size:13px;display:flex;gap:6px;align-items:center}
.ib-i .n span{margin-left:auto;font-size:11px;color:var(--mut);font-weight:500}
.ib-i .x{font-size:12.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.ib-i .tg{margin-top:6px;display:flex;gap:5px}
.ib-r{display:flex;flex-direction:column;min-width:0}
.ib-h{padding:13px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.ib-m{flex:1;overflow-y:auto;padding:18px;background:#f8fafc}
.bub{max-width:70%;margin-bottom:11px;padding:10px 13px;border-radius:14px;font-size:13.2px;background:#fff;border:1px solid var(--line)}
.bub.out{margin-left:auto;background:#eef6ff;border-color:#cfe3ff}
.bub.ag{margin-left:auto;background:#f5f3ff;border-color:#ddd6fe}
.bub.nt{max-width:100%;text-align:center;background:none;border:0;color:var(--mut);font-size:12px}
.bub small{display:flex;gap:6px;align-items:center;font-size:11px;color:var(--mut);margin-top:4px}
.bub small svg{width:12px;height:12px}
.ib-c{border-top:1px solid var(--line);padding:12px;display:flex;gap:8px;align-items:center}
.ib-c .inp{flex:1}
.sug{display:flex;gap:8px;align-items:center;font-size:12px;background:#f5f3ff;border:1px solid #ddd6fe;color:#5b21b6;padding:8px 12px;border-radius:10px;margin:0 12px 0;cursor:pointer}
.sug svg{width:14px;height:14px}
/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.cal .dh{font-size:11.5px;font-weight:700;color:var(--mut);text-align:center;padding:4px}
.day{background:#fff;border:1px solid var(--line);border-radius:12px;min-height:118px;padding:8px;display:flex;flex-direction:column;gap:4px}
.day.off{background:transparent;border:1px dashed var(--line)}
.day.today{border-color:var(--pri);box-shadow:0 0 0 2px var(--pri-s)}
.day .dn{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:12.5px}
.cap{display:flex;gap:2px}.cap i{width:9px;height:5px;border-radius:2px;background:var(--line)}.cap i.f{background:var(--ok)}.cap.full i.f{background:var(--bad)}
.evc{font-size:11px;font-weight:600;border-radius:6px;padding:3px 6px;cursor:pointer;line-height:1.3}
.evc.l{background:#e6f1ff;color:#0057b8}.evc.o{background:#ede9fe;color:#6d28d9}.evc.t{background:#fef3c7;color:#b45309}
.legend{display:flex;gap:14px;font-size:12px;color:var(--mut);margin-bottom:12px;flex-wrap:wrap}
.legend span{display:flex;gap:6px;align-items:center}.legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
/* modal */
.ov{position:fixed;inset:0;background:rgba(15,23,42,.45);display:none;align-items:center;justify-content:center;z-index:50;padding:20px}
.ov.on{display:flex}
.mod{background:#fff;border-radius:18px;width:min(760px,100%);max-height:92vh;overflow-y:auto;box-shadow:0 30px 80px rgba(15,23,42,.35)}
.mod-h{display:flex;align-items:center;gap:10px;padding:18px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}
.mod-h h3{font-size:16px;font-weight:800}
.mod-h .x{margin-left:auto;width:32px;height:32px;border-radius:9px;display:grid;place-items:center}
.mod-h .x:hover{background:var(--soft)}
.mod-b{padding:20px}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fl label{display:block;font-size:12px;font-weight:700;color:var(--mut);margin-bottom:5px}
.fl .inp,.fl .sel{width:100%}
.paqs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.paq{border:1.5px solid var(--line);border-radius:12px;padding:12px;cursor:pointer}
.paq.on{border-color:var(--pri);background:var(--pri-s)}
.paq b{display:block;font-size:13.5px}.paq span{font-size:12px;color:var(--mut)}.paq em{font-style:normal;font-weight:800;color:var(--pri);font-size:13px;display:block;margin-top:4px}
.chk{display:flex;align-items:center;gap:8px;font-size:13px;padding:6px 0}
.tot{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-top:14px}
.tot div{display:flex;justify-content:space-between;font-size:13px;padding:3px 0}
.tot .g{font-size:17px;font-weight:800;border-top:1px solid var(--line);margin-top:6px;padding-top:8px}
.tot .an{color:var(--ok);font-weight:700}
.mod-f{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--line);position:sticky;bottom:0;background:#fff}
/* agent */
.ag-m{height:min(520px,60vh);overflow-y:auto;padding:16px 20px;background:#f8fafc}
.ag-q{display:flex;flex-wrap:wrap;gap:7px;padding:12px 20px;border-top:1px solid var(--line)}
.ag-q button{font-size:12px;font-weight:600;padding:7px 11px;border-radius:20px;background:var(--pri-s);color:var(--pri)}
.ag-q button:hover{background:#d6e8ff}
.ans{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px;font-size:13.2px;max-width:88%}
.ans.q{margin-left:auto;background:#0b1220;color:#fff;border:0}
.ans .src{display:block;margin-top:6px;font-size:10.5px;letter-spacing:.6px;color:var(--mut);font-weight:700}
.ans table{width:100%;font-size:12.5px;margin-top:6px;border-collapse:collapse}.ans td{padding:3px 0;border-bottom:1px dashed var(--line)}.ans td:last-child{text-align:right;font-weight:700}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:#0b1220;color:#fff;padding:11px 18px;border-radius:12px;font-size:13px;font-weight:600;opacity:0;transition:.25s;z-index:60;display:flex;gap:8px;align-items:center}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.toast svg{width:16px;height:16px;color:#4ade80}
.empty{padding:30px;text-align:center;color:var(--mut);font-size:13px}
.note{display:flex;gap:10px;background:#f5f3ff;border:1px solid #ddd6fe;color:#4c1d95;border-radius:12px;padding:12px 14px;font-size:12.8px}
.note svg{width:17px;height:17px;flex:0 0 17px;margin-top:1px}
.note.y{background:var(--warn-s);border-color:#fde68a;color:#78350f}
.ola{padding:18px}
.ola-h{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.ola-n{width:38px;height:38px;border-radius:11px;background:var(--pri);color:#fff;display:grid;place-items:center;font-weight:800}
.ola-h b{display:block}.ola-h small{color:var(--mut);font-size:12px}
.ola-s{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ola-s div{background:var(--soft);border-radius:10px;padding:9px;text-align:center}
.ola-s b{display:block;font-size:17px}.ola-s span{font-size:11px;color:var(--mut)}
.seq{display:flex;gap:10px;flex-wrap:wrap}
.seq div{flex:1;min-width:150px;border:1px solid var(--line);border-radius:12px;padding:12px;background:#fff}
.seq b{font-size:11px;color:var(--pri);letter-spacing:.6px}
.seq p{font-size:12.8px;margin-top:4px}
.pq{padding:18px}
.pq h3{font-size:15px;font-weight:800}.pq p{color:var(--mut);font-size:12.8px;margin:6px 0 12px}
.pq .pr{font-size:22px;font-weight:800;color:var(--pri)}.pq .pr small{font-size:12px;color:var(--mut);font-weight:600}
/* ---- v2: nivel de detalle de las verticales ---- */
.kick{font-size:11px;font-weight:800;letter-spacing:1.4px;color:var(--pri);text-transform:uppercase;margin-bottom:3px}
.ptabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:4px 0 16px;overflow-x:auto}
.ptabs button{padding:10px 14px;font-weight:600;font-size:13px;color:var(--mut);border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;gap:7px;align-items:center;white-space:nowrap}
.ptabs button svg{width:15px;height:15px}
.ptabs button.on{color:var(--pri);border-color:var(--pri)}
.ptabs .bd{background:var(--bad);color:#fff;font-size:10.5px;font-weight:800;border-radius:20px;padding:0 7px}
.kpis5{grid-template-columns:repeat(5,1fr)}
.kpis4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1350px){.kpis5,.kpis4{grid-template-columns:repeat(3,1fr)}}
.kpi.alert .v{color:var(--bad)}
.ai{display:flex;gap:12px;align-items:flex-start;background:linear-gradient(135deg,#f5f3ff,#eef6ff);border:1px solid #ddd6fe;border-radius:14px;padding:14px 16px;margin-bottom:16px}
.ai-ic{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#7c3aed,#007bff);color:#fff;display:grid;place-items:center;flex:0 0 34px}
.ai-ic svg{width:17px;height:17px}
.ai b{display:block;font-size:13px;margin-bottom:2px}
.ai p{font-size:13px;color:#334155}
.ai .acts{display:flex;gap:8px;margin-top:9px;flex-wrap:wrap}
.btn-s{padding:6px 11px;font-size:12px;border-radius:8px}
.btn-v{background:#7c3aed;color:#fff}.btn-v:hover{background:#6d28d9}
.btn-ok{background:var(--ok);color:#fff}
.btn-bad{background:#fff;border:1px solid #fecaca;color:var(--bad)}
.hero{background:linear-gradient(135deg,#0b1220,#1e293b);color:#fff;border-radius:var(--r);padding:20px 22px;margin-bottom:16px}
.hero .l{font-size:12px;color:#94a3b8;font-weight:700;letter-spacing:.6px;text-transform:uppercase}
.hero .v{font-size:32px;font-weight:800;letter-spacing:-1px}
.hero .s{font-size:13px;color:#cbd5e1}
.hero-g{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:18px;align-items:end}
@media(max-width:1100px){.hero-g{grid-template-columns:1fr 1fr}}
.prob{font-size:40px;font-weight:800;color:#4ade80;letter-spacing:-1px}
.scale{margin-top:18px}
.scale svg{width:100%;height:70px;display:block}
.hz{display:flex;gap:14px;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;margin-bottom:10px}
.hz-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:0 0 40px}
.hz-ic svg{width:19px;height:19px}
.hz h4{font-size:14px;font-weight:700}
.hz p{font-size:12.8px;color:var(--mut);margin-top:2px}
.hz .m{margin-left:auto;text-align:right;white-space:nowrap}
.hz .m b{display:block;font-size:16px;color:var(--bad)}
.hz .m small{font-size:11px;color:var(--mut)}
.hz .acts{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap}
.hz.done{opacity:.55}
.hz.done h4{text-decoration:line-through}
.um{position:relative}
.um-b{display:flex;align-items:center;gap:9px;padding:5px 10px 5px 5px;border-radius:12px;border:1px solid var(--line);background:#fff}
.um-av{width:32px;height:32px;border-radius:10px;background:#0b1220;color:#fff;display:grid;place-items:center;font-weight:800;font-size:12px}
.um-b b{display:block;font-size:12.5px;line-height:1.2;text-align:left}.um-b small{display:block;font-size:11px;color:var(--mut);text-align:left}
.um-d{position:absolute;right:0;top:48px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 50px rgba(15,23,42,.18);width:290px;padding:8px;z-index:40;display:none}
.um-d.on{display:block}
.um-d .h{font-size:10.5px;letter-spacing:1.3px;font-weight:800;color:var(--mut);padding:8px 10px 4px}
.um-d button{display:flex;gap:10px;align-items:center;width:100%;padding:8px 10px;border-radius:10px;text-align:left}
.um-d button:hover{background:var(--soft)}
.um-d button.on{background:var(--pri-s)}
.um-d .sm{font-size:11px;color:var(--mut);padding:8px 10px;border-top:1px solid var(--line);margin-top:6px}
.cols3{display:grid;grid-template-columns:320px 1fr 280px;height:calc(100vh - 300px);min-height:520px;overflow:hidden;padding:0}
@media(max-width:1300px){.cols3{grid-template-columns:300px 1fr}.cols3 .ib-x{display:none}}
.ib-x{border-left:1px solid var(--line);overflow-y:auto;padding:16px;background:#fff}
.ib-x h5{font-size:11px;letter-spacing:1.2px;color:var(--mut);margin:14px 0 6px}
.ib-x .kv{grid-template-columns:96px 1fr;font-size:12.5px}
.sla{font-size:11px;font-weight:700;color:var(--bad)}
.doc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:26px 28px;font-size:13px}
.doc-h{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid var(--ink);padding-bottom:12px;margin-bottom:14px}
.doc-h .lg{display:flex;gap:10px;align-items:center}
.doc-h h2{font-size:18px;font-weight:800;letter-spacing:.5px}
.doc table{width:100%;border-collapse:collapse;margin:10px 0}
.doc th{font-size:11px;text-align:left;background:var(--ink);color:#fff;padding:7px 9px}
.doc td{padding:7px 9px;border-bottom:1px solid var(--line)}
.doc .r{text-align:right;white-space:nowrap}
.doc .tt td{border:0;padding:3px 9px}
.doc .tt .g td{font-weight:800;font-size:15px;border-top:2px solid var(--ink);padding-top:7px}
.doc .fine{font-size:11.5px;color:var(--mut);margin-top:10px}
.doc .two{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:6px}
.doc .two div{background:var(--soft);border-radius:8px;padding:10px 12px}
.doc .two small{display:block;font-size:10.5px;color:var(--mut);font-weight:700;letter-spacing:.6px}
.mod.lg{width:min(920px,100%)}
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.wd{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;min-height:260px}
.wd h5{font-size:12px;font-weight:800;margin-bottom:8px;display:flex;justify-content:space-between}
.wev{border-radius:9px;padding:8px;margin-bottom:6px;font-size:11.5px;cursor:pointer;border-left:3px solid var(--pri);background:#f1f7ff}
.wev.o{border-color:#7c3aed;background:#f5f3ff}.wev.t{border-color:#d97706;background:#fffbeb}
.wev b{display:block;font-size:12px}
.day.over{border-color:var(--bad);box-shadow:0 0 0 2px var(--bad-s)}
.bars{display:flex;align-items:flex-end;gap:10px;height:160px;padding-top:10px}
.bars div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;font-size:11px;color:var(--mut);height:100%}
.bars i{display:block;width:100%;border-radius:8px 8px 3px 3px;background:var(--pri);min-height:4px}
.bars b{font-size:11.5px;color:var(--ink)}
.months{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:1200px){.months{grid-template-columns:repeat(3,1fr)}}
.mon{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;min-height:130px}
.mon h5{font-size:12.5px;font-weight:800;margin-bottom:6px;display:flex;justify-content:space-between}
.mon .it{font-size:12px;padding:4px 0;border-bottom:1px dashed var(--line);display:flex;justify-content:space-between;gap:6px;cursor:pointer}
.mon .it:last-child{border:0}
.tpl{white-space:pre-wrap;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:12px;font-size:12.8px;line-height:1.55}
.tpl em{font-style:normal;background:#ede9fe;color:#6d28d9;border-radius:4px;padding:0 4px;font-weight:700}
.tour{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);background:#0b1220;color:#fff;border-radius:16px;padding:12px 14px 12px 18px;display:none;align-items:center;gap:14px;z-index:45;box-shadow:0 18px 50px rgba(15,23,42,.4);max-width:min(780px,92vw)}
.tour.on{display:flex}
.tour .st{font-size:11px;color:#94a3b8;font-weight:700;letter-spacing:.8px}
.tour p{font-size:13.2px}
.tour .btn{padding:7px 11px}
.tour .btn-g{background:#1e293b;border-color:#334155;color:#fff}
.lost{display:flex;align-items:center;gap:10px;font-size:12.5px;padding:6px 0}
.lost i{display:block;height:10px;border-radius:5px;background:#f87171}
.edit-pp{width:110px;padding:6px 8px;font-size:13px}
.bdg{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:6px}
.bdg.r{background:var(--bad-s);color:var(--bad)}.bdg.y{background:var(--warn-s);color:#92400e}.bdg.g{background:var(--ok-s);color:var(--ok)}.bdg.v{background:var(--vio-s);color:var(--vio)}
.bdg svg{width:11px;height:11px}
.kc .bdgs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:6px}
.ib-r{overflow:hidden}
.ib-c .sel{width:118px;flex:0 0 118px;text-overflow:ellipsis}
.ib-c .inp{min-width:0}
/* ---- sistema real: login ---- */
body.sin-sesion .app{display:none}
#login{position:fixed;inset:0;background:linear-gradient(135deg,#0b1220,#1e293b);display:none;align-items:center;justify-content:center;padding:20px;z-index:80}
body.sin-sesion #login{display:flex}
.lg-box{background:#fff;border-radius:20px;padding:30px;width:min(400px,100%);box-shadow:0 30px 80px rgba(0,0,0,.35)}
.lg-box h2{font-size:21px;font-weight:800;margin-bottom:4px}
.lg-box .fl label{display:block;font-size:12px;font-weight:700;color:var(--mut);margin-bottom:5px}
.lg-box .inp{width:100%}
.lg-err{color:var(--bad);font-size:12.5px;font-weight:600;margin-top:10px;min-height:16px}
