/* =====================================================================
   ux-misura.css — 📏 MISURA (va con ux-misura.js; prefissi ux-misura / uxm-)
   Classi su <html> (da ux-misura.js): ux-misura (misura attiva), ux-misura-pan (pannellino interno aperto),
   uxm-stretto (foglio in basso: telefono / tablet verticale). Variabile --ux-misura-h = altezza del foglio
   (px locali): con il foglio, --ux-b di ux-layout la comprende -> toast, colonna destra, pillole salgono sopra.
   Dentro #map i px sono quelli dello schermo (zoom inverso di ux-layout): le misure si moltiplicano per
   --uxm-z (= UX.z, messa da JS sul contenitore della mappa). Fuori da #map i px sono "locali" (scala da sola).
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) ISOLAMENTO DEI CLIC: mentre si misura niente dentro i riquadri della mappa riceve il puntatore (valvole,
   zone, particelle, FV, telecamere, aerei, etichette...), tranne le maniglie della misura. Il clic "cade" sul
   contenitore della mappa e Leaflet lo passa a map.fire (filtrato da ux-misura.js).
   +/-, attribuzione e gli altri comandi fuori dai riquadri restano cliccabili.
   --------------------------------------------------------------------- */
html.ux-misura #map .leaflet-map-pane > .leaflet-pane:not(.leaflet-uxmManiglie-pane) *{ pointer-events:none !important; }
html.ux-misura.ux-mouse #map.leaflet-container{ cursor:crosshair; }
html.ux-misura.ux-mouse #map.leaflet-container.leaflet-dragging{ cursor:grabbing; }

/* «Valvola qui» sparisce mentre si misura (le barre in basso scendono) */
html.ux-misura #fab-add{ display:none !important; }
html.ux-misura body{ --ux-fab-h:0px; }

/* foglio in basso: il bordo basso utile di ux-layout (--ux-b) comprende anche il foglio */
html.ux-misura.uxm-stretto{
  --ux-b: calc(max(var(--ux-bottom,0px), env(safe-area-inset-bottom,0px)) + var(--ux-sheet-h,0px) + var(--ux-misura-h,0px));
}
html.ux-misura.uxm-stretto #map .leaflet-bottom{ bottom:calc(var(--ux-sheet-h,0px) + var(--ux-misura-h,0px)); }

/* telefono / tablet verticale: con la misura aperta il pannello «Particelle selezionate» (selezione multipla del
   catasto) si nasconde e non occupa il fondo (--ux-sheet-h = 0): il foglio della misura resta in basso, mappa e
   mirino restano liberi. All'uscita torna com'era (la variabile inline di ux-catasto non viene toccata). */
html.ux-misura.uxm-stretto #ux-cat-multi{ display:none !important; }
html.ux-misura.uxm-stretto.ux-catmulti:not(.ux-catdock){ --ux-sheet-h:0px !important; }

/* avvisi (toast) col pannellino a destra: centrati nella mappa libera alla sua sinistra (--uxm-occ da ux-misura.js) */
html.ux-misura.uxm-occ .toast{
  left:calc((100vw / var(--ux-z,1) - var(--uxm-occ,0px) + var(--ux-rail-w,0px)) / 2);
  max-width:min(calc(100vw / var(--ux-z,1) - var(--uxm-occ,0px) - var(--ux-rail-w,0px) - 24px), 520px);
}
@supports (width:100dvw){
  html.ux-misura.uxm-occ .toast{
    left:calc((100dvw / var(--ux-z,1) - var(--uxm-occ,0px) + var(--ux-rail-w,0px)) / 2);
    max-width:min(calc(100dvw / var(--ux-z,1) - var(--uxm-occ,0px) - var(--ux-rail-w,0px) - 24px), 520px);
  }
}

/* nelle altre sezioni (Valvole, Contatori...) la misura resta ma non si vede */
html.uxi-fuori-mappa #ux-misura,
html.uxi-fuori-mappa .uxm-bolla{ display:none !important; }

