/* m_base.css — 手机端结构骨架与组件布局
 * 只负责「结构与位置」，颜色/圆角/阴影由各主题 CSS 覆盖 token。
 * 基准：390×844，跟随 iPhone 安全区。
 */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: contain;
}

button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
h1, h2, h3, p { margin: 0; }
b, strong { font-weight: 700; }
i, em { font-style: normal; }
svg { display: block; }
[hidden] { display: none !important; }

.app { min-height: 100vh; }

/* ---------------- 顶部 ---------------- */
.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  padding-top: env(safe-area-inset-top);
  background: var(--hdr-bg);
  border-bottom: 1px solid var(--line);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
}
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .topbar { background: var(--card); }
}

.hdr {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 52px;
  padding: 0 14px;
}
.hdr .brand { display: flex; align-items: center; gap: 9px; min-width: 0; flex: 1; }
.hdr .logo {
  width: 34px; height: 34px; flex: 0 0 auto;
  border-radius: 11px;
  display: grid; place-items: center;
  font-size: 15px; font-weight: 700; color: #fff;
  background: var(--logo-bg);
  letter-spacing: 0;
}
.hdr .tt { min-width: 0; }
.hdr .ttl {
  font-size: 15px; font-weight: 650; letter-spacing: -.2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hdr .sub {
  font-size: 11px; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: flex; align-items: center; gap: 5px;
}
.dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ok); flex: 0 0 auto; }
.dot.err { background: var(--bad); }
.dot.warn { background: var(--warn); }
.dot.load { background: var(--muted); animation: blink 1s infinite; }
@keyframes blink { 50% { opacity: .3; } }

