:root{--fondo:#f5f6f8;--tarjeta:#fff;--texto:#1d2530;--aux:#566272;--borde:#d3d9e0;--prim:#1f5fbf;--primt:#fff;--ok:#1a7a3c;--err:#b3261e;--suave:#eef3fb}
@media (prefers-color-scheme:dark){:root{--fondo:#12161c;--tarjeta:#1b212a;--texto:#e6eaf0;--aux:#a3afbf;--borde:#38424f;--prim:#6aa3ff;--primt:#0b1320;--ok:#5fd28a;--err:#ff8a80;--suave:#212b3a}}
*{box-sizing:border-box}body{margin:0;background:var(--fondo);color:var(--texto);font:16px/1.5 system-ui,Segoe UI,sans-serif}
main{max-width:860px;margin:0 auto;padding:16px}header.top{background:var(--tarjeta);border-bottom:1px solid var(--borde);padding:12px 16px}
header.top div{max-width:860px;margin:0 auto}h1{font-size:1.3rem;margin:.2rem 0}h2{font-size:1.1rem;margin:1.4rem 0 .3rem}.aux{color:var(--aux);font-size:.9rem}
.tarjeta{background:var(--tarjeta);border:1px solid var(--borde);border-radius:8px;padding:14px 16px;margin:12px 0}
.prop{background:var(--suave);border-left:3px solid var(--prim);padding:8px 10px;margin:8px 0;font-size:.92rem;border-radius:4px}
.q-id{font-size:.8rem;color:var(--aux)}.q-enun{margin:.2rem 0 .5rem;font-weight:600}
input[type=text],input[type=email],input[type=password],textarea,select{width:100%;padding:8px 10px;border:1px solid var(--borde);border-radius:6px;background:var(--tarjeta);color:var(--texto);font:inherit}
input:focus,textarea:focus,select:focus,button:focus-visible{outline:2px solid var(--prim);outline-offset:1px}
label.op{display:block;padding:4px 0}label.op input{margin-right:6px}input.otro{margin:2px 0 6px 24px;width:calc(100% - 24px)}
label.campo{display:block;margin:6px 0}label.campo span{display:block;font-size:.88rem;color:var(--aux)}
.scroll{overflow-x:auto}table.tabla{border-collapse:collapse;width:100%;font-size:.92rem}.tabla th,.tabla td{border:1px solid var(--borde);padding:5px 7px;text-align:left;vertical-align:top}
.tabla th small{display:block;font-weight:400;color:var(--aux)}.tabla td{min-width:140px}
button{font:inherit;padding:8px 14px;border-radius:6px;border:1px solid var(--borde);background:var(--tarjeta);color:var(--texto);cursor:pointer}
button.prim{background:var(--prim);color:var(--primt);border-color:var(--prim)}button.peligro{color:var(--err);border-color:var(--err)}button:disabled{opacity:.5;cursor:default}
.fila{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.fila>*{flex:0 0 auto}.fila .crece{flex:1 1 200px}
.estado{position:fixed;right:12px;bottom:12px;background:var(--tarjeta);border:1px solid var(--borde);border-radius:6px;padding:6px 12px;font-size:.88rem}
.err{color:var(--err)}.ok{color:var(--ok)}nav.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}nav.tabs button[aria-current=true]{background:var(--prim);color:var(--primt);border-color:var(--prim)}
.barra{height:8px;background:var(--borde);border-radius:4px;overflow:hidden}.barra i{display:block;height:100%;background:var(--ok)}
table.lista{border-collapse:collapse;width:100%}.lista th,.lista td{border-bottom:1px solid var(--borde);padding:6px;text-align:left;vertical-align:top}
.etiqueta{display:inline-block;font-size:.78rem;border:1px solid var(--borde);border-radius:10px;padding:0 8px;margin:1px 2px}
@media (max-width:600px){main{padding:10px}}