/* XWG-Radar 观战页 · 夜墨山水（与发送端同一水墨风格，暗色） */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root {
  color-scheme: dark;
  /* 纸与墨 —— --night 必须与 xwg-ink.js 的 PAPER 一致（前景山石以它遮挡远景线条） */
  --night:#121a1c;
  --paper-0:rgba(20,28,30,0.95);
  --paper-1:rgba(26,36,38,0.95);
  --paper-2:rgba(34,48,51,0.96);
  --rice:#e6ddcf;
  --rice-2:#b9ae9d;
  --rice-3:#857b6e;
  --jade:#6fb0b8;
  --jade-hi:#9fd1d6;
  --jade-deep:#2d6b74;
  --jade-ink:#1c4a51;
  --jade-wash:rgba(111,176,184,0.08);
  --jade-line:rgba(111,176,184,0.34);
  --line:rgba(214,202,182,0.13);
  --line-2:rgba(214,202,182,0.24);
  --cinnabar:#c9553f;
  --cinnabar-hi:#e0735c;
  --ochre:#c29c5a;
  --moss:#7fae86;
  /* 兼容旧变量名（脚本与内联样式仍可能引用） */
  --bg:var(--night);
  --panel:var(--paper-0);
  --border:var(--line);
  --border-bright:var(--jade-line);
  --accent:var(--jade);
  --accent2:var(--cinnabar);
  --green:var(--moss);
  --red:var(--cinnabar);
  --orange:var(--ochre);
  --gold:var(--ochre);
  --t1:var(--rice);
  --t2:var(--rice-2);
  --t3:var(--rice-3);
  --blur:blur(12px) saturate(120%);
  --r:8px;
  --shadow:0 18px 44px rgba(0,0,0,0.5), inset 0 1px 0 rgba(230,221,207,0.05);
  --f-brush:"KaiTi","STKaiti","楷体","Kaiti SC",serif;
  --f-serif:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --f-ui:"Microsoft YaHei UI","Microsoft YaHei","PingFang SC","Segoe UI",sans-serif;
  --f-num:"Bahnschrift","Segoe UI","Microsoft YaHei UI",sans-serif;
  --font:var(--f-ui);
  --ease:cubic-bezier(0.22,1,0.36,1);
  --safe-b:env(safe-area-inset-bottom,0px);
  --safe-t:env(safe-area-inset-top,0px);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .9 0 0 0 0 .86 0 0 0 0 .78 0 0 0 .55 -.22'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --fiber:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .32' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 .8 0 0 0 0 .76 0 0 0 0 .68 0 0 0 .4 -.18'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  --seal-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.5' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -4 0 0 0 3.15'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E");
  --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236fb0b8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
html, body { width:100%; height:100%; height:100dvh; overflow:hidden; background:var(--night);
  font-family:var(--f-ui);
  color:var(--rice); -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior:none;
  user-select:none; -webkit-user-select:none; }
::selection { background:rgba(111,176,184,0.3); color:var(--rice); }
#mapViewport {
  position:fixed; inset:0; z-index:0; overflow:hidden;
  background:
    radial-gradient(ellipse at 50% 45%, rgba(40,58,60,0.35) 0%, rgba(18,26,28,0) 70%),
    var(--night);
  touch-action:none;
}
#mapLayer {
  position:absolute; left:0; top:0; z-index:0;
  pointer-events:none; display:none;
  image-rendering:auto;
}
#mapLayer.on { display:block; }
#c {
  position:absolute; inset:0; z-index:1; display:block;
  width:100%; height:100%; cursor:grab;
  background:transparent; touch-action:none;
  user-select:none; -webkit-user-select:none;
}
#c.drag { cursor:grabbing; }
body.is-waiting #mapLayer { visibility:visible; }

/* ───────── 印章 ───────── */
.seal {
  display:inline-flex; flex-direction:column; align-items:center; justify-content:center;
  flex:none; color:#f3e9da; background:var(--cinnabar);
  font-family:var(--f-brush); font-weight:700; line-height:1;
  border-radius:4px;
  box-shadow:inset 0 0 0 1.5px rgba(243,233,218,0.55), 0 2px 8px rgba(0,0,0,0.35);
  -webkit-mask-image:var(--seal-mask); mask-image:var(--seal-mask);
  -webkit-mask-size:80px 80px; mask-size:80px 80px;
  transform:rotate(-4deg);
}

/* ───────── 山水场景（等待 / 观看密码） ───────── */
#inkScene {
  position:fixed; inset:0; z-index:1990; display:none; pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 38%, rgba(46,66,68,0.42) 0%, rgba(18,26,28,0) 62%),
    radial-gradient(ellipse at 50% 120%, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 55%),
    var(--night);
}
#inkScene::after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:var(--grain), var(--fiber); opacity:0.09;
}
#inkSky { position:absolute; inset:0; width:100%; height:100%; display:block; opacity:0.86; }
body.is-waiting #inkScene, body.is-locked #inkScene { display:block; }

