/* ═════════════════════════════════════════════════════════════════
   CENTRALE PRESIDI · VERONA RUN MARATHON 2026
   Strato "Occhio di Dio" sopra il design system dell'app Presenze
   (assets/vrm.css). Tema "ops" = sala operativa notte, "light" = chiaro.
   © 2026 Francesco Modnicki — FM-VRM26-CP — tutti i diritti riservati.
   ═════════════════════════════════════════════════════════════════ */
/* @license FM-VRM26-CP © 2026 Francesco Modnicki */

/* ── temi ───────────────────────────────────────── */
html.ops{
 --bg:#040a22;--sf:#0a1537;--sf2:#081230;--tx:#e9eeff;--tx2:#bcc7e8;--mu:#7f8fbb;--bd:#17285b;--bd2:#22387c;
 --ac:#3a6bff;--ac-h:#5c86ff;--ac-soft:#0f2259;--gd-soft:#2a1606;--gd-ink:#ffb27e;
 --ok:#22d07a;--ok-soft:#07291b;--wa:#ffb020;--wa-soft:#2b1e05;--er:#ff4d5e;--er-soft:#2e0b15;
 --sh1:0 1px 2px rgba(0,0,0,.55);--sh2:0 1px 2px rgba(0,0,0,.5),0 10px 28px -8px rgba(0,0,0,.6);
 --sh3:0 28px 70px -14px rgba(0,0,0,.75);
 --grid:rgba(58,107,255,.055);--glow:0 0 0 1px rgba(58,107,255,.18),0 0 24px -6px rgba(58,107,255,.35);
 color-scheme:dark
}
html.light{
 --bg:#f3f5fa;--sf:#ffffff;--sf2:#f7f8fc;--tx:#0e1726;--tx2:#334155;--mu:#6b7486;--bd:#e3e7f0;--bd2:#d3d9e6;
 --ac:var(--brand-blue);--ac-h:#0f2783;--ac-soft:#e9eefc;--gd-soft:#fff1e7;--gd-ink:#8a3200;
 --ok:#12a160;--ok-soft:#e3f6ec;--wa:#c98a00;--wa-soft:#fdf3d8;--er:#d93030;--er-soft:#fdeaea;
 --sh1:0 1px 2px rgba(14,23,38,.05),0 1px 1px rgba(14,23,38,.03);
 --sh2:0 1px 2px rgba(14,23,38,.05),0 8px 24px -6px rgba(14,23,38,.10);
 --sh3:0 24px 60px -12px rgba(8,22,56,.35);
 --grid:transparent;--glow:var(--sh1);
 color-scheme:light
}
html.ops .btn.p,html.light .btn.p,html.ops .btn.p:hover,html.light .btn.p:hover{--c:#fff}
html.ops .btn.dd,html.light .btn.dd{--c:#fff}
html.ops .toast{background:#0f1f4d}html.light .toast{background:#0d1b3d}
html.ops .pop,html.ops .pop:before{background:#13285e}

/* sala operativa: griglia tecnica di fondo */
html.ops .mainc{background:
  linear-gradient(var(--grid) 1px,transparent 1px) 0 0/34px 34px,
  linear-gradient(90deg,var(--grid) 1px,transparent 1px) 0 0/34px 34px,
  radial-gradient(1200px 600px at 70% -10%,rgba(58,107,255,.10),transparent 60%),var(--bg)}
html.ops .card,html.ops .kpi>div{background:linear-gradient(180deg,color-mix(in srgb,var(--sf) 92%,#1b3a9a),var(--sf));box-shadow:var(--glow)}
html.ops .tb{background:color-mix(in srgb,var(--bg) 82%,transparent)}
.mono,.tm{font-family:ui-monospace,"SF Mono","JetBrains Mono",Menlo,monospace;font-variant-numeric:tabular-nums}

/* header: orologio + azioni */
.clock{font:italic 700 26px/1 var(--fd);letter-spacing:.03em;color:var(--tx);padding:0 6px;font-variant-numeric:tabular-nums}
.clock small{font:600 11px var(--f);letter-spacing:.08em;color:var(--mu);margin-left:4px;font-style:normal}
.tb .ta .btn .i{width:16px;height:16px}

/* mappa con HUD */
.mapbox{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--bd);background:#050b22;min-height:0;box-shadow:var(--glow)}
#map{position:absolute;inset:0;background:#050b22}
html.light #map{background:#e8ecf3}
.leaflet-container{font-family:var(--f);background:#050b22}
html.ops #map .leaflet-tile{filter:invert(1) hue-rotate(195deg) brightness(.82) contrast(.95) saturate(.55)}
html.light .leaflet-container{background:#e8ecf3}
.hud{position:absolute;pointer-events:none;z-index:500;inset:10px}
.hud:before,.hud:after,.hud i:before,.hud i:after{content:"";position:absolute;width:22px;height:22px;border-color:color-mix(in srgb,var(--ac) 70%,#fff 10%);border-style:solid;opacity:.75}
.hud:before{left:0;top:0;border-width:2px 0 0 2px}.hud:after{right:0;top:0;border-width:2px 2px 0 0}
.hud i:before{left:0;bottom:0;border-width:0 0 2px 2px}.hud i:after{right:0;bottom:0;border-width:0 2px 2px 0}
html.light .hud{display:none}
.radar{position:absolute;inset:0;z-index:450;pointer-events:none;mix-blend-mode:screen;opacity:.55;
  background:conic-gradient(from 0deg at 50% 50%,rgba(58,107,255,.0) 0deg,rgba(58,107,255,.0) 300deg,rgba(90,140,255,.10) 350deg,rgba(120,170,255,.16) 360deg);
  animation:sweep 7s linear infinite}
@keyframes sweep{to{transform:rotate(360deg)}}
html.light .radar{display:none}
.telemetry{position:absolute;z-index:520;left:12px;right:12px;bottom:10px;display:flex;gap:16px;align-items:center;justify-content:space-between;pointer-events:none;
  font:600 11px/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.06em;color:#9fb6ff;text-shadow:0 1px 2px rgba(0,0,0,.8)}
html.light .telemetry{color:var(--brand-navy);text-shadow:0 1px 0 rgba(255,255,255,.9)}
.telemetry span{background:rgba(4,10,34,.7);padding:5px 8px;border-radius:6px;border:1px solid rgba(58,107,255,.22)}
html.light .telemetry span{background:rgba(255,255,255,.88);border-color:var(--bd)}
.rl{background:rgba(4,10,34,.86);border:1px solid rgba(58,107,255,.3);border-radius:12px;padding:9px 11px;color:#cfdaf7;font-size:12px;box-shadow:var(--sh2);max-width:240px}
html.light .rl{background:rgba(255,255,255,.95);color:var(--tx2);border-color:var(--bd)}
.rl b{display:block;font:700 10.5px var(--f);letter-spacing:.12em;text-transform:uppercase;color:#7f95cc;margin-bottom:5px}
.rl label{display:flex;align-items:center;gap:8px;margin:3px 0;font:500 12px var(--f);color:inherit;cursor:pointer}
.rl label input{width:14px;height:14px;accent-color:var(--gd)}
.rl label i{width:16px;height:4px;border-radius:2px;flex:none}
.leaflet-control-zoom a{background:var(--sf)!important;color:var(--tx)!important;border-color:var(--bd)!important}
.leaflet-control-attribution{background:rgba(4,10,34,.6)!important;color:#7f8fbb!important}
html.light .leaflet-control-attribution{background:rgba(255,255,255,.8)!important;color:#555!important}
.leaflet-control-attribution a{color:#9fb6ff!important}

/* marcatori presidio */
.mk{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:700 10px/1 var(--f);color:#fff;border:2px solid rgba(255,255,255,.92);box-shadow:0 2px 8px rgba(0,0,0,.55);font-variant-numeric:tabular-nums;transition:transform .15s}
.mk.scoperto{background:#e3263d}
.mk.confermato{background:#16b866;box-shadow:0 0 0 3px rgba(34,208,122,.25),0 2px 8px rgba(0,0,0,.5)}
.mk.distante{background:#f5a10f;color:#2b1a00}
.mk.criticita{background:#ff2d6f;animation:crit 1s infinite}
.mk.stale{border-style:dashed;border-color:#ffd166}
.mk.sel{transform:scale(1.45);z-index:1000;box-shadow:0 0 0 4px rgba(255,106,19,.55),0 4px 14px rgba(0,0,0,.6)}
@keyframes crit{0%,100%{box-shadow:0 0 0 0 rgba(255,45,111,.75),0 2px 8px rgba(0,0,0,.5)}50%{box-shadow:0 0 0 9px rgba(255,45,111,0),0 2px 8px rgba(0,0,0,.5)}}
.ping{width:70px;height:70px;border-radius:50%;border:2px solid var(--pc,#22d07a);animation:ping 1.8s ease-out forwards;pointer-events:none}
@keyframes ping{from{transform:scale(.15);opacity:1}to{transform:scale(1.6);opacity:0}}

/* ── elenco presidi (sempre in ordine di numero) ───────────── */
.plist{grid-row:2/4;grid-column:2;display:flex;flex-direction:column;min-height:0;margin:0;padding:14px 12px 10px}
.plist .ph2{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4px 10px}
.plist .ph2 h2{font:italic 800 19px/1 var(--fd);letter-spacing:.03em;text-transform:uppercase;margin:0}
.plist .ph2 .bdg{font-variant-numeric:tabular-nums}
.plist .ifl{margin:0 4px 8px}
.plist .ifl input{min-height:38px;padding-top:8px;padding-bottom:8px;font-size:14px}
.plist .seg{margin:0 4px 10px;display:flex;flex-wrap:wrap;width:auto}
.plist .seg button{flex:1 1 auto;padding:6px 8px;font-size:12px;min-height:30px;justify-content:center}
.plist .seg button b{font:700 11px var(--f);color:var(--mu);margin-left:2px;font-variant-numeric:tabular-nums}
.plist .seg button.on b{color:var(--ac)}
.rows{flex:1;overflow:auto;min-height:0;margin:0 -2px;padding:0 2px}
.rows::-webkit-scrollbar{width:9px}.rows::-webkit-scrollbar-thumb{background:var(--bd2);border-radius:6px;border:2px solid var(--sf)}
.prow{display:flex;align-items:center;gap:10px;width:100%;padding:8px;border:1px solid transparent;border-radius:11px;background:transparent;color:inherit;cursor:pointer;text-align:left;font:inherit;transition:background .12s,border-color .12s}
.prow:hover{background:var(--sf2)}
.prow.on{background:var(--ac-soft);border-color:color-mix(in srgb,var(--ac) 40%,transparent)}
.prow .nb{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font:italic 800 16px/1 var(--fd);flex:none;color:#fff;letter-spacing:.02em}
.nb.scoperto{background:linear-gradient(160deg,#ff5468,#c81d33)}
.nb.confermato{background:linear-gradient(160deg,#2be08a,#0f9a55)}
.nb.distante{background:linear-gradient(160deg,#ffc04a,#e08a00);color:#2b1a00}
.nb.criticita{background:linear-gradient(160deg,#ff4f8b,#d4134f);animation:crit 1s infinite}
.prow .pm{flex:1;min-width:0}
.prow .pm b{display:block;font-size:13.5px;font-weight:600}
.prow .pm span{display:block;font-size:12px;color:var(--mu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prow .pr{text-align:right;flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.prow .pr .tm{font-size:11px;color:var(--mu)}
.bdg.cr{background:#ff2d6f;color:#fff;border-color:transparent}
.bdg.st{background:color-mix(in srgb,#ffd166 18%,transparent);color:#e0a800;border-color:transparent}
.rows .empty{padding:28px 10px}

/* ── dettaglio presidio (drawer) ───────────────────────────── */
.drawer{position:fixed;top:0;right:0;height:100vh;width:400px;max-width:100vw;background:var(--sf);border-left:1px solid var(--bd);z-index:60;transform:translateX(104%);transition:transform .28s cubic-bezier(.2,.8,.2,1);overflow:auto;box-shadow:var(--sh3)}
html.ops .drawer{background:linear-gradient(180deg,#0b1a45,var(--sf) 240px)}
.drawer.open{transform:none}
.dr-x{position:absolute;right:12px;top:12px;z-index:2}
.dh{padding:24px 22px 18px;border-bottom:1px solid var(--bd);position:relative;overflow:hidden}
.dh:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--tri)}
.dh .nb{width:58px;height:58px;border-radius:15px;font-size:24px;display:grid;place-items:center;margin-bottom:12px}
.dh small{display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mu)}
.dh h3{font:italic 800 26px/1.05 var(--fd);text-transform:uppercase;letter-spacing:.02em;margin:3px 0 4px}
.dh p{margin:0 0 10px;color:var(--tx2);font-size:13.5px}
.db{padding:16px 22px 24px}
.kv{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--bd);font-size:13.5px}
.kv:last-of-type{border-bottom:0}
.kv span{color:var(--mu)}
.kv b{font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.kv b.ok{color:var(--ok)}.kv b.wa{color:var(--wa)}
.kv .link{padding:0 0 0 6px;font-size:12.5px}
.acc{display:grid;gap:8px;margin-top:16px}
.acc .btn{width:100%}
.btn.ok{--b:var(--ok);--c:#03210f;--bc:var(--ok);font-weight:700}
.btn.ok:hover{background:color-mix(in srgb,var(--ok) 88%,#fff);border-color:var(--ok)}
.qrbox{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding:14px;border:1px solid var(--bd);border-radius:14px;background:var(--sf2)}
.qrbox b{display:block;font:italic 800 30px/1 var(--fd)}
.qrbox small{display:block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mu)}
.qrbox span{display:block;font-size:12px;color:var(--mu);margin-top:4px;max-width:200px}
.qrimg{width:96px;height:96px;background:#fff;border-radius:9px;padding:6px;flex:none}
.qrimg img{width:100%!important;height:100%!important;image-rendering:pixelated}
.drawer textarea{margin-top:14px}

/* ── allarmi (criticità in arrivo) ─────────────────────────── */
.alarms{position:fixed;top:16px;right:16px;z-index:85;display:flex;flex-direction:column;gap:10px;max-width:360px}
.alarm{display:flex;gap:12px;align-items:flex-start;background:linear-gradient(160deg,#3a0a1d,#24060f);border:1px solid #ff2d6f;border-radius:14px;padding:13px 14px;color:#ffe3ec;box-shadow:0 18px 40px -12px rgba(255,45,111,.45);cursor:pointer;animation:rise .25s}
.alarm .ai{width:36px;height:36px;border-radius:10px;background:#ff2d6f;color:#fff;display:grid;place-items:center;flex:none;animation:crit 1s infinite}
.alarm b{display:block;font:italic 800 17px/1.1 var(--fd);letter-spacing:.03em;text-transform:uppercase}
.alarm span{font-size:13px;color:#ffc2d4}

/* ── griglia ───────────────────────────────────────────────── */
.gsum{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.gsum .gbig{font:italic 800 46px/1 var(--fd);color:var(--ok)}
.gsum .gbig em{font-style:italic;font-size:26px;color:var(--mu)}
.gsum .lgd{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--tx2);font-weight:600}
.cells{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:7px}
.cell{aspect-ratio:1;border:0;border-radius:10px;font:italic 800 16px/1 var(--fd);color:#fff;cursor:pointer;transition:transform .1s,filter .1s;letter-spacing:.02em}
.cell:hover{transform:scale(1.08);filter:brightness(1.1)}
.cell.scoperto{background:linear-gradient(160deg,#ff5468,#c81d33)}
.cell.confermato{background:linear-gradient(160deg,#2be08a,#0f9a55)}
.cell.distante{background:linear-gradient(160deg,#ffc04a,#e08a00);color:#2b1a00}
.cell.criticita{background:linear-gradient(160deg,#ff4f8b,#d4134f);animation:crit 1s infinite}
.cell.stale{outline:2px dashed #ffd166;outline-offset:-4px}
.sw{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:6px;vertical-align:-1px}
.sw.scoperto{background:#e3263d}.sw.confermato{background:#16b866}.sw.distante{background:#f5a10f}.sw.criticita{background:#ff2d6f}

/* ── settori ───────────────────────────────────────────────── */
.zones{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:14px}
.zone{margin:0}
.zone.alert{border-color:#ff2d6f;box-shadow:0 0 0 1px rgba(255,45,111,.35)}
.zone .zt{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}
.zone .zt h3{font:italic 800 21px/1 var(--fd);text-transform:uppercase;letter-spacing:.03em;margin:0}
.zone .zt small{display:block;font-size:12px;color:var(--mu);margin-top:3px}
.zone .zp{font:italic 800 30px/1 var(--fd)}
.zp.full{color:var(--ok)}.zp.mid{color:var(--wa)}.zp.low{color:var(--er)}
.zone .zb{height:6px;border-radius:6px;background:color-mix(in srgb,var(--mu) 20%,transparent);overflow:hidden;margin-bottom:10px}
.zone .zb span{display:block;height:100%;background:linear-gradient(90deg,var(--ok),#5ff0a8);border-radius:6px}
.zone .zs{display:flex;gap:14px;font-size:12.5px;font-weight:700;color:var(--tx2);margin-bottom:12px;font-variant-numeric:tabular-nums}
.zone .cells{grid-template-columns:repeat(auto-fill,minmax(36px,1fr));gap:5px}
.zone .cell{font-size:13px;border-radius:8px}

/* ── allarmi (vista) e liste azione ────────────────────────── */
.alist{display:flex;flex-direction:column;gap:6px}
.arow{display:flex;align-items:center;gap:12px;padding:10px;border:1px solid var(--bd);border-radius:12px;background:var(--sf2)}
.arow .pm{flex:1;min-width:0}
.arow .pm b{display:block;font-size:14px}
.arow .pm span{display:block;font-size:12.5px;color:var(--mu)}
.arow .btns{flex:none}

/* ── impostazioni ──────────────────────────────────────────── */
.sv{position:sticky;bottom:0;z-index:15;display:flex;align-items:center;gap:12px;justify-content:space-between;background:color-mix(in srgb,var(--sf) 94%,transparent);backdrop-filter:blur(8px);border:1px solid var(--bd);border-radius:14px;padding:12px 14px;margin-top:6px;box-shadow:var(--sh2)}
.sv .msg{margin:0}
.kvs .kv b code{font-size:12px;word-break:break-all}
.tema{display:flex;gap:10px;flex-wrap:wrap}
.tema button{flex:1;min-width:150px;border:2px solid var(--bd2);background:var(--sf2);border-radius:14px;padding:12px;cursor:pointer;color:var(--tx);text-align:left;font:600 14px var(--f)}
.tema button.on{border-color:var(--gd)}
.tema button i{display:block;height:44px;border-radius:9px;margin-bottom:8px}
.tema .t-ops i{background:linear-gradient(90deg,#071a42 30%,#040a22 30%),#040a22;box-shadow:inset 0 0 0 1px #22387c}
.tema .t-light i{background:linear-gradient(90deg,#132a86 30%,#f3f5fa 30%);box-shadow:inset 0 0 0 1px #d3d9e6}
.danger{border-color:color-mix(in srgb,var(--er) 45%,var(--bd))}
.danger>h2 .i{color:var(--er)!important}

/* ── codici e QR ───────────────────────────────────────────── */
.urlbox{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.urlbox code{flex:1;min-width:220px;font:600 15px ui-monospace,"SF Mono",Menlo,monospace;background:var(--sf2);border:1px solid var(--bd2);border-radius:11px;padding:11px 13px;color:var(--tx);word-break:break-all}
.qrgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.qrc{background:#fff;color:#0e1726;border-radius:12px;padding:12px;text-align:center;border:1px solid #e3e7f0;position:relative;overflow:hidden}
.qrc:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--tri)}
.qrc .q{width:118px;height:118px;margin:4px auto 0}
.qrc .q img{width:100%!important;height:100%!important;image-rendering:pixelated}
.qrc b{display:block;font:italic 800 20px/1 var(--fd);text-transform:uppercase;margin-top:8px;color:#0b1b57}
.qrc span{display:block;font-size:11px;color:#6b7486;margin-top:3px;min-height:14px}
textarea.msgw{min-height:120px;font-size:14px}

@media print{
  .sb,.tb,.drawer,.alarms,.noprint,.toast{display:none!important}
  .shell{display:block;background:none}
  html,body,.mainc{background:#fff!important}
  #mn{padding:0!important;max-width:none!important}
  .card{box-shadow:none!important;border:0!important;background:#fff!important;padding:0!important}
  .qrgrid{grid-template-columns:repeat(4,1fr)}
  .qrc{break-inside:avoid}
}

/* ── responsive ────────────────────────────────────────────── */
@media (max-width:1200px){.eye{grid-template-columns:minmax(0,1fr) 320px}.eye .kpi{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){
  #mn.full{height:auto}
  .eye{display:flex;flex-direction:column}
  .mapbox{height:58vh;min-height:360px}
  .plist{max-height:70vh}
  .feed{height:240px}
  .drawer{width:100vw}
}
@media (prefers-reduced-motion:reduce){.radar,.mk.criticita,.nb.criticita,.cell.criticita,.fl,.ping{animation:none!important}}

/* ═════════ HOME "Occhio di Dio" — dashboard propria (diversa dall'app Presenze) ═════════ */
body.home .mainc{height:100vh;overflow:hidden}
body.home .tb{padding:10px 26px 9px}
body.home .tb h1{font-size:23px;display:flex;align-items:center;gap:10px}
body.home .tb h1:after{display:none}
body.home .tb p{display:none}
body.home .tb h1 .live-dot{display:inline-flex;align-items:center;gap:6px;font:700 10.5px/1 var(--f);letter-spacing:.16em;color:#ff6b86;background:rgba(255,45,111,.12);border:1px solid rgba(255,45,111,.35);padding:5px 8px 4px;border-radius:7px;font-style:normal}
body.home .tb h1 .live-dot:before{content:"";width:7px;height:7px;border-radius:50%;background:#ff3b5c;animation:pl 1.6s infinite}
#mn.full{max-width:none;padding:12px 16px 14px;flex:1;min-height:0;display:flex;flex-direction:column}
#mn.full>#v{flex:1;min-height:0;display:flex;flex-direction:column}
.eye{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 360px;grid-template-rows:minmax(0,1fr) auto;gap:12px}
.mapbox{grid-column:1;grid-row:1}
.plist{grid-column:2;grid-row:1/3}

/* barra HUD dei contatori, sopra la mappa */
.hudbar{position:absolute;z-index:520;left:14px;top:14px;display:flex;gap:2px;background:rgba(4,10,34,.80);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(58,107,255,.35);border-radius:14px;padding:5px;box-shadow:0 12px 30px -10px rgba(0,0,0,.7)}
.hb{position:relative;padding:7px 14px 7px 15px;border-radius:10px;min-width:86px}
.hb:before{content:"";position:absolute;left:5px;top:9px;bottom:9px;width:3px;border-radius:3px;background:var(--hc,#3a6bff)}
.hb span{display:block;font:700 9.5px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:#8ea2d6}
.hb b{display:block;font:italic 800 26px/1.05 var(--fd);color:#fff;margin-top:3px;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.hb b em{font-size:15px;color:#8ea2d6;font-style:italic}
.hb.ok{--hc:#22d07a}.hb.er{--hc:#ff4d5e}.hb.wa{--hc:#ffb020}.hb.cr{--hc:#ff2d6f}
.hb.cr.on{background:rgba(255,45,111,.16)}.hb.cr.on b{color:#ff8fab}
.hb.cop{--hc:transparent;min-width:120px}
.hb.cop i{display:block;height:4px;border-radius:4px;background:rgba(255,255,255,.12);margin-top:5px;overflow:hidden}
.hb.cop i u{display:block;height:100%;background:var(--tri);text-decoration:none}
html.light .hudbar{background:rgba(255,255,255,.94);border-color:var(--bd2)}
html.light .hb span,html.light .hb b em{color:var(--mu)}html.light .hb b{color:var(--tx)}
html.light .hb.cop i{background:var(--bd)}

/* comandi mappa */
.fitbtn{position:absolute;z-index:520;right:12px;top:88px;width:34px;min-height:34px;padding:0}
.mapbox .rl{position:absolute;z-index:520;right:12px;bottom:46px}
.mapbox .leaflet-top.leaflet-right{top:4px;right:2px}

/* striscia del registro: una riga, al massimo due */
.ticker{grid-column:1;grid-row:2;display:flex;align-items:center;gap:12px;background:var(--sf);border:1px solid var(--bd);border-radius:12px;padding:6px 8px 6px 10px;min-height:50px;box-shadow:var(--glow)}
html.ops .ticker{background:linear-gradient(90deg,rgba(255,45,111,.06),transparent 30%),var(--sf)}
.tk-live{display:inline-flex;align-items:center;gap:6px;font:700 10px/1 var(--f);letter-spacing:.16em;text-transform:uppercase;color:#ff6b86;flex:none}
.tk-live:before{content:"";width:7px;height:7px;border-radius:50%;background:#ff3b5c;animation:pl 1.6s infinite}
.tk-lines{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;font:500 12.5px/1.35 ui-monospace,"SF Mono",Menlo,monospace}
.tk-lines .fl{display:grid;grid-template-columns:62px 72px minmax(0,1fr);gap:10px;align-items:center;padding:2px 4px;border-radius:6px;cursor:pointer;animation:slin .35s ease-out}
.tk-lines .fl:hover{background:var(--sf2)}
.tk-lines .fl:nth-child(2){opacity:.55}
.tk-lines .fl.idle{display:block;color:var(--mu);cursor:default}
.tk-lines .t{color:var(--mu)}
.tk-lines .tg{font:800 9.5px/1 var(--f);letter-spacing:.08em;text-transform:uppercase;padding:4px 6px;border-radius:5px;text-align:center;white-space:nowrap}
.tk-lines .tx{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--tx2)}
.tk-lines .tx b{color:var(--tx);font-weight:700}
.ticker .btn{flex:none}
@keyframes slin{from{opacity:0;transform:translateY(6px)}}

/* barra laterale in versione "notte" (diversa dall'app Presenze) */
html.ops .shell{background:linear-gradient(90deg,#040a24 262px,transparent 262px)}
html.ops .sb{background:var(--arch2) repeat-x left bottom/30px 40px,var(--arch) repeat-x left calc(100% - 40px)/46px 60px,
  radial-gradient(420px 300px at 50% 0%,rgba(58,107,255,.22),transparent 70%),
  linear-gradient(180deg,#0b1a4f 0%,#061136 42%,#030822 100%);border-right:1px solid rgba(58,107,255,.18)}
html.ops #nav button.on{background:linear-gradient(90deg,rgba(58,107,255,.28),rgba(58,107,255,.06));box-shadow:inset 0 0 0 1px rgba(58,107,255,.35)}
html.ops .sb .live{background:rgba(58,107,255,.10);border:1px solid rgba(58,107,255,.22);font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:11.5px;letter-spacing:.03em}

/* ═════════ LOGIN "Occhio di Dio" ═════════ */
.eyegate{position:relative;min-height:100vh;overflow:hidden;color:#fff;background:#030822}
.eg-bg{position:absolute;inset:0;background:
  linear-gradient(rgba(58,107,255,.06) 1px,transparent 1px) 0 0/40px 40px,
  linear-gradient(90deg,rgba(58,107,255,.06) 1px,transparent 1px) 0 0/40px 40px,
  radial-gradient(900px 600px at 38% 48%,rgba(30,64,190,.35),transparent 65%),
  linear-gradient(160deg,#071a52,#030822 60%)}
.eg-bg:after{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--tri)}
.eg-art{position:absolute;left:0;top:0;width:66%;height:100%}
.eg-route{stroke-dasharray:1000;stroke-dashoffset:1000;animation:draw 3.2s cubic-bezier(.6,.1,.2,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.eg-node{fill:#fff;opacity:.0;animation:node 4s ease-in-out infinite}
@keyframes node{0%,100%{opacity:.15}40%{opacity:.95}}
.eg-sweep{animation:sweep 6s linear infinite}
.eg-top{position:absolute;left:40px;top:34px;display:flex;align-items:center;gap:12px;z-index:2}
.eg-top small{display:block;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#9fb0d3}
.eg-top b{display:block;font:italic 800 22px/1.05 var(--fd);text-transform:uppercase;letter-spacing:.03em}
.eg-sys{margin-left:18px;display:inline-flex;align-items:center;gap:7px;font:700 10.5px/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:#7ff0b0;background:rgba(34,208,122,.1);border:1px solid rgba(34,208,122,.3);padding:6px 9px;border-radius:7px}
.eg-sys i{width:7px;height:7px;border-radius:50%;background:#22d07a;animation:pl 2s infinite}
.eg-title{position:absolute;left:40px;bottom:42px;z-index:2;max-width:520px}
.eg-title h2{font:italic 800 clamp(54px,6.4vw,96px)/.86 var(--fd);text-transform:uppercase;letter-spacing:.01em;margin:16px 0 12px}
.eg-title h2 span{color:transparent;background:linear-gradient(90deg,#ff8a3d,var(--or));-webkit-background-clip:text;background-clip:text;padding-right:.08em}
.eg-title p{color:#b9c6e8;font-size:15px;margin:0 0 14px;max-width:420px}
.eg-card{position:absolute;right:7vw;top:50%;transform:translateY(-50%);z-index:3;width:min(400px,calc(100vw - 40px));
  background:rgba(6,14,44,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(58,107,255,.35);border-radius:22px;padding:28px 26px 22px;
  box-shadow:0 40px 90px -20px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06)}
.eg-card:before{content:"";position:absolute;left:22px;right:22px;top:-1px;height:3px;border-radius:3px;background:var(--tri)}
.eg-card .ey{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#9fbaff;background:rgba(58,107,255,.16);padding:5px 11px;border-radius:99px}
.eg-card .ey .i{width:14px;height:14px}
.eg-card h1{font:italic 800 34px/1 var(--fd);text-transform:uppercase;letter-spacing:.01em;margin:12px 0 6px}
.eg-card .sub{color:#9fb0d3;margin:0 0 18px}
.eg-card label{color:#c9d4ec}
.eg-card input{background:rgba(3,8,34,.8);border-color:rgba(58,107,255,.4);color:#fff}
.eg-card .pwf button:hover{background:rgba(255,255,255,.08);color:#fff}
.eg-card .msg.err{color:#ff8fa3}
.eg-feat{display:grid;gap:7px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08)}
.eg-feat span{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#b9c6e8}
.eg-feat .i{color:var(--gd);width:15px;height:15px}
.eg-tm{position:absolute;right:7vw;bottom:24px;z-index:2;font:600 11px/1 ui-monospace,"SF Mono",Menlo,monospace;letter-spacing:.12em;color:#5f74ad}
@media (max-width:960px){
  .eg-art{width:100%;opacity:.45}
  .eg-title{position:relative;left:auto;bottom:auto;padding:110px 22px 0}
  .eg-title h2{font-size:56px}
  .eg-card{position:relative;right:auto;top:auto;transform:none;margin:22px auto 60px}
  .eg-top{left:22px;top:24px}.eg-sys{display:none}.eg-tm{display:none}
}

@media (max-width:1200px){.eye{grid-template-columns:minmax(0,1fr) 310px}.hb{min-width:70px;padding:6px 10px 6px 13px}.hb b{font-size:22px}}
@media (max-width:900px){
  body.home .mainc{height:auto;overflow:visible}
  .eye{display:flex;flex-direction:column}
  .mapbox{height:62vh;min-height:380px}
  .hudbar{flex-wrap:wrap;right:14px}
  .plist{max-height:70vh}
}
@media (prefers-reduced-motion:reduce){.eg-route{animation:none;stroke-dashoffset:0}.eg-sweep,.eg-node{animation:none}}

/* etichette degli eventi (striscia live e registro) */
.tg{display:inline-block;font:800 9.5px/1 var(--f);letter-spacing:.08em;text-transform:uppercase;padding:4px 6px;border-radius:5px;text-align:center;white-space:nowrap}
.tg.presidiato{background:var(--ok-soft);color:var(--ok)}
.tg.distante{background:var(--wa-soft);color:var(--wa)}
.tg.criticita{background:#ff2d6f;color:#fff}
.tg.criticita-chiusa,.tg.centrale{background:var(--ac-soft);color:var(--ac)}
.tg.centrale-scoperto,.tg.reset,.tg.reset-tutti{background:var(--er-soft);color:var(--er)}
.tg.silente{background:color-mix(in srgb,#ffd166 18%,transparent);color:#e0a800}
.tg.senzagps{background:var(--gd-soft);color:var(--gd-ink)}
.tg.import{background:var(--sf2);color:var(--mu)}

/* la mappa della centrale riempie tutto il riquadro (annulla l'altezza fissa della mappa Presenze) */
.mapbox #map{position:absolute;inset:0;height:auto;border:0;border-radius:0;z-index:0}
.mapbox .telemetry{bottom:26px}
.mapbox .rl{bottom:64px}
.eg-art{top:5%;height:64%;width:62%;left:1%}

/* ── presidio concluso (operatore andato via, uscita firmata) = blu ── */
.mk.concluso{background:#2f6fff;box-shadow:0 0 0 3px rgba(59,130,255,.28),0 2px 8px rgba(0,0,0,.5)}
.nb.concluso,.cell.concluso{background:linear-gradient(160deg,#5c9bff,#1f5fe0)}
.sw.concluso{background:#2f6fff}
.hb.bl{--hc:#5c9bff}
.bdg.bl{background:color-mix(in srgb,#3b82ff 16%,transparent);color:#3b82ff;border-color:transparent}
html.light .bdg.bl{color:#1f5fe0}
.kv b.bl{color:#5c9bff}html.light .kv b.bl{color:#1f5fe0}
.note.bl{background:color-mix(in srgb,#3b82ff 12%,transparent);border-color:color-mix(in srgb,#3b82ff 35%,transparent)}
.note.bl .i{color:#5c9bff}
.tg.uscita,.tg.centrale-uscita{background:color-mix(in srgb,#3b82ff 18%,transparent);color:#6aa2ff}
html.light .tg.uscita,html.light .tg.centrale-uscita{color:#1f5fe0}
.tg.compenso{background:var(--gd-soft);color:var(--gd-ink)}
.kpi .k-bl{--k:#3b82ff}

/* ── Compensi ── */
.kpi.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
.comp-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;padding:0;overflow:hidden}
.comp-top>div{padding:20px 22px;min-width:0}
.comp-top .ct-rate{border-right:1px solid var(--bd);display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.comp-top h2{margin:0}
.comp-top .sub{margin:6px 0 14px}
.rate{display:flex;align-items:baseline;gap:8px}
.rate span{font:italic 800 30px/1 var(--fd);color:var(--mu)}
.rate input{width:130px;font:italic 800 44px/1 var(--fd)!important;padding:4px 12px!important;min-height:0!important;text-align:right;letter-spacing:.01em}
.rate em{font-style:normal;color:var(--mu);font-weight:600}
.ctw{max-height:calc(100vh - 300px);overflow:auto}
.ctab thead th{position:sticky;top:0;z-index:1;background:var(--sf)}
.ctab th.r,.ctab td.r{text-align:right}
.ctab td{vertical-align:middle}
.ctab tr.open td{background:color-mix(in srgb,var(--ok) 5%,transparent)}
.ctab small{display:block;font-size:11.5px;color:var(--mu);margin-top:3px;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ctab .ci{background:transparent;border:1px solid transparent;border-radius:9px;padding:6px 8px;min-height:0;font:inherit;color:var(--tx);width:100%;transition:border-color .12s,background .12s}
.ctab .ci:hover{border-color:var(--bd);background:var(--sf2)}
.ctab .ci:focus{border-color:var(--ac);background:var(--sf);outline:none;box-shadow:0 0 0 3px var(--ac-soft)}
.ctab .ci.nm{font-weight:600;min-width:180px}
.ctab .ci.num{width:82px;text-align:right;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.ctab .ci.num::-webkit-inner-spin-button{opacity:.4}
.ctab .ci.pers{color:var(--gd-ink);font-weight:700}
.cin{display:inline-flex;align-items:center;gap:4px;justify-content:flex-end}
.cin>i,.cin .rs{width:24px;height:24px;display:grid;place-items:center;flex:none;color:var(--mu)}
.cin .rs{border:0;background:var(--sf2);border-radius:7px;cursor:pointer;color:var(--gd-ink)}
.cin .rs:hover{background:var(--gd-soft)}
.cin .i{width:14px;height:14px}
.ctab .eur{font:italic 700 19px/1 var(--fd);letter-spacing:.01em;white-space:nowrap}
.ctab tfoot td{border-top:2px solid var(--gd);background:var(--sf2);font-size:14px;padding-top:12px;padding-bottom:12px}
.nbb{width:36px;height:36px;border:0;border-radius:10px;display:grid;place-items:center;font:italic 800 15px/1 var(--fd);color:#fff;cursor:pointer}
.nbb.confermato{background:linear-gradient(160deg,#2be08a,#0f9a55)}
.nbb.concluso{background:linear-gradient(160deg,#5c9bff,#1f5fe0)}
.live-t{color:var(--ok);font-weight:700;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em}
.nbb.del-turno{background:transparent;border:1.5px solid var(--bd);color:var(--tx2);width:30px;height:30px;border-radius:8px;transition:background .15s,color .15s,border-color .15s}
.nbb.del-turno:hover{background:#fee2e2;border-color:#fca5a5;color:#dc2626}
.nbb.del-turno .i{width:14px;height:14px}
@media (max-width:1100px){.kpi.k4{grid-template-columns:repeat(2,minmax(0,1fr))}.comp-top{grid-template-columns:1fr}.comp-top .ct-rate{border-right:0;border-bottom:1px solid var(--bd)}}

/* ── logo Verona Run Events ─────────────────────── */
.vre{display:block;height:auto;width:auto;max-width:100%;object-fit:contain;image-rendering:auto}
.sb .brand .vre-sb{height:34px;width:auto;flex:none}
.eg-top .vre-sm{height:30px;width:auto;flex:none}
.vre-login{display:flex;justify-content:center;margin:0 0 18px}
.vre-login .vre-lg{height:auto;width:min(70%,260px)}
@media (max-width:760px){.sb .brand .vre-sb{height:26px}}
/* ── tabelle che crescono con la pagina + ordinamento ── */
.tw.grow{overflow:visible;max-height:none}
.tw.grow table{min-width:100%}
.tw.grow th{top:0}
@media (max-width:760px){.tw.grow{overflow-x:auto;overflow-y:visible}.tw.grow th{position:static}}
th.srt{cursor:pointer;user-select:none;white-space:nowrap}
th.srt:hover{color:var(--tx)}
th.srt i{font-style:normal;margin-left:5px;opacity:.45;font-size:11px}
th.srt.on{color:var(--ac)}th.srt.on i{opacity:1}
.kpi.k6{grid-template-columns:repeat(6,minmax(0,1fr))}
.kpi .k-cr{--k:#ff2d6f}.kpi .k-er{--k:#e3263d}
@media (max-width:1400px){.kpi.k6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.kpi.k6{grid-template-columns:repeat(2,minmax(0,1fr))}}
.osort{display:flex;align-items:center;gap:8px;margin:0 4px 8px;font-size:12px;color:var(--mu)}
.osort select{flex:1;min-height:32px;padding:4px 8px;font-size:13px}
/* ── schermata licenza ──────────────────────────── */
body.lic-body{margin:0;background:linear-gradient(160deg,#1a3cb8 0%,#0b1b57 55%,#060d2e 100%);color:#e2e8f0;font-family:var(--f,system-ui,sans-serif);min-height:100vh}
.lic{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:32px 20px}
.lic-box{width:min(560px,100%);background:rgba(15,26,62,.92);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:34px 32px;text-align:center;box-shadow:0 24px 60px -20px rgba(0,0,0,.6)}
.lic-box .vre-md{height:auto;width:min(60%,220px);margin:0 auto 22px}
.lic-ic{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:rgba(245,158,11,.16);color:#f59e0b;margin:0 auto 14px}
.lic-ic svg{width:28px;height:28px}
.lic h1{font-size:24px;font-weight:800;margin:0 0 10px;color:#fff}
.lic h2{font-size:18px;font-weight:800;margin:0 0 10px;color:#fff;display:flex;align-items:center;justify-content:center;gap:8px}
.lic h2 svg{width:20px;height:20px}
.lic-p{color:#b9c6e4;margin:0 0 20px;line-height:1.5;font-size:14.5px}
.lic label{display:block;text-align:left;font-size:13px;color:#9fb0d3;margin:0 0 6px}
.lic textarea,.lic input{width:100%;box-sizing:border-box;padding:11px 14px;background:#1a2a54;border:1px solid #2a4280;border-radius:12px;color:#fff;font-size:14px;font-family:ui-monospace,Menlo,monospace;letter-spacing:.04em;resize:vertical}
.lic .pwf{position:relative}.lic .pwf input{font-family:inherit;letter-spacing:.2em;padding-right:46px}
.lic .pwf button{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:transparent;border:0;color:#9fb0d3;cursor:pointer;width:36px;height:36px;display:grid;place-items:center}
.lic .pwf button svg{width:20px;height:20px}
.lic-err{color:#ff8a9a;font-size:13px;min-height:20px;margin:8px 0 6px;text-align:left}
.lic-err.ok{color:#43e08f}
.lic-btn{width:100%;padding:13px;background:#2f6fff;border:0;border-radius:12px;color:#fff;font-size:15.5px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.lic-btn svg{width:18px;height:18px}
.lic-btn:hover{background:#1f5ae6}.lic-btn:disabled{opacity:.6;cursor:default}
.lic-btn.sec{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18)}.lic-btn.sec:hover{background:rgba(255,255,255,.16)}
.lic-cap{font-size:12px;color:#8597c2;margin:14px 0 0;line-height:1.45}
.lic-foot{font-size:12px;color:#5f6f99;margin:0}
.lic-exp{border-color:rgba(255,255,255,.08)}
@media (max-width:760px){#lseg,#cseg,#opseg{display:flex;flex-wrap:wrap;width:100%;max-width:100%}#lseg button,#cseg button,#opseg button{flex:1 1 42%;justify-content:center}}
