/* ==========================================================================
   app.css — L'ABITO DI GESTEA360, IL CLIENT: i componenti del prototipo di
   Claude Design (pacchetto del 07/09/2026), misura per misura, con gli stati.
   Ogni colore, corpo, durata, curva, raggio, ombra e misura di layout viene
   da `tema.css` per nome: qui non ce n'è uno scritto (`verifica:tema` lo
   pretende). Le tre zone del prototipo — la barra laterale (288, o la colonna
   di icone a 64), il centro, il pannello di destra (480) — e i componenti:
   la casella a pillola, il menu del «+», il menu contestuale, il saluto col
   bagliore, il messaggio dell'operatore, la risposta con le marche, la scheda
   file, le pagine, l'accesso. Le videate senza prototipo usano gli stessi
   componenti. Il movimento sta nella specifica del README, punto per punto.
   ========================================================================== */

/* — la base — */
*,*::before,*::after{box-sizing:border-box}
html{height:100%}
body{margin:0;height:100%;background:var(--sfondo);color:var(--inchiostro);font-family:var(--carattere);font-size:var(--testo-corpo);line-height:var(--interlinea-corpo);font-weight:var(--peso-normale);overflow:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,textarea,select{font:inherit;color:inherit;letter-spacing:inherit}
button{cursor:pointer}
a{color:var(--accento);text-decoration:none}
a:hover{color:var(--accento-forte);text-decoration:underline;text-underline-offset:2px}
::placeholder{color:var(--inchiostro-3);opacity:1}
*{scrollbar-width:thin;scrollbar-color:var(--barra-di-scorrimento) transparent}
::selection{background:var(--selezione)}
:focus{outline:none}
/* L'ANELLO DI FUOCO È DEI BOTTONI E DEI COLLEGAMENTI (README, tastiera) — `[09/09/2026]`, mandato REPORT §0.4: era su ogni elemento, e sulla casella della chat disegnava il riquadro colorato che il committente ha visto */
button:focus-visible,a:focus-visible,summary:focus-visible,[role=button]:focus-visible{box-shadow:var(--anello-focus)}
h1,h2,h3,h4,h5,h6{margin:0 0 var(--spazio-2);font-weight:var(--peso-forte);line-height:var(--interlinea-titolo-sezione)}
h1{font-size:var(--testo-titolo-pagina);font-weight:var(--peso-normale);line-height:var(--interlinea-titolo-pagina);letter-spacing:var(--spaziatura-titolo-pagina)}
h2{font-size:var(--testo-titolo-sezione);letter-spacing:var(--spaziatura-titolo-sezione)}
h3{font-size:var(--testo-titolo-notizia);line-height:var(--interlinea-titolo-notizia)}
h4{font-size:var(--testo-risposta)}
h5{font-size:var(--testo-corpo)}
h6,.etichetta{font-size:var(--testo-etichetta-sezione);letter-spacing:var(--spaziatura-etichetta);text-transform:uppercase;color:var(--inchiostro-2);font-weight:var(--peso-forte);margin:0 0 var(--spazio-3)}
.etichetta-sm{font-size:var(--testo-etichetta-sezione);letter-spacing:var(--spaziatura-etichetta);text-transform:uppercase;color:var(--inchiostro-2);font-weight:var(--peso-forte)}
p{margin:0 0 var(--spazio-3)}
.attenuato{color:var(--inchiostro-2)}
.tabulari{font-variant-numeric:tabular-nums}
.errore{color:var(--pericolo)}
.attenzione{font-weight:var(--peso-forte);color:var(--inchiostro)}
.nascosto{display:none !important}
[hidden]{display:none !important}
svg{display:block}

/* — i bottoni: pillole, secondari col bordo, icone tonde — */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spazio-2);cursor:pointer;text-decoration:none;font-weight:var(--peso-forte);font-size:var(--testo-bottone);line-height:1.2;color:var(--inchiostro);background:transparent;border:1px solid transparent;padding:0 var(--spazio-4);height:var(--nuova-chat-altezza);border-radius:var(--raggio-pillola);white-space:nowrap;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido),border-color var(--rapido) var(--curva-rapido)}
.btn:hover{text-decoration:none}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-primary{background:var(--accento);color:var(--bianco)}
.btn-primary:hover{background:var(--accento-forte);color:var(--bianco)}
.btn-secondary{border-color:var(--bordo);background:var(--bianco)}
.btn-secondary:hover{background:var(--superficie)}
.btn-ghost{color:var(--accento)}
.btn-ghost:hover{background:var(--tinta)}
.btn-icon{width:var(--bottone-icona);height:var(--bottone-icona);padding:0;border-radius:var(--raggio-riga)}
.btn-block{width:100%}
.btn-piccolo{height:var(--scarica-altezza);padding:0 var(--spazio-3);font-size:var(--testo-medio)}
.collegamento{background:none;border:0;padding:0;font:inherit;color:var(--accento);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.collegamento:hover{color:var(--accento-forte)}
/* i bottoni-icona del prototipo: 36×36 raggio 10, o 40×40 raggio 12 nella colonna di icone e nella casella */
.bottone-icona{display:grid;place-items:center;width:var(--bottone-icona);height:var(--bottone-icona);border:0;border-radius:var(--raggio-riga);background:transparent;color:var(--inchiostro-2);padding:0;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido)}
.bottone-icona:hover{background:var(--passaggio-bottone);color:var(--inchiostro)}
.bottone-icona.grande{width:var(--bottone-icona-grande);height:var(--bottone-icona-grande);border-radius:var(--raggio-campo)}
.bottone-icona.tondo{width:var(--casella-bottone);height:var(--casella-bottone);border-radius:var(--raggio-tondo)}

/* — i campi — */
.field>label{display:block;font-size:var(--testo-medio);font-weight:var(--peso-forte);color:var(--inchiostro-2);margin-bottom:var(--spazio-2)}
.input{width:100%;height:var(--campo-accesso-altezza);padding:0 var(--spazio-4);font:inherit;font-size:var(--testo-corpo);color:var(--inchiostro);caret-color:var(--accento);background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);transition:border-color var(--rapido) var(--curva-rapido),box-shadow var(--rapido) var(--curva-rapido)}
.input:hover{border-color:var(--scheda-passaggio-bordo)}
.input:focus,.input:focus-visible{border-color:var(--accento-chiaro);box-shadow:var(--anello-focus)}
.input.errato{border-color:var(--pericolo)}
textarea.input{height:auto;min-height:90px;padding:var(--spazio-3) var(--spazio-4);resize:vertical}
select.input{padding-right:var(--spazio-7)}
.input.piccolo{width:140px;height:var(--linguetta-altezza);padding:0 var(--spazio-3);font-size:var(--testo-medio)}
/* il filtro a chip (Fonti): attiva = inchiostro su bianco */
.seg{display:inline-flex;flex-wrap:wrap;gap:var(--spazio-2)}
.seg-opt{display:inline-flex;align-items:center;gap:var(--spazio-2);height:var(--chip-fonti-altezza);padding:0 var(--spazio-3);border:0;border-radius:var(--raggio-pillola);background:var(--superficie);color:var(--inchiostro-2);font-size:var(--testo-medio);font-weight:var(--peso-forte);cursor:pointer;position:relative;text-decoration:none;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido)}
.seg-opt input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.seg-opt:has(input:checked),.seg-opt.attiva{background:var(--inchiostro);color:var(--bianco)}
.seg-opt:not(:has(input:checked)):not(.attiva):hover{background:var(--superficie-2)}
.seg a.seg-opt:hover{text-decoration:none}
.seg.avvolge{flex-wrap:wrap}
.seg.avvolge .seg-opt{white-space:nowrap}

/* — tag, chip, marche — */
.tag{display:inline-flex;align-items:center;font-size:var(--testo-etichetta-tipo);font-weight:var(--peso-forte);line-height:1.2;padding:2px 6px;border-radius:var(--raggio-etichetta);background:var(--etichetta-tipo-sfondo);color:var(--inchiostro-2)}
.tag-neutral{background:var(--superficie-2);color:var(--inchiostro-2)}
.tag-accent,.tag.ufficiale{background:var(--tinta);color:var(--accento-forte)}
.tag-outline{display:inline-flex;align-items:center;height:var(--chip-notizia-altezza);padding:0 var(--spazio-3);border:0;border-radius:var(--raggio-pillola);background:var(--tinta);color:var(--accento-forte);font-size:var(--testo-piccolo);font-weight:var(--peso-forte);cursor:pointer;text-decoration:none;transition:background-color var(--rapido) var(--curva-rapido)}
.tag-outline:hover{background:var(--tinta-forte);text-decoration:none}
.tag.attenzione{background:var(--superficie-2);color:var(--inchiostro);font-weight:var(--peso-forte)}
/* LE MARCHE ESCONO DALLO SCHERMO — mandato PROVA-GENERALE §1.5: chi risponde e'
   GESTEA360 e basta. Il segno resta nel DOM col suo `data-marca`, perche' le
   misure e chi cura il prodotto lo leggono; a schermo non occupa niente. */
.marca,.r .m,.scheda .r .m{display:none}
.r,.riga-marcata{display:flex;align-items:flex-end;gap:var(--spazio-2);margin:0}
.r>*:first-child,.riga-marcata>*:first-child{flex:1;min-width:0}
.r.piccola,.riga-marcata.piccola{font-size:var(--testo-tabella);line-height:var(--interlinea-corpo);color:var(--inchiostro-2)}
.fatti-motore .titolo-fatti{margin:0 0 var(--spazio-1)}
.fatti-motore .motivazione{margin:0 0 var(--spazio-2)}
.fatti-motore .norme{margin:0;font-size:var(--testo-tabella)}
.parte-del-motore .regole-toccate{margin:var(--spazio-1) 0 0;padding-left:var(--spazio-5)}

/* — le carte e le tabelle in carta (le pagine senza prototipo) — */
.carta{background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:var(--spazio-4) var(--spazio-5)}
.carta.cliccabile{cursor:pointer;text-align:left;font:inherit;color:var(--inchiostro);display:flex;flex-direction:column;gap:2px;text-decoration:none;transition:background-color var(--rapido) var(--curva-rapido),border-color var(--rapido) var(--curva-rapido)}
.carta.cliccabile:hover{background:var(--superficie);border-color:var(--scheda-passaggio-bordo);text-decoration:none}
.carta.stretta{padding:var(--spazio-3) var(--spazio-4)}
.carta.calma{color:var(--inchiostro-2);font-size:var(--testo-tabella)}
.carta .valore{font-weight:var(--peso-forte);font-size:var(--testo-titolo-sezione);line-height:var(--interlinea-titolo-sezione);margin-top:var(--spazio-2);font-variant-numeric:tabular-nums}
.carta .dettaglio{font-size:var(--testo-medio);color:var(--inchiostro-2);line-height:1.45}
.tessera{width:var(--icona-scheda);height:var(--icona-scheda);border-radius:var(--raggio-icona-scheda);background:var(--tinta);color:var(--accento-forte);display:grid;place-items:center;flex:none}
.tessera.piccola{width:var(--icona-scheda-casella);height:var(--icona-scheda-casella)}
.griglia-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spazio-4)}
.griglia-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spazio-4)}
.griglia-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spazio-4)}
.tabella-carta{background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);overflow:hidden;font-size:var(--testo-tabella);line-height:1.45}
.tabella-carta .intestazione,.tabella-carta .riga{display:grid;gap:0 var(--spazio-4);padding:var(--spazio-3) var(--spazio-4);align-items:center}
.tabella-carta .intestazione{padding:10px var(--spazio-4);background:var(--superficie);color:var(--inchiostro-2);font-size:var(--testo-piccolo);font-weight:var(--peso-forte)}
.tabella-carta .riga{border-top:1px solid var(--bordo-tabella);text-decoration:none;color:var(--inchiostro);transition:background-color var(--rapido) var(--curva-rapido)}
.tabella-carta a.riga:hover,.tabella-carta .riga.cliccabile:hover{background:var(--sfondo);cursor:pointer;text-decoration:none}
.tabella-carta .riga>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabella-carta .riga>span>.tag{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block}
.tabella-carta .riga>span.avvolge{white-space:normal}
.tabella-carta .vuota{padding:var(--spazio-5) var(--spazio-4);color:var(--inchiostro-3);margin:0}
.tabella-carta .riga .attenzione,.stato.attenzione{color:var(--inchiostro);font-weight:var(--peso-forte)}

/* — i menu (contestuale e del «+»), il velo, il dialogo — */
.menu{position:absolute;z-index:40;min-width:var(--menu-contestuale);background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);box-shadow:var(--ombra-menu);padding:6px;display:flex;flex-direction:column;transform-origin:top left;animation:menuIn var(--rapido) var(--curva-decelera) both}
.menu button,.menu a,.menu label{display:block;width:100%;height:var(--riga-altezza);padding:0 var(--spazio-3);border:0;background:none;border-radius:var(--raggio-voce);text-align:left;font:inherit;font-size:var(--testo-barra);color:var(--inchiostro);text-decoration:none;white-space:nowrap;cursor:pointer;line-height:var(--riga-altezza);transition:background-color var(--rapido) var(--curva-rapido)}
.menu button:hover,.menu a:hover,.menu label:hover{background:var(--passaggio-riga);text-decoration:none;color:var(--inchiostro)}
.menu hr{border:0;height:1px;background:var(--bordo);margin:6px var(--spazio-1)}
.menu .rosso,.menu button.rosso{color:var(--pericolo)}
.menu .intestazione{padding:var(--spazio-2) var(--spazio-3) var(--spazio-1);font-size:var(--testo-barra);font-weight:var(--peso-forte);height:auto;line-height:1.3}
.menu .sotto{padding:0 var(--spazio-3) var(--spazio-2);font-size:var(--testo-nota);color:var(--inchiostro-3)}
.menu .etichetta-sm{padding:var(--spazio-2) var(--spazio-3) 2px}
.menu form{margin:0}
/* I TRE PUNTINI DEL TITOLO DI UNA PAGINA — mandato PROVA-GENERALE 1.9 e 1.10:
   Aggiorna adesso, Esporta CSV, Stampa stanno qui invece che in tre bottoni
   grandi accanto al titolo. Il menu si colloca sotto il bottone. */
.pagina-testa .con-menu{position:relative;display:inline-flex;flex:none}
.pagina-testa .con-menu .menu{top:calc(var(--scarica-altezza) + 6px);right:0;left:auto;transform-origin:top right}
.btn-icona{width:var(--scarica-altezza);padding:0;flex:none}
.menu .nuovo-qui{display:flex;gap:6px;padding:6px var(--spazio-3);height:auto}
.menu .nuovo-qui input{flex:1;min-width:0;height:var(--menu-rinomina-altezza);padding:0 var(--spazio-2);font-size:var(--testo-barra);background:var(--bianco);border:1px solid var(--accento-chiaro);border-radius:var(--raggio-puntini)}
.menu .nuovo-qui button{width:auto;white-space:nowrap;height:var(--menu-rinomina-altezza);line-height:var(--menu-rinomina-altezza)}
.dialogo-fondo{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:var(--spazio-5);background:var(--velo);animation:dissolvenza var(--breve) var(--curva-rapido) both}
.dialogo{width:min(440px,100%);display:flex;flex-direction:column;gap:var(--spazio-4);padding:var(--spazio-5);border-radius:var(--raggio-menu);background:var(--bianco);border:1px solid var(--bordo);box-shadow:var(--ombra-menu);animation:menuIn var(--rapido) var(--curva-decelera) both}
.dialogo .titolo{font-weight:var(--peso-forte);font-size:var(--testo-titolo-sezione);line-height:var(--interlinea-titolo-sezione)}
.dialogo .corpo{font-size:var(--testo-corpo);line-height:var(--interlinea-corpo)}
.dialogo .azioni{display:flex;justify-content:flex-end;gap:var(--spazio-2);margin-top:var(--spazio-2)}

/* ==========================================================================
   IL GUSCIO — la barra laterale, il centro, il pannello di destra. Tre
   scatole affiancate: la barra è larga 288 (o 64 con la colonna di icone), il
   pannello 0 o 480, il centro prende ciò che resta. La colonna nascosta si
   ricorda per operatore (una classe sul corpo della pagina, messa da un solo gesto).
   ========================================================================== */
body.app{display:flex;height:100%}
#app{display:contents}
body.accesso{display:block}
.barra-laterale{position:relative;flex:none;height:100%;width:var(--barra-aperta);background:var(--superficie);overflow:hidden;transition:width var(--breve) var(--curva-standard)}
body.app.colonna-nascosta .barra-laterale{width:var(--barra-icone)}
/* il contenuto della barra: dissolve in 150 ms mentre la larghezza cambia in 200 */
.colonna{position:absolute;inset:0;width:var(--barra-aperta);display:flex;flex-direction:column;opacity:1;visibility:visible;transition:opacity var(--rapido) var(--curva-rapido),visibility var(--rapido);padding:0px 0px 0px 0px;border-right:0px}
body.app.colonna-nascosta .colonna{opacity:0;visibility:hidden}
/* la colonna di icone: compare quando la barra è nascosta, con 50 ms di ritardo */
.colonna-icone{position:absolute;inset:0;width:var(--barra-icone);display:flex;flex-direction:column;align-items:center;gap:var(--spazio-1);padding:var(--spazio-4) 0 var(--spazio-4);opacity:0;visibility:hidden;transition:opacity var(--rapido) var(--curva-rapido) var(--colonna-icone-ritardo),visibility var(--rapido)}
body.app.colonna-nascosta .colonna-icone{opacity:1;visibility:visible}
/* con la barra nascosta nessun menu della colonna resta a mezz'aria */
body.app.colonna-nascosta .colonna .menu{display:none}
.colonna-icone .spazio{flex:1}
/* le iniziali dell'avatar vengono dal dato: non sono una parola della colonna */
.avatar::before{content:attr(data-iniziali)}
.colonna-icone .avatar{margin-top:auto}
.colonna-icone .operatore-icona{position:relative}
/* il menu dell'avatar si apre verso l'alto, dal basso a sinistra (README, movimento §11) */
/* IL MENU DELL'AVATAR ESCE DALLA COLONNA DI ICONE — [23/09/2026]: la barra laterale taglia ciò che sborda
   (`overflow:hidden`, per l'animazione della larghezza), e a colonna nascosta il menu restava nei suoi 64 px.
   Si colloca sulla finestra, dov'era: sopra l'avatar, dal suo bordo sinistro. */
.colonna-icone .operatore-icona .menu{position:fixed;left:calc((var(--barra-icone) - var(--avatar)) / 2);right:auto;top:auto;bottom:calc(var(--spazio-4) + var(--avatar) + 8px);transform-origin:bottom left}
.avatar{display:grid;place-items:center;width:var(--avatar);height:var(--avatar);border:0;border-radius:var(--raggio-tondo);background:var(--tinta-forte);color:var(--accento-forte);font-size:var(--testo-piccolo);font-weight:var(--peso-forte);cursor:pointer;flex:none;padding:0}

