/**
 * IL QR DEL DISPOSITIVO — vedi `dispositivo.js`. Prefisso `dsp-`.
 *
 * L'icona c'è solo dove serve: su uno schermo grande con un puntatore vero. Su
 * un telefono non avrebbe chi la legga.
 */
/* `!important`: nel benvenuto una regola più forte («tutti i bottoni della
   testa sono flex») la rimetteva in vista anche sul telefono. */
[data-dsp-apri]{ display:none !important; }
@media (hover:hover) and (pointer:fine) and (min-width:820px){
  .ln-dsp[data-dsp-apri]{ display:inline-grid !important; }
  .ti-dsp[data-dsp-apri]{ display:flex !important; align-items:center; justify-content:center; }
}

/* Nella barra del sito, accanto alle maschere. */
.ln-dsp{ place-items:center; width:40px; height:40px; margin-left:auto; margin-right:2px; padding:0; border:0; border-radius:50%;
  background:none; color:#fff; cursor:pointer; }
.ln-dsp svg, .ti-dsp svg{ width:22px; height:22px; display:block; }
.ln-dsp:hover{ background:rgba(255,255,255,.14); }
.ln-dsp + .ln-profile{ margin-left:0; }
/* Nel benvenuto: a sinistra della lingua, che sta a sinistra delle maschere. */
.testa-benvenuto .ti-dsp{ right:calc(.4rem + 92px); place-items:center; color:#fff; }

/* In ALTO, non al centro: su un portatile il centro dello schermo è a due
   dita dalla tastiera, e il telefono ci sbatte contro. */
.dsp-velo{ position:fixed; inset:0; z-index:4000; display:grid; place-items:start center; padding:14px 20px 20px; background:rgba(3,10,22,.72); }
.dsp-carta{ position:relative; width:min(100%, 440px); padding:18px 24px 20px; border-radius:22px; background:#fff; color:#10243a; text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.5); }
.dsp-carta h2{ margin:0 0 6px; font-size:1.15rem; font-weight:800; }
.dsp-carta p{ margin:0 0 14px; font-size:.9rem; line-height:1.45; color:rgba(16,36,58,.72); }
/* Grande: più è grande sullo schermo, più da lontano lo legge il telefono. */
.dsp-qr{ display:block; width:100%; aspect-ratio:1; margin:0 auto 10px; }
.dsp-stato{ margin:0 !important; font-size:.82rem !important; font-weight:700; color:var(--tema-theme, #1f8fb0) !important; }
.dsp-vai{ display:inline-block; margin-top:12px; padding:.7rem 1.2rem; border-radius:12px; background:var(--tema-theme, #1f8fb0); color:#fff;
  font-weight:800; text-decoration:none; }
.dsp-x{ position:absolute; top:10px; right:10px; width:36px; height:36px; border:0; border-radius:50%; background:rgba(16,36,58,.08);
  color:#10243a; font-size:1.1rem; line-height:1; cursor:pointer; }
