:root{--bg:#f6f7f9;--fg:#1c2330;--mut:#667085;--bor:#d5dae1;--card:#fff;--ac:#1a56a0;--ac-t:#fff;--mal:#b42318;--ok:#067647;--ret:#fff1f0}
@media (prefers-color-scheme:dark){:root{--bg:#12161c;--fg:#e6e9ef;--mut:#98a2b3;--bor:#2b323d;--card:#1a2029;--ac:#5b9bf0;--ac-t:#0b1220;--mal:#ff8a80;--ok:#53d39a;--ret:#2a1a1a}}
*{box-sizing:border-box}
[hidden]{display:none !important}
body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif}
.barra{display:flex;gap:.6rem;align-items:center;padding:.6rem 1rem;background:var(--card);border-bottom:1px solid var(--bor);position:sticky;top:0;z-index:5}
.sub{color:var(--mut)} .espacio{flex:1}
.etiqueta{border:1px solid var(--bor);border-radius:99px;padding:.05rem .6rem;font-size:12px}
.etiqueta.ret{background:var(--ret);color:var(--mal);border-color:var(--mal)}
button,select,input,textarea{font:inherit;color:inherit;background:var(--card);border:1px solid var(--bor);border-radius:6px;padding:.4rem .6rem}
button{cursor:pointer} button:hover{border-color:var(--ac)}
button.primario{background:var(--ac);color:var(--ac-t);border-color:var(--ac)} button.peligro{border-color:var(--mal);color:var(--mal)}
button.enlace{border:none;background:none;color:var(--ac);padding:.2rem}
button:disabled{opacity:.5;cursor:not-allowed}
.centrado{display:grid;place-items:center;min-height:70vh;padding:1rem} .tarjeta{background:var(--card);border:1px solid var(--bor);border-radius:10px;padding:1.4rem;width:min(360px,100%);display:grid;gap:.8rem}
.tarjeta label,.detalle label{display:grid;gap:.25rem;color:var(--mut)}
.detalle label.casilla,.filtros label.casilla{display:flex}
.app{display:grid;grid-template-columns:320px 1fr;gap:1rem;padding:1rem;align-items:start}
.filtros{background:var(--card);border:1px solid var(--bor);border-radius:10px;padding:1rem;display:grid;gap:.6rem;position:sticky;top:3.6rem}
.filtros h2,.detalle h2,dialog h2{margin:0;font-size:16px}
.nuevo-filtro{display:grid;gap:.4rem} .acciones{display:flex;gap:.5rem;flex-wrap:wrap} .nota{color:var(--mut);font-size:12px;margin:0}
.chips{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.3rem}
.chips li{background:var(--bg);border:1px solid var(--bor);border-radius:99px;padding:.15rem .3rem .15rem .7rem;display:flex;gap:.3rem;align-items:center;font-size:12px}
.chips li button{border:none;background:none;padding:0 .3rem;color:var(--mal)}
.casilla{display:flex;gap:.4rem;align-items:center}
.resultados{min-width:0} .encabezado-res{display:flex;gap:.5rem;align-items:center;margin-bottom:.5rem}
.tabla-caja{overflow:auto;border:1px solid var(--bor);border-radius:10px;background:var(--card);max-height:calc(100vh - 9rem)}
table{border-collapse:collapse;width:100%} th,td{padding:.4rem .6rem;border-bottom:1px solid var(--bor);text-align:left;white-space:nowrap;max-width:280px;overflow:hidden;text-overflow:ellipsis}
th{position:sticky;top:0;background:var(--card);z-index:1} tbody tr{cursor:pointer} tbody tr:hover{background:var(--bg)} tr.retirada td{background:var(--ret);text-decoration:line-through;color:var(--mut)}
tr.retirada td:first-child,tr.retirada td:nth-child(2){text-decoration:none}
dialog{border:1px solid var(--bor);border-radius:10px;background:var(--card);color:var(--fg);width:min(560px,94vw)} dialog::backdrop{background:#0008}
.lista-col{max-height:50vh;overflow:auto;margin:.6rem 0;display:grid;gap:.1rem} .lista-col h3{margin:.6rem 0 .2rem;font-size:12px;color:var(--mut);text-transform:uppercase}
.detalle{position:fixed;right:0;top:0;bottom:0;width:min(640px,100vw);background:var(--card);border-left:1px solid var(--bor);padding:1rem;overflow:auto;z-index:10;box-shadow:-8px 0 24px #0003}
.det-cab{display:flex;gap:.6rem;align-items:center} .pestanas{display:flex;gap:.3rem;margin:.8rem 0} .pestanas button.activa{background:var(--ac);color:var(--ac-t);border-color:var(--ac)}
details{border:1px solid var(--bor);border-radius:8px;margin:.4rem 0} summary{cursor:pointer;padding:.45rem .7rem;font-weight:600} details>div{padding:.2rem .7rem .7rem;display:grid;gap:.5rem}
.campo{display:grid;grid-template-columns:200px 1fr;gap:.6rem;align-items:start} .campo .n{color:var(--mut);word-break:break-all;font-size:12px} .campo .v{white-space:pre-wrap;word-break:break-word}
.campo input,.campo textarea{width:100%} .campo.cambiado input,.campo.cambiado textarea{border-color:var(--ac);outline:1px solid var(--ac)}
.panel-accion{border:1px solid var(--bor);border-radius:8px;padding:.8rem;margin:.6rem 0;display:grid;gap:.5rem;background:var(--bg)}
.version{border:1px solid var(--bor);border-radius:8px;padding:.6rem .8rem;margin:.5rem 0} .version .meta{color:var(--mut);font-size:12px}
.version table{margin-top:.4rem;font-size:12px} .version td.a{color:var(--mal)} .version td.d{color:var(--ok)}
#avisos{position:fixed;top:3.4rem;right:1rem;z-index:20;display:grid;gap:.4rem;width:min(420px,92vw)}
.aviso{padding:.6rem .8rem;border-radius:8px;border:1px solid var(--bor);background:var(--card);box-shadow:0 4px 14px #0003} .aviso.mal{border-color:var(--mal);color:var(--mal)} .aviso.ok{border-color:var(--ok);color:var(--ok)}
@media (max-width:860px){.app{grid-template-columns:1fr}.filtros{position:static}.campo{grid-template-columns:1fr}}