:root{
  --blu:#1A3C5E; --blu-chiaro:#2C5680; --blu-tenue:#E8EEF4; --oro:#B8861F; --oro-tenue:#FBF5E6;
  --inchiostro:#1C1B19; --grigio:#6B6861; --tenue:#9A968D;
  --carta:#FFFFFF; --nebbia:#F5F3EE; --bordo:#E3DFD6;
  --verde:#2E6B4F; --verde-tenue:#E7F0EB; --ambra:#C8841A; --rosso:#9C3B2E;
  --serif:'Newsreader',Georgia,serif; --sans:'Public Sans',-apple-system,'Segoe UI',sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--nebbia);color:var(--inchiostro);font-family:var(--sans);
  font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit}
a{color:var(--blu-chiaro)}
[hidden]{display:none!important}

/* ------------------------------------------------ guscio del telefono */
.app{max-width:560px;margin:0 auto;min-height:100vh;min-height:100dvh;background:var(--carta);
  display:flex;flex-direction:column;box-shadow:0 0 0 1px var(--bordo)}
.testata{background:var(--blu);color:#fff;padding:14px 18px 15px;position:sticky;top:0;z-index:5}
.testata .riga{display:flex;align-items:center;gap:10px}
.testata .corso{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;opacity:.72;margin:0}
.testata h1{font-family:var(--serif);font-weight:500;font-size:21px;line-height:1.2;margin:3px 0 0}
.testata .chi{font-size:12px;opacity:.78;margin:6px 0 0;display:flex;justify-content:space-between;gap:10px}
.testata .indietro{appearance:none;background:rgba(255,255,255,.12);border:0;color:#fff;border-radius:8px;
  width:34px;height:34px;flex:0 0 34px;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center}
.testata .logo{height:34px;width:auto;border-radius:4px;background:#fff;padding:3px 5px}
.corpo{flex:1 1 auto;padding-bottom:28px}
.piede{padding:18px;font-size:12px;color:var(--tenue);text-align:center;border-top:1px solid var(--bordo)}
.piede button{appearance:none;background:none;border:0;color:var(--grigio);text-decoration:underline;cursor:pointer;font-size:12px}

/* ------------------------------------------------ indice dell'incontro */
.elenco{list-style:none;margin:0;padding:0}
.voce{display:flex;gap:12px;align-items:flex-start;padding:14px 18px;border-bottom:1px solid var(--bordo);
  text-decoration:none;color:inherit}
a.voce:active{background:var(--nebbia)}
.voce .stato{flex:0 0 22px;height:22px;border-radius:50%;margin-top:1px;display:grid;place-items:center;
  font-size:11px;font-weight:700;color:#fff;background:var(--blu)}
.voce.fatta .stato{background:var(--verde)}
.voce.ora{background:var(--oro-tenue)}
.voce.ora .stato{background:var(--oro);box-shadow:0 0 0 4px rgba(184,134,31,.18)}
.voce.chiusa .stato{background:#fff;border:1.5px solid var(--bordo);color:var(--tenue);font-size:10px}
.voce .tit{font-weight:600;font-size:15px;line-height:1.3}
.voce.chiusa .tit{color:var(--tenue);font-weight:500}
.voce .meta{font-size:12.5px;color:var(--tenue);margin-top:2px}
.voce.ora .meta{color:var(--oro);font-weight:600}
.voce.fatta .meta{color:var(--verde)}
.voce .freccia{margin-left:auto;color:var(--bordo);font-size:18px;align-self:center}
.titoletto{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--grigio);font-weight:700;
  padding:22px 18px 8px;margin:0}
.vuoto{padding:28px 18px;color:var(--grigio);font-size:14.5px}

/* ------------------------------------------------ testo di lettura */
.lettura{padding:18px 18px 8px;font-size:15.5px}
.lettura h2{font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.2;color:var(--blu);margin:30px 0 8px;
  scroll-margin-top:90px}
.lettura h2:first-child{margin-top:4px}
.lettura h3{font-size:16px;font-weight:700;color:var(--blu);margin:22px 0 6px}
.lettura h4{font-size:15px;font-weight:700;margin:18px 0 4px}
.lettura p{margin:0 0 12px}
.lettura ul,.lettura ol{margin:0 0 12px;padding-left:20px}
.lettura li{margin:0 0 5px}
.lettura .lede{font-family:var(--serif);font-size:18px;line-height:1.4;color:var(--grigio);margin-bottom:14px}
.lettura .nota{font-size:13px;color:var(--grigio)}
.lettura .riquadro{background:var(--nebbia);border-left:3px solid var(--oro);padding:12px 14px;margin:14px 0;border-radius:0 6px 6px 0}
.lettura .riquadro p:last-child,.lettura .riquadro ul:last-child{margin-bottom:0}
.lettura .riquadro-titolo{font-weight:700;color:var(--blu);margin-bottom:6px}
.lettura .tabella{overflow-x:auto;margin:14px 0;border:1px solid var(--bordo);border-radius:8px}
.lettura table{border-collapse:collapse;width:100%;font-size:13.5px;line-height:1.4}
.lettura th{background:var(--blu);color:#fff;text-align:left;font-weight:600;padding:8px 10px;vertical-align:top}
.lettura td{padding:8px 10px;border-top:1px solid var(--bordo);vertical-align:top}
.lettura pre{background:var(--nebbia);border:1px solid var(--bordo);border-radius:8px;padding:12px;
  font-family:var(--mono);font-size:12.5px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.lettura code{font-family:var(--mono);font-size:.9em;background:var(--nebbia);padding:1px 4px;border-radius:3px}
.lettura pre code{background:none;padding:0}
.lettura blockquote{margin:0 0 12px;padding-left:12px;border-left:3px solid var(--bordo);color:var(--grigio)}
.lettura hr{border:0;border-top:1px solid var(--bordo);margin:20px 0}

.indice-dispensa{margin:14px 18px 0;border:1px solid var(--bordo);border-radius:10px}
.indice-dispensa summary{padding:11px 14px;font-weight:600;font-size:14px;cursor:pointer;color:var(--blu)}
.indice-dispensa ol{margin:0;padding:0 14px 12px 32px;font-size:14px}
.indice-dispensa li{margin:4px 0}
.indice-dispensa a{color:var(--inchiostro);text-decoration:none}

/* ------------------------------------------------ pulsanti */
.btn{appearance:none;border:0;border-radius:10px;padding:13px 16px;font-weight:600;font-size:15px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;line-height:1.2}
.btn.primario{background:var(--blu);color:#fff}
.btn.primario:disabled{opacity:.45;cursor:default}
.btn.secondario{background:var(--carta);border:1.5px solid var(--bordo);color:var(--grigio)}
.btn.oro{background:var(--oro);color:#1C1B19}
.btn.pieno{width:100%}
.azioni{display:flex;gap:10px;padding:6px 18px 0}
.azioni .btn.primario{flex:1}

/* ------------------------------------------------ accesso */
.accesso{padding:26px 20px 30px}
.accesso h2{font-family:var(--serif);font-weight:500;font-size:26px;line-height:1.15;color:var(--blu);margin:0 0 6px}
.accesso .sotto{color:var(--grigio);font-size:14.5px;margin:0 0 22px}
.codice{width:100%;font-family:var(--serif);font-size:42px;letter-spacing:.42em;text-align:center;padding:12px 0 12px .42em;
  border:1.5px solid var(--bordo);border-radius:12px;background:var(--carta);color:var(--blu);margin-bottom:14px}
.codice:focus,.campo-testo:focus{outline:none;border-color:var(--blu);box-shadow:0 0 0 3px var(--blu-tenue)}
.errore{color:var(--rosso);font-size:13.5px;margin:-4px 0 12px;font-weight:600}
.cerca{width:100%;padding:12px 14px;border:1.5px solid var(--bordo);border-radius:10px;font:inherit;font-size:15px;margin-bottom:6px}
.studio-nome{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--grigio);font-weight:700;margin:18px 0 6px}
.persona-btn{appearance:none;display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;
  background:var(--carta);border:1.5px solid var(--bordo);border-radius:10px;padding:12px 14px;margin-bottom:6px;cursor:pointer;
  font-size:15.5px;font-weight:600}
.persona-btn span{font-weight:400;color:var(--tenue);font-size:12px}
.persona-btn:active{border-color:var(--blu);background:var(--blu-tenue)}
.manca{margin-top:22px;text-align:center}
.manca button{appearance:none;background:none;border:0;color:var(--blu-chiaro);text-decoration:underline;font-size:14.5px;cursor:pointer}
.campo-testo{width:100%;padding:12px 14px;border:1.5px solid var(--bordo);border-radius:10px;font:inherit;font-size:16px;
  background:var(--carta);margin-bottom:12px}
label.etichetta{display:block;font-size:12.5px;font-weight:700;letter-spacing:.03em;color:var(--grigio);margin:0 0 6px}
.email-nota{background:var(--nebbia);border-radius:10px;padding:14px;margin:0 0 16px;font-size:14.5px}
.email-nota b{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--blu)}
.informativa{font-size:12.5px;color:var(--grigio);line-height:1.5;margin:18px 0 0;padding-top:14px;border-top:1px solid var(--bordo)}

/* ------------------------------------------------ attività */
.attivita{padding:16px 18px 0}
.passo{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--oro);font-weight:700;margin:0}
.puntini{display:flex;gap:3px;margin:9px 0 16px}
.puntini i{height:4px;flex:1;background:var(--bordo);border-radius:2px}
.puntini i.ok{background:var(--blu)}
.puntini i.ora{background:var(--oro)}
.domanda{font-family:var(--serif);font-size:21px;line-height:1.28;margin:0 0 4px;color:var(--blu);font-weight:500}
.sotto-domanda{font-size:13px;color:var(--grigio);margin:0 0 18px}
.gruppo-campo{margin-bottom:20px}
.gruppo-campo>.et{margin:0 0 8px;font-size:12.5px;font-weight:700;letter-spacing:.03em;color:var(--grigio)}
.gruppo-campo>.et small{font-weight:400;letter-spacing:0}
.scelte{display:flex;gap:6px}
.scelte.colonna{flex-direction:column}
.scelta{appearance:none;flex:1;background:var(--carta);border:1.5px solid var(--bordo);border-radius:10px;padding:10px 6px;
  font-size:12.5px;font-weight:600;color:var(--grigio);cursor:pointer;line-height:1.25;text-align:center;min-height:48px}
.scelta b{display:block;font-size:16px;color:var(--inchiostro)}
.scelte.colonna .scelta{text-align:left;padding:12px 14px;font-size:14.5px;color:var(--inchiostro);font-weight:500;
  display:flex;gap:10px;align-items:flex-start}
.scelte.colonna .scelta .spunta{flex:0 0 20px;height:20px;border-radius:50%;border:1.5px solid var(--bordo);margin-top:1px;
  display:grid;place-items:center;font-size:11px;color:#fff}
.scelte.colonna.multi .scelta .spunta{border-radius:5px}
.scelte.colonna .scelta small{display:block;color:var(--grigio);font-size:12.5px;font-weight:400;margin-top:2px}
.scelta[aria-pressed=true]{background:var(--blu);border-color:var(--blu);color:#fff}
.scelta[aria-pressed=true] b{color:#fff}
.scelte.colonna .scelta[aria-pressed=true]{background:var(--blu-tenue);border-color:var(--blu);color:var(--inchiostro)}
.scelte.colonna .scelta[aria-pressed=true] .spunta{background:var(--blu);border-color:var(--blu)}
.scelte.colonna .scelta[aria-pressed=true] small{color:var(--grigio)}
.estremi{display:flex;justify-content:space-between;font-size:11px;color:var(--tenue);margin-top:5px}
textarea.campo-testo{resize:vertical;min-height:72px;line-height:1.45;margin-bottom:0}
.conta-car{font-size:11px;color:var(--tenue);text-align:right;margin-top:3px}
.avviso{background:var(--nebbia);border-left:3px solid var(--oro);padding:10px 12px;font-size:13px;color:var(--grigio);margin:0 0 16px}
.salvato{font-size:12px;color:var(--verde);text-align:center;margin:10px 0 0;min-height:18px}
.riepilogo{padding:4px 18px 0}
.riepilogo dl{margin:0}
.riepilogo dt{font-size:12px;font-weight:700;color:var(--grigio);margin:14px 0 3px}
.riepilogo dd{margin:0;font-size:15px}
.esito{margin:18px 18px 0;padding:16px;border-radius:12px;background:var(--verde-tenue);color:var(--verde);font-weight:600;font-size:15px}
.esito.neutro{background:var(--nebbia);color:var(--grigio)}
.esito small{display:block;font-weight:400;color:var(--grigio);margin-top:4px;font-size:13px}
.gruppi-btn{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.gruppi-btn .scelta{font-family:var(--serif);font-size:24px;padding:14px 0;color:var(--blu)}

/* ------------------------------------------------ prompt ed esercizi */
.carta{margin:0 18px 14px;border:1px solid var(--bordo);border-radius:12px;overflow:hidden;background:var(--carta)}
.carta>header{background:var(--nebbia);padding:9px 12px;display:flex;align-items:center;gap:10px;justify-content:space-between;
  border-bottom:1px solid var(--bordo)}
.carta>header span{font-size:12px;font-weight:700;color:var(--inchiostro);line-height:1.3}
.carta>header .copia{appearance:none;background:var(--blu);color:#fff;border:0;border-radius:7px;font-size:12px;font-weight:600;
  padding:6px 12px;cursor:pointer;flex:0 0 auto}
.carta>header .copia.ok{background:var(--verde)}
.carta pre{margin:0;padding:12px;font-family:var(--mono);font-size:12.5px;line-height:1.5;white-space:pre-wrap;
  overflow-wrap:anywhere;max-height:340px;overflow-y:auto}
.carta .lettura{padding:12px 14px 4px;font-size:14.5px}
.carta .apri{display:block;width:100%;appearance:none;background:none;border:0;border-top:1px solid var(--bordo);padding:9px;
  font-size:12.5px;font-weight:600;color:var(--blu-chiaro);cursor:pointer}
.gruppo-prompt{font-family:var(--serif);font-size:18px;font-weight:500;color:var(--blu);margin:24px 18px 4px;line-height:1.25}
.istruzioni{font-size:13.5px;color:var(--grigio);margin:0 18px 12px;white-space:pre-line}
.ruolo{font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--grigio);
  background:var(--carta);border:1px solid var(--bordo);border-radius:4px;padding:2px 6px;flex:0 0 auto}
.ruolo.errori{color:var(--rosso);border-color:#E6C9C3}
.scarica{display:flex;gap:12px;align-items:center;margin:0 18px 10px;padding:12px 14px;border:1px solid var(--bordo);border-radius:10px;
  text-decoration:none;color:var(--inchiostro);font-size:14px;font-weight:600}
.scarica small{display:block;font-weight:400;color:var(--grigio);font-size:12px}
.scarica .ico{flex:0 0 36px;height:36px;border-radius:8px;background:var(--blu-tenue);color:var(--blu);display:grid;place-items:center;font-size:11px;font-weight:700}

.slide-carta{margin:0 18px 12px;border:1px solid var(--bordo);border-radius:12px;padding:14px 16px}
.slide-carta .n{font-size:11px;color:var(--tenue);font-weight:700}
.slide-carta h3{font-family:var(--serif);font-weight:500;font-size:19px;color:var(--blu);margin:2px 0 8px;line-height:1.25}
.slide-carta .lettura{padding:0;font-size:14.5px}
.slide-carta .col h4{margin:12px 0 4px;color:var(--blu)}

/* ------------------------------------------------ avvisi */
.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);width:min(520px,calc(100% - 28px));background:var(--inchiostro);color:#fff;
  border-radius:12px;padding:13px 16px;display:flex;align-items:center;gap:12px;box-shadow:0 12px 30px -10px rgba(0,0,0,.45);z-index:20;
  font-size:14px;text-decoration:none}
.toast b{color:#F2D28A}
.toast .vai{margin-left:auto;font-weight:700;color:#F2D28A;white-space:nowrap}
.caricamento{padding:40px 18px;color:var(--tenue);text-align:center;font-size:14px}