/* ---------------------------------------------------------------------
   2) SULLA MAPPA: maniglie, punti intermedi, etichette, mirino
   --------------------------------------------------------------------- */
.uxm-h{ display:flex; align-items:center; justify-content:center; cursor:move; background:transparent; border:0; }
.uxm-h > span{
  box-sizing:border-box; display:block;
  width:calc(14px * var(--uxm-z,1)); height:calc(14px * var(--uxm-z,1)); border-radius:50%;
  background:#fff; border:calc(2.5px * var(--uxm-z,1)) solid #263238;
  box-shadow:0 0 0 calc(1px * var(--uxm-z,1)) rgba(255,255,255,.75), 0 1px 4px rgba(0,0,0,.5);
  transition:transform .12s ease;
}
.uxm-h.uxm-h-tocco > span{ width:18px; height:18px; border-width:3px; }
.uxm-h.uxm-h-primo > span{ background:#2e7d32; border-color:#fff; box-shadow:0 0 0 calc(1.5px * var(--uxm-z,1)) #1b5e20, 0 1px 4px rgba(0,0,0,.5); }
.uxm-h.uxm-h-sel > span{ background:#e65100; border-color:#fff; transform:scale(1.25); }
html.ux-mouse .uxm-h:hover > span{ transform:scale(1.3); }
.uxm-h.leaflet-drag-target > span,
.uxm-h:active > span{ transform:scale(1.35); background:#ffd600; }
/* punto intermedio (a meta' lato): trascinalo o toccalo per aggiungere un punto */
.uxm-h.uxm-h-mid{ cursor:copy; }
.uxm-h.uxm-h-mid > span{
  width:calc(10px * var(--uxm-z,1)); height:calc(10px * var(--uxm-z,1));
  background:rgba(255,255,255,.72); border:calc(1.5px * var(--uxm-z,1)) solid rgba(38,50,56,.85); box-shadow:none;
}
.uxm-h.uxm-h-mid.uxm-h-tocco > span{ width:13px; height:13px; border-width:2px; }
/* camminando col GPS: pallini piccoli */
.uxm-h.uxm-h-gps{ cursor:default; }
.uxm-h.uxm-h-gps > span{ width:calc(9px * var(--uxm-z,1)); height:calc(9px * var(--uxm-z,1)); border-width:calc(2px * var(--uxm-z,1)); box-shadow:none; }

/* etichette (marcatori senza dimensione: il testo si centra da solo sul punto) */
.uxm-et-box{ background:transparent; border:0; width:0 !important; height:0 !important; overflow:visible; }
.uxm-et{
  position:absolute; left:0; top:0; transform:translate(-50%, -50%);
  white-space:nowrap; pointer-events:none;
  font:700 calc(12px * var(--uxm-z,1))/1.25 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color:#fff; background:rgba(33,33,33,.84);
  padding:calc(2px * var(--uxm-z,1)) calc(7px * var(--uxm-z,1)); border-radius:999px;
  box-shadow:0 1px 3px rgba(0,0,0,.35); font-variant-numeric:tabular-nums;
}
.uxm-et.uxm-et-tenue{ background:rgba(33,33,33,.55); }
.uxm-et.uxm-et-area{
  display:flex; flex-direction:column; align-items:center; gap:0;
  font-size:calc(15px * var(--uxm-z,1)); padding:calc(4px * var(--uxm-z,1)) calc(11px * var(--uxm-z,1));
  border-radius:calc(12px * var(--uxm-z,1)); background:rgba(27,94,32,.86);
}
.uxm-et.uxm-et-area small{ font-size:calc(11.5px * var(--uxm-z,1)); font-weight:600; opacity:.9; }
.uxm-et.uxm-et-grigia{ background:rgba(97,97,97,.86); }
/* accanto al puntatore (mouse) e al mirino (tocco) */
.uxm-et.uxm-et-cur{ transform:translate(calc(14px * var(--uxm-z,1)), calc(-100% - 10px * var(--uxm-z,1))); background:rgba(38,50,56,.92); }
.uxm-et.uxm-et-mir{ transform:translate(26px, calc(-100% - 18px)); background:rgba(38,50,56,.92); font-size:13px; }
/* a destra non c'e' posto (colonna dei pulsanti, pannello, bordo): a sinistra o sopra la croce; in alto niente posto: sotto */
.uxm-et.uxm-et-mir.uxm-sx{ transform:translate(calc(-100% - 26px), calc(-100% - 18px)); }
.uxm-et.uxm-et-mir.uxm-su{ transform:translate(-50%, calc(-100% - 30px)); }
.uxm-et.uxm-et-mir.uxm-giu{ transform:translate(26px, 18px); }
.uxm-et.uxm-et-mir.uxm-sx.uxm-giu{ transform:translate(calc(-100% - 26px), 18px); }
.uxm-et.uxm-et-mir.uxm-su.uxm-giu{ transform:translate(-50%, 30px); }
/* trascinando: sopra il dito */
.uxm-et.uxm-et-dito{ transform:translate(-50%, calc(-100% - 36px * var(--uxm-z,1))); background:#e65100; font-size:calc(13px * var(--uxm-z,1)); }

/* mirino: croce fissa al centro della mappa visibile (solo a tocco); non riceve tocchi */
.uxm-mirino{
  position:absolute; z-index:650; left:50%; top:50%; display:none; pointer-events:none;
  width:46px; height:46px; margin:-23px 0 0 -23px;
}
.uxm-mirino.on{ display:block; }
.uxm-mirino::before,
.uxm-mirino::after{
  content:''; position:absolute; background:#fff; border-radius:2px;
  box-shadow:0 0 0 1px rgba(0,0,0,.75), 0 0 4px rgba(0,0,0,.5);
}
.uxm-mirino::before{ left:50%; top:0; bottom:0; width:2px; margin-left:-1px; }
.uxm-mirino::after{ top:50%; left:0; right:0; height:2px; margin-top:-1px; }
.uxm-mirino > i{
  position:absolute; left:50%; top:50%; width:16px; height:16px; margin:-8px 0 0 -8px; border-radius:50%;
  border:2px solid #ffd600; box-shadow:0 0 0 1px rgba(0,0,0,.7), inset 0 0 0 1px rgba(0,0,0,.5); z-index:1;
  background:rgba(0,0,0,.08);
}

/* ---------------------------------------------------------------------
   3) PANNELLO (#ux-misura): foglio in basso (telefono, tablet verticale) o pannellino a destra (largo)
   --------------------------------------------------------------------- */
#ux-misura{
  position:fixed; z-index:1450; display:none; box-sizing:border-box;
  background:#fff; color:#263238;
  font:14px/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  box-shadow:0 12px 40px rgba(0,0,0,.28), 0 0 0 1px rgba(0,0,0,.05);
  -webkit-tap-highlight-color:transparent;
}
#ux-misura.on{ display:flex; flex-direction:column; }
#ux-misura button{ font-family:inherit; touch-action:manipulation; }
#ux-misura .uxm-corpo{ min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
#ux-misura .uxm-grip{ display:none; }
#ux-misura .uxm-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* --- foglio in basso --- */
#ux-misura.uxm-foglio{
  left:calc(var(--ux-rail-w,0px) + env(safe-area-inset-left,0px));
  right:calc(var(--ux-panel-w,0px) + env(safe-area-inset-right,0px));
  bottom:calc(max(var(--ux-bottom,0px), env(safe-area-inset-bottom,0px)) + var(--ux-sheet-h,0px));
  /* mai sopra l'intestazione: al massimo il 65 % dello schermo e comunque 70 px di mappa sotto l'header */
  max-height:min(calc(65vh / var(--ux-z,1)), calc(100vh / var(--ux-z,1) - var(--ux-t) - var(--ux-tb,0px) - max(var(--ux-bottom,0px), env(safe-area-inset-bottom,0px)) - var(--ux-sheet-h,0px) - 70px));
  border-radius:18px 18px 0 0;
  box-shadow:0 -8px 30px rgba(0,0,0,.22), 0 0 0 1px rgba(0,0,0,.05);
  animation:uxm-su .22s ease-out;
}
@supports (height:100dvh){
  #ux-misura.uxm-foglio{ max-height:min(calc(65dvh / var(--ux-z,1)), calc(100dvh / var(--ux-z,1) - var(--ux-t) - var(--ux-tb,0px) - max(var(--ux-bottom,0px), env(safe-area-inset-bottom,0px)) - var(--ux-sheet-h,0px) - 70px)); }
}
/* tastiera dell'iPhone aperta (nome della misura): il foglio sale sopra di lei */
html.ux-kb #ux-misura.uxm-foglio{ bottom:var(--ux-kb,0px); }
#ux-misura.uxm-foglio.uxm-tablet{ max-width:600px; margin:0 auto; border-radius:18px 18px 0 0; }
#ux-misura.uxm-foglio .uxm-grip{
  display:block; flex:none; width:100%; height:16px; cursor:pointer; position:relative;
}
#ux-misura.uxm-foglio .uxm-grip::before{
  content:''; position:absolute; left:50%; top:6px; width:38px; height:4px; margin-left:-19px; border-radius:2px; background:#d5dcd9;
}
#ux-misura.uxm-foglio .uxm-corpo{ padding:0 calc(12px + env(safe-area-inset-right,0px)) 12px calc(12px + env(safe-area-inset-left,0px)); }

