/* ==========================================================================
   tema.css — LA TAVOLA DEI VALORI DI GESTEA360, IN UN FILE SOLO
   Mandato PROTOTIPO-GEMINI del 07/09/2026, §2: tutti i valori del README del
   pacchetto di Claude Design (`GESTEA360-prototipo-funzionante/pacchetto/`)
   — i colori chiaro e scuro con i loro ruoli, la scala dei caratteri, le
   spaziature a base 4, i raggi, le ombre, le durate e le curve, le misure di
   layout — stanno QUI con i nomi del README, e il resto del prodotto li legge
   per nome: nessun colore, nessuna misura del layout, nessuna durata è
   scritta altrove. `verifica:tema` lo pretende leggendo ogni foglio e ogni
   sorgente che scrive uno stile.

   IL CARATTERE È MANROPE, SERVITO DALLO STUDIO: il file viene dal pacchetto
   `@fontsource-variable/manrope` (licenza SIL Open Font, in
   `MANROPE-LICENZA.txt` accanto) e sta in questa cartella, servito da `/app/`
   come il foglio. Nessuna chiamata a servizi esterni per i caratteri: la
   sala gira su un hotspot, e un carattere che arriva da Google è un carattere
   che può non arrivare.

   IL TEMA CHIARO È QUELLO DEL PROTOTIPO. IL TEMA SCURO ha la stessa mappa,
   riga per riga, e si accende dal sistema (`prefers-color-scheme`): dal
   `[12/09/2026]` (mandato RIFINITURA §1.7, deciso dal committente) non c'è più
   una scelta dal profilo. Dal `[23/09/2026]` (chiesto dal committente) il
   simbolo dell'occhio accanto a «Nascondi barra laterale» fissa lo sfondo
   chiaro o scuro con `data-tema` sulla radice; senza quel gesto la radice non
   porta niente e decide il sistema.

   LA SOLA DIVERGENZA DAL README, DICHIARATA: i corpi sotto 12,5px (etichette
   di sezione 11,5, marche e note 11,5–12, etichetta del tipo 10,5,
   intestazione dell'anteprima 10,5) valgono 12,5 — è la guardia del testo del
   committente (07/09/2026, la leggibilità), ribadita dal mandato §6: «nessun
   testo sotto 12,5 px». La variabile porta il nome del README, il valore
   porta la soglia, e `scratchpad/confronto-design/DIFFERENZE.md` lo scrive.
   ========================================================================== */

