*{box-sizing:border-box;}
html,body{margin:0; min-height:100%; font-family:'Archivo',system-ui,sans-serif; background:#0E1B3D; color:#fff; -webkit-font-smoothing:antialiased;}
section{min-height:100vh; display:flex; flex-direction:column; padding:28px;}
section[hidden]{display:none !important;}
#prepara{max-width:520px; margin:0 auto; justify-content:center; gap:14px;}
#prepara h1{font-size:32px; margin:0;} #prepara p{color:#C9D2EC; line-height:1.5; margin:0;}
label{display:flex; flex-direction:column; gap:6px; font-weight:600; color:#C9D2EC;}
input{font:inherit; font-size:18px; padding:12px 14px; border-radius:12px; border:1px solid #34426A; background:#17285A; color:#fff;}
button{font:inherit; font-weight:650; font-size:16px; padding:12px 18px; border-radius:12px; border:0; background:#fff; color:#0E1B3D; cursor:pointer;}
button.primario{background:#86A0FF; color:#0E1B3D;}
button.discreto{background:transparent; color:#8590AD; font-weight:500;}
.errore{color:#FF8C80; min-height:1.2em; margin:0;}
#attesa{background:radial-gradient(90% 70% at 50% 40%, #1C34A8 0%, #0E1B3D 70%);}
.testa{display:flex; justify-content:space-between; font-size:18px; font-weight:650; color:#C9D2EC;}
.bacheca{margin:16px auto 0; max-width:900px; padding:14px 18px; border-radius:16px; background:rgba(255,255,255,.1); font-size:19px; line-height:1.45; white-space:pre-wrap; text-align:center;}
.centro{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:10px;}
.centro h1{font-size:clamp(30px,5vw,54px); margin:14px 0 0; letter-spacing:-.02em;} .centro p{color:#C9D2EC; font-size:19px; margin:0;}
.cerchio{width:140px; height:140px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.08); animation:respira 2.4s ease-in-out infinite;}
.cerchio svg{width:72px; height:72px; fill:none; stroke:#86A0FF; stroke-width:1.6; stroke-linecap:round;}
@keyframes respira{50%{transform:scale(1.06); background:rgba(134,160,255,.16);}}
video{width:min(380px,80vw); border-radius:18px; margin-top:8px;}
.piede{display:flex; align-items:center; gap:14px; flex-wrap:wrap;} #stato{flex:1; color:#8590AD; font-size:14px;}
#lettore{position:absolute; left:-9999px; opacity:0;}
/* scheda dell'iscritto */
#scheda{background:#F3F5F9; color:#0E1B3D; padding:0;}
.su{background:linear-gradient(135deg,#0E1B3D,#2448E0 60%,#6D4AE8); color:#fff; padding:22px 26px; display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.su h1{margin:0; font-size:clamp(26px,4vw,40px); letter-spacing:-.02em; flex:1; min-width:200px;}
.su .stato{display:inline-flex; align-items:center; gap:8px; font-weight:700; padding:7px 14px; border-radius:99px; background:rgba(255,255,255,.16);}
.su .stato i{width:10px; height:10px; border-radius:50%; background:#4FD1A0;} .su .stato.no i{background:#FF8C80;}
.su .fine{background:#fff; color:#0E1B3D;}
.su .conto{width:100%; font-size:14px; color:rgba(255,255,255,.75);}
.corpo{padding:18px 22px 30px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr); gap:18px;}
@media (max-width:760px){ .corpo{grid-template-columns:1fr;} }
.riq{background:#fff; border:1px solid #DDE2EC; border-radius:18px; padding:16px;}
.riq h2{font-size:17px; margin:0 0 10px;}
.abb{border-left:5px solid #0C9467; padding:8px 12px; border-radius:10px; background:#F3F5F9; margin-bottom:8px;} .abb.no{border-color:#E2483D;} .abb b{display:block; font-size:16px;} .abb span{font-size:14px; color:#4A5675; display:block;}
.saldo{font-size:26px; font-weight:800; color:#0C9467;} .saldo.meno{color:#E2483D;}
.giorno{font-size:13px; font-weight:750; letter-spacing:.04em; color:#6B7590; margin:14px 0 6px; text-transform:capitalize;}
.lez{display:flex; gap:12px; align-items:center; padding:12px 14px; border-radius:12px; border-left:5px solid var(--c,#2448E0); background:color-mix(in srgb, var(--c,#2448E0) 9%, #fff); margin-bottom:8px;}
.lez .ora{font-weight:800; color:var(--c,#2448E0); width:54px; font-size:17px; font-variant-numeric:tabular-nums;} .lez .info{flex:1; min-width:0;} .lez .info b{display:block; font-size:16px;} .lez .info span{font-size:14px; color:#4A5675;}
.lez button{background:var(--c,#2448E0); color:#fff; min-width:120px; padding:12px 16px;} .lez button.disdici{background:transparent; color:var(--c,#2448E0); border:2px solid var(--c,#2448E0);}
.lez.annullata{opacity:.5;}
.vuoto{color:#6B7590; text-align:center; padding:12px;}
.msg{position:fixed; left:50%; bottom:28px; transform:translateX(-50%); background:#0E1B3D; color:#fff; padding:14px 22px; border-radius:14px; font-weight:650; font-size:17px; max-width:90vw; z-index:9;}
.msg.no{background:#E2483D;}
.timer{font-size:13px; color:rgba(255,255,255,.7);}
[data-colore="blu"]{--c:#2448E0;} [data-colore="viola"]{--c:#6D4AE8;} [data-colore="menta"]{--c:#0C9467;} [data-colore="ambra"]{--c:#B86E00;} [data-colore="corallo"]{--c:#E2483D;} [data-colore="ciano"]{--c:#0A8BAE;} [data-colore="rosa"]{--c:#D6407A;}
