:root {
  color-scheme: light;
  --fondo: #F2F5F4;
  --superficie: #FFFFFF;
  --inchiostro: #14201C;
  --secondario: #62716C;
  --linea: #DCE3E0;
  --verde: #0E6B5C;
  --verde-scuro: #0A5A4D;
  --verde-chiaro: #E7F0EE;
  --ambra: #9A5504;
  --ambra-chiaro: #FBEFD9;
  --rosso: #B3261E;
  --rosso-chiaro: #FBE8E6;
  --raggio: 12px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --fondo: #0D1311;
  --superficie: #141C19;
  --inchiostro: #E6EDEA;
  --secondario: #8D9C96;
  --linea: #25312D;
  --verde-chiaro: #15342E;
  --ambra: #E0A64A;
  --ambra-chiaro: #33260F;
  --rosso: #F2857C;
  --rosso-chiaro: #3A1714;
}

:root[data-theme="dark"] .accesso { background: radial-gradient(ellipse at 50% 0%, #15342e 0, transparent 48%), var(--fondo); }
:root[data-theme="dark"] input:not([type=checkbox]),
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select,
:root[data-theme="dark"] .bottone-secondario,
:root[data-theme="dark"] .bottone-piccolo { color: var(--inchiostro); background: #18221e; border-color: var(--linea); }
:root[data-theme="dark"] .barra-laterale,
:root[data-theme="dark"] .filtro.attivo,
:root[data-theme="dark"] .stato-vuoto,
:root[data-theme="dark"] .dialogo,
:root[data-theme="dark"] .chiudi-dialogo { color: var(--inchiostro); background: var(--superficie); }
:root[data-theme="dark"] .nav-link:hover,
:root[data-theme="dark"] .filtro:hover,
:root[data-theme="dark"] .bottone-secondario:hover,
:root[data-theme="dark"] .bottone-piccolo:hover { color: var(--inchiostro); background: #202b26; }
:root[data-theme="dark"] .nav-count { background: #202b26; }
:root[data-theme="dark"] .avatar { background: #45382a; color: #f2d0a4; }
:root[data-theme="dark"] .profilo-dati strong,
:root[data-theme="dark"] .dialogo-testo,
:root[data-theme="dark"] .trascrizione-riga p { color: var(--inchiostro); }
:root[data-theme="dark"] .dialogo-testo { background: #1b2621; }
:root[data-theme="dark"] .record p,
:root[data-theme="dark"] .azienda-chip,
:root[data-theme="dark"] .record-meta,
:root[data-theme="dark"] .record-secondario { color: var(--secondario); }
:root[data-theme="dark"] .chip,
:root[data-theme="dark"] .chip-gestito { color: #a9b5b0; background: #202b26; }
:root[data-theme="dark"] .chip-nuovo { color: #9ad8ca; background: #15342e; }
:root[data-theme="dark"] .bottone-piccolo.verde { color: #9ad8ca; background: #15342e; border-color: #26473e; }
:root[data-theme="dark"] .stato-punto { box-shadow: 0 0 0 3px #15342e; }

* { box-sizing: border-box; }
body { margin: 0; color: var(--inchiostro); background: var(--fondo); }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }

.accesso { min-height: 100vh; display: grid; place-items: center; padding: 40px 20px 70px; position: relative; background: radial-gradient(ellipse at 50% 0%, #e9f4f1 0, transparent 48%), var(--fondo); }
.accesso-brand { position: absolute; top: 42px; left: 50%; transform: translateX(-50%); }
.brand-mark { height: 38px; width: 38px; display: grid; place-items: center; border-radius: 12px; background: var(--verde); color: white; font-size: 21px; font-weight: 750; letter-spacing: -.06em; }
.accesso-card { width: min(100%, 430px); background: var(--superficie); border: 1px solid var(--linea); border-radius: 20px; padding: 38px; box-shadow: 0 18px 55px #263c3510; }
.sopratitolo { margin: 0 0 11px; color: var(--verde); font-size: 11px; font-weight: 750; letter-spacing: .12em; }
.accesso-card h1, .testata h1 { margin: 0; font-size: 31px; font-weight: 680; letter-spacing: -.045em; }
.testo-secondario { margin: 10px 0 29px; color: var(--secondario); line-height: 1.55; font-size: 14px; }
.form-accesso { display: grid; gap: 10px; margin-top: 23px; }
.form-accesso > label:not(.checkbox-riga) { font-size: 13px; font-weight: 650; }
input:not([type=checkbox]), textarea, select { width: 100%; min-height: 47px; padding: 12px 14px; color: var(--inchiostro); background: white; border: 1px solid #d8dddf; border-radius: 9px; outline: none; transition: border .16s, box-shadow .16s; }
input:focus, textarea:focus { border-color: #52a695; box-shadow: 0 0 0 3px #087e681b; }
.form-accesso input[name="codice"] { font-variant-numeric: tabular-nums; letter-spacing: .32em; text-align: center; font-size: 22px; }
.checkbox-riga { display: flex; align-items: center; gap: 9px; margin: 4px 0; font-size: 13px; color: var(--secondario); }
.checkbox-riga input { accent-color: var(--verde); }
.bottone { display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid transparent; border-radius: 9px; min-height: 42px; padding: 0 15px; font-size: 13px; font-weight: 650; transition: background .16s, border .16s, transform .16s; }
.bottone:active { transform: translateY(1px); }
.bottone-primario { width: 100%; min-height: 47px; margin-top: 7px; background: var(--verde); color: white; }
.bottone-primario:hover { background: var(--verde-scuro); }
.bottone-secondario { background: white; color: #3a4447; border-color: var(--linea); }
.bottone-secondario:hover { border-color: #c9d1d3; background: #fbfcfc; }
.bottone-link { justify-self: center; color: var(--verde); background: none; border: 0; padding: 8px; font-size: 13px; }
.messaggio-stato { min-height: 20px; margin: 14px 0 0; color: var(--rosso); font-size: 13px; line-height: 1.45; }
.messaggio-stato.ok { color: var(--verde-scuro); }
.nota-privacy { margin: 16px 0 0; color: #929b9e; font-size: 11px; text-align: center; }
.accesso-footer { position: absolute; bottom: 24px; color: #929b9e; font-size: 11px; }

.app-shell { display: flex; min-height: 100vh; }
.barra-laterale { position: fixed; display: flex; flex-direction: column; width: 248px; top: 0; bottom: 0; left: 0; padding: 25px 15px 16px; background: #fff; border-right: 1px solid var(--linea); }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 10px; color: var(--inchiostro); text-decoration: none; font-size: 15px; font-weight: 700; letter-spacing: -.025em; }
.brand .brand-mark { height: 34px; width: 34px; border-radius: 10px; font-size: 18px; }
.azienda-chip { display: flex; align-items: center; gap: 8px; margin: 26px 8px 14px; padding: 11px 10px; border: 1px solid var(--linea); border-radius: 9px; color: #626d70; font-size: 12px; }
.stato-punto { width: 7px; height: 7px; border-radius: 50%; background: #38a385; box-shadow: 0 0 0 3px #e4f3ee; }
.navigazione { display: grid; gap: 4px; }
.nav-link { display: flex; align-items: center; gap: 11px; min-height: 42px; width: 100%; border: 0; padding: 0 10px; border-radius: 8px; background: transparent; color: #657073; text-align: left; font-size: 13px; font-weight: 570; }
.nav-link:hover { background: #f6f8f8; color: var(--inchiostro); }
.nav-link.attivo { background: var(--verde-chiaro); color: var(--verde-scuro); font-weight: 670; }
.nav-icona { display: grid; place-items: center; width: 20px; color: currentColor; font-size: 17px; }
.nav-count { margin-left: auto; min-width: 22px; padding: 3px 6px; border-radius: 20px; background: #fff; color: var(--verde-scuro); text-align: center; font-size: 10px; font-weight: 700; }
.barra-spazio { flex: 1; }
.profilo { display: flex; align-items: center; gap: 9px; padding: 12px 6px 2px; border-top: 1px solid var(--linea); }
.avatar { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 50%; background: #f2e9dc; color: #795d3c; font-weight: 700; font-size: 12px; }
.profilo-dati { display: grid; gap: 3px; min-width: 0; flex: 1; }
.profilo-dati strong { overflow: hidden; color: #354044; font-size: 12px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.profilo-dati small { color: var(--secondario); font-size: 10px; }
.icona-bottone { display: grid; place-items: center; height: 32px; width: 32px; border: 0; border-radius: 8px; background: transparent; color: #7a8588; font-size: 18px; }
.icona-bottone:hover { background: #f0f3f3; color: #343e41; }
.contenuto { width: min(100% - 248px, 1240px); margin-left: 248px; padding: 42px clamp(24px, 5.4vw, 76px) 70px; }
.testata { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 40px; }
.testata .sopratitolo { margin-bottom: 7px; }
.testata h1 { font-size: 29px; }
.riepilogo-riga { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin: 0 0 21px; }
.riepilogo-riga h2 { margin: 0; font-size: 17px; font-weight: 670; letter-spacing: -.02em; }
.riepilogo-riga p { margin: 6px 0 0; color: var(--secondario); font-size: 13px; }
.riepilogo-numero { display: grid; gap: 1px; min-width: 74px; text-align: right; }
.riepilogo-numero strong { font-size: 21px; font-variant-numeric: tabular-nums; }
.riepilogo-numero span { color: var(--secondario); font-size: 10px; }
.indicatori-settimana { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0 0 29px; }
.indicatore { display: grid; gap: 6px; min-height: 103px; padding: 16px; border: 1px solid var(--linea); border-radius: var(--raggio); background: var(--superficie); }
.indicatore span { color: var(--secondario); font-size: 11px; }
.indicatore strong { font-size: 23px; font-weight: 680; font-variant-numeric: tabular-nums; }
.indicatore small { color: var(--secondario); font-size: 10px; }
.consumo-principale { margin: 0 0 14px; }
.consumo-principale strong { font-size: clamp(24px, 4vw, 34px); }
.consumo-principale progress { width: 100%; height: 12px; accent-color: var(--verde); }
.consumo-principale .testo-secondario { margin: 4px 0 0; font-size: 12px; }
.consumo-direzioni { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.consumo-elenco { display: grid; gap: 12px; }
.consumo-riga { display: grid; grid-template-columns: minmax(100px, 1fr) minmax(100px, 2fr) minmax(65px, auto); gap: 12px; align-items: center; font-size: 12px; }
.consumo-riga > span { overflow-wrap: anywhere; }
.consumo-riga > strong { text-align: right; font-size: 11px; font-variant-numeric: tabular-nums; }
.consumo-traccia { height: 7px; overflow: hidden; border-radius: 8px; background: var(--linea); }
.consumo-traccia span { display: block; height: 100%; border-radius: inherit; background: var(--verde); }
.azioni-fatturazione { display: flex; flex-wrap: wrap; gap: 8px; margin: 15px 0; }
.prezzo-abbonamento { font-size: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.campo-soglia { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; margin-top: 16px; color: var(--secondario); font-size: 12px; }
.campo-soglia span { color: var(--inchiostro); font-weight: 700; }
.campo-soglia input[type="range"] { grid-column: 1 / -1; min-height: 24px; padding: 0; accent-color: var(--verde); }
.avviso-critico { margin: 0 0 14px; padding: 12px 14px; border: 1px solid #efc4be; border-radius: 9px; background: var(--rosso-chiaro); color: var(--rosso); font-size: 12px; line-height: 1.5; }
.consumo-piani { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.consumo-piano { display: grid; justify-items: start; align-content: start; gap: 9px; padding: 14px; border: 1px solid var(--linea); border-radius: 10px; background: var(--superficie); }
.consumo-piano > span { font-size: 13px; font-weight: 650; }
.consumo-piano small { min-height: 30px; color: var(--secondario); font-size: 11px; line-height: 1.4; }
.consumo-piano .bottone-piccolo { text-decoration: none; }
.record-azioni > strong { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.riepilogo-oggi { align-items: center; margin: 0 0 12px; }
.schede-assistente { display: flex; gap: 6px; margin: -13px 0 25px; padding-bottom: 10px; border-bottom: 1px solid var(--linea); }
.scheda-assistente { min-height: 36px; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; color: var(--secondario); font-size: 12px; font-weight: 600; }
.scheda-assistente:hover { background: var(--superficie); }
.scheda-assistente.attiva { background: var(--verde-chiaro); color: var(--verde-scuro); }
.giorni-reperibilita { margin: 15px 0 10px; padding: 12px 14px; border: 1px solid var(--linea); border-radius: 10px; }
.giorni-reperibilita legend { padding: 0 6px; color: var(--secondario); font-size: 11px; font-weight: 650; }
.giorni-reperibilita > div { display: block; }
.giorni-reperibilita .checkbox-riga { margin: 0; font-size: 11px; }
.campi-reperibilita { display: grid; gap: 8px; }
.reperibilita-settimana { min-width: 0; }
.reperibilita-settimana .riga-orario { grid-template-columns: 90px 115px minmax(0,1fr); }
.reperibilita-settimana .fasce-giorno { grid-template-columns: repeat(3, minmax(120px,1fr)); }
.record-secondario span:last-child { overflow-wrap: anywhere; }
.campi-contatto { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-contatto { display: grid; gap: 12px; width: 100%; }
.form-contatto .campi-invito { margin: 0; }
.form-contatto .giorni-reperibilita { margin: 0; }
.form-contatto textarea { min-height: 58px; padding: 9px 11px; resize: vertical; }
.giorni-mini { display: flex; flex-wrap: wrap; gap: 5px; }
.giorni-mini .checkbox-riga { margin: 0; font-size: 10px; }
.stato-contatto { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.lista-oggi { margin-bottom: 30px; }
.record-oggi { padding: 13px 16px; }
.ricerca-messaggi { max-width: 560px; margin: 0 0 14px; }
.ricerca-messaggi label { display: block; margin-bottom: 6px; color: var(--secondario); font-size: 11px; }
.ricerca-messaggi > div { display: flex; gap: 8px; }
.ricerca-messaggi input { min-height: 40px; }
.filtri { display: flex; gap: 7px; overflow-x: auto; padding: 1px 0 16px; }
.filtro { flex: 0 0 auto; min-height: 32px; padding: 0 12px; border: 1px solid transparent; border-radius: 20px; background: transparent; color: #687477; font-size: 12px; }
.filtro:hover { background: #edf0f1; }
.filtro.attivo { background: #fff; border-color: #dfe4e5; color: #263236; box-shadow: 0 1px 2px #17212608; font-weight: 650; }
.lista-record { display: grid; gap: 10px; }
.record { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 15px; align-items: center; padding: 18px 19px; background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--raggio); box-shadow: 0 1px 2px #263c3505; transition: border .16s, box-shadow .16s; }
.record:hover { border-color: #d3dada; box-shadow: 0 5px 18px #263c3508; }
.record-contenuto { min-width: 0; }
.record-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 9px; color: var(--secondario); font-size: 11px; }
.record-meta time { font-variant-numeric: tabular-nums; }
.record-meta .separatore { color: #c2c8ca; }
/* AI Act art. 50(2): il testo scritto dall'intelligenza artificiale si riconosce. */
.nota-ia { margin-top: 6px; color: var(--secondario); font-size: 11px; font-style: italic; }
.record h3 { margin: 0 0 5px; font-size: 14px; font-weight: 660; letter-spacing: -.01em; }
.record p { display: -webkit-box; overflow: hidden; margin: 0; color: #596568; font-size: 13px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.record-secondario { display: flex; align-items: center; gap: 9px; margin-top: 10px; color: #7a8588; font-size: 11px; }
.chip { display: inline-flex; align-items: center; gap: 5px; min-height: 23px; padding: 0 8px; border-radius: 20px; background: #eff2f2; color: #606a6d; font-size: 10px; font-weight: 650; }
.chip-nuovo { background: var(--verde-chiaro); color: var(--verde-scuro); }
.chip-critico { background: var(--ambra-chiaro); color: var(--ambra); }
.chip-gestito { background: #f0f2f2; color: #747e81; }
.record-azioni { display: flex; align-items: center; gap: 7px; }
.bottone-piccolo { min-height: 34px; padding: 0 11px; border: 1px solid var(--linea); border-radius: 8px; background: white; color: #394447; font-size: 11px; font-weight: 650; white-space: nowrap; }
.bottone-piccolo:hover { border-color: #c9d2d4; background: #fbfcfc; }
.bottone-piccolo.verde { border-color: #d3ebe5; background: #f1f9f6; color: var(--verde-scuro); }
.stato-vuoto { display: grid; justify-items: center; padding: 74px 20px 82px; background: white; border: 1px solid var(--linea); border-radius: var(--raggio); text-align: center; }
.vuoto-icona { display: grid; place-items: center; width: 41px; height: 41px; margin-bottom: 12px; border-radius: 50%; background: var(--verde-chiaro); color: var(--verde); font-size: 17px; }
.stato-vuoto h3 { margin: 0; font-size: 15px; }
.stato-vuoto p { max-width: 350px; margin: 8px 0 0; color: var(--secondario); font-size: 13px; line-height: 1.5; }
.bottone-centro { display: flex; margin: 18px auto 0; }
.avviso-app { margin: -23px 0 25px; padding: 12px 14px; border: 1px solid #f0d8b1; border-radius: 9px; background: var(--ambra-chiaro); color: #855015; font-size: 12px; }
.avviso-statico { margin: 0 0 20px; padding: 12px 14px; border: 1px solid #f0d8b1; border-radius: 9px; background: var(--ambra-chiaro); color: #855015; font-size: 12px; line-height: 1.5; }

.dialogo { width: min(100% - 30px, 650px); max-height: min(88vh, 820px); padding: 0; border: 1px solid var(--linea); border-radius: 17px; box-shadow: 0 26px 90px #17212635; }
.dialogo::backdrop { background: #17212670; backdrop-filter: blur(3px); }
.dialogo-testata { display: flex; justify-content: end; position: sticky; top: 0; z-index: 1; height: 0; padding: 10px 10px 0; }
.chiudi-dialogo { background: #fff; border: 1px solid var(--linea); font-size: 22px; }
.dialogo-contenuto { padding: 29px 32px 34px; }
.dialogo-contenuto h2 { margin: 0 0 7px; padding-right: 35px; font-size: 21px; letter-spacing: -.025em; }
.dialogo-contenuto .dialogo-meta { margin: 0 0 22px; color: var(--secondario); font-size: 12px; }
.dialogo-sezione { margin: 20px 0 0; }
.dialogo-sezione h3 { margin: 0 0 8px; color: #778184; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.dialogo-testo { padding: 14px; border-radius: 10px; background: #f7f8f8; color: #394447; font-size: 14px; line-height: 1.65; white-space: pre-wrap; }
.dialogo-campo { display: grid; gap: 8px; margin-top: 18px; color: #5c676a; font-size: 12px; }
.dialogo-campo textarea { min-height: 76px; resize: vertical; }
.dialogo-azioni { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.versione-conoscenza { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--linea); }
.versione-conoscenza strong { font-size: 12px; }
.versione-conoscenza p { margin: 5px 0 0; color: var(--secondario); font-size: 11px; }
.brano-conoscenza { white-space: pre-wrap; }
.form-segnalazione { display: grid; gap: 14px; margin-top: 18px; }
.form-segnalazione > label { display: grid; gap: 7px; color: var(--secondario); font-size: 12px; }
.form-segnalazione > label span { font-weight: 400; }
.form-segnalazione textarea { min-height: 112px; resize: vertical; }
.trascrizione-riga { display: grid; grid-template-columns: 45px 84px 1fr; gap: 8px; padding: 11px 0; border-bottom: 1px solid var(--linea); font-size: 12px; line-height: 1.55; }
.trascrizione-riga time { color: #879194; font-variant-numeric: tabular-nums; }
.trascrizione-riga strong { color: var(--verde-scuro); font-size: 11px; }
.trascrizione-riga p { margin: 0; color: #414c4f; }
.trascrizione-evento { color: #747f82 !important; font-style: italic; }
.errore-inline { color: var(--rosso); font-size: 12px; }
.pannello-form { margin: 0 0 28px; padding: 20px; background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--raggio); }
.pannello-form h3 { margin: 0 0 17px; font-size: 14px; }
.campi-invito { display: grid; grid-template-columns: minmax(180px, 1.3fr) minmax(145px, .7fr) minmax(180px, 1fr); gap: 12px; }
.prova-conoscenza-riga { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.prova-conoscenza-riga button { min-height: 42px; }
.registro-filtri { grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); align-items: end; }
.filtri-chiamate { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); align-items: end; }
.filtri-chiamate .checkbox-riga { align-self: center; }
.campi-profilo { display: grid; gap: 14px; max-width: 560px; }
.campi-profilo label { display: grid; gap: 7px; color: var(--secondario); font-size: 12px; }
.contatore-caratteri { justify-self: end; color: var(--secondario); font-size: 10px; font-weight: 400; }
.settimana-orari { min-width: 0; margin: 20px 0; padding: 14px; border: 1px solid var(--linea); border-radius: 10px; }
.settimana-orari legend { padding: 0 7px; color: var(--secondario); font-size: 11px; font-weight: 650; }
.riga-orario { display: grid; grid-template-columns: 90px 84px minmax(0,1fr); gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--linea); }
.riga-orario:last-child { border-bottom: 0; }
.nome-giorno { font-size: 12px; font-weight: 650; }
.riga-orario .checkbox-riga { margin: 0; font-size: 11px; }
.fasce-giorno { display: grid; grid-template-columns: repeat(3, minmax(180px,1fr)); gap: 8px; }
.fascia-orario { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 5px; }
.fascia-orario input { min-width: 0; min-height: 37px !important; padding: 7px !important; font-size: 12px; }
.chiusura-orari { display: grid; grid-template-columns: 1fr 1fr minmax(170px,2fr) auto; gap: 8px; align-items: center; margin: 0 0 9px; }
.chiusura-orari input { min-height: 39px; padding: 8px; font-size: 11px; }
.orari-nota { max-width: none; margin: 0 0 12px; font-size: 11px; }
.campi-profilo .bottone { justify-self: start; }
.campi-invito label { display: grid; gap: 7px; color: var(--secondario); font-size: 12px; }
.campo-largo { display: grid; gap: 7px; margin-top: 13px; color: var(--secondario); font-size: 12px; }
.campo-largo textarea { min-height: 68px; padding: 10px 12px; resize: vertical; }
.campi-invito input, .campi-invito select { min-height: 41px; padding: 9px 11px; }
.pannello-form .checkbox-riga { margin-top: 13px; }
.bottone-form { width: auto; min-height: 41px; margin-top: 10px; }
.titolo-elenco { margin: 27px 0 12px; font-size: 15px; }
.record-sottotitolo { margin-top: 5px !important; color: var(--secondario) !important; font-size: 12px !important; }
.numero-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-variant-numeric: tabular-nums; }
.campo-avviso-appuntamento { margin-top: 18px; }
.controlli-squadra { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; }
.controlli-squadra > label:not(.checkbox-riga) { display: grid; gap: 5px; color: var(--secondario); font-size: 10px; }
.controlli-squadra select, .controlli-squadra input:not([type=checkbox]) { width: auto; min-width: 130px; min-height: 34px; padding: 6px 9px; font-size: 11px; }
.controlli-squadra .campo-reparti-riga input { width: min(240px, 45vw); }
.controlli-squadra .checkbox-riga { margin: 0 4px 7px; font-size: 11px; }
.assistente-prova-comando { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin: 0 0 16px; padding: 14px 16px; background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--raggio); }
.assistente-prova-comando p { margin: 0; font-size: 12px; }
.dialogo-prova { width: min(100% - 24px, 740px); }
.prova-diario { display: grid; gap: 10px; min-height: 180px; max-height: 42vh; overflow: auto; padding: 14px; background: #f7f8f8; border: 1px solid var(--linea); border-radius: 11px; }
.prova-diario:empty::before { content: "Quando la conversazione inizia, vedrai qui la trascrizione e gli effetti simulati."; color: var(--secondario); font-size: 12px; }
.prova-riga { display: grid; grid-template-columns: 78px 1fr; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--linea); font-size: 12px; line-height: 1.5; }
.prova-riga:last-child { border-bottom: 0; }
.prova-riga strong { color: var(--verde-scuro); }
.prova-riga p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.prova-riga-evento p { color: var(--secondario); font-style: italic; }
.form-feedback-prova { margin-top: 20px; }
.form-feedback-prova h3 { margin: 0; font-size: 14px; }
.form-feedback-prova label { display: grid; gap: 8px; margin-top: 14px; color: var(--secondario); font-size: 12px; }
.form-feedback-prova textarea { min-height: 92px; resize: vertical; }
.prova-azioni { margin-top: 14px; }
select:focus { border-color: #52a695; box-shadow: 0 0 0 3px #087e681b; }

@media (max-width: 760px) {
.prova-conoscenza-riga { grid-template-columns: 1fr; }
  .prova-conoscenza-riga button { justify-self: start; }
  .barra-laterale { width: 100%; height: 60px; top: auto; right: 0; bottom: 0; z-index: 5; flex-direction: row; align-items: center; padding: 5px 12px calc(5px + env(safe-area-inset-bottom)); border-top: 1px solid var(--linea); border-right: 0; }
  .brand, .azienda-chip, .barra-spazio, .profilo { display: none; }
  .navigazione { display: flex; overflow-x: auto; width: 100%; gap: 4px; scrollbar-width: none; }
  .navigazione::-webkit-scrollbar { display: none; }
  .nav-link { flex: 1 0 61px; flex-direction: column; justify-content: center; min-height: 47px; gap: 2px; padding: 2px 4px; font-size: 9px; }
  .nav-count { margin-left: 1px; }
  .contenuto { width: 100%; margin: 0; padding: 26px 17px calc(82px + env(safe-area-inset-bottom)); }
  .testata { margin-bottom: 31px; }
  .testata h1 { font-size: 25px; }
  .testata .bottone { min-height: 37px; padding: 0 10px; font-size: 11px; }
  .riepilogo-riga { align-items: center; }
  .riepilogo-riga h2 { font-size: 15px; }
  .riepilogo-riga p { max-width: 250px; font-size: 12px; line-height: 1.45; }
  .record { grid-template-columns: 1fr; gap: 12px; padding: 15px; }
  .indicatori-settimana { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 24px; }
  .indicatore { min-height: 93px; padding: 13px; }
  .indicatore strong { font-size: 21px; }
  .consumo-principale strong { font-size: 25px; }
  .consumo-riga { grid-template-columns: minmax(75px, 1fr) minmax(60px, 1.3fr) minmax(57px, auto); gap: 7px; font-size: 10px; }
  .consumo-riga > strong { font-size: 10px; }
  .azioni-fatturazione .bottone { flex: 1 1 auto; }
  .record-azioni { justify-content: flex-start; }
  .campi-invito { grid-template-columns: 1fr; }
  .campi-contatto { grid-template-columns: 1fr; }
  .riga-orario { grid-template-columns: 1fr auto; gap: 8px; }
  .fasce-giorno { grid-column: 1 / -1; grid-template-columns: 1fr; }
  .reperibilita-settimana .riga-orario { grid-template-columns: 1fr auto; }
  .reperibilita-settimana .fasce-giorno { grid-template-columns: 1fr; }
  .chiusura-orari { grid-template-columns: 1fr 1fr; }
  .chiusura-orari input[data-chiusura-frase] { grid-column: 1 / -1; }
  .pannello-form { padding: 16px; }
  .dialogo-contenuto { padding: 26px 20px 25px; }
  .trascrizione-riga { grid-template-columns: 38px 70px 1fr; gap: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}