/* --- pannellino a destra (computer, iPad orizzontale, telefono orizzontale), accanto alla colonna --- */
#ux-misura.uxm-pannello{
  top:calc(var(--ux-t) + var(--ux-tb,0px) + 10px);
  right:calc(var(--ux-panel-w,0px) + env(safe-area-inset-right,0px) + var(--ux-dx-w) + 16px);
  width:340px;
  max-height:calc(100vh / var(--ux-z,1) - var(--ux-t) - var(--ux-tb,0px) - var(--ux-b) - 30px);
  border-radius:16px;
  animation:uxm-dx .2s ease-out;
}
@supports (height:100dvh){
  #ux-misura.uxm-pannello{ max-height:calc(100dvh / var(--ux-z,1) - var(--ux-t) - var(--ux-tb,0px) - var(--ux-b) - 30px); }
}
#ux-misura.uxm-pannello.uxm-tocco{ width:372px; }
#ux-misura.uxm-pannello.uxm-tel-orizz{ width:330px; top:calc(var(--ux-t) + 6px); max-height:calc(100vh / var(--ux-z,1) - var(--ux-t) - var(--ux-b) - 12px); }
#ux-misura.uxm-pannello .uxm-corpo{ padding:0 14px 14px; }
/* ridotto a pillola (per vedere i punti sotto) */
#ux-misura.uxm-pannello.uxm-pill{ width:auto; max-width:340px; border-radius:999px; flex-direction:row; }
#ux-misura.uxm-pill .uxm-corpo{ padding:4px; display:flex; align-items:center; gap:4px; overflow:visible; }
#ux-misura .uxm-pill-b{
  border:0; background:transparent; color:#1b5e20; font-size:15px; padding:6px 10px 6px 12px; cursor:pointer; white-space:nowrap;
  min-height:40px; border-radius:999px;
}
#ux-misura .uxm-pill-b b{ font-size:17px; }
html.ux-mouse #ux-misura .uxm-pill-b:hover{ background:#eaf1ed; }

