/* ══════════════════════════════════════════════════════════════
   實價速查 PriceCheck — 台灣房屋 板橋雙十店
   色票依 DESIGN.md §6.1（橘色只當重點色，資料區一律中性色）
   ══════════════════════════════════════════════════════════════ */

:root{
  /* 品牌 */
  --brand:      #E8730C;   /* 台屋橘 — 只當重點色 */
  --brand-deep: #C25A05;   /* hover / 深階 */
  --brand-soft: #FFF3E8;   /* 極淡橘底：選中列、chip 背景 */

  /* 中性 */
  --ink:    #1B2430;
  --ink-2:  #5A6675;
  --ink-3:  #8B95A3;
  --line:   #E3E7EC;
  --line-2: #EFF2F5;
  --bg:     #F7F8FA;
  --surface:#FFFFFF;

  /* 狀態 */
  --ok:   #128A5B;
  --warn: #B7791F;
  --bad:  #C0392B;
  --ok-soft:   #E8F5EF;
  --warn-soft: #FDF4E3;
  --bad-soft:  #FBECEA;

  /* 尺寸 */
  --hdr-h: 54px;
  --r-sm: 5px;
  --r:    8px;
  --r-lg: 12px;
  --sh-1: 0 1px 2px rgba(27,36,48,.06), 0 1px 3px rgba(27,36,48,.05);
  --sh-2: 0 4px 12px rgba(27,36,48,.09), 0 1px 3px rgba(27,36,48,.06);
  --sh-3: 0 12px 36px rgba(27,36,48,.17);

  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs:    13px;
  --fs-md: 14px;
}

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

