/* Stili della simulazione B1 — integra assets/styles.css del sito.
   Riprende le convenzioni di test/test.css (note-band, fb, res) e aggiunge
   quello che serve alle quattro sezioni: player d'ascolto, area di scrittura
   con contaparole e registratore. */

.note-band{background:var(--ambra-wash);border-left:3px solid var(--ambra);
  padding:.8rem 1rem;border-radius:0 .4rem .4rem 0;font-size:.92rem;
  color:var(--ink-soft);margin:1.2rem 0}
.note-band--clay{background:var(--clay-wash);border-left-color:var(--clay)}
.note-band--verde{background:var(--verde-wash);border-left-color:var(--verde)}

.calc__foot{padding:0 1.6rem 1.6rem;border-top:1px solid var(--rule);
  margin-top:.5rem;padding-top:1.4rem}

/* ---- elenco delle prove in home ---- */
.prove-elenco{display:grid;gap:.1rem;margin:.4rem 0 1.4rem}
.prova-riga{display:flex;align-items:baseline;gap:.8rem;padding:.7rem 0;
  border-bottom:1px solid var(--rule)}
.prova-riga:last-child{border-bottom:0}
.prova-riga__n{font-family:var(--serif,Cormorant),Georgia,serif;font-size:1.5rem;
  line-height:1;color:var(--lapis-lt);min-width:1.4rem}
.prova-riga__t{font-weight:600;color:var(--ink)}
.prova-riga__d{color:var(--ink-mute);font-size:.9rem;margin-left:auto;
  white-space:nowrap;padding-left:.6rem}

/* ---- barra di avanzamento fra sezioni ---- */
.sezioni-barra{display:flex;gap:.4rem;flex-wrap:wrap;margin:0 0 1.4rem}
.sezioni-barra__p{flex:1 1 0;min-width:90px;font-size:.78rem;letter-spacing:.03em;
  text-transform:uppercase;color:var(--ink-mute);padding:.45rem .3rem;
  border-top:2px solid var(--mist-deep);text-align:center}
.sezioni-barra__p--attiva{color:var(--lapis);border-top-color:var(--lapis);
  font-weight:600}
.sezioni-barra__p--fatta{color:var(--verde);border-top-color:var(--verde)}

/* ---- testi di lettura ---- */
.testo-prova{background:var(--paper-cool);border:1px solid var(--mist-deep);
  border-radius:var(--radius-lg);padding:1.2rem 1.4rem;margin:0 0 1.2rem}
.testo-prova__t{font-size:1.05rem;margin:0 0 .7rem;font-weight:600}
.testo-prova__c{margin:0;white-space:pre-line;line-height:1.65;color:var(--ink)}
.blocco{padding:1.4rem 0;border-bottom:1px solid var(--rule)}
.blocco:last-child{border-bottom:0;padding-bottom:.4rem}

/* ---- domande a scelta multipla ---- */
.dom{margin:0 0 1.3rem}
.dom__t{font-weight:600;margin:0 0 .6rem;line-height:1.4}
.dom__opz{display:grid;gap:.35rem}
.opz{display:flex;gap:.6rem;align-items:flex-start;padding:.55rem .8rem;
  border:1px solid var(--mist-deep);border-radius:var(--radius-lg);
  background:var(--white);cursor:pointer;transition:all .13s ease}
.opz:hover{border-color:var(--lapis-lt);background:var(--lapis-wash)}
.opz input{margin:.25rem 0 0;flex:0 0 auto;accent-color:var(--lapis)}
.opz--scelta{border-color:var(--lapis);background:var(--lapis-wash)}
.opz--giusta{border-color:var(--verde);background:var(--verde-wash)}
.opz--sbagliata{border-color:var(--clay);background:var(--clay-wash)}
.opz__seg{margin-left:auto;font-size:.8rem;font-weight:600;white-space:nowrap;
  padding-left:.5rem}
.opz--giusta .opz__seg{color:var(--verde)}
.opz--sbagliata .opz__seg{color:var(--clay)}

/* ---- player d'ascolto ---- */
.traccia{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;
  background:var(--paper-cool);border:1px solid var(--mist-deep);
  border-radius:var(--radius-lg);padding:.9rem 1.1rem;margin:0 0 1.1rem}
.traccia__t{font-weight:600}
.traccia audio{height:38px;flex:1 1 220px;min-width:0}
.traccia__resta{font-size:.85rem;color:var(--ink-mute);white-space:nowrap}
.traccia__resta--zero{color:var(--clay)}

/* ---- produzione scritta ---- */
.consegna{background:var(--lapis-wash);border-left:3px solid var(--lapis);
  padding:.9rem 1.1rem;border-radius:0 .4rem .4rem 0;margin:0 0 1rem;
  white-space:pre-line;line-height:1.6}
.accenti{display:flex;gap:.3rem;flex-wrap:wrap;margin:0 0 .5rem}
.accenti__b{font-family:inherit;font-size:1rem;line-height:1;padding:.35rem .6rem;
  border:1px solid var(--mist-deep);border-radius:var(--radius);
  background:var(--white);color:var(--ink-soft);cursor:pointer}
