/* Account Sequoya — un foglio solo per tutte le pagine.
   Niente caratteri esterni e niente stili in linea: la politica di sicurezza
   dei contenuti (netlify.toml) accetta solo file di questo sito. */

@font-face { font-family:Inter; src:url('/font/InterVariable.woff2') format('woff2'); font-style:normal; font-weight:100 900; font-display:swap; }
:root {
  color-scheme: light;
  --fondo:#f7f7f2; --carta:#ffffff; --testo:#26392f; --tenue:#5d6b59;
  --linea:#dfe5d9; --accento:#38664e; --accento-scuro:#2b533e; --accento-chiaro:#edf2e9;
  --verde:#237848; --verde-fondo:#e7f3e9; --giallo:#805919; --giallo-fondo:#fbf3e3;
  --rosso:#ad3547; --rosso-fondo:#fae9eb; --grigio-fondo:#edf2e9;
  --campo:#ffffff; --bordo-campo:#b8c4b1; --testata:#f0f2e9; --sul-accento:#ffffff;
  --raggio:12px; --ombra:0 4px 20px #26392f05;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --fondo:#111216; --carta:#191b21; --testo:#e4e6eb; --tenue:#a4a7b0;
  --linea:#30323b; --accento:#a7c4f2; --accento-scuro:#c5d8f5; --accento-chiaro:#252830;
  --verde:#62dba1; --verde-fondo:#183a2b; --giallo:#e7c47d; --giallo-fondo:#362e20;
  --rosso:#f88792; --rosso-fondo:#40262d; --grigio-fondo:#252830;
  --campo:#14151a; --bordo-campo:#565b67; --testata:#15161b; --sul-accento:#121823;
  --ombra:none;
}
@media (prefers-color-scheme:dark) { html:not([data-theme="light"]) {
  color-scheme: dark;
  --fondo:#111216; --carta:#191b21; --testo:#e4e6eb; --tenue:#a4a7b0;
  --linea:#30323b; --accento:#a7c4f2; --accento-scuro:#c5d8f5; --accento-chiaro:#252830;
  --verde:#62dba1; --verde-fondo:#183a2b; --giallo:#e7c47d; --giallo-fondo:#362e20;
  --rosso:#f88792; --rosso-fondo:#40262d; --grigio-fondo:#252830;
  --campo:#14151a; --bordo-campo:#565b67; --testata:#15161b; --sul-accento:#121823;
  --ombra:none;
} }

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  background: var(--fondo);
  color: var(--testo);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

a { color: var(--accento); }
a:hover { color: var(--accento-scuro); }

/* --- testata ------------------------------------------------------------ */

.testata {
  background: var(--carta);
  border-bottom: 1px solid var(--linea);
}
.testata-dentro {
  max-width: 1080px;
  margin: 0 auto;
  padding: 12px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.marchio {
  font-weight: 700;
  font-size: 18px;
  color: var(--testo);
  text-decoration: none;
  letter-spacing: 0.01em;
}
.marchio span { color: var(--accento); }
.menu { display: flex; gap: 4px; flex-wrap: wrap; flex: 1; }
.menu a {
  text-decoration: none;
  color: var(--tenue);
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 15px;
}
.menu a:hover { background: var(--grigio-fondo); color: var(--testo); }
.menu a.attivo { background: var(--accento-chiaro); color: var(--accento-scuro); font-weight: 600; }
.chi { font-size: 14px; color: var(--tenue); display: flex; align-items: center; gap: 10px; }

/* --- corpo -------------------------------------------------------------- */

main {
  flex: 1;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  padding: 28px 20px 40px;
}
main.stretto { max-width: 460px; }

h1 { font-size: 26px; margin: 0 0 6px; line-height: 1.25; }
h2 { font-size: 20px; margin: 28px 0 10px; }
h3 { font-size: 17px; margin: 18px 0 8px; }
p { margin: 0 0 12px; }
.sotto { color: var(--tenue); margin-bottom: 20px; }
.piccolo { font-size: 14px; color: var(--tenue); }

.scheda {
  background: var(--carta);
  border: 1px solid var(--linea);
  border-radius: var(--raggio);
  box-shadow: var(--ombra);
  padding: 20px;
  margin-bottom: 18px;
}
.scheda > h2:first-child, .scheda > h3:first-child { margin-top: 0; }

.griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }

