:root{--sfondo:#f6f7f9;--carta:#fff;--testo:#1d2330;--grigio:#5f6b7a;--linea:#e2e6ec;--primario:#1f5fbf;--primario-scuro:#174a96;--ok:#1d8a4b;--avv:#b4660a;--err:#b42318;--mark:#fff1a8}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;background:var(--sfondo);color:var(--testo);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.45}
a{color:var(--primario)}
main{max-width:1100px;margin:0 auto;padding:16px}
main.largo{max-width:1400px}
.testata{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 16px;background:var(--carta);border-bottom:1px solid var(--linea)}
.marchio{font-weight:700;text-decoration:none;color:var(--testo)}
.nav{display:flex;gap:4px;flex-wrap:wrap}
.nav a{text-decoration:none;color:var(--grigio);padding:6px 10px;border-radius:6px}
.nav a.attiva,.nav a:hover{background:var(--sfondo);color:var(--testo)}
.esci{margin-left:auto;display:flex;gap:8px;align-items:center}
.utente{color:var(--grigio);font-size:.9rem}
button,.bottone{background:var(--primario);color:#fff;border:0;border-radius:6px;padding:8px 14px;font:inherit;cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.bottone:hover{background:var(--primario-scuro)}
button.secondario,.bottone.secondario{background:#fff;color:var(--testo);border:1px solid var(--linea)}
button.pericolo{background:var(--err)}
button.link{background:none;color:var(--primario);padding:0;text-decoration:underline}
.carta{background:var(--carta);border:1px solid var(--linea);border-radius:10px;padding:16px;margin:12px 0}
.griglia{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.cifra{font-size:1.8rem;font-weight:700}
.sotto{color:var(--grigio);font-size:.85rem}
.nowrap{white-space:nowrap}
.scorri{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.95rem}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--linea);vertical-align:top}
th{color:var(--grigio);font-weight:600;font-size:.85rem}
.pill{display:inline-block;font-size:.75rem;padding:2px 8px;border-radius:999px;border:1px solid var(--linea);background:#fff;white-space:nowrap}
.pill.ok{border-color:#bfe3cc;background:#ecf8f0;color:var(--ok)}
.pill.manca{color:var(--grigio);background:#f1f3f6}
.pill.avv{border-color:#f0cf9c;background:#fff6e8;color:var(--avv)}
.avviso{padding:10px 14px;border-radius:8px;margin:0 0 12px;background:#eaf1fd;border:1px solid #c9dbf7}
.avviso.ok{background:#ecf8f0;border-color:#bfe3cc}
.avviso.errore{background:#fdecea;border-color:#f3b7b2}
.avviso.avv{background:#fff6e8;border-color:#f0cf9c}
.campo{display:block;margin:10px 0}
.campo span{display:block;font-size:.85rem;color:var(--grigio);margin-bottom:4px}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=search],select,textarea{width:100%;padding:8px 10px;border:1px solid var(--linea);border-radius:6px;font:inherit;background:#fff}
textarea{min-height:200px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9rem}
.filtri{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;align-items:end}
.filtri .campo{margin:0}
.vuoto{color:var(--grigio);padding:12px}
.pagine{display:flex;gap:12px;justify-content:center;padding:12px;color:var(--grigio)}
mark{background:var(--mark);padding:0 2px}
.segmento{display:grid;grid-template-columns:74px 1fr;gap:10px;padding:6px 0;border-bottom:1px dashed var(--linea)}
.segmento .ts{color:var(--primario);font-variant-numeric:tabular-nums;cursor:pointer;text-decoration:underline dotted}
.segmento .parlante{color:var(--grigio);font-size:.85rem}
.segmento.attivo{background:#eef4fd}
.risultato{border-top:1px solid var(--linea);padding:10px 0}
.risultato h3{margin:0 0 4px;font-size:1.05rem}
.estratto{margin:4px 0 4px 74px;color:var(--testo)}
.estratto .ts{color:var(--primario);margin-left:-74px;display:inline-block;width:74px}
.accesso{max-width:420px;margin:40px auto}
.codici{columns:2;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:1.05rem}
.qr{max-width:220px;margin:8px 0}
pre.testo{white-space:pre-wrap;background:#fbfbfc;border:1px solid var(--linea);border-radius:8px;padding:12px;font-family:inherit}
.riga-azioni{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pie{text-align:center;color:var(--grigio);font-size:.8rem;padding:24px}
.segreto{font-family:ui-monospace,Menlo,Consolas,monospace;word-break:break-all;background:#fff6e8;padding:8px;border-radius:6px}
details summary{cursor:pointer;color:var(--primario)}
audio{width:100%;margin:8px 0}
@media (max-width:700px){html{font-size:15px}.segmento{grid-template-columns:60px 1fr}.estratto{margin-left:0}.estratto .ts{margin-left:0;width:auto;margin-right:8px}}