/* CCDU Padova · Cruscotto, foglio di stile v1 (30/10/2026)
   Mondo: il fascicolo d'archivio. Carta fredda, inchiostro blu notte, un timbro per lo stato. */

:root {
  --carta: #EEF0EC;
  --carta-scura: #E3E6E0;
  --foglio: #FFFFFF;
  --inchiostro: #16212E;
  --inchiostro-2: #46515E;
  --inchiostro-3: #7B8591;
  --linea: #D5D9D2;
  --linea-forte: #B9BFB6;

  --blu: #1E3A5F;
  --blu-scuro: #152B47;
  --blu-chiaro: #E2E9F3;

  --ocra: #B8651F;
  --ocra-chiaro: #F7E8D9;

  --verde: #2E7D4F;
  --verde-chiaro: #DDF0E4;
  --azzurro: #2A5BD7;
  --azzurro-chiaro: #E0E8FB;
  --ambra: #B8651F;
  --ambra-chiaro: #F7E8D9;
  --grigio: #6B7280;
  --grigio-chiaro: #ECEEF1;
  --rosso: #B3261E;
  --rosso-chiaro: #F8E1DF;
  --viola: #6B4FBB;
  --viola-chiaro: #ECE6F9;

  --display: 'Spectral', Georgia, 'Times New Roman', serif;
  --testo: 'Public Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'DM Mono', Menlo, Consolas, monospace;

  --raggio: 10px;
  --raggio-piccolo: 6px;
  --lato-l: 224px;
  --ombra: 0 1px 2px rgba(22, 33, 46, .06), 0 8px 24px rgba(22, 33, 46, .06);
  --ombra-pannello: -12px 0 40px rgba(22, 33, 46, .18);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--carta);
  color: var(--inchiostro);
  font-family: var(--testo);
  font-size: 14px;
  line-height: 1.45;
  font-feature-settings: 'tnum' 1;
}
h1, h2, h3 { font-family: var(--display); font-weight: 600; margin: 0; letter-spacing: -0.01em; color: var(--inchiostro); }
h1 { font-size: 30px; line-height: 1.1; }
h2 { font-size: 19px; line-height: 1.2; }
h3 { font-size: 16px; }
p { margin: 0; }
a { color: var(--blu); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--blu-scuro); }
button { font: inherit; color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--blu); outline-offset: 2px; }

.mono { font-family: var(--mono); font-size: 0.95em; }
.nota { color: var(--inchiostro-3); font-size: 12.5px; }
.sopratitolo { font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--inchiostro-3); font-weight: 600; margin-bottom: 6px; }