@keyframes uxm-su{ from{ transform:translateY(40px); opacity:.3; } to{ transform:none; opacity:1; } }
@keyframes uxm-dx{ from{ transform:translateX(24px); opacity:0; } to{ transform:none; opacity:1; } }

/* --- testata: Area | Distanza, ⋯, ✕ --- */
#ux-misura .uxm-testa{
  display:flex; align-items:center; gap:6px; padding:2px 0 8px;
  position:sticky; top:0; background:#fff; z-index:2;
}
#ux-misura.uxm-pannello .uxm-testa{ padding-top:12px; }
#ux-misura .uxm-tit{ font-size:19px; line-height:1; flex:none; margin-right:2px; }
#ux-misura .uxm-spazio{ flex:1; }
#ux-misura .uxm-seg{ display:inline-flex; background:#eceff1; border-radius:11px; padding:3px; gap:2px; flex:none; }
#ux-misura .uxm-seg button{
  border:0; background:transparent; color:#455a64; font-weight:700; font-size:13.5px; padding:0 11px; height:34px;
  border-radius:9px; cursor:pointer; white-space:nowrap;
}
#ux-misura .uxm-seg button.on{ background:#fff; color:#1b5e20; box-shadow:0 1px 3px rgba(0,0,0,.18); }
#ux-misura .uxm-seg button:disabled{ opacity:.5; cursor:default; }
#ux-misura .uxm-ico{
  flex:none; width:38px; height:38px; border:0; border-radius:11px; background:#eceff1; color:#37474f;
  font-size:17px; font-weight:800; line-height:38px; padding:0; cursor:pointer; text-align:center;
}
#ux-misura .uxm-ico.uxm-x{ background:#37474f; color:#fff; font-size:15px; }
html.ux-mouse #ux-misura .uxm-ico:hover{ background:#dfe5e8; }
html.ux-mouse #ux-misura .uxm-ico.uxm-x:hover{ background:#263238; }

