/* NSAIT Map — fullscreen tactical (aligned with site tokens) */
:root{
  --bg: #07090c;
  --bg-elev: #0c1016;
  --bg-panel: #10151d;
  --border: #1e2633;
  --border-strong: #2a3548;
  --text: #d7dde8;
  --text-dim: #8b95a8;
  --muted: #5c677a;
  --accent: #f05a28;
  --cyan: #00d1ff;
  --cyan-dim: rgba(0,209,255,.12);
  --accent-dim: rgba(240,90,40,.12);
  --panel: rgba(12,16,22,.92);
  --signal: #C45C26;
  --ok: #2F6F5E;
  --warn: #e0b040;
  --radius: 0px;
  --font: "IBM Plex Sans", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
}

*,*::before,*::after{box-sizing:border-box}
html,body.map-tactical{
  margin:0;padding:0;height:100%;width:100%;overflow:hidden;
  background:var(--bg);color:var(--text);
  font-family:var(--font);-webkit-font-smoothing:antialiased
}
.mono{font-family:var(--mono)}
.map-app{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;background:var(--bg)}
#map{position:absolute;inset:0;z-index:0;background:#05080c}
.leaflet-container{background:#05080c;font:inherit}
.leaflet-control-attribution{background:rgba(7,9,12,.75)!important;color:var(--muted)!important;font-size:10px!important}
.leaflet-control-attribution a{color:var(--text-dim)!important}
.leaflet-popup-content-wrapper{
  background:var(--bg-panel);color:var(--text);
  border:1px solid var(--border-strong);border-radius:var(--radius);
  box-shadow:none
}
.leaflet-popup-tip{background:var(--bg-panel)}
.leaflet-popup-content{margin:10px 12px;font-size:12px;line-height:1.4}
.popup-title{font-weight:600;color:var(--cyan);margin-bottom:4px}
.popup-body{opacity:.9;color:var(--text-dim)}
.popup-why{font-size:10px;letter-spacing:.04em;color:var(--muted)}

.map-hud-top{
  position:absolute;top:0;left:0;right:0;z-index:800;
  display:flex;align-items:center;gap:.75rem;
  padding:.5rem .85rem;padding-top:max(.5rem,env(safe-area-inset-top));
  min-height:44px;
  background:linear-gradient(180deg,rgba(7,9,12,.92),rgba(7,9,12,.4) 75%,transparent);
  border-bottom:1px solid transparent;
  pointer-events:none;
}
.map-hud-top>*{pointer-events:auto}
.map-brand{display:flex;align-items:center;flex-shrink:0}
.map-brand img{display:block;height:26px;width:auto}
.map-hud-meta{
  flex:1;min-width:0;font-size:10px;letter-spacing:.14em;
  color:var(--cyan);opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.map-hud-meta .sep{opacity:.4;margin:0 .35rem;color:var(--muted)}
.map-hud-nav{display:flex;gap:.7rem;font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-family:var(--mono)}
.map-hud-nav a{color:var(--text-dim);text-decoration:none}
.map-hud-nav a:hover,.map-hud-nav a[aria-current="page"]{color:var(--accent)}
.map-icon-btn{
  appearance:none;border:1px solid var(--border-strong);background:var(--bg-panel);color:var(--cyan);
  font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;
  padding:.4rem .6rem;cursor:pointer;border-radius:var(--radius);
}
.map-icon-btn:hover{border-color:var(--cyan);background:var(--cyan-dim)}
.map-nav-toggle,#btn-layers{display:none}

.map-mobile-nav{
  display:none;position:absolute;top:48px;right:.75rem;z-index:850;
  background:var(--panel);border:1px solid var(--border-strong);
  padding:.45rem;min-width:160px;flex-direction:column;gap:.1rem;
}
.map-mobile-nav.is-open{display:flex}
.map-mobile-nav a{
  color:var(--text-dim);text-decoration:none;padding:.4rem .5rem;
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-family:var(--mono)
}
.map-mobile-nav a:hover,.map-mobile-nav a[aria-current]{color:var(--accent)}

.map-panel{
  position:absolute;top:52px;left:.85rem;bottom:48px;z-index:700;
  width:min(300px,calc(100vw - 1.5rem));
  background:var(--panel);border:1px solid var(--border-strong);
  border-radius:var(--radius);
  display:flex;flex-direction:column;overflow:hidden;
  transition:transform .2s ease,opacity .2s ease;
}
.panel-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:.6rem .7rem .3rem;border-bottom:1px solid var(--border)
}
.panel-title{margin:0;font-size:11px;letter-spacing:.16em;color:var(--cyan);font-weight:600}
.panel-close{display:none;padding:.2rem .45rem;font-size:16px;line-height:1}
.panel-section{padding:.5rem .7rem;flex:1;min-height:0;overflow:auto}
.panel-subtitle{margin:0 0 .2rem;font-size:10px;letter-spacing:.14em;color:var(--cyan)}
.panel-hint{margin:0 0 .45rem;font-size:9px;color:var(--muted)}
.panel-foot{
  margin:0;padding:.4rem .7rem;font-size:9px;color:var(--muted);
  border-top:1px solid var(--border);line-height:1.35
}

.layer-toggles{
  padding:.3rem .7rem .5rem;display:flex;flex-direction:column;gap:.12rem;
  border-bottom:1px solid var(--border)
}
.layer-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.3rem 0;cursor:pointer;user-select:none}
.layer-row input{position:absolute;opacity:0;pointer-events:none}
.layer-label{font-size:12px;color:var(--text-dim);letter-spacing:.03em}
.layer-count{color:var(--muted);font-family:var(--mono);font-size:10px;margin-left:.35rem}
.toggle{
  width:34px;height:16px;border-radius:0;background:var(--bg);
  border:1px solid var(--border-strong);position:relative;flex-shrink:0;transition:.15s
}
.toggle::after{
  content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;
  background:var(--muted);transition:.15s
}
.layer-row input:checked + .toggle{background:rgba(0,209,255,.15);border-color:var(--cyan)}
.layer-row input:checked + .toggle::after{left:20px;background:var(--cyan)}

