/* V2 — Command-K Power User
   Bloomberg Terminal × Linear. Map fills 95% of canvas.
   Mono-forward typography. One accent (signal green).
   Sidebar hidden by default, opens as left drawer (Layers).
   Search via ⌘K command palette overlay.
*/

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

:root{
  --bg:        oklch(13% 0.015 250);
  --panel:     oklch(17% 0.02 250);
  --panel2:    oklch(21% 0.025 250);
  --panel3:    oklch(26% 0.028 250);
  --rule:      oklch(35% 0.018 250 / 0.6);
  --rule-soft: oklch(35% 0.018 250 / 0.25);
  --text:      oklch(94% 0.005 250);
  --muted:     oklch(60% 0.015 250);
  --dim:       oklch(45% 0.015 250);
  --accent:    oklch(75% 0.16 145);     /* signal green */
  --accent-bg: oklch(75% 0.16 145 / 0.12);
  --accent-2:  oklch(85% 0.10 145);
  --alarm:     oklch(72% 0.18 35);
  --alarm-bg:  oklch(72% 0.18 35 / 0.14);
  --s3-col:    oklch(82% 0.15 90);
  --s4-col:    oklch(70% 0.18 295);
  --s5-col:    oklch(64% 0.20 32);

  --font-head: 'Inter Tight','Geist',system-ui,sans-serif;
  --font-body: 'Inter Tight','Geist',system-ui,sans-serif;
  --font-mono: 'Geist Mono','JetBrains Mono',ui-monospace,monospace;

  --shadow-pop: 0 6px 24px oklch(0% 0 0 / 0.6);
  --r-md: 8px;
  --r-lg: 14px;
}

html,body{height:100%;height:100svh;height:var(--app-vh, 100svh);background:var(--bg);color:var(--text);font-family:var(--font-mono);font-size:clamp(13px,0.9vw,17px);overflow:hidden;font-weight:500;overscroll-behavior:none;}

