:root{--fondo:#f6f5f2;--panel:#fff;--texto:#1d1d1f;--suave:#6b6b70;--borde:#e3e1dc;--acento:#2f6fb3;
--chip:#eceae5;--aviso:#fdecc8;--aviso-t:#7a5200;--ok:#dcefdc;--ok-t:#255d2a;--repe:#fff6e0}
@media (prefers-color-scheme:dark){:root:not([data-tema=claro]){--fondo:#151517;--panel:#1f1f22;--texto:#ececee;--suave:#9a9aa1;
--borde:#2f2f33;--acento:#7fb0ea;--chip:#2c2c30;--aviso:#4a3a12;--aviso-t:#f5d48a;--ok:#1f3a22;--ok-t:#a6d9ab;--repe:#2e2716;color-scheme:dark}}
:root[data-tema=oscuro]{--fondo:#151517;--panel:#1f1f22;--texto:#ececee;--suave:#9a9aa1;
--borde:#2f2f33;--acento:#7fb0ea;--chip:#2c2c30;--aviso:#4a3a12;--aviso-t:#f5d48a;--ok:#1f3a22;--ok-t:#a6d9ab;--repe:#2e2716;color-scheme:dark}
:root[data-tema=claro]{color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--texto);font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--acento);text-decoration:none}
main{max-width:900px;margin:0 auto;padding:16px}
.barra{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:10px 16px;background:var(--panel);border-bottom:1px solid var(--borde);position:sticky;top:0;z-index:1}
.marca{font-weight:700;color:var(--texto)}

.salir{margin:0}.salir button{background:none;border:0;color:var(--suave);font:inherit;cursor:pointer;padding:0}
h1{font-size:24px;margin:8px 0 12px}h2{font-size:18px;margin:24px 0 8px}
.n{font-size:13px;font-weight:400;color:var(--suave);background:var(--chip);border-radius:10px;padding:1px 8px;vertical-align:middle}
.anio{color:var(--suave);font-weight:400}
.filtros input[type=search]{width:100%;font-size:18px;padding:12px 14px;border:1px solid var(--borde);border-radius:10px;background:var(--panel);color:var(--texto)}
.fila{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
select,button,.login input{font:inherit;padding:8px 10px;border:1px solid var(--borde);border-radius:8px;background:var(--panel);color:var(--texto)}
select{flex:1 1 140px;min-width:0}
button{background:var(--acento);color:#fff;border-color:var(--acento);cursor:pointer}
.lista{list-style:none;margin:0;padding:0;background:var(--panel);border:1px solid var(--borde);border-radius:10px;overflow:hidden}
.lista li+li{border-top:1px solid var(--borde)}
.lista a{display:flex;flex-direction:column;gap:2px;padding:10px 14px;color:var(--texto)}
.lista a:hover{background:var(--chip)}
.tit{font-weight:600}.det{font-size:14px;color:var(--suave)}
.discos{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.chip{display:inline-block;font-size:12.5px;background:var(--chip);color:var(--texto);border-radius:6px;padding:1px 7px;margin:0 4px 0 0}
.chip.aviso{background:var(--aviso);color:var(--aviso-t)}.chip.ok{background:var(--ok);color:var(--ok-t)}
.vacio,.peq{color:var(--suave);font-size:14px}
.ficha .sub{color:var(--suave);margin:-6px 0 12px}
.sinopsis{background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:12px 14px}
dl{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:12px 0}
dt{color:var(--suave)}dd{margin:0;min-width:0}
.ruta{font-family:ui-monospace,monospace;font-size:13px;word-break:break-all}
.nota{background:var(--aviso);color:var(--aviso-t);border-radius:8px;padding:8px 12px}
details{background:var(--panel);border:1px solid var(--borde);border-radius:10px;margin:8px 0}
summary{padding:10px 14px;cursor:pointer;font-weight:600}
.eps{width:100%;border-collapse:collapse;font-size:14px}
.eps td{padding:5px 8px;border-top:1px solid var(--borde);vertical-align:top}
.eps .num{width:2.5em;text-align:right;color:var(--suave)}
.eps .peq{white-space:nowrap}
.eps tr.repe{background:var(--repe)}
.eps tr.falta td{color:var(--aviso-t);background:var(--aviso)}
.hist{font-size:14px;padding-left:18px}
.admin{padding-bottom:8px}.admin form{padding:0 14px}
.login{max-width:340px;margin:12vh auto 0;display:flex;flex-direction:column;gap:12px;background:var(--panel);border:1px solid var(--borde);border-radius:12px;padding:24px}
.login h1{margin:0 0 4px}.login label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--suave)}
.error{color:#c0392b;margin:0}
@media (max-width:560px){.eps .peq:last-child{display:none}h1{font-size:21px}}
.con-poster{flex-direction:row!important;align-items:flex-start;gap:12px!important}
.con-poster .txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.mini{flex:0 0 46px;width:46px;height:69px;border-radius:4px;object-fit:cover;background:var(--chip)}
.poster{float:right;width:min(180px,38%);border-radius:8px;margin:4px 0 12px 16px}
.ficha::after{content:"";display:block;clear:both}
.caja{display:flex;flex-direction:column;gap:10px;background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:14px;margin:16px 0;max-width:460px}
.caja h2{margin:0}.caja label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--suave)}
.caja label.check{flex-direction:row;align-items:center;gap:8px}
input:not([type=checkbox]):not([type=hidden]){font:inherit;padding:8px 10px;border:1px solid var(--borde);border-radius:8px;background:var(--panel);color:var(--texto);min-width:0}
.ancho{width:100%;margin-bottom:6px}
.usuario summary{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.acciones{padding:0 14px 12px}
.en-linea{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.en-linea input{flex:1 1 140px}
.botones{display:flex;flex-wrap:wrap;gap:6px}.botones form{margin:0}
button.sec{background:var(--panel);color:var(--texto);border-color:var(--borde)}
button.peligro{background:#c0392b;border-color:#c0392b}
.ok-msg{background:var(--ok);color:var(--ok-t);border-radius:8px;padding:8px 12px}
.pie{max-width:900px;margin:24px auto;padding:0 16px 24px;font-size:12px;color:var(--suave)}
.tema{margin:0}.tema button{background:none;border:0;color:var(--suave);font:inherit;cursor:pointer;padding:0 2px;font-size:17px;line-height:1}
.temas{display:flex;flex-wrap:wrap;gap:6px}.temas button.activo{outline:2px solid var(--acento);outline-offset:1px}
/* portada */
.portada{padding:8px 0 4px}.portada .filtros input[type=search]{font-size:20px;padding:14px 16px}
.filtros{display:flex;flex-direction:column;gap:8px}.filtros>button{align-self:flex-start}
.mas summary{font-size:14px;color:var(--suave);padding:2px 0;font-weight:400}.mas{background:none;border:0;margin:0}
.cifras{color:var(--suave);font-size:14px;margin:10px 0 0}
.carrusel{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(120px,140px);gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity}
.carrusel .tarjeta{scroll-snap-align:start}
.accesos{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-top:24px}
.acceso{display:flex;flex-direction:column;gap:2px;background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:12px 14px;color:var(--texto)}
.acceso span{font-size:13px;color:var(--suave)}.acceso:hover{border-color:var(--acento)}
/* tarjetas y rejilla */
.rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:16px 12px}
.tarjeta{position:relative;display:flex;flex-direction:column;gap:3px;color:var(--texto);min-width:0}
.tarjeta img,.sin-poster{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:6px;background:var(--chip)}
.sin-poster{display:flex;align-items:center;justify-content:center;font-size:40px;color:var(--suave)}
.tarjeta .t{font-size:14px;font-weight:600;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tarjeta .d{font-size:12px;color:var(--suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tarjeta:hover img{outline:2px solid var(--acento)}
.marca-aviso{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;background:var(--aviso);color:var(--aviso-t);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center}
.marca-aviso.en-texto{position:static;display:inline-flex;width:18px;height:18px;font-size:12px}
.pestanas{display:flex;gap:6px;margin:4px 0 10px}.pestanas a{padding:6px 14px;border-radius:20px;background:var(--chip);color:var(--texto)}
.pestanas a.activa{background:var(--acento);color:#fff}
.letras{display:flex;flex-wrap:wrap;gap:2px;margin-bottom:6px}
.letras a,.letras span{min-width:28px;text-align:center;padding:4px 6px;border-radius:6px;font-size:14px}
.letras span{color:var(--borde)}.letras a.activa{background:var(--acento);color:#fff}
.paginas{display:flex;justify-content:center;gap:16px;margin:20px 0;font-size:14px}
/* estadísticas */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.tile{background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column}
.tile b{font-size:24px;font-weight:650}.tile span{font-size:13px;color:var(--suave)}
.barras{display:flex;flex-direction:column;gap:4px;background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:10px 14px}
.barra-fila{display:grid;grid-template-columns:minmax(80px,9em) 1fr auto;align-items:center;gap:10px;color:var(--texto);font-size:13px;padding:2px 0}
.barra-fila .et{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barra-fila .num{color:var(--suave);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.pista{position:relative;height:12px}
.pista .val,.pista .cap{position:absolute;left:0;top:0;bottom:0;border-radius:0 4px 4px 0}
.pista .cap{background:var(--chip)}.pista .val{background:var(--acento)}
a.barra-fila:hover .val{filter:brightness(1.15)}
.columnas{display:flex;align-items:flex-end;gap:6px;height:180px;background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:10px 12px}
.col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.col .c{width:100%;max-width:38px;background:var(--acento);border-radius:4px 4px 0 0;min-height:2px}
.col .n{font-size:11px;color:var(--suave);white-space:nowrap;margin-bottom:3px}
.col .x{font-size:11px;color:var(--suave);margin-top:4px;border-top:1px solid var(--borde);width:100%;text-align:center;padding-top:3px}
.columnas.anchas .n{font-size:10px}
.dos{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0 20px}
.top{background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:10px 14px 10px 36px;margin:0}
.top li{padding:3px 0}.top .peq{float:right}
.w0{width:0%}.w1{width:1%}.w2{width:2%}.w3{width:3%}.w4{width:4%}.w5{width:5%}.w6{width:6%}.w7{width:7%}.w8{width:8%}.w9{width:9%}.w10{width:10%}.w11{width:11%}.w12{width:12%}.w13{width:13%}.w14{width:14%}.w15{width:15%}.w16{width:16%}.w17{width:17%}.w18{width:18%}.w19{width:19%}.w20{width:20%}.w21{width:21%}.w22{width:22%}.w23{width:23%}.w24{width:24%}.w25{width:25%}.w26{width:26%}.w27{width:27%}.w28{width:28%}.w29{width:29%}.w30{width:30%}.w31{width:31%}.w32{width:32%}.w33{width:33%}.w34{width:34%}.w35{width:35%}.w36{width:36%}.w37{width:37%}.w38{width:38%}.w39{width:39%}.w40{width:40%}.w41{width:41%}.w42{width:42%}.w43{width:43%}.w44{width:44%}.w45{width:45%}.w46{width:46%}.w47{width:47%}.w48{width:48%}.w49{width:49%}.w50{width:50%}.w51{width:51%}.w52{width:52%}.w53{width:53%}.w54{width:54%}.w55{width:55%}.w56{width:56%}.w57{width:57%}.w58{width:58%}.w59{width:59%}.w60{width:60%}.w61{width:61%}.w62{width:62%}.w63{width:63%}.w64{width:64%}.w65{width:65%}.w66{width:66%}.w67{width:67%}.w68{width:68%}.w69{width:69%}.w70{width:70%}.w71{width:71%}.w72{width:72%}.w73{width:73%}.w74{width:74%}.w75{width:75%}.w76{width:76%}.w77{width:77%}.w78{width:78%}.w79{width:79%}.w80{width:80%}.w81{width:81%}.w82{width:82%}.w83{width:83%}.w84{width:84%}.w85{width:85%}.w86{width:86%}.w87{width:87%}.w88{width:88%}.w89{width:89%}.w90{width:90%}.w91{width:91%}.w92{width:92%}.w93{width:93%}.w94{width:94%}.w95{width:95%}.w96{width:96%}.w97{width:97%}.w98{width:98%}.w99{width:99%}.w100{width:100%}
.h0{height:0%}.h1{height:1%}.h2{height:2%}.h3{height:3%}.h4{height:4%}.h5{height:5%}.h6{height:6%}.h7{height:7%}.h8{height:8%}.h9{height:9%}.h10{height:10%}.h11{height:11%}.h12{height:12%}.h13{height:13%}.h14{height:14%}.h15{height:15%}.h16{height:16%}.h17{height:17%}.h18{height:18%}.h19{height:19%}.h20{height:20%}.h21{height:21%}.h22{height:22%}.h23{height:23%}.h24{height:24%}.h25{height:25%}.h26{height:26%}.h27{height:27%}.h28{height:28%}.h29{height:29%}.h30{height:30%}.h31{height:31%}.h32{height:32%}.h33{height:33%}.h34{height:34%}.h35{height:35%}.h36{height:36%}.h37{height:37%}.h38{height:38%}.h39{height:39%}.h40{height:40%}.h41{height:41%}.h42{height:42%}.h43{height:43%}.h44{height:44%}.h45{height:45%}.h46{height:46%}.h47{height:47%}.h48{height:48%}.h49{height:49%}.h50{height:50%}.h51{height:51%}.h52{height:52%}.h53{height:53%}.h54{height:54%}.h55{height:55%}.h56{height:56%}.h57{height:57%}.h58{height:58%}.h59{height:59%}.h60{height:60%}.h61{height:61%}.h62{height:62%}.h63{height:63%}.h64{height:64%}.h65{height:65%}.h66{height:66%}.h67{height:67%}.h68{height:68%}.h69{height:69%}.h70{height:70%}.h71{height:71%}.h72{height:72%}.h73{height:73%}.h74{height:74%}.h75{height:75%}.h76{height:76%}.h77{height:77%}.h78{height:78%}.h79{height:79%}.h80{height:80%}.h81{height:81%}.h82{height:82%}.h83{height:83%}.h84{height:84%}.h85{height:85%}.h86{height:86%}.h87{height:87%}.h88{height:88%}.h89{height:89%}.h90{height:90%}.h91{height:91%}.h92{height:92%}.h93{height:93%}.h94{height:94%}.h95{height:95%}.h96{height:96%}.h97{height:97%}.h98{height:98%}.h99{height:99%}.h100{height:100%}
.led{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--suave)}
.led .punto{width:10px;height:10px;border-radius:50%;background:#c0392b;box-shadow:0 0 0 2px var(--panel),0 0 6px #c0392b88}
.led.encendido .punto{background:#2e9e44;box-shadow:0 0 0 2px var(--panel),0 0 6px #2e9e4488}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.estado-equipo{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.caja.ancha{max-width:none}.caja h3{margin:0}
.fila-pend{display:flex;flex-direction:column;gap:2px;padding:10px 14px}
.pista.grande{height:16px;background:var(--chip);border-radius:8px;overflow:hidden}.pista.grande .val{border-radius:8px}
/* barra superior agrupada */
.barra{gap:6px 14px}
.principal{display:flex;align-items:center;gap:2px 14px;font-size:15px}
.derecha{display:flex;align-items:center;gap:10px;margin-left:auto}
details.menu{position:relative;background:none;border:0;margin:0}
details.menu>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:8px;font-weight:400;color:var(--acento)}
details.menu>summary::-webkit-details-marker{display:none}
details.menu>summary::after{content:"▾";font-size:11px;color:var(--suave)}
details.menu[open]>summary,details.menu>summary:hover{background:var(--chip)}
.desplegable{position:absolute;top:calc(100% + 6px);left:0;z-index:10;min-width:180px;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:6px;box-shadow:0 8px 24px #0003}
.desplegable.der{left:auto;right:0}
.desplegable.ancho{width:min(340px,calc(100vw - 32px));gap:6px;padding:12px}
.desplegable>a,.desplegable .item{padding:8px 10px;border-radius:6px;color:var(--texto);text-align:left;background:none;border:0;font:inherit;cursor:pointer;width:100%}
.desplegable>a:hover,.desplegable .item:hover{background:var(--chip)}
.desplegable form{margin:0}
.estado>summary{color:var(--texto);font-size:13px}
.estado .nom{color:var(--suave)}
.chip.copia{background:var(--acento);color:#fff}
.chip.usb{font-variant-numeric:tabular-nums}
.avatar{width:26px;height:26px;border-radius:50%;background:var(--acento);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.usuario>summary{color:var(--texto)}
.desplegable h4{margin:6px 0 0;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--suave)}
.desplegable .cab{display:flex;align-items:center;gap:8px;margin:0}
.desplegable .bloque{display:flex;flex-direction:column;gap:4px}
.disco-fila{display:grid;grid-template-columns:minmax(0,1fr) 70px auto;align-items:center;gap:8px;font-size:13px}
.disco-fila>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pista .val.lleno{background:#c0392b}
.desplegable .ir{margin-top:4px;font-weight:600}
@media (max-width:700px){.chip.usb{display:none}.nombre-u{display:none}.estado .nom{display:none}}
@media (max-width:420px){.principal{gap:2px 8px;font-size:14px}}
.chip.usb.quitar{background:var(--ok);color:var(--ok-t)}
.ok-txt,.msg-ok{color:var(--ok-t)}.msg-aviso{color:var(--aviso-t)}
.en-fila{margin:0 0 4px;display:flex;justify-content:flex-end}
button.mini-b{padding:3px 10px;font-size:12px}
.botones{margin-top:6px}
.centro{text-align:center}.trampa{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.solicitud{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid var(--borde)}
.pendientes{border-color:var(--acento)}
.qr{display:block;width:220px;height:220px;margin:10px 0;background:#fff;border-radius:8px;padding:6px}
.clave{font-size:15px;letter-spacing:.05em;word-break:break-all}
.pasos{padding-left:20px}.pasos li{margin-bottom:12px}
input.codigo{font-size:22px;letter-spacing:.3em;text-align:center;font-variant-numeric:tabular-nums}
.codigos{display:grid;grid-template-columns:repeat(2,max-content);gap:8px 28px;list-style:none;padding:14px 18px;background:var(--panel);border:1px solid var(--borde);border-radius:10px;font-size:18px}
a.boton{display:inline-block;background:var(--acento);color:#fff;padding:8px 14px;border-radius:8px}
.chip.plex{background:#e5a00d33;color:var(--texto)}
.marca-plex{position:absolute;top:6px;left:6px;width:22px;height:22px;border-radius:50%;background:#e5a00d;color:#1d1d1f;font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center}
.marca-plex.en-texto{position:static;display:inline-flex;width:18px;height:18px;font-size:11px}
details.lib{margin:8px 0}details.lib summary{font-weight:600}
.num-d{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.acceso-linea{display:block;background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:10px 14px}
.tarjeta .donde{color:var(--acento)}
.donde-nav a{font-size:13px}
td.chk{width:2.2em;text-align:center}