.accenti__b:hover{background:var(--lapis);border-color:var(--lapis);color:#fff}
.accenti__l{font-size:.8rem;color:var(--ink-mute);align-self:center;
  margin-right:.2rem}
textarea.input{min-height:190px;resize:vertical;line-height:1.6;
  font-family:inherit;font-size:1rem}
.conta{display:flex;justify-content:space-between;gap:1rem;font-size:.85rem;
  color:var(--ink-mute);margin:.4rem 0 .9rem}
.conta--ok{color:var(--verde)}
.conta--fuori{color:var(--ambra)}

/* ---- produzione orale ---- */
.reg{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin:.2rem 0 .8rem}
.reg__stato{font-size:.9rem;color:var(--ink-mute)}
.reg__tempo{font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink)}
.reg__spia{width:11px;height:11px;border-radius:50%;background:var(--mist-deep);
  flex:0 0 auto}
.reg__spia--on{background:var(--clay);animation:pulsa 1.1s ease-in-out infinite}
@keyframes pulsa{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.reg__spia--on{animation:none}}
.reg audio{height:38px;max-width:100%}

/* ---- esito delle prove valutate ---- */
.esito{border-radius:var(--radius-lg);padding:1.1rem 1.2rem;margin:1rem 0 0;
  background:var(--paper-cool);border:1px solid var(--mist-deep)}
.esito__testa{display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap;
  margin:0 0 .8rem}
.esito__perc{font-family:var(--serif,Cormorant),Georgia,serif;font-size:1.9rem;
  line-height:1}
.esito__perc--ok{color:var(--verde)}
.esito__perc--no{color:var(--clay)}
.esito__eti{font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink-mute)}
.crit{display:grid;gap:.45rem;margin:0 0 .9rem}
.crit__r{display:grid;grid-template-columns:1fr auto;gap:.6rem;align-items:center;
  font-size:.92rem}
.crit__n{color:var(--ink-soft)}
.crit__b{display:flex;gap:3px}
.crit__q{width:15px;height:9px;border-radius:2px;background:var(--mist-deep)}
.crit__q--on{background:var(--lapis)}
.esito__commento{margin:.2rem 0 0;line-height:1.6}
.esito__errori{margin:.9rem 0 0;padding:.8rem 1rem;background:var(--white);
  border:1px solid var(--mist-deep);border-radius:var(--radius);font-size:.92rem}
.esito__errori ul{margin:.35rem 0 0;padding-left:1.1rem}
.esito__errori li{margin:.2rem 0}
.esito__errori del{color:var(--clay);text-decoration-thickness:1px}
.esito__errori ins{color:var(--verde);text-decoration:none;font-weight:600}
.trascr{margin:.9rem 0 0;padding:.8rem 1rem;background:var(--white);
  border:1px solid var(--mist-deep);border-radius:var(--radius);
  font-size:.92rem;color:var(--ink-soft)}
.trascr strong{color:var(--ink)}

/* ---- copioni delle tracce, mostrati solo a prova conclusa ---- */
.copione__b{margin:0 0 .5rem;line-height:1.65}
.copione__b:last-child{margin-bottom:0}
.copione__v{font-weight:600;color:var(--lapis);margin-right:.15rem}

/* ---- riepilogo finale ---- */
.tot{display:grid;gap:.5rem;margin:0 0 1.4rem}
.tot__r{display:grid;grid-template-columns:1fr auto auto;gap:.9rem;
  align-items:center;padding:.7rem 0;border-bottom:1px solid var(--rule)}
.tot__n{font-weight:600}
.tot__p{font-variant-numeric:tabular-nums;color:var(--ink-soft)}
.tot__v{font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;
  font-weight:600;white-space:nowrap}
.tot__v--ok{color:var(--verde)}
.tot__v--no{color:var(--clay)}
.tot__v--na{color:var(--ink-mute)}
.verdetto{font-size:1.05rem;padding:1rem 1.2rem;border-radius:var(--radius-lg);
  margin:0 0 1.4rem}
.verdetto--ok{background:var(--verde-wash);border-left:3px solid var(--verde)}
.verdetto--no{background:var(--ambra-wash);border-left:3px solid var(--ambra)}
.verdetto p{margin:.4rem 0 0;font-size:.95rem;color:var(--ink-soft)}
.verdetto p:first-child{margin-top:0}

.attesa{display:inline-flex;align-items:center;gap:.5rem;color:var(--ink-mute);
  font-size:.92rem}
.attesa__g{width:13px;height:13px;border:2px solid var(--mist-deep);
  border-top-color:var(--lapis);border-radius:50%;animation:gira .7s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.attesa__g{animation-duration:2.5s}}

.errore{background:var(--clay-wash);border-left:3px solid var(--clay);
  padding:.8rem 1rem;border-radius:0 .4rem .4rem 0;margin:.8rem 0;
  font-size:.92rem;color:var(--ink-soft)}

.credit{margin-top:1.5rem;font-size:.92rem;color:var(--ink-mute)}

@media (max-width:560px){
  .prova-riga__d{margin-left:0;width:100%;padding-left:2.2rem}
  .prova-riga{flex-wrap:wrap}
  .sezioni-barra__p{min-width:0;font-size:.7rem}
}

.trascr__nota{margin:.5rem 0 0;font-size:.86rem;color:var(--ink-mute);
  line-height:1.55}