/* — la barra laterale, dentro: la testa, la ricerca, «Nuova chat», le sezioni, il piè — */
.colonna nav{display:flex;flex-direction:column;flex:1;min-height:0}
.colonna .testa-colonna{display:flex;align-items:flex-start;justify-content:space-between;padding:18px var(--barra-padding-contenuto) var(--spazio-2) var(--barra-padding-testa)}
.colonna .marchio-colonna{margin:0;padding:0}
.colonna .marchio-colonna .marchio{display:block;background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:left;font-size:var(--testo-marchio-barra);font-weight:var(--peso-forte);letter-spacing:var(--spaziatura-marchio);line-height:1.2;color:var(--inchiostro);transition:color var(--rapido) var(--curva-rapido)}
.colonna .marchio-colonna .marchio:hover{color:var(--accento-forte)}
.colonna .marchio-colonna small{display:block;font-size:var(--testo-nota);color:var(--inchiostro-3);margin-top:3px}
.colonna .nascondi-colonna{display:grid;place-items:center;width:var(--bottone-icona);height:var(--bottone-icona);border:0;border-radius:var(--raggio-riga);background:transparent;color:var(--inchiostro-2);padding:0;margin:0;cursor:pointer;flex:none;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido)}
.colonna .nascondi-colonna:hover{background:var(--passaggio-bottone);color:var(--inchiostro)}
/* LO SFONDO CON L'OCCHIO — [23/09/2026]: in testa alla colonna sta accanto a «Nascondi barra
   laterale», spinto a destra col suo margine; dei due occhi si vede quello che il tema accende. */
.colonna .testa-colonna .scegli-sfondo{margin-left:auto}
.scegli-sfondo .occhio-aperto{display:var(--occhio-aperto)}
.scegli-sfondo .occhio-chiuso{display:var(--occhio-chiuso)}
.colonna .filtro{position:relative;margin:var(--spazio-2) var(--barra-padding-contenuto) var(--spazio-1)}
.colonna .filtro .lente{position:absolute;left:var(--spazio-3);top:0;height:var(--ricerca-altezza);display:grid;place-items:center;color:var(--inchiostro-2);pointer-events:none}
.colonna .filtro input{width:100%;height:var(--ricerca-altezza);padding:0 var(--spazio-3) 0 var(--spazio-9);border:0;border-radius:var(--raggio-campo);background:var(--superficie-2);color:var(--inchiostro);font-size:var(--testo-barra);transition:background-color var(--rapido) var(--curva-rapido)}
.colonna .filtro input:hover{background:var(--etichetta-tipo-sfondo)}
.colonna .filtro input:focus{box-shadow:none}
.colonna .filtro .risultati{left:0;right:0;top:calc(var(--ricerca-altezza) + var(--spazio-1))}
.colonna .filtro .risultati a{display:flex;align-items:center;justify-content:space-between;gap:var(--spazio-3);width:100%}
.colonna .filtro .risultati .specie{font-size:var(--testo-nota);color:var(--inchiostro-3)}
.colonna .filtro .risultati .niente{padding:var(--spazio-2) var(--spazio-3);font-size:var(--testo-barra);color:var(--inchiostro-2)}
.colonna .nuovo{margin:6px var(--barra-padding-contenuto) 10px}
.colonna .nuovo .btn{display:inline-flex;align-items:center;gap:var(--spazio-2);height:var(--nuova-chat-altezza);padding:0 var(--spazio-4) 0 var(--spazio-3);border:0;border-radius:var(--raggio-pillola);background:var(--tinta);color:var(--accento-forte);font-size:var(--testo-barra);font-weight:var(--peso-forte);transition:background-color var(--rapido) var(--curva-rapido)}
.colonna .nuovo .btn:hover{background:var(--tinta-forte)}
.colonna .scorre{flex:1;min-height:0;overflow-y:auto;padding:4px 8px 8px 8px}
.colonna ul,.colonna ol{list-style:none;margin:0;padding:0}
/* LE SEZIONI: l'intestazione alta 32 col › che ruota, l'etichetta maiuscola */
.colonna .sez{position:relative;margin:0 0 var(--spazio-1)}
.colonna .sez+.sez{margin-top:var(--spazio-tra-sezioni)}
.colonna details.voce-sezione>summary{list-style:none;cursor:pointer;user-select:none;display:flex;align-items:center;gap:var(--spazio-1);height:var(--intestazione-sezione-altezza);padding:0 var(--spazio-2) 0 6px;border-radius:var(--raggio-riga);color:var(--inchiostro-2);font-size:var(--testo-etichetta-sezione);font-weight:var(--peso-forte);letter-spacing:var(--spaziatura-etichetta);text-transform:uppercase;transition:background-color var(--rapido) var(--curva-rapido)}
.colonna details.voce-sezione>summary::-webkit-details-marker{display:none}
.colonna details.voce-sezione>summary:hover{background:var(--passaggio-riga)}
/* IL SEGNO «›»: 16 px, ruota di 90° in 150 ms; una dichiarazione, due agganci (le sezioni e il piè) */
.colonna details.voce-sezione>summary.chevron::before,.colonna footer.operatore summary.chevron::before{content:"\203A";display:inline-block;width:16px;flex:none;text-align:center;font-size:var(--testo-titolo-sezione);line-height:1;color:var(--inchiostro-2);transition:transform var(--rapido) var(--curva-standard)}
.colonna details.voce-sezione[open]>summary.chevron::before,.colonna footer.operatore details[open]>summary.chevron::before{transform:rotate(90deg)}
.colonna .sez>details>p.niente,.colonna .sez p.niente{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:2px 0 var(--spazio-2) var(--spazio-3);padding:0 var(--spazio-2)}
.colonna .sez>details.azioni{position:absolute;right:2px;top:2px}
/* LE RIGHE: alte 36, raggio 10, l'etichetta del tipo, il titolo con l'ellissi, i puntini che compaiono */
.colonna .recenti-colonna>li,.colonna .sotto-cliente>li{position:relative;display:flex;align-items:center;gap:var(--spazio-2);height:var(--riga-altezza);padding:0px 4px 0px 10px;border-radius:var(--raggio-riga);cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido);animation:righeIn var(--rapido) var(--curva-rapido) both}
.colonna .recenti-colonna>li:hover,.colonna .sotto-cliente>li:hover{background:var(--passaggio-riga)}
/* LO SCALINO DELLE RIGHE — README, movimento §10: 20 ms per riga, fino all'ottava */
.colonna .recenti-colonna>li:nth-child(2),.colonna .sotto-cliente>li:nth-child(2){animation-delay:calc(var(--scalino-righe) * 1)}
.colonna .recenti-colonna>li:nth-child(3),.colonna .sotto-cliente>li:nth-child(3){animation-delay:calc(var(--scalino-righe) * 2)}
.colonna .recenti-colonna>li:nth-child(4),.colonna .sotto-cliente>li:nth-child(4){animation-delay:calc(var(--scalino-righe) * 3)}
.colonna .recenti-colonna>li:nth-child(5),.colonna .sotto-cliente>li:nth-child(5){animation-delay:calc(var(--scalino-righe) * 4)}
.colonna .recenti-colonna>li:nth-child(6),.colonna .sotto-cliente>li:nth-child(6){animation-delay:calc(var(--scalino-righe) * 5)}
.colonna .recenti-colonna>li:nth-child(7),.colonna .sotto-cliente>li:nth-child(7){animation-delay:calc(var(--scalino-righe) * 6)}
.colonna .recenti-colonna>li:nth-child(8),.colonna .sotto-cliente>li:nth-child(8){animation-delay:calc(var(--scalino-righe) * 7)}
.colonna .studio>li:nth-child(2)>a{animation-delay:calc(var(--scalino-righe) * 1)}
.colonna .studio>li:nth-child(3)>a{animation-delay:calc(var(--scalino-righe) * 2)}
.colonna .studio>li:nth-child(4)>a{animation-delay:calc(var(--scalino-righe) * 3)}
.colonna li.conversazione{position:relative;display:flex;align-items:center;border-radius:var(--raggio-riga)}
.colonna li.conversazione.corrente{background:var(--tinta)}
.colonna li.conversazione>a{flex:1;min-width:0;padding:0px 0px 0px 0px;font-size:var(--testo-barra);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--inchiostro);text-decoration:none;cursor:pointer}
.colonna li.conversazione>a,.colonna li.attivita-fatta>a,.colonna li.attivita-fatta>.titolo,.colonna li.fissa>a{flex:1;min-width:0;font-size:var(--testo-barra);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--inchiostro);text-decoration:none}
.colonna li.attivita-fatta .tag{flex:none}
.colonna li[draggable=true]{cursor:grab}
.colonna details.azioni{position:relative;flex:none}
.colonna details.azioni>summary{list-style:none;width:28px;height:28px;margin-right:0px;border-radius:var(--raggio-puntini);cursor:pointer;color:var(--inchiostro-2);display:grid;place-items:center;opacity:0;transition:opacity var(--rapido) var(--curva-rapido),background-color var(--rapido) var(--curva-rapido)}
.colonna details.azioni>summary::-webkit-details-marker{display:none}
.colonna li:hover>details.azioni>summary,.colonna details.azioni[open]>summary,.colonna .sez>details.azioni>summary,.colonna li.cliente>details.azioni>summary{opacity:1}
.colonna details.azioni>summary:hover{background:var(--passaggio-puntini);color:var(--inchiostro)}
/* IL MENU DI RIGA SI APRE FUORI DALLA COLONNA — `[09/09/2026]`, mandato REPORT §0.3, dallo schermo del committente: stava dentro la colonna che scorre e copriva le righe. È fisso rispetto alla finestra: il client lo mette accanto alla riga, a destra del bordo della colonna, sopra il centro e tutto dentro la finestra (`posizionaIlMenuDiRiga`); l'origine è in alto a sinistra, e in basso a sinistra quando per stare intero si apre verso l'alto */
.colonna details.azioni>.voci{position:fixed;z-index:40;min-width:var(--menu-contestuale);padding:6px;background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);box-shadow:var(--ombra-menu);display:flex;flex-direction:column;transform-origin:top left;animation:menuIn var(--rapido) var(--curva-decelera) both}
.colonna details.azioni>.voci[data-verso="alto"]{transform-origin:bottom left}
.colonna details.azioni .voci form{margin:0}
.colonna details.azioni .voci button,.colonna details.azioni .voci a{display:block;width:100%;height:var(--riga-altezza);line-height:var(--riga-altezza);padding:0 var(--spazio-3);border:0;background:none;border-radius:var(--raggio-voce);text-align:left;font:inherit;font-size:var(--testo-barra);color:var(--inchiostro);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido)}
.colonna details.azioni .voci button:hover,.colonna details.azioni .voci a:hover{background:var(--passaggio-riga)}
.colonna .voci button.rosso{color:var(--pericolo)}
.colonna .voci hr{border:0;height:1px;background:var(--bordo);margin:6px var(--spazio-1)}
.colonna details.sposta>summary{list-style:none;cursor:pointer;display:block;height:var(--riga-altezza);line-height:var(--riga-altezza);padding:0 var(--spazio-3);border-radius:var(--raggio-voce);font-size:var(--testo-barra);color:var(--inchiostro)}
.colonna details.sposta>summary::-webkit-details-marker{display:none}
.colonna details.sposta>summary:hover{background:var(--passaggio-riga)}
.colonna details.sposta form{display:flex;flex-direction:column;padding-left:var(--spazio-3)}
/* «RINOMINA ›» — [12/09/2026], mandato RIFINITURA §1.2: la voce porta il segno di ciò che si apre; il campo nasce al clic, al posto della voce, col nome dentro */
.colonna details.azioni .voci .voce.apre .segno,.colonna details.sposta>summary .segno{float:right;color:var(--inchiostro-3)}
.colonna .nuovo-qui{display:flex;gap:6px;padding:4px var(--spazio-3)}
.colonna .nuovo-qui input{flex:1;min-width:0;height:var(--menu-rinomina-altezza);padding:0 var(--spazio-2);font-size:var(--testo-barra);background:var(--bianco);border:1px solid var(--accento-chiaro);border-radius:var(--raggio-puntini);font-family:inherit}
.colonna .nuovo-qui button{width:auto;white-space:nowrap;height:var(--menu-rinomina-altezza);line-height:var(--menu-rinomina-altezza)}
/* I CLIENTI: › + codice · nome in 600, i puntini sempre visibili; sotto, solo ciò che ci si trascina, rientrato di 22 */
.colonna .clienti{margin-top:2px}
.colonna .clienti>li{position:relative;margin:0 0 1px}
.colonna .clienti>li>details>summary{text-transform:none;letter-spacing:0;font-size:var(--testo-barra);font-weight:var(--peso-normale);color:var(--inchiostro);padding:0px 34px 0px 6px;height:var(--riga-altezza);gap:6px}
.colonna .clienti>li>.riga-cliente{display:flex;align-items:center;gap:6px;flex:1;min-width:0;height:var(--riga-altezza);font-size:var(--testo-barra);color:var(--inchiostro);padding:0 34px 0 28px;border-radius:var(--raggio-riga);cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido)}
.colonna .clienti>li>.riga-cliente:hover{background:var(--passaggio-riga)}
.colonna .clienti .riga-cliente>a,.colonna .clienti summary>a{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--inchiostro);text-decoration:none;font-weight:var(--peso-forte)}
.colonna .clienti .codice{flex:none;font-size:var(--testo-piccolo);font-weight:var(--peso-normale);color:var(--inchiostro-3);font-variant-numeric:tabular-nums}
.colonna .clienti .codice::after{content:" ·";color:var(--inchiostro-3)}
.colonna .clienti .assegnato{flex:0 1 auto;max-width:38%;font-size:var(--testo-nota);color:var(--inchiostro-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:var(--peso-normale)}
.colonna .clienti .assegnato.riservato{color:var(--accento-forte)}
.colonna li.cliente>details.azioni{position:absolute;right:2px;top:4px}
.colonna li.cliente>details.azioni>summary{color:var(--inchiostro-3)}
.colonna li.cliente.sopra>details>summary,.colonna li.cliente.sopra>.riga-cliente{background:var(--tinta-forte)}
.colonna .sotto-cliente{margin-left:var(--rientro-sotto-cliente);margin-top:1px}
.colonna .sez .nota.archiviati{margin:2px var(--spazio-2) 0;font-size:var(--testo-nota)}
.colonna .sez .nota.archiviati a{color:var(--inchiostro-2)}
.colonna .sez .nota{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:var(--spazio-1) var(--spazio-2) 0}
/* LO STUDIO: Notizie · Fonti · Guida con l'icona da 18, la voce attiva in tinta */
.colonna .studio>li>a{display:flex;align-items:center;gap:10px;height:var(--riga-altezza);padding:0 10px;font-size:var(--testo-barra);color:var(--inchiostro);text-decoration:none;border-radius:var(--raggio-riga);transition:background-color var(--rapido) var(--curva-rapido);animation:righeIn var(--rapido) var(--curva-rapido) both}
.colonna .studio>li>a:hover{background:var(--passaggio-riga)}
.colonna .studio>li>a.attiva{background:var(--tinta)}
.colonna .studio>li>a svg{color:var(--inchiostro-2);flex:none}
/* IL NUMERO DELLE NOTIZIE NUOVE CHE TOCCANO UN CLIENTE — mandato GIRO §5.3: in
   fondo alla voce, in Tinta, con le cifre tabulari. Zero non si mostra. */
.colonna .studio>li>a .conta-nuove{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--raggio-pillola);background:var(--tinta-forte);color:var(--accento-forte);font-size:var(--testo-nota);font-weight:var(--peso-forte);font-variant-numeric:tabular-nums;flex:none}
/* IL PIÈ: l'avatar, il nome in 600, «ruolo · N clienti», e il menu */
.colonna footer.operatore{flex:none;border-top:1px solid var(--bordo);padding:0}
.colonna footer.operatore details>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:var(--spazio-3) var(--spazio-4) 14px;text-transform:none;letter-spacing:0;transition:background-color var(--rapido) var(--curva-rapido);flex-wrap:wrap}
.colonna footer.operatore details>summary::-webkit-details-marker{display:none}
.colonna footer.operatore details>summary:hover{background:var(--passaggio-riga)}
.colonna footer.operatore .nome{font-size:var(--testo-barra);font-weight:var(--peso-forte);line-height:1.3;color:var(--inchiostro);flex:1 1 calc(100% - 70px);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.colonna footer.operatore .ruolo,.colonna footer.operatore .conta{font-size:var(--testo-nota);color:var(--inchiostro-3);font-weight:var(--peso-normale);margin-top:-8px}
.colonna footer.operatore .ruolo{margin-left:calc(var(--avatar) + 10px)}
.colonna footer.operatore .conta{margin-left:-6px}
.colonna footer.operatore .ruolo::after{content:" ·"}
.colonna footer.operatore form{margin:6px var(--spazio-3);display:flex;flex-direction:column;gap:var(--spazio-1)}
.colonna footer.operatore form button{text-align:left;font:inherit;font-size:var(--testo-medio);height:var(--riga-altezza);padding:0 var(--spazio-2);border:1px solid var(--bordo);background:var(--bianco);border-radius:var(--raggio-riga);cursor:pointer;color:var(--inchiostro)}
/* LE VOCI DELLO STUDIO NEL MENU DEL PIÈ — righe del menu, una per riga (visto dalla prova dal vivo, 08/09) */
.colonna footer.operatore .voci-operatore{padding:4px var(--spazio-3) var(--spazio-2)}
.colonna footer.operatore .voci-operatore a{display:block;padding:7px var(--spazio-2);border-radius:var(--raggio-riga);color:var(--inchiostro);text-decoration:none;font-size:var(--testo-barra);transition:background-color var(--rapido) var(--curva-rapido)}
.colonna footer.operatore .voci-operatore a:hover{background:var(--passaggio-riga)}
.colonna footer.operatore .voci-operatore hr{border:0;border-top:1px solid var(--bordo);margin:6px 0}
.colonna footer.operatore form button:hover{background:var(--passaggio-riga)}
/* «IL MIO PROFILO» COME «ESCI» — [23/09/2026]: la voce personale sta nel modulo di «Esci» e ne ripete
   il bottone, riga per riga; nel menu dell'avatar le basta la regola di `.menu a`, la stessa di «Esci». */
.colonna footer.operatore form a.voce-personale{display:flex;align-items:center;box-sizing:border-box;height:var(--riga-altezza);padding:0 var(--spazio-2);border:1px solid var(--bordo);background:var(--bianco);border-radius:var(--raggio-riga);font-size:var(--testo-medio);color:var(--inchiostro);text-decoration:none}
.colonna footer.operatore form a.voce-personale:hover{background:var(--passaggio-riga)}
/* nel blocco dell'accesso «Esci» è largo quanto la sua parola: la voce personale anche, e i due stanno sulla stessa riga */
.colonna footer.operatore .accesso form[action="/esci"]{flex-direction:row;flex-wrap:wrap}
.colonna footer.operatore .niente{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:var(--spazio-1) var(--spazio-4) var(--spazio-2)}
.colonna .accesso{font-size:var(--testo-nota);color:var(--inchiostro-2);margin:6px var(--spazio-4) var(--spazio-3);line-height:1.45}
.colonna .accesso form{margin:6px 0 0;display:flex;flex-direction:column;gap:6px}
.colonna .accesso input,.colonna .accesso select{height:var(--scarica-altezza);padding:0 var(--spazio-2);font-size:var(--testo-medio);background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-puntini);font-family:inherit;width:100%}
.colonna .accesso button{align-self:flex-start;font-size:var(--testo-medio);height:var(--scarica-altezza);padding:0 var(--spazio-3);border:1px solid var(--bordo);border-radius:var(--raggio-pillola);background:var(--bianco)}