.pin-list{list-style:none;margin:0;padding:0}
.pin-list li{margin:0;border-bottom:1px solid var(--border)}
.pin-list button{
  width:100%;text-align:left;background:transparent;border:0;color:inherit;
  padding:.5rem .1rem;cursor:pointer;font:inherit;
}
.pin-list button:hover{background:rgba(240,90,40,.06)}
.pin-title{font-size:12px;font-weight:500;display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}
.pin-meta{font-size:10px;color:var(--muted);font-family:var(--mono);margin-top:.12rem}
.sev-badge{font-size:9px;letter-spacing:.06em;text-transform:uppercase;padding:.1rem .3rem;border-radius:var(--radius);border:1px solid}
.sev-high{color:#ffb090;border-color:var(--signal);background:rgba(196,92,38,.2)}
.sev-medium{color:#9ec4ff;border-color:var(--border-strong);background:rgba(61,79,102,.2)}
.sev-low{color:var(--muted);border-color:var(--border);background:rgba(255,255,255,.04)}
.conf-badge,.layer-chip-static{
  font-size:9px;letter-spacing:.05em;padding:.1rem .3rem;
  border:1px solid rgba(0,209,255,.3);color:var(--cyan);border-radius:var(--radius)
}

.signal-drawer{
  position:absolute;top:52px;right:.85rem;bottom:48px;z-index:750;
  width:min(340px,calc(100vw - 1.5rem));
  background:var(--panel);border:1px solid var(--border-strong);border-left:2px solid var(--accent);
  border-radius:var(--radius);padding:0;overflow:auto;
  transform:translateX(110%);opacity:0;pointer-events:none;transition:transform .2s ease,opacity .2s ease;
}
.signal-drawer.is-open{transform:none;opacity:1;pointer-events:auto}
.drawer-header{display:flex;justify-content:space-between;gap:.5rem;padding:.7rem;border-bottom:1px solid var(--border)}
.drawer-eyebrow{margin:0;font-size:10px;letter-spacing:.12em;color:var(--cyan);font-family:var(--mono)}
.drawer-title{margin:.15rem 0 0;font-size:1rem;font-weight:600;line-height:1.25;text-transform:none;letter-spacing:0}
.drawer-close{
  appearance:none;border:1px solid var(--border-strong);background:transparent;
  color:var(--cyan);width:30px;height:30px;font-size:16px;cursor:pointer;border-radius:var(--radius)
}
.drawer-close:hover{border-color:var(--accent);color:var(--accent)}
.drawer-meta{display:flex;flex-wrap:wrap;gap:.3rem;padding:.5rem .7rem}
.drawer-block{padding:.4rem .7rem .65rem}
.drawer-block strong{
  display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cyan);margin-bottom:.2rem;font-family:var(--mono)
}
.drawer-block p{margin:0;font-size:13px;line-height:1.45;color:var(--text-dim)}
.drawer-sources{margin:.2rem 0 0;padding-left:1.1rem;font-size:12px;color:var(--text-dim)}
.drawer-sources a,.drawer-block a{color:var(--cyan)}

.map-hud-bottom{
  position:absolute;left:0;right:0;bottom:0;z-index:800;
  display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:.35rem .85rem;padding-bottom:max(.35rem,env(safe-area-inset-bottom));
  background:rgba(7,9,12,.9);border-top:1px solid var(--border);
  font-size:11px;
}
.coords{color:var(--cyan);letter-spacing:.06em;font-weight:500;min-width:11rem}
.status{flex:1;color:var(--muted);min-width:10rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.status-pips{display:flex;gap:.4rem;flex-wrap:wrap}
.pip{opacity:.45;letter-spacing:.08em;font-size:10px;color:var(--text-dim)}
.pip::before{
  content:"";display:inline-block;width:5px;height:5px;
  background:var(--border-strong);margin-right:.28rem;vertical-align:middle
}
.pip.on{opacity:1;color:var(--text)}
.pip.on::before{background:var(--cyan);box-shadow:0 0 5px var(--cyan)}


/* ——— HOT MESSAGES flow (Shadowbroker-style desk feed) ——— */
.hot-flow{
  position:absolute;right:.85rem;bottom:48px;z-index:720;
  width:min(300px,calc(100vw - 1.5rem));
  max-height:min(340px,42vh);
  display:flex;flex-direction:column;
  background:var(--panel);border:1px solid var(--border-strong);
  border-top:2px solid var(--accent);border-radius:var(--radius);
  pointer-events:auto;
  box-shadow:0 8px 28px rgba(0,0,0,.45);
}
.hot-flow-head{
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.45rem .65rem;border-bottom:1px solid var(--border);flex-shrink:0
}
.hot-flow-title{
  margin:0;font-size:11px;letter-spacing:.16em;color:var(--accent);font-weight:600
}
.hot-flow-tag{
  font-size:9px;letter-spacing:.1em;color:var(--cyan);opacity:.85
}
.hot-flow-list{
  flex:1;min-height:0;overflow:auto;
  padding:.2rem 0;
  scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent
}
.hot-row{
  display:block;width:100%;text-align:left;
  background:transparent;border:0;border-bottom:1px solid var(--border);
  color:inherit;cursor:pointer;font:inherit;
  padding:.45rem .65rem;transition:background .15s
}
.hot-row:hover{background:var(--accent-dim)}
.hot-row.is-flash{background:rgba(240,90,40,.18);animation:hotFlash .9s ease}
@keyframes hotFlash{
  0%{background:rgba(0,209,255,.22)}
  100%{background:transparent}
}
.hot-row-top{
  display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;
  font-family:var(--mono);font-size:9px;letter-spacing:.06em;color:var(--muted);
  margin-bottom:.15rem
}
.hot-row-ts{color:var(--cyan)}
.hot-row-sev{
  font-size:8px;letter-spacing:.08em;text-transform:uppercase;
  padding:.05rem .25rem;border:1px solid var(--border-strong);color:var(--text-dim)
}
.hot-row-sev.sev-high{color:#ffb090;border-color:var(--signal);background:rgba(196,92,38,.2)}
.hot-row-sev.sev-medium{color:#9ec4ff;border-color:var(--border-strong)}
.hot-row-sev.sev-low{color:var(--muted)}
.hot-row-layer{color:var(--cyan)}
.hot-row-label{
  font-size:12px;font-weight:500;color:var(--text);line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
.hot-row-prefix{color:var(--accent);font-family:var(--mono);font-size:10px;letter-spacing:.08em;margin-right:.25rem}
.map-app:has(#signal-drawer.is-open) .hot-flow{opacity:.28;pointer-events:none}

@media (max-width:900px){
  .hot-flow{
    left:0;right:0;bottom:42px;width:100%;max-height:28vh;
    border-left:0;border-right:0;border-radius:0;
    z-index:710;
  }
  .map-app:has(.map-panel.is-open) .hot-flow{display:none}
}
@media (prefers-reduced-motion:reduce){
  .hot-row.is-flash{animation:none;background:var(--accent-dim)}
}

.nsait-pin{border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.5)}
.nsait-pin.sev-high{box-shadow:0 0 8px rgba(196,92,38,.75),0 0 0 1px rgba(255,255,255,.2)}

@media (max-width:900px){
  .map-hud-nav,.map-hud-meta{display:none}
  .map-nav-toggle,#btn-layers{display:inline-flex}
  .map-panel{
    top:auto;left:0;right:0;bottom:42px;width:100%;max-height:55vh;
    border-radius:0;transform:translateY(110%);opacity:0;pointer-events:none;
  }
  .map-panel.is-open{transform:none;opacity:1;pointer-events:auto}
  .panel-close{display:inline-flex}
  .signal-drawer{
    top:auto;left:0;right:0;bottom:42px;width:100%;max-height:60vh;
    border-radius:0;transform:translateY(110%);border-left:1px solid var(--border-strong);border-top:2px solid var(--accent)
  }
  .signal-drawer.is-open{transform:none}
  .map-hud-bottom{gap:.3rem}
  .status{order:3;width:100%;white-space:normal}
}
@media (min-width:901px){
  .map-panel.is-open,.map-panel{transform:none;opacity:1;pointer-events:auto}
}

/* ——— Regional ALERT strip (map HUD) ——— */
.status-strip{
  position:absolute;top:0;left:0;right:0;z-index:900;
  background:rgba(12,16,22,.94);
  border-bottom:1px solid var(--border);
  font-family:var(--mono);font-size:0.65rem;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);
  padding:0.32rem 0;pointer-events:none
}
.status-strip .wrap{
  display:flex;gap:1rem;align-items:center;flex-wrap:wrap;
  width:min(100% - 1.7rem, 1200px);margin-inline:auto;pointer-events:auto
}
.status-strip .live{color:var(--cyan)}
.status-strip .live::before{
  content:"";display:inline-block;width:6px;height:6px;background:var(--cyan);
  margin-right:0.4rem;vertical-align:middle;box-shadow:0 0 6px var(--cyan)
}
.status-strip .alert-mount{display:inline-flex;align-items:center;gap:0.55rem;flex-wrap:wrap;max-width:min(100%,42rem)}
.status-strip .alert-chip{
  display:inline-flex;align-items:center;gap:0.35rem;font-weight:600;letter-spacing:0.12em;
  padding:0.12rem 0.45rem;border:1px solid var(--border-strong);
  background:rgba(16,21,29,.85);color:var(--text-dim)
}
.status-strip .alert-dot{width:7px;height:7px;flex-shrink:0;background:var(--muted)}
.status-strip .alert-reason{
  font-size:0.62rem;letter-spacing:0.06em;text-transform:none;color:var(--text-dim);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:28rem
}
.status-strip.alert-green .alert-chip,.status-strip .alert-chip.alert-green{color:#5ecf9a;border-color:rgba(94,207,154,.35)}
.status-strip.alert-green .alert-dot,.status-strip .alert-chip.alert-green .alert-dot{background:#3d9b7a;box-shadow:0 0 7px rgba(61,155,122,.75)}
.status-strip.alert-yellow .alert-chip,.status-strip .alert-chip.alert-yellow{color:#e0b040;border-color:rgba(224,176,64,.4)}
.status-strip.alert-yellow .alert-dot,.status-strip .alert-chip.alert-yellow .alert-dot{background:#e0b040;box-shadow:0 0 7px rgba(224,176,64,.7)}
.status-strip.alert-orange .alert-chip,.status-strip .alert-chip.alert-orange{color:#f08a3a;border-color:rgba(240,90,40,.45)}
.status-strip.alert-orange .alert-dot,.status-strip .alert-chip.alert-orange .alert-dot{background:#f05a28;box-shadow:0 0 7px rgba(240,90,40,.75)}
.status-strip.alert-red .alert-chip,.status-strip .alert-chip.alert-red{color:#ff6b6b;border-color:rgba(224,64,64,.5)}
.status-strip.alert-red .alert-dot,.status-strip .alert-chip.alert-red .alert-dot{background:#e04040;box-shadow:0 0 8px rgba(224,64,64,.85)}
.map-app.has-alert-strip .map-hud-top{top:1.55rem}
.map-app.has-alert-strip .map-mobile-nav{top:calc(1.55rem + 2.6rem)}
@media (max-width:640px){
  .status-strip .alert-reason{max-width:10rem}
}

/* Nav fix (2026-10-18): keep the ALERT strip to one line so it never covers the HUD header / menu */
.status-strip .wrap{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}
.status-strip .alert-mount{flex-wrap:nowrap;min-width:0;flex:0 1 auto}
.status-strip .alert-chip{flex-shrink:0}
.status-strip .alert-reason{min-width:0;flex:1 1 auto}
.map-app.has-alert-strip .map-hud-top{top:2rem}
.map-app.has-alert-strip .map-mobile-nav{top:calc(2rem + 2.9rem)}
.map-app.has-alert-strip .map-panel{top:calc(2rem + 48px)}
.map-hud-nav{font-size:.68rem;gap:1rem;flex-shrink:0}
.map-brand{text-decoration:none}
.map-brand-wordmark{font-family:var(--mono);font-weight:600;font-size:1.45rem;line-height:26px;letter-spacing:.16em;text-transform:uppercase;color:var(--text)}
.map-app.has-alert-strip .leaflet-top.leaflet-left{top:calc(2rem + 38px);left:calc(.85rem + 300px)}
@media (max-width:900px){
  .status-strip .wrap>span:not(.alert-mount):not(.live){display:none}
  .map-app.has-alert-strip .leaflet-top.leaflet-left{left:0}
  .status-strip .alert-reason{max-width:none}
  #btn-layers{margin-left:auto}
  .map-app.has-alert-strip .map-panel{top:auto}
}