.wait-overlay {
  position:fixed; inset:0; z-index:2000; pointer-events:none; display:none;
  align-items:center; justify-content:center;
  background:transparent;
  animation:waitFadeIn .45s var(--ease);
}
.wait-overlay.show { display:flex; }
.wait-card {
  position:relative;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  padding:26px 42px 24px; min-width:min(340px,82vw);
  background:linear-gradient(180deg, rgba(26,36,38,0.82) 0%, rgba(18,26,28,0.9) 100%);
  border:1px solid var(--line-2); border-radius:14px;
  box-shadow:0 24px 60px rgba(0,0,0,0.55), inset 0 1px 0 rgba(230,221,207,0.06);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.wait-card::before, .lock-card::before {
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:var(--grain); opacity:0.08;
}
.wait-seal { position:absolute; top:-14px; right:-12px; width:34px; height:40px; font-size:14px; gap:1px; }
.wait-brand, .lock-brand {
  display:flex; flex-direction:column; align-items:center; gap:3px;
  font-family:var(--f-serif); font-size:26px; font-weight:600; color:var(--rice);
  letter-spacing:0.04em; line-height:1;
}
.wait-brand-en, .lock-brand-en {
  font-family:var(--f-serif); font-size:10px; font-weight:600; color:var(--rice-3);
  letter-spacing:0.34em; text-transform:uppercase;
}
.wait-ink {
  position:relative; width:46px; height:46px; margin:6px 0 2px;
  display:flex; align-items:center; justify-content:center;
}
.wait-drop {
  width:10px; height:10px; border-radius:50%;
  background:radial-gradient(circle at 40% 38%, var(--jade-hi) 0%, var(--jade) 45%, var(--jade-deep) 100%);
  box-shadow:0 0 12px rgba(111,176,184,0.45);
  animation:inkBeat 2.4s var(--ease) infinite;
}
.wait-ring {
  position:absolute; inset:0; border-radius:50%;
  border:1.2px solid rgba(111,176,184,0.55);
  animation:inkSpread 2.4s cubic-bezier(0.215,0.61,0.355,1) infinite;
}
.wait-ring.delay { animation-delay:1.2s; }
@keyframes inkSpread {
  0% { transform:scale(0.22); opacity:0.9; }
  100% { transform:scale(1.25); opacity:0; }
}
@keyframes inkBeat {
  0%, 100% { transform:scale(1); }
  50% { transform:scale(1.18); }
}
@keyframes waitFadeIn {
  from { opacity:0; transform:translateY(6px); }
  to { opacity:1; transform:none; }
}
.wait-title {
  font-family:var(--f-brush); font-size:18px; font-weight:700; color:var(--rice);
  letter-spacing:0.32em; padding-left:0.32em; line-height:1.2;
}
.wait-sub { display:none !important; }
/* 后台公告：等待页顶部居中，长内容在框内滚动；有公告时卡片略下移 */
.wait-notice {
  position:absolute; top:clamp(24px,6vh,64px); left:50%; transform:translateX(-50%);
  width:min(620px,90vw); max-height:26vh; overflow:auto; pointer-events:auto;
  padding:14px 22px 16px; text-align:center;
  background:linear-gradient(180deg, rgba(26,36,38,0.78) 0%, rgba(18,26,28,0.88) 100%);
  border:1px solid var(--line-2); border-radius:12px;
  box-shadow:0 16px 40px rgba(0,0,0,0.45), inset 0 1px 0 rgba(230,221,207,0.06);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.wait-notice[hidden] { display:none; }
.wait-notice-title {
  font-family:var(--f-brush); font-size:19px; font-weight:700; color:var(--rice);
  letter-spacing:0.18em; line-height:1.35;
}
.wait-notice-body {
  margin-top:8px; font-family:var(--f-ui); font-size:14px; line-height:1.75; color:var(--rice-2);
  white-space:pre-wrap; word-break:break-word;
}
.wait-notice-title:empty, .wait-notice-body:empty { display:none; }
.wait-overlay.has-notice .wait-card { transform:translateY(clamp(36px,7vh,80px)); }
.wait-viewers {
  margin-top:10px; font-size:12px; color:var(--rice-3); letter-spacing:0.12em;
  font-variant-numeric:tabular-nums;
}
.wait-viewers b { color:var(--jade-hi); font:600 13px var(--f-num); margin:0 2px; }
.wait-viewers.full b { color:var(--ochre); }
.wait-pin {
  display:flex; flex-direction:column; align-items:center; gap:9px;
  margin-top:8px; pointer-events:auto;
}
.wait-pin[hidden] { display:none; }
.wait-pin-boxes { display:flex; gap:12px; }
.wait-pin-box {
  width:46px; height:54px; padding:0;
  background:rgba(8,12,13,0.5); border:1px solid var(--line-2); border-radius:9px;
  color:var(--rice); font:600 24px var(--f-num); text-align:center; caret-color:var(--jade-hi);
  outline:none; user-select:text; -webkit-user-select:text;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s;
}
.wait-pin-box:focus {
  border-color:var(--jade); background:rgba(8,12,13,0.68);
  box-shadow:0 0 0 3px rgba(111,176,184,0.18);
}
.wait-pin-box:disabled { opacity:0.45; }
.wait-pin.is-error .wait-pin-box { border-color:var(--cinnabar-hi); }
.wait-pin.is-error .wait-pin-boxes { animation:pinShake .38s var(--ease); }
.wait-pin-msg { min-height:16px; font-size:12px; letter-spacing:0.08em; color:var(--rice-3); }
.wait-pin.is-error .wait-pin-msg { color:var(--cinnabar-hi); }
@keyframes pinShake {
  0%, 100% { transform:none; }
  25% { transform:translateX(-6px); }
  75% { transform:translateX(6px); }
}

.lock-overlay {
  position:fixed; inset:0; z-index:1995;
  display:none; align-items:center; justify-content:center;
  background:transparent;
  pointer-events:auto; user-select:none;
}
.lock-overlay.show { display:flex; }
body.is-locked .wait-overlay { display:none !important; }
.lock-card {
  position:relative;
  text-align:center; padding:30px 32px 24px; width:min(380px,88vw);
  border:1px solid var(--line-2); border-radius:14px;
  background:linear-gradient(180deg, rgba(26,36,38,0.9) 0%, rgba(18,26,28,0.95) 100%);
  box-shadow:0 24px 60px rgba(0,0,0,0.6), inset 0 1px 0 rgba(230,221,207,0.06);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.lock-seal { position:absolute; top:-14px; right:-12px; width:34px; height:40px; font-size:14px; gap:1px; }
.lock-brand { margin-bottom:14px; font-size:22px; }
.lock-title {
  font-family:var(--f-brush); font-size:20px; font-weight:700; color:var(--rice);
  letter-spacing:0.36em; padding-left:0.36em;
  margin-bottom:16px;
}
.lock-card input, .admin-pop input {
  width:100%; background:rgba(8,12,13,0.45); border:1px solid var(--line-2);
  border-radius:8px; color:var(--rice); font-size:14px; padding:11px 13px;
  outline:none; font-family:inherit; margin-bottom:10px;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s;
  user-select:text; -webkit-user-select:text;
}
.lock-card input::placeholder, .admin-pop input::placeholder { color:var(--rice-3); }
.lock-card input:focus, .admin-pop input:focus {
  border-color:var(--jade); background:rgba(8,12,13,0.6);
  box-shadow:0 0 0 3px rgba(111,176,184,0.16);
}
.lock-card .lock-btn {
  margin-top:2px; padding:11px; font-size:15px; font-weight:700; letter-spacing:0.3em;
  color:#f5efe4; border-color:var(--jade);
  background:linear-gradient(0deg, #3a8a94 0%, #3a8a94 100%) no-repeat bottom / 100% 0%, var(--jade-deep);
  box-shadow:0 8px 20px rgba(0,0,0,0.35);
}
.lock-card .lock-btn:hover { background-size:100% 100%, auto; }
.lock-admin-link {
  margin-top:14px; background:none; border:none; color:var(--rice-3);
  font-size:12px; letter-spacing:0.12em; cursor:pointer; font-family:inherit;
  border-bottom:1px dashed transparent; padding-bottom:1px;
  transition:color .2s, border-color .2s;
}
.lock-admin-link:hover { color:var(--jade-hi); border-bottom-color:var(--jade-line); }
.lock-admin-form { margin-top:10px; }
.lock-err {
  min-height:16px; margin-top:8px; font-size:12px; color:var(--cinnabar-hi);
  letter-spacing:0.04em;
}
body.is-locked .topbar-stats,
body.is-locked .sidebar,
body.is-locked .sidebar-toggle,
body.is-locked .leaflet-control-zoomslider {
  visibility:hidden !important; pointer-events:none !important;
}
body.is-locked .admin-wrap { display:none !important; }
body.is-locked .map-tab { opacity:0.55; }
body.is-locked .topbar { z-index:2001; background:none; }

.admin-wrap { position:relative; }
.admin-pop {
  position:absolute; right:0; top:calc(100% + 8px); width:320px;
  padding:14px 14px 12px; z-index:1100;
  background:var(--paper-1); border:1px solid var(--line-2);
  border-radius:var(--r); box-shadow:var(--shadow);
  pointer-events:auto; user-select:none;
}
.admin-title {
  font-family:var(--f-brush); font-size:15px; font-weight:700; color:var(--rice);
  letter-spacing:0.2em; margin-bottom:10px;
}
.admin-modes {
  display:flex; border:1px solid var(--line-2); border-radius:8px; overflow:hidden;
}
.admin-modes label {
  flex:1; text-align:center; font-size:12px; line-height:1.2;
  padding:8px 4px; cursor:pointer; color:var(--rice-2);
  transition:background .18s, color .18s;
}
.admin-modes input { position:absolute; opacity:0; pointer-events:none; }
.admin-modes label:has(input:checked) {
  color:#f1ebe0; background:var(--jade-deep);
}
.admin-cur-row[hidden],
.admin-share-btns[hidden] { display:none !important; }
.admin-cur-row {
  display:flex; align-items:center; gap:6px; margin:10px 0 8px;
}
.admin-cur-row > span {
  flex:0 0 auto; font-size:12px; color:var(--rice-2); white-space:nowrap;
}
.admin-cur-row input {
  flex:1; min-width:0; margin:0; text-transform:uppercase;
  letter-spacing:0.12em; color:var(--jade-hi);
}
.admin-cur-row input[readonly] {
  cursor:default; background:transparent;
}
.admin-rand {
  flex:0 0 30px; width:30px; height:30px; padding:0; margin:0;
  display:flex; align-items:center; justify-content:center;
  border:1px solid var(--jade-line); border-radius:6px;
  background:var(--jade-wash); color:var(--jade-hi); cursor:pointer;
}
.admin-rand:hover { background:rgba(111,176,184,0.16); border-color:var(--jade); }
.admin-share-btns { display:flex; gap:6px; }
.admin-share-btns .btn { flex:1; margin-top:0; }
#adminSaveBtn { margin-top:8px; }

body.is-waiting .topbar-stats,
body.is-waiting .sidebar,
body.is-waiting .sidebar-toggle,
body.is-waiting .leaflet-control-zoomslider {
  visibility:hidden !important; pointer-events:none !important;
}
body.is-waiting #mapLayer,
body.is-waiting #c,
body.is-waiting .evidence-hud,
body.is-waiting .topbar-meta { visibility:hidden !important; pointer-events:none !important; }
body.is-locked #btnXwg3d { visibility:hidden !important; pointer-events:none !important; }
body.is-waiting .map-tab { opacity:0.55; }

.evidence-hud {
  position:fixed; top:58px; right:12px; z-index:900; width:min(360px, calc(100vw - 24px));
  padding:12px 12px 10px;
  border:1px solid var(--line-2); border-radius:10px;
  background:var(--paper-0);
  box-shadow:var(--shadow);
  pointer-events:none;
}
.evidence-title {
  display:flex; align-items:center; gap:8px;
  color:var(--rice); font-family:var(--f-brush); font-size:13px; font-weight:700;
  letter-spacing:.2em; margin-bottom:8px;
}
.evidence-title::before {
  content:''; display:inline-block; width:3px; height:12px; border-radius:2px;
  background:var(--jade);
}
.evidence-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.evidence-cell {
  min-width:0; padding:5px 7px;
  border:1px solid var(--line); border-radius:6px;
  background:rgba(230,221,207,0.025);
  transition:background .2s, border-color .2s;
}
.evidence-cell:hover { background:var(--jade-wash); border-color:var(--jade-line); }
.evidence-cell span {
  display:block; color:var(--rice-3);
  font-size:9px; font-weight:500; white-space:nowrap; letter-spacing:0.02em;
}
.evidence-cell strong {
  display:block; margin-top:2px; color:var(--rice);
  font:600 11px var(--f-num); font-variant-numeric:tabular-nums;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.evidence-cell strong[data-tone="ok"] { color:var(--moss); }
.evidence-cell strong[data-tone="candidate"] { color:var(--ochre); }
@media (max-width:720px) {
  .evidence-hud { top:48px; right:8px; width:min(300px, calc(100vw - 16px)); padding:6px 7px; }
  .evidence-grid { gap:3px; }
  .evidence-cell { padding:3px 4px; }
  .evidence-cell span { font-size:8px; }
  .evidence-cell strong { font-size:9px; }
}

/* ───────── 顶栏 ───────── */
.topbar {
  position:fixed; top:0; left:0; right:0; height:calc(50px + var(--safe-t)); z-index:1000;
  display:flex; align-items:center; gap:10px; padding:var(--safe-t) 16px 0;
  pointer-events:none;
  background:linear-gradient(to bottom, rgba(14,21,22,0.92) 0%, rgba(14,21,22,0.55) 62%, rgba(14,21,22,0) 100%);
}
.topbar > * { pointer-events:auto; }
.topbar-left { display:flex; align-items:center; gap:10px; flex-shrink:0; min-width:0; }
.topbar-logo {
  display:flex; align-items:center; gap:9px;
  white-space:nowrap; cursor:default; user-select:none;
}
.logo-mark { width:24px; height:24px; font-size:15px; }
.logo-brand {
  font-family:var(--f-serif); font-size:21px; font-weight:600; letter-spacing:0.02em;
  color:var(--rice); line-height:1;
  text-shadow:0 1px 10px rgba(0,0,0,0.55);
}
.logo-tag {
  font-family:var(--f-brush); font-size:13px; font-weight:700; letter-spacing:0.24em;
  color:var(--rice-2); line-height:1;
  padding-left:9px; border-left:1px solid var(--line-2);
}
.topbar-sep { width:1px; height:20px; background:var(--line-2); margin:0 2px; flex-shrink:0; }
.map-tab {
  padding:5px 12px 5px 13px; border-radius:999px;
  font-family:var(--f-brush); font-size:14px; font-weight:700; letter-spacing:0.16em;
  color:var(--rice); white-space:nowrap;
  background:rgba(18,26,28,0.72); border:1px solid var(--line-2);
  box-shadow:inset 0 1px 0 rgba(230,221,207,0.05);
}
.topbar-stats {
  flex:1; display:flex; align-items:center; justify-content:center; gap:14px;
  min-width:0; overflow-x:auto; overflow-y:hidden; pointer-events:none;
  scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.topbar-stats::-webkit-scrollbar { display:none; }
.topbar-stats .fs-title { display:none; }
.fs-row { display:flex; align-items:center; gap:5px; font-size:11px; line-height:1; white-space:nowrap; flex-shrink:0; }
.fs-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.fs-dot-player { background:var(--cinnabar); box-shadow:0 0 0 2px rgba(201,85,63,0.18); }
.fs-dot-ai { background:var(--rice-3); box-shadow:0 0 0 2px rgba(133,123,110,0.2); }
.fs-dot-pkt { background:var(--ochre); box-shadow:0 0 0 2px rgba(194,156,90,0.2); }
.fs-dot-data { background:#5fb3c4; box-shadow:0 0 0 2px rgba(95,179,196,0.2); }
.fs-dot-fps { background:#6cc56c; box-shadow:0 0 0 2px rgba(108,197,108,0.2); }
/* The stats strip ignores the mouse so it never blocks the map; the FPS cell opens the 3D performance panel. */
#fsFpsRow { pointer-events:auto; cursor:pointer; }
#fsFpsRow.fps-warn .fs-dot-fps { background:#e6a23c; box-shadow:0 0 0 2px rgba(230,162,60,0.25); }
#fsFpsRow.fps-bad .fs-dot-fps { background:#e5533d; box-shadow:0 0 0 2px rgba(229,83,61,0.25); }
#fsFpsRow.fps-warn #fsFrameMax { color:#e6a23c; }
#fsFpsRow.fps-bad #fsFrameMax { color:#e5533d; }
.fs-val { font:700 13px var(--f-num); min-width:12px; color:var(--rice); font-variant-numeric:tabular-nums; }
.fs-lbl { color:var(--rice-3); font-size:11px; letter-spacing:0.04em; }
.fs-mode .fs-lbl { color:var(--rice-3); }
.topbar-pill {
  display:flex; align-items:center; gap:7px;
  padding:6px 13px; border-radius:999px; cursor:pointer;
  background:rgba(18,26,28,0.78); border:1px solid var(--line-2);
  font-size:12px; font-weight:600; color:var(--rice-2); letter-spacing:0.04em;
  transition:background .2s var(--ease), color .2s, border-color .2s, box-shadow .2s;
  white-space:nowrap; font-family:inherit;
  backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur);
}
.topbar-pill:hover { background:rgba(45,107,116,0.35); color:var(--rice); border-color:var(--jade-line); }
.topbar-pill.active { color:#f1ebe0; border-color:var(--jade); background:var(--jade-deep); box-shadow:0 4px 14px rgba(0,0,0,0.35); }
.topbar-conn { cursor:default; }
.fullscreen-toggle { font-family:var(--f-brush); letter-spacing:0.12em; }
.fullscreen-toggle[hidden] { display:none; }
.fullscreen-icon {
  width:14px; height:14px; flex-shrink:0;
  fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;
}
.fullscreen-icon .fs-exit, .fullscreen-toggle.active .fs-enter { display:none; }
.fullscreen-toggle.active .fs-exit { display:inline; }
.topbar-viewers { cursor:default; gap:6px; }
.topbar-viewers:hover { background:rgba(18,26,28,0.78); color:var(--rice-2); border-color:var(--line-2); }
.topbar-viewers .viewer-lbl { font-family:var(--f-brush); font-weight:700; letter-spacing:0.08em; color:var(--rice-3); }
.topbar-viewers b { font:700 12px var(--f-num); color:var(--jade-hi); font-variant-numeric:tabular-nums; }
.topbar-viewers.full { border-color:rgba(194,156,90,0.55); }
.topbar-viewers.full b { color:var(--ochre); }
.topbar-conn:hover { background:rgba(18,26,28,0.78); color:var(--rice-2); border-color:var(--line-2); }
.conn-dot {
  width:8px; height:8px; border-radius:50%; background:var(--rice-3);
  transition:background .3s ease, box-shadow .3s ease; flex-shrink:0;
}
.conn-dot.ok  {
  background:var(--moss);
  box-shadow:0 0 0 3px rgba(127,174,134,0.18);
  animation:connPulse 2.8s infinite;
}
.conn-dot.err {
  background:var(--cinnabar);
  box-shadow:0 0 0 3px rgba(201,85,63,0.2);
}
@keyframes connPulse {
  0%, 100% { box-shadow:0 0 0 3px rgba(127,174,134,0.18); }
  50% { box-shadow:0 0 0 6px rgba(127,174,134,0.05); }
}
.topbar-meta { margin-left:0; display:flex; align-items:center; gap:8px; flex-shrink:0; }
/* 3D 未开放：按钮置灰，悬停（触屏为点按）显示“待开发中”。 */
.topbar-pill.xwg3d-locked,
.topbar-pill.xwg3d-locked:hover { position:relative; cursor:not-allowed; background:rgba(18,26,28,0.78); color:rgba(230,221,207,0.32); border-color:rgba(230,221,207,0.1); }
.topbar-pill.xwg3d-locked::after {
  content:attr(data-tip); position:absolute; top:calc(100% + 8px); left:50%; transform:translateX(-50%);
  padding:4px 10px; border-radius:6px; white-space:nowrap; pointer-events:none;
  font-size:12px; font-weight:600; letter-spacing:0.08em; color:var(--rice);
  background:rgba(14,21,22,0.94); border:1px solid var(--jade-line);
  box-shadow:0 4px 14px rgba(0,0,0,0.35); opacity:0; transition:opacity .15s;
}
.topbar-pill.xwg3d-locked:hover::after, .topbar-pill.xwg3d-locked.show-tip::after { opacity:1; }
.xwg3d-overlay {
  position:fixed; right:14px; top:58px; z-index:920; display:none; gap:8px; align-items:center;
  font:12px/1.5 var(--f-ui);
}
.xwg3d-info { color:var(--rice-2); text-shadow:0 1px 2px #000; }

/* ───────── 侧栏 ───────── */
.sidebar {
  position:fixed; top:60px; left:12px; bottom:12px; width:252px;
  display:flex; flex-direction:column; gap:0; z-index:999;
  overflow:clip;
  transition:transform .32s var(--ease);
  background:linear-gradient(180deg, rgba(26,36,38,0.95) 0%, rgba(19,27,29,0.96) 100%);
  backdrop-filter:blur(10px) saturate(115%);
  -webkit-backdrop-filter:blur(10px) saturate(115%);
  border:1px solid var(--line-2); border-radius:14px;
  box-shadow:0 22px 50px rgba(0,0,0,0.55), inset 0 1px 0 rgba(230,221,207,0.05);
}
.sidebar::before {
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background:var(--grain), var(--fiber); opacity:0.07;
}
.sidebar-inner {
  position:relative;
  width:100%; flex:0 0 auto;
  display:flex; flex-direction:column;
  transform-origin:top left;
}
.sidebar-cfg { flex:0 0 auto; overflow:visible; }
.sidebar.collapsed { transform:translateX(calc(-100% - 16px)); }
.sidebar-grab { display:none; }
.sidebar-toggle {
  position:fixed; top:60px; left:263px; width:22px; height:52px;
  background:linear-gradient(180deg, rgba(26,36,38,0.96) 0%, rgba(19,27,29,0.96) 100%);
  backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur);
  border:1px solid var(--line-2); border-left:none; border-radius:0 10px 10px 0;
  cursor:pointer; z-index:1000; color:var(--jade-hi); font-size:15px; font-family:inherit;
  display:flex; align-items:center; justify-content:center;
  transition:left .32s var(--ease), color .2s, border-color .2s;
  box-shadow:6px 8px 18px rgba(0,0,0,0.35);
  outline:none; user-select:none;
}
.sidebar-toggle:hover { color:var(--rice); border-color:var(--jade-line); }
.sidebar-toggle.collapsed { left:12px; }

/* 桌面：菜单收在底部，只露出中间凸起的「设置」按钮；点一下升起扁长菜单栏，再点收回。 */
@media (min-width:721px) {
  .sidebar {
    top:auto; left:50%; bottom:12px;
    width:min(1120px, calc(100vw - 96px)); max-height:calc(100vh - 150px);
    overflow:visible; transform:translateX(-50%);
  }
  .sidebar.collapsed { transform:translate(-50%, calc(100% + 13px)); }
  .sidebar-toggle { display:none; }
  .sidebar-grab {
    display:flex; align-items:center; gap:7px;
    position:absolute; bottom:100%; left:50%; transform:translateX(-50%);
    height:30px; margin:0 0 -1px; padding:0 22px 0 18px;
    background:linear-gradient(180deg, rgba(30,42,44,0.97) 0%, rgba(26,36,38,0.96) 100%);
    backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    border:1px solid var(--line-2); border-bottom:none; border-radius:14px 14px 0 0;
    box-shadow:0 -8px 22px rgba(0,0,0,0.38);
    color:var(--jade-hi); font:700 14px var(--f-brush); letter-spacing:0.2em;
    cursor:pointer; user-select:none; outline:none;
    transition:color .2s, border-color .2s;
  }
  .sidebar-grab::before {
    content:""; width:7px; height:7px; margin-top:4px;
    border:solid currentColor; border-width:2px 0 0 2px;
    transform:rotate(45deg); transition:transform .32s var(--ease), margin .32s var(--ease);
  }
  .sidebar:not(.collapsed) .sidebar-grab::before { transform:rotate(225deg); margin-top:-4px; }
  .sidebar-grab:hover, .sidebar-grab:focus-visible { color:var(--rice); border-color:var(--jade-line); }
  .sidebar-inner {
    flex:1 1 auto; min-height:0; flex-direction:row; align-items:stretch;
    overflow:auto; border-radius:inherit;
  }
  .sidebar-cfg {
    display:grid; grid-template-columns:258px 250px 214px; grid-template-rows:auto 1fr;
  }
  .sidebar-cfg > .panel:nth-child(1) { grid-area:1 / 1; }
  .sidebar-cfg > .panel:nth-child(2) { grid-area:2 / 1; }
  .sidebar-cfg > .panel:nth-child(3) { grid-area:1 / 2 / 3; }
  .sidebar-cfg > .panel:nth-child(4) { grid-area:1 / 3; }
  .sidebar-cfg > .panel:nth-child(5) { grid-area:2 / 3; }
  .sidebar-cfg > .panel:nth-child(n+3),
  .sidebar-cfg + .panel-players { border-top:none; border-left:1px solid var(--line); }
  .sidebar-cfg > .panel-3d { border-top:1px solid var(--line); }
  .panel-players { flex:1 1 280px; min-width:260px; }
  /* The players column takes the height of the settings columns and scrolls. */
  .player-list { flex:1 1 0; min-height:60px; contain:size; }
}

.leaflet-control-zoomslider.leaflet-bar.leaflet-control {
  position:fixed; right:12px; bottom:calc(12px + var(--safe-b)); z-index:1002;
  width:26px; margin:0; padding:0;
  max-height:calc(100vh - 20px - var(--safe-b));
  display:flex; flex-direction:column; align-items:center;
  background:transparent; border:none; box-shadow:none;
  user-select:none; pointer-events:auto; touch-action:none;
}
.leaflet-bar a {
  width:26px; height:26px; line-height:24px;
  display:block; text-align:center; text-decoration:none;
  color:var(--rice);
  font:400 16px/24px var(--f-ui);
  cursor:pointer;
  background:rgba(22,31,33,0.88);
  border:1px solid var(--line-2);
  border-radius:8px;
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  box-sizing:border-box;
  flex:0 0 auto;
  box-shadow:0 4px 12px rgba(0,0,0,0.35);
  transition:background .18s, border-color .18s, color .18s;
}
.leaflet-bar a:hover { background:var(--jade-deep); border-color:var(--jade); color:#f1ebe0; }
.leaflet-control-zoomslider-in::after { content:"+"; }
.leaflet-control-zoomslider-out::after { content:"−"; }
.leaflet-bar a.map-full-view { margin-top:6px; font:700 11px/24px var(--f-brush); letter-spacing:0; }
.leaflet-control-zoomslider a.leaflet-control-zoomslider-disabled {
  cursor:default; opacity:0.35; pointer-events:none;
}
.leaflet-control-zoomslider-wrap {
  padding:4px 0; background:transparent; border:none;
  width:26px;
  height:clamp(40px, 16vh, 110px);
  max-height:calc(100vh - 72px - var(--safe-b));
  flex:0 0 auto;
  display:flex; justify-content:center; align-items:stretch;
  overflow:hidden;
  box-sizing:border-box;
}
.leaflet-control-zoomslider-body {
  width:2px;
  flex:1 1 auto;
  align-self:stretch;
  height:auto;
  min-height:0;
  margin:0; position:relative;
  border:none;
  box-sizing:border-box; cursor:pointer;
  padding:0 12px;
  background-clip:content-box;
  background-color:transparent;
  background-image:linear-gradient(var(--jade), rgba(111,176,184,0.2));
  background-size:2px 100%;
  background-repeat:no-repeat;
  background-position:center;
}
.leaflet-control-zoomslider-knob {
  position:absolute; left:50%; top:0;
  width:14px; height:5px; margin-left:-7px;
  background:var(--rice); border:none; border-radius:3px;
  box-shadow:0 0 0 2px rgba(18,26,28,0.9), 0 2px 6px rgba(0,0,0,0.5);
  cursor:grab; touch-action:none;
  z-index:1;
  will-change:transform;
}
.leaflet-control-zoomslider-knob:active { cursor:grabbing; }

/* ───────── 面板 ───────── */
.panel { background:transparent; border:none; padding:13px 15px; flex-shrink:0; position:relative; }
.panel + .panel { border-top:1px solid var(--line); }
.panel-title {
  display:flex; align-items:center; gap:8px; margin-bottom:10px; white-space:nowrap;
  font-size:11px; font-weight:600; color:var(--rice); letter-spacing:0;
}
.panel-title::before {
  content:''; width:3px; height:13px; border-radius:2px; flex:none;
  background:linear-gradient(to bottom, var(--jade-hi), var(--jade-deep));
}
.panel-name {
  font-family:var(--f-brush); font-size:15px; font-weight:700; letter-spacing:0.12em; color:var(--rice);
  line-height:1;
}
.panel-en {
  font-family:var(--f-serif); font-size:9px; font-weight:600; letter-spacing:0.18em;
  color:var(--rice-3); text-transform:uppercase; line-height:1;
  padding-left:7px; border-left:1px solid var(--line-2);
}
.panel-title:has(.title-togs) { gap:6px; }
.panel-title:has(.title-togs) .panel-name { flex:none; letter-spacing:0; }
.panel-title:has(.title-togs) .panel-en { flex:none; padding-left:5px; letter-spacing:0; }
.panel-size { padding-bottom:11px; }
.panel-size .scale-row { margin-top:0; }
.layer-stack { display:flex; flex-direction:column; gap:3px; }
.layer-row {
  display:flex; align-items:center; justify-content:flex-start; gap:8px;
  padding:6px 8px; cursor:pointer; border-radius:8px;
  border:1px solid transparent;
  transition:background .18s ease, border-color .18s ease;
}
.layer-row:hover { background:var(--jade-wash); border-color:var(--jade-line); }
.layer-line { display:flex; align-items:stretch; gap:0; }
.layer-line .layer-row { flex:1; min-width:0; }
.hide-hit {
  width:48px; flex:0 0 48px; margin:0; padding:0 7px 0 0;
  display:flex; align-items:center; justify-content:flex-end;
  border:1px solid transparent; border-radius:8px;
  background:transparent; color:inherit; font:inherit; cursor:pointer;
  appearance:none; -webkit-appearance:none;
}
.hide-hit:hover { background:var(--jade-wash); border-color:var(--jade-line); }
.hide-hit .box-chk {
  width:15px; height:15px; pointer-events:none;
}
.hide-hit .box-chk.on::after {
  left:4.5px; top:1.5px; width:4.5px; height:8px;
}
.hide-open-hint {
  margin-left:auto; font-size:10px; font-weight:500; color:var(--rice-3);
  letter-spacing:0; pointer-events:none;
}
.box-chk {
  width:13px; height:13px; border:1.5px solid var(--line-2); border-radius:3px;
  position:relative; flex-shrink:0; display:block; cursor:pointer;
  background:rgba(8,12,13,0.35);
  transition:background .18s ease, border-color .18s ease;
}
.box-chk.on { background:var(--jade-deep); border-color:var(--jade); }
.box-chk.on::after {
  content:''; position:absolute; left:3.5px; top:1px; width:3.5px; height:7px;
  border:solid #f1ebe0; border-width:0 1.6px 1.6px 0; transform:rotate(45deg);
}
.item-compact {
  margin-left:auto; display:flex; align-items:center; gap:5px;
  font-size:11px; font-weight:500; color:var(--rice-2);
  cursor:pointer; user-select:none;
}
.panel-title .layer-row-inline {
  padding:0; margin:0 0 0 8px; border:none; background:transparent;
}
.panel-title .layer-row-inline:hover { background:transparent; border:none; }
.title-togs {
  margin-left:auto; display:flex; align-items:center; gap:4px;
  font-weight:500; flex:none;
}
.title-togs .layer-row-inline { margin:0; gap:0; flex:none; }
.title-togs .ltog,
.scale-row .ltog {
  width:auto; min-width:44px; height:21px; padding:0 13px 0 15px;
  display:flex; align-items:center; justify-content:center;
}
.title-togs .ltog::after,
.scale-row .ltog::after { top:3.5px; }
.title-togs .ltog { width:56px; min-width:56px; padding:0 15px; }
.title-togs .ltog-lab,
.scale-row .ltog-lab {
  position:relative; z-index:1;
  font-size:11px; font-weight:600; line-height:1;
  color:var(--rice-3); pointer-events:none;
}
.title-togs .ltog.on .ltog-lab,
.scale-row .ltog.on .ltog-lab { color:#f1ebe0; }
.layer-lbl { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:500; min-width:0; color:var(--rice); }
.ldot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.ldot-player { background:var(--cinnabar); }
.ldot-ai { background:var(--rice); }
.ltog {
  width:32px; height:18px; border-radius:999px; background:rgba(8,12,13,0.45);
  position:relative; flex-shrink:0; transition:background .22s var(--ease), border-color .22s;
  border:1px solid var(--line-2);
}
.ltog::after {
  content:''; position:absolute; top:2.5px; left:3px; width:11px; height:11px;
  border-radius:50%; background:var(--rice-3); transition:left .26s cubic-bezier(.34,1.56,.64,1), background .2s;
}
.ltog.on { background:var(--jade-deep); border-color:var(--jade); }
.ltog.on::after { background:#f1ebe0; left:calc(100% - 14px); box-shadow:0 0 0 2px rgba(28,74,81,0.6); }
.title-togs .ltog.on::after,
.scale-row .ltog.on::after { left:calc(100% - 14px); }
.panel-loot { padding-top:11px; padding-bottom:9px; }
.panel-3d .scale-row + .scale-row { margin-top:8px; }
.panel-3d .cfg-lbl { min-width:4em; }
.panel-loot .panel-title { margin-bottom:7px; }
.panel-loot .layer-row { padding:4px 6px; gap:7px; }
.panel-loot .ltog { width:28px; height:16px; }
.panel-loot .ltog::after { top:2px; left:2.5px; width:10px; height:10px; }
.panel-loot .ltog.on::after { left:calc(100% - 12.5px); }
.panel-loot .layer-lbl { font-size:11px; gap:5px; }
.panel-loot .ldot { width:7px; height:7px; }
.panel-loot .hide-hit { width:36px; flex-basis:36px; padding-right:5px; }
.panel-loot .hide-hit .box-chk { width:13px; height:13px; }
.scale-row { display:flex; align-items:center; gap:9px; margin-top:8px; }
.cfg-lbl { font-size:12px; color:var(--rice-2); white-space:nowrap; }
.scale-slider {
  flex:1; min-width:0; -webkit-appearance:none; appearance:none; height:3px;
  background:linear-gradient(90deg, var(--jade-deep), rgba(111,176,184,0.35)); border-radius:2px; outline:none;
}
.scale-slider::-webkit-slider-thumb {
  -webkit-appearance:none; width:15px; height:15px; border-radius:50%;
  background:radial-gradient(circle at 38% 34%, var(--jade-hi) 0%, var(--jade) 42%, var(--jade-deep) 100%);
  cursor:pointer; border:2px solid rgba(230,221,207,0.85);
  box-shadow:0 2px 8px rgba(0,0,0,0.45);
  transition:transform .18s var(--ease);
}
.scale-slider::-webkit-slider-thumb:hover { transform:scale(1.15); }
.scale-slider::-moz-range-thumb {
  width:13px; height:13px; border-radius:50%; background:var(--jade);
  border:2px solid rgba(230,221,207,0.85); cursor:pointer;
}
.scale-val { font:600 12px var(--f-num); color:var(--rice-2); min-width:24px; margin-left:-6px; text-align:right; font-variant-numeric:tabular-nums; }
.zoom-link {
  display:flex; align-items:center; flex-shrink:0; margin:0; padding:0;
  border:none; background:transparent; font:inherit; cursor:pointer;
}
select, input[type="number"] {
  flex:1; width:100%; background-color:rgba(8,12,13,0.45); border:1px solid var(--line-2);
  border-radius:8px; color:var(--rice); font-size:12px; padding:7px 10px;
  outline:none; font-family:inherit; -webkit-appearance:none; appearance:none;
  transition:border-color .18s, box-shadow .18s;
}
select {
  padding-right:26px;
  background-image:var(--chevron); background-repeat:no-repeat;
  background-position:right 7px center; background-size:13px 13px;
}
select:focus, input[type="number"]:focus { border-color:var(--jade); box-shadow:0 0 0 3px rgba(111,176,184,0.14); }
select option { background:#162022; color:var(--rice); }
.btn {
  width:100%; padding:8px; border-radius:8px; font-size:12px; font-weight:600;
  cursor:pointer; border:1px solid var(--jade-line);
  color:var(--rice); font-family:inherit; margin-top:6px; letter-spacing:0.08em;
  /* 墨水上涌：悬停时底部的墨色升满按钮 */
  background:linear-gradient(0deg, rgba(45,107,116,0.85) 0%, rgba(45,107,116,0.85) 100%) no-repeat bottom / 100% 0%,
             rgba(111,176,184,0.07);
  transition:background-size .32s var(--ease), border-color .2s, color .2s, box-shadow .2s;
}
.btn:hover {
  background-size:100% 100%, auto; border-color:var(--jade); color:#f1ebe0;
  box-shadow:0 4px 14px rgba(0,0,0,0.3);
}
.btn.on {
  background:linear-gradient(0deg, rgba(201,85,63,0.9) 0%, rgba(201,85,63,0.9) 100%) no-repeat bottom / 100% 100%, transparent;
  border-color:var(--cinnabar-hi); color:#f7eee4;
}
.btn-follow {
  width:auto; margin:0; padding:3px 8px;
  font-size:11px; letter-spacing:0.04em; flex-shrink:0; line-height:1.4;
  border-radius:7px;
}
.watch-btns {
  margin:0 0 0 auto; display:flex; align-items:center; gap:5px; flex-shrink:0;
}
.watch-btns .btn-follow { padding:3px 6px; }
.watch-settings { margin:0 0 10px; font-size:12px; letter-spacing:0; }
.watch-settings summary {
  cursor:pointer; padding:5px 0; color:var(--rice-2); list-style:none;
  display:flex; align-items:center; gap:6px;
}
.watch-settings summary::-webkit-details-marker { display:none; }
.watch-settings summary::before {
  content:""; width:13px; height:13px; flex:none;
  background:var(--chevron) no-repeat center / 13px 13px;
  transform:rotate(-90deg); transition:transform .22s var(--ease);
}
.watch-settings[open] summary::before { transform:none; }
.watch-settings .watch-btns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:4px 0 8px; gap:6px; }
.watch-settings .btn-follow { min-width:0; min-height:29px; padding:4px 2px; letter-spacing:0; }
.watch-heading { min-height:28px; }
.watch-heading:has(input:disabled) { opacity:.5; }
.btn-follow.on {
  background:linear-gradient(0deg, var(--jade-deep) 0%, var(--jade-deep) 100%) no-repeat bottom / 100% 100%, transparent;
  border-color:var(--jade); color:#f1ebe0;
}
.panel-players {
  flex:0 0 auto;
  display:flex; flex-direction:column; overflow:hidden;
}
.sidebar-cfg + .panel-players { border-top:1px solid var(--line); }
.panel-players .panel-title { flex-shrink:0; margin-bottom:8px; }
.player-list {
  flex:0 0 auto;
  display:flex; flex-direction:column; gap:0;
  overflow-x:hidden; overflow-y:auto;
  margin:0 -2px; padding-right:2px;
  overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  scrollbar-width:thin;
  scrollbar-color:rgba(111,176,184,0.4) transparent;
}
.player-list::-webkit-scrollbar { width:4px; }
.player-list::-webkit-scrollbar-track { background:transparent; }
.player-list::-webkit-scrollbar-thumb { background:rgba(111,176,184,0.38); border-radius:2px; }
.plist-row {
  display:flex; align-items:center; gap:8px;
  width:100%; min-height:29px; flex:0 0 auto;
  padding:4px 9px; margin:2px 0;
  border:1px solid var(--line); border-radius:8px;
  background:rgba(230,221,207,0.025); color:var(--rice); font:inherit; font-size:12px;
  cursor:pointer; text-align:left; line-height:1.25;
  transition:background .18s ease, border-color .18s ease, transform .15s ease;
}
.plist-row:hover {
  background:var(--jade-wash);
  border-color:var(--jade-line);
  transform:translateX(2px);
}
.plist-row.on {
  background:linear-gradient(90deg, rgba(45,107,116,0.62) 0%, rgba(45,107,116,0.16) 100%);
  border-color:var(--jade);
  box-shadow:0 4px 14px rgba(0,0,0,0.3);
  transform:translateX(3px);
}
.plist-row.self {
  border-left:3px solid var(--ochre);
  background:linear-gradient(90deg, rgba(194,156,90,0.16) 0%, rgba(194,156,90,0.03) 100%);
}
.plist-row.self:hover {
  background:linear-gradient(90deg, rgba(194,156,90,0.22) 0%, rgba(194,156,90,0.06) 100%);
  border-color:rgba(194,156,90,0.45);
}
.plist-row.self.on {
  border-color:var(--ochre);
  border-left:3px solid var(--ochre);
  box-shadow:0 4px 14px rgba(0,0,0,0.3);
}
.plist-row.mate {
  border-left:3px solid var(--moss);
  background:linear-gradient(90deg, rgba(127,174,134,0.14) 0%, rgba(127,174,134,0.03) 100%);
}
.plist-row.mate:hover {
  background:linear-gradient(90deg, rgba(127,174,134,0.2) 0%, rgba(127,174,134,0.06) 100%);
  border-color:rgba(127,174,134,0.45);
}
.plist-row.mate.on {
  border-color:var(--moss);
  border-left:3px solid var(--moss);
  box-shadow:0 4px 14px rgba(0,0,0,0.3);
}
.plist-row.dead { cursor:default; }
.plist-row.dead:hover { background:rgba(230,221,207,0.025); border-color:var(--line); transform:none; }
.plist-row.dead .plist-nick { color:var(--rice-3); text-decoration:line-through; text-decoration-color:rgba(133,123,110,0.6); }
.plist-row.unknown .plist-nick { color:var(--rice-3); font-style:italic; }
.plist-row.unknown .plist-team { color:#6e675e !important; }
.plist-row.extracted {
  cursor:default; opacity:0.6;
  border-color:transparent; background:transparent; transform:none;
}
.plist-row.extracted:hover { background:transparent; border-color:transparent; transform:none; }
.plist-row.extracted .plist-nick { color:var(--rice-2); }
.plist-team {
  flex:0 0 auto; font-weight:700; font-variant-numeric:tabular-nums;
  letter-spacing:0.02em; min-width:3.3em; position:relative;
  font-family:var(--f-brush); font-size:13px;
}
.plist-nick {
  flex:1 1 auto; min-width:0; color:var(--rice); font-weight:500;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  letter-spacing:0.02em;
}
.plist-kills {
  flex:0 0 auto; margin-left:auto; color:var(--rice-2); font:600 12px var(--f-num);
  font-variant-numeric:tabular-nums; min-width:1.5em; text-align:right;
  display:flex; align-items:center; justify-content:flex-end; gap:3px;
}
.plist-kill-ico { width:12px; height:12px; flex-shrink:0; opacity:0.8; overflow:visible; }
.plist-row.dead .plist-kills { color:var(--rice-3); }
.plist-self, .plist-bot {
  position:absolute; right:0; top:50%; width:12px; height:12px; margin-top:-6px;
  pointer-events:none; overflow:visible;
}
.plist-self { color:var(--ochre); }
.plist-bot { color:var(--rice-3); }
.plist-row.dead .plist-bot { color:var(--rice-3); }
.hint { font-size:11px; color:var(--rice-3); margin-top:6px; line-height:1.4; }
.chk-grid { display:grid; grid-template-columns:1fr 1fr; gap:3px 4px; margin-top:6px; }
.chk-grid .chk-row[title] { grid-column:1 / -1; }
.chk-row {
  display:flex; align-items:center; gap:7px; padding:4px 6px; border-radius:7px;
  font-size:12px; color:var(--rice-2); cursor:pointer;
  transition:background .18s ease, color .18s ease;
}
.chk-row:hover { background:var(--jade-wash); color:var(--rice); }
.chk-row input[type="checkbox"] {
  -webkit-appearance:none; appearance:none; flex:none; cursor:pointer;
  width:14px; height:14px; margin:0; position:relative;
  border:1.5px solid var(--line-2); border-radius:3px; background:rgba(8,12,13,0.35);
  transition:background .18s ease, border-color .18s ease;
}
.chk-row input[type="checkbox"]:checked { background:var(--jade-deep); border-color:var(--jade); }
.chk-row input[type="checkbox"]:checked::after {
  content:""; position:absolute; left:3.5px; top:0.5px; width:3.5px; height:7.5px;
  border:solid #f1ebe0; border-width:0 1.6px 1.6px 0; transform:rotate(45deg);
}
.chk-row input[type="checkbox"]:disabled { border-style:dashed; cursor:default; }
.chk-row input[type="checkbox"]:focus-visible { outline:2px solid var(--jade); outline-offset:1px; }
.q-filter { margin:2px -6px 0; }
.q-bar {
  width:100%; min-width:0; cursor:pointer; touch-action:none; user-select:none;
  outline:none;
}
.q-bar:focus-visible { box-shadow:0 0 0 2px rgba(111,176,184,0.4); border-radius:6px; }
.q-rail {
  height:7px; border-radius:99px; overflow:hidden;
  background:rgba(8,12,13,0.5); box-shadow:inset 0 0 0 1px var(--line);
}
.q-fill {
  height:100%; width:100%; opacity:0.72;
  background-image:linear-gradient(to right,
    #8a857c 0%, #4f8a5e 20%, #4f7fa0 40%,
    #8a62a0 60%, #b0904a 80%, #b0524a 100%);
  clip-path:inset(0 0 0 calc((var(--q, 1) - 1) * 100% / 6));
}
.q-slider {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); border:0; pointer-events:none;
}
.q-ticks {
  display:flex; margin-top:6px;
  font-family:var(--f-brush); font-size:12px; color:var(--rice-3); letter-spacing:0.02em; pointer-events:none;
}
.q-ticks span { flex:1 1 0; min-width:0; text-align:center; }
.q-ticks span.on { color:var(--rice); font-weight:700; }

.price-filter {
  display:flex; align-items:center; gap:6px; margin-top:9px;
  font-size:12px; color:var(--rice-2);
}
.price-filter .price-lbl { flex:0 0 auto; letter-spacing:0.04em; white-space:nowrap; }
.price-filter input[type="number"] {
  flex:1 1 auto; width:0; min-width:0; padding:5px 8px; font:600 12px var(--f-num);
  font-variant-numeric:tabular-nums;
}
.price-filter .price-save {
  flex:0 0 auto; width:auto; margin-top:0; padding:5px 11px;
  font-size:12px; letter-spacing:0.08em; white-space:nowrap;
}
.price-filter input[type="number"]::-webkit-outer-spin-button,
.price-filter input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.pickup-status { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:9px; padding-top:8px; border-top:1px solid var(--line); color:var(--rice-2); font-size:11px; line-height:1.4; }
.pickup-status span { min-width:0; font-variant-numeric:tabular-nums; }
.pickup-status button { flex:none; padding:3px 8px; border:1px solid var(--jade-line); border-radius:7px; background:var(--jade-wash); color:var(--jade-hi); font:inherit; cursor:pointer; }
.pickup-status button:hover { background:rgba(111,176,184,0.16); }
.pickup-status button[hidden] { display:none; }
.high-value-filter { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:8px; }
.high-value-filter .chk-row { margin:0; }
.high-value-filter select, .loot-ui-filter select { flex:0 0 auto; width:auto; min-width:100px; padding:4px 24px 4px 8px; font-size:11px; background-position:right 6px center; }
.loot-ui-filter { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:8px 0; color:var(--rice-2); font-size:12px; }

/* ───────── 提示卡 / 浮层 ───────── */
#tip {
  position:fixed; display:none; pointer-events:none; z-index:1100;
  width:max-content; min-width:0; max-width:220px;
  padding:11px 13px 9px;
  background:linear-gradient(180deg, rgba(28,39,41,0.96) 0%, rgba(20,28,30,0.97) 100%);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  color:var(--rice); font-size:12px; font-weight:500;
  border-radius:10px; border:1px solid var(--line-2);
  box-shadow:0 14px 34px rgba(0,0,0,0.55), inset 0 1px 0 rgba(230,221,207,0.05);
  line-height:1.4; white-space:normal;
}
#tip .tip-head {
  display:flex; flex-wrap:nowrap; align-items:baseline; gap:6px;
  min-width:0; margin-bottom:7px; padding-bottom:6px;
  border-bottom:1px solid var(--line);
  font-weight:650; letter-spacing:0.02em;
}
#tip.is-pinned {
  pointer-events:auto;
  left:50%; top:auto; bottom:max(12px, env(safe-area-inset-bottom));
  transform:translateX(-50%);
  box-sizing:border-box; width:min(360px, calc(100vw - 24px)); max-width:none;
  max-height:45vh; overflow:auto; overscroll-behavior:contain;
  padding:14px 44px 12px 14px; touch-action:pan-y;
}
#tip.is-pinned .tip-head { flex-wrap:wrap; }
#tip.is-pinned .tip-name { white-space:normal; overflow-wrap:anywhere; }
#tip .tip-close {
  position:absolute; right:2px; top:2px; width:40px; height:40px;
  border:0; border-radius:8px; background:transparent; color:var(--rice-2);
  font:24px sans-serif; cursor:pointer; touch-action:manipulation;
}
#tip .tip-close:hover { color:var(--rice); }
#tip .tip-close:focus-visible { outline:2px solid var(--jade); }
body.is-waiting #tip, body.is-locked #tip { display:none!important; }
#tip .tip-coord {
  margin:-2px 0 7px; color:var(--rice-3); font:500 10px var(--f-num);
  font-variant-numeric:tabular-nums; letter-spacing:.02em;
}
#tip .tip-hero { color:var(--rice); flex:0 0 auto; font-family:var(--f-brush); font-size:14px; letter-spacing:0.08em; }
#tip .tip-team { font-weight:650; flex:0 0 auto; }
#tip .tip-nick {
  color:var(--rice); font-weight:550;
  flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
#tip .tip-row { display:flex; align-items:center; gap:6px; min-width:0; min-height:20px; }
#tip .tip-ico { width:16px; height:16px; flex:0 0 16px; display:block; overflow:visible; }
#tip .tip-name { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#tip .tip-num { flex:0 0 auto; font:600 12px var(--f-num); font-variant-numeric:tabular-nums; text-align:right; padding-left:6px; }
#toast {
  position:fixed; bottom:calc(22px + var(--safe-b)); left:50%; transform:translateX(-50%) translateY(16px);
  background:linear-gradient(180deg, rgba(28,39,41,0.97) 0%, rgba(20,28,30,0.98) 100%);
  border:1px solid var(--jade-line); border-radius:999px;
  padding:9px 24px; font-size:13px; font-weight:600; color:var(--rice);
  opacity:0; transition:opacity .25s var(--ease), transform .25s var(--ease); pointer-events:none; z-index:9999;
  box-shadow:0 12px 30px rgba(0,0,0,0.5);
  letter-spacing:0.1em;
}
#toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
/* Desktop: keep bottom popups clear of the docked menu's 「设置」 tab. */
@media (min-width:721px) {
  #toast, #tip.is-pinned { bottom:calc(44px + var(--safe-b)); }
}

@media (max-width:720px) {
  :root { --sheet-h: min(86vh, 760px); --sheet-peek: 26px; }
  .topbar { height:calc(42px + var(--safe-t)); padding:var(--safe-t) 10px 0; gap:6px; }
  .topbar { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:36px 22px; height:calc(64px + var(--safe-t)); }
  .topbar-left { gap:7px; }
  .topbar-meta { gap:5px; }
  .topbar-meta .topbar-pill { padding:5px 8px; font-size:11px; }
  .fullscreen-toggle { padding:5px 7px; }
  .fullscreen-toggle span { display:none; }
  /* Room for the map name: a healthy connection shows only its green dot. */
  .topbar-conn:has(.conn-dot.ok) #connText { display:none; }
  .topbar-left .topbar-logo { gap:6px; }
  .topbar-logo .logo-brand { font-size:17px; }
  .topbar-logo .logo-tag { display:none; }
  .topbar-logo .logo-mark { width:20px; height:20px; font-size:12px; }
  .topbar-sep { display:none; }
  .topbar-stats { grid-row:2; grid-column:1/-1; }
  .evidence-hud { top:calc(72px + var(--safe-t)); }
  .map-tab { padding:3px 9px; font-size:12px; letter-spacing:0.08em; }
  .topbar-stats { justify-content:flex-start; gap:10px; pointer-events:auto; }
  .fs-val { font-size:12px; }
  .fs-lbl { font-size:10px; }

  .sidebar {
    top:auto; left:0; right:0; bottom:0; width:100%;
    max-height:var(--sheet-h);
    border-radius:18px 18px 0 0;
    border-left:none; border-right:none; border-bottom:none;
    transform:translateY(calc(100% - var(--sheet-peek) - var(--safe-b)));
    padding-bottom:var(--safe-b);
    transition:transform .34s var(--ease);
    touch-action:pan-y;
  }
  .sidebar:not(.collapsed) { transform:translateY(0); }
  /* Collapsed, the sheet's handle stays above the bottom edge to be pulled up. */
  .sidebar.collapsed { transform:translateY(calc(100% - var(--sheet-peek) - var(--safe-b))); }
  .sidebar.dragging { transition:none; }
  .sidebar-grab .grab-lab { display:none; }
  .sidebar-grab {
    display:block; flex-shrink:0; position:relative;
    width:100%; height:var(--sheet-peek); margin:0; padding:0;
    background:none; border:0; cursor:grab; touch-action:none;
    -webkit-tap-highlight-color:transparent;
  }
  .sidebar-grab::before {
    content:""; position:absolute; left:50%; top:11px;
    width:40px; height:4px; margin-left:-20px; border-radius:2px;
    background:var(--line-2); transition:background .18s;
  }
  .sidebar.dragging .sidebar-grab { cursor:grabbing; }
  .sidebar.dragging .sidebar-grab::before,
  .sidebar-grab:focus-visible::before { background:var(--jade-hi); }
  .sidebar-toggle { display:none; }
  body.settings-open .mp-value-list { z-index:998; }
  /* Keep bottom-anchored overlays clear of the sheet handle. */
  #tip.is-pinned { bottom:calc(var(--sheet-peek) + 8px + var(--safe-b)); }
  #toast { bottom:calc(var(--sheet-peek) + 16px + var(--safe-b)); }
  .plist-row { min-height:30px; }
  .leaflet-control-zoomslider.leaflet-bar.leaflet-control {
    z-index:998;
    width:38px;
    right:12px; bottom:calc(var(--sheet-peek) + 14px + var(--safe-b));
  }
  .leaflet-bar a { width:38px; height:34px; line-height:32px; font-size:19px; }
  .leaflet-control-zoomslider-wrap { width:38px; height:clamp(56px, 18vh, 140px); }
  .leaflet-control-zoomslider-knob { width:20px; height:7px; margin-left:-10px; }
  body.settings-open .leaflet-control-zoomslider { visibility:hidden; pointer-events:none; }
  .panel { padding:11px 15px; }
  .panel-title { margin-bottom:8px; }
  .wait-card { padding:22px 26px 20px; }
  .wait-brand { font-size:22px; }
}

/* 等待层上方只保留到期时间 */
body.is-waiting .topbar {z-index:2001; background:none;}
body.is-waiting .topbar-left {visibility:hidden; pointer-events:none;}
body.is-waiting .token-expiry {position:fixed; top:calc(10px + var(--safe-t)); right:16px;}
.token-expiry {
  visibility:visible !important; pointer-events:auto !important;
  display:inline-flex; align-items:center; gap:6px; flex:0 0 auto;
  font-size:12px; font-weight:500; color:var(--rice-2);
  letter-spacing:0.04em; white-space:nowrap; user-select:none;
  background:transparent; text-align:right; cursor:default;
}
.token-expiry-label {font-family:var(--f-brush); font-size:13px; color:var(--rice-3); letter-spacing:0.1em;}
.token-expiry-value {font:600 12px var(--f-num); font-variant-numeric:tabular-nums;}
.token-expiry[data-state="expired"] {color:var(--cinnabar-hi);}
.token-expiry[data-state="unknown"] {color:var(--rice-3);}
@media (max-width:720px) {
  .token-expiry {position:fixed; top:calc(70px + var(--safe-t)); right:8px; z-index:1800;}
}
@media (prefers-reduced-motion: reduce) {
  .wait-ring, .wait-drop, .conn-dot.ok { animation:none; }
  .btn, .ltog, .ltog::after, .sidebar, .sidebar-toggle { transition:none; }
}

/* ───────── 高价值物品浮动列表 ───────── */
.mp-value-list {
  position:fixed; top:80px; right:48px; z-index:1001;
  width:232px; max-width:calc(100vw - 28px);
  background:none !important; border:0 !important;
  box-shadow:none !important; backdrop-filter:none !important;
  pointer-events:none; opacity:0.88;
  color:#e7edf5; font:12px/1.4 var(--f-ui);
  text-shadow:0 1px 3px rgba(0,0,0,0.7), 0 0 8px rgba(0,0,0,0.45);
  transition:opacity 0.15s var(--ease);
}
.mp-value-list:hover, .mp-value-list:focus-within { opacity:1; }
.mp-value-list[hidden], body.is-waiting .mp-value-list, body.is-locked .mp-value-list {
  display:none !important;
}
.mp-value-list-head {
  display:flex; align-items:center; gap:6px; height:26px; margin-bottom:2px;
  color:#e5cba2; letter-spacing:0.06em; font-weight:650; font-size:11px;
  pointer-events:auto; background:none;
}
.mp-value-list-head small {
  font:11px ui-monospace, "Cascadia Mono", "Consolas", monospace;
  color:#b4c0ce;
}
.mp-value-sort {
  margin-left:auto; font-size:10px; font-weight:400;
  letter-spacing:0; color:#b4c0ce;
}
.mp-value-list-head button {
  border:0; background:none; color:#bdc7d4;
  font-size:19px; width:25px; height:26px; cursor:pointer;
  text-shadow:0 1px 4px rgba(0,0,0,0.7);
}
.mp-value-list-head button:hover { color:#f1dcb9; }
.mp-value-list-rows {
  max-height:min(160px, 25vh); overflow-y:auto; overflow-x:hidden;
  overscroll-behavior:contain; scrollbar-width:thin;
  scrollbar-color:rgba(223,195,149,0.4) transparent;
  pointer-events:auto; background:none;
}
.mp-value-row {
  display:grid; grid-template-columns:24px minmax(0, 1fr) auto;
  gap:6px; align-items:center; height:40px; min-height:40px;
  padding:3px 6px 3px 0; border-bottom:1px solid rgba(201,213,232,0.09);
  background:none !important; box-sizing:border-box;
}
.mp-value-rank {
  display:none; font:10px ui-monospace, monospace;
  color:var(--quality); align-self:center;
}
.mp-value-icon {
  position:relative; display:grid; place-items:center;
  width:24px; height:24px; border-radius:4px;
  background:rgba(18,24,32,0.13); color:var(--quality);
  text-shadow:0 1px 3px rgba(0,0,0,0.7);
}
.mp-value-icon::before {
  content:'◇'; font-size:22px;
}
.mp-value-icon img {
  position:absolute; width:100%; height:100%;
  object-fit:contain; filter:drop-shadow(0 2px 3px rgba(0,0,0,0.5));
}
.mp-value-icon.loaded::before { visibility:hidden; }
.mp-value-text {
  display:flex; flex-direction:column; gap:1px; min-width:0;
}
.mp-value-name {
  color:var(--quality); font-size:11px; font-weight:600;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.mp-value-meta {
  color:var(--quality); opacity:0.82; font-size:10px; white-space:nowrap;
}
.mp-value-row.taken .mp-value-name { text-decoration:line-through; opacity:0.75; }
.mp-value-row.taken .mp-value-meta { opacity:1; font-weight:600; }
.mp-value-price {
  color:var(--quality); font:600 12px ui-monospace, "Cascadia Mono", "Consolas", monospace;
  white-space:nowrap; padding-left:4px;
}
.mp-value-list-empty {
  font-size:11px; color:#a7b3c3; margin-top:12px; background:none;
}
@media (max-width:600px) {
  .mp-value-list { top:84px; right:12px; width:208px; }
  .mp-value-list-rows { max-height:min(120px, 24vh); }
  .mp-value-row { grid-template-columns:22px minmax(0, 1fr) auto; gap:5px; }
  .mp-value-icon { width:22px; height:22px; }
  .mp-value-price { font-size:11px; }
  .mp-value-list-head { font-size:10px; }
}
@media (prefers-reduced-motion: reduce) {
  .mp-value-list { transition:none; }
}

/* Account expired / frozen notice pushed by the router through the relay. */
.auth-notice {
  position:fixed; top:calc(58px + var(--safe-t)); left:50%; transform:translateX(-50%);
  z-index:2002; display:flex; align-items:flex-start; gap:12px;
  width:min(520px, calc(100vw - 24px)); padding:12px 12px 12px 14px;
  background:linear-gradient(135deg, rgba(42,22,18,0.96), rgba(28,18,16,0.96));
  border:1px solid rgba(201,85,63,0.55); border-left:3px solid var(--cinnabar);
  border-radius:var(--r); box-shadow:0 14px 36px rgba(0,0,0,0.55);
  color:var(--rice); pointer-events:auto;
  animation:auth-notice-in .32s var(--ease);
}
.auth-notice[hidden] { display:none; }
.auth-notice-seal {
  flex:0 0 auto; display:grid; place-items:center; width:30px; height:30px; margin-top:1px;
  border:1.5px solid var(--cinnabar-hi); border-radius:4px; color:var(--cinnabar-hi);
  font-family:var(--f-brush); font-size:17px; font-weight:700; transform:rotate(-6deg);
}
.auth-notice-body { flex:1 1 auto; min-width:0; }
.auth-notice-title {
  font-family:var(--f-brush); font-size:16px; font-weight:700; letter-spacing:0.12em; color:var(--cinnabar-hi);
}
.auth-notice-text { margin-top:4px; font-size:13px; line-height:1.55; color:var(--rice); }
.auth-notice-close {
  flex:0 0 auto; width:28px; height:28px; margin:-2px -2px 0 0; padding:0;
  border:1px solid transparent; border-radius:6px; background:transparent;
  color:rgba(230,221,207,0.75); font-size:20px; line-height:1; cursor:pointer;
}
.auth-notice-close:hover { color:var(--rice); background:rgba(201,85,63,0.18); border-color:rgba(201,85,63,0.45); }
.auth-notice-close:focus-visible { outline:2px solid var(--cinnabar-hi); outline-offset:2px; }
@keyframes auth-notice-in { from { opacity:0; transform:translate(-50%, -8px); } to { opacity:1; transform:translate(-50%, 0); } }
@media (max-width:760px) {
  .auth-notice { top:calc(70px + var(--safe-t)); }
}
@media (prefers-reduced-motion:reduce) { .auth-notice { animation:none; } }

/* ───────── 楼层切换 / 换图（照官方地图工具） ───────── */
.floor-bar {
  position:fixed; top:calc(56px + var(--safe-t)); left:50%; transform:translateX(-50%); z-index:1001;
  display:flex; align-items:center; gap:4px; padding:4px;
  border-radius:999px; background:rgba(18,26,28,0.82); border:1px solid var(--line-2);
  box-shadow:0 6px 18px rgba(0,0,0,0.35);
  backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur);
  max-width:calc(100vw - 24px); overflow-x:auto; scrollbar-width:none;
}
.floor-bar[hidden] { display:none; }
.floor-bar::-webkit-scrollbar { display:none; }
.floor-btn {
  min-width:36px; height:26px; padding:0 10px; border-radius:999px; cursor:pointer;
  font:700 12px/24px var(--f-num); letter-spacing:0.02em; white-space:nowrap;
  color:var(--rice-2); background:transparent; border:1px solid transparent;
  transition:background .18s, color .18s, border-color .18s;
}
.floor-btn.floor-whole { font-family:var(--f-brush); letter-spacing:0.08em; }
.floor-btn:hover { color:var(--rice); background:rgba(45,107,116,0.35); border-color:var(--jade-line); }
.floor-btn.act { color:#f1ebe0; background:var(--jade-deep); border-color:var(--jade); }
.floor-group {
  display:flex; align-items:center; gap:2px; padding:0 8px; height:26px;
  font:700 12px/26px var(--f-brush); letter-spacing:0.08em; color:var(--ochre); white-space:nowrap;
  border-left:1px solid var(--line-2); border-right:1px solid var(--line-2);
}
.floor-group-step {
  width:20px; height:22px; border:none; border-radius:6px; cursor:pointer;
  background:transparent; color:var(--rice-2); font:400 16px/22px var(--f-ui);
}
.floor-group-step:hover { background:rgba(45,107,116,0.35); color:var(--rice); }
.floor-group-name { padding:0 2px; }
body.is-waiting .floor-bar, body.is-locked .floor-bar { opacity:0.55; }

.map-tab.map-tab-switch { cursor:pointer; }
.map-tab.map-tab-switch::after { content:"▾"; margin-left:6px; font-size:10px; color:var(--rice-3); }
.map-tab.map-tab-switch:hover { border-color:var(--jade-line); background:rgba(45,107,116,0.35); }
.map-menu {
  position:fixed; z-index:1003; min-width:120px; padding:4px;
  display:flex; flex-direction:column; gap:2px;
  background:var(--paper-1); border:1px solid var(--line-2); border-radius:10px;
  box-shadow:0 10px 24px rgba(0,0,0,0.45);
  backdrop-filter:var(--blur); -webkit-backdrop-filter:var(--blur);
}
.map-menu[hidden] { display:none; }
.map-menu-item {
  text-align:left; padding:7px 12px; border-radius:7px; cursor:pointer;
  font:700 13px var(--f-brush); letter-spacing:0.12em; color:var(--rice-2);
  background:transparent; border:none;
}
.map-menu-item:hover { background:rgba(45,107,116,0.35); color:var(--rice); }
.map-menu-item.act { color:#f1ebe0; background:var(--jade-deep); }
.floor-hint { display:none; padding:0 8px; font:600 11px/26px var(--f-ui); color:var(--ochre); white-space:nowrap; letter-spacing:0.04em; }
.floor-bar.need-zoom .floor-hint { display:inline; }
.floor-bar.in-3d { display:none; }