/* nav */
.site-nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:oklch(13% 0.015 250 / 0.92);border-bottom:1px solid var(--rule-soft);overflow:visible;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}
.nav-inner{max-width:1400px;margin:0 auto;padding:0 20px;height:56px;display:flex;align-items:center;gap:4px;overflow:visible;}
.nav-links{display:flex;align-items:center;gap:2px;flex:1;min-width:0;flex-wrap:nowrap;}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:18px;flex-shrink:0;}
.nav-logo-box{width:32px;height:32px;border-radius:6px;background:var(--panel2);border:1px solid var(--rule);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:600;font-size:.7rem;color:var(--accent);}
.nav-logo-text{display:flex;flex-direction:column;line-height:1;}
.nav-logo-text strong{font-family:var(--font-mono);font-weight:600;font-size:.84rem;color:var(--text);letter-spacing:0;}
.nav-logo-text small{font-family:var(--font-mono);font-size:.56rem;color:var(--muted);letter-spacing:1.4px;margin-top:3px;}
.nav-link{font-family:var(--font-mono);font-weight:500;font-size:.76rem;color:var(--text);text-decoration:none;padding:7px 11px;border-radius:6px;transition:background .15s,color .15s;white-space:nowrap;}
.nav-link:hover,.nav-link.active{background:var(--accent-bg);color:var(--accent);}
.nav-link.s3:hover{color:var(--s3-col);background:oklch(82% 0.15 90 / .08);}
.nav-link.s4:hover{color:var(--s4-col);background:oklch(70% 0.18 295 / .08);}
.nav-link.s5:hover{color:var(--s5-col);background:oklch(64% 0.20 32 / .08);}
.nav-dropdown{position:relative;display:flex;align-items:center;}
.nav-dropdown-menu{display:none;position:absolute;top:calc(100% + 6px);left:0;background:var(--panel2);border:1px solid var(--rule);border-radius:10px;padding:6px 0;min-width:220px;z-index:500;box-shadow:var(--shadow-pop);}
.nav-dropdown-menu::before{content:'';position:absolute;top:-10px;left:0;right:0;height:10px;}
@media(min-width:901px){.nav-dropdown:hover .nav-dropdown-menu{display:block;}}
.nav-dropdown.open .nav-dropdown-menu{display:block;}
.nav-dropdown-menu a{display:block;padding:10px 16px;font-family:var(--font-mono);font-size:.78rem;color:var(--text);text-decoration:none;transition:background .15s;border-bottom:1px solid var(--rule-soft);font-weight:500;}
.nav-dropdown-menu a:last-child{border-bottom:none;}
.nav-dropdown-menu a:hover{background:var(--accent-bg);color:var(--accent);}
.nav-hamburger{display:none;background:var(--panel2);border:1px solid var(--rule);color:var(--text);border-radius:6px;padding:6px 11px;cursor:pointer;margin-left:auto;font-size:1.1rem;line-height:1;}
.lang-dropdown{position:relative;margin-left:auto;}
.lang-current{font-family:var(--font-mono);font-size:.68rem;background:var(--panel2);border:1px solid var(--rule);color:var(--text);padding:6px 11px;border-radius:6px;cursor:pointer;letter-spacing:.5px;}
.lang-menu{display:none;position:absolute;right:0;top:calc(100% + 6px);background:var(--panel2);border:1px solid var(--rule);border-radius:10px;padding:6px 0;z-index:300;min-width:110px;box-shadow:var(--shadow-pop);}
.lang-dropdown:hover .lang-menu,.lang-dropdown.open .lang-menu{display:block;}
.lang-opt{display:block;width:100%;padding:8px 18px;background:none;border:none;color:var(--text);font-family:var(--font-mono);font-size:.78rem;cursor:pointer;text-align:left;font-weight:500;}
.lang-opt:hover{background:var(--accent-bg);color:var(--accent);}
[data-lang="en"] .lang-de,[data-lang="en"] .lang-fr,
[data-lang="de"] .lang-en,[data-lang="de"] .lang-fr,
[data-lang="fr"] .lang-en,[data-lang="fr"] .lang-de{display:none;}
@media(max-width:900px){
  .nav-hamburger{display:block;}
  .nav-links{display:none;}
  .nav-links.mobile-open{display:flex;flex-direction:column;align-items:flex-start;flex-wrap:nowrap;gap:0;position:fixed;top:54px;left:0;right:0;bottom:0;background:oklch(13% 0.015 250 / 0.98);padding:12px 0;z-index:99999;overflow-y:auto;-webkit-overflow-scrolling:touch;backdrop-filter:blur(20px);}
  body.nav-open{overflow:hidden;}
  .nav-links.mobile-open .nav-link{padding:13px 24px;width:100%;border-radius:0;border-bottom:1px solid var(--rule-soft);font-size:.9rem;}
}

/* ─── MAP SHELL ───────────────────────────────────── */
.map-shell{position:fixed;top:54px;left:0;right:0;height:calc(100vh - 54px);height:calc(100svh - 54px);height:calc(var(--app-vh, 100svh) - 54px);background:var(--bg);overflow:hidden;}
.canvas-area{position:absolute;inset:0;}
.map-wrap{position:absolute;inset:0;overflow:hidden;background:var(--bg);}
#cv{position:absolute;top:0;left:0;display:block;cursor:crosshair;}
#cv.drag{cursor:grabbing;}