/* ==========================================================================
   IL CENTRO — il bagliore, la conversazione che scorre sopra la casella, il
   saluto e la casella che partono al centro e scendono in fondo al primo
   invio; oppure una pagina.
   ========================================================================== */
.centro{position:relative;flex:1;min-width:0;height:100%;overflow:hidden;background:var(--sfondo);display:flex;flex-direction:column}
.bagliore{position:absolute;left:50%;top:50%;width:var(--bagliore-larghezza);height:var(--bagliore-altezza);transform:translate(-50%,-48%);pointer-events:none;opacity:0;transition:opacity var(--bagliore-dissolvenza) var(--curva-rapido)}
.centro[data-schermo="chat"].nuova .bagliore,body.accesso .bagliore{opacity:1}
.bagliore>div{width:100%;height:100%;border-radius:var(--raggio-tondo);background:var(--bagliore);animation:respiro var(--bagliore-durata) var(--curva-respiro) infinite alternate}
/* la conversazione: il filo scorre sopra la casella con un margine pari alla sua altezza */
.filo{position:absolute;inset:0;overflow-y:auto;padding:var(--centro-padding-sopra) var(--centro-padding-lati) var(--altezza-casella)}
.centro.nuova .filo{display:none}
.filo .dentro{max-width:var(--colonna-messaggi);width:100%;margin:0 auto;display:flex;flex-direction:column;gap:var(--spazio-tra-messaggi)}
.filo .dentro.larga{max-width:none}
/* la casella e il saluto: ancorati in fondo; nella chat nuova la scatola sale al 55% dell'altezza */
.casella-ancora{position:absolute;left:0;right:0;bottom:0;padding:0 var(--centro-padding-lati);display:flex;justify-content:center;transform:translateY(calc(-45vh + 50%));pointer-events:none;z-index:2}
.casella-ancora .comporre{position:relative;width:100%;max-width:var(--casella-conversazione);transform:translateY(calc(45vh - 50%));transition:transform var(--casella-durata) var(--curva-decelera),max-width var(--casella-durata) var(--curva-decelera);pointer-events:auto;padding:0 0 var(--casella-dal-bordo)}
.centro.nuova .casella-ancora .comporre{max-width:var(--casella-nuova);transform:translateY(0)}
/* IL SALUTO: sopra la casella di 40, entra dal basso in 300 ms, si dissolve al primo invio */
.saluto{position:absolute;left:0;right:0;bottom:calc(100% + var(--saluto-sopra-casella));margin:0;text-align:center;pointer-events:none;opacity:1;font-size:var(--testo-saluto);font-weight:var(--peso-leggero);letter-spacing:var(--spaziatura-saluto);line-height:var(--interlinea-saluto);color:var(--inchiostro);transition:opacity var(--saluto-durata) var(--curva-rapido);animation:salutoIn var(--saluto-durata) var(--curva-decelera) backwards}
.saluto.dissolto{opacity:0}
.saluto .q{display:block;margin:var(--spazio-3) 0 0;font-size:var(--testo-sotto-saluto);font-weight:var(--peso-leggero);letter-spacing:0;color:var(--inchiostro-2);line-height:var(--interlinea-corpo)}
/* LA CASELLA A PILLOLA: raggio 28, bianca, bordo, ombra. AL FUOCO NON CAMBIA — `[09/09/2026]`, mandato REPORT §0.4, dallo schermo del committente: stesso bordo, stessa ombra, nessun colore in più; cambia solo il cursore (differenza voluta dal README, dichiarata in DIFFERENZE.md) */
.comporre .dentro{display:flex;flex-direction:column;border-radius:var(--raggio-casella);background:var(--bianco);border:1px solid var(--bordo);box-shadow:var(--ombra-casella);max-width:none;margin:0;padding:0;position:relative}
.comporre .dentro.sopra{border-color:var(--accento);background:var(--tinta)}
/* l'area sopra il campo: i chip del modo e del cliente, le schede dei file allegati */
.comporre .sopra-campo{display:flex;flex-wrap:wrap;align-items:center;gap:var(--spazio-2);padding:var(--spazio-3) var(--spazio-3) 0 14px}
.comporre .sopra-campo:empty{display:none}
.pillola{display:inline-flex;align-items:center;gap:var(--spazio-1);height:var(--chip-altezza);padding:0 var(--spazio-1) 0 10px;border-radius:var(--raggio-pillola);background:var(--superficie-2);border:0;font:inherit;font-size:var(--testo-piccolo);font-weight:var(--peso-forte);color:var(--inchiostro);white-space:nowrap;max-width:100%}
.pillola.modo{background:var(--tinta);color:var(--accento-forte)}
.pillola span{overflow:hidden;text-overflow:ellipsis}
.pillola button{display:grid;place-items:center;width:22px;height:22px;border:0;border-radius:var(--raggio-tondo);background:transparent;color:inherit;padding:0;cursor:pointer;flex:none;transition:background-color var(--rapido) var(--curva-rapido)}
.pillola button:hover{background:var(--passaggio-puntini)}
/* IL CLIENTE TAGGATO — [24/09/2026, sera], §99.27 dello stato: la pastiglia «@ Nome» sopra il campo, col colore del modo;
   e il menu dei clienti che la «@» apre sopra la casella, con la forma del menu del «+» (che dal §99.25 non c'è più, e
   le cui regole sono uscite dal foglio): verso l'alto, almeno 260, raggio 16, voci alte 40. */
.comporre .posto-del-cliente:empty{display:none}
.pillola.cliente{background:var(--tinta);color:var(--accento-forte);font-weight:var(--peso-forte);max-width:100%}
.pillola.cliente .chiocciola{font-weight:var(--peso-normale);margin-right:2px}
.comporre .menu.menzioni{left:0;right:auto;bottom:calc(100% + 10px);top:auto;min-width:var(--menu-piu);max-width:100%;border-radius:var(--raggio-menu-piu);gap:2px;transform-origin:bottom left}
.comporre .menu.menzioni button.voce{display:flex;align-items:center;justify-content:space-between;gap:var(--spazio-3);width:100%;height:var(--nuova-chat-altezza);line-height:1.2;padding:0 var(--spazio-3);border:0;background:none;border-radius:var(--raggio-riga);cursor:pointer;font:inherit;font-size:var(--testo-barra);color:var(--inchiostro);text-align:left;transition:background-color var(--rapido) var(--curva-rapido)}
.comporre .menu.menzioni button.voce b{font-weight:var(--peso-normale);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.comporre .menu.menzioni button.voce:hover,.comporre .menu.menzioni button.voce.attiva{background:var(--passaggio-riga)}
.comporre .menu.menzioni .nota{flex:none;color:var(--inchiostro-3);font-size:var(--testo-nota)}
.comporre .menu.menzioni .niente{padding:var(--spazio-2) var(--spazio-3);color:var(--inchiostro-3);font-size:var(--testo-barra)}
/* LA SCHEDA FILE NELLA CASELLA: raggio 12, icona 28, il nome, il tipo · la dimensione, la × */
.scheda-file{display:flex;align-items:center;gap:10px;padding:var(--spazio-2) 14px var(--spazio-2) 10px;border:1px solid var(--bordo);border-radius:var(--raggio-menu);background:var(--bianco);text-align:left;max-width:var(--scheda-file);color:var(--inchiostro);text-decoration:none;cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido),border-color var(--rapido) var(--curva-rapido);animation:schedaIn var(--breve) var(--curva-decelera) both;font:inherit}
.scheda-file:hover{background:var(--superficie);border-color:var(--scheda-passaggio-bordo);text-decoration:none;color:var(--inchiostro)}
.scheda-file .icona{flex:none;display:grid;place-items:center;width:var(--icona-scheda);height:var(--icona-scheda);border-radius:var(--raggio-icona-scheda);background:var(--tinta);color:var(--accento-forte)}
.scheda-file .testi{min-width:0;display:flex;flex-direction:column;gap:1px}
.scheda-file .nome{font-size:var(--testo-scheda-nome);font-weight:var(--peso-forte);color:var(--inchiostro);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scheda-file .tipo{font-size:var(--testo-scheda-tipo);color:var(--inchiostro-3);font-weight:var(--peso-normale)}
.comporre .scheda-file{padding:6px 6px 6px 8px;border-radius:var(--raggio-campo);cursor:default;animation:schedaIn var(--breve) var(--curva-decelera) both}
.comporre .scheda-file .icona{width:var(--icona-scheda-casella);height:var(--icona-scheda-casella);border-radius:var(--raggio-puntini)}
.comporre .scheda-file .nome{font-size:var(--testo-piccolo)}
.comporre .scheda-file .togli{flex:none;display:grid;place-items:center;width:24px;height:24px;border:0;border-radius:var(--raggio-tondo);background:transparent;color:var(--inchiostro-3);padding:0;cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido)}
.comporre .scheda-file .togli:hover{background:var(--passaggio-puntini);color:var(--inchiostro)}
.comporre .pillole-allegati{display:contents}
/* la riga del campo: «+» a sinistra, il testo che cresce fino a 200, il microfono e l'invio a destra */
.comporre .riga-campo{display:flex;align-items:flex-end;gap:var(--spazio-1);padding:var(--casella-padding);min-height:var(--casella-altezza-minima)}
.comporre textarea{flex:1;min-width:0;display:block;width:100%;resize:none;border:0;outline:none;background:transparent;padding:9px 6px;font-size:var(--testo-casella);line-height:var(--interlinea-casella);max-height:200px;color:var(--inchiostro);min-height:var(--casella-bottone)}
.comporre textarea:disabled{color:var(--inchiostro-2)}
.comporre .strumenti{display:contents}
.comporre .strumenti>.con-menu{position:relative;display:inline-flex;flex:none}
.comporre .piu,.comporre .microfono,.comporre .invia{flex:none;display:grid;place-items:center;width:var(--casella-bottone);height:var(--casella-bottone);border:0;border-radius:var(--raggio-tondo);background:transparent;color:var(--inchiostro-2);padding:0;cursor:pointer;position:relative;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido)}
.comporre .piu:hover,.comporre .microfono:hover{background:var(--passaggio-bottone);color:var(--inchiostro)}
/* IL MICROFONO IN REGISTRAZIONE: fondo tinta, icona accento, l'anello che pulsa */
.comporre .microfono.accesa{background:var(--tinta);color:var(--accento)}
.comporre .microfono .anello{position:absolute;inset:0;border-radius:var(--raggio-tondo);border:1.5px solid var(--accento-chiaro);animation:pulsaMic var(--microfono-durata) var(--curva-rapido) infinite;display:none}
.comporre .microfono.accesa .anello{display:block}
/* L'INVIO: spento (trasparente, inchiostro 3) → acceso (accento, bianco) appena c'è testo o un allegato */
.comporre .invia{color:var(--inchiostro-3);cursor:default}
.comporre .invia.acceso{background:var(--accento);color:var(--bianco);cursor:pointer}
.comporre .invia.acceso:hover{background:var(--accento-forte)}
.comporre .invia:disabled{opacity:.45;cursor:not-allowed}
/* IL MENU DEL «+»: verso l'alto dal bottone, raggio 16, min 260, quattro voci con l'icona da 20 */
.comporre input[type=file]{display:none}
/* la nota sotto la casella: 12 (12,5) inchiostro 3, a 10 dalla casella, centrata */
.comporre .sotto{margin:var(--casella-nota-distanza) 0 0;text-align:center;font-size:var(--testo-nota);color:var(--inchiostro-3);max-width:none}
.comporre .sotto a{color:var(--inchiostro-2)}
/* E QUANDO QUALCOSA MANCA, LA STESSA RIGA LO DICE — `[10/09/2026]`, mandato §2:
   la cosa da fare (il permesso del microfono, il servizio che non si raggiunge,
   il browser che non lo porta) sta dove si guarda, sotto la casella, e non in
   una finestra. Il rosso è solo testo, come il README vuole. */
.comporre .sotto.dettando{color:var(--accento-forte)}
.comporre .sotto.dettando.errore{color:var(--pericolo)}
.chat-nuova .sotto{margin:var(--casella-nota-distanza) 0 0;text-align:center;font-size:var(--testo-nota);color:var(--inchiostro-3)}
.centro.trascinando::after{content:"Lascia qui i file: li leggo e li allego alla domanda";position:absolute;inset:var(--spazio-3);z-index:25;display:grid;place-items:center;border:1px dashed var(--accento);border-radius:var(--raggio-zona);background:var(--tinta);font-size:var(--testo-corpo);color:var(--inchiostro);pointer-events:none}