/* — il carattere — */
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;src:url(/app/manrope-latin.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;src:url(/app/manrope-latin-ext.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  /* — i colori del tema CHIARO, col ruolo del README — */
  --sfondo:#FBFDFE;
  --superficie:#F4F7FA;
  --superficie-2:#EBF1F5;
  --bordo:#DCE2E7;
  --bordo-tabella:#EBF1F5;
  --inchiostro:#1B222A;
  --inchiostro-2:#5C646D;
  --inchiostro-3:#8C939B;
  --accento:#007B97;
  --accento-forte:#005C73;
  --accento-chiaro:#3AB7CD;
  --tinta:#E2F4F8;
  --tinta-forte:#BEE8F1;
  --bagliore-1:rgba(165,234,255,.55);
  --bagliore-2:rgba(203,246,252,.35);
  --pericolo:#C13C3B;
  /* LE REVISIONI DI UN DOCUMENTO — `[18/09/2026]`: ciò che è entrato (sottolineato) e ciò che è uscito (barrato), come in Word */
  --revisione-entrata:#1F6FB2;
  --revisione-entrata-fondo:#E4F0FB;
  --revisione-uscita:#B03A2E;
  --revisione-uscita-fondo:#FBE7E4;
  --verificata:#33854A;
  --da-verificare:#C48225;
  --superata:#8C939B;
  /* le tinte di passaggio del mouse: righe e voci di menu · bottoni-icona · puntini */
  --passaggio-riga:rgba(27,34,42,.05);
  --passaggio-bottone:rgba(27,34,42,.06);
  --passaggio-puntini:rgba(27,34,42,.07);
  /* il bianco delle superfici rialzate (casella, pannello, schede, menu, foglio del PDF) */
  --bianco:#FFFFFF;
  /* le due tinte che il README nomina senza ruolo: l'etichetta del tipo, il bordo di una scheda al passaggio */
  --etichetta-tipo-sfondo:#E3EAF0;
  --scheda-passaggio-bordo:#C9D2DA;
  /* il bordo della casella al focus e l'anello dei campi */
  --bordo-focus:rgba(0,123,151,.35);
  --anello-focus:0 0 0 3px rgba(0,123,151,.15);
  /* il capo trasparente del bagliore (lo sfondo a opacità zero) */
  --sfondo-trasparente:rgba(251,253,254,0);
  --bagliore:radial-gradient(ellipse at center,var(--bagliore-1) 0%,var(--bagliore-2) 38%,var(--sfondo-trasparente) 72%);
  --selezione:var(--tinta-forte);
  --barra-di-scorrimento:var(--bordo);
  /* le ombre */
  --ombra-casella:0 1px 2px rgba(27,34,42,.05),0 4px 16px rgba(27,34,42,.06);
  --ombra-casella-focus:0 2px 6px rgba(27,34,42,.06),0 12px 32px rgba(27,34,42,.10);
  --ombra-menu:0 12px 40px rgba(27,34,42,.12),0 2px 8px rgba(27,34,42,.06);
  --ombra-foglio:0 1px 2px rgba(27,34,42,.06),0 8px 24px rgba(27,34,42,.06);
  --velo:rgba(27,34,42,.35);

  /* — i caratteri — */
  --carattere:Manrope,"Plus Jakarta Sans",Inter,-apple-system,"Segoe UI",system-ui,sans-serif;
  --peso-leggero:300;
  --peso-normale:400;
  --peso-forte:600;
  --testo-saluto:clamp(36px,2.6vw,44px);
  --interlinea-saluto:1.15;
  --spaziatura-saluto:-.01em;
  --testo-sotto-saluto:clamp(20px,1.35vw,24px);
  --testo-frase-accesso:clamp(24px,1.9vw,32px);
  --interlinea-frase-accesso:1.3;
  --spaziatura-frase-accesso:-.005em;
  --testo-titolo-pagina:30px;
  --interlinea-titolo-pagina:1.2;
  --spaziatura-titolo-pagina:-.01em;
  --testo-titolo-sezione:20px;
  --interlinea-titolo-sezione:1.3;
  --spaziatura-titolo-sezione:-.005em;
  --testo-titolo-notizia:17px;
  --interlinea-titolo-notizia:1.35;
  --testo-marchio-accesso:22px;
  --testo-marchio-barra:17px;
  --spaziatura-marchio:.01em;
  --testo-risposta:15.5px;
  --interlinea-risposta:1.6;
  --testo-casella:15.5px;
  --interlinea-casella:1.4;
  --testo-operatore:15px;
  --interlinea-operatore:1.55;
  --testo-corpo:15px;
  --interlinea-corpo:1.5;
  --testo-tabella:14px;
  --testo-barra:13.5px;
  --testo-bottone:13.5px;
  --testo-scheda-nome:13.5px;
  --testo-scheda-tipo:12.5px;
  --testo-etichetta-sezione:12.5px;
  --spaziatura-etichetta:.06em;
  --testo-nota:12.5px;
  --testo-marca:12.5px;
  --testo-etichetta-tipo:12.5px;
  --testo-anteprima:12.5px;
  --interlinea-anteprima:1.5;
  --testo-anteprima-titolo:18px;
  --testo-anteprima-intestazione:12.5px;
  --spaziatura-anteprima-intestazione:.04em;
  /* le misure che il README scrive fra i componenti: 14 (sottotitolo di pagina, testa del pannello, tabella delle fonti), 13 (chip delle fonti, Scarica, linguette, piè del PDF, etichette dei campi), 12,5 (codice, intestazione della tabella, chip, avatar, note) */
  --testo-sottotitolo:14px;
  --testo-medio:13px;
  --testo-piccolo:12.5px;
  --testo-codice-accesso:24px;
  --spaziatura-codice-accesso:.45em;
  --testo-anello:12.5px;
  --soglia-testo:12.5px;

  /* — le spaziature, a base 4 — */
  --spazio-1:4px;--spazio-2:8px;--spazio-3:12px;--spazio-4:16px;--spazio-5:20px;--spazio-6:24px;--spazio-7:28px;--spazio-8:32px;--spazio-9:40px;--spazio-10:48px;
  --barra-padding-contenuto:12px;
  --barra-padding-testa:20px;
  --riga-altezza:36px;
  --intestazione-sezione-altezza:32px;
  --spazio-tra-sezioni:14px;
  --rientro-sotto-cliente:22px;
  --centro-padding-sopra:32px;
  --centro-padding-lati:24px;
  --spazio-tra-messaggi:28px;
  --spazio-tra-blocchi:14px;
  --spazio-tra-schede:8px;
  --casella-padding:8px;
  --casella-altezza-minima:56px;
  --casella-bottone:40px;
  --casella-nota-distanza:10px;
  --casella-dal-bordo:18px;
  --saluto-sopra-casella:40px;
  --pagina-padding-sopra:48px;
  --pagina-padding-lati:32px;
  --pannello-testa-altezza:60px;
  --pannello-testa-padding:0 12px 0 20px;
  --pannello-padding-scheda:24px;
  --pannello-padding-pdf:20px;
  --pannello-padding-excel:16px;

  /* — i raggi — */
  --raggio-pillola:999px;
  --raggio-casella:28px;
  --raggio-menu:14px;
  --raggio-menu-piu:16px;
  --raggio-campo:12px;
  --raggio-riga:10px;
  --raggio-voce:9px;
  --raggio-puntini:8px;
  --raggio-icona-scheda:9px;
  --raggio-etichetta:6px;
  --raggio-foglio:4px;
  --raggio-bolla:22px;
  --raggio-tabella-anteprima:8px;
  --raggio-tabella-excel:10px;
  --raggio-zona:16px;
  --raggio-tondo:50%;

  /* — le durate e le curve — */
  --rapido:150ms;
  --breve:200ms;
  --pannello-durata:280ms;
  --saluto-durata:300ms;
  --saluto-rimozione:320ms;
  --casella-durata:350ms;
  --bagliore-durata:7s;
  --bagliore-dissolvenza:400ms;
  --cursore-durata:1s;
  --lavoro-durata:1.2s;
  --lavoro-attesa:900ms;
  --microfono-durata:1.2s;
  --dissolvenza-pagina:200ms;
  --dissolvenza-accesso:300ms;
  --cambio-pagina:150ms;
  --scalino-righe:20ms;
  --scalino-righe-massimo:8;
  --colonna-icone-ritardo:50ms;
  --tick-streaming:34ms;
  --dettatura-provvisoria:2000ms;
  --durata-ridotta:1ms;
  --tick-tabella:6;
  --tick-scheda:3;
  --curva-rapido:ease-out;
  --curva-decelera:cubic-bezier(0,0,.2,1);
  --curva-standard:cubic-bezier(.2,0,0,1);
  --curva-lavoro:cubic-bezier(.4,0,.2,1);
  --curva-respiro:ease-in-out;

  /* — le misure di layout — */
  --barra-aperta:288px;
  --barra-icone:64px;
  --colonna-messaggi:920px;
  --casella-nuova:760px;
  --casella-conversazione:920px;
  --risposta:820px;
  --tabella-risposta:640px;
  --bolla:72%;
  --scheda-file:280px;
  --scheda-file-risposta:300px;
  --pannello:480px;
  --menu-contestuale:232px;
  --menu-piu:260px;
  --pagina:920px;
  --guida:720px;
  --modulo-accesso:360px;
  --pannello-largo:min(48%,900px);
  --altezza-casella:132px;
  --tabella-fonti-prodotto:minmax(0,1fr) 170px 120px 150px;
  /* LA DATA CON L'ORA E L'ESITO NON SI ACCORCIANO MAI — `[09/09/2026]`, dalla prova dal vivo sulla
     4361: a 920 la prima colonna mostrava «09/09/2026 …» senza l'ora e l'esito «conclus…». Le due
     hanno una larghezza fissa; le altre si dividono il resto e si accorciano coi puntini, col testo
     intero al passaggio del mouse. */
  --tabella-report-griglia:8.75rem 1fr 1fr 1.2fr 1.8fr 5.5rem .4fr .6fr;
  /* misure del prodotto che il README non nomina, sempre per nome */
  --centro-minimo:360px;
  /* L'EDITOR DEL DOCUMENTO È UNA FINESTRA MODALE — `[17/09/2026, sera]`: larga quasi quanto lo
     schermo, alta quasi tutta la finestra, col velo dietro. */
  --modale-documento:min(96vw,1080px);
  --modale-documento-altezza:94vh;
  --dettaglio-pannello:260px;
  --pillola-massima:260px;
  --testo-norma-altezza:360px;
  --prospetto-larghezza:480px;
  --cella-excel-massima:260px;
  --bagliore-larghezza:min(980px,90%);
  --bagliore-altezza:600px;
  --bagliore-accesso-larghezza:820px;
  --bagliore-accesso-altezza:560px;
  --bottone-icona:36px;
  --bottone-icona-grande:40px;
  --avatar:32px;
  --ricerca-altezza:38px;
  --nuova-chat-altezza:40px;
  --icona:20px;
  --icona-media:18px;
  --icona-piccola:16px;
  --icona-minima:14px;
  --icona-piu:22px;
  --icona-scheda:32px;
  --icona-scheda-casella:28px;
  --icona-scheda-dentro:18px;
  --puntini-casella:28px;
  --campo-accesso-altezza:48px;
  --codice-altezza:56px;
  --campo-nuovo-altezza:44px;
  --bottone-nuovo-altezza:40px;
  --scarica-altezza:34px;
  --linguetta-altezza:36px;
  --linea-lavoro-larghezza:120px;
  --linea-lavoro-altezza:2px;
  --linea-lavoro-segmento:40%;
  --cursore-larghezza:8px;
  --cursore-altezza:15px;
  --pallino:8px;
  --chip-altezza:28px;
  --chip-notizia-altezza:26px;
  --chip-fonti-altezza:32px;
  --filtro-fonti-altezza:36px;
  --pdf-altezza-minima:620px;
  /* IL DOCUMENTO SI MODIFICA A DESTRA — [16/09/2026], mandato DOCUMENTO-A-DESTRA §3.2:
     il foglio dell'editor con i margini del PDF, l'interlinea del corpo, il gesto
     che toglie una parte, la larghezza della riga «versione N di M» in testa. */
  --foglio-modifica-padding:28px 32px;
  --interlinea-modifica:1.5;
  --togli-parte:18px;
  --versione-dice-larghezza:200px;
  --pannello-barra-inferiore:56px;
  --tabella-fonti-griglia:minmax(0,1fr) 170px 120px 150px;
  --tabella-risposta-griglia:1.5fr 1fr 1fr 1fr;
  --scheda-cliente-griglia:128px minmax(0,1fr);
  --accesso-griglia:1.1fr 1fr;
  --centro-minimo:672px;
  --menu-rinomina-altezza:28px;
  --tratto:1.5;
  --tratto-forte:1.75;
  /* L'OCCHIO DELLO SFONDO — [23/09/2026]: dei due occhi del simbolo si vede quello del
     tema che la pagina ha — aperto col chiaro, chiuso (l'occhiolino) con lo scuro. */
  --occhio-aperto:block;
  --occhio-chiuso:none;
}

/* — il tema SCURO: la stessa mappa, dal sistema — [12/09/2026], mandato RIFINITURA §1.7:
   la scelta dal profilo (chiaro · scuro · come il sistema) è uscita per decisione del
   committente, e il tema segue il sistema operativo di chi guarda.
   — E DALL'OCCHIO — [23/09/2026], chiesto dal committente: il simbolo accanto a «Nascondi
   barra laterale» fissa lo sfondo, e il client lo scrive sulla radice (`data-tema`). La
   mappa sta quindi due volte, identica riga per riga: qui, col sistema scuro e senza lo
   sfondo chiaro scelto; e sotto, con lo scuro scelto. `verifica:tema` pretende che le due
   copie coincidano chiave per chiave e valore per valore. */
@media (prefers-color-scheme:dark){
  :root:not([data-tema="chiaro"]){
    --sfondo:#0D1013;
    --superficie:#15191C;
    --superficie-2:#202429;
    --bordo:#2D3135;
    --bordo-tabella:#202429;
    --inchiostro:#E8EBEF;
    --inchiostro-2:#A5ACB2;
    --inchiostro-3:#7B8187;
    --accento:#43BDD3;
    --accento-forte:#7FD6E6;
    --accento-chiaro:#43BDD3;
    --tinta:#04343C;
    --tinta-forte:#004652;
    --bagliore-1:rgba(0,81,101,.55);
    --bagliore-2:rgba(2,53,58,.35);
    --pericolo:#ED756E;
    --verificata:#6FB880;
    --da-verificare:#E8A95C;
    --superata:#7B8187;
    --passaggio-riga:rgba(255,255,255,.06);
    --passaggio-bottone:rgba(255,255,255,.08);
    --passaggio-puntini:rgba(255,255,255,.10);
    --bianco:#15191C;
    --etichetta-tipo-sfondo:#2D3135;
    --scheda-passaggio-bordo:#3A3F44;
    --bordo-focus:rgba(67,189,211,.45);
    --anello-focus:0 0 0 3px rgba(67,189,211,.2);
    --sfondo-trasparente:rgba(13,16,19,0);
    --ombra-casella:0 1px 2px rgba(0,0,0,.3),0 4px 16px rgba(0,0,0,.35);
    --ombra-casella-focus:0 2px 6px rgba(0,0,0,.35),0 12px 32px rgba(0,0,0,.5);
    --ombra-menu:0 12px 40px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.35);
    --ombra-foglio:0 1px 2px rgba(0,0,0,.35),0 8px 24px rgba(0,0,0,.35);
    --velo:rgba(0,0,0,.55);
    --occhio-aperto:none;
    --occhio-chiuso:block;
  }
}
:root[data-tema="scuro"]{
  --sfondo:#0D1013;
  --superficie:#15191C;
  --superficie-2:#202429;
  --bordo:#2D3135;
  --bordo-tabella:#202429;
  --inchiostro:#E8EBEF;
  --inchiostro-2:#A5ACB2;
  --inchiostro-3:#7B8187;
  --accento:#43BDD3;
  --accento-forte:#7FD6E6;
  --accento-chiaro:#43BDD3;
  --tinta:#04343C;
  --tinta-forte:#004652;
  --bagliore-1:rgba(0,81,101,.55);
  --bagliore-2:rgba(2,53,58,.35);
  --pericolo:#ED756E;
  --verificata:#6FB880;
  --da-verificare:#E8A95C;
  --superata:#7B8187;
  --passaggio-riga:rgba(255,255,255,.06);
  --passaggio-bottone:rgba(255,255,255,.08);
  --passaggio-puntini:rgba(255,255,255,.10);
  --bianco:#15191C;
  --etichetta-tipo-sfondo:#2D3135;
  --scheda-passaggio-bordo:#3A3F44;
  --bordo-focus:rgba(67,189,211,.45);
  --anello-focus:0 0 0 3px rgba(67,189,211,.2);
  --sfondo-trasparente:rgba(13,16,19,0);
  --ombra-casella:0 1px 2px rgba(0,0,0,.3),0 4px 16px rgba(0,0,0,.35);
  --ombra-casella-focus:0 2px 6px rgba(0,0,0,.35),0 12px 32px rgba(0,0,0,.5);
  --ombra-menu:0 12px 40px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.35);
  --ombra-foglio:0 1px 2px rgba(0,0,0,.35),0 8px 24px rgba(0,0,0,.35);
  --velo:rgba(0,0,0,.55);
  --occhio-aperto:none;
  --occhio-chiuso:block;
}