/* ─── STATUS BAR top ─────────────────────────────── */
.status-bar{
  position:absolute; top:0; left:0; right:0; z-index:40;
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 18px;
  background:linear-gradient(180deg, oklch(13% 0.015 250 / 0.92), oklch(13% 0.015 250 / 0));
  pointer-events:none;
}
.status-bar > *{pointer-events:auto;}
.sb-left{
  display:flex; align-items:center; gap:11px;
  font-family:var(--font-mono); font-size:.74rem; font-weight:500;
  color:var(--muted);
  background:var(--panel); border:1px solid var(--rule);
  padding:6px 14px 6px 12px; border-radius:var(--r-md);
}
.live-dot{
  width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 8px var(--accent);
  flex-shrink:0;
}
.sb-stat{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:1px; line-height:1.15;
}
.sb-stat-srv{
  font-family:var(--font-mono); font-weight:600; font-size:.78rem;
  color:var(--accent); letter-spacing:.5px;
}
.sb-stat-count{
  font-family:var(--font-mono); font-weight:500; font-size:.62rem;
  color:var(--muted); letter-spacing:.3px;
  display:flex; align-items:center; gap:6px;
}
/* Hide the kingdom-breakdown spans JS injects after the player count */
.sb-stat-count span{display:none !important;}
.sb-stat-count::first-line{ /* keep first line visible */ }
.sb-sep{display:none;}

.sb-right{display:flex;align-items:center;gap:8px;}

.mode-tabs{
  display:inline-flex; gap:0;
  background:var(--panel); border:1px solid var(--rule);
  border-radius:var(--r-md); padding:2px;
}
.mode-tab{
  background:transparent; border:0; cursor:pointer;
  font-family:var(--font-mono); font-weight:500; font-size:.7rem;
  color:var(--muted); padding:6px 12px; border-radius:6px;
  transition:color .18s, background .18s;
  letter-spacing:.5px;
}
.mode-tab:hover{color:var(--text);}
.mode-tab.active{background:var(--panel2);color:var(--accent);}

.icon-btn{
  height:34px; min-width:34px; padding:0 10px;
  background:var(--panel); border:1px solid var(--rule);
  color:var(--text); border-radius:var(--r-md);
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  cursor:pointer;
  font-family:var(--font-mono); font-size:.7rem; font-weight:500;
  letter-spacing:.3px; white-space:nowrap;
  transition:background .15s, color .15s;
}
.icon-btn:hover{background:var(--panel2);color:var(--accent);}
.icon-btn#btn-refresh{color:var(--accent);}

/* server dropdown inside status bar */
.cs-wrap{position:relative;display:inline-block;}
.cs-cur{cursor:pointer;color:var(--accent);font-weight:600;letter-spacing:.5px;padding:0 2px;}
.cs-cur::after{content:' ▾';color:var(--muted);font-size:9px;}
.cs-opts{display:none;position:absolute;top:calc(100% + 8px);left:-8px;min-width:140px;background:var(--panel2);border:1px solid var(--rule);border-radius:var(--r-md);padding:4px;z-index:200;box-shadow:var(--shadow-pop);}
.cs-wrap.open .cs-opts{display:block;}
.cs-opt{padding:7px 12px;font-family:var(--font-mono);font-weight:500;font-size:.74rem;color:var(--text);cursor:pointer;white-space:nowrap;border-radius:5px;}
.cs-opt:hover{background:var(--accent-bg);color:var(--accent);}
.cs-opt.sel{color:var(--accent);}

/* mission filters live inside the mission-list-panel header */
.mlp-filters{
  display:none; gap:6px; align-items:center;
  padding:8px 10px;
  border-bottom:1px solid var(--rule-soft);
  background:var(--panel);
}
body.mode-mission .mlp-filters{display:flex !important;}
.mf-select{
  flex:1; min-width:0;
  font-family:var(--font-mono); font-weight:500; font-size:.7rem;
  padding:6px 10px; border-radius:6px;
  border:1px solid var(--rule);
  background:var(--panel2); color:var(--text);
  cursor:pointer; outline:none;
}
.mf-select:hover,.mf-select:focus{background:var(--panel3);color:var(--accent);border-color:var(--accent);}

body.mode-mission .server-only{display:none !important;}

