:root{--pu:#6b2a8f;--pu2:#8b3fb8;--pl:#f3ecf8;--nv:#0f0c2e;--nv2:#1b1650;--ink:#1d1b35;--mu:#5d5a78;--ln:#e3dcea;--gd:#d4af37;--ok:#1f9d63;--wa:#e0a02c;--ko:#d2453d}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Open Sans",Arial,sans-serif;color:var(--ink);background:#0d0a2a}
h1,h2,h3,h4{font-family:Montserrat,Arial,sans-serif}
button{font:inherit}
[hidden]{display:none!important}
/* ---------- LOGIN ---------- */
.anet-login{min-height:100vh;background:radial-gradient(circle at 85% 10%,rgba(212,175,55,.18),transparent 40%),radial-gradient(circle at 10% 90%,rgba(139,63,184,.35),transparent 45%),linear-gradient(135deg,#0a1b3a,#1a0b33 60%,#2a0d44)}
.lg{min-height:100vh;display:grid;place-items:center;padding:24px;position:relative;overflow:hidden}
.lg-art span{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.08);animation:lgR 18s linear infinite}
.lg-art span:nth-child(1){width:520px;height:520px;top:-160px;right:-120px}
.lg-art span:nth-child(2){width:760px;height:760px;bottom:-380px;left:-260px;animation-duration:26s}
.lg-art span:nth-child(3){width:260px;height:260px;top:40%;left:12%;border-color:rgba(212,175,55,.18);animation-duration:12s}
@keyframes lgR{to{transform:rotate(360deg)}}
.lg-card{position:relative;width:100%;max-width:420px;background:rgba(255,255,255,.97);border-radius:26px;padding:34px 30px 26px;box-shadow:0 40px 90px -30px rgba(0,0,0,.7);animation:lgIn .6s cubic-bezier(.2,.8,.2,1)}
@keyframes lgIn{from{opacity:0;transform:translateY(16px) scale(.98)}}
.lg-mark{width:54px;height:54px}
.lg-k{font:800 .72rem Montserrat,Arial,sans-serif;letter-spacing:.2em;color:var(--pu);margin-top:10px}
.lg-card h1{margin:4px 0 8px;font-size:2.3rem;color:var(--nv);letter-spacing:-.02em}
.lg-card h1 em{font-style:normal;color:var(--pu2)}
.lg-s{margin:0 0 20px;color:var(--mu);font-size:.92rem;line-height:1.55}
.lg-card label{display:block;font:700 .8rem Montserrat,Arial,sans-serif;color:var(--nv);margin-bottom:6px}
.lg-card input{width:100%;font-size:1.25rem;letter-spacing:.08em;padding:14px 16px;border-radius:14px;border:2px solid var(--ln);outline:none;transition:border-color .2s,box-shadow .2s}
.lg-card input:focus{border-color:var(--pu2);box-shadow:0 0 0 4px rgba(139,63,184,.15)}
.lg-card button{width:100%;margin-top:14px;padding:14px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--pu2),var(--pu));color:#fff;font:800 1rem Montserrat,Arial,sans-serif;cursor:pointer;transition:transform .2s,box-shadow .2s}
.lg-card button:hover{transform:translateY(-2px);box-shadow:0 14px 28px -12px var(--pu)}
.lg-err{margin-top:12px;background:#fdecea;color:#9b1c14;border-radius:12px;padding:10px 12px;font-size:.88rem}
.lg-h{font-size:.8rem;color:var(--mu);margin:14px 0 0;line-height:1.5}
.lg-back{display:inline-block;margin-top:14px;font-size:.82rem;color:var(--pu);text-decoration:none;font-weight:700}
/* ---------- APP ---------- */
.anet-app{background:radial-gradient(circle at 88% 0,rgba(212,175,55,.12),transparent 38%),linear-gradient(135deg,#0a1b3a,#1a0b33);background-attachment:fixed;min-height:100vh}
.wrap{max-width:1240px;margin:0 auto;padding:26px 20px 40px}
.wrap .container{max-width:none;padding:0}
.tab{display:none;animation:tbIn .35s ease}.tab.on{display:block}
@keyframes tbIn{from{opacity:0;transform:translateY(8px)}}
.ft{color:rgba(255,255,255,.55);font-size:.76rem;text-align:center;padding:18px}
.ph{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:18px}
.ph .k{font:800 .72rem Montserrat,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--gd)}
.ph h2{color:#fff;font-size:1.9rem;margin:6px 0 4px}
.ph p{color:rgba(255,255,255,.8);margin:0;max-width:760px;line-height:1.6}
.card{background:#fff;border-radius:20px;box-shadow:0 26px 60px -30px rgba(0,0,0,.6)}
/* avatar */
.av{--c:var(--pu);width:56px;height:56px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;font:800 1.05rem Montserrat,Arial,sans-serif;background:linear-gradient(145deg,color-mix(in srgb,var(--c) 70%,#fff),var(--c));overflow:hidden;box-shadow:0 6px 16px -8px rgba(0,0,0,.5)}
.av img{width:100%;height:100%;object-fit:cover}
.av.sm{width:34px;height:34px;font-size:.78rem}.av.xl{width:120px;height:120px;font-size:2.1rem;border:4px solid #fff}
/* inicio */
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.st{all:unset;box-sizing:border-box;cursor:pointer;background:#fff;border-radius:18px;padding:16px 18px;display:flex;flex-direction:column;gap:4px;transition:transform .2s,box-shadow .2s}
.st:hover{transform:translateY(-3px);box-shadow:0 18px 36px -16px rgba(0,0,0,.6)}
.st b{font:800 2rem Montserrat,Arial,sans-serif;color:var(--nv)}.st span{font-size:.82rem;color:var(--mu);font-weight:600}
.st i{font-style:normal;font-size:.72rem;color:var(--pu);font-weight:700}
.sec-t{color:#fff;font:800 1.05rem Montserrat,Arial,sans-serif;margin:26px 0 12px}
.meter{height:10px;border-radius:99px;background:#eee7f3;overflow:hidden}
.meter i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--ko),var(--wa) 50%,var(--ok));transition:width .8s}
/* toolbar */
.tb{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:14px;margin-bottom:14px}
.srch{flex:1 1 260px;display:flex;align-items:center;gap:8px;background:var(--pl);border-radius:12px;padding:0 12px}
.srch input{flex:1;border:0;background:transparent;padding:12px 0;font-size:.95rem;outline:none}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{all:unset;cursor:pointer;font:700 .76rem Montserrat,Arial,sans-serif;padding:8px 12px;border-radius:99px;border:1.5px solid var(--ln);color:var(--mu);background:#fff;transition:all .18s}
.chip:hover{border-color:var(--pu2);color:var(--pu)}.chip.on{background:var(--nv);border-color:var(--nv);color:#fff}
.chip em{font-style:normal;opacity:.7;margin-left:4px}
select.sel{border:1.5px solid var(--ln);border-radius:10px;padding:9px 10px;font-size:.84rem;background:#fff;color:var(--ink)}
.btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:11px;font:700 .8rem Montserrat,Arial,sans-serif;background:var(--nv);color:#fff;transition:transform .15s,background .2s;text-decoration:none}
.btn:hover{transform:translateY(-1px);background:var(--pu)}
.btn.lt{background:var(--pl);color:var(--pu)}.btn.lt:hover{background:#e6d7f1}
.btn.gd{background:var(--gd);color:#1a1033}
/* docs */
.dlay{display:grid;grid-template-columns:230px 1fr;gap:16px;align-items:start}
.dnav{padding:14px;position:sticky;top:80px}
.dnav h5{margin:12px 6px 6px;font:800 .68rem Montserrat;letter-spacing:.12em;text-transform:uppercase;color:var(--pu)}
.dnav button{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:flex;justify-content:space-between;padding:8px 10px;border-radius:9px;font-size:.84rem;color:var(--ink)}
.dnav button:hover{background:var(--pl)}.dnav button.on{background:var(--nv);color:#fff}
.dnav button em{font-style:normal;font-size:.74rem;opacity:.65}
.phva{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.phva button{all:unset;box-sizing:border-box;cursor:pointer;border-radius:14px;padding:12px;color:#fff;transition:transform .2s,box-shadow .2s;position:relative}
.phva button:hover{transform:translateY(-2px)}.phva button.on{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--gd)}
.phva b{display:block;font:800 1.5rem Montserrat}.phva span{font-size:.78rem;font-weight:700}
.phva .P{background:linear-gradient(135deg,#3c6fd1,#244a9c)}.phva .H{background:linear-gradient(135deg,#1f9d63,#137046)}.phva .V{background:linear-gradient(135deg,#e0a02c,#b07818)}.phva .A{background:linear-gradient(135deg,#d2453d,#9b2a24)}
.dlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.dc{background:#fff;border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:8px;border:1.5px solid transparent;transition:transform .2s,border-color .2s,box-shadow .2s;animation:tbIn .3s ease both}
.dc:hover{transform:translateY(-3px);border-color:#d9c6e8;box-shadow:0 16px 32px -18px rgba(0,0,0,.6)}
.dc .top{display:flex;gap:10px;align-items:flex-start}
.dc .ic{width:40px;height:48px;flex:none;border-radius:8px;background:linear-gradient(160deg,#fbe9e7,#f6d2cd);color:#b3261e;display:grid;place-items:center;font:800 .62rem Montserrat;position:relative}
.dc .ic.th{background:linear-gradient(160deg,#efe4f7,#dcc6ee);color:var(--pu)}.dc .ic.pesv{background:linear-gradient(160deg,#e3f1ff,#c8e0fb);color:#1d5fa8}
.dc h4{margin:0;font-size:.88rem;line-height:1.3;color:var(--nv)}
.dc .cd{display:inline-block;font:800 .66rem Montserrat;color:var(--pu);background:var(--pl);border-radius:6px;padding:3px 6px;margin-bottom:4px}
.dc .mt{display:flex;flex-wrap:wrap;gap:6px;font-size:.72rem;color:var(--mu)}
.dc .mt span{background:#f6f3f9;border-radius:6px;padding:3px 7px}
.dc .mt .r{background:#fdecea;color:#9b1c14}
.dc .ac{display:flex;gap:6px;margin-top:auto}
.empty{padding:40px;text-align:center;color:var(--mu)}
/* directorio */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.pc{all:unset;box-sizing:border-box;cursor:pointer;background:#fff;border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px;border:1.5px solid transparent;transition:transform .2s,border-color .2s,box-shadow .2s;animation:tbIn .3s ease both}
.pc:hover{transform:translateY(-3px);border-color:#d9c6e8;box-shadow:0 16px 32px -18px rgba(0,0,0,.6)}
.pc .r1{display:flex;gap:12px;align-items:center}
.pc h4{margin:0;font-size:.92rem;color:var(--nv);line-height:1.25}
.pc small{display:block;color:var(--mu);font-size:.78rem;margin-top:2px}
.pc .ct{font-size:.76rem;color:var(--ink);display:flex;flex-direction:column;gap:3px;word-break:break-all}
.tag{display:inline-block;font:700 .66rem Montserrat;padding:3px 8px;border-radius:99px;background:var(--pl);color:var(--pu)}
.tag.ok{background:#e3f6ec;color:var(--ok)}.tag.wa{background:#fdf1dc;color:#9a6512}.tag.ko{background:#fdecea;color:var(--ko)}.tag.gy{background:#eee;color:#666}
.pc .hb{display:flex;align-items:center;gap:8px;font-size:.72rem;color:var(--mu)}
.pc .hb .meter{flex:1;height:7px}
.stbar{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.stbar .st{cursor:default}
/* modal HV */
.md{position:fixed;inset:0;z-index:9000;background:rgba(10,8,30,.78);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:flex-start;overflow:auto;padding:30px 16px;animation:mdF .2s}
@keyframes mdF{from{opacity:0}}
.mdc{width:100%;max-width:980px;background:#fff;border-radius:24px;overflow:hidden;animation:lgIn .35s cubic-bezier(.2,.8,.2,1)}
.hvh{position:relative;padding:26px 28px;background:linear-gradient(135deg,var(--nv2),var(--nv) 55%,var(--pu));color:#fff;display:flex;gap:22px;align-items:center}
.hvh h3{margin:0;font-size:1.5rem}.hvh .sub{opacity:.9;margin-top:4px}
.hvh .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.hvh .tags .tag{background:rgba(255,255,255,.16);color:#fff}
.hvh .x{position:absolute;right:16px;top:16px;display:flex;gap:6px}
.hvh .x button,.hvh .x a{all:unset;cursor:pointer;width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.14);display:grid;place-items:center;font-weight:800}
.hvh .x button:hover{background:rgba(255,255,255,.28)}
.avw{position:relative}.avw label{position:absolute;right:0;bottom:4px;width:34px;height:34px;border-radius:50%;background:var(--gd);color:#1a1033;display:grid;place-items:center;cursor:pointer;font-weight:800;box-shadow:0 4px 10px rgba(0,0,0,.4)}
.hvb{padding:22px 26px 26px;display:grid;grid-template-columns:1fr 1.2fr;gap:18px}
.bx{background:var(--pl);border-radius:16px;padding:14px 16px}
.bx h5{margin:0 0 10px;font:800 .7rem Montserrat;letter-spacing:.1em;text-transform:uppercase;color:var(--pu);display:flex;justify-content:space-between;align-items:center}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;font-size:.86rem}
.kv dt{color:var(--mu)}.kv dd{margin:0;font-weight:600;word-break:break-word}
.chk{display:grid;grid-template-columns:1fr;gap:5px}
.chk div{display:flex;align-items:center;gap:8px;background:#fff;border-radius:9px;padding:7px 10px;font-size:.8rem}
.chk i{font-style:normal;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.72rem;font-weight:800;flex:none;color:#fff;background:#bbb}
.chk .y i{background:var(--ok)}.chk .n i{background:var(--ko)}.chk .na{opacity:.55}
.dcat{display:flex;flex-direction:column;gap:8px}
.dcat details{background:#fff;border-radius:12px;padding:0}
.dcat summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:10px 12px;font-weight:700;font-size:.84rem;color:var(--nv)}
.dcat summary::-webkit-details-marker{display:none}
.dcat summary em{font-style:normal;background:var(--pl);color:var(--pu);border-radius:99px;padding:2px 8px;font-size:.72rem}
.dcat ul{margin:0;padding:0 12px 10px;list-style:none;display:flex;flex-direction:column;gap:4px}
.dcat a{display:flex;gap:8px;align-items:center;text-decoration:none;color:var(--ink);font-size:.8rem;padding:6px 8px;border-radius:8px}
.dcat a:hover{background:var(--pl);color:var(--pu)}
.hvfull{grid-column:1/-1}
.note{font-size:.78rem;color:var(--mu);background:#fff8e6;border-radius:12px;padding:10px 12px;border-left:4px solid var(--wa)}
/* KPI */
.klay{display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:start}
.kside{padding:12px;position:sticky;top:80px;max-height:calc(100vh - 100px);overflow:auto}
.kside h5{margin:12px 6px 6px;font:800 .66rem Montserrat;letter-spacing:.12em;text-transform:uppercase;color:var(--pu)}
.kside button{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:flex;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:9px;font-size:.8rem;line-height:1.25}
.kside button:hover{background:var(--pl)}.kside button.on{background:var(--nv);color:#fff}
.kside em{font-style:normal;font-size:.7rem;opacity:.65;flex:none}
.kmain{padding:20px}
.kmain h3{margin:0 0 4px;color:var(--nv)}
.ktab{width:100%;border-collapse:separate;border-spacing:0 8px;font-size:.86rem}
.ktab th{text-align:left;font:800 .66rem Montserrat;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);padding:0 10px}
.ktab td{background:#faf8fc;padding:10px;vertical-align:middle}
.ktab td:first-child{border-radius:12px 0 0 12px;font-weight:600}.ktab td:last-child{border-radius:0 12px 12px 0}
.ktab .mt{font:800 .84rem Montserrat;color:var(--pu);white-space:nowrap}
.ktab .src{font-size:.7rem;color:var(--mu);font-weight:400;display:block;margin-top:3px}
.sem{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.82rem}
.sem i{width:12px;height:12px;border-radius:50%;background:#ccc;box-shadow:0 0 0 3px rgba(0,0,0,.05)}
.sem.ok i{background:var(--ok)}.sem.ko i{background:var(--ko)}.sem.na i{background:#bbb}
.kin{display:flex;gap:6px;align-items:center}
.kin input{width:90px;border:1.5px solid var(--ln);border-radius:9px;padding:7px 8px;font-size:.84rem}
.spark{display:block}
.kov{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--nv);color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;z-index:9999;animation:lgIn .3s}
/* extras dentro de mapa/organigrama */
.xdocs{display:flex;flex-wrap:wrap;gap:8px}
.xdocs button{all:unset;cursor:pointer;display:inline-flex;gap:6px;align-items:center;background:#fff;border:1.5px solid #d9c6e8;border-radius:10px;padding:7px 10px;font-size:.78rem;font-weight:700;color:var(--nv);transition:all .2s}
.xdocs button:hover{background:var(--nv);color:#fff;border-color:var(--nv)}
.xteam{display:flex;flex-wrap:wrap;gap:8px}
.xteam button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--ln);border-radius:99px;padding:4px 12px 4px 4px;font-size:.78rem;font-weight:600;transition:all .2s}
.xteam button:hover{border-color:var(--pu2);transform:translateY(-1px)}
.xteam .av{width:28px;height:28px;font-size:.66rem}
@media (max-width:900px){.dlay,.klay,.hvb{grid-template-columns:1fr}.dnav,.kside{position:static;max-height:none}.stbar,.kov{grid-template-columns:1fr 1fr}.phva{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.hvh{flex-direction:column;text-align:center}.hvh .tags{justify-content:center}.ph h2{font-size:1.5rem}.ktab th:nth-child(2),.ktab td:nth-child(2){display:none}}
@media print{.ft,.hvh .x,.avw label{display:none!important}.md{position:static;background:none;padding:0}.anet-app{background:#fff}.tab{display:none!important}}