/* — la conversazione: la testata, i turni, la domanda a destra, la risposta a sinistra — */
.turno{display:flex;flex-direction:column;gap:var(--spazio-tra-blocchi);font-size:var(--testo-risposta);line-height:var(--interlinea-risposta);animation:msgIn var(--breve) var(--curva-decelera) both}
/* IL MESSAGGIO DELL'OPERATORE: a destra, bolla superficie 2, raggio 22, padding 12/18, 15/1,55, max 72% */
.turno .chiesto{align-self:flex-end;max-width:var(--bolla);background:var(--superficie-2);border-radius:var(--raggio-bolla);padding:var(--spazio-3) 18px;font-size:var(--testo-operatore);line-height:var(--interlinea-operatore);margin:0 0 var(--spazio-4);white-space:pre-wrap;text-wrap:pretty;color:var(--inchiostro)}
.turno .chiesto .allegati-chiesti{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--spazio-2);margin:0 0 var(--spazio-2);font-size:var(--testo-piccolo)}
.chip-file{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:var(--raggio-pillola);background:var(--bianco);border:1px solid var(--bordo);color:var(--inchiostro-2);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
/* LA RISPOSTA: senza bolla, max 820, i blocchi a 14, le marche a fine riga */
.turno .detto{display:flex;flex-direction:column;gap:var(--spazio-tra-blocchi);max-width:var(--risposta);color:var(--inchiostro)}
.turno .intestazione-risposta{display:none}
.turno .momento{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:0}
.turno.evidenziato{border-left:2px solid var(--accento);padding-left:14px}
.turno.chiuso .blocco-chiuso{font-size:var(--testo-tabella);color:var(--inchiostro-2);margin:0}
.turno .azioni-risposta{display:flex;align-items:center;gap:14px;font-size:var(--testo-nota);color:var(--inchiostro-3);flex-wrap:wrap}
.turno .azioni-risposta button,.turno .azioni-risposta a{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:5px;text-decoration:none;transition:color var(--rapido) var(--curva-rapido)}
.turno .azioni-risposta button:hover,.turno .azioni-risposta a:hover{color:var(--accento-forte)}
.turno .azioni-risposta form{margin:0}
/* «SEGNALA» APRE IL CAMPO — `[14/09/2026]`, la Guida del 14 (STATO.md §74): il modulo non ha una scatola sua, così la bandierina sta nella riga dei gesti e la riga della nota — quando il clic la apre — va a capo per intera, col campo e il bottone che manda */
.turno .azioni-risposta form.segnala{display:contents}
.turno .azioni-risposta .nota-della-segnalazione{flex-basis:100%;display:flex;align-items:center;gap:var(--spazio-2);margin:0}
.turno .azioni-risposta .nota-della-segnalazione input{flex:1 1 auto;min-width:0;max-width:var(--risposta);height:var(--menu-rinomina-altezza);padding:0 var(--spazio-2);font:inherit;font-size:var(--testo-barra);color:var(--inchiostro);background:var(--bianco);border:1px solid var(--accento-chiaro);border-radius:var(--raggio-puntini)}
.turno .azioni-risposta .nota-della-segnalazione button{white-space:nowrap}
.origine{font-size:var(--testo-tabella);line-height:var(--interlinea-corpo);color:var(--inchiostro-2)}
.origine a,.origine button{color:var(--accento)}
.riscritto{display:flex;flex-direction:column;gap:var(--spazio-2)}
.riscritto .prosa{margin:0;white-space:normal;text-wrap:pretty}
.riscritto .prosa p{margin:0 0 var(--spazio-3)}
.riscritto .prosa p:last-child{margin-bottom:0}
.riscritto .prosa ul,.riscritto .prosa ol{margin:0 0 var(--spazio-3);padding-left:var(--spazio-6);display:flex;flex-direction:column;gap:6px}
.riscritto .prosa h1,.riscritto .prosa h2,.riscritto .prosa h3,.riscritto .prosa h4{font-size:var(--testo-risposta);font-weight:var(--peso-forte);margin:var(--spazio-2) 0 var(--spazio-1)}
.riscritto .prosa code{font-family:inherit;background:var(--superficie-2);padding:0 var(--spazio-1);border-radius:var(--raggio-etichetta)}
.riscritto .prosa pre{background:var(--superficie-2);padding:var(--spazio-2) var(--spazio-3);border-radius:var(--raggio-riga);white-space:pre-wrap;font-size:var(--testo-tabella)}
.riscritto .prosa blockquote{margin:0 0 var(--spazio-3);padding-left:var(--spazio-3);border-left:2px solid var(--bordo)}
.riscritto .prosa a{color:var(--accento)}
.riscritto .chi{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:0}
.riscritto .ragionamento{font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.riscritto.scartata .prosa,.riscritto.ripiego .prosa{color:var(--inchiostro-2)}
.collegamenti{font-size:var(--testo-tabella);line-height:var(--interlinea-corpo);color:var(--inchiostro-2);margin:0}
.collegamenti ul{margin:var(--spazio-1) 0 0;padding-left:0;list-style:none}
.collegamenti li{margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.collegamenti .dominio{color:var(--inchiostro-3);font-size:var(--testo-nota)}
/* LE TABELLE NELLA RISPOSTA (il prospetto): raggio 14, bordo, intestazione superficie 12,5/600, cifre tabellari a destra, l'ultima colonna in 600 */
.turno table,.riscritto .prosa table{border-collapse:separate;border-spacing:0;font-size:var(--testo-tabella);font-variant-numeric:tabular-nums;margin:0 0 var(--spazio-3);width:auto;max-width:var(--tabella-risposta);border:1px solid var(--bordo);border-radius:var(--raggio-menu);overflow:hidden}
.turno th,.riscritto .prosa th{text-align:left;font-size:var(--testo-piccolo);font-weight:var(--peso-forte);color:var(--inchiostro-2);background:var(--superficie);padding:10px 14px;text-transform:none;letter-spacing:0}
.turno td,.riscritto .prosa td{padding:10px 14px;border-top:1px solid var(--bordo-tabella);vertical-align:top}
.turno th.num,.turno td.num,.turno .num,.turno .importo,.turno td.n,.riscritto .prosa td.num{text-align:right;font-variant-numeric:tabular-nums}
.turno td:last-child{font-weight:var(--peso-forte)}
.turno table.righe-lette td:last-child,.turno table.righe-lette td{font-weight:var(--peso-normale)}
.turno .prospetto table.conti-del-prospetto{max-width:var(--tabella-risposta)}
.turno .prospetto table.conti-del-prospetto tr.totale td{font-weight:var(--peso-forte)}
.turno .prospetto table.conti-del-prospetto tr.divario td{color:var(--inchiostro-2)}
.turno ul,.turno ol{margin:0 0 var(--spazio-3);padding-left:var(--spazio-6);display:flex;flex-direction:column;gap:6px}
.turno .riga-di-prova,.turno .prova{font-variant-numeric:tabular-nums}
/* LE SCHEDE DEI FILE PRODOTTI: raggio 14, icona 32 su tinta, nome 13,5/600, «PDF · 96 KB» */
.allegati-detti{display:flex;flex-wrap:wrap;gap:var(--spazio-tra-schede);padding-top:2px}
.allegati-detti .file-allegato{display:flex;align-items:center;gap:10px;padding:var(--spazio-2) 14px var(--spazio-2) 10px;border:1px solid var(--bordo);border-radius:var(--raggio-menu);background:var(--bianco);text-decoration:none;color:var(--inchiostro);max-width:var(--scheda-file-risposta);transition:background-color var(--rapido) var(--curva-rapido),border-color var(--rapido) var(--curva-rapido);animation:schedaIn var(--breve) var(--curva-decelera) both}
.allegati-detti .file-allegato:hover{background:var(--superficie);border-color:var(--scheda-passaggio-bordo);text-decoration:none}
.allegati-detti .tipo{flex:none;display:grid;place-items:center;width:var(--icona-scheda);height:var(--icona-scheda);border-radius:var(--raggio-icona-scheda);background:var(--tinta);color:var(--accento-forte);font-size:var(--testo-nota);font-weight:var(--peso-forte);letter-spacing:0;padding:0}
.allegati-detti .testi{display:flex;flex-direction:column;min-width:0;gap:1px}
.allegati-detti .nome{font-size:var(--testo-scheda-nome);font-weight:var(--peso-forte);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.allegati-detti .dice{font-size:var(--testo-scheda-tipo);color:var(--inchiostro-3)}
/* TANTI FILE IN UNA RIGA SOLA — [24/09/2026], §99.13 dello stato: il conto dei file, «Scarica tutti» e l'elenco a richiesta */
.allegati-detti .gruppo-di-file{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--spazio-tra-schede);flex-basis:100%}
.allegati-detti .gruppo-di-file details{display:flex;flex-direction:column;gap:var(--spazio-tra-schede);min-width:0;max-width:100%}
.allegati-detti .gruppo-di-file summary{list-style:none;cursor:pointer}
.allegati-detti .gruppo-di-file summary::-webkit-details-marker{display:none}
.allegati-detti .gruppo-di-file .elenco{display:flex;flex-wrap:wrap;gap:var(--spazio-tra-schede);padding-top:var(--spazio-tra-schede)}
.allegati-detti .scarica-tutti{display:inline-flex;align-items:center;height:var(--scarica-altezza);padding:0 14px;border:1px solid var(--bordo);border-radius:var(--raggio-pillola);background:var(--bianco);color:var(--inchiostro);font-size:var(--testo-scheda-tipo);font-weight:var(--peso-forte);text-decoration:none;white-space:nowrap;align-self:center;transition:background-color var(--rapido) var(--curva-rapido)}
.allegati-detti .scarica-tutti:hover{background:var(--superficie);text-decoration:none}
/* IL FASCICOLO COME UNA CARTELLA DI DOCUMENTI — [24/09/2026], §99.14 dello stato: una cartella per categoria, i documenti per mese */
.cartelle{display:flex;flex-direction:column;gap:var(--spazio-2)}
/* LA VISURA LETTA — [24/09/2026], §99.22 dello stato */
.visura-sul-cliente label.btn{cursor:pointer}
.visura-letta{background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:var(--spazio-3) var(--spazio-4);font-size:var(--testo-tabella);line-height:1.5}
.visura-letta p{margin:0 0 var(--spazio-2)}
.visura-letta p:last-child{margin-bottom:0}
.visura-voci{margin:0 0 var(--spazio-3);padding-left:var(--spazio-5)}
.visura-voci li{margin:2px 0}
/* GLI APPUNTI DELLO STUDIO — [24/09/2026], §99.20 dello stato */
.appunti{display:flex;flex-direction:column;gap:var(--spazio-3)}
.appunto{background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:var(--spazio-3) var(--spazio-4)}
.appunto-testa{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--spazio-2) var(--spazio-4);margin-bottom:var(--spazio-2)}
.appunto-testa .attenuato{font-size:var(--testo-piccolo)}
.appunto-testo{font-size:var(--testo-tabella);line-height:1.5}
.appunto-testo>:first-child{margin-top:0}
.appunto-testo>:last-child{margin-bottom:0}
.cartella{border:1px solid var(--bordo);border-radius:var(--raggio-menu);background:var(--bianco);overflow:hidden;container-type:inline-size}
.cartella>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:12px 16px;transition:background-color var(--rapido) var(--curva-rapido)}
.cartella>summary::-webkit-details-marker{display:none}
.cartella>summary:hover{background:var(--superficie)}
.cartella>summary .icona{flex:none;display:grid;place-items:center;width:var(--icona-scheda);height:var(--icona-scheda);border-radius:var(--raggio-icona-scheda);background:var(--tinta);color:var(--accento-forte)}
.cartella>summary .nome{font-weight:var(--peso-forte);color:var(--inchiostro)}
.cartella>summary .conto{color:var(--inchiostro-3);font-size:var(--testo-piccolo)}
.cartella>summary .freccia{margin-left:auto;color:var(--inchiostro-3);transition:transform var(--rapido) var(--curva-rapido)}
.cartella[open]>summary .freccia{transform:rotate(90deg)}
.cartella .documenti{border-top:1px solid var(--bordo);padding-bottom:var(--spazio-2)}
.cartella .mese{padding:12px 16px 4px;font-size:var(--testo-nota);font-weight:var(--peso-forte);color:var(--inchiostro-3);text-transform:uppercase}
.cartella .documento{display:grid;grid-template-columns:92px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:6px 16px;transition:background-color var(--rapido) var(--curva-rapido)}
.cartella .documento:hover{background:var(--superficie)}
.cartella .documento .quando{color:var(--inchiostro-3);font-size:var(--testo-piccolo);font-variant-numeric:tabular-nums}
.cartella .documento .che{display:flex;flex-direction:column;min-width:0}
.cartella .documento .titolo{color:var(--inchiostro);font-weight:var(--peso-forte);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cartella .documento .titolo:hover{color:var(--accento);text-decoration:underline}
.cartella .documento .sotto{color:var(--inchiostro-2);font-size:var(--testo-piccolo);overflow-wrap:break-word}
/* COL PANNELLO APERTO A DESTRA LA CARTELLA È STRETTA: la data, l'importo e i formati su una riga, il documento sotto */
@container (max-width:560px){
.cartella .documento{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"quando importo formati" "che che che";row-gap:2px}
.cartella .documento .quando{grid-area:quando}
.cartella .documento .che{grid-area:che}
.cartella .documento .importo{grid-area:importo}
.cartella .documento .formati{grid-area:formati}
}
.cartella .documento .importo{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.cartella .documento .formati{display:flex;gap:6px}
.cartella .documento .formato{display:inline-grid;place-items:center;min-width:36px;height:22px;padding:0 6px;border-radius:var(--raggio-icona-scheda);background:var(--tinta);color:var(--accento-forte);font-size:var(--testo-nota);font-weight:var(--peso-forte);text-decoration:none}
.cartella .documento .formato:hover{background:var(--accento);color:var(--bianco)}
/* «ARCHIVIA IL CLIENTE» IN FONDO ALLA SCHEDA — [24/09/2026], §99.14 dello stato */
.gesti-in-fondo .riga-in-fondo{display:flex;align-items:center;justify-content:space-between;gap:var(--spazio-4);padding-top:var(--spazio-4);border-top:1px solid var(--bordo)}
.gesti-in-fondo .nota-pagina{margin:0}
/* LA RIGA DELLE VERSIONI SOTTO IL DOCUMENTO — [16/09/2026], mandato DOCUMENTO-A-DESTRA §3.4. */
.versioni{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px var(--spazio-2);margin-top:var(--spazio-2);font-size:var(--testo-nota);color:var(--inchiostro-3)}
.versioni .versione{color:var(--accento);text-decoration:none;white-space:nowrap}
.versioni .versione.ultima{font-weight:var(--peso-forte)}
.versioni .versione:hover{text-decoration:underline}
.versioni .sep{color:var(--inchiostro-3)}
/* «STO LAVORANDO»: una linea 120×2 in tinta con un segmento al 40% che scorre — mai una rotella */
.attesa-riga{display:flex;flex-direction:column;gap:var(--spazio-2);font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.attesa-riga .linea{width:var(--linea-lavoro-larghezza);height:var(--linea-lavoro-altezza);border-radius:var(--linea-lavoro-altezza);background:var(--tinta);overflow:hidden;margin-top:6px}
.attesa-riga .linea::before{content:"";display:block;width:var(--linea-lavoro-segmento);height:100%;border-radius:var(--linea-lavoro-altezza);background:var(--accento-chiaro);animation:lineaLavoro var(--lavoro-durata) var(--curva-lavoro) infinite}
.attesa-riga .dice{display:inline-flex;gap:var(--spazio-2);align-items:baseline}
.attesa-riga .secondi{font-size:var(--testo-nota);color:var(--inchiostro-3);font-variant-numeric:tabular-nums}
.attesa{position:fixed;left:50%;bottom:120px;transform:translateX(-50%);z-index:35;background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);box-shadow:var(--ombra-menu);padding:var(--spazio-2) 14px;font-size:var(--testo-medio);color:var(--inchiostro-2);display:flex;flex-direction:column;gap:6px;animation:menuIn var(--rapido) var(--curva-decelera) both}
.attesa .giro{width:var(--linea-lavoro-larghezza);height:var(--linea-lavoro-altezza);border-radius:var(--linea-lavoro-altezza);background:var(--tinta);overflow:hidden}
.attesa .giro::before{content:"";display:block;width:var(--linea-lavoro-segmento);height:100%;border-radius:var(--linea-lavoro-altezza);background:var(--accento-chiaro);animation:lineaLavoro var(--lavoro-durata) var(--curva-lavoro) infinite}
/* I PASSI VERI DI UN TURNO — `[09/09/2026]`, mandato GIRO-DEL-COMMITTENTE §1.5.
   Sopra la risposta, il racconto di ciò che è successo: un passo per riga, con
   l'esito accanto in Inchiostro 3. Mentre il turno accade il blocco è aperto e
   porta la linea che scorre (la stessa di «Sto lavorando», 120×2 in tinta con
   il segmento al 40%); quando la risposta arriva si chiude sulla riga di sunto,
   e si riapre al clic. Le righe entrano come i messaggi: 200 ms, 8 px dal
   basso, e con «riduci movimento» restano dove sono (la regola generale del
   foglio porta ogni durata a 1 ms). */
.passi{margin:0 0 var(--spazio-3);font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.passi>summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:var(--spazio-2);border-radius:var(--raggio-riga);padding:2px 6px;margin-left:-6px;transition:background-color var(--rapido) var(--curva-rapido)}
.passi>summary::-webkit-details-marker{display:none}
.passi>summary:hover{background:var(--passaggio-riga)}
.passi>summary .sunto{color:var(--inchiostro-2)}
.passi>summary .secondi{font-size:var(--testo-nota);color:var(--inchiostro-3);font-variant-numeric:tabular-nums}
.passi>summary .linea{display:none}
.passi.in-corso>summary .linea{display:block;flex:none;width:var(--linea-lavoro-larghezza);height:var(--linea-lavoro-altezza);border-radius:var(--linea-lavoro-altezza);background:var(--tinta);overflow:hidden;align-self:center}
.passi.in-corso>summary .linea::before{content:"";display:block;width:var(--linea-lavoro-segmento);height:100%;border-radius:var(--linea-lavoro-altezza);background:var(--accento-chiaro);animation:lineaLavoro var(--lavoro-durata) var(--curva-lavoro) infinite}
.passi .elenco-passi{list-style:none;margin:var(--spazio-2) 0 0;padding:0 0 0 var(--spazio-3);display:flex;flex-direction:column;gap:var(--spazio-2);border-left:1px solid var(--bordo)}
.passi .elenco-passi .passo{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--spazio-2);margin:0;animation:messaggioIn var(--breve) var(--curva-decelera) both}
.passi .elenco-passi .passo .dice{color:var(--inchiostro-2)}
.passi .elenco-passi .passo.aperto .dice::after{content:"…"}
.passi .elenco-passi .passo .esito{color:var(--inchiostro-3);font-size:var(--testo-nota)}
.passi .elenco-passi .passo .esito:not(:empty)::before{content:"·";margin-right:var(--spazio-2);color:var(--inchiostro-3)}
/* LA RIGA CHE CAMBIA — [23/09/2026, sera], §99.7: al posto della catena dei passi, una frase sola
   («Sto pensando…», «Leggo «giugno.pdf»…») con un segno che pulsa e i secondi; se ne va a turno finito.
   Una frase lunga si taglia con i puntini invece di andare a capo: la riga resta una. */
.attivita-in-corso{display:flex;align-items:center;gap:var(--spazio-2);margin:0 0 var(--spazio-3);font-size:var(--testo-tabella);color:var(--inchiostro-2);animation:dissolvenza var(--breve) var(--curva-decelera) both}
.attivita-in-corso[hidden]{display:none}
.attivita-in-corso .segno{flex:none;width:8px;height:8px;border-radius:var(--raggio-tondo);background:var(--accento-chiaro);animation:cursore var(--lavoro-durata) var(--curva-respiro) infinite}
.attivita-in-corso .sunto{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attivita-in-corso .secondi{flex:none;font-size:var(--testo-nota);color:var(--inchiostro-3);font-variant-numeric:tabular-nums}
/* IL CURSORE DI STREAMING: 8×15, raggio 4, accento chiaro, che respira in 1 s */
.cursore-streaming{display:inline-block;width:var(--cursore-larghezza);height:var(--cursore-altezza);margin-left:3px;border-radius:var(--raggio-foglio);background:var(--accento-chiaro);vertical-align:-2px;animation:cursore var(--cursore-durata) var(--curva-respiro) infinite}
.in-flusso .prosa,.turno.in-flusso .prosa{white-space:normal}
.stato-non-risposto,.turno .errore-turno{font-size:var(--testo-risposta);color:var(--inchiostro-2)}
.turno .nel-pannello{font-size:var(--testo-tabella);color:var(--inchiostro-2);margin:0}
.turno.compatto .detto{gap:6px}
.filo .vuoto-conversazione{font-size:var(--testo-risposta);color:var(--inchiostro-2);margin:0}
.coerenza-in-chat{margin:6px 0 0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.coerenza-in-chat .segno{display:inline-block;width:16px;color:var(--inchiostro-2)}
.coerenza-in-chat .controllo.fermo .segno{color:var(--pericolo)}
.coerenza-in-chat form.in-chat,.riga-marcata form.in-chat{display:inline-flex;flex-wrap:wrap;gap:var(--spazio-2);align-items:center;margin-top:6px}
.domande-cliente{margin:6px 0;padding-left:18px}

/* — le pagine al centro: colonna 920 (Guida 720), padding 48/32, dissolvenza 200 ms — */
.centro .scorre{position:absolute;inset:0;overflow-y:auto;padding:var(--pagina-padding-sopra) var(--pagina-padding-lati) 64px;animation:dissolvenza var(--dissolvenza-pagina) var(--curva-rapido) both}
.centro .pagina{max-width:var(--pagina);margin:0 auto;padding:0}
.centro .pagina.larga{max-width:var(--pagina)}
.centro .pagina.stretta{max-width:var(--guida)}
.pagina-testa{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--spazio-5);margin-bottom:var(--spazio-7)}
.pagina-testa h3,.pagina-testa h2{margin:0 0 6px;font-size:var(--testo-titolo-pagina);font-weight:var(--peso-normale);line-height:var(--interlinea-titolo-pagina);letter-spacing:var(--spaziatura-titolo-pagina)}
.pagina-testa .sotto{font-size:var(--testo-sottotitolo);color:var(--inchiostro-2);margin-top:0;max-width:var(--guida)}
.pagina-testa .gesti{display:flex;gap:var(--spazio-2);flex:none;align-items:center;flex-wrap:wrap}
.pagina-testa .gesti form{margin:0}
.pagina-testa .gesti .btn{height:var(--scarica-altezza);padding:0 14px 0 10px;font-size:var(--testo-medio);border:1px solid var(--bordo);background:var(--bianco)}
.pagina-testa .gesti .btn-primary{border-color:var(--accento);background:var(--accento);color:var(--bianco)}
.sezione-pagina{display:flex;flex-direction:column;gap:var(--spazio-3);margin-bottom:var(--spazio-7)}
.sezione-pagina>h6{margin:0}
.nota-pagina{font-size:var(--testo-medio);color:var(--inchiostro-2);line-height:var(--interlinea-corpo)}
/* LA GUIDA: colonna 720, titolo di pagina 30/400, sezioni 20/600, paragrafi 15,5/1,6 */
.guida h1{font-size:var(--testo-titolo-pagina);font-weight:var(--peso-normale);line-height:var(--interlinea-titolo-pagina);letter-spacing:var(--spaziatura-titolo-pagina);margin:0 0 var(--spazio-2)}
.guida h2{font-size:var(--testo-titolo-sezione);font-weight:var(--peso-forte);line-height:var(--interlinea-titolo-sezione);letter-spacing:var(--spaziatura-titolo-sezione);margin:var(--spazio-7) 0 10px}
.guida p,.guida li{font-size:var(--testo-risposta);line-height:var(--interlinea-risposta);margin:0 0 var(--spazio-3);text-wrap:pretty}
.guida ul{margin:0 0 var(--spazio-3);padding-left:var(--spazio-6)}
.guida li{margin-bottom:6px}
.guida hr{border:0;border-top:1px solid var(--bordo);margin:var(--spazio-4) 0}
.guida em{color:var(--inchiostro-2)}
/* L'INFORMATIVA SULL'IA SULLA GRIGLIA DELLA GUIDA — [12/09/2026], mandato RIFINITURA §1.8: la clausola come blocco a sé (citazione), i riferimenti in elenco */
.guida.informativa-ia .nota-clausola{color:var(--inchiostro-2);margin-bottom:var(--spazio-3)}
.guida.informativa-ia blockquote.clausola{margin:0 0 var(--spazio-5);padding:var(--spazio-3) var(--spazio-5);border-left:3px solid var(--accento);background:var(--superficie);border-radius:0 var(--raggio-voce) var(--raggio-voce) 0}
.guida.informativa-ia blockquote.clausola p:last-child{margin-bottom:0}
.guida.informativa-ia .per-il-cliente{color:var(--inchiostro-2)}
/* LE NOTIZIE — mandato PROVA-GENERALE 1.9: la forma del prototipo e niente altro.
   Articoli separati dal Bordo (padding 22/0), data e fonte a 12,5 in Inchiostro 3,
   titolo 17/600, riassunto 15/1,6 su 720 al massimo, e sotto la riga del tocca con
   le chip. Niente riquadri, niente contatori, niente note: la ragione del tocca sta
   nel title della chip. */
.notizie{display:flex;flex-direction:column;margin-top:var(--spazio-4)}
.notizia{display:flex;flex-direction:column;gap:6px;padding:22px 0;border-top:1px solid var(--bordo);background:transparent;border-radius:0}
.notizia .testa{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:var(--testo-piccolo);color:var(--inchiostro-3)}
.notizia .testa .data-fonte{font-variant-numeric:tabular-nums}
.notizia h2{margin:6px 0;font-size:var(--testo-titolo-notizia);font-weight:var(--peso-forte);line-height:var(--interlinea-titolo-notizia);letter-spacing:0;text-wrap:pretty}
.notizia h2 a{color:var(--inchiostro);text-decoration:none}
.notizia h2 a:hover{color:var(--accento-forte)}
.notizia .sintesi{margin:0;font-size:var(--testo-corpo);line-height:var(--interlinea-risposta);color:var(--inchiostro-2);max-width:var(--guida);text-wrap:pretty}
.notizia .tocca{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spazio-2);margin-top:var(--spazio-3);font-size:var(--testo-piccolo);color:var(--inchiostro-2)}
.notizia .tocca .chip-clienti{display:flex;gap:var(--spazio-2);flex-wrap:wrap}
.notizia .tocca .nessuno{color:var(--inchiostro-3)}
.altre{margin-top:var(--spazio-6);font-size:var(--testo-medio)}
.chi-dipende{font-size:var(--testo-piccolo);color:var(--inchiostro-2);align-self:start;min-width:220px;max-width:var(--scheda-file)}
.chi-dipende .numero{font-size:var(--testo-tabella);font-weight:var(--peso-forte);margin-top:var(--spazio-1);color:var(--inchiostro)}
.chi-dipende .nomi{color:var(--inchiostro-2);margin-top:var(--spazio-1);line-height:1.45}
/* I FILTRI E I CONTATORI (Fonti, Scadenzario): il filtro di testo 36 su superficie, i chip di stato */
.filtri{display:flex;align-items:center;gap:var(--spazio-2);margin:0 0 var(--spazio-4);flex-wrap:wrap}
.filtri .input{max-width:320px;height:var(--filtro-fonti-altezza);border:0;background:var(--superficie);border-radius:var(--raggio-campo);font-size:var(--testo-barra);color:var(--inchiostro)}
.filtri .mostrate{font-size:var(--testo-medio);color:var(--inchiostro-3);margin-left:auto}
/* LA CASA DEL CLIENTE — la striscia dei fatti in testa `[10/09/2026]`: le
   etichette del tema (`etichetta-sm`) e il valore nel corpo del testo, non nel
   corpo grande di `.carta .valore`, che è dei contatori. */
.fatti-della-casa{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--spazio-3) var(--spazio-4);margin:0 0 var(--spazio-5)}
.fatti-della-casa .fatto{display:flex;flex-direction:column;gap:var(--spazio-1);min-width:0}
.fatti-della-casa .valore-fatto{font-size:var(--testo-tabella);text-wrap:pretty}
.contatori{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--spazio-4);margin:0 0 var(--spazio-5)}
.contatori .carta{padding:var(--spazio-3) var(--spazio-4)}
.contatori .carta .valore{font-size:var(--testo-titolo-sezione);margin-top:var(--spazio-1)}
.contatori.piccoli{gap:10px;margin:0}
.contatori.piccoli .carta{padding:10px var(--spazio-3)}
/* IL QUINTO CONTATORE DELLE FONTI — `[10/09/2026]`, mandato §5.1: l'ultimo
   aggiornamento sta nella fila, e non è un numero: il valore è nel corpo di una
   riga di tabella, perché è un giorno da leggere. */