/* ─── COMMAND PILL bottom-center ──────────────────── */
.cmd-pill{
  position:absolute; bottom:calc(24px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%);
  display:flex; align-items:center; gap:12px;
  background:var(--panel); border:1px solid var(--rule);
  border-radius:999px;
  padding:9px 16px 9px 8px;
  cursor:pointer; z-index:40;
  box-shadow:0 8px 32px oklch(0% 0 0 / 0.7), 0 0 0 1px oklch(75% 0.16 145 / 0.08);
  transition:transform .18s, border-color .18s, box-shadow .18s;
  font-family:var(--font-mono);
}
.cmd-pill:hover{
  border-color:var(--accent);
  transform:translateX(-50%) translateY(-2px);
  box-shadow:0 12px 40px oklch(0% 0 0 / 0.8), 0 0 0 1px oklch(75% 0.16 145 / 0.2);
}
.cmd-pill .cmd-key{
  font-family:var(--font-mono); font-weight:600; font-size:.7rem;
  background:var(--panel3); color:var(--accent);
  border:1px solid var(--rule);
  padding:5px 9px; border-radius:6px;
  letter-spacing:.5px;
}
.cmd-pill .cmd-label{
  font-family:var(--font-mono); font-weight:500; font-size:.78rem;
  color:var(--muted); padding-right:8px;
}
.cmd-pill.idle{opacity:.85;}
.cmd-pill.idle:hover{opacity:1;}

/* ─── LAYERS FAB bottom-left ──────────────────────── */
.layers-fab{
  position:absolute; bottom:calc(24px + env(safe-area-inset-bottom)); left:18px; z-index:40;
  display:flex; align-items:center; gap:8px;
  background:var(--panel); border:1px solid var(--rule);
  color:var(--text); border-radius:999px;
  padding:9px 16px;
  cursor:pointer;
  box-shadow:0 6px 24px oklch(0% 0 0 / 0.5);
  font-family:var(--font-mono); font-weight:500; font-size:.74rem;
  transition:background .15s, color .15s;
}
.layers-fab:hover{background:var(--panel2);color:var(--accent);}
.layers-fab .lf-ico{font-size:1rem;line-height:1;}
.layers-fab .lf-label{letter-spacing:.5px;}

/* ─── BOTTOM-RIGHT zoom + coord ────────────────────── */
.r-ov{
  position:absolute; bottom:calc(24px + env(safe-area-inset-bottom)); right:18px; z-index:40;
  display:flex; flex-direction:column; gap:6px; align-items:flex-end;
}
#coord{
  background:var(--panel); border:1px solid var(--rule);
  border-radius:var(--r-md); padding:6px 12px;
  font-family:var(--font-mono); font-size:.66rem; color:var(--accent);
  letter-spacing:.5px;
}
.zoom-btns{display:flex;flex-direction:column;gap:4px;}
.zb{
  width:32px;height:32px; background:var(--panel); border:1px solid var(--rule);
  color:var(--text); border-radius:var(--r-md); font-size:15px;
  cursor:pointer; display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);
  transition:background .15s,color .15s;
}
.zb:hover{background:var(--panel2);color:var(--accent);}

