/* Casa, Italia — pagina "Esporta i dati" e bottone Esporta sulla mappa. Stessa carta, stesso inchiostro del sito. */
:root{
  --carta:#F6F4EF; --acqua:#EBEDEE; --inchiostro:#1C2630; --grigio:#7C8792; --grigio-testo:#5E6974;
  --linea:#D9DCDD; --linea-forte:#B7BDC2; --mattone:#6E332B; --ocra:#D3AE6E; --sabbia:#ECE6D8;
  --mono:'Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --sans:'Archivo',system-ui,-apple-system,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.em-pagina{font:15px/1.5 var(--sans);color:var(--inchiostro);background:var(--carta);-webkit-font-smoothing:antialiased;min-height:100vh}
:where(.em-pagina) :where(button,input){font:inherit;color:inherit}
.em-pagina [hidden]{display:none !important}
.em-pagina a{color:inherit}
.em-pagina button:focus-visible,.em-pagina input:focus-visible,.em-pagina a:focus-visible{outline:2px solid var(--inchiostro);outline-offset:2px}

/* ---------- testata ---------- */
.em-testata{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;border-bottom:1px solid var(--linea);background:var(--carta);position:sticky;top:0;z-index:20}
.em-marchio{display:flex;align-items:center;gap:9px;text-decoration:none;font-weight:700;font-stretch:110%;font-size:17px;letter-spacing:-.01em}
.em-marchio i{display:block;width:22px;height:22px;background:var(--mattone) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M6 17 16 8l10 9v9H6z' fill='%23F6F4EF'/%3E%3C/svg%3E") center/100% no-repeat}
.em-torna{font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:10px 0;border-bottom:1px solid var(--linea-forte)}
.em-torna:hover{border-bottom-color:var(--inchiostro)}

/* ---------- impaginato ---------- */
#esporta-app{max-width:1440px;margin:0 auto;padding:22px 24px 120px;display:grid;gap:18px 28px;
  grid-template-columns:minmax(0,1fr) 440px;grid-template-areas:"intro intro" "mappa terr" "mappa opz" "mappa ant";
  grid-template-rows:auto auto auto 1fr}
.em-intro{grid-area:intro}
.em-terr{grid-area:terr}.em-opz{grid-area:opz}.em-ant{grid-area:ant}
#em-mappa{grid-area:mappa;position:sticky;top:76px;align-self:start;height:calc(100vh - 100px);min-height:460px}
.em-occhiello{font:500 10px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--grigio)}
.em-intro h1{font-size:34px;line-height:1.05;font-weight:700;font-stretch:112%;letter-spacing:-.02em;margin:6px 0 8px}
.em-intro p{max-width:62ch;color:var(--grigio-testo)}
#em-carica{grid-column:1/-1;font:12px var(--mono);color:var(--grigio);padding:40px 0}
#esporta-app:not(.pronta) > section,#esporta-app:not(.pronta) > #em-mappa{visibility:hidden}

/* ---------- sezioni del pannello ---------- */
.em-sez{background:#fff;border:1px solid var(--linea-forte);padding:16px 18px 18px}
.em-sez + .em-sez{margin-top:-1px}
.em-sez h2{display:flex;align-items:baseline;gap:9px;font:500 11px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--grigio);margin-bottom:11px}
.em-sez h2 b{font-weight:600;color:var(--inchiostro)}
.em-campo + .em-campo{margin-top:14px}
.em-etit{font:500 10px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grigio);margin-bottom:7px;display:flex;justify-content:space-between;align-items:baseline}
.em-etit button{font:inherit;background:none;border:0;border-bottom:1px solid var(--linea-forte);cursor:pointer;letter-spacing:.06em;text-transform:none;color:var(--inchiostro)}
.em-nota{font-size:12px;line-height:1.45;color:var(--grigio-testo);margin-top:9px}