/* --- numeri --- */
#ux-misura .uxm-num{ padding:2px 2px 6px; }
#ux-misura .uxm-big{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; line-height:1.15; }
#ux-misura .uxm-big b{ font-size:25px; font-weight:800; color:#1b5e20; font-variant-numeric:tabular-nums; letter-spacing:-.2px; }
#ux-misura .uxm-big span{ font-size:19px; font-weight:800; color:#33691e; font-variant-numeric:tabular-nums; }
#ux-misura.uxm-pannello .uxm-big b{ font-size:27px; }
#ux-misura .uxm-sm{ font-size:13px; color:#546e7a; margin-top:2px; font-variant-numeric:tabular-nums; }
#ux-misura .uxm-num.uxm-grigio .uxm-big b,
#ux-misura .uxm-num.uxm-grigio .uxm-big span{ color:#8a979e; }

/* --- messaggi, avvisi --- */
#ux-misura .uxm-msg{ margin:4px 0 10px; font-size:14px; line-height:1.4; }
#ux-misura .uxm-msg.uxm-info{ background:#e8f5e9; color:#1b5e20; border-radius:10px; padding:8px 10px; font-weight:600; }
#ux-misura .uxm-sm2{ color:#546e7a; font-size:13px; margin:0 0 8px; }
#ux-misura .uxm-avv{ background:#fff3e0; color:#bf360c; border-radius:10px; padding:7px 10px; margin:0 0 8px; font-size:13px; font-weight:600; }
#ux-misura .uxm-nota{ font-size:12px; color:#546e7a; margin-top:8px; }
#ux-misura .uxm-aiuto{ font-size:12.5px; color:#546e7a; margin-top:10px; line-height:1.4; }