.contatori.cinque{grid-template-columns:repeat(5,minmax(0,1fr))}
.contatori .carta .valore.piccolo{font-size:var(--testo-tabella);font-weight:var(--peso-normale);line-height:1.35}
/* LA TABELLA DELLE FONTI: griglia 1fr 170 120 150, il pallino di 8 px colorato con lo stato */
/* LE FONTI DEL PRODOTTO hanno quattro colonne diverse da quelle del prototipo (fatto, citazione, norma, stato): la griglia è loro, per nome nel tema */
.fonti-tabella .intestazione,.fonti-tabella .riga{grid-template-columns:var(--tabella-fonti-prodotto)}
.fonti-tabella .riga>span{white-space:normal}
/* LE QUATTRO COLONNE DEL PROTOTIPO — mandato PROVA-GENERALE 1.9: Fonte, Tipo,
   Aggiornata al, Verifica col pallino colorato e il testo accanto. */
.fonti-tabella .nome-fonte{display:block;color:var(--inchiostro)}
.fonti-tabella .fatto-fonte{display:block;font-size:var(--testo-piccolo);color:var(--inchiostro-3);margin-top:2px}
.fonti-tabella .tipo{color:var(--inchiostro-2)}
.fonti-tabella .aggiornata{color:var(--inchiostro-2);font-variant-numeric:tabular-nums}
.fonti-tabella .verifica{color:var(--inchiostro);display:flex;align-items:center;gap:var(--spazio-2)}
.fonti-tabella .verifica .pallino{flex:none;width:var(--pallino);height:var(--pallino);border-radius:var(--raggio-tondo);background:var(--verificata)}
.fonti-tabella .verifica .pallino.da{background:var(--da-verificare)}
.fonti-tabella .verifica .pallino.nuova{background:var(--superata)}
.fonti-filtri{align-items:center}
.cerca-fonti{height:var(--filtro-fonti-altezza);min-width:240px;border:0;background:var(--superficie);border-radius:var(--raggio-campo);font-size:var(--testo-barra)}
.fonti-tabella .riga.aperta{background:var(--superficie)}
.fonti-tabella .dettaglio{padding:var(--spazio-1) var(--spazio-4) var(--spazio-5);display:grid;grid-template-columns:1fr 300px;gap:30px;background:var(--superficie);border-top:1px solid var(--bordo-tabella)}
.fonti-tabella .dettaglio .edizione{font-size:var(--testo-medio);color:var(--inchiostro-2)}
.fonti-tabella .dettaglio .testo-norma{margin:var(--spazio-2) 0 0;line-height:var(--interlinea-corpo);font-size:var(--testo-tabella);white-space:pre-wrap;max-height:var(--testo-norma-altezza);overflow:auto}
.fonti-tabella .dettaglio .gesti{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.fonti-tabella .dettaglio .gesti form{margin:0}
.fonti-tabella .dettaglio .chi-dipende{background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:var(--spazio-3) 14px}
.origini{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--spazio-4);margin-top:var(--spazio-5)}
.origine{padding:var(--spazio-3) var(--spazio-4);gap:2px;min-width:0}
.origine .nome{font-size:var(--testo-risposta);font-weight:var(--peso-forte);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.origine .conta{font-size:var(--testo-medio);color:var(--inchiostro-2);line-height:1.45}
.origine .quando{font-size:var(--testo-nota);color:var(--inchiostro-3);display:flex;align-items:center;gap:6px;margin-top:var(--spazio-1)}
.punto-vivo{width:var(--pallino);height:var(--pallino);border-radius:var(--raggio-tondo);background:var(--inchiostro-3);display:inline-block;flex:none}
.punto-vivo.in-corso{background:var(--accento);animation:cursore var(--cursore-durata) var(--curva-respiro) infinite}
.origine.principale{border-color:var(--accento-chiaro)}
.origine.principale .etichetta-sm{color:var(--accento-forte)}
.origine-testa{display:flex;align-items:baseline;justify-content:space-between;gap:var(--spazio-3);margin:22px 0 var(--spazio-3)}
.origine-testa h6{margin:0}
.origine-testa .quando{font-size:var(--testo-nota);color:var(--inchiostro-3);display:flex;align-items:center;gap:6px}
.fonti-origine .intestazione,.fonti-origine .riga{grid-template-columns:1.6fr 1fr .9fr .9fr 1fr}
.fonti-origine .riga>span{white-space:normal}
.fonti-lettura{display:flex;flex-direction:column;gap:6px;font-size:var(--testo-tabella)}
.fonti-lettura .voce{display:grid;grid-template-columns:1fr auto;gap:var(--spazio-3);padding:6px 0;border-bottom:1px solid var(--bordo-tabella)}
.fonti-lettura .voce:last-child{border-bottom:0}
.collega-fonte{display:flex;gap:var(--spazio-2);flex-wrap:wrap;align-items:center}
.collega-fonte .input{max-width:320px;height:var(--filtro-fonti-altezza)}
/* i passi, la zona di trascinamento, il prospetto, le coppie, i residui — la riconciliazione nelle pagine */
.passi{display:flex;align-items:center;gap:10px;font-size:var(--testo-medio)}
.passi .passo{display:flex;align-items:center;gap:var(--spazio-2);color:var(--inchiostro-2)}
.passi .passo .n{width:22px;height:22px;border-radius:var(--raggio-tondo);display:grid;place-items:center;font-size:var(--testo-piccolo);font-weight:var(--peso-forte);border:1px solid var(--bordo);color:var(--inchiostro-3)}
.passi .passo.fatto .n{background:var(--tinta);color:var(--accento-forte);border-color:var(--tinta)}
.passi .passo.corrente{color:var(--inchiostro);font-weight:var(--peso-forte)}
.passi .passo.corrente .n{background:var(--accento);color:var(--bianco);border-color:var(--accento)}
.passi .connettore{flex:1;max-width:60px;height:1px;background:var(--bordo)}
.trascina{display:flex;flex-direction:column;align-items:center;gap:var(--spazio-2);padding:var(--spazio-7) var(--spazio-5);border:1.5px dashed var(--scheda-passaggio-bordo);border-radius:var(--raggio-zona);background:var(--superficie);color:var(--inchiostro-2);text-align:center;font-size:var(--testo-barra);cursor:copy}
.trascina:hover,.trascina.sopra{border-color:var(--accento);background:var(--tinta)}
.trascina .grande{font-size:var(--testo-barra);color:var(--inchiostro)}
.trascina input[type=file]{display:none}
.file-elenco{display:flex;flex-direction:column;gap:var(--spazio-2);font-size:var(--testo-tabella);line-height:var(--interlinea-corpo)}
.file-elenco .esito{color:var(--inchiostro-2)}
.file-elenco .esito.attenzione{color:var(--inchiostro);font-weight:var(--peso-forte)}
.file-elenco .esito.errore{color:var(--pericolo)}
.file-elenco .trattino{color:var(--inchiostro-3)}
.prospetto{display:grid;grid-template-columns:1fr 110px;gap:6px var(--spazio-5);font-size:var(--testo-corpo);font-variant-numeric:tabular-nums;max-width:var(--prospetto-larghezza)}
.prospetto .destra{text-align:right}
.prospetto .forte{font-weight:var(--peso-forte)}
.prospetto .calmo{color:var(--inchiostro-2)}
.coppia{display:grid;grid-template-columns:1fr 1fr;gap:var(--spazio-5)}
.coppia .val{font-size:var(--testo-corpo);font-variant-numeric:tabular-nums}
.ragione{font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.ragione .k{color:var(--inchiostro-3)}
.gesti-riga{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap;align-items:center}
.gesti-riga form{margin:0}
.residui{display:grid;grid-template-columns:1fr 1fr;gap:30px;font-variant-numeric:tabular-nums}
.residui .riga-r{display:grid;grid-template-columns:44px 1fr 74px;gap:0 10px;padding:var(--spazio-1) 0;font-size:var(--testo-barra)}
.residui .riga-r .importo{text-align:right}
.residui .totale{color:var(--inchiostro-2);padding-top:6px}
.certe-griglia{display:grid;grid-template-columns:48px 1fr 1fr 84px;gap:0 var(--spazio-3);padding:5px var(--spazio-2);border-radius:var(--raggio-puntini);font-size:var(--testo-barra);font-variant-numeric:tabular-nums}
.certe-griglia:hover{background:var(--passaggio-riga)}
.certe-griglia.testa{font-size:var(--testo-piccolo);font-weight:var(--peso-forte);color:var(--inchiostro-2);padding:0 var(--spazio-2) var(--spazio-1)}
.certe-griglia .importo{text-align:right}
.albero-file{list-style:none;margin:0;padding:0}
.albero-file li{padding:var(--spazio-1) 0}
.albero-file .cartella{font-weight:var(--peso-forte)}
.albero-file ul{list-style:none;margin:var(--spazio-1) 0 var(--spazio-2);padding-left:18px;font-size:var(--testo-tabella);line-height:1.6}
.albero-file .file{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.albero-file .file .meta{font-size:var(--testo-nota);color:var(--inchiostro-3)}
.albero-file details{margin:var(--spazio-1) 0}
.albero-file summary{cursor:pointer;font-weight:var(--peso-forte);font-size:var(--testo-tabella);list-style:none}
.albero-file summary::-webkit-details-marker{display:none}
.albero-file .periodo summary{font-weight:var(--peso-normale);color:var(--inchiostro-2)}
.scadenzario-riga{display:grid;grid-template-columns:110px 1fr 160px 120px;gap:0 14px;padding:9px var(--spazio-3);border-bottom:1px solid var(--bordo-tabella);font-size:var(--testo-tabella);align-items:baseline}
.scadenzario-riga .data{font-variant-numeric:tabular-nums;white-space:nowrap}
.scadenzario-riga .stato{font-size:var(--testo-nota);color:var(--inchiostro-2)}
.scadenzario-riga .stato.attenzione{color:var(--inchiostro);font-weight:var(--peso-forte)}
.scadenzario-riga .sotto{font-size:var(--testo-nota);color:var(--inchiostro-3);display:block}
.scadenzario-riga.passata{color:var(--inchiostro-2)}
.elenco-verifica{display:flex;flex-direction:column;gap:2px}
.elenco-verifica .voce{display:grid;grid-template-columns:1fr 160px 130px;gap:0 14px;padding:var(--spazio-2) var(--spazio-3);border-bottom:1px solid var(--bordo-tabella);font-size:var(--testo-tabella);align-items:baseline}
.elenco-verifica .voce .stato{font-size:var(--testo-nota);color:var(--inchiostro-2)}
.elenco-verifica .voce .stato.attenzione{color:var(--inchiostro);font-weight:var(--peso-forte)}
.elenco-verifica .voce .sotto{font-size:var(--testo-nota);color:var(--inchiostro-3);display:block}
.albero-soci{list-style:none;margin:0;padding:0}
.albero-soci ul{list-style:none;margin:0;padding-left:22px;border-left:1px solid var(--bordo)}
.albero-soci li{padding:var(--spazio-1) 0 var(--spazio-1) 10px;font-size:var(--testo-tabella)}
.albero-soci .quota{font-variant-numeric:tabular-nums;color:var(--inchiostro-2)}
.albero-soci .ruolo{font-size:var(--testo-nota);color:var(--inchiostro-3)}
.albero-soci .forte{font-weight:var(--peso-forte)}
.griglia-kv{display:grid;grid-template-columns:170px 1fr;gap:6px 14px;font-size:var(--testo-tabella)}
.griglia-kv .k{color:var(--inchiostro-2);font-size:var(--testo-piccolo)}
.griglia-kv .v.calmo{color:var(--inchiostro-2)}
.blocco-documento{border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:var(--spazio-3) 14px;background:var(--bianco)}
.blocco-documento h5{margin:0 0 6px}
.blocco-documento .gesti{display:flex;gap:var(--spazio-2);flex-wrap:wrap;margin-top:var(--spazio-2)}
.informativa p{max-width:70ch}
.moduli-riga{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.moduli-riga form{margin:0;display:flex;gap:var(--spazio-2);align-items:center}
.tavola table{border-collapse:collapse;width:100%;font-size:var(--testo-barra)}
.tavola th{text-align:left;font-size:var(--testo-piccolo);font-weight:var(--peso-forte);color:var(--inchiostro-2);padding:10px;border-bottom:1px solid var(--bordo);background:var(--superficie)}
.tavola td{padding:10px;border-bottom:1px solid var(--bordo-tabella);vertical-align:top}
.campione{display:inline-block;width:14px;height:14px;border-radius:var(--raggio-foglio);vertical-align:-2px;margin-right:var(--spazio-2);border:1px solid var(--bordo)}
.griglia-campi{display:grid;grid-template-columns:2fr 1fr;gap:14px}
.campo{display:flex;flex-direction:column;gap:5px;font-size:var(--testo-barra)}
.campo>span{color:var(--inchiostro-2);font-size:var(--testo-piccolo)}
.in-linea{display:flex;gap:6px;align-items:center}
.gesti-riga{display:flex;flex-direction:column;gap:var(--spazio-1);align-items:flex-start}
.gesti-riga .in-riga{margin:0}
.gesti-riga .btn{font-size:var(--testo-piccolo);height:var(--chip-altezza);padding:0 var(--spazio-3);white-space:nowrap}
.modulo-utente{display:flex;flex-direction:column;gap:var(--spazio-3);max-width:520px}
.riga-semplice{padding:6px 0;font-size:var(--testo-tabella);border-bottom:1px solid var(--bordo)}
.riga-semplice:last-of-type{border-bottom:0}
.passi-guidati{display:flex;flex-direction:column;gap:2px;margin:0 0 var(--spazio-4)}
.passi-guidati .tappa{display:grid;grid-template-columns:26px 1fr;gap:var(--spazio-2);align-items:baseline;padding:7px 10px;border-radius:var(--raggio-riga);color:var(--inchiostro-2)}
.passi-guidati .tappa .numero{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:var(--raggio-tondo);font-size:var(--testo-piccolo);background:var(--superficie)}
.passi-guidati .tappa.fatto{color:var(--inchiostro)}
.passi-guidati .tappa.fatto .numero{background:var(--tinta);color:var(--accento-forte)}
.passi-guidati .tappa.in-corso{background:var(--superficie);color:var(--inchiostro);font-weight:var(--peso-forte)}
.passi-guidati .tappa.in-corso .numero{background:var(--accento);color:var(--bianco)}
.passi-guidati .tappa .chiede{grid-column:2;font-weight:var(--peso-normale);font-size:var(--testo-medio);color:var(--inchiostro-2);margin-top:3px}
.coerenza .controllo{display:grid;grid-template-columns:1.3fr .6fr 2fr;gap:10px;padding:var(--spazio-2) 0;border-bottom:1px solid var(--bordo)}
.coerenza .controllo:last-of-type{border-bottom:0}
.coerenza .controllo .esito{font-size:var(--testo-piccolo);color:var(--inchiostro-2)}
.coerenza .controllo.fermo .esito{font-weight:var(--peso-forte);color:var(--inchiostro)}
.coerenza .controllo .dice{font-size:var(--testo-medio)}
.coerenza .controllo form{grid-column:1/-1;margin:6px 0 0}
.coerenza .controllo .alternativa{grid-column:1/-1;margin:var(--spazio-1) 0 0;font-size:var(--testo-medio);color:var(--inchiostro-2)}
.saldi-affiancati{margin:var(--spazio-4) 0}
.correzioni .correzione{padding:10px 0;border-bottom:1px solid var(--bordo)}
.correzioni .correzione:last-of-type{border-bottom:0}
.correzioni .correzione .classe{display:inline-block;font-size:var(--testo-piccolo);padding:2px var(--spazio-2);border-radius:var(--raggio-pillola);background:var(--superficie);margin-right:var(--spazio-2)}
.correzioni .correzione .proposta{margin:6px 0 0;font-size:var(--testo-tabella)}
.correzioni .correzione .cause{margin:var(--spazio-1) 0 0;font-size:var(--testo-medio);color:var(--inchiostro-2)}
.correzioni .correzione.accettata{opacity:.75}
.correzioni .correzione .deciso{margin:6px 0 0;font-size:var(--testo-piccolo);font-weight:var(--peso-forte)}
.attivita-carte{display:flex;flex-direction:column;gap:22px}
.attivita-carte .carta .turno{gap:6px}

/* ==========================================================================
   IL PANNELLO DI DESTRA — 480, bianco, bordo a sinistra: la testa alta 60 col
   nome, «Scarica» e chiudi; il corpo che scorre. Scivola da destra in 280 ms
   mentre il centro si restringe: la larghezza va 0 → 480 e il contenuto è
   ancorato al bordo destro.
   ========================================================================== */
.pannello-destro{position:relative;flex:none;height:100%;width:0;overflow:hidden;transition:width var(--pannello-durata) var(--curva-standard)}
body.app.con-pannello .pannello-destro{width:var(--pannello)}
body.app.con-pannello.pannello-largo .pannello-destro{width:var(--pannello-largo)}
.pannello-destro .dentro-pannello{position:absolute;right:0;top:0;width:var(--pannello);height:100%;display:flex;flex-direction:column;background:var(--bianco);border-left:1px solid var(--bordo)}
body.app.pannello-largo .pannello-destro .dentro-pannello{width:100%}
.pannello-destro .testa{flex:none;display:flex;align-items:center;gap:var(--spazio-2);height:var(--pannello-testa-altezza);padding:var(--pannello-testa-padding);border-bottom:1px solid var(--bordo)}
.pannello-destro .testa h6{flex:1;min-width:0;margin:0;font-size:var(--testo-sottotitolo);font-weight:var(--peso-forte);text-transform:none;letter-spacing:0;color:var(--inchiostro);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pannello-destro .testa .conta{display:flex;align-items:center;gap:10px;font-size:var(--testo-nota);color:var(--inchiostro-3);flex:none}
.pannello-destro .testa .conta a,.pannello-destro .testa .conta button{background:none;border:0;padding:0;font:inherit;font-size:var(--testo-nota);color:var(--accento);cursor:pointer;text-decoration:none}
.pannello-destro .testa .conta a:hover,.pannello-destro .testa .conta button:hover{color:var(--accento-forte)}
.pannello-destro .testa .scarica{display:inline-flex;align-items:center;gap:6px;height:var(--scarica-altezza);padding:0 14px 0 10px;border:1px solid var(--bordo);border-radius:var(--raggio-pillola);background:var(--bianco);color:var(--inchiostro);font-size:var(--testo-medio);font-weight:var(--peso-forte);text-decoration:none;transition:background-color var(--rapido) var(--curva-rapido)}
.pannello-destro .testa .scarica:hover{background:var(--superficie);text-decoration:none}
/* I GESTI DI UN DOCUMENTO DELLA CHAT IN TESTA AL PANNELLO — [16/09/2026], mandato DOCUMENTO-A-DESTRA §3.2: le pillole «PDF», «Word», «Excel», «Modifica ›», «Approva», scritte dal server. */
.pannello-destro .testa .gesti-documento{display:flex;align-items:center;gap:var(--spazio-1);flex:none}
.pannello-destro .testa .gesti-documento .scarica{padding:0 10px;gap:0}
.pannello-destro .testa .gesti-documento .scarica.modifica{color:var(--accento)}
.pannello-destro .testa .gesti-documento form{margin:0}
.pannello-destro .testa .gesti-documento button.scarica{font:inherit;font-size:var(--testo-medio);font-weight:var(--peso-forte);cursor:pointer}
.pannello-destro .testa .gesti-documento .scarica.approva{background:var(--accento);color:var(--bianco);border-color:var(--accento)}
.pannello-destro .testa .gesti-documento .scarica.approva:hover{background:var(--accento-forte)}
.pannello-destro .testa .versione-dice{font-size:var(--testo-nota);color:var(--inchiostro-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--versione-dice-larghezza)}
.pannello-destro .testa .chiudi{display:grid;place-items:center;width:var(--bottone-icona);height:var(--bottone-icona);border:0;border-radius:var(--raggio-riga);background:transparent;color:var(--inchiostro-2);padding:0;cursor:pointer;flex:none;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido)}
.pannello-destro .testa .chiudi:hover{background:var(--passaggio-bottone);color:var(--inchiostro)}
.pannello-destro>.dentro-pannello>.scorre{flex:1;min-height:0;overflow:auto;padding:var(--spazio-1) var(--pannello-padding-scheda) var(--spazio-8);position:static;animation:none}
.pannello-destro .riquadri{display:flex;flex-direction:column;gap:10px;margin-top:var(--spazio-4)}
.pannello-destro .vuoto{font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.pannello-destro .pagina{padding:0 0 var(--spazio-5);max-width:none}
.pannello-destro .scorre .scorre{position:static;overflow:visible;flex:none;min-height:auto;padding:0;animation:none}
.pannello-destro .pagina-testa{margin-bottom:18px}
.pannello-destro .avviso-pannello{margin:var(--spazio-4) 0 14px}
.pannello-destro .turno-nel-pannello{font-size:var(--testo-corpo);line-height:var(--interlinea-operatore);padding-top:var(--spazio-4)}
.pannello-destro .turno-nel-pannello .turno{gap:var(--spazio-2);animation:none}
.pannello-destro .filtri{margin:18px 0 var(--spazio-3)}
.pannello-destro .contatori{max-width:none}
.pannello-destro .fonti-tabella .dettaglio{grid-template-columns:1fr var(--dettaglio-pannello)}
body.app:not(.pannello-largo) .pannello-destro .fonti-tabella .dettaglio,body.app:not(.pannello-largo) .pannello-destro .residui,body.app:not(.pannello-largo) .pannello-destro .coppia,body.app:not(.pannello-largo) .pannello-destro .griglia-campi{grid-template-columns:1fr}
body.app:not(.pannello-largo) .pannello-destro .contatori,body.app:not(.pannello-largo) .pannello-destro .origini{grid-template-columns:1fr 1fr}
/* IL PDF: area superficie 2; il foglio bianco con l'ombra, raggio 4, padding 36/32, min 620; la barra inferiore 56 con ‹ › e «Pagina N di M» */
.anteprima{display:flex;flex-direction:column;flex:1;min-height:0;margin:0 calc(-1 * var(--pannello-padding-scheda))}
.anteprima-testa{display:none}
.anteprima-di-pdf .area-pdf{flex:1;min-height:0;overflow:auto;background:var(--superficie-2);padding:var(--pannello-padding-pdf) var(--pannello-padding-pdf) var(--spazio-6)}
.anteprima-di-pdf .foglio{display:flex;flex-direction:column;min-height:var(--pdf-altezza-minima);background:var(--bianco);border-radius:var(--raggio-foglio);box-shadow:var(--ombra-foglio);animation:dissolvenza var(--cambio-pagina) var(--curva-rapido) both;overflow:hidden}
.anteprima-di-pdf .foglio img{display:block;width:100%;height:auto}
.anteprima-pdf{flex:1;min-height:var(--pdf-altezza-minima);width:100%;border:0;background:var(--bianco)}
.anteprima-di-pdf .barra-pagine{flex:none;height:var(--pannello-barra-inferiore);display:flex;align-items:center;justify-content:center;gap:14px;border-top:1px solid var(--bordo);font-size:var(--testo-medio);color:var(--inchiostro-2);font-variant-numeric:tabular-nums}
.anteprima-di-pdf .barra-pagine button{display:grid;place-items:center;width:var(--bottone-icona);height:var(--bottone-icona);border:0;border-radius:var(--raggio-riga);background:transparent;color:var(--inchiostro);padding:0;cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido),opacity var(--rapido) var(--curva-rapido)}
.anteprima-di-pdf .barra-pagine button:hover{background:var(--passaggio-bottone)}
.anteprima-di-pdf .barra-pagine button:disabled{opacity:.35;cursor:default}
/* L'EXCEL: le linguette alte 36 con la sottolineatura di 2 px in accento, la griglia con l'intestazione su superficie */
.anteprima-di-excel .schede{flex:none;display:flex;gap:var(--spazio-1);padding:var(--spazio-2) var(--spazio-4) 0;border-bottom:1px solid var(--bordo);overflow-x:auto}
.anteprima-di-excel .scheda{height:var(--linguetta-altezza);padding:0 var(--spazio-3);border:0;border-bottom:2px solid transparent;background:transparent;font-size:var(--testo-medio);font-weight:var(--peso-forte);color:var(--inchiostro-2);white-space:nowrap;cursor:pointer;transition:color var(--rapido) var(--curva-rapido),border-color var(--rapido) var(--curva-rapido)}
.anteprima-di-excel .scheda:hover{color:var(--inchiostro)}
.anteprima-di-excel .scheda.attiva{color:var(--inchiostro);border-bottom-color:var(--accento)}
.anteprima-di-excel .filtro-foglio{padding:var(--spazio-3) var(--pannello-padding-excel) 0}
.anteprima-di-excel .foglio{flex:1;min-height:0;overflow:auto;padding:var(--pannello-padding-excel);animation:dissolvenza var(--cambio-pagina) var(--curva-rapido) both}
.anteprima-di-excel .scorre-tabella{overflow:auto;border:1px solid var(--bordo);border-radius:var(--raggio-tabella-excel)}
table.foglio-excel{border-collapse:separate;border-spacing:0;font-size:var(--testo-piccolo);font-variant-numeric:tabular-nums;width:100%}
table.foglio-excel th{position:sticky;top:0;background:var(--superficie);color:var(--inchiostro-2);font-weight:var(--peso-forte);font-size:var(--testo-anteprima-intestazione);text-align:left;padding:var(--spazio-2) 10px;white-space:nowrap}
table.foglio-excel td{padding:var(--spazio-2) 10px;border-top:1px solid var(--bordo-tabella);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--cella-excel-massima)}
table.foglio-excel td.num{text-align:right}
.anteprima-di-excel .conta-righe{padding:var(--spazio-2) 0 0;font-size:var(--testo-nota);color:var(--inchiostro-3)}
/* IL FILE SENZA ANTEPRIMA: il messaggio centrato, resta «Scarica» */
.anteprima .senza-anteprima{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:var(--spazio-8);color:var(--inchiostro-2);text-align:center;font-size:var(--testo-tabella)}
.anteprima .senza-anteprima svg{color:var(--inchiostro-3)}
.anteprima .senza-anteprima .nota{font-size:var(--testo-piccolo);color:var(--inchiostro-3)}
/* IL DOCUMENTO SI MODIFICA A DESTRA — [16/09/2026], mandato DOCUMENTO-A-DESTRA §3.2: lo stesso foglio bianco dell'anteprima, ogni parte libera modificabile al suo posto, le parti del prodotto attenuate e ferme; caratteri, colori e margini restano dello studio. */
/* E DAL [17/09/2026, sera] L'EDITOR È UNA FINESTRA MODALE, chiesta dal committente: il pannello resta lo stesso elemento, ma con la classe sul corpo della pagina si stende sopra tutto col velo dietro, e il foglio sta al centro, largo. */
body.app.con-pannello.modale-documento .pannello-destro{position:fixed;inset:0;width:auto;height:auto;z-index:40;background:var(--velo);display:grid;place-items:center;padding:var(--spazio-6);overflow:hidden;animation:dissolvenza var(--breve) var(--curva-rapido) both}
body.app.con-pannello.modale-documento .pannello-destro .dentro-pannello{position:relative;right:auto;top:auto;width:min(100%,var(--modale-documento));height:min(100%,var(--modale-documento-altezza));border:1px solid var(--bordo);border-radius:var(--raggio-zona);box-shadow:var(--ombra-menu);overflow:hidden}
body.app.modale-documento .pannello-destro .testa .versione-dice{max-width:none}
.modifica-documento .versioni-editor{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:var(--spazio-2) var(--spazio-3);padding:var(--spazio-2) var(--pannello-padding-pdf);border-bottom:1px solid var(--bordo);font-size:var(--testo-nota);color:var(--inchiostro-3);background:var(--superficie)}
.modifica-documento .versioni-editor .etichetta{font-weight:var(--peso-forte);color:var(--inchiostro-2)}
.modifica-documento .versioni-editor .versione.ultima{color:var(--inchiostro);font-weight:var(--peso-forte)}
.modifica-documento .area-modifica{flex:1;min-height:0;overflow:auto;background:var(--superficie-2);padding:var(--pannello-padding-pdf) var(--pannello-padding-pdf) var(--spazio-6)}
.modifica-documento .foglio-modifica{background:var(--bianco);border-radius:var(--raggio-foglio);box-shadow:var(--ombra-foglio);padding:var(--foglio-modifica-padding);min-height:var(--pdf-altezza-minima);font-size:var(--testo-medio);line-height:var(--interlinea-modifica);color:var(--inchiostro)}
.modifica-documento .parte{position:relative;margin:0 0 var(--spazio-2);padding-right:var(--spazio-5);min-width:0;overflow-wrap:anywhere}
.modifica-documento .parte.fissa{color:var(--inchiostro-3);cursor:not-allowed}
.modifica-documento .parte [contenteditable]{outline:none;border-radius:var(--raggio-riga);padding:2px var(--spazio-1);margin:0 calc(-1 * var(--spazio-1));min-height:1.4em;transition:background-color var(--rapido) var(--curva-rapido)}
.modifica-documento .parte [contenteditable]:hover{background:var(--superficie)}
.modifica-documento .parte [contenteditable]:focus{background:var(--tinta);box-shadow:inset 0 0 0 1px var(--accento)}
.modifica-documento .parte [contenteditable]:empty::before{content:attr(data-placeholder);color:var(--inchiostro-3)}
.modifica-documento .parte h2{font-size:var(--testo-sottotitolo);font-weight:var(--peso-forte);margin:0}
.modifica-documento .parte h3{font-size:var(--testo-medio);font-weight:var(--peso-forte);margin:var(--spazio-2) 0 0}
.modifica-documento .parte p{margin:0}
.modifica-documento .parte.nota .contenuto,.modifica-documento .parte.sottotitolo .contenuto{font-size:var(--testo-nota)}
.modifica-documento .parte.sottotitolo .contenuto{font-style:italic}
.modifica-documento .parte.voce .contenuto{padding-left:var(--spazio-4)}
.modifica-documento .parte.riga hr{border:0;border-top:1px solid var(--bordo);margin:var(--spazio-2) 0}
.modifica-documento .parte.spazio,.modifica-documento .parte.pagina-nuova{height:var(--spazio-3)}
.modifica-documento .parte.punto{display:flex;gap:var(--spazio-1);align-items:baseline;padding-left:var(--spazio-1)}
.modifica-documento .parte.punto .pallino{flex:none;color:var(--inchiostro-3)}
.modifica-documento .parte.punto .capo{flex:none;font-weight:var(--peso-forte)}
.modifica-documento .parte.punto .testo{flex:1;min-width:0}
.modifica-documento .parte.tabella table{width:100%;border-collapse:collapse;font-size:var(--testo-nota);table-layout:fixed}
.modifica-documento .parte.tabella th{background:var(--superficie);text-align:left;font-weight:var(--peso-forte);padding:var(--spazio-1) var(--spazio-2);border:1px solid var(--bordo);overflow-wrap:anywhere}
.modifica-documento .parte.tabella td{padding:var(--spazio-1) var(--spazio-2);border:1px solid var(--bordo);overflow-wrap:anywhere}
.modifica-documento .parte.tabella .aggiungi-riga{margin-top:var(--spazio-2)}
.modifica-documento .togli-parte{position:absolute;right:0;top:0;width:var(--togli-parte);height:var(--togli-parte);border:0;border-radius:50%;background:transparent;color:var(--inchiostro-3);cursor:pointer;font:inherit;line-height:var(--togli-parte);padding:0;opacity:0;transition:opacity var(--rapido) var(--curva-rapido)}
.modifica-documento .parte:hover .togli-parte,.modifica-documento .parte:focus-within .togli-parte{opacity:1}
.modifica-documento .togli-parte:hover{background:var(--passaggio-bottone);color:var(--inchiostro)}
/* «COMMENTA» SU UNA PARTE E LA CASELLA DEL COMMENTO — [19/09/2026, sera], STATO.md §89 */
.modifica-documento .commenta-parte{position:absolute;right:calc(var(--togli-parte) + var(--spazio-1));top:0;height:var(--togli-parte);border:0;border-radius:var(--raggio-riga);background:transparent;color:var(--accento);cursor:pointer;font:inherit;font-size:var(--testo-nota);line-height:var(--togli-parte);padding:0 var(--spazio-2);opacity:0;transition:opacity var(--rapido) var(--curva-rapido)}
.modifica-documento .parte:hover .commenta-parte,.modifica-documento .parte:focus-within .commenta-parte{opacity:1}
.modifica-documento .commenta-parte:hover{background:var(--tinta)}
/* il testo non passa sotto i due gesti: «Commenta» è largo ottanta e sta a sinistra della × */
.modifica-documento .parte{padding-right:calc(var(--togli-parte) + var(--spazio-10) + var(--spazio-9))}
.modifica-documento .commento-nuovo{margin:0 0 var(--spazio-3);padding:var(--spazio-2) var(--spazio-3);border:1px solid var(--accento);border-radius:var(--raggio-menu);background:var(--tinta)}
.modifica-documento .commento-nuovo textarea{display:block;width:100%;box-sizing:border-box;resize:vertical;border:1px solid var(--bordo);border-radius:var(--raggio-riga);padding:var(--spazio-2);font:inherit;font-size:var(--testo-medio);color:var(--inchiostro);background:var(--bianco)}
.modifica-documento .commento-nuovo .gesti{display:flex;justify-content:flex-end;gap:var(--spazio-2);margin-top:var(--spazio-2)}
.modifica-documento .testa-revisioni.commento-risposto{border-bottom:1px solid var(--bordo);background:var(--tinta);color:var(--inchiostro)}
.modifica-documento .barra-modifica{flex:none;display:flex;align-items:center;gap:var(--spazio-2);padding:var(--spazio-2) var(--spazio-3);border-top:1px solid var(--bordo);background:var(--bianco)}
.modifica-documento .barra-modifica .spazio{flex:1}
/* IL DOCUMENTO CHE NASCE A DESTRA — [19/09/2026, sera], STATO.md §89: lo stesso foglio dell'editor, in scrittura, col cursore del flusso */
.documento-in-scrittura .area-modifica{flex:1;min-height:0;overflow:auto;background:var(--superficie-2);padding:var(--pannello-padding-pdf) var(--pannello-padding-pdf) var(--spazio-6)}
.documento-in-scrittura .foglio-in-scrittura{background:var(--bianco);border-radius:var(--raggio-foglio);box-shadow:var(--ombra-foglio);padding:var(--foglio-modifica-padding);min-height:var(--pdf-altezza-minima);font-size:var(--testo-medio);line-height:var(--interlinea-modifica);color:var(--inchiostro);overflow-wrap:anywhere}
.documento-in-scrittura .foglio-in-scrittura h1,.documento-in-scrittura .foglio-in-scrittura h2{font-size:var(--testo-sottotitolo);font-weight:var(--peso-forte);margin:0 0 var(--spazio-3)}
.documento-in-scrittura .foglio-in-scrittura h3,.documento-in-scrittura .foglio-in-scrittura h4{font-size:var(--testo-medio);font-weight:var(--peso-forte);margin:var(--spazio-4) 0 var(--spazio-2)}
.documento-in-scrittura .foglio-in-scrittura p{margin:0 0 var(--spazio-2)}
.documento-in-scrittura .foglio-in-scrittura ul,.documento-in-scrittura .foglio-in-scrittura ol{margin:0 0 var(--spazio-2);padding-left:var(--spazio-5)}
.documento-in-scrittura .foglio-in-scrittura table{width:100%;border-collapse:collapse;font-size:var(--testo-nota);margin:0 0 var(--spazio-3)}
.documento-in-scrittura .foglio-in-scrittura th{background:var(--superficie);text-align:left;font-weight:var(--peso-forte);padding:var(--spazio-1) var(--spazio-2);border:1px solid var(--bordo)}
.documento-in-scrittura .foglio-in-scrittura td{padding:var(--spazio-1) var(--spazio-2);border:1px solid var(--bordo)}
.documento-in-scrittura .foglio-in-scrittura blockquote{margin:0 0 var(--spazio-2);padding-left:var(--spazio-3);border-left:2px solid var(--bordo);color:var(--inchiostro-2)}
.documento-in-scrittura .foglio-in-scrittura .vuoto{color:var(--inchiostro-3)}
.documento-in-scrittura .foglio-in-scrittura .stesura-interrotta{margin-top:var(--spazio-3);font-size:var(--testo-nota)}
.allegati-detti .file-allegato.documento-scritto .tipo{background:var(--accento);color:var(--bianco)}
/* LE REVISIONI DI UNA VERSIONE — [18/09/2026]: la stessa finestra dell'editor, in lettura, coi segni di Word */
.modifica-documento .versioni-editor a.versione{color:var(--accento);text-decoration:none}
.modifica-documento .versioni-editor a.versione:hover{text-decoration:underline}
.modifica-documento .versioni-editor a.versione.ultima{color:var(--accento-forte)}
.revisioni-documento .testa-revisioni{flex:none;padding:var(--spazio-2) var(--pannello-padding-pdf);border-bottom:1px solid var(--bordo);font-size:var(--testo-nota);color:var(--inchiostro-2)}
.revisioni-documento .testa-revisioni b{color:var(--inchiostro)}
.revisioni-documento .nota-revisioni{color:var(--inchiostro-2)}
.revisioni-documento .parte{padding-right:0}
.foglio-revisioni ins.rev{text-decoration:underline;text-decoration-color:var(--revisione-entrata);color:var(--revisione-entrata);background:var(--revisione-entrata-fondo)}
.foglio-revisioni del.rev{text-decoration:line-through;text-decoration-color:var(--revisione-uscita);color:var(--revisione-uscita);background:var(--revisione-uscita-fondo)}
.foglio-revisioni .parte.rev-aggiunta,.foglio-revisioni .parte.rev-tolta,.foglio-revisioni .parte.rev-cambiata{border-left:3px solid var(--revisione-entrata);padding-left:var(--spazio-2);margin-left:calc(-1 * var(--spazio-2) - 3px)}
.foglio-revisioni .parte.rev-tolta{border-left-color:var(--revisione-uscita)}
.foglio-revisioni tr.rev-aggiunta td{background:var(--revisione-entrata-fondo)}
.foglio-revisioni tr.rev-tolta td{background:var(--revisione-uscita-fondo)}
/* I RIQUADRI DEI DOCUMENTI CITATI (le fonti, le bozze, il fascicolo) */
.riquadro{background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:10px 14px var(--spazio-3)}
.riquadro>summary{list-style:none;display:flex;align-items:flex-start;gap:var(--spazio-2);cursor:pointer;user-select:none}
.riquadro>summary::-webkit-details-marker{display:none}
.riquadro>summary .caret{flex:none;margin-top:4px;color:var(--inchiostro-3);transition:transform var(--rapido) var(--curva-standard)}
.riquadro[open]>summary .caret{transform:rotate(90deg)}
.riquadro>summary .testi{flex:1;min-width:0}
.riquadro>summary .titolo{font-size:var(--testo-tabella);line-height:1.35;font-weight:var(--peso-normale);color:var(--inchiostro-2)}
.riquadro[open]>summary .titolo{font-weight:var(--peso-forte);color:var(--inchiostro)}
.riquadro>summary .meta{font-size:var(--testo-nota);color:var(--inchiostro-3);line-height:1.4}
.riquadro .contenuto{margin-top:var(--spazio-3);font-size:var(--testo-medio);line-height:var(--interlinea-corpo)}
.riquadro .griglia{display:grid;gap:var(--spazio-1) var(--spazio-3);font-size:var(--testo-medio);font-variant-numeric:tabular-nums}
.riquadro .griglia .k{color:var(--inchiostro-3)}
.riquadro .norma{font-size:var(--testo-barra);line-height:var(--interlinea-operatore);margin:0;white-space:pre-wrap;color:var(--inchiostro-2)}
.riquadro .lettera{font-size:var(--testo-barra);line-height:var(--interlinea-operatore)}
.riquadro .lettera p{margin:0 0 10px}
.riquadro .riga-evidenziata{background:var(--tinta);font-weight:var(--peso-forte);border-radius:var(--raggio-etichetta)}
.riquadro .tabella{display:grid;gap:0 10px;padding:6px var(--spazio-2);border-radius:var(--raggio-puntini);font-variant-numeric:tabular-nums;font-size:var(--testo-medio)}
.riquadro .intestazione-tabella{font-size:var(--testo-piccolo);font-weight:var(--peso-forte);color:var(--inchiostro-2);padding:0 var(--spazio-2) 5px}
.riquadro .piede-riquadro{display:flex;align-items:center;justify-content:space-between;gap:var(--spazio-3);margin-top:14px}
.riquadro img{max-width:100%;border-radius:var(--raggio-puntini)}
.riquadro .documento-html{font-size:var(--testo-medio);line-height:var(--interlinea-corpo);max-height:420px;overflow:auto}
.riquadro .documento-html table{border-collapse:collapse;font-size:var(--testo-piccolo);border:0;border-radius:0}
.riquadro .documento-html td,.riquadro .documento-html th{padding:3px var(--spazio-2) 3px 0;border-bottom:1px solid var(--bordo-tabella);text-align:left;background:transparent}
.riquadro .documento-html h1,.riquadro .documento-html h2,.riquadro .documento-html h3{font-size:var(--testo-tabella);margin:var(--spazio-2) 0 var(--spazio-1)}
/* LA SCHEDA DEL CLIENTE NUOVO nel pannello: la zona tratteggiata, i campi alti 44 raggio 12, «Annulla» e «Carica» */
.scheda-nuova .modale{position:static}
.scheda-nuova .riquadro{padding:0;border:0;box-shadow:none;background:transparent}
.scheda-nuova h2{font-size:var(--testo-titolo-sezione);margin:var(--spazio-4) 0 var(--spazio-2)}
.scheda-nuova .spiega,.scheda-nuova .rifiuti{font-size:var(--testo-medio);color:var(--inchiostro-2);margin:0 0 var(--spazio-3)}
.scheda-nuova .campo{display:flex;flex-direction:column;gap:6px;margin:0 0 18px}
.scheda-nuova .campo label{font-size:var(--testo-medio);font-weight:var(--peso-forte);color:var(--inchiostro-2)}
.scheda-nuova .campo input{width:100%;height:var(--campo-nuovo-altezza);padding:0 14px;font:inherit;font-size:var(--testo-tabella);background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-campo);color:var(--inchiostro);transition:border-color var(--rapido) var(--curva-rapido),box-shadow var(--rapido) var(--curva-rapido)}
.scheda-nuova .campo input:focus{border-color:var(--accento-chiaro);box-shadow:var(--anello-focus)}
.scheda-nuova .campo.rifiutato input{border-color:var(--pericolo)}
.scheda-nuova .campo .perche{font-size:var(--testo-nota);color:var(--pericolo)}
.scheda-nuova .gesti{display:flex;justify-content:flex-end;gap:var(--spazio-2);margin:var(--spazio-1) 0 0}
.scheda-nuova .gesti button{display:inline-flex;align-items:center;height:var(--bottone-nuovo-altezza);padding:0 var(--spazio-4);border-radius:var(--raggio-pillola);border:1px solid var(--bordo);background:var(--bianco);color:var(--inchiostro);font:inherit;font-size:var(--testo-bottone);font-weight:var(--peso-forte);cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido)}
.scheda-nuova .gesti button:hover{background:var(--superficie)}
.scheda-nuova .gesti button.fatto{background:var(--accento);color:var(--bianco);border-color:var(--accento);padding:0 18px}
.scheda-nuova .gesti button.fatto:hover{background:var(--accento-forte)}
/* LA SCHEDA DEL CLIENTE A GRUPPI: il titolo del gruppo 12/600 inchiostro 2, righe 128 + resto, l'etichetta 12,5, il valore 14, la nota «letto in…» 11,5 (12,5) */
.scheda-gruppi .gruppo{margin-top:22px}
.scheda-gruppi .gruppo>h6{font-size:var(--testo-nota);font-weight:var(--peso-forte);color:var(--inchiostro-2);letter-spacing:.04em;text-transform:none;margin:0 0 6px}
.scheda-gruppi .campo-scheda{display:grid;grid-template-columns:var(--scheda-cliente-griglia);gap:var(--spazio-3);padding:10px 0;border-top:1px solid var(--bordo-tabella)}
.scheda-gruppi .campo-scheda .etichetta-campo{font-size:var(--testo-piccolo);color:var(--inchiostro-2);padding-top:1px;text-transform:none;letter-spacing:0;font-weight:var(--peso-normale)}
.scheda-gruppi .campo-scheda .valore-campo{font-size:var(--testo-tabella);text-wrap:pretty;min-width:0}
.scheda-gruppi .campo-scheda .nota-campo{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:2px 0 0}
/* I DATI DELLA SCHEDA IN CARTE — [24/09/2026, sera], §99.23 dello stato: i gruppi su due colonne che si incastrano, dentro la carta i dati a due a due, gli elenchi per intero */
.scheda-dati{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--spazio-4);align-items:start;margin:var(--spazio-5) 0 var(--spazio-7)}
.scheda-dati .scheda-gruppi{margin:0}
.scheda-dati .gruppo{margin:0;background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:var(--spazio-4)}
.scheda-dati .gruppo>h6{margin:0 0 var(--spazio-3);font-size:var(--testo-nota);font-weight:var(--peso-forte);color:var(--inchiostro-2);letter-spacing:.06em;text-transform:uppercase}
.scheda-dati .gruppo-campi{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--spazio-3) var(--spazio-4)}
.scheda-dati .campo-scheda{display:block;padding:0;border:0;min-width:0}
.scheda-dati .campo-scheda:has(.valore-lungo){grid-column:1/-1}
.scheda-dati .campo-scheda .etichetta-campo{font-size:var(--testo-nota);color:var(--inchiostro-3);padding:0;margin:0 0 2px}
.scheda-dati .campo-scheda .valore-campo{font-size:var(--testo-tabella);font-weight:var(--peso-forte);color:var(--inchiostro);overflow-wrap:anywhere;text-wrap:pretty}
.scheda-dati .valore-lungo{display:block;font-weight:var(--peso-normale);line-height:1.55}
.scheda-dati .campo-scheda .nota-campo{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:2px 0 0;line-height:1.35}
.scheda-dati .campo-scheda .nota-campo{display:none}
.scheda-dati .provenienze-carta{margin:var(--spazio-3) 0 0;padding-top:var(--spazio-2);border-top:1px solid var(--bordo-tabella)}
.scheda-dati .provenienza-carta{margin:0;font-size:var(--testo-nota);line-height:1.45;color:var(--inchiostro-3)}
.scheda-dati .provenienza-carta+.provenienza-carta{margin-top:4px}
.scheda-dati .provenienza-di{color:var(--inchiostro-2)}
/* «COMPLETA LA SCHEDA» — la stessa griglia dei campi della scheda: l'etichetta a
   sinistra, il campo a destra e sotto, in nota, che cosa si sta dichiarando. */