/* ricerca */
.em-cerca{position:relative}
.em-cerca input{width:100%;height:46px;border:1px solid var(--inchiostro);background:#fff;padding:0 14px 0 40px;font-size:16px;border-radius:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='8.5' cy='8.5' r='5.5' fill='none' stroke='%231C2630' stroke-width='1.6'/%3E%3Cpath d='m13 13 4.5 4.5' stroke='%231C2630' stroke-width='1.6'/%3E%3C/svg%3E") 12px 50%/18px no-repeat #fff}
.em-cerca input::placeholder{color:var(--grigio)}
#em-risultati{position:absolute;left:0;right:0;top:100%;z-index:30;list-style:none;background:#fff;border:1px solid var(--inchiostro);border-top:0;max-height:min(360px,55vh);overflow:auto;box-shadow:0 12px 28px rgba(28,38,48,.16)}
#em-risultati li{padding:9px 14px;cursor:pointer;display:grid;grid-template-columns:1fr auto;column-gap:10px;border-top:1px solid var(--linea)}
#em-risultati li:first-child{border-top:0}
#em-risultati li b{font-weight:600}
#em-risultati li span{grid-column:1;font:11px/1.4 var(--mono);color:var(--grigio)}
#em-risultati li em{grid-row:1/3;grid-column:2;align-self:center;font:normal 10px var(--mono);letter-spacing:.06em;color:var(--mattone)}
#em-risultati li.att,#em-risultati li:hover{background:var(--sabbia)}
#em-risultati li.nessuno{cursor:default;color:var(--grigio);font-size:13px}

/* etichette della selezione */
.em-scelti{display:flex;justify-content:space-between;align-items:center;margin:14px 0 8px}
.em-scelti .em-etit{margin:0}
.em-bottoni{display:flex;gap:6px}
.em-bt{font:500 10.5px/1 var(--mono);letter-spacing:.06em;padding:7px 10px;background:#fff;border:1px solid var(--linea-forte);cursor:pointer}
.em-bt:hover{border-color:var(--inchiostro)}
#em-etichette{display:flex;flex-wrap:wrap;gap:6px}
.em-eti{display:inline-flex;align-items:center;gap:6px;background:var(--mattone);color:#fff;font-size:13px;line-height:1.2;padding:5px 4px 5px 10px}
.em-eti i{font:normal 10px var(--mono);opacity:.75}
.em-eti button{background:none;border:0;color:#fff;cursor:pointer;width:22px;height:22px;font-size:12px;opacity:.85}
.em-eti button:hover{opacity:1;background:rgba(255,255,255,.14)}
.em-eti.em-altri{background:var(--sabbia);color:var(--inchiostro);padding-right:10px}
.em-vuoto{font-size:13px;color:var(--grigio);line-height:1.45}

/* scelte a segmenti e gettoni */
.em-seg{display:flex;flex-wrap:wrap}
.em-seg button{flex:1 1 auto;min-height:38px;font:500 11px/1 var(--mono);letter-spacing:.06em;padding:0 12px;background:#fff;border:1px solid var(--linea-forte);margin:0 -1px -1px 0;cursor:pointer;white-space:nowrap}
.em-seg button.on{background:var(--inchiostro);color:#fff;border-color:var(--inchiostro);position:relative;z-index:1}
.em-seg button:not(.on):hover{background:var(--acqua)}
.em-gettoni{display:flex;flex-wrap:wrap;gap:6px}
.em-chip{font-size:12.5px;line-height:1.2;padding:7px 10px;background:#fff;border:1px solid var(--linea-forte);cursor:pointer;text-align:left}
.em-chip.on{background:var(--inchiostro);border-color:var(--inchiostro);color:#fff}
.em-chip:not(.on):hover{border-color:var(--inchiostro)}
.em-spunte{display:flex;flex-wrap:wrap;gap:8px 18px}
.em-spunte label{display:flex;align-items:center;gap:7px;font-size:14px;cursor:pointer;min-height:30px}
.em-spunte input{width:17px;height:17px;accent-color:var(--inchiostro)}

/* anteprima e download */
.em-ant .em-sez{padding-bottom:14px}
#em-conta{font:12px var(--mono);color:var(--grigio-testo);margin-bottom:9px}
#em-anteprima{overflow-x:auto;border:1px solid var(--linea);max-width:100%}
#em-anteprima:empty{display:none}
#em-anteprima table{border-collapse:collapse;font:11px/1.35 var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
#em-anteprima th{text-align:left;font-weight:500;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--grigio);padding:7px 9px;border-bottom:1.5px solid var(--inchiostro);background:var(--carta)}
#em-anteprima td{padding:6px 9px;border-bottom:1px solid var(--linea);max-width:260px;overflow:hidden;text-overflow:ellipsis}
#em-anteprima td.n{text-align:right}
#em-anteprima .em-vuoto{padding:12px}
.em-ancora{font:11px var(--mono);color:var(--grigio);padding:7px 9px}
.em-scarica-barra{position:sticky;bottom:0;z-index:15;padding:12px 0 calc(12px + env(safe-area-inset-bottom));background:linear-gradient(rgba(246,244,239,0),var(--carta) 18%)}
#em-scarica{display:block;width:100%;min-height:52px;background:var(--mattone);color:#fff;border:0;cursor:pointer;font:500 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
#em-scarica:hover:not(:disabled){background:#5A2922}
#em-scarica:disabled{background:var(--linea-forte);cursor:default}
.em-fonte{font:10.5px/1.6 var(--mono);color:var(--grigio);margin-top:10px}
.em-fonte a{text-decoration:none;border-bottom:1px solid var(--linea-forte)}

/* ---------- mappa di selezione ---------- */
#em-mappa{display:flex;flex-direction:column;background:var(--acqua);border:1px solid var(--linea-forte)}
.em-barra-alta{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 10px;background:var(--carta);border-bottom:1px solid var(--linea)}
.em-azioni{display:flex;gap:6px;flex:none}
.em-azioni button:disabled{opacity:.4;cursor:default}
.em-tela{position:relative;flex:1;min-height:0;touch-action:none;cursor:pointer;overflow:hidden}
.em-tela.trascina{cursor:grabbing}
.em-tela svg{display:block;width:100%;height:100%}
.em-forma{stroke:#fff;stroke-width:.6px;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:fill .1s linear}
.em-forma.s0{fill:#E9E4D8}.em-forma.s1{fill:var(--ocra)}.em-forma.s2{fill:var(--mattone)}.em-forma.s-1{fill:#D7D7D2;cursor:default}
.em-forma.foc{stroke:var(--inchiostro);stroke-width:2px}
@media (hover:hover){.em-forma.s0:hover{fill:#DDD3BC}}
.em-sfondo{fill:#E1E3E2;stroke:#D2D5D4;stroke-width:.5px;vector-effect:non-scaling-stroke;pointer-events:none}
.em-contorno{fill:none;stroke:var(--inchiostro);stroke-width:1.1px;vector-effect:non-scaling-stroke;pointer-events:none}
.em-etichetta{font-family:var(--mono);font-weight:500;fill:var(--inchiostro);text-anchor:middle;dominant-baseline:middle;pointer-events:none;paint-order:stroke;stroke:rgba(246,244,239,.9);stroke-linejoin:round}
.em-etichetta.scuro{fill:#fff;stroke:rgba(90,41,34,.55)}
.em-legenda{position:absolute;left:10px;top:10px;display:flex;gap:10px;font:10px var(--mono);color:var(--grigio-testo);background:rgba(246,244,239,.92);padding:5px 8px;pointer-events:none}
.em-legenda span{display:flex;align-items:center;gap:5px}
.em-legenda i{width:11px;height:11px;display:block;border:1px solid rgba(28,38,48,.15)}
.em-zoom{position:absolute;right:10px;top:10px;display:flex;flex-direction:column}
.em-zoom button{width:34px;height:34px;background:#fff;border:1px solid var(--linea-forte);margin-top:-1px;cursor:pointer;font:14px var(--mono)}
.em-zoom button:hover{background:var(--acqua)}
.em-info{position:absolute;left:10px;right:10px;bottom:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--carta);border:1px solid var(--linea-forte);box-shadow:0 8px 22px rgba(28,38,48,.12);padding:9px 10px 9px 14px}
.em-info[hidden]{display:none}
.em-info > div{min-width:0;display:flex;flex-direction:column}
.em-info .em-tipo{font:500 9.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--grigio)}
.em-info b{font-size:16px;font-weight:700;font-stretch:105%;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.em-info .em-stato{font:11px var(--mono);color:var(--mattone)}
.em-apri{flex:none;min-height:40px;padding:0 16px;background:var(--inchiostro);color:#fff;border:0;cursor:pointer;font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.em-suggerimento{font:11px var(--mono);color:var(--grigio);padding:7px 10px;background:var(--carta);border-top:1px solid var(--linea)}

/* ---------- telefono e finestre strette ---------- */
@media (max-width:980px){
  #esporta-app{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "terr" "mappa" "opz" "ant";grid-template-rows:none;padding:16px 16px 40px;gap:14px}
  #em-mappa{position:relative;top:0;height:62vh;min-height:360px;max-height:620px}
  .em-intro h1{font-size:28px}
  .em-testata{padding:10px 16px}
  .em-sez{padding:14px 14px 16px}
  .em-legenda{top:auto;bottom:10px}
  .em-info + .em-legenda,.em-info:not([hidden]) ~ .em-legenda{display:none}
}

/* ---------- tasto ⤓ in alto sulla mappa del sito ---------- */
#azioni-alto{position:fixed;z-index:2500;top:16px;right:16px;display:flex;gap:6px;align-items:flex-start}
#azioni-alto > *{min-height:38px;padding:0 14px;border:0;background:#1C2630;color:#fff;font:500 11px/38px 'Plex Mono',ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;box-shadow:0 2px 8px rgba(28,38,48,.25);text-decoration:none}
#azioni-alto > [hidden]{display:none}
#azioni-alto #vai-esporta{width:32px;height:32px;min-height:0;margin-top:3px;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#F6F4EF;color:#1C2630;border:1px solid #1C2630;box-shadow:0 2px 6px rgba(28,38,48,.18)}
#azioni-alto #vai-esporta:hover{background:#1C2630;color:#fff}
body:has(#dettaglio.visibile) #azioni-alto,body:has(#comandi.su) #azioni-alto,body:has(#filtri.su) #azioni-alto{display:none}
@media (max-width:760px){#azioni-alto{right:12px}#azioni-alto > *{min-height:36px;line-height:36px;padding:0 12px}#azioni-alto #vai-esporta{width:30px;height:30px;margin-top:3px}}

/* ---------- configuratore per livello ---------- */
.em-seg-grande button{min-height:46px;font-size:12px}
.em-inq{display:flex;align-items:center;gap:8px;font:500 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grigio)}
.em-inq select{font:12px var(--mono);letter-spacing:0;text-transform:none;color:var(--inchiostro);padding:7px 8px;border:1px solid var(--linea-forte);background:#fff;border-radius:0;max-width:200px}
.em-confine{fill:none;stroke:rgba(28,38,48,.45);stroke-width:.7px;vector-effect:non-scaling-stroke;pointer-events:none}
.em-confine.forte{stroke:var(--inchiostro);stroke-width:1.2px}
.em-info .em-stato.s2{font-weight:600}
.em-info .em-stato.s0{color:var(--grigio)}
.em-su{display:flex;flex-direction:column;gap:4px;flex:none}
.em-su button{min-height:32px;padding:0 10px;background:#fff;border:1px solid var(--linea-forte);cursor:pointer;font:500 10.5px/1 var(--mono);letter-spacing:.04em;white-space:nowrap}
.em-su button:hover{border-color:var(--inchiostro)}
.em-barra-alta{flex-wrap:wrap}
.em-inq{flex:1 1 180px;min-width:0}
.em-inq select{flex:1;min-width:0;max-width:260px}
@media (max-width:980px){.em-inq span{display:none}.em-inq select{max-width:none}.em-azioni .em-bt{padding:7px 8px}}

/* semestri */
.em-sem-da-a{display:flex;gap:10px;margin-top:10px}
.em-sem-da-a label{flex:1;display:flex;align-items:center;gap:8px;min-width:0}
.em-sem-da-a span{font:500 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--grigio)}
.em-sem-da-a select{flex:1;min-width:0;height:38px;border:1px solid var(--linea-forte);background:#fff;font:13px var(--mono);padding:0 8px;color:var(--inchiostro);border-radius:0}
#em-sem-passo{margin-top:0}
#em-sez-sem .em-campo{margin-top:12px}