/* --- confronto con la particella catastale --- */
#ux-misura .uxm-conf{ background:#f1f8f2; border:1px solid #d5e8d8; border-radius:12px; padding:8px 10px; margin:2px 0 10px; font-size:12.5px; }
#ux-misura .uxm-conf-tit{ font-weight:800; color:#1b5e20; margin-bottom:4px; font-size:13px; }
#ux-misura .uxm-conf > div:not(.uxm-conf-tit):not(.uxm-nota){ display:flex; justify-content:space-between; gap:8px; padding:1px 0; }
#ux-misura .uxm-conf span{ color:#546e7a; white-space:nowrap; }
#ux-misura .uxm-conf b{ text-align:right; font-variant-numeric:tabular-nums; white-space:normal; font-size:12px; }
#ux-misura .uxm-conf .uxm-diff-forte{ color:#bf360c; }
#ux-misura .uxm-conf .uxm-nota{ margin-top:4px; }

/* --- pulsanti --- */
#ux-misura .uxm-azioni{ display:flex; gap:8px; margin:4px 0 2px; }
#ux-misura .uxm-col{ display:flex; flex-direction:column; gap:8px; margin:6px 0 2px; }
#ux-misura .uxm-griglia{ display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; margin:10px 0 4px; }
#ux-misura .uxm-b{
  min-height:44px; border:0; border-radius:12px; background:#eceff1; color:#263238;
  font-weight:700; font-size:14px; line-height:1.15; padding:6px 10px; cursor:pointer; flex:1 1 auto; white-space:nowrap;
  display:inline-flex; align-items:center; justify-content:center; text-align:center; gap:4px;
}
#ux-misura .uxm-b.uxm-q{ flex:0 0 48px; font-size:20px; padding:0; }
#ux-misura .uxm-b.uxm-largo{ flex:2 1 auto; }
#ux-misura .uxm-b.uxm-prim{ background:#1b5e20; color:#fff; }
#ux-misura .uxm-b.uxm-rosso{ background:#ffebee; color:#c62828; }
#ux-misura .uxm-b:disabled{ opacity:.4; cursor:default; }
#ux-misura .uxm-b.uxm-luce{ animation:uxm-luce 1.1s ease-in-out infinite alternate; }
#ux-misura.uxm-tocco .uxm-b{ min-height:48px; }
#ux-misura.uxm-tocco .uxm-griglia .uxm-b{ min-height:46px; font-size:13.5px; }
#ux-misura .uxm-griglia .uxm-b{ font-size:13px; padding:6px 4px; }
html.ux-mouse #ux-misura .uxm-b:not(:disabled):hover{ filter:brightness(.95); }
html.ux-mouse #ux-misura .uxm-b.uxm-prim:not(:disabled):hover{ background:#174f1b; filter:none; }
#ux-misura .uxm-b:not(:disabled):active{ transform:scale(.97); }
@keyframes uxm-luce{ from{ box-shadow:0 0 0 0 rgba(46,125,50,.0); } to{ box-shadow:0 0 0 5px rgba(46,125,50,.35); } }

/* impostazioni GPS */
#ux-misura .uxm-opz{ display:flex; align-items:center; flex-wrap:wrap; gap:5px; margin-top:8px; font-size:12.5px; color:#546e7a; }
#ux-misura .uxm-opz > span{ margin-right:2px; }
#ux-misura .uxm-b.uxm-mini{ min-height:32px; flex:0 0 auto; padding:2px 10px; font-size:12.5px; border-radius:9px; }
#ux-misura.uxm-tocco .uxm-b.uxm-mini{ min-height:36px; }
#ux-misura .uxm-b.uxm-mini.on{ background:#1b5e20; color:#fff; }

/* elenco dei lati / tratti */
#ux-misura .uxm-tratti-t{
  border:0; background:transparent; color:#37474f; font-weight:700; font-size:13px; padding:8px 2px 4px; cursor:pointer; min-height:36px;
}
#ux-misura .uxm-tratti{ list-style:none; margin:0; padding:0 2px; max-height:180px; overflow-y:auto; font-size:13px; }
#ux-misura .uxm-tratti li{ display:flex; justify-content:space-between; border-bottom:1px solid #eceff1; padding:3px 0; font-variant-numeric:tabular-nums; }
#ux-misura .uxm-tratti li span{ color:#546e7a; }

