*{box-sizing:border-box}html{color-scheme:light dark}body{margin:0;font:14px/1.5 var(--font);background:var(--bg);color:var(--ink)}
a{color:var(--acc)}h1,h2,h3{margin:0}
.app{display:grid;grid-template-columns:230px 1fr;min-height:100vh}
.sidebar{background:linear-gradient(180deg,var(--side),var(--side-2));color:var(--side-ink);position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.brand{padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}.brand span{font-size:11px;color:#5eead4;letter-spacing:.08em;text-transform:uppercase;width:100%}.brand b{color:#fff;font-size:14px}.hamb{display:none;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:6px;font-size:16px;padding:4px 8px}
.nav{padding:12px 10px;display:flex;flex-direction:column;gap:2px}.nav a{color:var(--side-ink);text-decoration:none;padding:10px 13px;border-radius:9px;font-weight:600;font-size:13.5px}.nav a:hover{background:rgba(255,255,255,.06);color:#fff}.nav a.on{background:var(--side-on);color:#fff}.nav .sep{padding:10px 13px 4px;font-size:10px;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.1em}
.who{margin-top:auto;padding:14px 20px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#94a3b8}.who b{display:block;color:#fff;font-size:13px}.who small{display:block;margin:4px 0 10px;text-transform:capitalize}.who form{display:flex;gap:6px;flex-wrap:wrap}.who .btn.ghost{color:#cbd5e1;border-color:rgba(255,255,255,.35)}
.main{min-width:0}.topbar{background:var(--panel);border-bottom:1px solid var(--line);padding:14px 28px;display:flex;justify-content:space-between;gap:12px;align-items:center;position:sticky;top:0;z-index:5}.topbar h1{font-size:19px;font-weight:800}.topbar p{margin:3px 0 0;color:var(--mut);font-size:12.5px}.topbar-right{display:flex;gap:8px;align-items:center;flex-shrink:0}
.view{padding:24px 28px 60px;max-width:1600px;margin:0 auto}.piede{font-size:11px;color:var(--mut);padding:16px 0 0;margin-top:24px;border-top:1px solid var(--line-2)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:15px 16px}.kpi .v{font-size:22px;font-weight:800}.kpi .l{font-size:11.5px;color:var(--mut);margin-top:2px}.kpi.acc{background:linear-gradient(135deg,var(--acc-2),var(--acc));color:#fff;border:0}.kpi.acc .l{color:rgba(255,255,255,.85)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:18px;overflow:hidden}.panel>h2{padding:13px 18px;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);background:var(--panel-2);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;flex-wrap:wrap}.panel>h2 .yr{font-weight:600;color:var(--mut);text-transform:none;letter-spacing:0;font-size:11.5px}.panel>h2 .btn{margin-left:auto}.panel>:not(h2){padding:0 18px}.panel>.tablewrap{padding:0}.panel>p,.panel>.grid2,.panel>.form,.panel>.cards,.panel>.empty,.panel>.upload{padding:14px 18px}
.tablewrap{overflow-x:auto}table.tab{width:100%;border-collapse:collapse;font-size:13px}.tab th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--mut);padding:9px 14px;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0;background:var(--panel)}.tab th[data-sort]{cursor:pointer;user-select:none}.tab th[data-sort]:hover{color:var(--ink)}.tab th .dir{font-size:9px;margin-left:4px}.tab td{padding:9px 14px;border-bottom:1px solid var(--line-2);vertical-align:top}.tab td small{display:block;font-size:11px;color:var(--mut)}.tab tr:hover td{background:var(--panel-2)}.num{text-align:right;font-variant-numeric:tabular-nums}.mono{font-family:var(--mono);font-size:12px}
.tab-filters{display:flex;gap:8px;flex-wrap:wrap;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--panel-2)}.tab-filters input,.tab-filters select{font:inherit;font-size:12px;padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);min-width:120px}
.tag{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:6px;background:var(--line-2);color:var(--mut)}.tag.warn{background:var(--warn-bg);color:var(--warn-ink)}.tag.ok{background:var(--ok-bg);color:var(--ok-ink)}.tag.err{background:var(--err-bg);color:var(--err-ink)}.tag.info{background:var(--info-bg);color:var(--info-ink)}
.miss{display:inline-block;font-size:10px;background:var(--warn-bg);color:var(--warn-ink);border-radius:5px;padding:2px 6px;margin:2px 3px 0 0;text-decoration:none}.ok{display:inline-block;font-size:10px;background:var(--ok-bg);color:var(--ok-ink);border-radius:5px;padding:2px 6px}
.btn{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:13px;font-weight:600;padding:8px 12px;border:1px solid var(--line);background:var(--panel);color:var(--acc-ink);border-radius:var(--radius-s);cursor:pointer;text-decoration:none;min-height:36px}.btn.primary{background:var(--acc);color:#fff;border-color:var(--acc)}.btn.ghost{background:transparent}.btn.small{padding:5px 10px;font-size:12px;min-height:30px}.btn:disabled{opacity:.5;cursor:default}
.form{display:grid;gap:12px}.form label{display:grid;gap:5px;font-size:12px;color:var(--mut);font-weight:600}.form input,.form select,.form textarea{font:inherit;font-size:14px;color:var(--ink);padding:9px 10px;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--panel);width:100%}.form .actions{display:flex;gap:8px;grid-column:1/-1}.form .small,.form p{grid-column:1/-1}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.kv{margin:0}.kv>div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line-2)}.kv dt{color:var(--mut)}.kv dd{margin:0;font-weight:600;text-align:right}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}.card{display:block;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;text-decoration:none;color:var(--ink)}.card:hover{border-color:var(--acc-2)}.card .eyebrow{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--acc);margin-bottom:6px}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--acc);font-weight:700}
.empty{padding:22px;text-align:center;color:var(--mut);border:1px dashed var(--line);border-radius:var(--radius-s);margin:14px 18px}.alert{background:var(--err-bg);color:var(--err-ink);padding:10px 12px;border-radius:var(--radius-s);margin-bottom:12px}.muted{color:var(--mut)}.small{font-size:12px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px;margin-bottom:18px}.tabs a{padding:8px 12px;border-radius:7px;text-decoration:none;color:var(--mut);font-weight:600}.tabs a.on,.tabs a:hover{background:var(--acc-soft);color:var(--acc-ink)}.tabs .muted{margin-left:auto}
.upload summary{list-style:none;display:inline-flex;margin-bottom:12px}.upload summary::-webkit-details-marker{display:none}
.tip{position:fixed;z-index:50;background:var(--ink);color:var(--bg);font-size:12px;padding:6px 9px;border-radius:6px;pointer-events:none;max-width:280px}
body.login{display:grid;place-items:center;min-height:100vh;padding:20px}.login-box{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:32px;width:100%;max-width:440px}.login-box h1{font-size:28px;margin:8px 0 12px}
@media(max-width:900px){.app{grid-template-columns:1fr}.sidebar{position:static;height:auto}.hamb{display:block}.nav,.who{display:none}.sidebar.open .nav,.sidebar.open .who{display:flex}.kpis{grid-template-columns:1fr 1fr}.grid2{grid-template-columns:1fr}.view,.topbar{padding-left:16px;padding-right:16px}.topbar{flex-wrap:wrap}}
@media(max-width:520px){.kpis{grid-template-columns:1fr}.kpi .v{font-size:20px}}