/* --- moduli ------------------------------------------------------------- */

label { display: block; font-weight: 600; font-size: 14px; margin: 14px 0 4px; }
label.in-linea { display: flex; align-items: center; gap: 8px; font-weight: 400; font-size: 15px; }
input[type="text"], input[type="email"], input[type="password"], input[type="number"], select, textarea {
  width: 100%;
  font: inherit;
  color: var(--testo);
  background: var(--carta);
  border: 1px solid var(--linea);
  border-radius: 8px;
  padding: 9px 11px;
}
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible {
  outline: 2px solid var(--accento);
  outline-offset: 1px;
}
.aiuto { font-size: 13px; color: var(--tenue); margin-top: 4px; }
.riga { display: flex; gap: 12px; flex-wrap: wrap; }
.riga > * { flex: 1; min-width: 160px; }

button, .bottone {
  font: inherit;
  font-weight: 600;
  border: 1px solid var(--accento);
  background: var(--accento);
  color: #fff;
  border-radius: 8px;
  padding: 9px 16px;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}
button:hover, .bottone:hover { background: var(--accento-scuro); border-color: var(--accento-scuro); color: #fff; }
button.secondario, .bottone.secondario { background: transparent; color: var(--accento); }
button.secondario:hover, .bottone.secondario:hover { background: var(--accento-chiaro); color: var(--accento-scuro); }
button.pericolo { background: transparent; color: var(--rosso); border-color: var(--rosso); }
button.pericolo:hover { background: var(--rosso-fondo); color: var(--rosso); }
button:disabled { opacity: 0.55; cursor: default; }
.azioni { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; align-items: center; }
.azioni-riga { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.tariffa-base { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
/* « Cosa manca »: ogni voce porta dove si fa (SEQ-206 punto 2). */
button.collegamento { background: none; border: 0; padding: 0; color: var(--accento); text-decoration: underline; cursor: pointer; font: inherit; text-align: left; }
.evidenziato { outline: 3px solid var(--accento); outline-offset: 3px; border-radius: 6px; }

/* --- avvisi e stati ----------------------------------------------------- */

.avviso {
  border-radius: 8px;
  padding: 10px 14px;
  margin: 12px 0;
  border: 1px solid transparent;
}
.avviso.info { background: var(--accento-chiaro); color: var(--accento-scuro); }
.avviso.ok { background: var(--verde-fondo); color: var(--verde); }
.avviso.attenzione { background: var(--giallo-fondo); color: var(--giallo); }
.avviso.errore { background: var(--rosso-fondo); color: var(--rosso); }
.avviso strong { display: block; margin-bottom: 2px; }
.nascosto { display: none !important; }

.stato {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  border-radius: 999px;
  padding: 3px 10px;
  background: var(--grigio-fondo);
  color: var(--tenue);
  white-space: nowrap;
}
.stato::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.stato.verde { background: var(--verde-fondo); color: var(--verde); }
.stato.giallo { background: var(--giallo-fondo); color: var(--giallo); }
.stato.rosso { background: var(--rosso-fondo); color: var(--rosso); }

/* --- tabelle ------------------------------------------------------------ */

.tabella-contenitore { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 15px; }
th, td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--linea); vertical-align: top; }
th { font-size: 13px; color: var(--tenue); font-weight: 600; }
tr:last-child td { border-bottom: none; }
td.numero { text-align: right; font-variant-numeric: tabular-nums; }

/* --- piede -------------------------------------------------------------- */

.piede {
  border-top: 1px solid var(--linea);
  color: var(--tenue);
  font-size: 13px;
}
.piede-dentro {
  max-width: 1080px;
  margin: 0 auto;
  padding: 14px 20px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: space-between;
}
.spia { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 600; }
.ambiente { font-weight: 600; }
.ambiente.anteprima { color: var(--giallo); }

/* --- pezzi dell'area dell'account --------------------------------------- */

.testo-email {
  white-space: pre-wrap;
  font-family: inherit;
  font-size: 15px;
  margin: 0;
  overflow-wrap: anywhere;
}
.intestazione-sezione { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.intestazione-sezione h1 { margin-bottom: 0; }
.vuoto { color: var(--tenue); font-style: italic; }
.etichetta {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 6px;
  background: var(--grigio-fondo);
  color: var(--tenue);
}
.etichetta.amministratore { background: var(--accento-chiaro); color: var(--accento-scuro); }
.fila-azioni { display: flex; gap: 8px; flex-wrap: wrap; }
.fila-azioni button { padding: 5px 10px; font-size: 14px; }
td select { padding: 5px 8px; }
.log-negato td { background: var(--rosso-fondo); }
.passi { margin: 8px 0 0; padding-left: 20px; }
.passi li { margin: 4px 0; }

/* --- connessioni (tappa 2) ------------------------------------------------ */

.connessione h3 { margin: 0; }
.istruzioni { border-left: 3px solid var(--accento-chiaro); padding-left: 14px; margin: 14px 0; }
.istruzioni h3 { margin-top: 12px; }
.guida { margin: 10px 0 14px; }
.guida img { max-width: 100%; height: auto; border-radius: 8px; display: block; }
.guida figcaption { font-size: 13px; color: var(--tenue); margin-top: 4px; }
.scelta { display: flex; flex-direction: column; gap: 2px; margin: 6px 0; }
.scelta label.in-linea { margin: 4px 0; }
.scelta select { width: auto; max-width: 100%; }
.dettagli { margin: 8px 0; }
.dettagli summary { cursor: pointer; color: var(--accento); }
.sotto-modulo { margin-top: 12px; padding: 12px; border: 1px solid var(--linea); border-radius: 8px; }


/* --- inventario e mappature (tappa 3) ------------------------------------- */

h4 { font-size: 15px; margin: 16px 0 6px; }
td input[type="text"] { min-width: 140px; }
/* Salvataggio in blocco (SEQ-206 punto 6): le righe cambiate e non ancora salvate hanno il puntino e il bordo. */
.nome-riga { display: flex; align-items: center; gap: 4px; }
.punto-modifica { color: var(--giallo); visibility: hidden; font-size: 14px; }
tr.modificata .punto-modifica { visibility: visible; }
tr.modificata td:first-child { box-shadow: inset 3px 0 0 var(--giallo); }
.stato-riga { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
label.conferma-riga { margin: 0; font-weight: 600; font-size: 14px; white-space: nowrap; }
.barra-salva .azioni { margin: 10px 0; }
button[aria-disabled="true"] { opacity: 0.55; cursor: default; }

/* --- Aspetto approvato nel mockup ACCOUNT-12 ----------------------------- */
body{font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit;line-height:1.45}
button,.bottone{font-size:13px;font-weight:500;min-height:40px;border-radius:7px;color:var(--sul-accento)}
button:hover,.bottone:hover{color:var(--sul-accento)}
a{ text-underline-offset:3px }b,strong{font-weight:600}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--accento);outline-offset:4px}
[hidden]{display:none!important}
.testata{background:var(--testata)}
.testata-dentro,.piede-dentro{max-width:1488px;padding:22px 36px;gap:24px}
.marchio{position:relative;padding-left:45px;font-size:17px;font-weight:600;line-height:1.2;letter-spacing:1px;text-transform:uppercase;flex-shrink:0}
.marchio::before{content:"";position:absolute;left:0;top:1px;width:34px;height:34px;background:var(--accento);mask:url('/icone-stile/account.svg') center/contain no-repeat}
.marchio span{display:block;color:var(--tenue);font-size:10px;font-weight:500;letter-spacing:2.7px;margin-top:6px}
.menu{gap:4px}.menu a{font-size:12px;border-radius:7px;padding:10px 12px}.menu a.attivo{color:var(--testo);box-shadow:inset 0 -2px var(--accento);font-weight:500}
.chi{font-size:11px;gap:12px}.chi button{font-size:12px;padding:6px 12px}
.tema{display:flex;gap:3px;padding:3px;border:1px solid var(--linea);border-radius:7px;background:var(--fondo);margin-left:auto;flex-shrink:0}
.tema button{display:flex;align-items:center;gap:6px;padding:6px 9px;font-size:11px;min-height:32px;border:0;background:transparent;color:var(--tenue)}
.tema button[aria-pressed="true"]{color:var(--testo);background:var(--carta);box-shadow:0 1px 3px #0000000d}
.tema button:hover{background:var(--grigio-fondo);color:var(--testo)}
.icona,.ic{width:20px;height:20px;display:inline-block;vertical-align:middle;background:currentColor;mask:var(--icona) center/contain no-repeat;flex-shrink:0}
.icona-account{--icona:url('/icone-stile/account.svg')}.icona-revenue,.ic-revenue{--icona:url('/icone-stile/revenue.svg')}.icona-ristorante,.ic-ristorante{--icona:url('/icone-stile/ristorante.svg')}.icona-booking,.ic-booking{--icona:url('/icone-stile/booking.svg')}.icona-guest,.ic-guest{--icona:url('/icone-stile/guest.svg')}.icona-studio,.ic-studio{--icona:url('/icone-stile/studio.svg')}.icona-sole{--icona:url('/icone-stile/sun.svg')}.icona-luna{--icona:url('/icone-stile/moon.svg')}.tema .icona{width:14px;height:14px}
main{max-width:1488px;padding:40px 36px 64px;min-width:0}main.stretto{max-width:530px;padding-top:60px}
h1{font-size:30px;font-weight:600;letter-spacing:-1px;margin-bottom:10px}h2{font-size:21px;font-weight:600;letter-spacing:-.5px;margin-top:32px}h3{font-size:16px;font-weight:600}h4{font-size:14px;font-weight:600}
.sotto{font-size:14px;line-height:1.7}.piccolo,.aiuto{font-size:12px;line-height:1.65}
.scheda{padding:26px;margin-bottom:22px}.griglia{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px}
label{font-size:12px;font-weight:500;margin-top:18px;margin-bottom:7px}label.in-linea{font-size:13px}
input[type="text"],input[type="email"],input[type="password"],input[type="number"],select,textarea{background:var(--campo);border-color:var(--bordo-campo);border-radius:7px;min-height:42px;font-size:14px}
input[type="checkbox"],input[type="radio"]{accent-color:var(--accento);width:16px;height:16px;flex-shrink:0}
input::placeholder,textarea::placeholder{color:var(--tenue);opacity:1}
button.secondario,.bottone.secondario{color:var(--testo);border-color:var(--bordo-campo)}button.secondario:hover,.bottone.secondario:hover{color:var(--testo);background:var(--grigio-fondo);border-color:var(--bordo-campo)}
button.pericolo{color:var(--rosso);border-color:var(--rosso)}button.pericolo:hover{color:var(--rosso)}
.riga{gap:16px}.riga>*{min-width:0;flex-basis:200px}.azioni{gap:12px}.azioni>a{font-size:12px}
.avviso{padding:16px 20px;border-radius:10px;border-color:var(--linea);font-size:13px}.avviso a{color:inherit}.avviso.info{color:var(--accento)}
.stato{font-size:11px;font-weight:500;border-radius:6px;padding:5px 9px}.stato::before{width:6px;height:6px;flex-shrink:0}
.tabella-contenitore{max-width:100%;min-width:0}table{font-size:13px}th{font-size:11px;font-weight:500;letter-spacing:.02em;background:var(--grigio-fondo);padding:13px 12px}td{padding:16px 12px;overflow-wrap:anywhere}td input[type="text"]{min-width:0}td select{font-size:12px;max-width:100%;min-width:0}.fila-azioni button{font-size:12px}
#mappature-tipologie table{table-layout:fixed}#mappature-tipologie th:nth-child(4){width:7%}#mappature-tipologie th:nth-child(5){width:20%}#mappature-tipologie th:last-child{width:10%}#mappature-tipologie td{padding:14px 6px}#mappature-tipologie td input[type="text"],#mappature-tipologie td select{font-size:12px;padding:8px 6px}#mappature-tipologie td button{font-size:11px;padding:6px 9px}.nome-riga{min-width:0}.nome-riga input{width:100%}.stato-riga{gap:10px}label.conferma-riga{font-size:11px}.barra-salva{border-top:1px solid var(--linea);padding-top:6px;margin-top:18px}.barra-salva .azioni{justify-content:space-between}.barra-salva p{font-size:12px;color:var(--tenue)}
.connessione{border-radius:12px}.connessione h3{font-size:17px}.connessione .azioni{border-top:1px solid var(--linea);padding-top:16px}.connessione .azioni button{font-size:12px}.dettagli summary{padding:8px 0;font-size:12px}.istruzioni{border-color:var(--bordo-campo);padding-left:18px}.guida{max-width:640px}.guida img{border:1px solid var(--linea);border-radius:10px}.guida figcaption{font-size:11px}.sotto-modulo{padding:20px;background:var(--fondo)}.etichetta{font-size:11px;font-weight:500}.testo-email{font-size:13px}
.piede{font-size:11px}.piede-dentro{padding-top:22px;padding-bottom:22px}.spia{font-family:inherit;font-weight:500}.ambiente{font-weight:500}
/* Accesso: composizione approvata, testi e modulo originali. */
body[data-pagina="accesso"] main.stretto{max-width:1122px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:100px;padding-top:70px;padding-bottom:70px}
.accesso-intro h1{font-size:42px;letter-spacing:-1.5px;font-weight:500}.accesso-intro>.sotto{max-width:36ch}.accesso-area{min-width:0}.accesso-area .scheda{padding:36px}.accesso-area .scheda::before{content:"";display:block;width:42px;height:42px;background:var(--accento);mask:url('/icone-stile/account.svg') center/contain no-repeat;margin-bottom:26px}.accesso-area label:first-of-type{margin-top:0}.accesso-area .azioni{flex-direction:column;align-items:stretch;gap:18px;margin-top:24px}.accesso-area .azioni a{text-align:center}.accesso-area>p{font-size:12px;color:var(--tenue);text-align:center}
.orbita{position:relative;height:265px;width:100%;max-width:350px;margin:28px auto 0}.orbita-anello{position:absolute;inset:20px 22px;border:1px solid var(--linea);border-radius:50%;transform:rotate(-20deg)}.orbita-anello.interno{inset:57px 65px;transform:rotate(30deg)}.nucleo{position:absolute;left:calc(50% - 33px);top:calc(50% - 33px);width:66px;height:66px;display:grid;place-items:center;border:1px solid var(--bordo-campo);border-radius:17px;background:var(--grigio-fondo);box-shadow:0 0 0 14px var(--fondo);color:var(--accento)}.nucleo .icona{width:39px;height:39px}.satellite{display:grid;place-items:center;width:43px;height:43px;background:var(--carta);border:1px solid var(--linea);border-radius:11px;color:var(--accento);position:absolute}.satellite .icona{width:24px;height:24px}.s1{left:16%;top:11%}.s2{right:15%;top:10%}.s3{right:1%;top:47%}.s4{right:25%;bottom:0}.s5{left:4%;bottom:16%}
/* Reflow delle tabelle: le etichette arrivano dalle intestazioni reali. */
@media(max-width:1200px){.testata-dentro{gap:18px}.menu{order:4;flex-basis:100%}.chi{margin-left:auto}.tema{margin-left:0}}
@media(max-width:900px){body[data-pagina="accesso"] main.stretto{gap:40px}.accesso-area .scheda{padding:26px}.tabella-adattabile,.tabella-adattabile tbody,.tabella-adattabile tr,.tabella-adattabile td{display:block;width:100%}.tabella-adattabile thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.tabella-adattabile tr{border:1px solid var(--linea);border-radius:9px;padding:14px;margin-bottom:14px}.tabella-adattabile td{display:grid;grid-template-columns:minmax(90px,30%) minmax(0,1fr);align-items:start;gap:10px;border:0;padding:8px 0!important;text-align:left}.tabella-adattabile td::before{content:attr(data-etichetta);font-size:11px;color:var(--tenue);padding-top:9px}.tabella-adattabile td[data-etichetta=""]{display:block}.tabella-adattabile td[data-etichetta=""]::before{display:none}.tabella-adattabile td>*{min-width:0;max-width:100%}.tabella-adattabile td>input,.tabella-adattabile td>select{grid-column:2}.tabella-adattabile td .stato{white-space:normal}.tabella-adattabile td.numero{text-align:left}tr.modificata td:first-child{box-shadow:none}tr.modificata{border-left:3px solid var(--giallo)}.tabella-contenitore{overflow-x:visible}}
@media(max-width:650px){.testata-dentro,.piede-dentro{padding:18px;gap:16px}.testata-dentro .tema{margin-left:auto}.marchio{font-size:15px;padding-left:37px}.marchio::before{width:28px;height:28px}.marchio span{font-size:9px}.chi{order:5;width:100%;justify-content:space-between;margin:0}.menu{gap:2px}.menu a{font-size:11px;padding:9px}.tema button{padding:6px 7px;font-size:11px}main,main.stretto{padding:28px 18px 40px}h1{font-size:27px}h2{font-size:20px}.scheda{padding:20px}.riga>*{flex-basis:100%;min-width:0}.sotto-modulo{padding:14px}.sotto{font-size:13px}.azioni{gap:12px}input[type="text"],input[type="email"],input[type="password"],input[type="number"],select,textarea,#mappature-tipologie td input[type="text"],#mappature-tipologie td select{font-size:16px}.conferma-riga{white-space:normal!important}body[data-pagina="accesso"] main.stretto{display:block;max-width:480px;padding-top:40px;padding-bottom:40px}.accesso-intro h1{font-size:30px}.accesso-intro .orbita{display:none}.accesso-intro>.sotto{max-width:none;margin-bottom:26px}.accesso-area .scheda{padding:24px}.accesso-area .scheda::before{display:none}.piede-dentro{flex-direction:column;gap:6px}.avviso{padding:14px;font-size:12px}.tabella-adattabile td{grid-template-columns:90px minmax(0,1fr)}.tabella-adattabile td>input[type="checkbox"]{width:16px}.testo-email{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Contratto pubblico di @sequoyaio/guscio: stessa palette per tutti i prodotti. */
.ic-link{--icona:url('/icone-stile/link.svg')}
.icona-prodotto{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border:1px solid var(--linea);border-radius:9px;background:var(--accento-chiaro);color:var(--accento)}
.icona-prodotto .ic{width:22px;height:22px}
.selettore{display:flex;flex-direction:column;gap:6px;min-width:0}
.selettore label{margin:0;color:var(--tenue);font-size:12px}
.selettore select{width:100%;min-width:0}
.stato.neutro{color:var(--tenue);background:var(--grigio-fondo)}
/* Il nome lungo e gli stati restano leggibili nel menu sui telefoni. */
.guscio-testata .guscio-hamburger:hover{color:var(--testo)}
.guscio-testata .guscio-chi{min-width:0;overflow-wrap:anywhere}
.guscio-menu .stato{white-space:normal;max-width:108px;flex-shrink:0}
@media(max-width:650px){.guscio-testata .testata-dentro{flex-wrap:wrap}.guscio-testata .guscio-chi{width:100%;margin-left:0}}

/* Connessioni: prima i due campi; guide e condivisione si aprono su richiesta. */
.modulo-connessione > label { margin-top: 24px; }
.modulo-connessione .aiuto { margin: 10px 0 20px; }
.modulo-connessione .azioni { margin-top: 24px; }

/* La home della suite: gli stessi loghi e la stessa palette nei due temi. */
.programmi-intro { margin: 16px 0 32px; max-width: 760px; }
.programmi-intro h1 { font-size: clamp(30px, 4vw, 44px); letter-spacing: -1.4px; }
.griglia-programmi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.programma { display: flex; flex-direction: column; margin: 0; min-width: 0; padding: 26px; }
.programma-testata { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.programma .icona-prodotto { width: 52px; height: 52px; border-radius: 14px; }
.programma .ic { width: 32px; height: 32px; }
.programma h2 { font-size: 22px; margin: 24px 0 8px; }
.programma > .sotto { margin-top: 0; }
.programma .azioni { margin-top: auto; padding-top: 24px; }
.programma .azioni a { font-size: 13px; }
.programmi-configura { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 32px; padding: 24px 0; border-top: 1px solid var(--linea); }
.programmi-configura h2 { font-size: 18px; }
@media (max-width: 1000px) { .griglia-programmi { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .griglia-programmi { grid-template-columns: 1fr; } .programmi-configura { align-items: flex-start; flex-direction: column; } }

/* L'id di un utente, sotto il suo nome nella tabella Utenti: serve a chi
   configura SEQUOYA_MASTER, e si deve poter selezionare con un doppio clic. */
.id-utente { display: block; font-size: .78rem; color: var(--tenue, #667); user-select: all; }