/* fascia del GPS */
#ux-misura .uxm-gps{ border-radius:12px; padding:8px 10px; margin:2px 0 6px; background:#eceff1; }
#ux-misura .uxm-gps.uxm-gps-verde{ background:#e8f5e9; }
#ux-misura .uxm-gps.uxm-gps-giallo{ background:#fff8e1; }
#ux-misura .uxm-gps.uxm-gps-rosso{ background:#ffebee; }
#ux-misura .uxm-gps-riga{ font-size:13.5px; font-variant-numeric:tabular-nums; }
#ux-misura .uxm-gps-avv{ font-size:12.5px; color:#bf360c; font-weight:700; margin-top:3px; }
#ux-misura .uxm-gps .uxm-azioni{ flex-wrap:wrap; margin-top:6px; }
#ux-misura .uxm-gps .uxm-b{ min-height:42px; font-size:13px; padding:4px 8px; }

/* viste interne: Salva, Le mie misure, Esporta */
#ux-misura .uxm-sotto-testa{ display:flex; align-items:center; gap:10px; margin:0 0 8px; }
#ux-misura .uxm-sotto-testa b{ font-size:15px; }
#ux-misura .uxm-b.uxm-ind{ flex:0 0 auto; min-height:38px; background:transparent; color:#1b5e20; padding:4px 6px; }
#ux-misura .uxm-lab{ display:block; font-size:12.5px; font-weight:700; color:#546e7a; margin:2px 0 4px; }
#ux-misura .uxm-campo{
  width:100%; box-sizing:border-box; border:1.5px solid #c8d6cc; border-radius:10px; padding:10px; font-size:16px;
  font-family:inherit; margin-bottom:8px; background:#fff; color:#263238;
}
#ux-misura .uxm-campo:focus{ outline:none; border-color:#2e7d32; box-shadow:0 0 0 3px rgba(46,125,50,.18); }
#ux-misura .uxm-lista{ display:flex; flex-direction:column; gap:4px; max-height:calc(46vh / var(--ux-z,1)); overflow-y:auto; margin-bottom:6px; }
#ux-misura .uxm-riga{ display:flex; align-items:center; gap:4px; border-bottom:1px solid #eceff1; padding:2px 0; }
#ux-misura .uxm-riga .uxm-campo{ margin:0; flex:1; }
#ux-misura .uxm-riga .uxm-b{ flex:0 0 auto; min-height:40px; }
#ux-misura .uxm-riga .uxm-b.uxm-q{ flex:0 0 40px; font-size:16px; background:transparent; }
#ux-misura .uxm-riga-apri{
  flex:1; min-width:0; display:flex; align-items:center; gap:8px; border:0; background:transparent; text-align:left;
  padding:6px 4px; cursor:pointer; border-radius:10px; color:#263238; min-height:44px;
}
html.ux-mouse #ux-misura .uxm-riga-apri:hover{ background:#f1f8f2; }
#ux-misura .uxm-riga-ico{ font-size:20px; color:#2e7d32; flex:none; width:24px; text-align:center; }
#ux-misura .uxm-riga-txt{ display:flex; flex-direction:column; min-width:0; }
#ux-misura .uxm-riga-txt b{ font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#ux-misura .uxm-riga-txt span{ font-size:12px; color:#546e7a; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#ux-misura .uxm-riga-q{ flex:1; font-size:13.5px; font-weight:600; }
#ux-misura .uxm-testo{
  white-space:pre-wrap; word-break:break-word; background:#f5f7f8; border-radius:10px; padding:8px 10px; margin:8px 0 0;
  font:12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color:#37474f; max-height:160px; overflow:auto;
  user-select:text; -webkit-user-select:text;
}