/* --- tappa 1b: grafici, mappa, blocchi energia --- */
.chart svg{width:100%;height:auto;display:block;color:var(--ink)}
.chart rect[data-tip]{cursor:default}
.grafico-blocco{padding:10px 18px 4px}.grafico-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;margin-bottom:4px}
.due-colonne{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px;align-items:start}
.due-colonne .lato{padding:14px 18px}
.due-forms{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:0 18px 14px}
/* Le azioni in evidenza dell'Energy Management (Dario, 21/09: «bisognerebbe metterci una sezione
   con i tastini in evidenza»): tre bottoni grandi, ognuno apre il suo modulo. */
.azioni-evidenza{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;padding:14px 18px}
.azioni-evidenza>details{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-s);padding:12px}
.azioni-evidenza>details[open]{grid-column:1/-1}
.azioni-evidenza summary{width:100%;justify-content:center;font-size:14px;padding:12px 16px;text-align:center}
.azioni-evidenza .suggerimento{margin:8px 0 0;font-size:12px}
/* La riga a comparsa del contratto (Dario, 21/09): il modulo non sta piu' stretto in una colonna,
   apre come riga intera sotto il contatore. Lo stesso meccanismo apre «Cosa c'è in questo
   edificio» riga per riga («vale per tutti», Dario 21/09). */