/* ─── COMMAND OVERLAY ──────────────────────────────── */
.cmd-overlay{
  position:fixed; inset:0; z-index:1500;
  background:oklch(8% 0.01 250 / 0.65);
  backdrop-filter:blur(6px);
  display:flex; align-items:flex-start; justify-content:center;
  padding-top:18vh;
  opacity:0; pointer-events:none;
  transition:opacity .16s;
}
.cmd-overlay.open{opacity:1;pointer-events:auto;}
.cmd-modal{
  width:min(640px, 92vw);
  background:var(--panel); border:1px solid var(--rule);
  border-radius:var(--r-lg);
  box-shadow:0 24px 64px oklch(0% 0 0 / 0.7);
  overflow:hidden;
  transform:translateY(-8px);
  transition:transform .2s cubic-bezier(.32,.72,.2,1);
}
.cmd-overlay.open .cmd-modal{transform:translateY(0);}
.cmd-input-wrap{
  display:flex; align-items:center; gap:10px;
  padding:14px 18px;
  border-bottom:1px solid var(--rule-soft);
}
.cmd-prompt{
  font-family:var(--font-mono); font-weight:600; font-size:1rem;
  color:var(--accent);
}
.cmd-input-wrap .search-input{
  flex:1; background:transparent; border:0; outline:0;
  font-family:var(--font-mono); font-size:.98rem; font-weight:500;
  color:var(--text);
  padding:6px 0;
}
.cmd-input-wrap .search-input::placeholder{color:var(--muted);}
.cmd-esc, kbd{
  font-family:var(--font-mono); font-size:.66rem; font-weight:500;
  background:var(--panel2); color:var(--muted);
  border:1px solid var(--rule); border-radius:5px;
  padding:3px 7px; letter-spacing:.5px;
}
.cmd-hints{
  display:flex; flex-wrap:wrap; gap:14px;
  padding:12px 18px;
  font-family:var(--font-mono); font-size:.7rem; color:var(--muted);
  background:var(--panel);
}
.cmd-hints span{display:flex;align-items:center;gap:6px;}

/* ─── LAYERS PANEL (left drawer) ───────────────────── */
.layers-panel{
  position:absolute; top:0; bottom:0; left:0;
  width:300px; max-width:85vw;
  background:var(--panel);
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column;
  overflow:hidden;
  transform:translateX(-100%);
  transition:transform .28s cubic-bezier(.32,.72,.2,1);
  z-index:60;
  box-shadow:8px 0 32px oklch(0% 0 0 / 0.5);
}
.layers-panel.open{transform:translateX(0);}

.lp-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 18px;
  border-bottom:1px solid var(--rule-soft);
}
.sidebar-title{
  font-family:var(--font-mono); font-weight:600; font-size:.84rem;
  color:var(--text); letter-spacing:1px; text-transform:uppercase;
}
.sb-close-btn{
  background:transparent; border:0; color:var(--muted);
  font-size:1rem; cursor:pointer; padding:4px 8px; border-radius:5px; line-height:1;
}
.sb-close-btn:hover{color:var(--text); background:var(--panel2);}

.lp-bulk{display:flex;gap:6px;padding:12px 18px 8px;}
.sidebar-btn{
  flex:1; font-family:var(--font-mono); font-weight:500; font-size:.66rem;
  padding:7px 0; border-radius:6px;
  border:1px solid var(--rule);
  background:var(--panel2); color:var(--text);
  cursor:pointer; transition:background .15s, color .15s;
  letter-spacing:.5px;
}
.sidebar-btn:hover{background:var(--panel3);color:var(--accent);}
.sidebar-btn.active{background:var(--accent-bg);color:var(--accent);border-color:var(--accent);}
.sidebar-btn.danger{color:var(--alarm);}
.sidebar-btn.danger:hover,.sidebar-btn.danger.active{background:var(--alarm-bg);color:var(--alarm);border-color:var(--alarm);}

.sidebar-search{padding:6px 18px 10px;border-bottom:1px solid var(--rule-soft);}
.sidebar-search input{
  width:100%; background:var(--panel2); border:1px solid var(--rule);
  border-radius:6px; padding:8px 11px;
  color:var(--text); font-size:.78rem; font-family:var(--font-mono); font-weight:500;
  outline:none; transition:border-color .2s,background .2s;
}
.sidebar-search input:focus{border-color:var(--accent);background:var(--panel3);}
.sidebar-search input::placeholder{color:var(--muted);}

#server-section{flex-shrink:0;border-bottom:1px solid var(--rule-soft);background:var(--bg);}
.srv-sec-title{padding:8px 18px 4px;font-family:var(--font-mono);font-weight:500;font-size:.6rem;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase;}
#server-list{padding:2px 0 8px;}

