:root{--bg:#071426;--panel:#0d2036;--panel2:#112843;--line:#24374b;--text:#eef2f7;--muted:#9fb0c3;--gold:#dfbd66;--ok:#6fcf97;--bad:#ef8a7a;--warn:#e9c46a;color-scheme:dark}
@media(prefers-color-scheme:light){:root{--bg:#f4f1ea;--panel:#fff;--panel2:#faf7f0;--line:#d9d4c7;--text:#16202c;--muted:#5d6b7a;--gold:#8a6a1a;--ok:#1f7a45;--bad:#b3261e;--warn:#8a5a00;color-scheme:light}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 system-ui,-apple-system,'Segoe UI',sans-serif}
main{max-width:920px;margin:0 auto;padding:20px 16px 64px}
h1{font-size:1.4rem;line-height:1.25;margin:0 0 4px}h2{font-size:1.1rem;margin:0 0 10px}h3{font-size:1rem;margin:0 0 6px}
.sub,.muted{color:var(--muted)}.sub{margin:0 0 18px}.hint{color:var(--muted);font-size:.85rem;margin:4px 0 0}
a{color:var(--gold)}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px}
.card{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:16px;margin:0 0 16px}
.err-box{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:22px}
button,.btn{font:inherit;display:inline-block;border:1px solid var(--gold);background:transparent;color:var(--gold);border-radius:8px;padding:9px 14px;cursor:pointer;text-decoration:none;min-height:40px}
button:hover:not(:disabled),.btn:hover{background:rgba(223,189,102,.12)}
button:disabled{opacity:.5;cursor:not-allowed}
button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.primary{background:var(--gold);color:#111;font-weight:700}.primary:hover:not(:disabled){background:var(--gold);filter:brightness(1.07)}
.danger{border-color:var(--bad);color:var(--bad)}
.btns{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
label{display:block;margin:0 0 12px}label>span{display:block;font-size:.9rem;color:var(--muted);margin:0 0 4px}
input[type=text],input[type=email],input[type=file],select,textarea{width:100%;font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--text)}
select option{background:var(--panel);color:var(--text)}
.check{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px}.check input{margin-top:5px;width:18px;height:18px;flex:none}.check span{color:var(--text);font-size:.95rem}
.err-text{color:var(--bad);min-height:1.3em;margin:0 0 8px}.ok-text{color:var(--ok)}
.badge{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:1px 10px;font-size:.8rem;white-space:nowrap}
.b-ok{color:var(--ok);border-color:var(--ok)}.b-bad{color:var(--bad);border-color:var(--bad)}.b-warn{color:var(--warn);border-color:var(--warn)}.b-gold{color:var(--gold);border-color:var(--gold)}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0}.kv dt{color:var(--muted);font-size:.88rem}.kv dd{margin:0;word-break:break-word}
.mono{font-family:Consolas,ui-monospace,monospace;font-size:.8rem;word-break:break-all}
/* firmante */
.visor{width:100%;height:70vh;min-height:420px;border:1px solid var(--line);border-radius:10px;background:#fff}
.consent{max-height:260px;overflow:auto;border:1px solid var(--gold);border-radius:10px;padding:12px 14px;background:var(--panel2);font-size:.92rem;margin:0 0 12px}
.camera{display:grid;gap:10px;justify-items:center;margin:0 0 12px}
.camera video,.camera canvas{width:100%;max-width:420px;aspect-ratio:4/3;background:#000;border-radius:12px;border:2px solid var(--gold);object-fit:cover}
.camera video.mirror{transform:scaleX(-1)}
.camera .btns{justify-content:center}
.steps{display:flex;gap:6px;margin:0 0 16px;padding:0;list-style:none;flex-wrap:wrap}.steps li{font-size:.82rem;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 10px}.steps li.on{color:var(--gold);border-color:var(--gold)}.steps li.done{color:var(--ok);border-color:var(--ok)}
.hidden{display:none!important}
.paginas{display:grid;gap:12px;max-height:80vh;overflow:auto;-webkit-overflow-scrolling:touch;padding:4px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.pagina{width:100%;height:auto;display:block;background:#fff;border-radius:4px;box-shadow:0 0 0 1px var(--line)}
/* panel del abogado */
.lista{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.doc-row{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap;border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:12px 14px}
.doc-row button.link{border:0;padding:0;min-height:0;text-align:left;font-weight:600;color:var(--text);background:none}
.doc-row button.link:hover{color:var(--gold);background:none}
.signer{display:grid;grid-template-columns:96px 1fr;gap:14px;border:1px solid var(--line);border-radius:12px;padding:12px;margin:0 0 10px;background:var(--panel2)}
.signer img,.signer .noimg{width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid var(--line);background:#000}
.signer .noimg{display:grid;place-items:center;color:var(--muted);font-size:.75rem;text-align:center;background:var(--panel)}
.fila-firmante{display:grid;grid-template-columns:1.4fr 1fr 1.2fr auto;gap:8px;align-items:end;margin:0 0 8px}
.fila-firmante label{margin:0}
.timeline{margin:0;padding:0;list-style:none;font-size:.88rem}.timeline li{border-left:2px solid var(--line);padding:2px 0 8px 12px;margin-left:4px}.timeline time{color:var(--muted);display:block;font-size:.78rem}
table.pruebas{width:100%;border-collapse:collapse;font-size:.9rem}table.pruebas td{border-bottom:1px solid var(--line);padding:5px 6px;vertical-align:top}
.copy-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 8px}.copy-row input{flex:1;min-width:200px}
.aviso{border:1px solid var(--warn);color:var(--warn);border-radius:10px;padding:10px 12px;margin:0 0 14px;font-size:.92rem}
@media(max-width:640px){.fila-firmante{grid-template-columns:1fr}.signer{grid-template-columns:1fr}.kv{grid-template-columns:1fr}.kv dt{margin-top:6px}}
@media(prefers-reduced-motion:no-preference){button,.btn{transition:background .15s,filter .15s}}
@media print{body{background:#fff;color:#000}.noprint{display:none!important}}