.hdr .acts { display: flex; align-items: center; gap: 2px; flex: 0 0 auto; }
.ibtn {
  min-width: 40px; height: 40px; padding: 0 8px;
  display: inline-flex; align-items: center; justify-content: center; gap: 3px;
  font-size: 12px; font-weight: 600; color: var(--ink2);
  border-radius: 10px;
}
.ibtn:active { background: var(--chip-bg); }
.ibtn svg { width: 19px; height: 19px; }
.ibtn.spin svg { animation: spin .9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------------- 门店切换 ---------------- */
.hotels {
  display: flex; gap: 8px;
  padding: 2px 14px 10px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
}
.hotels::-webkit-scrollbar { display: none; }
.chip {
  flex: 0 0 auto;
  height: 34px; padding: 0 14px;
  display: inline-flex; align-items: center; gap: 5px;
  border-radius: 999px;
  font-size: 13px; font-weight: 600;
  color: var(--chip-ink);
  background: var(--chip-bg);
  border: 1px solid var(--line);
  scroll-snap-align: start;
  white-space: nowrap;
}
.chip .n { font-size: 11px; opacity: .7; font-variant-numeric: tabular-nums; }
.chip.on {
  color: var(--accent-ink);
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: var(--chip-shadow, none);
}
.chip.on .n { opacity: .85; }

/* ---------------- 内容区 ---------------- */
.page {
  padding: 12px 14px calc(78px + env(safe-area-inset-bottom));
  display: flex; flex-direction: column; gap: 12px;
}

.mbanner {
  border-radius: var(--r-inner);
  padding: 10px 12px;
  font-size: 12.5px; line-height: 1.55;
  background: var(--warn-bg); color: var(--warn-ink);
  border: 1px solid var(--warn-line);
}
.mbanner.err { background: var(--bad-bg); color: var(--bad-ink); border-color: var(--bad-line); }
.mbanner.info { background: var(--accent-soft); color: var(--accent-deep); border-color: var(--accent-soft); }
.mbanner b { font-weight: 700; }
.mbanner .lnk { text-decoration: underline; }

/* ---------------- KPI ---------------- */
.kpis { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kpis.k4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kpi {
  position: relative;
  padding: 13px 13px 12px;
  border-radius: var(--r-card);
  background: var(--card);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  overflow: hidden;
  min-width: 0;
}
.kpi::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--tone, var(--accent));
}
.kpi .lb {
  font-size: 11.5px; font-weight: 600; color: var(--muted);
  letter-spacing: .02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kpi .v {
  margin-top: 5px;
  font-size: clamp(20px, 6.4vw, 27px);
  font-weight: 700; letter-spacing: -.6px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  color: var(--ink);
}
.kpi .v .u { font-size: 12px; font-weight: 600; color: var(--muted); margin-left: 2px; letter-spacing: 0; }
.kpi .ft {
  margin-top: 5px; font-size: 11px; color: var(--muted);
  line-height: 1.45;
  font-variant-numeric: tabular-nums;
}
.kpi .ft b { color: var(--ink2); font-weight: 650; }
.kpi .spk { position: absolute; right: 10px; top: 12px; opacity: .9; }
.kpi .dl { margin-top: 4px; font-size: 11px; font-weight: 600; }
.kpi .dl.up { color: var(--bad); }
.kpi .dl.down { color: var(--ok); }
.t-accent { --tone: var(--accent); }
.t-sky    { --tone: var(--sky); }
.t-violet { --tone: var(--violet); }
.t-green  { --tone: var(--ok); }
.t-amber  { --tone: var(--warn); }
.t-teal   { --tone: var(--teal); }

/* ---------------- 卡片 ---------------- */
.card {
  border-radius: var(--r-card);
  background: var(--card);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.card .hd {
  display: flex; align-items: baseline; gap: 8px;
  padding: 13px 14px 0;
}
.card .hd h3 { font-size: 14px; font-weight: 650; letter-spacing: -.1px; }
.card .hd .sub { font-size: 11px; color: var(--muted); margin-left: auto; }
.card .bd { padding: 12px 14px 14px; }
.card.flush .bd { padding: 0; }

/* ---------------- 环图 ---------------- */
.ringbox { display: flex; align-items: center; gap: 14px; }
.ringsvg { flex: 0 0 auto; }
.ringtop { font-size: 11px; fill: var(--muted); }
.ringmain { font-size: 21px; font-weight: 700; fill: var(--ink); font-variant-numeric: tabular-nums; }
.legend { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.lg { display: flex; align-items: center; gap: 7px; font-size: 12.5px; min-width: 0; }
.lg i { width: 8px; height: 8px; border-radius: 3px; flex: 0 0 auto; }
.lg .nm { color: var(--ink2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lg .pv {
  margin-left: auto; font-weight: 650; color: var(--ink);
  font-variant-numeric: tabular-nums;
}

/* ---------------- 三段条 ---------------- */
.track {
  height: 6px; border-radius: 999px; overflow: hidden;
  background: var(--track);
  display: flex;
}
.track.tall { height: 9px; border-radius: 5px; }
.seg { height: 100%; }
.seg-sold { background: var(--sold); }
.seg-ooo { background: var(--ooo); }
.seg-free { background: var(--free); }

.slegend {
  display: flex; gap: 14px; flex-wrap: wrap;
  margin-top: 11px; font-size: 12px; color: var(--muted);
}
.slegend span { display: inline-flex; align-items: center; gap: 5px; }
.slegend b { color: var(--ink); font-variant-numeric: tabular-nums; }
.slegend .dot { width: 8px; height: 8px; border-radius: 3px; }
.d-sold { background: var(--sold); }
.d-ooo { background: var(--ooo); }
.d-free { background: var(--free); }

/* ---------------- 房型条 ---------------- */
.bars { display: flex; flex-direction: column; gap: 9px; }
.brow { display: flex; align-items: center; gap: 8px; min-width: 0; }
.brow .bl { width: 92px; flex: 0 0 auto; display: flex; align-items: center; gap: 4px; min-width: 0; }
.brow .bl .nm {
  font-size: 12.5px; color: var(--ink2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.vtag {
  flex: 0 0 auto;
  font-size: 9px; line-height: 1; padding: 2px 3px;
  color: var(--muted); border: 1px solid var(--line); border-radius: 4px;
}
.brow.virtual .bl .nm { color: var(--muted); }
.bt { flex: 1; min-width: 0; }
.bwrap { min-width: 2px; }
.bv {
  width: 48px; flex: 0 0 auto; text-align: right;
  font-size: 12px; font-weight: 650; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.bv i { font-size: 10px; color: var(--muted); font-weight: 500; }

/* ---------------- 仪表盘 ---------------- */
.gaugesvg { width: 100%; }
.gaugesvg .gv {
  font-size: 30px; font-weight: 700; fill: var(--ink);
  font-variant-numeric: tabular-nums;
}
.gaugesvg .gl { font-size: 11px; fill: var(--muted); letter-spacing: .08em; }
.gaugesvg .gs { font-size: 9px; fill: var(--muted); }

/* ---------------- 收入构成条 ---------------- */
.ibars { display: flex; flex-direction: column; gap: 11px; }
.ibrow .ihd { display: flex; align-items: baseline; gap: 8px; margin-bottom: 5px; }
.ibrow .nm { font-size: 12.5px; color: var(--ink2); }
.ibrow .v {
  margin-left: auto; font-size: 12.5px; font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.ibrow .v.neg { color: var(--bad); }
.itrack { height: 6px; border-radius: 999px; background: var(--track); overflow: hidden; }
.itrack span { display: block; height: 100%; border-radius: 999px; }

/* ---------------- Cells（列表） ---------------- */
.cells { display: flex; flex-direction: column; }
.cell {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.cell:last-child { border-bottom: 0; }
.cell .cl { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cell .nm {
  font-size: 14px; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cell .cs { font-size: 11px; color: var(--muted); }
.cell .cr {
  text-align: right; font-size: 14px; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.cell .cr b { font-weight: 650; }
.cell .cr i { font-size: 11px; color: var(--muted); font-weight: 500; }
.cell .cr .neg { color: var(--bad); }
.cell .cbar {
  grid-column: 1 / -1;
  height: 3px; border-radius: 999px; background: var(--track); overflow: hidden;
  margin-top: 2px;
}
.cell .cbar span { display: block; height: 100%; background: var(--bar-strong); border-radius: 999px; }
.cell.virtual .nm { color: var(--muted); }

/* ---------------- 折叠明细 ---------------- */
.acc { display: flex; flex-direction: column; }
.sec + .sec { border-top: 1px solid var(--line); }
.sechd {
  width: 100%;
  display: flex; align-items: center; gap: 8px;
  min-height: 50px; padding: 12px 0;
  text-align: left;
}
.sechd .sbar { width: 3px; height: 15px; border-radius: 2px; flex: 0 0 auto; }
.sechd .nm {
  font-size: 14px; font-weight: 650; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sechd .v {
  margin-left: auto; font-size: 14px; font-weight: 700;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.sechd .v.neg { color: var(--bad); }
.sechd .cnt {
  font-size: 10.5px; color: var(--muted);
  padding: 1px 5px; border-radius: 5px; background: var(--chip-bg);
  flex: 0 0 auto;
}
.caret {
  flex: 0 0 auto;
  width: 7px; height: 7px;
  border-right: 1.6px solid var(--muted);
  border-bottom: 1.6px solid var(--muted);
  transform: rotate(45deg);
  transition: transform .18s ease;
  margin: 0 2px 3px 2px;
}
.caret.on { transform: rotate(-135deg); margin-bottom: -3px; }
.caret.sm { width: 6px; height: 6px; opacity: .5; }

.secbd { padding: 0 0 6px; }
.row {
  width: 100%;
  display: flex; align-items: center; gap: 8px;
  min-height: 42px; padding: 9px 0;
  text-align: left;
  border-top: 1px solid var(--line-soft);
}
.row .nm {
  font-size: 13px; color: var(--ink2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-width: 0;
}
.row .v {
  margin-left: auto; font-size: 13px; font-weight: 600;
  font-variant-numeric: tabular-nums; white-space: nowrap;
  color: var(--ink);
}
.row .v.neg { color: var(--bad); }
.row.lv1 .nm { padding-left: 10px; }
.row.lv2 .nm { padding-left: 22px; font-size: 12.5px; color: var(--muted); }
.row.lv2 .v { font-size: 12.5px; font-weight: 550; }
.row.sub .nm { color: var(--accent-deep); font-weight: 650; }
.row.sub { border-top: 1px solid var(--line); }
.row.open { background: var(--row-open); }

.rowmore {
  display: flex; gap: 12px; flex-wrap: wrap;
  padding: 0 0 10px 10px;
  font-size: 11px; color: var(--muted);
  border-top: 1px dashed var(--line);
  padding-top: 8px;
  margin-top: -2px;
}
.rowmore b { color: var(--ink2); font-variant-numeric: tabular-nums; }

/* ---------------- 分节标题 / 工具条 ---------------- */
.secttl {
  display: flex; align-items: baseline; gap: 8px;
  padding: 2px 2px 0;
}
.secttl h2 { font-size: 13px; font-weight: 650; color: var(--ink2); letter-spacing: .02em; }
.secttl span { margin-left: auto; font-size: 11px; color: var(--muted); }

.segbar {
  display: inline-flex; padding: 3px; gap: 2px;
  background: var(--chip-bg); border-radius: 10px;
}
.segbar button {
  min-height: 30px; padding: 0 11px; border-radius: 8px;
  font-size: 12px; font-weight: 600; color: var(--muted);
}
.segbar button.on { background: var(--card); color: var(--ink); box-shadow: var(--shadow-sm); }

.chips { display: flex; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chips > * { flex: 0 0 auto; }
.datechip {
  min-height: 32px; padding: 0 12px; border-radius: 999px;
  display: inline-flex; align-items: center;
  font-size: 12.5px; font-weight: 600; color: var(--chip-ink);
  background: var(--chip-bg); border: 1px solid var(--line);
  white-space: nowrap;
}
.datechip.on { color: var(--accent-ink); background: var(--accent); border-color: var(--accent); }

/* ---------------- 底部 Tab ---------------- */
.tabbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
  display: flex;
  padding-bottom: env(safe-area-inset-bottom);
  background: var(--tab-bg);
  border-top: 1px solid var(--line);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
}
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .tabbar { background: var(--card); }
}
.tab {
  flex: 1;
  min-height: 54px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  font-size: 10.5px; font-weight: 600; color: var(--muted);
  position: relative;
}
.tab svg { width: 21px; height: 21px; }
.tab.on { color: var(--accent); }
.tab.on::before {
  content: ""; position: absolute; top: 0; width: 22px; height: 2px;
  border-radius: 0 0 2px 2px; background: var(--accent);
}

/* ---------------- 骨架 / 空态 ---------------- */
.skelwrap { display: flex; flex-direction: column; gap: 10px; }
.skel {
  height: 74px; border-radius: var(--r-card);
  background: linear-gradient(90deg, var(--track) 25%, var(--card) 37%, var(--track) 63%);
  background-size: 400% 100%;
  animation: shimmer 1.3s infinite linear;
}
@keyframes shimmer { from { background-position: 100% 0; } to { background-position: 0 0; } }

.state {
  display: flex; gap: 12px;
  padding: 16px 14px;
  border-radius: var(--r-card);
  background: var(--card);
  border: 1px solid var(--line);
}
.state .ic {
  flex: 0 0 auto;
  width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: 13px; font-weight: 700;
  background: var(--chip-bg); color: var(--muted);
}
.state.error .ic { background: var(--bad-bg); color: var(--bad-ink); }
.state.throttle .ic { background: var(--warn-bg); color: var(--warn-ink); }
.state .tx { min-width: 0; }
.state b { font-size: 13.5px; display: block; }
.state p {
  margin-top: 4px; font-size: 12px; color: var(--muted);
  line-height: 1.55; word-break: break-word;
}
.state p.hint { color: var(--ink2); }
.btn {
  margin-top: 10px;
  min-height: 36px; padding: 0 16px;
  border-radius: 9px;
  font-size: 13px; font-weight: 650;
  color: var(--accent-ink);
  background: var(--accent);
}
.btn.ghost { color: var(--ink2); background: var(--chip-bg); margin-left: 8px; }

/* ---------------- 底部弹层 ---------------- */
.sheet { position: fixed; inset: 0; z-index: 90; }
.sheet .mask {
  position: absolute; inset: 0;
  background: rgba(8, 14, 28, .42);
  animation: fadein .18s ease;
}
.sheet .panel {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 6px 14px calc(10px + env(safe-area-inset-bottom));
  background: var(--card);
  border-radius: 16px 16px 0 0;
  animation: slideup .22s cubic-bezier(.22, .68, .34, 1);
  max-height: 78vh; overflow-y: auto;
}
@keyframes fadein { from { opacity: 0; } }
@keyframes slideup { from { transform: translateY(100%); } }
.sheet .phd {
  display: flex; align-items: center;
  padding: 10px 2px 8px;
  border-bottom: 1px solid var(--line);
}
.sheet .phd b { font-size: 13px; color: var(--muted); font-weight: 600; }
.sheet .cls { margin-left: auto; font-size: 20px; line-height: 1; color: var(--muted); padding: 0 4px; }
.sheetit {
  width: 100%;
  display: flex; align-items: center; gap: 8px;
  min-height: 52px; padding: 10px 2px;
  border-bottom: 1px solid var(--line-soft);
  text-align: left;
}
.sheetit .nm { font-size: 15px; font-weight: 550; }
.sheetit .ds { font-size: 11.5px; color: var(--muted); margin-left: auto; }
.sheetit .ok { color: var(--accent); font-weight: 700; margin-left: 6px; }
.sheetit.on .nm { color: var(--accent); font-weight: 650; }
.sheet .pft { padding: 10px 2px 4px; font-size: 11.5px; color: var(--muted); line-height: 1.6; }
.sheet .cancel {
  width: 100%; min-height: 48px; margin-top: 6px;
  font-size: 15px; font-weight: 600; color: var(--ink2);
  border-top: 1px solid var(--line);
}

/* ---------------- 脚注 ---------------- */
.foot {
  padding: 2px 4px 0;
  font-size: 11px; color: var(--muted); line-height: 1.6;
}
.foot b { color: var(--ink2); font-weight: 650; }

.mono { font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
.neg { color: var(--bad); }
.nowrap { white-space: nowrap; }

/* ---------------- 日报：大数卡 ---------------- */
.hero {
  padding: 16px 16px 15px;
  border-radius: var(--r-card);
  background: var(--hero-bg);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}
.hero .hl { font-size: 12px; font-weight: 600; color: var(--muted); letter-spacing: .02em; }
.hero .hv {
  margin-top: 6px;
  font-size: clamp(28px, 9vw, 38px);
  font-weight: 700; letter-spacing: -1.2px;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
  line-height: 1.1;
}
.hero .hf {
  margin-top: 8px; font-size: 11.5px; color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.hero .hc {
  position: absolute; right: 12px; top: 12px;
  font-size: 10px; color: var(--muted);
  padding: 2px 6px; border-radius: 5px; background: var(--chip-bg);
}

/* ---------------- 日报：区间工具条 ---------------- */
.daterow { display: flex; align-items: center; gap: 8px; }
.rangeinfo {
  padding: 7px 2px 0;
  font-size: 11px; color: var(--muted);
}

/* ---------------- 日报：口径切换 ---------------- */
.metricbar {
  display: flex; align-items: center; gap: 10px;
  padding: 2px;
}
.metricbar .mhint { font-size: 11px; color: var(--muted); margin-left: auto; text-align: right; }

/* ---------------- 日报：明细工具条 ---------------- */
.detbar {
  display: flex; align-items: center; gap: 8px;
  padding: 0 0 6px;
  border-bottom: 1px solid var(--line);
}
.txtbtn {
  min-height: 32px; padding: 0 10px;
  border-radius: 8px;
  font-size: 12px; font-weight: 600; color: var(--ink2);
  background: var(--chip-bg);
}
.txtbtn.on { color: var(--accent); background: var(--accent-soft); }
.detbar .cnt2 { margin-left: auto; font-size: 11px; color: var(--muted); }

/* ---------------- 房态开关 ---------------- */
.footrow { display: flex; align-items: center; gap: 10px; padding: 2px 2px 6px; }
.sw {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 36px; padding: 0 12px 0 8px;
  border-radius: 999px;
  font-size: 12px; font-weight: 600; color: var(--muted);
  background: var(--chip-bg); border: 1px solid var(--line);
}
.sw i {
  width: 16px; height: 16px; border-radius: 5px;
  border: 1.5px solid var(--line-strong);
  display: grid; place-items: center;
  flex: 0 0 auto;
}
.sw.on { color: var(--accent-deep); }
.sw.on i { background: var(--accent); border-color: var(--accent); }
.sw.on i::after {
  content: ""; width: 8px; height: 4px;
  border-left: 1.6px solid #fff; border-bottom: 1.6px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px);
}

/* ---------------- 仪表盘下方图例 ---------------- */
.gaugelt {
  display: flex; justify-content: space-around; gap: 6px;
  margin-top: -6px;
  font-size: 11px; color: var(--muted);
  text-align: center;
}
.gaugelt span { display: flex; flex-direction: column; gap: 1px; }
.gaugelt b { font-size: 13px; color: var(--ink); font-variant-numeric: tabular-nums; }

/* file:// 打开时的兜底提示 */
.filewarn {
  margin: 40px 20px; padding: 18px;
  border-radius: 14px; background: #fff;
  border: 1px solid #e6ebf2; color: #0f172a;
  font-size: 13px; line-height: 1.7;
}
.filewarn b { display: block; margin-bottom: 6px; font-size: 15px; }
.filewarn code {
  display: inline-block; margin-top: 6px; padding: 3px 7px;
  border-radius: 6px; background: #f2f5f9;
  font-size: 12px; word-break: break-all;
}

/* ---------------- 尺寸适配 ---------------- */
@media (max-width: 360px) {
  .page { padding-left: 12px; padding-right: 12px; }
  .hdr { padding: 0 12px; }
  .hotels { padding-left: 12px; padding-right: 12px; }
  .brow .bl { width: 80px; }
  .kpi .v { letter-spacing: -.8px; }
}

@media (min-width: 430px) {
  .page { padding-left: 18px; padding-right: 18px; }
  .hdr { padding: 0 18px; }
  .hotels { padding-left: 18px; padding-right: 18px; }
}

/* 横屏：只压缩头部与信息密度，不做双栏正文 */
@media (orientation: landscape) and (max-height: 520px) {
  .hdr { height: 44px; }
  .hdr .sub { display: none; }
  .hotels { padding-bottom: 6px; }
  .page { padding-top: 8px; gap: 10px; }
  .kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}