.al-list{flex:1;overflow-y:auto;padding:6px 0;}
.al-list::-webkit-scrollbar{width:4px;}
.al-list::-webkit-scrollbar-track{background:transparent;}
.al-list::-webkit-scrollbar-thumb{background:var(--accent-bg);border-radius:2px;}
.al-list-title{padding:8px 18px 4px;font-family:var(--font-mono);font-weight:500;font-size:.6rem;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase;}
.al-toggle-row{display:flex;gap:6px;padding:4px 18px 10px;}
.al-toggle-btn{
  flex:1;font-family:var(--font-mono);font-weight:500;font-size:.62rem;
  padding:5px 0;border-radius:5px;
  border:1px solid var(--rule);background:var(--panel2);color:var(--text);
  cursor:pointer;letter-spacing:.5px;
}
.al-toggle-btn:hover{background:var(--panel3);color:var(--accent);}
.al-toggle-btn.active{background:var(--accent-bg);color:var(--accent);border-color:var(--accent);}

.al-item{
  display:flex; align-items:center; gap:10px;
  padding:7px 18px; cursor:pointer; user-select:none;
  font-family:var(--font-mono);
  transition:background .12s;
}
.al-item:hover{background:var(--panel2);}
.al-check{width:13px;height:13px;border-radius:3px;border:1.5px solid var(--rule);flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.al-check.on{background:var(--ac,oklch(75% 0.16 145));border-color:var(--ac,oklch(75% 0.16 145));}
.al-check.on::after{content:'';width:6px;height:4px;border-left:2px solid var(--bg);border-bottom:2px solid var(--bg);transform:rotate(-45deg) translateY(-1px);display:block;}
.al-dot{width:10px;height:10px;border-radius:2px;flex-shrink:0;}
.al-tag{flex:1;font-family:var(--font-mono);font-weight:600;font-size:.74rem;letter-spacing:.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.al-cnt{font-family:var(--font-mono);font-weight:500;font-size:.62rem;color:var(--muted);flex-shrink:0;background:var(--panel2);padding:2px 7px;border-radius:8px;}

.sidebar-legend{border-top:1px solid var(--rule-soft);padding:12px 18px;flex-shrink:0;background:var(--bg);}
.leg-title{font-family:var(--font-mono);font-weight:500;font-size:.6rem;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase;margin-bottom:8px;}
.leg-row{display:flex;align-items:center;gap:9px;margin-bottom:5px;font-family:var(--font-mono);font-size:.72rem;font-weight:500;color:var(--muted);line-height:1.3;}
.leg-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;}
.leg-sq{width:11px;height:11px;border-radius:2px;flex-shrink:0;}

body.mode-mission .sidebar-search{display:none;}
body.mode-mission #al-list,
body.mode-mission #server-section,
body.mode-mission #sidebar-legend{display:none;}
body.mode-mission #mission-sidebar{display:flex;}
#mission-sidebar{display:none;flex-direction:column;flex:1;overflow-y:auto;padding:10px 18px;gap:8px;font-family:var(--font-mono);}
#mission-sidebar .ms-row{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--font-mono);font-weight:500;font-size:.74rem;padding:7px 10px;border-radius:6px;background:var(--panel2);border:1px solid var(--rule);}
#mission-sidebar .ms-row:hover{background:var(--panel3);}
#mission-sidebar .ms-row .ms-k{color:var(--accent);letter-spacing:.5px;}
#mission-sidebar .ms-row .ms-n{font-family:var(--font-mono);font-weight:500;font-size:.66rem;color:var(--muted);background:var(--bg);padding:2px 7px;border-radius:8px;}
#mission-sidebar .ms-row.ok .ms-n{color:var(--accent);}
#mission-sidebar .ms-title{font-family:var(--font-mono);font-weight:500;font-size:.6rem;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase;padding:4px 4px 2px;}
#mission-sidebar .ms-section{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--font-mono);font-weight:600;font-size:.68rem;letter-spacing:1px;text-transform:uppercase;color:var(--accent);padding:10px 4px 4px;margin-top:6px;border-bottom:1px solid var(--rule-soft);}
#mission-sidebar .ms-section:first-child{margin-top:0;padding-top:4px;}
#mission-sidebar .ms-section-cnt{font-family:var(--font-mono);font-weight:500;font-size:.62rem;color:var(--muted);background:var(--bg);padding:2px 7px;border-radius:8px;}

#sb-backdrop{display:none;position:fixed;inset:0;top:54px;background:oklch(0% 0 0 / 0.4);z-index:55;}
.layers-panel.open ~ #sb-backdrop{display:block;}

/* ─── OVERLAYS / TOOLTIP ───────────────────────────── */
#ov-load{position:absolute;inset:0;background:oklch(13% 0.015 250 / 0.9);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:20;}
#ov-load.h{display:none;}
.spinner{width:36px;height:36px;border:3px solid var(--rule);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.ov-txt{font-family:var(--font-mono);font-size:.72rem;color:var(--accent);letter-spacing:.5px;}
#ov-err{position:absolute;inset:0;background:oklch(13% 0.015 250 / 0.92);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:21;}
#ov-err.h{display:none;}
#err-msg{color:var(--alarm);font-family:var(--font-mono);font-size:.82rem;text-align:center;max-width:400px;line-height:1.55;}
#err-retry{font-family:var(--font-mono);font-size:.7rem;padding:8px 22px;background:var(--panel2);border:1px solid var(--rule);color:var(--text);border-radius:6px;cursor:pointer;}
#err-retry:hover{background:var(--panel3);color:var(--accent);}
#ov-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;pointer-events:none;z-index:5;}
#ov-empty.h{display:none;}
#ov-empty .ic{font-size:48px;opacity:.3;}
#ov-empty .mc{color:var(--muted);font-size:.82rem;text-align:center;line-height:1.55;font-family:var(--font-mono);}

#tt{
  position:absolute; background:var(--panel); border:1px solid var(--rule);
  border-radius:var(--r-md); padding:10px 13px;
  pointer-events:none; z-index:70;
  min-width:200px; box-shadow:var(--shadow-pop);
  font-family:var(--font-mono); font-size:.74rem; line-height:1.6;
  display:none;
}
#tt.v{display:block;}
/* Hide hover tooltip while command palette or layers drawer is open */
body:has(.cmd-overlay.open) #tt.v,
body:has(.layers-panel.open) #tt.v { display:none !important; }
.tt-name{font-family:var(--font-mono);font-weight:600;font-size:.8rem;color:var(--text);margin-bottom:4px;letter-spacing:.5px;}
.tt-tag{font-family:var(--font-mono);font-weight:500;font-size:.68rem;margin-bottom:6px;}
.tt-row{display:flex;justify-content:space-between;gap:12px;color:var(--muted);}
.tt-val{color:var(--text);font-family:var(--font-mono);font-size:.66rem;}

.toast{position:fixed;bottom:calc(88px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%) translateY(20px);background:var(--panel);border:1px solid var(--rule);border-radius:8px;padding:9px 18px;font-size:.78rem;color:var(--text);font-family:var(--font-mono);opacity:0;transition:all .3s;pointer-events:none;z-index:700;box-shadow:var(--shadow-pop);white-space:nowrap;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* Mobile: hide coord bar + bump bottom offset above iOS Safari bottom URL bar overlay */
@media(max-width:900px){
  #coord{display:none;}
  .cmd-pill{bottom:calc(110px + env(safe-area-inset-bottom));}
  .layers-fab{bottom:calc(110px + env(safe-area-inset-bottom));}
  .r-ov{bottom:calc(110px + env(safe-area-inset-bottom));}
  .toast{bottom:calc(174px + env(safe-area-inset-bottom));}
}

@media(max-width:640px){
  .cmd-pill .cmd-label{display:none;}
  .cmd-pill{padding:9px 14px;}
  .sb-left{font-size:.66rem;padding:6px 10px;}
  .sb-stat-srv{font-size:.72rem;}
  .sb-stat-count{font-size:.58rem;}
  .layers-fab .lf-label{display:none;}
  .layers-fab{padding:9px 13px;}
}

/* ─── MISSION LIST PANEL (mission mode only) ──────── */
.mission-list-panel{
  position:absolute; top:64px; right:18px; bottom:calc(200px + env(safe-area-inset-bottom));
  width:300px; max-width:calc(100% - 36px);
  background:var(--panel); border:1px solid var(--rule);
  border-radius:var(--r-md);
  display:flex; flex-direction:column;
  overflow:hidden; z-index:45;
  box-shadow:var(--shadow-pop);
  /* Hidden by default; shown only in mission mode */
  opacity:0; pointer-events:none;
  transform:translateY(-6px);
  transition:opacity .2s, transform .2s;
}
body.mode-mission .mission-list-panel{
  opacity:1; pointer-events:auto; transform:translateY(0);
}
.mlp-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 14px;
  border-bottom:1px solid var(--rule-soft);
  flex-shrink:0;
}
.mlp-title{
  font-family:var(--font-mono); font-weight:500; font-size:.66rem;
  letter-spacing:1.5px; text-transform:uppercase; color:var(--muted);
}
.mlp-count{
  font-family:var(--font-mono); font-weight:600; font-size:.7rem;
  color:var(--accent);
  background:var(--panel2); border:1px solid var(--rule);
  padding:2px 8px; border-radius:6px;
}
.mlp-body{
  flex:1; overflow-y:auto; padding:6px 6px 6px 6px;
  display:flex; flex-direction:column; gap:3px;
}
.mlp-body::-webkit-scrollbar{width:5px;}
.mlp-body::-webkit-scrollbar-track{background:transparent;}
.mlp-body::-webkit-scrollbar-thumb{background:var(--accent-bg);border-radius:3px;}
.mlp-empty{
  padding:14px;
  font-family:var(--font-mono); font-size:.72rem; color:var(--muted);
  text-align:center; line-height:1.5;
  border-top:1px solid var(--rule-soft);
}
body.mode-mission .mission-list-panel .mlp-body:not(:empty) + .mlp-empty{display:none;}

.ml-row{
  display:grid;
  grid-template-columns: auto 1fr auto auto;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  background:transparent; border:1px solid transparent;
  border-radius:6px;
  cursor:pointer; text-align:left;
  font-family:var(--font-mono); font-size:.74rem; color:var(--text);
  transition:background .12s, border-color .12s;
}
.ml-row:hover{background:var(--panel2);border-color:var(--rule);}
.ml-row:active{background:var(--panel3);}

.ml-srv{
  font-weight:600; font-size:.66rem;
  padding:2px 7px; border-radius:5px;
  background:var(--panel2); color:var(--accent);
  letter-spacing:.5px; min-width:48px; text-align:center;
}
.ml-lv{
  color:var(--text); font-weight:500;
  letter-spacing:.3px;
}
.ml-xy{
  color:var(--muted); font-size:.7rem;
  letter-spacing:.3px;
}
.ml-st{
  font-size:.85rem; line-height:1;
}
.ml-row.cap .ml-st{color:oklch(82% 0.15 90);}      /* gold star */
.ml-row.ong .ml-st{color:oklch(72% 0.14 240);}     /* blue dot */
.ml-row.cap{border-color:oklch(82% 0.15 90 / 0.18);}
.ml-row.cap:hover{border-color:oklch(82% 0.15 90 / 0.45);background:oklch(82% 0.15 90 / 0.06);}

@media(max-width:900px){
  .mission-list-panel{width:240px;top:68px;right:18px;bottom:calc(200px + env(safe-area-inset-bottom));}
}
@media(max-width:640px){
  .mission-list-panel{
    width:auto; left:18px; right:18px;
    top:auto; bottom:calc(96px + env(safe-area-inset-bottom)); max-height:42vh;
  }
}
