:root{--fondo:#f4f6f8;--tarjeta:#fff;--texto:#1b2430;--suave:#5b6776;--marca:#0b5fff;--ok:#0a8a4a;--mal:#c62828;--borde:#d8dee6}
@media (prefers-color-scheme:dark){:root{--fondo:#12161c;--tarjeta:#1b222b;--texto:#e8edf3;--suave:#9aa6b4;--marca:#6ea1ff;--ok:#43c787;--mal:#ff7b7b;--borde:#2c3643}}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--texto);font:16px system-ui,sans-serif}
header{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 16px;background:var(--tarjeta);border-bottom:1px solid var(--borde);position:sticky;top:0;z-index:5}
nav{display:flex;gap:6px;flex:1;flex-wrap:wrap}
nav button{border:1px solid var(--borde);background:none;color:var(--texto);padding:8px 12px;border-radius:8px;font-size:15px}
nav button.on{background:var(--marca);color:#fff;border-color:var(--marca)}
#quien{color:var(--suave);font-size:13px}
main{padding:16px;max-width:900px;margin:auto}
.tarjeta{background:var(--tarjeta);border:1px solid var(--borde);border-radius:12px;padding:14px;margin-bottom:14px}
h2{margin:0 0 10px;font-size:18px}
label{display:block;margin:10px 0 4px;color:var(--suave);font-size:14px}
input,select,button.b{font-size:16px;padding:10px;border-radius:8px;border:1px solid var(--borde);background:var(--fondo);color:var(--texto);width:100%}
button.b{background:var(--marca);color:#fff;border:0;font-weight:600;margin-top:10px;cursor:pointer}
button.b.sec{background:none;color:var(--texto);border:1px solid var(--borde)}
button.b.mal{background:var(--mal)}
button.b:disabled{opacity:.5}
.fila{display:flex;gap:10px;flex-wrap:wrap}.fila>*{flex:1;min-width:140px}
video{width:100%;max-height:46vh;background:#000;border-radius:10px;object-fit:cover}
.visto{display:flex;gap:12px;align-items:center}
.visto img{width:96px;height:96px;object-fit:cover;border-radius:10px;border:1px solid var(--borde)}
.grande{font-size:22px;font-weight:700}
.suave{color:var(--suave);font-size:14px}
.ok{color:var(--ok)}.mal{color:var(--mal)}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:7px 6px;border-bottom:1px solid var(--borde);text-align:left}
th.num,td.num{text-align:right}
.aviso{padding:10px;border-radius:8px;background:var(--fondo);border:1px solid var(--borde);margin:8px 0}
.etq{display:none}
@media print{body>*:not(.etq){display:none!important}.etq{display:block;text-align:center;font-family:sans-serif}.etq svg{width:80mm}}
.cam{position:relative}
.cam .sobre{position:absolute;left:8px;right:8px;bottom:8px;background:rgba(0,0,0,.72);color:#fff;border-radius:10px;padding:8px 12px;display:none;font-size:18px;font-weight:700;line-height:1.25}
.cam .sobre small{display:block;font-weight:400;font-size:14px;opacity:.9}