*{box-sizing:border-box;}
html,body{margin:0; height:100%; font-family:'Archivo',system-ui,sans-serif; background:#0E1B3D; color:#fff;}
#schermo{height:100%;}
section{height:100%; display:flex; flex-direction:column; padding:28px;}
#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.discreto{background:transparent; color:#8590AD; font-weight:500;}
.errore{color:#FF8C80 !important; min-height:1.2em;}
#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;}
.centro{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:10px;}
.centro h1{font-size:clamp(28px,5vw,52px); margin:16px 0 0; letter-spacing:-.02em;}
.centro p{color:#C9D2EC; font-size:18px; margin:0;}
.cerchio{width:150px; height:150px; 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:76px; height:76px; 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(420px,80vw); border-radius:18px; margin-top:12px;}
.piede{display:flex; align-items:center; gap:14px;}
#stato{flex:1; color:#8590AD; font-size:14px;}
#lettore{position:absolute; left:-9999px; opacity:0;}
#esito{align-items:center; justify-content:center; text-align:center;}
#esito.ok{background:#0C9467;} #esito.no{background:#E2483D;}
#esito h1{font-size:clamp(40px,8vw,84px); margin:16px 0 8px; letter-spacing:-.02em;}
#esito p{font-size:clamp(20px,3vw,30px); margin:0; max-width:900px;}
.esito-icona svg{width:160px; height:160px; fill:none; stroke:#fff; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;}
section[hidden]{display:none !important;}
#esito-rimasti{margin-top:22px; font-size:clamp(22px,3.4vw,34px); font-weight:800; background:rgba(255,255,255,.18); padding:10px 22px; border-radius:99px;}
.piede button + button{margin-left:-4px;}
#stato.attenzione{color:#F5B54A;}