/* Wasamar – alba (chiaro) e notte (scuro, segue il telefono) */
:root{
  color-scheme: light dark;
  --fondo:#F8F3EA; --carta:#FFFFFF; --inchiostro:#3A2148; --titolo:#3A2148; --grigio:#5E5670; --bordo:#E6DCCD;
  --primario:#3A2148; --su-primario:#FFF8EC; --accento:#C9852E; --scelto:#F1E8F4; --focus:#E9C77B;
  --ok:#267A4B; --ok-chiaro:#E6F2EC; --ok-testo:#1D5E3A;
  --rosa:#FBE3D7; --rosa-testo:#8A3416; --sabbia:#F1E9DC;
  --prova:#FFF6D9; --prova-testo:#6B5200; --prova-bordo:#D9B84A;
  --avatar-fondo:#F1E8F4; --cielo:none;
  --accento-testo:#8A5A12; --su-forte:#FFFFFF;
}
@media (prefers-color-scheme: dark){
  :root{
    --fondo:#1E1029; --carta:#2A1838; --inchiostro:#F3EBDD; --titolo:#F6E2B0; --grigio:#CDB8DA; --bordo:#4A3358;
    --primario:#F6E2B0; --su-primario:#1E1029; --accento:#E9C77B; --scelto:#3E2450; --focus:#E9C77B;
    --ok:#3FA36B; --ok-chiaro:#1F3A2C; --ok-testo:#9BE0B7;
    --rosa:#4A2A3A; --rosa-testo:#F7C6B4; --sabbia:#33213F;
    --prova:#3A3115; --prova-testo:#F2D98A; --prova-bordo:#8C7530;
    --avatar-fondo:#3E2450;
    --accento-testo:#E9C77B; --su-forte:#1E1029;
    --cielo: radial-gradient(1px 1px at 12% 14%, #F6E2B0aa 50%, transparent 51%), radial-gradient(1px 1px at 86% 10%, #F6E2B088 50%, transparent 51%),
             radial-gradient(1.5px 1.5px at 92% 38%, #F6E2B0aa 50%, transparent 51%), radial-gradient(1px 1px at 6% 55%, #F6E2B077 50%, transparent 51%),
             radial-gradient(1px 1px at 70% 92%, #F6E2B088 50%, transparent 51%), radial-gradient(1.5px 1.5px at 22% 88%, #F6E2B077 50%, transparent 51%);
  }
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--fondo);color:var(--inchiostro);font-family:'Nunito Sans',system-ui,sans-serif;-webkit-text-size-adjust:100%}
body{min-height:100dvh;background-image:var(--cielo);background-attachment:fixed}
#app{max-width:480px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;
  padding:calc(20px + env(safe-area-inset-top)) 20px calc(24px + env(safe-area-inset-bottom));gap:14px}
h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:2.125rem;font-weight:600;line-height:1.1;margin:0;color:var(--titolo)}
h1:focus{outline:none}
p{margin:0}
.sotto{font-size:1rem;color:var(--grigio);line-height:1.5}
.piccolo{font-size:0.875rem;color:var(--grigio);line-height:1.45}
.centro{text-align:center}
.progresso{display:flex;flex-direction:column;gap:8px}
.barra{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.barra span{height:6px;border-radius:3px;background:var(--bordo)}
.barra span.fatto{background:var(--accento)}
.passo{font-size:0.875rem;font-weight:700;color:var(--grigio)}
.griglia2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.scelta{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:10px 14px;border-radius:14px;
  border:1px solid var(--bordo);background:var(--carta);font:inherit;font-size:1rem;font-weight:700;color:var(--inchiostro);cursor:pointer;text-align:center}
.scelta[aria-pressed="true"]{border:3px solid var(--primario);background:var(--scelto);padding:8px 12px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label{font-size:0.875rem;font-weight:800;color:var(--grigio)}
.campo input,.campo select{min-height:52px;border-radius:14px;border:1px solid var(--bordo);background:var(--carta);padding:0 14px;
  font:inherit;font-size:1.0625rem;color:var(--inchiostro);width:100%;min-width:0}
.campo input:focus,.campo select:focus{outline:3px solid var(--focus);border-color:var(--accento)}
.riga{display:flex;gap:8px;align-items:flex-end}
.riga .campo{flex:1;min-width:0}
.bottone{min-height:56px;padding:8px 20px;border-radius:28px;line-height:1.25;text-align:center;border:none;background:var(--primario);color:var(--su-primario);font:inherit;font-size:1.125rem;font-weight:800;
  display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer;text-decoration:none}
.bottone[disabled]{opacity:.45;cursor:not-allowed}
.bottone.secondario{background:transparent;color:var(--titolo);min-height:44px}
.bottone.piccolo-b{min-height:52px;width:auto;padding:6px 16px;border-radius:14px;font-size:0.9375rem;background:var(--accento);color:#1E1029;flex-shrink:0}
.fondo{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding-top:8px}
.avviso{display:flex;gap:8px;align-items:flex-start;padding:12px 14px;border-radius:14px;font-size:0.875rem;font-weight:700;line-height:1.4}
.avviso.verde{background:var(--ok-chiaro);color:var(--ok-testo)}
.avviso.sabbia{background:var(--sabbia);color:var(--inchiostro);font-weight:600}
.avviso.prova{background:var(--prova);color:var(--prova-testo);border:1px dashed var(--prova-bordo)}
.avviso.errore{background:var(--rosa);color:var(--rosa-testo)}
.riquadro-foto{border:3px dashed var(--bordo);border-radius:20px;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;padding:16px;text-align:center;color:var(--grigio);font-weight:700;background:var(--carta)}
.riquadro-foto.ok{border-color:var(--ok);color:var(--ok-testo);background:var(--ok-chiaro)}
.chip{min-height:44px;padding:8px 14px;border-radius:22px;border:1px solid var(--bordo);background:var(--carta);font:inherit;font-size:0.9375rem;font-weight:700;color:var(--inchiostro);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--primario);border-color:var(--primario);color:var(--su-primario)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.scheda{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:18px;background:var(--carta);border:1px solid var(--bordo)}
.scheda h2{font-size:0.875rem;font-weight:800;color:var(--accento-testo);margin:0}
.dato{display:flex;flex-direction:column}
.dato span:first-child{font-size:0.875rem;color:var(--grigio)}
.dato span:last-child{font-weight:700;font-size:0.9375rem}
.cerchio-ok{width:72px;height:72px;border-radius:36px;background:var(--ok);display:flex;align-items:center;justify-content:center;align-self:center}
.badge{align-self:center;padding:8px 16px;border-radius:20px;background:var(--rosa);color:var(--rosa-testo);font-size:0.9375rem;font-weight:800;text-align:center}
.avatar-tondo{width:56px;height:56px;border-radius:28px;background:var(--avatar-fondo);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.avatar-grande{width:140px;height:140px;border-radius:70px;background:var(--avatar-fondo);display:flex;align-items:center;justify-content:center;align-self:center}
.umori{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.umori .scelta{flex-direction:column;gap:2px;min-height:96px;font-size:0.9375rem}
.esito-nick{font-size:0.875rem;font-weight:800}
.esito-nick.ok{color:var(--ok-testo)} .esito-nick.no{color:var(--rosa-testo)}
.attesa{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;flex:1;text-align:center}
.rotella{width:48px;height:48px;border-radius:50%;border:5px solid var(--bordo);border-top-color:var(--accento);animation:gira 1s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
.marchio{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 0}
.marchio .nome{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;font-size:2.875rem;letter-spacing:3px;color:var(--titolo);line-height:1}
.marchio .motto{font-size:0.875rem;letter-spacing:4px;text-transform:uppercase;color:var(--grigio)}
.link-esci{background:none;border:none;color:var(--grigio);font:inherit;font-size:0.9375rem;text-decoration:underline;cursor:pointer;padding:8px 10px;min-height:44px;min-width:44px}
.viso-box{position:relative;width:240px;height:240px;align-self:center;flex-shrink:0}
.anello{position:absolute;inset:0;width:240px;height:240px}
.anello line{stroke:var(--bordo);stroke-width:5;stroke-linecap:round;transition:stroke .25s}
.anello line.on{stroke:var(--ok)}
.ovale-video{position:absolute;left:28px;top:28px;width:184px;height:184px;border-radius:50%;overflow:hidden;background:var(--carta);border:3px solid var(--bordo)}
.ovale-video video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);display:block}
#viso-msg{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:20px;color:var(--grigio);font-weight:700;font-size:0.875rem;background:var(--carta)}
[hidden]{display:none !important}
@media (prefers-reduced-motion:reduce){.rotella{animation-duration:3s}}
:root{--p1:#8E78C8;--p2:#A56DB8;--p3:#C2629E;--p4:#D65C80;--p5:#E06A5C;--p6:#E3804A;--p7:#DF963C;--p8:#D6A436;--p9:#CFAE3E;--p10:#C9A44A;--stella:#C9852E}
@media (prefers-color-scheme: dark){:root{--p1:#B9A3E3;--p2:#C9A0DC;--p3:#E09BC8;--p4:#EE9AAE;--p5:#F4A08F;--p6:#F5AE78;--p7:#F2BE6C;--p8:#EDCB6E;--p9:#E9D27F;--p10:#F6E2B0;--stella:#FFF4D6}
.simbolo{filter:drop-shadow(0 0 4px rgba(246,226,176,.45))}}
/* n.67 lingue */
.campo-lingua{margin-top:-4px}
.campo-lingua select{font-size:1.0625rem;font-weight:700}
html.tr-attesa #app,html.tr-attesa .foglio-fondo{visibility:hidden}
html.tr-attesa body::after{content:"";position:fixed;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:3px solid var(--bordo);border-top-color:var(--accento);animation:giro-tr .8s linear infinite}
@keyframes giro-tr{to{transform:rotate(360deg)}}
[dir=rtl] .indietro-b svg{transform:scaleX(-1)}

/* n.79 accessibilità */
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
button,select,[role="button"]{min-height:44px}
.link-b{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;text-align:center}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.foglio>*{flex-shrink:0}
.testo-b{align-self:center;gap:6px;font-size:1rem}
.leggi-b{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 10px;margin-top:-2px;border-radius:22px;border:1px solid var(--bordo);background:var(--carta);color:var(--titolo);font:inherit;font-size:0.875rem;font-weight:800;cursor:pointer}
.msg.mio .leggi-b{display:none}
.dim-testo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,4.75rem),1fr));gap:8px}
.dim-testo .scelta{flex-direction:column;gap:2px;padding:6px 4px;line-height:1.1}
.dim-testo .scelta .aa{font-weight:800;color:var(--titolo)}
.dim-testo .scelta small{font-size:0.875rem;font-weight:700}
@media (prefers-contrast: more){
  :root{--grigio:var(--inchiostro);--bordo:var(--inchiostro)}
  .chip,.scelta,.scheda,.campo input,.campo select{border-width:2px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* con il testo grande le griglie passano da sole a meno colonne */
#app .umori,#app .umori-p{grid-template-columns:repeat(auto-fit,minmax(min(100%,6.5rem),1fr))}
#app .fig-griglia{grid-template-columns:repeat(auto-fit,minmax(min(100%,4.6rem),1fr))}
#app .scelta{overflow-wrap:anywhere;hyphens:auto}
#app .avvisi-card p+p{margin-top:6px}
#app .riepilogo>div{flex:1;min-width:0}
#app .avvisi-card p b{display:inline}
.togli-b{min-width:44px;min-height:44px;border-radius:22px;border:1px solid var(--bordo);background:var(--carta);color:var(--grigio);font:inherit;font-size:1.25rem;line-height:1;cursor:pointer;flex-shrink:0}
.frase-riga{display:flex;gap:6px;align-items:center}
.frase-riga .voce{flex:1}
.frase-b{font-weight:700}