/* foglio compatto: solo numeri e pulsanti principali; esteso: anche il resto */
#ux-misura.uxm-foglio:not(.uxm-esteso) .uxm-num{ padding-bottom:2px; }
#ux-misura.uxm-foglio:not(.uxm-esteso) .uxm-sm{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#ux-misura.uxm-foglio .uxm-testa{ padding-bottom:5px; }
#ux-misura.uxm-foglio .uxm-seg button{ height:32px; }
#ux-misura.uxm-foglio .uxm-ico{ width:36px; height:36px; line-height:36px; }
/* a tocco: Area / Distanza, ⋯ e ✕ un po' piu' grandi e con l'area sensibile allargata (::before) ad almeno 44 px */
#ux-misura.uxm-tocco .uxm-seg button{ position:relative; height:36px; }
#ux-misura.uxm-tocco .uxm-seg button::before{ content:''; position:absolute; left:0; right:0; top:-5px; bottom:-5px; }
#ux-misura.uxm-tocco .uxm-ico{ position:relative; width:40px; height:40px; line-height:40px; }
#ux-misura.uxm-tocco .uxm-ico::before{ content:''; position:absolute; left:-3px; right:-3px; top:-3px; bottom:-3px; }

/* pulsanti stretti con icona + parola piccola sotto (↶ Annulla, ⌖ Mirino / ☝ Tocco, 📍 GPS) */
#ux-misura .uxm-b.uxm-q2{ flex-direction:column; gap:1px; font-size:19px; line-height:1; padding:3px 0 2px; }
#ux-misura .uxm-b.uxm-q2 small{ font-size:10.5px; font-weight:700; line-height:1.1; letter-spacing:-.1px; }
/* niente pulsante che esce dalla fila: se manca spazio si stringono */
#ux-misura .uxm-azioni .uxm-b{ min-width:0; }
#ux-misura .uxm-azioni .uxm-b.uxm-largo{ overflow:hidden; text-overflow:ellipsis; }
/* telefono in orizzontale: pannello stretto -> pulsanti piu' fitti */
#ux-misura.uxm-tel-orizz .uxm-azioni{ gap:5px; }
#ux-misura.uxm-tel-orizz .uxm-b{ padding-left:7px; padding-right:7px; font-size:13.5px; }
#ux-misura.uxm-tel-orizz .uxm-b.uxm-q{ flex:0 0 42px; padding-left:0; padding-right:0; }

/* telefono stretto (< 380 px): pulsanti piu' fitti */
@media (max-width:379px){
  #ux-misura .uxm-seg button{ padding:0 8px; font-size:13px; }
  #ux-misura .uxm-b.uxm-q{ flex-basis:44px; }
  #ux-misura .uxm-azioni{ gap:6px; }
}

/* ---------------------------------------------------------------------
   4) BOLLICINA DI UN PUNTO (tocco): Sposta col mirino · Togli · Chiudi qui
   --------------------------------------------------------------------- */
.uxm-bolla{
  position:fixed; z-index:1460; display:none; align-items:center; gap:6px; flex-wrap:wrap;
  max-width:calc(100vw - 16px); box-sizing:border-box;
  background:#263238; color:#fff; border-radius:14px; padding:6px;
  box-shadow:0 6px 22px rgba(0,0,0,.35);
  font:14px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.uxm-bolla.on{ display:flex; }
.uxm-bolla:focus{ outline:none; }
.uxm-bolla .uxm-bolla-tit{ font-size:12px; font-weight:700; color:#b0bec5; padding:0 4px; }
.uxm-bolla button{
  border:0; border-radius:10px; background:#37474f; color:#fff; font-family:inherit; font-weight:700; font-size:14px; line-height:1.1;
  min-height:44px; padding:0 12px; cursor:pointer; touch-action:manipulation;
}
.uxm-bolla button:focus-visible{ outline:2px solid #ffd600; outline-offset:1px; }
html.ux-mouse .uxm-bolla button:hover{ background:#455a64; }
.uxm-bolla button.uxm-bolla-x{ background:transparent; color:#cfd8dc; min-width:40px; padding:0; }