.modulo-completa .campo-scheda{display:grid;grid-template-columns:var(--scheda-cliente-griglia);gap:var(--spazio-3);padding:10px 0;border-top:1px solid var(--bordo-tabella)}
.modulo-completa .campo-scheda .etichetta-campo{font-size:var(--testo-piccolo);color:var(--inchiostro-2);padding-top:7px;font-weight:var(--peso-normale)}
.modulo-completa select,.modulo-completa input[type=text]{font:inherit;font-size:var(--testo-tabella);height:var(--linguetta-altezza);padding:0 10px;background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-campo);color:var(--inchiostro);max-width:100%;min-width:220px}
.modulo-completa .nota-riga{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:4px 0 0}
.modulo-completa .azioni-modulo{margin-top:14px}

/* ==========================================================================
   L'ACCESSO — due colonne (1,1fr · 1fr): a sinistra il marchio 22/600 e la
   frase in 300 col bagliore che respira; a destra il modulo max 360, i campi
   alti 48 raggio 14 con l'occhio, «Accedi» a pillola 48, il codice a sei
   cifre 56 alto e 24 px spaziato.
   ========================================================================== */
body.accesso #app{display:grid;grid-template-columns:var(--accesso-griglia);height:100%;animation:dissolvenza var(--dissolvenza-accesso) var(--curva-rapido) both}
/* entrando, l'app si dissolve in 300 ms come l'accesso (README, movimento §14) */
body.app.appena-entrato .barra-laterale,body.app.appena-entrato .centro,body.app.appena-entrato .pannello-destro{animation:dissolvenza var(--dissolvenza-accesso) var(--curva-rapido) both}
.accesso-sinistra{position:relative;overflow:hidden;display:flex;align-items:center;padding:0 8vw;background:var(--sfondo)}
.accesso-sinistra .bagliore{left:55%;top:50%;width:var(--bagliore-accesso-larghezza);height:var(--bagliore-accesso-altezza);transform:translate(-50%,-50%);opacity:1}
.accesso-sinistra .retino{display:none}
.accesso-sinistra .dentro{position:relative;max-width:560px}
.accesso-sinistra .marchio{font-size:var(--testo-marchio-accesso);font-weight:var(--peso-forte);letter-spacing:var(--spaziatura-marchio);line-height:1.1}
.accesso-sinistra .frase{margin:var(--spazio-7) 0 0;font-size:var(--testo-frase-accesso);font-weight:var(--peso-leggero);line-height:var(--interlinea-frase-accesso);letter-spacing:var(--spaziatura-frase-accesso);color:var(--inchiostro);text-wrap:pretty}
/* LA RIGA SOTTO LA FRASE DELL'ACCESSO — `[10/09/2026]`, mandato §3: Inchiostro 2
   a 15,5, sotto la frase grande. */