html{
  overflow-x:clip;                 /* 手機溢出保險（守則） */
  -webkit-text-size-adjust:100%;
}
html,body{ height:100%; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-size:var(--fs-md);
  line-height:1.5;
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",
              -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,p{ margin:0; }
button{ font:inherit; color:inherit; }
[hidden]{ display:none !important; }

/* ────────── 共用元件 ────────── */

.input{
  width:100%;
  min-width:0;
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:var(--surface);
  color:var(--ink);
  font-size:var(--fs-md);
  outline:none;
  transition:border-color .12s, box-shadow .12s;
}
.input:focus{ border-color:var(--brand); box-shadow:0 0 0 3px rgba(232,115,12,.14); }
.input::placeholder{ color:var(--ink-3); }
.input.sm{ padding:6px 8px; font-size:var(--fs); }
.input.num{ text-align:right; font-variant-numeric:tabular-nums; }
select.input{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%); background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%; background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:26px; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:7px 13px;
  border:1px solid transparent;
  border-radius:var(--r-sm);
  background:transparent;
  font-size:var(--fs);
  font-weight:600;
  line-height:1.3;
  white-space:nowrap;
  cursor:pointer;
  transition:background .12s, border-color .12s, color .12s, opacity .12s;
}
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.btn-brand{ background:var(--brand); color:#fff; }
.btn-brand:hover:not(:disabled){ background:var(--brand-deep); }
.btn-brand-soft{ background:var(--brand-soft); color:var(--brand-deep); border-color:#F6D9BE; }
.btn-brand-soft:hover{ background:#FDE8D5; }
.btn-outline{ border-color:var(--line); color:var(--ink-2); background:var(--surface); }
.btn-outline:hover{ border-color:var(--ink-3); color:var(--ink); }
.btn-ghost{ color:var(--ink-2); }
.btn-ghost:hover{ background:var(--line-2); color:var(--ink); }
.btn-lg{ padding:10px 16px; font-size:var(--fs-md); }
.btn-block{ display:flex; width:100%; }
.btn .ico{ font-size:13px; line-height:1; }

.icon-btn{
  width:28px; height:28px; display:grid; place-items:center;
  border:0; border-radius:var(--r-sm); background:transparent;
  color:var(--ink-2); font-size:20px; line-height:1; cursor:pointer;
}
.icon-btn:hover{ background:var(--line-2); color:var(--ink); }

.backdrop{
  position:fixed; inset:0; z-index:60;
  background:rgba(27,36,48,.34);
  backdrop-filter:blur(1px);
}

/* ────────── 登入頁 ────────── */

.login-wrap{
  min-height:100dvh;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:18px; padding:24px 18px 32px;
  background:
    radial-gradient(1100px 420px at 50% -14%, #FFF6EE 0%, rgba(255,246,238,0) 62%),
    var(--bg);
}
.login-card{
  width:100%; max-width:378px;
  padding:34px 30px 26px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--sh-2);
  text-align:center;
}
.login-store{
  font-size:23px; font-weight:800; letter-spacing:.02em; color:var(--ink);
}
.login-rule{
  width:46px; height:3px; margin:12px auto 0;
  background:var(--brand); border-radius:2px;
}
.login-sub{
  margin-top:11px; font-size:var(--fs-md); color:var(--ink-2); letter-spacing:.14em;
}
#loginForm{ margin-top:26px; text-align:left; }
.fld-label{
  display:block; margin-bottom:6px;
  font-size:var(--fs-sm); font-weight:600; color:var(--ink-2);
}
.login-input{ text-align:center; letter-spacing:.18em; padding:10px; }
.login-input::placeholder{ letter-spacing:normal; }
#loginBtn{ margin-top:14px; }
.login-msg{
  margin-top:14px; padding:8px 10px;
  border-radius:var(--r-sm);
  background:var(--bad-soft); color:var(--bad);
  font-size:var(--fs); text-align:center;
}
.login-msg.warn{ background:var(--warn-soft); color:var(--warn); }
.login-meta{
  margin-top:18px; padding-top:14px; border-top:1px solid var(--line-2);
  font-size:var(--fs-xs); color:var(--ink-3);
}
.login-credit{
  font-size:12px; color:var(--ink-3); letter-spacing:.03em;
}

/* ────────── App 外殼 ────────── */

.app{ display:flex; flex-direction:column; height:100dvh; }

.hdr{
  flex:0 0 auto; height:var(--hdr-h);
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:0 14px 0 0;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  position:relative; z-index:30;
}
.hdr-left{ display:flex; align-items:center; gap:11px; min-width:0; }
.hdr-bar{ width:4px; height:var(--hdr-h); background:var(--brand); flex:0 0 auto; }
.hdr-store{
  font-size:15px; font-weight:700; color:var(--ink); white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis;
}
.hdr-div{ width:1px; height:16px; background:var(--line); flex:0 0 auto; }
.hdr-app{ font-size:var(--fs); color:var(--ink-2); letter-spacing:.08em; white-space:nowrap; }
/* 桌機一排：店名 ｜（推到右側）功能鈕列 ｜ 身分+登出 */
.hdr-left{ order:1; }
.hdr-right{ display:flex; align-items:center; gap:4px; flex:0 0 auto; order:2; margin-left:auto; }
.hdr-session{ display:flex; align-items:center; gap:6px; flex:0 0 auto; order:3; }
.pill-num{
  display:inline-grid; place-items:center; min-width:16px; height:16px; padding:0 4px;
  margin-left:4px; border-radius:8px; background:var(--brand); color:#fff;
  font-size:10px; font-weight:700;
}

/* ────────── 商品模式分頁（建物 / 土地 / 車位）────────── */

.modebar{
  flex:0 0 auto;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:0 14px;
  background:var(--surface);
  border-bottom:1px solid var(--line);
}
.mode-tabs{ display:flex; gap:2px; }
.mode-tab{
  position:relative;
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 15px 8px;
  border:0; border-bottom:2px solid transparent;
  background:transparent;
  color:var(--ink-2); font-size:var(--fs-md); font-weight:600;
  cursor:pointer; white-space:nowrap;
  transition:color .12s, border-color .12s;
}
.mode-tab:hover{ color:var(--ink); }
.mode-tab.on{ color:var(--brand-deep); border-bottom-color:var(--brand); font-weight:700; }
.mode-tab .mt-ico{ font-size:14px; line-height:1; }
.mode-hint{
  font-size:var(--fs-sm); color:var(--ink-3);
  padding:3px 0; min-width:0; flex:1 1 auto;
}

/* ────────── 搜尋列 ────────── */

.searchbar{
  flex:0 0 auto;
  padding:11px 14px 12px;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  box-shadow:var(--sh-1);
  position:relative; z-index:20;
}
.sb-row{ display:flex; gap:8px; align-items:stretch; }
.sb-input-wrap{ position:relative; flex:1 1 auto; min-width:0; max-width:640px; }
.sb-ico{
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  font-size:16px; color:var(--ink-3); pointer-events:none;
}
.sb-input{ padding-left:32px; padding-right:30px; height:38px; }
.sb-clear{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; border:0; border-radius:50%;
  background:var(--line-2); color:var(--ink-2);
  font-size:15px; line-height:1; cursor:pointer;
}
.sb-clear:hover{ background:var(--line); color:var(--ink); }
.sb-go{ height:38px; padding:0 20px; flex:0 0 auto; }

.sb-row2{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin-top:10px;
}
.geo-chip{
  display:inline-flex; align-items:center; gap:7px;
  padding:5px 11px;
  border-radius:20px;
  background:var(--brand-soft);
  border:1px solid #F6D9BE;
  color:var(--brand-deep);
  font-size:var(--fs); font-weight:600;
  max-width:100%;
}
.geo-chip .gc-prec{
  font-weight:500; font-size:var(--fs-sm);
  padding-left:8px; margin-left:1px; border-left:1px solid #F0C79E;
  color:#9A6231;
}
.geo-chip.miss{ background:var(--bad-soft); border-color:#F2CFCA; color:var(--bad); }

.q-hint{ margin-top:6px; font-size:var(--fs-xs); color:var(--ink-3); }

/* 段／地號 chip：地號是選配，且只用於定位，不假裝它篩選了清單 */
.parcel-chip{
  display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:5px 11px; border-radius:20px;
  background:#F1F4F8; border:1px solid var(--line);
  color:var(--ink-2); font-size:var(--fs);
  max-width:100%;
}
.parcel-chip b{ color:var(--ink); }
.parcel-chip .pc-tag{
  padding-left:8px; border-left:1px solid var(--line);
  font-size:var(--fs-xs); color:var(--ink-3);
}

/* 距離滑桿 */
.radius-box{ flex:1 1 260px; max-width:420px; min-width:220px; }
.radius-head{ display:flex; align-items:baseline; justify-content:space-between; }
.radius-label{ font-size:var(--fs-sm); font-weight:600; color:var(--ink-2); }
.radius-out{
  font-size:15px; font-weight:800; color:var(--brand-deep);
  font-variant-numeric:tabular-nums;
}
.radius-out small{ font-size:var(--fs-sm); font-weight:600; color:var(--ink-2); }

.slider{
  -webkit-appearance:none; appearance:none;
  width:100%; height:20px; margin:1px 0 0; background:transparent; cursor:pointer;
}
.slider::-webkit-slider-runnable-track{ height:5px; border-radius:3px; background:var(--line); }
.slider::-moz-range-track{ height:5px; border-radius:3px; background:var(--line); }
.slider::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none;
  width:17px; height:17px; margin-top:-6px;
  border-radius:50%; background:var(--brand);
  border:2px solid #fff; box-shadow:0 1px 4px rgba(27,36,48,.28);
}
.slider::-moz-range-thumb{
  width:17px; height:17px; border-radius:50%; background:var(--brand);
  border:2px solid #fff; box-shadow:0 1px 4px rgba(27,36,48,.28);
}
.slider:focus-visible::-webkit-slider-thumb{ box-shadow:0 0 0 4px rgba(232,115,12,.22); }

.radius-ticks{ display:flex; gap:6px; margin-top:3px; }
.tick{
  flex:1 1 0; min-width:0;
  padding:2px 0; border:0; border-radius:3px;
  background:transparent; color:var(--ink-3);
  font-size:var(--fs-xs); font-variant-numeric:tabular-nums; cursor:pointer;
}
.tick:hover{ background:var(--line-2); color:var(--ink-2); }
.tick.on{ color:var(--brand-deep); font-weight:700; }

/* ────────── 版面 ────────── */

.layout{
  flex:1 1 auto; min-height:0;
  display:grid;
  grid-template-columns:302px minmax(0,1fr);
}

/* 篩選面板 */
.pane-filter{
  min-width:0; min-height:0;
  display:flex; flex-direction:column;
  background:var(--surface);
  border-right:1px solid var(--line);
}
.fp-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:11px 14px; border-bottom:1px solid var(--line);
}
.fp-scroll{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:4px 14px 20px; }

.fgroup{ padding:14px 0; border-bottom:1px solid var(--line-2); }
.fgroup:last-of-type{ border-bottom:0; }
.fg-title{
  display:flex; align-items:center; gap:5px;
  font-size:var(--fs-sm); font-weight:700; color:var(--ink);
  letter-spacing:.05em; margin-bottom:9px;
}
.fg-note{ font-size:var(--fs-xs); color:var(--ink-3); margin:-5px 0 8px; }
.fgroup-clean{
  margin-top:6px; padding:12px; border:1px solid var(--line);
  border-radius:var(--r); background:#FCFDFE;
}
/* 模式面板：切模式時整組換掉 */
.mode-panel{ display:block; }
.fg-explain{
  margin:12px 0 2px; padding:9px 11px;
  border-left:3px solid var(--line);
  background:#FAFBFC;
  font-size:var(--fs-sm); color:var(--ink-2); line-height:1.7;
}
.fg-explain b{ color:var(--ink); }
.chip .chip-n{
  margin-left:4px; font-style:normal; font-size:10px;
  color:var(--ink-3); font-weight:500;
}
.chip.on .chip-n{ color:var(--brand-deep); }
/* 「本路段置頂」只對建物模式有意義；土地／車位模式隱藏 */
body[data-mode="land"] #pinOnRoadWrap,
body[data-mode="park"] #pinOnRoadWrap{ display:none; }

.chips{ display:flex; flex-wrap:wrap; gap:5px; }
.chip{
  padding:4px 10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface);
  color:var(--ink-2);
  font-size:var(--fs); line-height:1.4;
  cursor:pointer;
  transition:all .12s;
}
.chip:hover{ border-color:var(--ink-3); color:var(--ink); }
.chip.on{
  background:var(--brand-soft); border-color:var(--brand); color:var(--brand-deep);
  font-weight:600;
}

.range-row{ display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:6px; }
.tilde{ color:var(--ink-3); font-size:var(--fs); }

.rr{ margin-bottom:9px; }
.rr:last-child{ margin-bottom:0; }
.rr-label{
  display:block; margin-bottom:4px;
  font-size:var(--fs-sm); color:var(--ink-2); font-weight:600;
}
.rr-label em{ font-style:normal; color:var(--ink-3); font-weight:400; }

/* toggle */
.toggle-row{ display:flex; gap:14px; flex-wrap:wrap; margin-top:11px; }
.toggle-col{ display:flex; flex-direction:column; gap:9px; }
.tg{
  display:inline-flex; align-items:center; gap:7px;
  font-size:var(--fs); color:var(--ink-2); cursor:pointer; user-select:none;
  white-space:nowrap;   /* 手機窄容器「含車位」曾被擠成直排一字一行 */
}
.tg input{ position:absolute; opacity:0; width:0; height:0; }
.tg-box{
  position:relative; flex:0 0 auto;
  width:32px; height:18px; border-radius:10px;
  background:#D3D9E0; transition:background .15s;
}
.tg-box::after{
  content:""; position:absolute; top:2px; left:2px;
  width:14px; height:14px; border-radius:50%; background:#fff;
  box-shadow:0 1px 2px rgba(27,36,48,.25);
  transition:transform .15s;
}
.tg input:checked + .tg-box{ background:var(--brand); }
.tg input:checked + .tg-box::after{ transform:translateX(14px); }
.tg input:focus-visible + .tg-box{ box-shadow:0 0 0 3px rgba(232,115,12,.2); }
.tg-clean{ font-weight:600; color:var(--ink); }
.tg-mini{ font-size:var(--fs-sm); }
.tg-mini .tg-box{ width:28px; height:16px; }
.tg-mini .tg-box::after{ width:12px; height:12px; }
.tg-mini input:checked + .tg-box::after{ transform:translateX(12px); }

/* segmented */
.seg{ display:inline-flex; border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; background:var(--surface); }
.seg button{
  padding:6px 12px; border:0; border-right:1px solid var(--line);
  background:transparent; color:var(--ink-2);
  font-size:var(--fs); cursor:pointer; white-space:nowrap;
}
.seg button:last-child{ border-right:0; }
.seg button:hover{ background:var(--line-2); }
.seg button.on{ background:var(--brand-soft); color:var(--brand-deep); font-weight:700; }
.seg-sm button{ padding:4px 9px; font-size:var(--fs-sm); }

/* 問號 tooltip */
.qmark{
  position:relative;
  display:inline-grid; place-items:center;
  width:14px; height:14px; border-radius:50%;
  background:var(--line); color:var(--ink-2);
  font-size:10px; font-weight:700; cursor:help; flex:0 0 auto;
}
.qmark:hover,.qmark:focus{ background:var(--ink-2); color:#fff; outline:none; }
.qmark::after{
  content:attr(data-tip);
  position:absolute; bottom:calc(100% + 7px); left:50%;
  transform:translateX(-46%);
  width:232px; padding:8px 10px;
  border-radius:var(--r-sm);
  background:var(--ink); color:#fff;
  font-size:var(--fs-sm); font-weight:400; line-height:1.55; text-align:left;
  letter-spacing:0;
  opacity:0; visibility:hidden; transition:opacity .12s;
  z-index:80; pointer-events:none;
  box-shadow:var(--sh-2);
}
.qmark:hover::after,.qmark:focus::after{ opacity:1; visibility:visible; }

.fp-credit{
  margin-top:20px; padding-top:12px; border-top:1px solid var(--line-2);
  font-size:11px; color:var(--ink-3); line-height:1.7; letter-spacing:.02em;
}
.fp-ver{ font-variant-numeric:tabular-nums; }

/* ────────── 右側主區 ────────── */

.pane-main{
  min-width:0; min-height:0;
  display:grid;
  grid-template-rows:minmax(0,42%) minmax(0,58%);
  gap:0;
}
.mtabs{ display:none; }

/* 地圖 */
.map-wrap{
  position:relative; min-height:0; background:#E8EBEF; border-bottom:1px solid var(--line);
  /* 🔴 z-index:0 + isolation：把 Leaflet 內部圖層（z 200~700）關進自己的疊層空間。
     沒有這兩行，地圖會蓋掉 z70 的估價/管理面板（2026-07-20 Hank 桌機實見破圖）。 */
  z-index:0; isolation:isolate;
}
.map{ position:absolute; inset:0; }
.leaflet-container{ font:inherit; background:#E8EBEF; }

.map-tools{
  position:absolute; top:10px; right:10px; z-index:500;
  display:flex; align-items:center; gap:6px;
}
.map-tools .seg{ box-shadow:var(--sh-1); }
.map-btn{
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 10px;
  border:1px solid var(--line); border-radius:var(--r-sm);
  background:var(--surface); color:var(--ink-2);
  font-size:var(--fs-sm); cursor:pointer; white-space:nowrap;
  box-shadow:var(--sh-1);
}
.map-btn:hover{ color:var(--ink); border-color:var(--ink-3); }

/* 疊加圖層選單 */
.layer-menu{
  position:absolute; top:46px; right:10px; z-index:600;
  width:min(268px,calc(100% - 20px));
  padding:10px 12px 11px;
  background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--sh-2);
  font-size:var(--fs);
}
.lm-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:6px; font-size:var(--fs-md);
}
.lm-cap{
  font-size:var(--fs-xs); font-weight:700; color:var(--ink-3);
  letter-spacing:.05em; margin:5px 0 4px;
}
.lm-row{
  display:grid; grid-template-columns:auto minmax(0,1fr);
  align-items:baseline; gap:0 7px;
  padding:4px 0; cursor:pointer; color:var(--ink-2);
}
.lm-row:hover{ color:var(--ink); }
.lm-row input{ margin:0; accent-color:var(--brand); }
.lm-row span{ font-size:var(--fs); }
.lm-row em{
  grid-column:2; font-style:normal;
  font-size:var(--fs-xs); color:var(--ink-3); line-height:1.5;
}
.lm-sep{ height:1px; background:var(--line-2); margin:7px 0 2px; }
.lm-note{
  margin-top:8px; padding-top:7px; border-top:1px solid var(--line-2);
  font-size:var(--fs-xs); color:var(--ink-3); line-height:1.6;
}

.map-legend{
  position:absolute; left:10px; bottom:14px; z-index:500;
  padding:8px 10px;
  background:rgba(255,255,255,.95);
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  box-shadow:var(--sh-1);
  font-size:var(--fs-xs); color:var(--ink-2);
}
.lg-title{ font-weight:700; color:var(--ink); margin-bottom:5px; }
.lg-row{ display:flex; align-items:center; gap:6px; line-height:1.9; }
.pin-demo{ width:11px; height:11px; border-radius:50%; flex:0 0 auto; display:inline-block; }
.p-rooftop{ background:#3D5068; border:1.5px solid #fff; box-shadow:0 0 0 1px #3D5068; }
.p-road{ background:#fff; border:2px solid #6C7C93; }
.p-district{ background:#fff; border:1.5px dashed #8B95A3; }
.p-multi{
  width:17px; height:17px; background:#3D5068; color:#fff;
  display:grid; place-items:center; font-size:9px; font-weight:700;
  border:1.5px solid #fff; box-shadow:0 0 0 1px #3D5068;
}
.p-center{ background:var(--brand); border:2px solid #fff; box-shadow:0 0 0 1.5px var(--brand); }
/* 土地：方框叢集（段中心），刻意用方形與圓形的門牌級標記區隔 */
.p-section{
  width:18px; height:18px; border-radius:3px;
  background:#5E7C93; color:#fff;
  display:grid; place-items:center; font-size:9px; font-weight:700;
  border:1.5px dashed #fff; box-shadow:0 0 0 1px #5E7C93;
}
.lg-note-sm{
  margin:5px 0 6px; padding-top:5px; border-top:1px solid var(--line-2);
  font-size:10px; color:var(--ink-3); line-height:1.6; max-width:190px;
}
.lg-colors{ margin-top:2px; }
.lg-colors .lg-row{ line-height:1.7; }
.lg-n{ margin-left:4px; color:var(--ink-3); font-variant-numeric:tabular-nums; }
.lg-fixed{ margin-top:5px; padding-top:5px; border-top:1px solid var(--line-2); }
.use-dot{
  display:inline-block; width:9px; height:9px; border-radius:2px;
  flex:0 0 auto; margin-right:5px; vertical-align:-1px;
  background:#9AA4B2;
}

.map-empty{
  position:absolute; inset:0; z-index:400;
  display:grid; place-items:center;
  background:#EDF0F3; color:var(--ink-3); font-size:var(--fs-md);
  pointer-events:none;
}

/* 地圖 marker（divIcon） */
.pc-pin{ border-radius:50%; box-sizing:border-box; transition:transform .1s; }
.pc-pin.pin-rooftop{ background:#3D5068; border:2px solid #fff; box-shadow:0 0 0 1px #3D5068,0 1px 3px rgba(0,0,0,.3); }
.pc-pin.pin-road{ background:#fff; border:2.5px solid #6C7C93; box-shadow:0 1px 3px rgba(0,0,0,.25); }
.pc-pin.pin-district{ background:rgba(255,255,255,.9); border:2px dashed #8B95A3; }
.pc-pin.pin-multi{
  background:#3D5068; color:#fff; border:2px solid #fff;
  display:grid; place-items:center; font-size:10px; font-weight:700;
  box-shadow:0 0 0 1px #3D5068,0 1px 3px rgba(0,0,0,.3);
}
.pc-pin.pin-multi.mp-road{ background:#6C7C93; }
.pc-pin.pin-multi.mp-district{ background:#9AA4B2; border-style:dashed; }
.pc-pin.is-active{ background:var(--brand) !important; border-color:#fff !important; box-shadow:0 0 0 2px var(--brand),0 0 0 7px rgba(232,115,12,.28) !important; transform:scale(1.12); z-index:900 !important; }
.pc-center-pin{
  width:20px; height:20px; border-radius:50%;
  background:var(--brand); border:3px solid #fff;
  box-shadow:0 0 0 2px var(--brand),0 2px 8px rgba(0,0,0,.3);
}

/* 土地叢集標記：方框 + 段名標籤。
   刻意不做單筆 pin、不做抖散位移 —— 段中心不是該筆土地的實際位置。 */
.pc-land{ position:relative; width:30px; height:30px; }
.pc-land .pl-box{
  position:absolute; top:0; left:0;
  width:30px; height:30px; border-radius:4px;
  background:var(--lc,#5E7C93); color:#fff;
  display:grid; place-items:center;
  font-size:12px; font-weight:800; font-variant-numeric:tabular-nums;
  border:2px dashed rgba(255,255,255,.92);
  box-shadow:0 0 0 1px var(--lc,#5E7C93),0 2px 6px rgba(0,0,0,.3);
  transition:transform .1s;
}
/* 同一叢含多種編定 → 邊框改雙線，提示這不是單一編定 */
.pc-land .pl-box.pl-mixed{ border-style:double; border-width:3px; }
.pc-land .pl-tag{
  position:absolute; top:32px; left:50%; transform:translateX(-50%);
  padding:1px 5px; border-radius:3px;
  background:rgba(255,255,255,.94); color:var(--ink);
  border:1px solid var(--line);
  font-size:10px; font-weight:700; line-height:1.6;
  white-space:nowrap; pointer-events:none;
  box-shadow:0 1px 2px rgba(27,36,48,.18);
}
.pc-land.is-active .pl-box{
  box-shadow:0 0 0 2px var(--brand),0 0 0 7px rgba(232,115,12,.28);
  transform:scale(1.1);
}
.pop-warn{
  color:#8A5B12; background:var(--warn-soft);
  padding:6px 8px; border-radius:var(--r-sm); line-height:1.6;
}
.pop-warn b{ color:#7A4E0C; }

.leaflet-popup-content-wrap{ border-radius:var(--r); box-shadow:var(--sh-2); }
.leaflet-popup-content{ margin:11px 13px; font-size:var(--fs); line-height:1.6; max-height:280px; overflow:auto; }
.pop-addr{ font-weight:700; color:var(--ink); font-size:var(--fs-md); margin-bottom:3px; }
.pop-prec{ font-size:var(--fs-xs); color:var(--ink-3); margin-bottom:7px; }
.pop-item{ padding:7px 0; border-top:1px solid var(--line-2); cursor:pointer; }
.pop-item:first-of-type{ border-top:0; }
.pop-item:hover{ background:var(--brand-soft); }
.pop-l1{ display:flex; justify-content:space-between; gap:10px; font-weight:600; }
.pop-l2{ color:var(--ink-2); font-size:var(--fs-sm); }
.pop-price{ color:var(--brand-deep); font-variant-numeric:tabular-nums; }
.pop-more{ font-size:var(--fs-xs); color:var(--ink-3); padding-top:6px; }

/* ────────── 清單區 ────────── */

.list-wrap{
  min-height:0; min-width:0; display:flex; flex-direction:column;
  background:var(--surface);
  overflow-x:hidden;              /* 表格寬度只准在 .tbl-scroll 內部捲，不准撐爆版面（手機 375px 實測） */
}

.banner{
  flex:0 0 auto;
  padding:8px 14px;
  font-size:var(--fs); font-weight:600;
  display:flex; align-items:center; gap:7px;
}
.banner-warn{ background:var(--warn-soft); color:#8A5B12; border-bottom:1px solid #F0E0C0; }
.banner-info{
  background:#F1F4F8; color:var(--ink-2); border-bottom:1px solid var(--line);
  font-weight:500; line-height:1.6; align-items:flex-start;
}
.banner::before{ content:"◆"; font-size:9px; }
.banner-info::before{ color:var(--ink-3); margin-top:5px; }

.summary{
  flex:0 0 auto;
  display:flex; align-items:center; flex-wrap:wrap; gap:0 20px;
  padding:9px 14px;
  border-bottom:1px solid var(--line);
  background:#FCFDFE;
}
.sm-item{ display:flex; align-items:baseline; gap:5px; font-size:var(--fs); color:var(--ink-2); }
.sm-item b{ font-size:15px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; }
.sm-item.hi b{ color:var(--brand-deep); }
.sm-sep{ width:1px; height:14px; background:var(--line); }
.sm-note{ font-size:var(--fs-sm); color:var(--ink-3); margin-left:auto; }
.sm-plain{ color:var(--ink-3); font-size:var(--fs-sm); }

/* 分組統計（土地依使用編定 / 車位依類別；刻意不給單一中位數） */
.land-groups{
  flex:0 0 auto;
  border-bottom:1px solid var(--line);
  background:var(--surface);
}
.lgp-head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:10px; flex-wrap:wrap;
  padding:8px 14px 6px;
}
.lgp-t{ font-size:var(--fs-sm); font-weight:700; color:var(--ink); letter-spacing:.04em; }
.lgp-basis{ font-size:var(--fs-xs); color:var(--ink-3); }
.lgp-scroll{ overflow-x:auto; max-height:172px; overflow-y:auto; }
.lgp-tbl{
  width:100%; min-width:380px;
  border-collapse:separate; border-spacing:0;
  font-size:var(--fs);
}
.lgp-tbl thead th{
  position:sticky; top:0; z-index:2;
  padding:5px 14px; background:#F4F6F8;
  border-bottom:1px solid var(--line);
  font-size:var(--fs-xs); font-weight:700; color:var(--ink-2);
  text-align:left; white-space:nowrap;
}
.lgp-tbl thead th small{ font-weight:400; color:var(--ink-3); margin-left:2px; }
.lgp-tbl thead th.n,.lgp-tbl td.n{ text-align:right; }
.lgp-tbl td{
  padding:5px 14px; border-bottom:1px solid var(--line-2);
  white-space:nowrap; font-variant-numeric:tabular-nums;
}
.lgp-tbl td.hi{ font-weight:700; color:var(--brand-deep); }
.lgp-tbl tbody tr:last-child td{ border-bottom:0; }

.tbl-scroll{ flex:1 1 auto; min-height:0; overflow:auto; position:relative; }

.tbl{ width:100%; border-collapse:separate; border-spacing:0; font-size:var(--fs); }
.tbl thead th{
  position:sticky; top:0; z-index:5;
  padding:8px 10px;
  background:#F4F6F8;
  border-bottom:1px solid var(--line);
  color:var(--ink-2); font-size:var(--fs-sm); font-weight:700;
  text-align:left; white-space:nowrap; cursor:pointer; user-select:none;
}
.tbl thead th small{ font-weight:400; color:var(--ink-3); margin-left:2px; }
.tbl thead th:hover{ background:#EDF0F3; color:var(--ink); }
.tbl thead th.n{ text-align:right; }
.tbl thead th i{
  display:inline-block; width:8px; margin-left:3px;
  font-style:normal; color:var(--brand); opacity:0;
}
.tbl thead th.sorted i{ opacity:1; }
.tbl tbody td{
  padding:7px 10px;
  border-bottom:1px solid var(--line-2);
  color:var(--ink); vertical-align:middle;
}
.tbl tbody tr:nth-child(even) td{ background:#FBFCFD; }
.tbl tbody tr{ cursor:pointer; }
.tbl tbody tr:hover td{ background:#F2F5F8; }
.tbl tbody tr.is-active td{ background:var(--brand-soft); box-shadow:inset 3px 0 0 var(--brand); }
.tbl td.n{ text-align:right; font-variant-numeric:tabular-nums; }
.tbl td.s{ white-space:nowrap; color:var(--ink-2); }
.td-addr{ min-width:210px; }
.td-addr .ad{ display:block; }
.td-price{ font-weight:700; }
.td-unit{ font-weight:700; color:var(--brand-deep); }
.dim{ color:var(--ink-3); }

.badge{
  display:inline-block; padding:1px 6px; margin-left:5px;
  border-radius:3px; font-size:10px; font-weight:700; line-height:1.6;
  vertical-align:1px; white-space:nowrap;
}
.bd-road{ background:var(--brand-soft); color:var(--brand-deep); border:1px solid #F2CFA8; }
.bd-special{ background:var(--warn-soft); color:var(--warn); }
.bd-cancel{ background:var(--bad-soft); color:var(--bad); }
.bd-park{ background:#EEF1F5; color:var(--ink-2); }
.bd-presale{ background:#EAF2FB; color:#2A6099; }
.bd-rent{ background:var(--ok-soft); color:var(--ok); }
.bd-com{ background:#F3F0FA; color:#5B4B96; }
.bd-sec{ background:#EDF1F5; color:#4B6478; border:1px solid #DCE3EA; }
.use-sub{ margin-left:5px; font-size:var(--fs-xs); }
.tbl thead th.no-sort{ cursor:default; }
.tbl thead th.no-sort:hover{ background:#F4F6F8; color:var(--ink-2); }

.state-box{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:5px; padding:24px; text-align:center;
  background:var(--surface);
}
.state-box.err .state-ico{ color:var(--bad); }
.state-ico{ font-size:30px; color:var(--ink-3); line-height:1; margin-bottom:4px; }
.state-title{ font-size:var(--fs-md); font-weight:700; color:var(--ink); }
.state-desc{ font-size:var(--fs); color:var(--ink-2); max-width:340px; }
.spinner{
  width:26px; height:26px; border-radius:50%;
  border:2.5px solid var(--line); border-top-color:var(--brand);
  animation:spin .7s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

.list-foot{
  flex:0 0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:6px 14px;
  border-top:1px solid var(--line);
  background:#FCFDFE;
}
.list-count{ font-size:var(--fs-sm); color:var(--ink-3); font-variant-numeric:tabular-nums; }

.loading-bar{
  position:fixed; top:0; left:0; right:0; height:2px; z-index:200;
  background:linear-gradient(90deg,transparent,var(--brand),transparent);
  background-size:44% 100%; background-repeat:no-repeat;
  animation:slide 1s linear infinite;
}
@keyframes slide{ 0%{ background-position:-44% 0; } 100%{ background-position:144% 0; } }

/* ────────── 估價側欄 ────────── */

.sheet{
  position:fixed; top:0; right:0; bottom:0; z-index:70;
  width:min(462px,100%);
  display:flex; flex-direction:column;
  background:var(--surface);
  border-left:1px solid var(--line);
  box-shadow:var(--sh-3);
}
.sheet-head{
  flex:0 0 auto;
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
  padding:14px 16px; border-bottom:1px solid var(--line);
}
.sheet-title{ font-size:15px; }
.sheet-sub{ font-size:var(--fs-sm); color:var(--ink-3); margin-top:2px; line-height:1.5; }
.sheet-body{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:14px 16px 28px; }

.val-form{ padding-bottom:14px; border-bottom:1px solid var(--line); }
.val-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9px 10px; margin-bottom:9px; }
.val-park{ display:flex; align-items:center; gap:10px; }
.val-park .input{ flex:1 1 auto; }
#btnRunVal{ margin-top:12px; }
.val-hint{ margin-top:7px; font-size:var(--fs-xs); color:var(--ink-3); text-align:center; }

.val-result{ padding-top:14px; }
.vr-block{ margin-bottom:16px; }
.vr-h{
  display:flex; align-items:center; gap:7px;
  font-size:var(--fs-sm); font-weight:700; color:var(--ink-2);
  letter-spacing:.05em; margin-bottom:7px;
}
.range-card{
  padding:11px 13px; margin-bottom:8px;
  border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface);
}
.range-card.primary{ border-color:var(--brand); background:var(--brand-soft); }
.rc-label{ font-size:var(--fs-sm); font-weight:700; color:var(--ink-2); display:flex; justify-content:space-between; }
.rc-label .rc-tag{ font-weight:500; color:var(--ink-3); font-size:var(--fs-xs); }
.rc-val{
  margin-top:3px; font-size:19px; font-weight:800; color:var(--ink);
  font-variant-numeric:tabular-nums; letter-spacing:-.01em;
}
.range-card.primary .rc-val{ color:var(--brand-deep); }
.rc-val small{ font-size:var(--fs); font-weight:600; color:var(--ink-2); }
.rc-sub{ margin-top:2px; font-size:var(--fs-sm); color:var(--ink-2); font-variant-numeric:tabular-nums; }

.conf{
  display:inline-flex; align-items:center; gap:6px;
  padding:3px 10px; border-radius:14px;
  font-size:var(--fs); font-weight:700;
}
.conf-高{ background:var(--ok-soft); color:var(--ok); }
.conf-中{ background:var(--warn-soft); color:var(--warn); }
.conf-低{ background:var(--bad-soft); color:var(--bad); }

.kv{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:3px 12px; font-size:var(--fs); }
.kv dt{ color:var(--ink-2); white-space:nowrap; }
.kv dd{ margin:0; color:var(--ink); }

.adj-tbl{ width:100%; border-collapse:collapse; font-size:var(--fs); }
.adj-tbl td{ padding:5px 0; border-bottom:1px solid var(--line-2); vertical-align:top; }
.adj-tbl td:last-child{ text-align:right; font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap; }
.adj-up{ color:var(--ok); }
.adj-down{ color:var(--bad); }
.adj-note{ display:block; font-size:var(--fs-xs); color:var(--ink-3); font-weight:400; }

.narr{
  padding:11px 13px; border-radius:var(--r);
  background:#FAFBFC; border:1px solid var(--line);
  font-size:var(--fs); line-height:1.85; color:var(--ink);
  white-space:pre-wrap;
}
.notice{
  padding:8px 11px; border-radius:var(--r-sm); margin-bottom:9px;
  font-size:var(--fs); line-height:1.6;
}
.notice-warn{ background:var(--warn-soft); color:#8A5B12; }
.notice-info{ background:#F1F4F8; color:var(--ink-2); }
.disclaimer{ font-size:var(--fs-xs); color:var(--ink-3); line-height:1.7; }
.reasons{ margin:6px 0 0; padding-left:17px; font-size:var(--fs-sm); color:var(--ink-2); line-height:1.8; }

/* ────────── modal ────────── */

.modal{
  position:fixed; z-index:70;
  top:50%; left:50%; transform:translate(-50%,-50%);
  width:min(392px,calc(100% - 28px));
  background:var(--surface);
  border-radius:var(--r-lg);
  box-shadow:var(--sh-3);
  overflow:hidden;
}
.modal-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:13px 16px; border-bottom:1px solid var(--line);
}
.modal-body{ padding:15px 16px; }
.modal-note{ font-size:var(--fs-sm); color:var(--ink-3); margin-bottom:12px; line-height:1.6; }
.modal-foot{
  display:flex; justify-content:flex-end; gap:8px;
  padding:11px 16px; border-top:1px solid var(--line); background:#FCFDFE;
}

.toast{
  position:fixed; left:50%; bottom:26px; transform:translateX(-50%);
  z-index:120;
  padding:9px 17px; border-radius:20px;
  background:var(--ink); color:#fff;
  font-size:var(--fs); box-shadow:var(--sh-2);
  max-width:calc(100% - 32px);
}
.toast.bad{ background:var(--bad); }

/* ────────── RWD ────────── */

.only-mobile{ display:none !important; }
.only-mobile-inline{ display:none; }

@media (max-width:1240px){
  .layout{ grid-template-columns:274px minmax(0,1fr); }
  .hide-sm{ display:none; }
}

@media (max-width:900px){
  :root{ --hdr-h:50px; }

  .only-mobile{ display:flex !important; }
  .only-mobile-inline{ display:inline; }

  /* ── 手機 header 兩排（Hank 拍板 2026-07-20）──
     第一排：店名完整顯示 + 身分 + 登出
     第二排：功能鈕平均分布（篩選／估價軍師／報告／設定／列印） */
  .hdr{ flex-wrap:wrap; height:auto; padding:0 10px 7px 0; }
  .hdr-left{ flex:1 1 auto; min-height:46px; }
  .hdr-bar{ height:46px; }
  .hdr-store{ font-size:14.5px; }
  .hdr-session{ min-height:46px; padding-right:2px; }
  .hdr-right{
    order:4; flex-basis:100%;
    justify-content:space-between; gap:0;
    padding:7px 0 0 8px; margin-left:0;
    border-top:1px solid var(--line);
  }
  /* 5 顆鈕要在 360px 也塞得下（同仁視角「我的報告」較寬、要留裕度） */
  .hdr-right .btn{ padding:7px 5px; font-size:12.5px; letter-spacing:0; }
  .hdr-right .btn .ico{ margin-right:1px; }

  .layout{ grid-template-columns:minmax(0,1fr); }

  /* 篩選 → 抽屜 */
  .pane-filter{
    position:fixed; z-index:65; top:0; bottom:0; left:0;
    width:min(320px,88vw);
    border-right:1px solid var(--line);
    box-shadow:var(--sh-3);
    transform:translateX(-101%);
    transition:transform .22s ease;
  }
  .pane-filter.open{ transform:none; }

  /* 地圖 / 清單 分頁切換，不並排 */
  .pane-main{ grid-template-rows:auto minmax(0,1fr); }
  .mtabs{
    display:flex; gap:0;
    background:var(--surface); border-bottom:1px solid var(--line);
  }
  .mtab{
    flex:1 1 0; padding:9px 0; border:0; background:transparent;
    color:var(--ink-2); font-size:var(--fs-md); font-weight:600; cursor:pointer;
    border-bottom:2px solid transparent;
  }
  .mtab.on{ color:var(--brand-deep); border-bottom-color:var(--brand); }

  .map-wrap{ border-bottom:0; }
  .pane-main[data-mtab="list"] .map-wrap{ display:none; }
  .pane-main[data-mtab="map"]  .list-wrap{ display:none; }

  .searchbar{ padding:9px 11px 10px; }
  .sb-input-wrap{ max-width:none; }
  .sb-go{ padding:0 15px; }
  .sb-row2{ gap:9px; }
  .radius-box{ flex:1 1 100%; max-width:none; }

  .summary{ gap:0 13px; padding:8px 11px; }
  .sm-item b{ font-size:14px; }
  .sm-note{ margin-left:0; flex:1 1 100%; }
  .sm-sep{ display:none; }

  .tbl{ font-size:var(--fs-sm); }
  .tbl thead th,.tbl tbody td{ padding:7px 8px; }
  .td-addr{ min-width:160px; }

  .qmark::after{ width:min(232px,62vw); transform:translateX(-70%); }

  .sheet{ width:100%; top:auto; height:92dvh; border-left:0; border-radius:var(--r-lg) var(--r-lg) 0 0; }
  .map-legend{ font-size:10px; padding:6px 8px; max-width:52vw; }
  .lg-note-sm{ max-width:none; }

  /* 模式分頁：手機一樣三個並排（這是主導覽，不能收進抽屜） */
  .modebar{ padding:0 11px; gap:0; }
  .mode-tabs{ flex:1 1 100%; }
  .mode-tab{ flex:1 1 0; justify-content:center; }
  .mode-hint{ flex:1 1 100%; padding:5px 0 7px; font-size:var(--fs-xs); }

  .layer-menu{ right:8px; top:44px; width:min(268px,calc(100vw - 26px)); }
  .land-groups .lgp-scroll{ max-height:148px; }
}

/* 窄機（360 級、多數 Android 的 CSS 寬）：五顆功能鈕再縮一階 */
@media (max-width:392px){
  .hdr-right .btn{ padding:7px 3px; font-size:12px; }
  .hdr-right .btn .ico{ display:none; }   /* 圖示讓位給文字：文字才是可讀的部分 */
}

@media (max-width:560px){
  .hdr-app{ display:none; }
  .hdr-div{ display:none; }
  .hdr-store{ font-size:14px; }
  .btn{ padding:7px 9px; }
  .val-grid{ grid-template-columns:minmax(0,1fr); }
  /* 手機表格：收掉次要欄位，保留關鍵決策欄。
     欄位改由 class 標記（三種模式欄數不同，nth-child 會收錯欄） */
  .tbl th.col-opt,.tbl td.col-opt{ display:none; }

  .mode-tab{ padding:8px 11px; font-size:var(--fs); }
  .lgp-head{ padding:7px 11px 5px; }
  .lgp-tbl thead th,.lgp-tbl td{ padding:5px 11px; }
}

/* ────────── 報告／管理面板 ────────── */

/* 連線燈號＋延遲（header） */
.net-stat{
  display:inline-flex; align-items:center; gap:5px;
  font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.net-dot{ width:8px; height:8px; border-radius:50%; background:#C3CBD4; flex:0 0 auto; }
.net-dot.ok{   background:var(--ok);   box-shadow:0 0 0 3px rgba(18,138,91,.14); }
.net-dot.warn{ background:var(--warn); box-shadow:0 0 0 3px rgba(183,121,31,.14); }
.net-dot.bad{  background:var(--bad);  box-shadow:0 0 0 3px rgba(192,57,43,.16); }
.net-dot.off{  background:#C3CBD4; }

/* 點地圖查詢提示（地圖左下、圖例上方） */
.map-hint{
  position:absolute; left:10px; bottom:118px; z-index:500;
  padding:4px 9px; border-radius:7px;
  background:rgba(255,255,255,.88); border:1px solid var(--line);
  font-size:10.5px; color:var(--ink-2); pointer-events:none;
}

.hdr-who{
  font-size:var(--fs-sm); color:var(--ink-2); font-weight:600;
  max-width:88px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.mg-tabs{
  display:flex; gap:2px; padding:0 14px;
  border-bottom:1px solid var(--line); background:var(--surface);
  flex:0 0 auto;
}
.mg-tab{
  border:0; background:transparent; cursor:pointer;
  padding:9px 13px 8px; font-size:var(--fs);
  color:var(--ink-2); border-bottom:2px solid transparent;
}
.mg-tab.on{ color:var(--brand-deep); border-bottom-color:var(--brand); font-weight:700; }
.mg-toolbar{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin-bottom:10px;
}
.mg-hint{ font-size:var(--fs-xs); color:var(--ink-3); line-height:1.6; margin:2px 0 10px; }
.mg-adduser{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:6px; }
.mg-list{ display:flex; flex-direction:column; gap:6px; }
.mg-empty{
  padding:26px 10px; text-align:center;
  color:var(--ink-3); font-size:var(--fs-sm);
}
.mg-row{
  display:flex; align-items:center; gap:8px;
  padding:9px 11px; border:1px solid var(--line); border-radius:9px;
  background:var(--surface);
}
.mg-row.slim{ padding:7px 11px; }
.mg-row.off{ opacity:.55; }
.mg-row-main{ flex:1 1 auto; min-width:0; }
.mg-row-title{
  font-size:var(--fs); font-weight:600; color:var(--ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.mg-row-sub{ font-size:var(--fs-xs); color:var(--ink-3); margin-top:2px; }
.mg-kind{ color:var(--brand-deep); font-weight:600; }
.mg-off-tag{
  font-size:var(--fs-xs); color:var(--bad); font-weight:600;
  border:1px solid currentColor; border-radius:5px; padding:0 5px;
}

@media print{
  /* 螢幕介面在列印時全部隱藏，交給 report.js + print.css */
  .app,.login-wrap,.sheet,.modal,.backdrop,.toast,.loading-bar{ display:none !important; }
}