tr.riga-modifica td{background:var(--panel-2);padding:14px 18px}
.btn-riga{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--acc-ink);cursor:pointer;text-align:left}
.btn-riga:hover{text-decoration:underline}
.scelta-rapida{display:flex;gap:8px;margin-bottom:10px}
.form-inline{display:flex;gap:10px;align-items:end;margin-bottom:10px;flex-wrap:wrap}
.form-inline label{display:grid;gap:5px;font-size:12px;color:var(--mut);font-weight:600}
.form-inline select{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--panel);color:var(--ink)}
/* L'istruzione sopra la mappa del segnaposto (Dario, 21/09: «un'istruzioncina, più grande»). */
.istruzione-mappa{font-size:13.5px;font-weight:600;color:var(--ink);background:var(--acc-soft);border-radius:var(--radius-s);padding:9px 12px;margin:0 0 10px}
.etichetta-marker{background:#fff;padding:2px 7px;border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,.35);white-space:nowrap}
.pie{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.pie svg{width:150px;height:150px;flex-shrink:0;color:var(--ink)}
.pie .leg{font-size:12px;display:grid;gap:8px}.pie .leg i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
.pie .leg span{display:block;color:var(--mut);margin-left:16px}
.mappa{height:380px;background:var(--panel-2);border-top:1px solid var(--line)}.mappa.sat{height:300px;border:1px solid var(--line);border-radius:var(--radius-s);margin:14px 0 0}
.legenda{display:flex;gap:14px;flex-wrap:wrap;font-size:11px;color:var(--mut);padding:8px 18px}.legenda i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:middle}
.warn-text{color:var(--warn-ink)}
.barre{padding:12px 18px}.barrow{display:flex;align-items:center;gap:10px;margin:7px 0;font-size:12.5px}
.barrow .nm{width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none}
.barrow .tr{flex:1;background:var(--line-2);border-radius:6px;height:16px;overflow:hidden}
.barrow .fl{display:block;height:100%;min-width:3px;background:linear-gradient(90deg,var(--acc),var(--acc-2))}
.barrow .vl{width:100px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.tab tr.tot td{font-weight:700;background:var(--panel-2)}
h3.sub{padding:14px 18px 2px;font-size:14px}
.gruppo{border-top:1px solid var(--line-2)}.gruppo summary{padding:12px 18px;cursor:pointer;font-size:13px}
.kpis.dentro{padding:14px 18px 0;margin-bottom:0}
.tabs a{scroll-margin-top:80px}section[id]{scroll-margin-top:80px}
@media(max-width:900px){.due-colonne,.due-forms{grid-template-columns:1fr}.barrow .nm{width:120px}}
.elenco{margin:0;padding:14px 18px 14px 34px;font-size:13px}.elenco li{margin:4px 0}
.annate{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid var(--line-2)}
.annate .etichetta{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);font-weight:700;margin-right:4px}
.annate .anno{display:inline-flex;align-items:center;min-height:30px;padding:4px 11px;border:1px solid var(--line);border-radius:999px;font-size:13px;font-weight:600;text-decoration:none;color:var(--acc-ink);background:var(--panel)}
/* verde completo, giallo con buchi, rosso vuoto (Dario, 21/09); l'anno scelto si riconosce dal bordo spesso */
.annate .anno.completo{background:#dcfce7;border-color:#16a34a;color:#14532d}
.annate .anno.incompleto{background:#fef3c7;border-color:#d97706;color:#78350f}
.annate .anno.vuoto{background:#fee2e2;border-color:#dc2626;color:#7f1d1d}
.annate .anno.on{box-shadow:0 0 0 2px var(--panel),0 0 0 4px currentColor;font-weight:800}
.annate .anno.reimposta{border-style:dashed;color:var(--mut);font-weight:500}
.avviso-dati{margin:0;padding:10px 18px;background:var(--warn-bg);color:var(--warn-ink);font-size:12.5px;border-bottom:1px solid var(--line-2)}

.riga-incarico{padding:3px 0}.riga-incarico .muted{margin-left:6px}

/* --- manutenzione: stepper, azioni, storico, avvisi --- */
.stepper{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 12px}
.stepper li{display:flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;border:1px solid var(--line);background:var(--panel-2);font-size:12px;color:var(--mut)}
.stepper li i{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--line);color:var(--mut);font-style:normal;font-size:11px}
.stepper li.fatto{border-color:var(--acc-2);color:var(--acc-ink)}
.stepper li.fatto i{background:var(--acc-2);color:#fff}
.stepper li.ora{border-color:var(--acc-2);background:var(--acc-2);color:#fff;font-weight:600}
.stepper li.ora i{background:#fff;color:var(--acc-ink)}
.stepper li.poi{opacity:.55}

.azione{margin-bottom:8px}
.azione > summary{display:inline-block;cursor:pointer;list-style:none}
.azione > summary::-webkit-details-marker{display:none}
.azione[open] > summary{margin-bottom:8px}
.azione form{border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--panel-2)}

.storico{list-style:none;padding:0;margin:0;border-left:2px solid var(--line)}
.storico li{position:relative;padding:0 0 14px 16px}
.storico li::before{content:"";position:absolute;left:-6px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--acc-2);border:2px solid var(--panel)}
.storico li b{display:block;font-size:13px}
.storico li small{display:block;color:var(--mut);font-size:11.5px}
.storico li p{margin:4px 0 0;font-size:13px;white-space:pre-wrap}

.tab.righe th{width:190px;text-align:left;vertical-align:top;color:var(--mut);font-weight:600;font-size:12.5px}
.tab.righe td{font-size:13px}

.minikpi{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.minikpi span{display:flex;flex-direction:column;font-size:11px;color:var(--mut)}
.minikpi span i{font-style:normal;font-size:17px;font-weight:700;color:var(--ink)}

.form.filtri{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;align-items:end}
.form .azioni{display:flex;gap:8px;align-items:center}
.form .larga{grid-column:1/-1}
.form.grande{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}

.campanella{position:relative;text-decoration:none;font-size:17px;line-height:1;padding:6px 8px;border-radius:8px}
.campanella:hover{background:var(--panel-2)}
.campanella i{position:absolute;top:0;right:0;font-style:normal;font-size:10px;font-weight:700;background:#dc2626;color:#fff;border-radius:999px;padding:1px 5px}
.avvisi li.nuovo{border-left:3px solid var(--acc-2);padding-left:8px}
.avvisi li p{margin:3px 0 0;font-size:12.5px;color:var(--mut)}

@media (max-width:760px){
 .due-colonne{grid-template-columns:1fr}
 .stepper li span{display:none}
 .stepper li.ora span{display:inline}
}

/* --- patrimonio, opportunità, clima --- */
.kpi.grande div{font-size:26px}
.gruppo h3{display:flex;align-items:center;gap:10px;justify-content:space-between;margin:14px 0 6px;font-size:14px}
form.inline{display:inline}
.elenco li small{display:block;color:var(--mut);font-size:11.5px}

.panel.evidenza{border-color:var(--acc-2);box-shadow:0 0 0 3px var(--acc-soft)}
.password-vista code{font-size:20px;letter-spacing:.5px;background:var(--panel-2);padding:8px 12px;border-radius:8px;display:inline-block}
tr.appena{background:var(--acc-soft)}
.piccolo{font-size:11.5px;word-break:break-all}

/* Il menu e' cresciuto: scorre da solo invece di finire sotto il blocco dell'utente */
.nav{overflow-y:auto;flex:1 1 auto;min-height:0;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.25) transparent}
.nav::-webkit-scrollbar{width:6px}
.nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:3px}
.who{flex:0 0 auto}
@media(max-width:900px){.nav{max-height:60vh}}
.azione{margin-bottom:4px}
.azione>summary{margin:0}
.tab tfoot tr.tot td{border-top:2px solid var(--line);background:var(--panel-2);font-weight:700}
.btn.disabilitato{opacity:.5;cursor:default}

/* --- selettore di edificio in testa alla sidebar ---
   Con quaranta edifici un elenco in colonna non si legge: si mostra dove sei e si salta
   altrove con una ricerca. */
.ctx{padding:10px;border-bottom:1px solid rgba(255,255,255,.08)}
.ctx .su{display:block;color:#94a3b8;text-decoration:none;font-size:12px;font-weight:600;padding:6px 8px;border-radius:8px}
.ctx .su:hover{background:rgba(255,255,255,.06);color:#fff}
.sel{width:100%;text-align:left;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#fff;border-radius:10px;padding:10px 12px;cursor:pointer;font:inherit;display:flex;gap:10px;align-items:center;margin-top:4px}
.sel:hover{background:rgba(255,255,255,.12)}
.sel .txt{min-width:0;flex:1}
.sel b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sel small{display:block;color:#94a3b8;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sel .frec{color:#94a3b8;font-size:11px}
.velo-sel{position:fixed;inset:0;z-index:30}
.tendina-sel{position:fixed;z-index:40;width:250px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.28);overflow:hidden;max-height:70vh;display:flex;flex-direction:column}
.tendina-sel .cerca{padding:10px;border-bottom:1px solid var(--line)}
.tendina-sel .cerca input{width:100%;font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);color:var(--ink)}
.tendina-sel .lista{overflow-y:auto;padding:6px}
.tendina-sel .gr{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut);font-weight:700;padding:8px 10px 4px}
.tendina-sel .voce{display:flex;gap:8px;align-items:center;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:13px}
.tendina-sel .voce:hover,.tendina-sel .voce:focus{background:var(--panel-2);outline:none}
.tendina-sel .voce.on{background:var(--acc-soft);color:var(--acc-ink);font-weight:700}
.tendina-sel .voce .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tendina-sel .voce .nm small{display:block;color:var(--mut);font-size:11px;font-weight:500}
.tendina-sel .voce .ct{font-size:10px;font-weight:700;background:var(--err-bg);color:var(--err-ink);border-radius:999px;padding:1px 7px}
[hidden]{display:none!important}
@media(max-width:900px){.tendina-sel{left:16px!important;right:16px;width:auto}}

/* Il modello BIM incorporato: il viewer di Graphisoft dentro la scheda, in sola lettura. */
.frame-bim{margin:14px 18px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel-2)}
.frame-bim iframe{display:block;width:100%;height:480px;border:0}
@media(max-width:760px){.frame-bim iframe{height:320px}}
.nav a i{font-style:normal;font-size:14px;width:18px;text-align:center;flex-shrink:0;opacity:.9}
.tab-filters .scarica{margin-left:auto}
.thumb{width:52px;height:40px;border-radius:6px;object-fit:cover;border:1px solid var(--line);display:block}
.senza-foto{display:grid;place-items:center;width:52px;height:40px;border:1px dashed var(--line);border-radius:6px;opacity:.35;font-size:15px}
/* numeri del patrimonio: quanti ne servono, cliccabili verso la pagina che li elenca */
.kpis{grid-template-columns:repeat(auto-fit,minmax(125px,1fr))}
a.kpi{color:inherit;text-decoration:none}a.kpi:hover{border-color:var(--acc)}a.kpi.acc{color:#fff}
.nav a{display:flex;align-items:center;gap:8px}.nav a .c{margin-left:auto;font-size:11px;font-weight:700;background:rgba(255,255,255,.1);padding:1px 8px;border-radius:9px;color:#fff}
.in-riga{display:inline-flex;gap:6px;align-items:center;margin-left:8px}.in-riga select{font:inherit;font-size:12px;padding:3px 6px}
/* manutenzione programmata: una scheda per attivita', le scadute in cima */
.schede{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin:10px 0 16px}
.scheda{border:1px solid var(--line);border-left:4px solid var(--line);border-radius:var(--radius-s);padding:12px 14px;background:var(--panel);display:flex;flex-direction:column;gap:6px}
.scheda header{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.scheda.scaduta{border-left-color:var(--err-ink,#b91c1c)}.scheda.da_acquisire,.scheda.da-attivare{border-left-color:var(--warn-ink,#b45309)}
.scheda.in_scadenza{border-left-color:var(--info-ink,#1d4ed8)}.scheda.in_regola{border-left-color:var(--ok-ink,#15803d)}
.scheda .meta,.scheda .fonte{margin:0;font-size:12px;color:var(--mut)}
.scheda .date{display:flex;gap:18px;margin:0}.scheda .date dt{font-size:11px;color:var(--mut)}.scheda .date dd{margin:0;font-weight:700}
.azioni-scheda{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}.azioni-scheda label{font-size:11px;color:var(--mut);display:grid;gap:3px}
/* energia del patrimonio (mockup v0.9) */
.comandi{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;padding:12px 18px}
.comandi label{display:grid;gap:3px;font-size:11.5px;color:var(--mut);font-weight:600}
.comandi select{font:inherit;font-size:13px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink)}
.interruttore{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-left:auto}
.interruttore button{font:inherit;font-size:12px;border:0;background:var(--panel);color:var(--ink);padding:5px 10px;cursor:pointer;text-transform:none;letter-spacing:0}
.interruttore button.on{background:var(--acc);color:#fff}
.grafico{padding:10px 18px 16px}.grafico svg{width:100%;height:auto;display:block;color:var(--ink)}
.legenda-v{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--mut);padding:0 18px 12px}
.legenda-v i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.due{display:grid;grid-template-columns:1fr 1fr;gap:18px}@media(max-width:1000px){.due{grid-template-columns:1fr}}
table.calore{border-collapse:collapse;width:100%;font-size:12px}
table.calore th,table.calore td{padding:5px 7px;border-bottom:1px solid var(--line-2);white-space:nowrap}
table.calore th{position:sticky;top:0;background:var(--panel-2);cursor:pointer;text-align:right;font-size:11px;color:var(--mut);z-index:1}
table.calore th:first-child,table.calore td:first-child{text-align:left;white-space:normal;min-width:190px}
table.calore td.v{text-align:right;font-variant-numeric:tabular-nums}
table.calore tr.tot td{font-weight:800;border-top:2px solid var(--line)}
table.calore tr.riga{cursor:pointer}table.calore tr.riga:hover td{outline:1px solid var(--acc)}
table.calore tr.dettaglio td{background:var(--panel-2);white-space:normal}
.multipli{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.multiplo{border:1px solid var(--line-2);border-radius:8px;padding:8px}.multiplo .nm{font-size:12px;font-weight:700;min-height:30px}
.annate-mini{display:inline-flex;gap:4px;margin-left:8px}.annate-mini .anno{font-size:11px;padding:2px 8px;border:1px solid var(--line);border-radius:6px;text-decoration:none;color:var(--mut)}
.annate-mini .anno.on{background:var(--acc);color:#fff;border-color:var(--acc)}
.panel>h2 .interruttore{margin-left:6px}.grafico-edificio{max-width:980px}
/* nZEB */
.campi{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-end;padding:14px 18px}.campi .etich{display:grid;gap:3px;font-size:11.5px;color:var(--mut);font-weight:600}
.campi input,.campi select{font:inherit;font-size:13px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink)}
.campi small{display:block}
.tre-colonne{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:16px}@media(max-width:1100px){.tre-colonne{grid-template-columns:1fr}}
.requisiti{list-style:none;margin:0;padding:6px 18px 14px}.requisiti li{display:grid;grid-template-columns:22px 1fr;gap:6px;padding:7px 0;border-bottom:1px solid var(--line-2);font-size:13px}
.requisiti small,.passi small{display:block;color:var(--mut);font-size:11.5px}
.r-ok{color:#15803d;font-weight:800}.r-no{color:#b91c1c;font-weight:800}.r-forse{color:#b45309;font-weight:800}
.cifra{font-size:28px;font-weight:800;padding:8px 18px}.cifra small{font-size:13px;color:var(--mut);font-weight:600}
pre.formula{font:12.5px/1.5 ui-monospace,Consolas,monospace;background:var(--panel-2);padding:10px 12px;border-radius:7px;white-space:pre-wrap;margin:0 18px 10px}
ol.passi{margin:0;padding:8px 18px 14px 38px}ol.passi li{padding:6px 0;font-size:13px;border-bottom:1px solid var(--line-2)}
/* Opportunità · fotovoltaico: la convenienza come nel mini-sito */
.salti{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.salti a{font-size:12.5px;font-weight:700;padding:5px 11px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--ink);background:var(--panel)}
.tetto-mappa{position:relative;margin:12px 18px 6px}#tetto-carta{height:420px;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
.tetto-strumenti{position:absolute;top:12px;left:12px;z-index:5;display:flex;gap:6px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.tetto-str{width:40px;height:40px;border:1.5px solid transparent;border-radius:9px;background:#fff;color:#12324f;cursor:pointer;display:grid;place-items:center}
.tetto-str svg{width:20px;height:20px}.tetto-str.on{background:#1FBF6B;color:#fff;border-color:#1AA85D}
#tetto-aiuto{padding:0 18px}
.quattro{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;padding:8px 18px 12px}
.quattro .q{border:1px solid var(--line-2);border-radius:10px;padding:12px 14px;display:grid;gap:4px}
.quattro .q span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}
.quattro .q b{font-size:24px}.quattro .q.costo b{font-size:20px}.quattro .q small{font-size:11.5px;color:var(--mut)}
.barra-benef{display:flex;height:9px;border-radius:5px;overflow:hidden;background:var(--line-2)}
.barra-benef .b1{background:#16a34a}.barra-benef .b2{background:#2563eb}.barra-benef .b3{background:#ea580c}.barra-benef .b4{background:#7c3aed}
.energia-fv{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;padding:0 18px 10px}
.energia-fv div{background:var(--panel-2);border-radius:9px;padding:9px 12px}.energia-fv b{display:block;font-size:16px}.energia-fv span{font-size:11.5px;color:var(--mut)}
.flusso-fv{padding:4px 18px 10px;display:grid;gap:8px}.flusso-fv div{display:grid;grid-template-columns:170px 1fr;gap:10px;align-items:center;font-size:12.5px}
.flusso-fv p{margin:0;display:flex;height:22px;border-radius:5px;overflow:hidden;background:var(--line-2)}
.flusso-fv .auto{background:#16a34a}.flusso-fv .imm{background:#f59e0b}.flusso-fv .rete{background:#64748b}
table.bilancio tr.cer td{background:#ecfdf5}
/* opportunità a schede */
.schede-nav{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:0 0 16px}
.schede-nav a{font-weight:700;font-size:13.5px;padding:10px 16px;text-decoration:none;color:var(--mut);border-bottom:3px solid transparent;display:flex;gap:6px;align-items:center}
.schede-nav a.on{color:var(--ink);border-bottom-color:var(--acc)}.schede-nav .c{font-size:11px;background:var(--line-2);border-radius:9px;padding:0 7px}
iframe.minisito{display:block;width:100%;min-height:900px;border:0;border-top:1px solid var(--line-2)}
.barra-tieni{display:flex;justify-content:flex-end;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid var(--line-2);position:sticky;bottom:0;background:var(--panel)}
iframe.minisito.figura{min-height:420px}
/* la segnalazione in una schermata: prima, dopo, l'impresa, chi valida */
.fase-lavoro{padding:10px 18px 12px;border-top:1px solid var(--line-2)}.fase-lavoro h3{margin:0 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}
.galleria{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.galleria a{display:grid;gap:4px;text-decoration:none;color:var(--mut)}.galleria img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
blockquote.commento{margin:0 0 8px;padding:10px 14px;border-left:4px solid var(--acc);background:var(--panel-2);border-radius:0 8px 8px 0;white-space:pre-wrap}
blockquote.commento small{display:block;margin-top:6px;color:var(--mut)}
.documenti-lavoro{list-style:none;margin:0;padding:0;display:grid;gap:6px}.documenti-lavoro li{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.tag.grande{font-size:13px;padding:5px 12px}
#lavoro .fase-lavoro{display:grid;grid-template-columns:170px 1fr;gap:14px;align-items:start}#lavoro .fase-lavoro h3{margin-top:4px}
@media(max-width:700px){#lavoro .fase-lavoro{grid-template-columns:1fr}}
/* schermi larghi: il contenuto sta al centro dello spazio accanto al menu, e la barra in alto
   si allinea con lui (prima tutto restava attaccato a sinistra, con metà schermo vuota) */
@media(min-width:901px){.topbar{padding-left:max(28px,calc((100% - 1600px) / 2 + 28px));padding-right:max(28px,calc((100% - 1600px) / 2 + 28px))}}
/* telefono: i pulsanti della barra in alto vanno a capo invece di allargare la pagina */
@media(max-width:700px){.topbar-right{flex-wrap:wrap;justify-content:flex-start;flex-shrink:1}.topbar-right .btn{white-space:normal}.topbar>div:first-child{min-width:0}}
/* niente allarga la pagina: i moduli in riga vanno a capo, le tendine restano nella colonna */
.in-riga{flex-wrap:wrap;max-width:100%}.in-riga select,.in-riga input{max-width:100%;min-width:0}
.due-colonne>*{min-width:0}table.righe td{overflow-wrap:anywhere}
table.righe td select,table.righe td input{max-width:100%;min-width:0;box-sizing:border-box}
/* la griglia dei dati: che cosa c'e' mese per mese, e da dove viene */
table.griglia-dati td.cella,table.griglia-dati th.mese{text-align:center;width:34px;padding:4px 2px;font-size:11px;font-weight:800}
/* colori delle fonti (Dario, 21/09): bolletta verde deciso, a mano giallino verso il verde, solo totale annuo arancione */
.c-bolletta{background:#86efac;color:#14532d}.c-riepilogo{background:#bfdbfe;color:#1e3a8a}.c-mano{background:#ecfccb;color:#3f6212}
.c-altro{background:#e9d5ff;color:#581c87}.c-annuo{background:#fdba74;color:#7c2d12}.c-manca{background:#fecaca;color:#991b1b}
.c-fuori{background:var(--line-2);color:var(--mut)}
.legenda-dati i{border:1px solid rgba(0,0,0,.08)}
/* Energia · confronti e indicatori: due viste nella stessa scheda; le tendine con i nomi lunghi
   degli edifici non devono allargare la pagina sul telefono */
.sotto-schede{margin:0 0 14px;flex-wrap:wrap}.sotto-schede button{padding:7px 14px;font-size:13px;font-weight:600}
.comandi label{min-width:0;max-width:100%}.comandi select{max-width:100%}
#i-tabella td .mono{white-space:nowrap}

/* Griglia dei dati: la colonna «Totale anno» (Dario, 21/09); in rosso la somma dei mesi che non torna col totale dichiarato */
.griglia-dati td.totale-anno { white-space: nowrap; }
.avviso-testo { color: var(--err, #b42318); }
/* la riga dei filtri sotto le intestazioni: una casella per colonna (Dario, 21/09) */
.tab tr.riga-filtri th{position:static;padding:4px 6px 8px;text-transform:none;letter-spacing:0;background:var(--panel)}.tab tr.riga-filtri input{width:100%;min-width:60px;font:inherit;font-size:11.5px;padding:4px 6px;border:1px solid var(--line);border-radius:5px;background:var(--panel-2);color:var(--ink)}.tab tr.riga-filtri input:focus{background:var(--panel);outline:2px solid var(--acc);outline-offset:-1px}.tab tr.riga-filtri input:not(:placeholder-shown){background:var(--panel);border-color:var(--acc)}
/* Conto Termico nell'edificio: quanto vale + documenti, campi allineati (Dario, 21/09) */
.ct-griglia{display:grid;grid-template-columns:1.6fr 1fr;gap:16px;align-items:start}@media(max-width:1000px){.ct-griglia{grid-template-columns:1fr}}
.ct-leve{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;padding:14px 18px 4px}.ct-leve form{margin:0}.ct-leve label{display:grid;gap:4px;font-size:11.5px;color:var(--mut);font-weight:600}
.ct-leve select,.ct-leve input{font:inherit;font-size:13px;height:34px;padding:0 8px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink);box-sizing:border-box}.ct-leve input{width:170px}.ct-riga{display:flex;gap:6px;align-items:center}.ct-riga .btn{height:34px}
.ct-fonti{padding:0 18px 14px;margin:0}ul.ct-doc{margin:0;padding:8px 18px 14px 36px}ul.ct-doc li{padding:5px 0;font-size:13px;border-bottom:1px solid var(--line-2)}
.nav a.sotto-voce{padding:6px 13px 6px 34px;font-size:12.5px;font-weight:500}

/* Conto Termico: il conto passo per passo (Dario, 21/09) */
.ct-kpi{margin:12px 0}
.conto-ct tr.risultato td{font-weight:800;background:var(--acc-soft, #dcfce7)}
.conto-ct td:first-child{white-space:nowrap}
/* «da acquisire» sempre in giallino, ovunque compaia (Dario, 21/09) */
.tag.da-acquisire{background:#fef9c3;color:#854d0e}

/* Il fascicolo: un colore diverso per ogni cartella (chiave fissa) e per ogni tag (Dario, 21/09).
   Le cartelle sono un elenco chiuso (CARTELLE in models.py): una classe per chiave, colore fisso.
   I tag sono testo libero: il colore si ricava dal testo (filtro `colore_tag`), classi .c0..c9. */
.cartella-atti{background:#fee2e2;color:#991b1b}
.cartella-catasto{background:#ffedd5;color:#9a3412}
.cartella-progetto{background:#fef3c7;color:#92400e}
.cartella-certificazioni{background:#ecfccb;color:#3f6212}
.cartella-manuali{background:#dcfce7;color:#166534}
.cartella-bollette{background:#ccfbf1;color:#115e59}
.cartella-segnalazioni{background:#cffafe;color:#155e75}
.cartella-manutenzione{background:#dbeafe;color:#1e40af}
.cartella-amministrazione{background:#e0e7ff;color:#3730a3}
.cartella-energia{background:#ede9fe;color:#5b21b6}
.cartella-bim{background:#fce7f3;color:#9d174d}
.cartella-foto{background:#fae8ff;color:#86198f}
.tag.c0{background:#fee2e2;color:#991b1b}
.tag.c1{background:#ffedd5;color:#9a3412}
.tag.c2{background:#fef3c7;color:#92400e}
.tag.c3{background:#ecfccb;color:#3f6212}
.tag.c4{background:#dcfce7;color:#166534}
.tag.c5{background:#ccfbf1;color:#115e59}
.tag.c6{background:#cffafe;color:#155e75}
.tag.c7{background:#dbeafe;color:#1e40af}
.tag.c8{background:#ede9fe;color:#5b21b6}
.tag.c9{background:#fce7f3;color:#9d174d}
@media(prefers-color-scheme:dark){
 .cartella-atti{background:#3a1a1a;color:#f5a3a3}
 .cartella-catasto{background:#3a2410;color:#fdba74}
 .cartella-progetto{background:#3a2d12;color:#fbbf24}
 .cartella-certificazioni{background:#2a3a10;color:#bef264}
 .cartella-manuali{background:#12321f;color:#8fe0ad}
 .cartella-bollette{background:#0f3a34;color:#5eead4}
 .cartella-segnalazioni{background:#0e3540;color:#67e8f9}
 .cartella-manutenzione{background:#15263f;color:#9cc2ff}
 .cartella-amministrazione{background:#201f3f;color:#a5b4fc}
 .cartella-energia{background:#2a1f3f;color:#c4b5fd}
 .cartella-bim{background:#3a1f2c;color:#f9a8d4}
 .cartella-foto{background:#331a38;color:#e9a8f0}
 .tag.c0{background:#3a1a1a;color:#f5a3a3}
 .tag.c1{background:#3a2410;color:#fdba74}
 .tag.c2{background:#3a2d12;color:#fbbf24}
 .tag.c3{background:#2a3a10;color:#bef264}
 .tag.c4{background:#12321f;color:#8fe0ad}
 .tag.c5{background:#0f3a34;color:#5eead4}
 .tag.c6{background:#0e3540;color:#67e8f9}
 .tag.c7{background:#15263f;color:#9cc2ff}
 .tag.c8{background:#2a1f3f;color:#c4b5fd}
 .tag.c9{background:#3a1f2c;color:#f9a8d4}
}

/* La pratica a passi (progetto segnalazioni del 21/09, mockup v13 vista A) */
.barra-tocca{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;background:var(--panel);border:2px solid var(--acc);border-radius:12px;padding:10px 14px;margin-bottom:14px}
.barra-tocca .chi-tocca{flex:1;min-width:220px}.barra-tocca .chi-tocca>small:first-child{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);font-weight:700}
.barra-tocca .nota-cantiere{margin:4px 0 0;font-size:12.5px;color:var(--mut)}
/* con un modulo d'azione aperto la barra puo' diventare alta quasi quanto lo schermo: restando
   incollata in cima terrebbe il pulsante di invio fuori portata. Si stacca finche' resta aperto
   (rilievo importante, 21/09) */
.barra-tocca:has(details[open]){position:static}
.azioni-barra{display:flex;gap:8px;flex-wrap:wrap;max-width:100%}
.pratica-griglia{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;align-items:start}
/* colonna stretta: etichetta sopra il valore, così niente resta tagliato sul bordo */
.pratica-lato .tab.righe,.pratica-lato .tab.righe tbody,.pratica-lato .tab.righe tr,.pratica-lato .tab.righe th,.pratica-lato .tab.righe td{display:block;width:auto}
.pratica-lato .tab.righe tr{padding:8px 0;border-bottom:1px solid var(--line-2)}.pratica-lato .tab.righe th,.pratica-lato .tab.righe td{border:0;padding:0}
.pratica-lato .tab.righe th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}
.pratica .aggiungi .sotto-titolo{margin:12px 0 2px;font-size:14px}
.passo .pal{border:2px solid var(--line)}
@media(max-width:900px){.pratica-griglia{grid-template-columns:minmax(0,1fr)}}
.passo{display:grid;grid-template-columns:40px minmax(0,1fr)}
.passo .lato{display:flex;flex-direction:column;align-items:center}
.passo .pal{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;background:var(--line-2);color:var(--mut)}
.passo .filo{flex:1;width:3px;background:var(--line-2);margin:2px 0}
.passo.fatto .pal{background:var(--acc);color:#fff}.passo.fatto .filo{background:var(--acc)}
.passo.ora .pal{background:var(--panel);border:3px solid var(--acc);color:var(--acc)}
/* passo mai avvenuto (pratica archiviata o chiusa prima di arrivarci): un trattino neutro, non una spunta */
.passo.saltato .pal{background:var(--panel);border:1px dashed var(--line);color:var(--mut)}
.passo.saltato .filo{background:var(--line-2)}
.scheda-passo{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:12px 14px;margin-bottom:12px;min-width:0}
.passo.ora .scheda-passo{border:2px solid var(--acc)}.passo.poi .scheda-passo,.passo.saltato .scheda-passo{opacity:.7}
.passo.saltato .quando{font-style:italic}
.scheda-passo .testa{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.scheda-passo .quando{font-size:12px;color:var(--mut)}
.scheda-passo .msg{background:var(--bg,#f8fafc);border:1px solid var(--line);border-radius:10px;padding:7px 10px;margin-top:8px;font-size:13px}
.scheda-passo .all{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.scheda-passo .foto{display:inline-flex;flex-direction:column;width:112px}.scheda-passo .foto img{width:112px;height:84px;object-fit:cover;border-radius:8px}
.scheda-passo .pdf{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:12.5px}
.scheda-passo .pdf i{font-style:normal;width:26px;height:32px;border-radius:4px;background:#dc2626;color:#fff;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center}
.scheda-passo .pdf small{display:block;color:var(--mut);font-size:11px}

/* La tavola con le puntine (progetto segnalazioni §10): la posizione e' in percentuale della pianta */
.tavola{position:relative;display:inline-block;max-width:100%;line-height:0}
.tavola img{max-width:100%;height:auto;border-radius:8px;border:1px solid var(--line)}
.puntina{position:absolute;width:22px;height:22px;margin:-22px 0 0 -11px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#dc2626;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.tavola.piccola{max-width:360px}
.dove-sei .tavola{margin-top:8px;cursor:crosshair}
/* «Aggiungi alla pratica»: righe di aiuto vicine a ciò che spiegano */
.pratica .aggiungi>p{padding:2px 18px;margin:0 0 8px}.pratica .aggiungi>.form{padding-top:4px;padding-bottom:4px}
.pratica .aggiungi>.upload{padding-top:4px;padding-bottom:10px}

/* A chi tocca e i pulsanti, dentro il passo di adesso (Dario, 21/09: non una barra che sembra il passo 1) */
.tocca-qui{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.tocca-qui .chi-tocca{margin:0 0 6px;font-size:13.5px}
.tocca-qui .nota-cantiere{margin:0 0 8px;font-size:12.5px;color:var(--mut)}
.azioni-passo{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start}
.azioni-passo details[open]{flex-basis:100%}

/* la finestrella per registrare un'impresa nuova */
dialog.finestrella{border:1px solid var(--line);border-radius:14px;padding:18px 20px;max-width:min(440px,calc(100vw - 32px))}
dialog.finestrella::backdrop{background:rgba(15,23,42,.35)}dialog.finestrella h3{margin:0 0 4px}

/* --- «Prova come…»: la fascia fissa in alto, visibile anche sul telefono --- */
.prova-fascia{position:sticky;top:0;z-index:1000;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 8px;
 padding:calc(8px + env(safe-area-inset-top, 0px)) 16px 8px;background:#f59e0b;color:#1f1300;font-size:14px;line-height:1.3;text-align:center;
 box-shadow:0 2px 6px rgba(0,0,0,.25)}
.prova-fascia form{display:inline}
.prova-torna{background:none;border:0;padding:0;font:inherit;font-weight:800;color:#1f1300;text-decoration:underline;cursor:pointer}
body.in-prova .sidebar{top:var(--fascia-prova, 38px);height:calc(100vh - var(--fascia-prova, 38px))}
@media(max-width:900px){body.in-prova .sidebar{top:auto;height:auto}}

.link-cantiere input{width:100%;max-width:100%;font-family:monospace;font-size:.85rem}
.scelte-imprese label{display:inline-flex;gap:.3rem;margin:.2rem .8rem .2rem 0}

/* Acquisizioni (nuovo patrimonio, tappa A): viste, gruppi, visore del foglio. Prefisso acq- per non toccare .gruppo e .due */
.acq-viste{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 14px}
.acq-viste a{padding:8px 14px;border-radius:9px;text-decoration:none;color:var(--mut);font-weight:700;font-size:13px;border:1px solid var(--line)}
.acq-viste a.on{background:var(--acc);color:#fff;border-color:var(--acc)}
.acq-viste .n{display:inline-block;background:var(--err-bg);color:var(--err-ink);border-radius:10px;padding:0 7px;margin-left:4px;font-size:11px}
.acq-gruppo{border-top:1px solid var(--line-2)}.acq-gruppo>summary{cursor:pointer;padding:12px 18px;font-weight:700;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.acq-gruppo>summary .az{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.acq-due{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px;align-items:start;padding:14px 18px}
.acq-due>*{min-width:0}
@media(max-width:1000px){.acq-due{grid-template-columns:1fr}}
.acq-visore{background:#475569;border-radius:12px;padding:12px;max-height:70vh;overflow:auto}
.acq-barra{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.acq-barra a{color:#e2e8f0;font-size:12px;text-decoration:none;padding:3px 8px;border-radius:6px}.acq-barra a.on{background:#1e293b}
.acq-foglio{background:#fff;border-radius:4px;overflow:auto}
.acq-foglio table{border-collapse:collapse;font-size:11.5px;color:#334155}
.acq-foglio td,.acq-foglio th{padding:3px 6px;border:1px solid #e5e7eb;white-space:nowrap}
.acq-foglio th{background:#f1f5f9;color:#64748b;font-weight:600}
.evid{outline:3px solid #f59e0b;background:#fef3c7}
.acq-dove{font-size:12px}.acq-perche{font-size:12px;color:var(--warn-ink)}
.acq-voto{display:inline-flex;width:20px;height:20px;border-radius:50%;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff}
.acq-voto.v1{background:#15803d}.acq-voto.v2{background:#0284c7}.acq-voto.v3{background:#94a3b8}
.acq-decidi{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.acq-decidi input[name=valore]{width:7em}.acq-decidi input[name=anno]{width:5em}
.acq-filtri{display:flex;gap:6px;flex-wrap:wrap;padding:10px 18px;align-items:center}
.acq-filtri a{font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.acq-filtri a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.acq-riga-sel{background:#fffbeb}
/* la proposta di censire un contatore letto nel documento: il pulsante principale della riga */
.acq-censisci{display:flex;flex-direction:column;gap:4px;margin-bottom:6px;padding:8px;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--info-bg,#dbeafe);font-size:12px;max-width:100%}
.acq-censisci select{font:inherit;font-size:12px;max-width:100%}
/* l'edificio che la bolletta nomina e il patrimonio non ha ancora: il nome si corregge prima di crearlo */
.acq-edificio-nuovo{display:flex;flex-direction:column;gap:4px}
.acq-edificio-nuovo input[type=text],.acq-edificio-nuovo input:not([type]){font:inherit;font-size:12px;max-width:100%}

ul.acq-fonti{margin:6px 0 0;padding:0;list-style:none}ul.acq-fonti li{margin:2px 0}
.acq-spesa{margin-left:3px;font-size:10px;text-decoration:none}
/* Impostazioni del patrimonio: chi decide i conflitti (tre scelte) e la scala dei voti */
.acq-scelte{border:0;margin:0;padding:0;display:grid;gap:8px;min-width:0}.acq-scelte legend{font-size:12px;color:var(--mut);font-weight:600;margin-bottom:4px}
.form label.acq-scelta{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-s);color:var(--ink);font-weight:400;font-size:13px}
.form label.acq-scelta input{width:auto;margin-top:3px;flex:none}.acq-scelta strong{display:block}.acq-scelta small{display:block;color:var(--mut);font-size:12px}
.acq-voti select{font:inherit;font-size:13px;padding:4px 6px;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--panel)}
.acq-voti td.acq-cambiato{background:#fffbeb}
ul.acq-cambiati{margin:12px 18px;padding:0;list-style:none;font-size:13px}ul.acq-cambiati li{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:4px 0}
.panel>form.acq-form-voti{padding:0}.acq-form-voti>p{padding:10px 18px;margin:0}
.acq-azioni-voti{display:flex;gap:8px;flex-wrap:wrap;padding:0 18px 16px}
@media (max-width:600px){.acq-voti th,.acq-voti td{padding:8px 6px}}
/* Acquisizioni, tappa B: la pagina del PDF come immagine, con il riquadro del dato sopra; i file in lettura */
.acq-pdf{background:#475569;border-radius:12px;padding:12px;max-height:75vh;overflow:auto}
.acq-pagina{position:relative;display:block;line-height:0;background:#fff;border-radius:4px;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.acq-pagina img{display:block;width:100%;height:auto;border-radius:4px}
.acq-riquadro{position:absolute;outline:3px solid #f59e0b;background:rgba(254,243,199,.35);border-radius:2px;pointer-events:none}
.acq-riquadro.ocr,.acq-riquadro.incerto{outline-style:dashed}
.acq-pdf-nota{color:#e2e8f0;font-size:12px;margin:8px 0 0}
.acq-in-lettura{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.acq-tutte{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 18px;border-top:1px solid var(--line-2)}
.acq-rileggi{margin-top:6px}.acq-rileggi>summary{cursor:pointer;font-size:12px;color:var(--info-ink)}
.acq-rileggi textarea{width:100%;min-width:0}
/* Collaudo 22/09, rilievo 2: sul telefono la barra del titolo non resta appiccicata in alto. Con titolo,
   sottotitolo e pulsanti va a capo e occupa ~120 px: tenuta ferma copriva un settimo dello schermo e, nelle
   catture a pagina intera, ricompariva a meta' del modulo come un'intestazione doppia. */
@media(max-width:700px){.topbar{position:static}}
/* «Dove sei?» nel modulo: il riquadro come gli altri campi, non il bordo grigio di serie del browser */
fieldset.dove-sei{border:0;margin:0;padding:0;min-width:0}
fieldset.dove-sei legend{padding:0;margin-bottom:5px;font-size:12px;font-weight:600;color:var(--mut)}
/* «Tocca a me»: il numero accanto alla scheda */
.tabs .conta{display:inline-block;min-width:20px;padding:0 6px;margin-left:4px;border-radius:10px;background:var(--acc);color:#fff;font-size:11.5px;line-height:18px;text-align:center}
.errore-modulo{margin:0;padding:10px 12px;border-radius:var(--radius-s);background:#fef2f2;border:1px solid #fecaca;color:#991b1b;font-size:13px;font-weight:600}
/* conferma dopo un salvataggio (collaudo del 22/09) */
.conferma{margin:0 0 16px;padding:10px 14px;border-radius:var(--radius-s);background:var(--acc-soft);color:var(--acc-ink);border:1px solid var(--line);font-size:13.5px;font-weight:600}
.comandi-cantiere{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start;margin:6px 0 14px}.comandi-cantiere details[open]{flex-basis:100%}
/* «Adesso tocca a…»: una riga ferma in cima alla pratica, con il rimando al passo (collaudo del 22/09) */
.adesso{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin:0 0 14px;padding:10px 14px;border-radius:var(--radius-s);border:1px solid var(--line);background:var(--panel);font-size:14px}
.adesso small{color:var(--mut)}.adesso a{margin-left:auto;font-size:13px;font-weight:600}
.adesso.a-te{border-color:var(--acc);background:var(--acc-soft);color:var(--acc-ink)}
/* un pulsante principale, gli altri raccolti */
.altre-azioni{margin-top:4px}.altre-azioni>summary{list-style:none;display:inline-flex}.altre-azioni>summary::-webkit-details-marker{display:none}
.altre-azioni>div{padding-top:8px}
.azioni-passo{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.azioni-passo>details{width:100%}
/* i messaggi interni si riconoscono al primo colpo */
.scheda-passo .msg.interno{background:#fff7ed;border-color:#fed7aa}
.tag.interno{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa}
/* passi gia' conclusi: i dettagli si aprono a richiesta */
.dettagli-passo{margin-top:8px}.dettagli-passo>summary{cursor:pointer;font-size:12.5px;color:var(--mut);font-weight:600}
/* riepilogo della spesa prima di decidere */
.riepilogo-spesa{margin:0}.riepilogo-spesa th{width:40%}
.legenda-ruoli td small{display:block}
@media(prefers-color-scheme:dark){.scheda-passo .msg.interno,.tag.interno{background:#431407;border-color:#7c2d12;color:#fed7aa}
.errore-modulo{background:#450a0a;border-color:#7f1d1d;color:#fecaca}}