.accesso-destra{display:flex;align-items:center;justify-content:center;padding:var(--spazio-10)}
.accesso-destra form{width:100%;max-width:var(--modulo-accesso);display:flex;flex-direction:column;gap:18px}
/* il modulo dell'accesso non ha un titolo (README); le altre videate — il codice, l'attivazione, il ripristino — dicono che cosa chiedono */
.accesso-destra h3{margin:0 0 var(--spazio-2);font-size:var(--testo-titolo-sezione);font-weight:var(--peso-forte);line-height:var(--interlinea-titolo-sezione);letter-spacing:var(--spaziatura-titolo-sezione)}
.accesso-destra form[action="/accesso"] h3{display:none}
.accesso-destra .field{display:flex;flex-direction:column;gap:6px}
.accesso-destra .field>label{margin:0;font-size:var(--testo-medio);font-weight:var(--peso-forte);color:var(--inchiostro-2)}
.accesso-destra .input{height:var(--campo-accesso-altezza);border-radius:var(--raggio-menu);font-size:var(--testo-corpo)}
.accesso-destra .btn-primary{height:var(--campo-accesso-altezza);border-radius:var(--raggio-pillola);font-size:var(--testo-corpo);font-weight:var(--peso-forte);margin:0}
.accesso-destra .btn-secondary{height:var(--campo-accesso-altezza);border-radius:var(--raggio-pillola);font-size:var(--testo-corpo)}
.accesso-destra .regime{margin:0;font-size:var(--testo-piccolo);line-height:var(--interlinea-corpo);color:var(--inchiostro-3)}
.accesso-destra .errore{margin:0;font-size:var(--testo-piccolo);color:var(--pericolo)}
.accesso-destra .codice{animation:msgIn var(--breve) var(--curva-decelera) both}
.accesso-destra .codice .input{height:var(--codice-altezza);font-size:var(--testo-codice-accesso);letter-spacing:var(--spaziatura-codice-accesso);text-align:center;font-variant-numeric:tabular-nums}
.accesso-destra .codice .con-occhio>.occhio{top:calc((var(--codice-altezza) - var(--bottone-icona)) / 2)}
.con-occhio{position:relative;display:block}
.con-occhio>.input{padding-right:var(--spazio-10)}
.con-occhio>.occhio{position:absolute;right:6px;top:6px;width:var(--bottone-icona);height:var(--bottone-icona);display:grid;place-items:center;background:none;border:0;border-radius:var(--raggio-riga);color:var(--inchiostro-2);cursor:pointer;padding:0;transition:background-color var(--rapido) var(--curva-rapido),color var(--rapido) var(--curva-rapido)}
.con-occhio>.occhio:hover{color:var(--inchiostro);background:var(--passaggio-bottone)}
.nota-campo{margin:0;font-size:var(--testo-nota);line-height:1.4;color:var(--inchiostro-3)}
.altre-vie{display:flex;gap:14px;justify-content:center;margin-top:0}
.altre-vie>.collegamento{background:none;border:0;padding:0;font:inherit;font-size:var(--testo-medio);color:var(--accento);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.altre-vie>.collegamento:hover{color:var(--accento-forte)}

/* — le vecchie strutture dei turni (le bande della scheda, le tabelle del motore), ristilate — */
.scheda{display:flex;flex-direction:column;gap:14px}
.scheda h2{font-size:var(--testo-risposta);margin:0}
.scheda .domanda{display:none}
.scheda section{display:flex;flex-direction:column;gap:6px}
.scheda h3{font-size:var(--testo-piccolo);letter-spacing:var(--spaziatura-etichetta);text-transform:uppercase;color:var(--inchiostro-2);font-weight:var(--peso-forte);margin:0 0 2px}
.scheda footer{display:flex;flex-direction:column;gap:var(--spazio-1);font-size:var(--testo-medio);color:var(--inchiostro-2);border-top:1px solid var(--bordo-tabella);padding-top:var(--spazio-2)}
.scheda .r{font-size:var(--testo-risposta);line-height:var(--interlinea-risposta)}
.scheda footer .r{font-size:var(--testo-medio)}
.turno .vuoto,.turno .nota,.turno .tenue{font-size:var(--testo-tabella);color:var(--inchiostro-2);margin:0 0 6px}
/* CHI HA SCRITTO IL TURNO — [12/09/2026], mandato RIFINITURA §1.10: in una chat sotto un cliente, sopra la domanda, piccolo e in Inchiostro 3 */
.turno .chi-ha-scritto{margin:0 0 2px;font-size:var(--testo-nota);color:var(--inchiostro-3);text-align:right}
.turno .capo-blocco,.turno h3.capo,.turno .capo{font-size:var(--testo-piccolo);letter-spacing:var(--spaziatura-etichetta);text-transform:uppercase;color:var(--inchiostro-2);font-weight:var(--peso-forte);margin:10px 0 var(--spazio-1)}
.turno h2{font-size:var(--testo-risposta);font-weight:var(--peso-forte);margin:0 0 var(--spazio-1)}
.turno h3{font-size:var(--testo-tabella);font-weight:var(--peso-forte);margin:var(--spazio-2) 0 var(--spazio-1)}
.turno h4{font-size:var(--testo-medio);font-weight:var(--peso-forte);margin:6px 0 var(--spazio-1)}
.turno dl.dati,.turno dl{display:grid;grid-template-columns:max-content 1fr;gap:var(--spazio-1) 14px;margin:0 0 var(--spazio-2);font-size:var(--testo-tabella)}
.turno dl dt{color:var(--inchiostro-3)}
.turno dl dd{margin:0}
.turno .estratti{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.turno .estratti li{border-left:2px solid var(--bordo);padding-left:var(--spazio-3)}
.turno .estratti .fonte{font-size:var(--testo-nota);color:var(--inchiostro-3);margin:0 0 2px}
.turno .estratti .testo{font-size:var(--testo-tabella);margin:0;line-height:var(--interlinea-corpo);color:var(--inchiostro-2)}
.turno .grado{font-size:var(--testo-nota);background:var(--superficie-2);padding:1px 7px 2px;border-radius:var(--raggio-etichetta);color:var(--inchiostro-2)}
.turno form{margin:0 0 var(--spazio-2)}
.turno form label{font-size:var(--testo-piccolo);color:var(--inchiostro-2);display:block;margin-bottom:5px}
.turno form input[type=text],.turno form input[type=date],.turno form input[type=number],.turno form input:not([type]),.turno form select,.turno form textarea{font:inherit;font-size:var(--testo-tabella);height:var(--linguetta-altezza);padding:0 10px;background:var(--bianco);border:1px solid var(--bordo);border-radius:var(--raggio-campo);color:var(--inchiostro);max-width:100%}
.turno form textarea{height:auto;padding:var(--spazio-2) 10px}
.turno form button,.turno .gesto button,.turno .gesti button,.turno .azione button,.turno a.bottone{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-weight:var(--peso-forte);font-size:var(--testo-medio);line-height:1.2;color:var(--inchiostro);background:var(--bianco);border:1px solid var(--bordo);height:var(--scarica-altezza);padding:0 14px;border-radius:var(--raggio-pillola);text-decoration:none;transition:background-color var(--rapido) var(--curva-rapido)}
.turno form button:hover{background:var(--superficie)}
.turno form button.primario,.turno button[value="va-bene"],.turno form.conferma button,.turno button.si{background:var(--accento);color:var(--bianco);border-color:var(--accento)}
.turno form button.primario:hover,.turno button[value="va-bene"]:hover,.turno form.conferma button:hover{background:var(--accento-forte)}
.turno .rosso,.turno .errore{color:var(--pericolo)}
.turno .verde{color:var(--inchiostro-2)}
.turno .avviso{font-size:var(--testo-tabella);color:var(--inchiostro);font-weight:var(--peso-forte)}
.turno details>summary{cursor:pointer;font-size:var(--testo-tabella);color:var(--accento)}
.turno .fonti-voci li,.turno .righe-lette li{font-size:var(--testo-tabella)}
.turno .matrice{overflow:auto}
.turno .matrice table{width:auto;max-width:none}
.turno .matrice td a{color:var(--accento);text-decoration:none}
.turno .chiedo,.turno .chiede{font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.turno .doc,.turno .documento-caricato,.turno .riquadro-interno,.turno .blocco{border:1px solid var(--bordo);border-radius:var(--raggio-menu);padding:10px 14px;background:var(--bianco);margin:0 0 10px}
.turno img.anteprima,.turno img{max-width:100%;border-radius:var(--raggio-puntini);border:1px solid var(--bordo)}
.turno .controlli li{font-size:var(--testo-tabella)}
.turno .segno{display:inline-block;width:1.2em;color:var(--inchiostro-3)}
.turno .partita{font-size:var(--testo-tabella)}
.turno .prospetto{margin:6px 0 10px}
.turno .riga-evidenziata{background:var(--tinta);font-weight:var(--peso-forte)}
.turno .lento{color:var(--accento)}
.turno .informativa{font-size:var(--testo-tabella)}
.turno .informativa p{margin:0 0 var(--spazio-2)}
.turno .legge-ia{font-size:var(--testo-nota);color:var(--inchiostro-2);border-top:1px solid var(--bordo-tabella);padding-top:6px;margin-top:var(--spazio-2)}
.turno .blocco h4{font-size:var(--testo-piccolo);letter-spacing:var(--spaziatura-etichetta);text-transform:uppercase;color:var(--inchiostro-2);margin:0 0 6px;font-weight:var(--peso-forte)}
.turno .conteggi,.turno .conti{font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.turno .perche{font-size:var(--testo-tabella)}
.turno .marca-blocco{display:inline-flex}
.turno .voci{display:flex;flex-direction:column;gap:6px}
.turno .contesto{font-size:var(--testo-medio);color:var(--inchiostro-2)}
.turno .risultati li{margin-bottom:6px}
.turno .risultati .titolo{font-weight:var(--peso-forte)}
.turno .assente,.turno .manca,.turno .senza-dato{color:var(--inchiostro-2)}
.turno .scheda-cliente{margin:0}
.turno .pannello-fonti .voce{padding:6px 0;border-bottom:1px solid var(--bordo-tabella)}
.turno .aggancio{font-size:var(--testo-medio);color:var(--inchiostro-3)}
.turno p{margin:0 0 var(--spazio-2)}
.turno .scorre{position:static;flex:none;min-height:auto;overflow-x:auto;overflow-y:visible;margin:6px 0 10px;padding:0;animation:none}
.turno .anteprima{display:flex;flex-direction:column;gap:var(--spazio-2);margin:0 0 10px;flex:none}
.turno .anteprima .riscontro{display:flex;align-items:center;gap:var(--spazio-2);flex-wrap:wrap;margin:0;font-size:var(--testo-tabella)}
.turno .anteprima .riscontro strong{font-size:var(--testo-corpo)}
.turno .anteprima img.miniatura{max-height:220px;width:auto;border:1px solid var(--bordo);border-radius:var(--raggio-puntini)}
.turno .anteprima form.togli{margin:0}
.turno .anteprima form.togli button{font-size:var(--testo-nota);height:var(--chip-altezza);padding:0 10px}
.turno ol.controlli{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:var(--spazio-1)}
.turno ol.controlli li{display:grid;grid-template-columns:1.2em 1fr;gap:2px var(--spazio-2);font-size:var(--testo-tabella);line-height:1.45;align-items:baseline}
.turno ol.controlli li .segno{grid-row:1 / span 3;color:var(--inchiostro-3)}
.turno ol.controlli li .nome{font-weight:var(--peso-forte)}
.turno ol.controlli li .nome::after{content:" · "}
.turno ol.controlli li .che{color:var(--inchiostro-2)}
.turno ol.controlli li .dice{grid-column:2}
.turno ol.controlli li .rimedio{grid-column:2;color:var(--inchiostro-2)}
.turno ol.controlli li.fermo .nome{color:var(--inchiostro)}
.turno table.righe-lette{width:auto;min-width:100%;font-size:var(--testo-piccolo);max-width:none}
.turno table.righe-lette th,.turno table.righe-lette td{white-space:nowrap;padding:5px var(--spazio-2) 5px 0;vertical-align:middle}
.turno table.righe-lette td.cert{color:var(--inchiostro-2);font-size:var(--testo-nota)}
.turno table.righe-lette tr.sospetta td.cert{font-weight:var(--peso-forte);color:var(--inchiostro)}
.turno form.correggi{display:flex;gap:var(--spazio-1);align-items:center;margin:0}
.turno form.correggi select,.turno form.correggi input{height:26px;padding:0 6px;font-size:var(--testo-nota);max-width:110px}
.turno form.correggi button{font-size:var(--testo-nota);height:26px;padding:0 var(--spazio-2)}
.turno .doc{margin:0}
.turno .doc h3{font-size:var(--testo-risposta);margin:10px 0 6px}
.turno .doc .richiesta{font-size:var(--testo-tabella);margin:0 0 var(--spazio-2)}
.turno .doc form.conferma{display:flex;gap:var(--spazio-2);flex-wrap:wrap;align-items:center;margin:0 0 10px}
.turno .doc form.conferma label{margin:0}
.turno .doc form.conferma input{max-width:220px}
.turno .doc .confermato{font-size:var(--testo-tabella);margin:0}
.turno .coda h3,.turno .prospetto h3{font-size:var(--testo-risposta);margin:0 0 var(--spazio-2)}
.turno .proposta{display:flex;flex-direction:column;gap:6px;padding:10px 0;border-top:1px solid var(--bordo-tabella)}
.turno .proposta:first-of-type{border-top:0;padding-top:0}
.turno .proposta .faccia .capo{margin:0 0 2px}
.turno .proposta .faccia .dati{margin:0;font-size:var(--testo-corpo);font-variant-numeric:tabular-nums}
.turno .proposta .causale{margin:0;font-size:var(--testo-medio);color:var(--inchiostro-2)}
.turno .proposta .perche{margin:var(--spazio-1) 0 0;font-size:var(--testo-tabella);color:var(--inchiostro-2)}
.turno .proposta .gesti{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.turno .proposta .gesti form{margin:0}
.turno .residuo{padding:6px 0;border-top:1px solid var(--bordo-tabella)}
.turno .residuo:first-of-type{border-top:0}
.turno .residuo .dati{margin:0;font-size:var(--testo-barra);font-variant-numeric:tabular-nums}
.turno .residuo .causale,.turno .residuo .perche{margin:0;font-size:var(--testo-nota);color:var(--inchiostro-2)}
.turno details.chiuse>summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:var(--spazio-3);color:var(--inchiostro)}
.turno details.chiuse>summary::-webkit-details-marker{display:none}
.turno details.chiuse>summary::after{content:"apri";font-size:var(--testo-medio);color:var(--accento)}
.turno details.chiuse[open]>summary::after{content:"chiudi"}
.turno details.chiuse>summary h3{margin:0}
.turno ul.righe-chiuse{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;font-size:var(--testo-barra);font-variant-numeric:tabular-nums}
.turno ul.righe-chiuse li{display:grid;grid-template-columns:48px 84px 1fr 1fr;gap:0 var(--spazio-3);padding:5px var(--spazio-2);border-radius:var(--raggio-puntini)}
.turno ul.righe-chiuse li:hover{background:var(--passaggio-riga)}
.turno ul.righe-chiuse li .come{color:var(--inchiostro-2);font-size:var(--testo-nota)}
.colonna .pannello-fonti{margin:var(--spazio-1) 10px;font-size:var(--testo-medio)}
.colonna .pannello-fonti a{text-decoration:none}

/* ==========================================================================
   IL MOVIMENTO — la specifica del README, punto per punto: i nomi delle
   animazioni; durate e curve stanno sugli elementi, dal tema.
   ========================================================================== */
@keyframes respiro{from{opacity:.72;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}
@keyframes salutoIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes msgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes schedaIn{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes menuIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@keyframes righeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes cursore{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes lineaLavoro{from{transform:translateX(-110%)}to{transform:translateX(360%)}}
@keyframes pulsaMic{from{transform:scale(1);opacity:.55}to{transform:scale(1.9);opacity:0}}
@keyframes dissolvenza{from{opacity:0}to{opacity:1}}
/* «RIDUCI MOVIMENTO»: dal sistema di chi guarda — tutto dura 1 ms e i cicli infiniti si fermano al primo; lo streaming del testo resta. La scelta forzata dal profilo (`data-riduci-movimento` sulla radice) è uscita il 13/09 col menu che la portava, come il tema */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:var(--durata-ridotta)!important;animation-iteration-count:1!important;transition-duration:var(--durata-ridotta)!important}}

/* — la stampa: le fonti in A4 orizzontale, dal pannello — */
@media print{
  body,body.app{display:block;background:var(--bianco);overflow:visible;height:auto}
  .barra-laterale,.centro,.filtri,.pagina-testa .gesti,.btn,.attesa,.comporre,.dialogo-fondo,.contatori,.origini,.pannello-destro .testa{display:none !important}
  .pannello-destro,.pannello-destro .dentro-pannello,.pannello-destro .scorre{position:static;width:auto;overflow:visible;height:auto;display:block;border:0;padding:0}
  .solo-stampa{display:block !important;font-size:var(--testo-nota);color:var(--inchiostro-2);margin-bottom:var(--spazio-3)}
  .tabella-carta{box-shadow:none;border:0}
  .tabella-carta .riga{break-inside:avoid}
  .fonti-tabella .dettaglio{grid-template-columns:1fr}
}
.solo-stampa{display:none}
@media (max-width:1100px){.origini{grid-template-columns:repeat(2,1fr)}.griglia-campi{grid-template-columns:1fr}}

/* — IL REPORT CHAT E ATTIVITÀ — `[09/09/2026]`, mandato REPORT-CHAT-E-ATTIVITÀ §1: la forma del «Traffic Inspector» di ngrok coi componenti del README — la testata, la striscia con l'interruttore e il conto, la scheda dei filtri in carta a tre colonne, la tabella in carta con le nove colonne (griglia dal tema), l'esito col segno delle fonti — */
.report-striscia{display:flex;align-items:center;justify-content:space-between;gap:var(--spazio-3);margin:0 0 var(--spazio-4)}
.report-conto{display:flex;align-items:center;gap:var(--spazio-3);font-size:var(--testo-medio)}
.interruttore{display:inline-flex;align-items:center;gap:var(--spazio-2);height:var(--chip-fonti-altezza);padding:0 var(--spazio-4) 0 var(--spazio-3);border:1px solid var(--bordo);border-radius:var(--raggio-pillola);background:var(--bianco);color:var(--inchiostro);font:inherit;font-size:var(--testo-medio);font-weight:var(--peso-forte);cursor:pointer;transition:background-color var(--rapido) var(--curva-rapido),border-color var(--rapido) var(--curva-rapido)}
.interruttore:hover{background:var(--superficie)}
.interruttore[aria-pressed="false"]{color:var(--inchiostro-2)}
.report-filtri{margin:0 0 var(--spazio-4);padding:var(--spazio-4) var(--spazio-5)}
.report-campi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--spazio-3) var(--spazio-4)}
.report-campi .field>label{margin-bottom:var(--spazio-1)}
.report-campi .input{height:var(--filtro-fonti-altezza);padding:0 var(--spazio-3);font-size:var(--testo-barra);border-radius:var(--raggio-campo)}
.report-date{display:flex;align-items:center;gap:var(--spazio-2)}
.report-testo{display:flex;align-items:center;gap:var(--spazio-3)}
.report-testo .input{flex:1;min-width:0}
.report-esatta{display:inline-flex;align-items:center;gap:6px;font-size:var(--testo-barra);color:var(--inchiostro-2);white-space:nowrap;cursor:pointer}
.report-esatta input{accent-color:var(--accento)}
.report-gesti{display:flex;justify-content:flex-end;gap:var(--spazio-2);margin-top:var(--spazio-4)}
.report-gesti .btn{height:var(--scarica-altezza);padding:0 14px;font-size:var(--testo-medio)}
.report-tabella .intestazione,.report-tabella .riga{grid-template-columns:var(--tabella-report-griglia)}
.report-tabella .intestazione a{color:var(--inchiostro-2);text-decoration:none;display:inline-flex;align-items:center;gap:var(--spazio-1);white-space:nowrap}
.report-tabella .intestazione a:hover,.report-tabella .intestazione a.attiva{color:var(--inchiostro)}
.report-tabella .riga>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.report-tabella .riga .data{font-variant-numeric:tabular-nums}
.report-tabella .riga .turni,.report-tabella .riga .durata,.report-tabella .riga .spesa{font-variant-numeric:tabular-nums}
.report-tabella .riga .titolo{color:var(--inchiostro)}
.report-tabella .riga .titolo .nota-riga{display:block;white-space:normal;margin-top:2px;font-style:normal;font-size:var(--testo-nota);color:var(--inchiostro-2)}
.report-tabella .stato{display:flex;align-items:center;gap:var(--spazio-2)}
.report-tabella .stato::before{content:"";flex:none;width:var(--pallino);height:var(--pallino);border-radius:var(--raggio-tondo);background:var(--da-verificare)}
.report-tabella .stato[data-esito="conclusa"]::before{background:var(--verificata)}
.report-tabella .stato[data-esito="uscita"]::before{background:var(--superata)}
.report-altre{display:flex;align-items:center;gap:var(--spazio-3);margin:var(--spazio-4) 0 0;font-size:var(--testo-medio)}
.report-altre .btn{height:var(--scarica-altezza);padding:0 14px;font-size:var(--testo-medio)}
/* «CHE COSA SI FA» — la sezione in fondo al Report [17/09/2026]: le quattro tabelle in carta, la riga della popolazione */
.report-attivita{margin-top:var(--spazio-7);display:flex;flex-direction:column;gap:var(--spazio-4)}
.report-attivita .pagina-testa{margin-bottom:0}
.report-attivita .sezione-pagina{margin-bottom:0;gap:var(--spazio-3)}
.report-attivita .sezione-pagina h6{margin:0}
.report-attivita .report-attivita-tabella .riga>span.avvolge{white-space:normal;overflow-wrap:anywhere}
.report-attivita .report-attivita-tabella .riga>span.tabulari{font-variant-numeric:tabular-nums;white-space:normal;overflow-wrap:anywhere}
.report-attivita .nota-pagina{margin:0}
.report-attivita .report-attivita-periodo{margin-top:calc(-1 * var(--spazio-2))}
.report-attivita .btn{height:var(--scarica-altezza);padding:0 14px;font-size:var(--testo-medio)}
@media (max-width:1100px){.report-campi{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* LA SCHEDA DEL CLIENTE NUOVO, DALLA CHAT — [20/09/2026], STATO.md §91: i campi compilati
   dal prodotto si leggono; «Modifica» li apre, «Conferma» crea il cliente con quello che c'è. */
.turno .scheda-dalla-chat .campo-censimento{margin:0 0 var(--spazio-2)}
.turno .scheda-dalla-chat .campo-censimento input{width:100%;max-width:420px}
.turno .scheda-dalla-chat .campo-censimento input[readonly]{background:var(--superficie);color:var(--inchiostro);cursor:default}
.turno .scheda-dalla-chat .campo-censimento .attenuato{display:block;font-size:var(--testo-piccolo);color:var(--inchiostro-2);margin-top:4px}
.turno .scheda-dalla-chat .gesti-scheda{display:flex;gap:var(--spazio-2);flex-wrap:wrap;align-items:center;margin-top:var(--spazio-2)}
.turno .scheda-dalla-chat form.conferma button[data-modifica-scheda]{background:var(--bianco);color:var(--inchiostro);border-color:var(--bordo)}
.turno .scheda-dalla-chat form.conferma button[data-modifica-scheda]:hover{background:var(--superficie)}