/* ---------- Bottoni ---------- */
.btn {
  appearance: none; border: 1px solid var(--linea-forte); background: var(--foglio); color: var(--inchiostro);
  border-radius: var(--raggio-piccolo); padding: 8px 14px; font-weight: 500; cursor: pointer; line-height: 1.2;
  transition: background .15s, border-color .15s, transform .08s;
}
.btn:hover { background: var(--carta); border-color: var(--inchiostro-3); }
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: .55; cursor: wait; }
.btn-primario { background: var(--blu); border-color: var(--blu); color: #fff; }
.btn-primario:hover { background: var(--blu-scuro); border-color: var(--blu-scuro); }
.btn-piccolo { padding: 6px 10px; font-size: 13px; }
.btn-link { border: none; background: transparent; color: var(--blu); padding: 6px 4px; text-decoration: underline; text-underline-offset: 2px; }
.btn-link:hover { background: transparent; color: var(--blu-scuro); }
.btn-stato { border-width: 1.5px; font-weight: 600; }
.btn-stato[data-stato="verificato"] { color: var(--azzurro); border-color: var(--azzurro); }
.btn-stato[data-stato="approvato"] { color: var(--verde); border-color: var(--verde); }
.btn-stato[data-stato="scartato"] { color: var(--rosso); border-color: var(--rosso); }
.btn-stato[data-stato="contattato"] { color: var(--viola); border-color: var(--viola); }
.btn-stato.attivo { color: #fff; }
.btn-stato.attivo[data-stato="verificato"] { background: var(--azzurro); }
.btn-stato.attivo[data-stato="approvato"] { background: var(--verde); }
.btn-stato.attivo[data-stato="scartato"] { background: var(--rosso); }
.btn-stato.attivo[data-stato="contattato"] { background: var(--viola); }

/* ---------- Moduli ---------- */
.modulo label { display: block; font-weight: 600; font-size: 12.5px; margin: 14px 0 6px; color: var(--inchiostro-2); }
.modulo input[type="text"], .modulo input[type="email"], .modulo input[type="search"], .modulo textarea, .modulo select,
.filtri select, .filtri input {
  width: 100%; border: 1px solid var(--linea-forte); background: var(--foglio); border-radius: var(--raggio-piccolo);
  padding: 9px 11px; font: inherit; color: var(--inchiostro);
}
.modulo textarea { resize: vertical; min-height: 64px; }
.modulo input:focus, .modulo textarea:focus, .modulo select:focus, .filtri select:focus, .filtri input:focus { outline: 2px solid var(--blu); outline-offset: 0; border-color: var(--blu); }
.modulo fieldset { border: 1px solid var(--linea); border-radius: var(--raggio-piccolo); padding: 10px 12px 12px; margin: 14px 0 0; }
.modulo legend { font-weight: 600; font-size: 12.5px; color: var(--inchiostro-2); padding: 0 6px; }
.caselle { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 14px; }
.caselle label { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 500; font-size: 13.5px; color: var(--inchiostro); cursor: pointer; }
.caselle input { width: 16px; height: 16px; accent-color: var(--blu); margin: 0; }
input.codice { font-family: var(--mono); font-size: 26px; letter-spacing: .35em; text-align: center; padding: 12px; }

/* ---------- Toast ---------- */
.toast {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%);
  background: var(--inchiostro); color: #fff; padding: 11px 16px; border-radius: 8px; font-size: 13.5px;
  box-shadow: var(--ombra); z-index: 100; max-width: min(92vw, 520px);
}
.toast.errore { background: var(--rosso); }
.toast.ok { background: var(--verde); }

/* ---------- Accesso ---------- */
.accesso { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.accesso-card {
  width: 100%; max-width: 400px; background: var(--foglio); border-radius: 14px; padding: 32px 28px 28px;
  box-shadow: var(--ombra); border-top: 4px solid var(--blu);
}
.accesso-titolo { font-size: 26px; margin: 18px 0 8px; }
.accesso-testo { color: var(--inchiostro-2); margin-bottom: 6px; }
.accesso-nota { color: var(--inchiostro-2); margin-top: 10px; }
.accesso .btn-primario { width: 100%; margin-top: 16px; padding: 11px; }
.accesso .btn-link { width: 100%; margin-top: 8px; }

/* ---------- Marchio ---------- */
.marchio { display: flex; flex-direction: column; line-height: 1.05; }
.marchio-sigla { font-family: var(--display); font-weight: 600; font-size: 24px; letter-spacing: .06em; color: var(--blu); }
.marchio-sede { font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--inchiostro-3); margin-top: 4px; font-weight: 600; }
.marchio-grande .marchio-sigla { font-size: 34px; }

/* ---------- Struttura app ---------- */
.app { display: grid; grid-template-columns: var(--lato-l) 1fr; min-height: 100vh; }
.lato {
  position: sticky; top: 0; height: 100vh; padding: 24px 18px 18px; background: var(--foglio);
  border-right: 1px solid var(--linea); display: flex; flex-direction: column; gap: 22px;
}
.nav { display: flex; flex-direction: column; gap: 2px; }
.nav-voce {
  text-align: left; border: none; background: transparent; padding: 9px 12px; border-radius: var(--raggio-piccolo);
  font-weight: 500; color: var(--inchiostro-2); cursor: pointer; display: flex; justify-content: space-between; align-items: center;
}
.nav-voce:hover { background: var(--carta); color: var(--inchiostro); }
.nav-voce.attiva { background: var(--blu-chiaro); color: var(--blu); font-weight: 600; }
.nav-n { font-family: var(--mono); font-size: 11.5px; color: var(--inchiostro-3); }
.nav-voce.attiva .nav-n { color: var(--blu); }
.utente { margin-top: auto; display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: var(--inchiostro-3); }
.utente-email { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.utente .btn-link { align-self: flex-start; padding-left: 0; }

.contenuto { padding: 28px 32px 48px; min-width: 0; }
.vista { max-width: 1280px; }

.testata { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.testata-azioni { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.conteggio { font-family: var(--mono); font-size: 15px; color: var(--inchiostro-3); font-weight: 400; margin-left: 6px; vertical-align: middle; }

/* ---------- Cruscotto ---------- */
.griglia-cruscotto { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.scheda { background: var(--foglio); border: 1px solid var(--linea); border-radius: var(--raggio); padding: 18px 20px; box-shadow: 0 1px 0 rgba(22,33,46,.03); display: flex; flex-direction: column; gap: 12px; }
.scheda-larga { grid-column: 1 / -1; }
.scheda-testa { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.numero-grande { font-family: var(--display); font-size: 34px; font-weight: 600; line-height: 1; color: var(--blu); }
.scheda .btn-piccolo { align-self: flex-start; margin-top: auto; }
.coppia { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.coppia-3 { grid-template-columns: repeat(3, 1fr); }
.coppia div { background: var(--carta); border-radius: var(--raggio-piccolo); padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; }
.coppia strong { font-size: 18px; font-family: var(--display); color: var(--inchiostro); }
.coppia strong.mono { font-family: var(--mono); font-size: 14px; font-weight: 500; }
.etichetta { font-size: 11.5px; color: var(--inchiostro-3); text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }

.barre { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.barre li { display: grid; grid-template-columns: minmax(90px, 150px) 1fr 44px; align-items: center; gap: 10px; font-size: 13px; }
.barre .barra-nome { color: var(--inchiostro-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barre .barra { height: 8px; background: var(--carta-scura); border-radius: 4px; overflow: hidden; }
.barre .barra span { display: block; height: 100%; background: var(--blu); border-radius: 4px; min-width: 2px; }
.barre .barra span.c-verde { background: var(--verde); }
.barre .barra span.c-azzurro { background: var(--azzurro); }
.barre .barra span.c-ambra { background: var(--ambra); }
.barre .barra span.c-grigio { background: var(--grigio); }
.barre .barra span.c-rosso { background: var(--rosso); }
.barre .barra span.c-viola { background: var(--viola); }
.barre .barra-n { font-family: var(--mono); text-align: right; color: var(--inchiostro); font-size: 12.5px; }
.barre .vuota { color: var(--inchiostro-3); font-size: 13px; }

/* ---------- Filtri ---------- */
.filtri { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 12px; background: var(--foglio); border: 1px solid var(--linea); border-radius: var(--raggio); padding: 12px 14px; }
.filtri label { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px; font-weight: 600; color: var(--inchiostro-3); text-transform: uppercase; letter-spacing: .05em; min-width: 130px; flex: 0 1 160px; }
.filtri select, .filtri input { padding: 7px 9px; font-size: 13.5px; text-transform: none; letter-spacing: 0; font-weight: 400; }
.filtri .filtro-cerca { flex: 1 1 220px; }
.filtri .btn-link { padding-bottom: 8px; }
.avviso-filtro { background: var(--ocra-chiaro); color: var(--ocra); border-radius: var(--raggio-piccolo); padding: 8px 12px; margin-bottom: 12px; font-size: 13px; display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.avviso-filtro .btn-link { color: var(--ocra); padding: 0; }

/* ---------- Tabelle ---------- */
.tabella-scorri { overflow-x: auto; background: var(--foglio); border: 1px solid var(--linea); border-radius: var(--raggio); }
.tabella { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.tabella th { text-align: left; font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--inchiostro-3); font-weight: 600; padding: 10px 12px; border-bottom: 1px solid var(--linea); white-space: nowrap; background: var(--foglio); }
.tabella td { padding: 9px 12px; border-bottom: 1px solid var(--linea); vertical-align: top; }
.tabella tr:last-child td { border-bottom: none; }
.tabella .num, .tabella td.num { text-align: right; font-family: var(--mono); font-size: 12.5px; white-space: nowrap; }
.tabella-righe tbody tr { cursor: pointer; border-left: 3px solid transparent; transition: background .12s; }
.tabella-righe tbody tr:hover { background: var(--carta); }
.tabella-righe tbody tr.evidenziata { background: var(--blu-chiaro); }
.tabella-righe tbody tr[data-stato="nuovo"] { border-left-color: var(--linea-forte); }
.tabella-righe tbody tr[data-stato="verificato"] { border-left-color: var(--azzurro); }
.tabella-righe tbody tr[data-stato="approvato"] { border-left-color: var(--verde); }
.tabella-righe tbody tr[data-stato="scartato"] { border-left-color: var(--rosso); }
.tabella-righe tbody tr[data-stato="contattato"] { border-left-color: var(--viola); }
.tabella-righe tbody tr[data-stato="scartato"] td { color: var(--inchiostro-3); }
.tabella td.principale { font-weight: 600; color: var(--inchiostro); min-width: 160px; }
.tabella td.secondario { color: var(--inchiostro-2); }
.tabella td.tronca { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.piede-tabella { display: flex; justify-content: center; padding: 14px 0; }
.vuoto { background: var(--foglio); border: 1px dashed var(--linea-forte); border-radius: var(--raggio); padding: 32px 20px; text-align: center; color: var(--inchiostro-2); margin-top: 12px; }
.vuoto strong { display: block; font-family: var(--display); font-size: 18px; color: var(--inchiostro); margin-bottom: 6px; }
.caricamento td, .caricamento { color: var(--inchiostro-3); font-style: italic; }

/* ---------- Etichette colorate ---------- */
.tag { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; letter-spacing: .02em; white-space: nowrap; background: var(--grigio-chiaro); color: var(--inchiostro-2); }
.tag-verde { background: var(--verde-chiaro); color: var(--verde); }
.tag-azzurro { background: var(--azzurro-chiaro); color: var(--azzurro); }
.tag-ambra { background: var(--ambra-chiaro); color: var(--ambra); }
.tag-grigio { background: var(--grigio-chiaro); color: var(--grigio); }
.tag-rosso { background: var(--rosso-chiaro); color: var(--rosso); }
.tag-viola { background: var(--viola-chiaro); color: var(--viola); }
.tag-blu { background: var(--blu-chiaro); color: var(--blu); }
.tag-contorno { background: transparent; border: 1px solid currentColor; }
.punto { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--grigio); margin-right: 6px; vertical-align: 1px; }
.punto.in_corso, .punto.in_coda { background: var(--ambra); animation: pulsa 1.4s ease-in-out infinite; }
.punto.completata { background: var(--verde); }
.punto.errore { background: var(--rosso); }
@keyframes pulsa { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .punto { animation: none !important; } .pannello-corpo, .modale-corpo { animation: none !important; } }

/* ---------- Pannello scheda (il fascicolo) ---------- */
.pannello { position: fixed; inset: 0; z-index: 60; }
.pannello-sfondo, .modale-sfondo { position: absolute; inset: 0; background: rgba(22, 33, 46, .35); }
.pannello-corpo {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(560px, 100vw); background: var(--foglio);
  box-shadow: var(--ombra-pannello); overflow-y: auto; padding: 28px 28px 40px; animation: entra .22s ease-out;
  border-left: 6px solid var(--blu);
}
@keyframes entra { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
.chiudi { position: absolute; top: 12px; right: 14px; border: none; background: transparent; font-size: 26px; line-height: 1; color: var(--inchiostro-3); cursor: pointer; padding: 4px 8px; border-radius: 6px; }
.chiudi:hover { background: var(--carta); color: var(--inchiostro); }

.fascicolo-testa { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding-right: 32px; margin-bottom: 14px; }
.fascicolo-numero { font-family: var(--mono); font-size: 11.5px; color: var(--inchiostro-3); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 6px; }
.fascicolo-testa h2 { font-size: 24px; line-height: 1.15; }
.fascicolo-sotto { color: var(--inchiostro-2); margin-top: 4px; }

/* Il timbro: l'unico elemento che si concede un gesto. */
.timbro {
  flex: 0 0 auto; font-family: var(--display); font-weight: 600; text-transform: uppercase; letter-spacing: .14em; font-size: 12px;
  border: 2px solid currentColor; border-radius: 4px; padding: 5px 9px 4px; transform: rotate(-3deg); color: var(--inchiostro-3);
  margin-top: 6px; opacity: .92; mix-blend-mode: multiply;
}
.timbro[data-stato="verificato"] { color: var(--azzurro); }
.timbro[data-stato="approvato"] { color: var(--verde); }
.timbro[data-stato="scartato"] { color: var(--rosso); }
.timbro[data-stato="contattato"] { color: var(--viola); }

.citazione { font-family: var(--display); font-size: 17px; line-height: 1.4; color: var(--inchiostro); border-left: 3px solid var(--ocra); padding: 6px 0 6px 14px; margin: 14px 0; background: linear-gradient(90deg, var(--ocra-chiaro), transparent 70%); border-radius: 0 6px 6px 0; }
.citazione::before { content: '« '; color: var(--ocra); }
.citazione::after { content: ' »'; color: var(--ocra); }

.campi { display: grid; grid-template-columns: 130px 1fr; gap: 8px 14px; margin: 14px 0; font-size: 13.5px; }
.campi dt { color: var(--inchiostro-3); font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; padding-top: 2px; }
.campi dd { margin: 0; color: var(--inchiostro); overflow-wrap: anywhere; }
.campi dd .nota { display: block; }
.blocco { margin: 18px 0; }
.blocco h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--inchiostro-3); font-family: var(--testo); font-weight: 700; margin-bottom: 8px; }
.testo-lungo { white-space: pre-wrap; line-height: 1.5; color: var(--inchiostro); }
.avviso { background: var(--ocra-chiaro); color: var(--ocra); border-radius: var(--raggio-piccolo); padding: 8px 12px; font-size: 12.5px; margin-top: 6px; }
.contatti-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.contatti-lista li { display: grid; grid-template-columns: 130px 1fr; gap: 14px; font-size: 13.5px; }
.contatti-lista span { color: var(--inchiostro-3); font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; padding-top: 2px; }
.fonti-lista { margin: 0; padding-left: 18px; }
.fonti-lista li { margin-bottom: 4px; overflow-wrap: anywhere; }
.stati-bottoni { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.interruttore { display: flex; align-items: center; gap: 10px; font-weight: 500; cursor: pointer; margin-top: 4px; }
.interruttore input { width: 18px; height: 18px; accent-color: var(--verde); margin: 0; }
.note-area { width: 100%; border: 1px solid var(--linea-forte); border-radius: var(--raggio-piccolo); padding: 9px 11px; font: inherit; min-height: 72px; resize: vertical; }
.salva-riga { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 8px; }
.log-lista { list-style: none; margin: 0; padding: 0; font-family: var(--mono); font-size: 12px; display: grid; gap: 6px; }
.log-lista li { display: grid; grid-template-columns: 52px 1fr; gap: 10px; color: var(--inchiostro-2); }
.log-lista time { color: var(--inchiostro-3); }
.parametri { background: var(--carta); border-radius: var(--raggio-piccolo); padding: 10px 12px; font-size: 13px; display: grid; gap: 4px; }
.parametri div { display: grid; grid-template-columns: 110px 1fr; gap: 10px; }
.parametri b { color: var(--inchiostro-3); font-weight: 600; font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; padding-top: 2px; }
.numeri-ricerca { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 14px 0; }
.numeri-ricerca div { background: var(--carta); border-radius: var(--raggio-piccolo); padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; }
.numeri-ricerca strong { font-family: var(--mono); font-size: 16px; font-weight: 500; }

/* ---------- Modale ---------- */
.modale { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; padding: 16px; }
.modale-corpo { position: relative; width: 100%; max-width: 620px; max-height: calc(100vh - 32px); overflow-y: auto; background: var(--foglio); border-radius: 14px; padding: 26px 28px 24px; box-shadow: var(--ombra-pannello); animation: sale .2s ease-out; }
@keyframes sale { from { transform: translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } }
.modale-corpo h2 { font-size: 24px; }
.modale-azioni { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }

/* ---------- Telefono e tablet ---------- */
@media (max-width: 1100px) {
  .griglia-cruscotto { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .app { grid-template-columns: 1fr; }
  .lato { position: sticky; top: 0; height: auto; flex-direction: row; align-items: center; gap: 12px; padding: 10px 16px; border-right: none; border-bottom: 1px solid var(--linea); z-index: 20; flex-wrap: wrap; }
  .lato .marchio { flex-direction: row; align-items: baseline; gap: 8px; }
  .lato .marchio-sigla { font-size: 18px; }
  .lato .marchio-sede { display: none; }
  .nav { flex-direction: row; gap: 2px; order: 3; width: 100%; overflow-x: auto; }
  .nav-voce { padding: 7px 10px; white-space: nowrap; font-size: 13px; gap: 6px; }
  .utente { margin-top: 0; margin-left: auto; flex-direction: row; align-items: center; gap: 8px; }
  .utente-email { max-width: 160px; }
  .contenuto { padding: 18px 16px 40px; }
  h1 { font-size: 24px; }
  .griglia-cruscotto { grid-template-columns: 1fr; }
  .coppia-3 { grid-template-columns: 1fr 1fr; }
  .filtri label { flex: 1 1 140px; min-width: 120px; }
  .pannello-corpo { width: 100vw; border-left: none; border-top: 6px solid var(--blu); padding: 22px 16px 36px; }
  .fascicolo-testa { flex-direction: column-reverse; align-items: flex-start; gap: 10px; padding-right: 44px; }
  .fascicolo-testa > div { min-width: 0; width: 100%; }
  .fascicolo-testa h2 { font-size: 21px; }
  .timbro { margin-top: 0; font-size: 11px; }
  .campi, .contatti-lista li { grid-template-columns: 1fr; gap: 2px 0; }
  .campi dt { margin-top: 6px; }
  .numeri-ricerca { grid-template-columns: 1fr 1fr; }
  .modale-corpo { padding: 22px 16px; }
  .testata { align-items: flex-start; }
}

.nowrap { white-space: nowrap; }