/* ENOVA LINK — stile famiglia ENOVA (blu/acqua), stesso spirito di ENOVA CALL/FISCALE */
:root{
  --blu:#0b2e9e; --blu-scuro:#071c63; --blu-chiaro:#1547d6; --acqua:#0fc0aa; --acqua-scuro:#0a9c8a;
  --testo:#1b2530; --grigio:#5f6f80; --bordo:#d9e0ea; --sfondo:#f3f6fb; --bianco:#fff;
  --rosso:#d64545; --verde:#1f9d57; --giallo:#d9a300; --arancio:#e07a2b; --viola:#6b46c1;
  --ombra:0 10px 30px rgba(7,20,60,.10); --raggio:12px;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--testo);background:var(--sfondo);font-size:15px;line-height:1.45}
a{color:var(--blu);text-decoration:none} a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0 0 .5em} h2{font-size:20px;color:var(--blu)} h3{font-size:16px;color:var(--blu-scuro)}
.piccolo{font-size:12.5px;color:var(--grigio)} .vuoto{padding:30px;text-align:center;color:var(--grigio)}
code{background:#eef2f9;border:1px solid var(--bordo);border-radius:5px;padding:1px 6px;font-size:12.5px;font-family:ui-monospace,Menlo,Consolas,monospace;word-break:break-all}
pre{background:#0d1b3e;color:#e7eefc;border-radius:10px;padding:14px;overflow:auto;font-size:12.5px;line-height:1.5}

/* bottoni */
.btn{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:9px;padding:9px 16px;font-size:14px;font-weight:600;cursor:pointer;background:#e7ecf5;color:var(--testo);transition:.12s}
.btn:hover{filter:brightness(.97)} .btn:disabled{opacity:.5;cursor:default}
.btn-primario{background:linear-gradient(135deg,var(--blu) 0%,var(--blu-chiaro) 100%);color:#fff}
.btn-acqua{background:linear-gradient(135deg,var(--acqua-scuro),var(--acqua));color:#fff}
.btn-chiaro{background:#eef2f9;color:var(--blu)} .btn-rosso{background:var(--rosso);color:#fff}
.btn-largo{width:100%;justify-content:center;padding:12px} .btn-piccolo{padding:5px 11px;font-size:12.5px}
.btn-ghost{background:transparent;border:1px solid var(--bordo);color:var(--blu)}

/* login */
#schermata-login,#schermata-password{display:none;min-height:100vh;align-items:center;justify-content:center;padding:20px;background:linear-gradient(146deg,var(--blu-scuro) 0%,#0a2a92 52%,var(--blu-chiaro) 100%)}
#schermata-login.attiva,#schermata-password.attiva{display:flex}
.box-login{background:#fff;max-width:430px;width:100%;border-radius:18px;padding:34px 30px;box-shadow:0 24px 60px rgba(4,16,60,.4)}
.logo-login{text-align:center;margin-bottom:8px} .logo-login img{max-width:230px;width:80%}
.sottotitolo{text-align:center;color:var(--grigio);font-size:13.5px;margin-bottom:20px}
.campo{margin-bottom:14px} .campo label{display:block;font-weight:600;font-size:13px;margin-bottom:5px;color:var(--blu-scuro)}
.campo input,.campo select,.campo textarea,.modale-corpo input,.modale-corpo select,.modale-corpo textarea{width:100%;border:1px solid var(--bordo);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;background:#fff}
.campo input:focus{outline:2px solid var(--blu-chiaro);border-color:var(--blu-chiaro)}
.campo-occhio{position:relative} .campo-occhio .occhio{position:absolute;right:8px;top:7px;background:0;border:0;cursor:pointer;font-size:17px}
.avviso{border-radius:9px;padding:10px 12px;font-size:13.5px;margin-top:10px}
.avviso.errore{background:#fdeaea;color:#a12b2b;border:1px solid #f2b8b8}
.piede{margin-top:16px;text-align:center;color:var(--grigio);font-size:12px}

/* struttura app */
#schermata-app{display:none} #schermata-app.attiva{display:block}
.barra-alta{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:14px;background:#fff;border-bottom:1px solid var(--bordo);padding:8px 18px;box-shadow:0 2px 10px rgba(7,20,60,.05)}
.barra-alta .marchio img{height:42px;display:block} .spazio{flex:1}
.utente-info{display:flex;flex-direction:column;align-items:flex-end;background:0;border:0;cursor:pointer;line-height:1.15}
.utente-info b{font-size:13.5px} .utente-info small{font-size:11.5px;color:var(--grigio)}
.esci{background:#eef2f9;border:0;border-radius:8px;padding:8px 12px;cursor:pointer;font-size:13px;font-weight:600;color:var(--blu)}
.menu{display:flex;gap:4px;flex-wrap:wrap;padding:10px 18px 0;background:#fff;border-bottom:1px solid var(--bordo);position:sticky;top:51px;z-index:40}
.menu button{background:0;border:0;border-bottom:3px solid transparent;padding:9px 14px;cursor:pointer;font-size:14px;font-weight:600;color:var(--grigio);display:flex;align-items:center;gap:7px;border-radius:8px 8px 0 0}
.menu button:hover{background:#f3f6fb;color:var(--blu)} .menu button.attivo{color:var(--blu);border-bottom-color:var(--acqua)}
.menu .mi{font-size:16px}
.contenuto{max-width:1180px;margin:0 auto;padding:22px 18px 60px}

/* schede/riquadri */
.riquadro{background:#fff;border:1px solid var(--bordo);border-radius:var(--raggio);box-shadow:var(--ombra);padding:18px;margin-bottom:18px}
.riquadro>h3{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.griglia{display:grid;gap:16px} .g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.griglia-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.tile{background:linear-gradient(135deg,#fff,#f7faff);border:1px solid var(--bordo);border-radius:12px;padding:16px}
.tile .n{font-size:26px;font-weight:800;color:var(--blu)} .tile .e{font-size:12.5px;color:var(--grigio)}

/* tabelle */
table.tab{width:100%;border-collapse:collapse;font-size:13.5px}
table.tab th,table.tab td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--bordo);vertical-align:middle}
table.tab th{color:var(--grigio);font-size:12px;text-transform:uppercase;letter-spacing:.3px;background:#fafcff}
table.tab tr:hover td{background:#f7faff}
.azioni{white-space:nowrap;text-align:right} .azioni .btn{margin-left:5px}
.badge{display:inline-block;border-radius:999px;padding:2px 10px;font-size:11.5px;font-weight:700;color:#fff;background:var(--grigio)}
.badge.verde{background:var(--verde)} .badge.rosso{background:var(--rosso)} .badge.giallo{background:var(--giallo)} .badge.blu{background:var(--blu-chiaro)} .badge.grigio{background:#9aa7b6} .badge.acqua{background:var(--acqua-scuro)} .badge.arancio{background:var(--arancio)} .badge.viola{background:var(--viola)}
.az{display:inline-block;border-radius:6px;padding:2px 8px;font-size:11px;font-weight:700;color:#fff}

/* interruttori permessi */
.interruttore{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;cursor:pointer;margin:3px 10px 3px 0}
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px;margin:8px 0}

/* modale */
.sfondo-modale{display:none;position:fixed;inset:0;background:rgba(7,20,60,.5);z-index:100;align-items:flex-start;justify-content:center;padding:30px 16px;overflow:auto}
.sfondo-modale.aperto{display:flex}
.modale{background:#fff;border-radius:16px;width:100%;max-width:560px;box-shadow:0 30px 70px rgba(4,16,60,.45);animation:su .15s}
@keyframes su{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
.modale-testa{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--bordo)}
.modale-testa h2{margin:0;font-size:17px} .chiudi{background:0;border:0;font-size:24px;cursor:pointer;color:var(--grigio);line-height:1}
.modale-corpo{padding:18px 20px;max-height:66vh;overflow:auto} .modale-piede{padding:14px 20px;border-top:1px solid var(--bordo);display:flex;justify-content:flex-end;gap:10px}
.aiuto{font-size:12px;color:var(--grigio);margin-top:4px}
.sezione-form{border-top:1px solid var(--bordo);margin-top:14px;padding-top:12px}

/* brindisi (toast) */
#brindisi{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(80px);background:var(--blu-scuro);color:#fff;padding:12px 20px;border-radius:10px;box-shadow:0 12px 30px rgba(4,16,60,.4);z-index:200;opacity:0;transition:.25s;font-size:14px;max-width:90vw}
#brindisi.mostra{transform:translateX(-50%);opacity:1} #brindisi.errore{background:var(--rosso)}

.riga-strumenti{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.riga-strumenti .cresci{flex:1}
.chip{display:inline-flex;align-items:center;gap:6px;background:#eef2f9;border-radius:999px;padding:4px 11px;font-size:12.5px;color:var(--blu-scuro);font-weight:600}
.pallino{width:9px;height:9px;border-radius:50%;background:#9aa7b6;display:inline-block} .pallino.verde{background:var(--verde)} .pallino.rosso{background:var(--rosso)} .pallino.giallo{background:var(--giallo)}

@media (max-width:720px){
  .g2,.g3,.griglia-2{grid-template-columns:1fr}
  .contenuto{padding:16px 14px 50px}
  .barra-alta{padding:8px 12px;gap:8px} .barra-alta .marchio img{height:28px}
  table.tab thead{display:none}
  table.tab,table.tab tbody,table.tab tr,table.tab td{display:block;width:100%}
  table.tab tr{border:1px solid var(--bordo);border-radius:10px;margin-bottom:10px;padding:6px 10px;background:#fff}
  table.tab td{border:0;padding:6px 0;display:flex;justify-content:space-between;gap:12px}
  table.tab td::before{content:attr(data-et);font-weight:700;color:var(--grigio);font-size:12px}
  table.tab td.azioni{justify-content:flex-end} table.tab td.azioni::before{content:''}
}

/* =====================================================================
   v1.1.0 — VESTE GRAFICA ENOVA APT (stessa famiglia visiva):
   filigrana azzurra sfumata, intestazione con linea blu→acqua, menu a
   pillole con icona nel riquadro, schede senza bordo con ombre morbide,
   pulsanti sfumati, badge a pillola
   ===================================================================== */
:root {
  --raggio: 14px;
  --ombra: 0 6px 18px rgba(11,46,158,.10), 0 1px 3px rgba(11,46,158,.06);
  --sfondo: #edf2fb; --superficie: #ffffff; --superficie-2: #f7f9fc;
  --linea: #e3e9f4; --linea-2: #c1cad6; --blu-bg: #e6ecfa; --bordo-attivo: #c9d6f7; --testo-2: #5f6f80;
}
body { background: #eef3fc; letter-spacing: -.005em; }
/* filigrana */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(1100px 640px at 102% -8%, rgba(21,71,214,.42), rgba(20,190,224,.22) 40%, transparent 66%),
    radial-gradient(1000px 620px at -8% 106%, rgba(11,46,158,.46), rgba(21,71,214,.18) 45%, transparent 66%),
    radial-gradient(700px 420px at 55% 50%, rgba(15,192,170,.06), transparent 65%),
    linear-gradient(180deg, #e9effb 0%, #f0f4fd 55%, #ecf2fc 100%);
}
#schermata-login, #schermata-password {
  position: relative; z-index: 0;
  background:
    radial-gradient(1000px 520px at 82% 6%, rgba(20,190,224,.35), transparent 62%),
    radial-gradient(760px 460px at 8% 96%, rgba(15,192,170,.30), transparent 60%),
    linear-gradient(146deg, #071c63 0%, #0a2a92 52%, #1547d6 100%);
}
.box-login { border-radius: 16px; box-shadow: 0 20px 50px rgba(4,16,60,.34); }
:focus-visible { outline: 2px solid var(--acqua); outline-offset: 2px; }

/* intestazione */
.barra-alta { position: sticky; height: 64px; padding: 0 20px; border-bottom: none; box-shadow: 0 1px 0 var(--linea), 0 4px 16px rgba(11,46,158,.06); }
.barra-alta::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: linear-gradient(90deg, #0b2e9e, #0fc0aa 60%, #14bee0); pointer-events: none; }
.barra-alta .marchio img { height: 44px; width: auto; }
.barra-alta .utente-info b { color: var(--blu); }
.barra-alta .esci, .barra-alta .utente-info { border-radius: 999px; background: var(--superficie-2); border: 1px solid var(--linea); color: var(--blu); padding: 7px 14px; }
.barra-alta .esci:hover, .barra-alta .utente-info:hover { background: var(--sfondo); }

/* menu a pillole con icona */
.menu { top: 64px; display: flex; gap: 8px; padding: 10px 14px; background: transparent; border-bottom: none; overflow: visible; }
.menu button {
  flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  padding: 7px 4px; font-size: 12.5px; font-weight: 600; line-height: 1.15; text-align: center;
  border: 1px solid var(--linea); border-bottom: 1px solid var(--linea); border-radius: 12px; background: var(--superficie); color: var(--testo-2);
  min-height: 60px; position: relative; box-shadow: var(--ombra); transition: box-shadow .15s, transform .06s, border-color .15s;
}
.menu button .mi { width: 30px; height: 30px; border-radius: 9px; background: var(--sfondo); display: grid; place-items: center; font-size: 16px; line-height: 1; }
.menu button:hover { color: var(--blu); border-color: var(--bordo-attivo); background: var(--superficie); }
.menu button.attivo { background: var(--superficie); color: var(--blu); border-color: var(--bordo-attivo); box-shadow: inset 0 -3px 0 var(--acqua), var(--ombra); }
.menu button.attivo .mi { background: var(--blu-bg); }

/* contenuti */
.contenuto { padding-bottom: 90px; animation: entra .18s ease; }
@keyframes entra { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.riquadro { border: none; border-radius: 16px; box-shadow: var(--ombra); }
.riquadro > h3 { position: relative; padding-left: 16px; }
.riquadro > h3::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background: var(--acqua); }
.tile { border: none; border-radius: 16px; padding: 16px 18px; position: relative; overflow: hidden; background: var(--superficie); box-shadow: var(--ombra); }
.tile::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--blu-chiaro); }
.tile:nth-child(2)::before { background: var(--acqua); } .tile:nth-child(3)::before { background: var(--verde); } .tile:nth-child(4)::before { background: #14bee0; }
.tile .n { font-size: 34px; letter-spacing: -.03em; }
.tile .e { font-size: 11.5px; text-transform: uppercase; letter-spacing: .6px; font-weight: 700; }
.tiles { margin-bottom: 18px; }

/* pulsanti */
.btn { border-radius: 10px; }
.btn-primario { background: linear-gradient(135deg, #0b2e9e, #1547d6); color: #fff; box-shadow: 0 4px 12px rgba(11,46,158,.22); border: none; }
.btn-primario:hover { box-shadow: 0 6px 16px rgba(11,46,158,.3); transform: translateY(-1px); filter: none; }
.btn-acqua { background: linear-gradient(135deg, #0fc0aa, #14bee0); color: #052b26; border: none; box-shadow: 0 4px 12px rgba(15,192,170,.25); }
.btn-acqua:hover { transform: translateY(-1px); filter: none; }
.btn-chiaro { background: var(--superficie); color: var(--blu); border: 1px solid var(--linea); box-shadow: var(--ombra); }
.btn-chiaro:hover { background: var(--superficie-2); }
.btn-ghost { background: var(--superficie-2); border-color: var(--linea); }
.btn-rosso { background: #fdecea; color: var(--rosso); }

/* badge, campi, tabelle, finestre */
.badge { border-radius: 999px; padding: 3px 9px; font-size: 10.5px; letter-spacing: .4px; }
.chip { background: var(--blu-bg); }
.campo label { font-weight: 700; font-size: 12px; letter-spacing: .4px; text-transform: uppercase; color: var(--testo-2); }
.campo input, .campo select, .campo textarea, .modale-corpo input, .modale-corpo select, .modale-corpo textarea { border-radius: 10px; border-color: var(--linea); background: var(--sfondo); }
.campo input:focus, .campo select:focus, .campo textarea:focus, .modale-corpo input:focus, .modale-corpo select:focus { outline: none; background: var(--superficie); border-color: var(--acqua); box-shadow: 0 0 0 3px rgba(15,192,170,.18); }
.box-login .campo input { background: #fff; border-color: var(--linea-2); }
table.tab th { background: var(--superficie-2); border-bottom-color: var(--linea); }
table.tab td { border-bottom-color: var(--linea); }
table.tab tbody tr:hover td { background: var(--superficie-2); }
.sfondo-modale { backdrop-filter: blur(2px); background: rgba(16,32,52,.55); }
.modale { border-radius: 20px; }
.modale-testa, .modale-piede { border-color: var(--linea); }
.sezione-form > h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--blu); font-weight: 800; border-bottom: 2px solid var(--linea); padding-bottom: 7px; }
.avviso { border-radius: 12px; }
.avviso.info { background: var(--blu-bg); color: var(--blu); border: 0; }
.vuoto::before { content: "◌"; display: block; font-size: 28px; color: var(--acqua); margin-bottom: 6px; }

/* telefono: menu a pillole compatte in griglia */
@media (max-width: 720px) {
  .barra-alta { height: 54px; padding: 0 10px; gap: 6px; }
  .barra-alta .marchio img { height: auto; max-height: 34px; max-width: 100%; }
  .barra-alta .esci, .barra-alta .utente-info { padding: 7px 10px; font-size: 12.5px; }
  .menu { top: 54px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; padding: 6px 8px; }
  .menu button { min-height: 46px; padding: 4px 2px 5px; gap: 2px; font-size: 10px; border-radius: 10px; }
  .menu button .mi { width: 24px; height: 24px; font-size: 14px; border-radius: 7px; }
  .tile .n { font-size: 26px; }
  .modale { border-radius: 16px; }
}
/* istruzioni */
.tasto { display: inline-block; background: var(--blu-bg); color: var(--blu); border-radius: 7px; padding: 1px 8px; font-weight: 700; font-size: 13px; white-space: nowrap; }
.istr-corpo h4 { color: var(--blu); margin: 14px 0 6px; }
.istr-corpo table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 6px 0; }
.istr-corpo th, .istr-corpo td { text-align: left; vertical-align: top; padding: 7px 8px; border-bottom: 1px solid var(--linea); }
.istr-corpo th { background: var(--superficie-2); font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--testo-2); }
.istr-corpo ul, .istr-corpo ol { padding-left: 20px; }

/* =====================================================================
   ENOVA AGENTI — aggiunte: selettore portale, portale Venus incorporato
   ===================================================================== */
.selettore-portale{display:flex;align-items:center;gap:8px;background:var(--superficie-2);border:1px solid var(--linea);border-radius:999px;padding:5px 12px 5px 6px;cursor:pointer;font-size:13px;max-width:280px}
.selettore-portale:hover{background:var(--sfondo)}
.selettore-portale.unico{cursor:default}
.selettore-portale .pt-sigla{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:24px;padding:0 7px;border-radius:999px;background:var(--blu);color:#fff;font-weight:800;font-size:11.5px}
.selettore-portale .pt-nome{font-weight:700;color:var(--blu-scuro);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}
.selettore-portale .pt-freccia{color:var(--grigio);font-size:11px}
@media(max-width:720px){.selettore-portale .pt-nome{display:none}}

/* contenuto a pieno schermo per il portale Venus */
.contenuto.pieno{max-width:none;padding:10px 12px 0;height:calc(100vh - 64px - 80px);min-height:420px}
@media(max-width:720px){.contenuto.pieno{padding:6px 6px 0;height:calc(100vh - 54px - 150px)}}
#venus-box{position:relative;height:100%;border-radius:14px;overflow:hidden;box-shadow:var(--ombra);background:#fff;border:1px solid var(--linea)}
#venus-frame{width:100%;height:100%;border:0;display:block}
#venus-caricamento{position:absolute;inset:0;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;background:#eef3fc;color:var(--grigio);font-size:14px;z-index:2}
.spin{width:34px;height:34px;border-radius:50%;border:3px solid rgba(11,46,158,.18);border-top-color:var(--blu);animation:ej-gira .8s linear infinite}
@keyframes ej-gira{to{transform:rotate(360deg)}}

/* liste portali / collegamenti */
.lista-portali,.rec-portale{display:flex;flex-direction:column;gap:8px}
.rec-portale{flex-direction:row;align-items:center;gap:10px;width:100%;text-align:left;background:#fff;border:1px solid var(--linea);border-radius:12px;padding:11px 14px;cursor:pointer;font-size:14px;font-weight:600;color:var(--testo)}
.rec-portale:hover{border-color:var(--acqua)}
.rec-portale.sel{border-color:var(--blu-chiaro);box-shadow:0 0 0 3px rgba(21,71,214,.12)}

/* =====================================================================
   ENOVA AGENTI 1.1 — Struttura rete
   ===================================================================== */
.st-nuovi{display:flex;gap:8px;flex-wrap:wrap}
.st-piramide{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px}
.st-liv{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--blu-scuro);font-size:13.5px}
.st-liv span{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--blu),var(--blu-chiaro));color:#fff;display:grid;place-items:center;font-size:12px}
.st-liv small{font-weight:600;color:var(--grigio)}
.st-fr{color:var(--acqua);font-weight:800}
.st-schede{display:flex;gap:6px}
.st-canale>h3{display:flex;align-items:center;gap:8px}
.st-aree{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.st-area{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;background:var(--superficie-2);border:1px solid var(--linea);border-radius:12px;padding:10px 12px;cursor:pointer;font-size:13.5px;color:var(--testo)}
.st-area span{font-size:12px;color:var(--grigio)}
.st-area:hover{border-color:var(--acqua)} .st-area.sel{border-color:var(--blu-chiaro);box-shadow:0 0 0 3px rgba(21,71,214,.12);background:#fff}
.st-gruppo{margin-bottom:14px}
.st-gruppo-testa{display:flex;align-items:center;gap:10px;padding:8px 2px;border-bottom:2px solid var(--linea);margin-bottom:4px}
.st-gruppo-testa .btn{margin-left:auto}
tr.st-spento td{opacity:.6}
.st-testa-scheda{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.st-tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}
.st-perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:6px 14px}
.st-perm{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--linea);border-radius:10px;font-size:13px;background:#fff}
.st-sino{display:flex;gap:10px;white-space:nowrap;font-weight:600}
.st-sino label{display:inline-flex;gap:4px;align-items:center;cursor:pointer}
.st-barra{height:10px;border-radius:999px;background:var(--linea);overflow:hidden;margin-top:10px}
.st-barra>div{height:100%;background:linear-gradient(90deg,var(--blu),var(--acqua));transition:width .4s}
.riga-accesso{padding:8px 0;border-bottom:1px solid var(--linea)}
@media(max-width:720px){.st-perm-grid{grid-template-columns:1fr}}