:root {
  --accent: #2f7d6e;
  --accent-soft: #e8f3f0;
  --bg: #f6f7f8;
  --panel: #ffffff;
  --line: #e5e7ea;
  --line-soft: #f0f1f3;
  --text: #1f2328;
  --text-2: #5b6169;
  --text-3: #8b9199;
  --radius: 10px;
  --shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: -.01em; }

/* ---------- 顶栏 ---------- */
.nav {
  position: sticky; top: 0; z-index: 500;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: saturate(1.6) blur(10px);
  border-bottom: 1px solid var(--line);
}
.nav-inner {
  max-width: 1120px; margin: 0 auto; padding: 0 20px;
  height: 54px; display: flex; align-items: center; gap: 22px;
}
.brand { display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--text); font-size: 15px; }
.brand:hover { text-decoration: none; }
.brand .avatar { font-size: 18px; }
.nav-links { display: flex; gap: 4px; flex: 1; }
.nav-links a {
  padding: 5px 11px; border-radius: 7px; color: var(--text-2); font-size: 13.5px; white-space: nowrap;
}
.nav-links a:hover { background: var(--line-soft); color: var(--text); text-decoration: none; }
.nav-links a.on { background: var(--accent-soft); color: var(--accent); font-weight: 500; }
.nav-right { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--text-3); }

/* ---------- 布局 ---------- */
.wrap { max-width: 1120px; margin: 0 auto; padding: 22px 20px 60px; }
.wrap-wide { max-width: 100%; padding: 0; }
.page-head { margin-bottom: 18px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.page-head h1 { font-size: 21px; }
.page-head .sub { color: var(--text-3); font-size: 13px; margin-top: 3px; }

.card {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 18px; margin-bottom: 16px;
}
.card > h2 { font-size: 15px; margin-bottom: 2px; display: flex; align-items: center; gap: 8px; }
.card > .card-sub { color: var(--text-3); font-size: 12.5px; margin-bottom: 14px; }
.grid { display: grid; gap: 16px; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) { .g3, .g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) {
  .g2, .g3, .g4 { grid-template-columns: 1fr; }
  .wrap { padding: 16px 14px 48px; }
  .nav-inner { padding: 0 10px; gap: 6px; height: 50px; }
  /* 窄屏只留头像，导航可横向滚动，避免换行把布局撑坏 */
  .brand .t { display: none; }
  .nav-links { overflow-x: auto; scrollbar-width: none; gap: 0; }
  .nav-links::-webkit-scrollbar { display: none; }
  .nav-links a { padding: 5px 7px; font-size: 13px; }
  .nav-right .who { display: none; }
  .nav-right .btn.sm { padding: 4px 9px; font-size: 12.5px; }
}

.only-sm { display: none; }
@media (max-width: 620px) {
  .hide-sm { display: none; }
  .only-sm { display: inline; }
  /* 窄屏用地势与手势缩放，把控件让给底部 */
  .map-panel { top: 8px; }
}

/* ---------- 统计数字 ---------- */
/* grid-auto-rows: 1fr 让所有格子等高：否则某一格的值换行时，那一整行都比别行高 */
/* 用 flex + grow 而不是固定列数的网格：KPI 个数常常是 6、7 这种除不尽列数的，
   网格会在最后一行留下空格子——而间隙是用底色画的，空格子就露成灰块，很难看。
   flex 会让最后一行自己撑满，任何个数都不会有空格。 */
.kpis { display: flex; flex-wrap: wrap; gap: 1px; background: var(--line); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); }
@media (max-width: 900px) { .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.kpi { flex: 1 1 158px; min-width: 0; background: var(--panel); padding: 15px 16px; }
/* 字号跟着视口收：窄屏上「112天19小时」这种值放不下就会折成两行，把整行撑高 */
.kpi .v { font-size: clamp(17px, 5.6vw, 23px); font-weight: 650; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.kpi .v small { font-size: 13px; font-weight: 500; color: var(--text-3); margin-left: 3px; }
.kpi .k { color: var(--text-3); font-size: 12.5px; margin-top: 1px; }

/* ---------- 图表（纯 CSS/SVG） ---------- */
.bars { display: flex; flex-direction: column; gap: 9px; }
.bar-row { display: grid; grid-template-columns: 128px 1fr 104px; align-items: center; gap: 10px; font-size: 13px; }
.bar-row .nm { color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bar-track { background: var(--line-soft); border-radius: 5px; height: 9px; overflow: hidden; }
.bar-fill { height: 100%; border-radius: 5px; background: var(--accent); min-width: 2px; }
.bar-row .vv { text-align: right; color: var(--text-2); font-variant-numeric: tabular-nums; font-size: 12.5px; white-space: nowrap; }
@media (max-width: 620px) { .bar-row { grid-template-columns: 84px 1fr 92px; } }

.cols { display: flex; align-items: flex-end; gap: 3px; height: 120px; }
.cols .col { flex: 1; background: var(--accent); border-radius: 3px 3px 0 0; min-height: 2px; opacity: .85; }
.cols .col:hover { opacity: 1; }
.cols-x { display: flex; gap: 3px; font-size: 10px; color: var(--text-3); margin-top: 5px; }
.cols-x span { flex: 1; text-align: center; overflow: hidden; white-space: nowrap; }

/* ---------- 日历热力 ---------- */
.heat { display: flex; gap: 3px; overflow-x: auto; padding-bottom: 4px; }
.heat .wk { display: flex; flex-direction: column; gap: 3px; }
.heat .d { width: 11px; height: 11px; border-radius: 2.5px; background: var(--line-soft); }
.heat .d.l1 { background: #cfe6e0; }
.heat .d.l2 { background: #9dcfc3; }
.heat .d.l3 { background: #5fae9c; }
.heat .d.l4 { background: var(--accent); }
.heat-legend { display: flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--text-3); margin-top: 8px; }
.heat-legend .d { width: 11px; height: 11px; border-radius: 2.5px; }

/* ---------- 列表 ---------- */
.list { display: flex; flex-direction: column; }
.item {
  display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; align-items: center;
  padding: 11px 2px; border-bottom: 1px solid var(--line-soft);
}
.item:last-child { border-bottom: 0; }
.item .ic {
  width: 34px; height: 34px; border-radius: 9px; display: flex; align-items: center; justify-content: center;
  background: var(--line-soft); font-size: 17px;
}
.item .t { font-weight: 500; }
.item .t a { color: var(--text); }
.item .m { color: var(--text-3); font-size: 12.5px; margin-top: 1px; }
.item .r { text-align: right; color: var(--text-2); font-size: 12.5px; white-space: nowrap; }

.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 20px;
  background: var(--line-soft); color: var(--text-2); font-size: 12.5px; border: 1px solid transparent;
}
.chip.on { background: var(--accent-soft); color: var(--accent); border-color: #cfe6e0; font-weight: 500; }
.chip .dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.tag { display: inline-block; padding: 1px 7px; border-radius: 5px; background: var(--accent-soft); color: var(--accent); font-size: 11.5px; }

/* ---------- 表单 ---------- */
label.f { display: block; margin-bottom: 13px; }
label.f > span { display: block; font-size: 12.5px; color: var(--text-2); margin-bottom: 5px; }
/* 必填标记：字段名后的红色星号，以及表单顶部的统一说明 */
.req { color: #b42318; font-weight: 700; margin-left: 2px; }
.req-tip { font-size: 12.5px; color: var(--text-2); margin: 0 0 10px; }
.req-tip .req { margin-right: 3px; }

/* flatpickr 日期时间选择器：贴合站点风格 */
.flatpickr-calendar { border-radius: 10px; box-shadow: 0 8px 30px rgba(0,0,0,.14); font-family: inherit; }
.flatpickr-day.selected, .flatpickr-day.selected:hover { background: var(--accent); border-color: var(--accent); }
.flatpickr-day.today { border-color: var(--accent); }
.flatpickr-day.today:hover { background: var(--accent-soft); color: var(--text); }
.flatpickr-day:hover { background: var(--accent-soft); }
input[type=text], input[type=password], input[type=number], input[type=date], select, textarea {
  width: 100%; padding: 7px 10px; border: 1px solid var(--line); border-radius: 7px; font: inherit;
  background: #fff; color: var(--text); outline: none;
}
input:focus, select:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.check { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--text-2); margin-bottom: 8px; word-break: keep-all; overflow-wrap: break-word; }
.check input { width: 15px; height: 15px; accent-color: var(--accent); }
.nobr { white-space: nowrap; }
.btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 7px;
  border: 1px solid var(--line); background: #fff; color: var(--text); font: inherit; font-size: 13.5px; cursor: pointer;
}
.btn:hover { background: var(--line-soft); text-decoration: none; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.primary:hover { filter: brightness(1.06); }
.btn.sm { padding: 4px 10px; font-size: 12.5px; }
.btn.danger { color: #b42318; border-color: #f0cecb; }
.btn.danger:hover { background: #fdf3f2; }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.spacer { flex: 1; }

/* ---------- 表格 ---------- */
table.tb { width: 100%; border-collapse: collapse; font-size: 13px; }
table.tb th {
  text-align: left; font-weight: 500; color: var(--text-3); font-size: 12px;
  padding: 7px 10px; border-bottom: 1px solid var(--line); white-space: nowrap;
}
table.tb td { padding: 9px 10px; border-bottom: 1px solid var(--line-soft); }
table.tb tr:hover td { background: #fbfcfc; }
table.tb td.num, table.tb th.num { text-align: right; font-variant-numeric: tabular-nums; }
.tw { overflow-x: auto; }

/* ---------- 地图 ---------- */
#map { height: 100%; width: 100%; background: #eef1f2; }
.map-page { position: fixed; inset: 54px 0 0 0; }
.map-panel {
  position: absolute; top: 12px; left: 12px; z-index: 400; width: 286px; max-height: calc(100% - 24px);
  overflow-y: auto; background: rgba(255,255,255,.97); backdrop-filter: blur(8px);
  border: 1px solid var(--line); border-radius: var(--radius); padding: 13px; box-shadow: var(--shadow);
}
.map-panel h3 { font-size: 13px; margin-bottom: 9px; color: var(--text-2); }
.map-legend {
  position: absolute; bottom: 14px; right: 12px; z-index: 400; background: rgba(255,255,255,.95);
  border: 1px solid var(--line); border-radius: 8px; padding: 8px 11px; font-size: 12px; 
  max-height: 40%; overflow-y: auto; box-shadow: var(--shadow);
}
.map-legend .lg { display: flex; align-items: center; gap: 6px; margin-top: 4px; color: var(--text-2); }
.map-legend .lg i { width: 9px; height: 9px; border-radius: 50%; }
.maplink { display: block; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }
.maplink b { font-weight: 500; }
.maplink span { color: var(--text-3); font-size: 12px; display: block; }
.dot-marker { border-radius: 50%; border: 1.5px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.16); }
@media (max-width: 620px) {
  .map-panel { left: 8px; right: 8px; width: auto; max-height: 44%; top: 8px; }
  .map-legend { display: none; }
}
.map-preview { height: 320px; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); }

/* ---------- 其他 ---------- */
.alert { padding: 9px 13px; border-radius: 8px; font-size: 13px; margin-bottom: 14px; }
.alert.err { background: #fdf3f2; color: #b42318; border: 1px solid #f3dcda; }
.alert.ok { background: #eef8f5; color: #17604f; border: 1px solid #cfe6e0; }
.alert.info { background: #f2f6fd; color: #2c5282; border: 1px solid #dbe5f5; }
.muted { color: var(--text-3); }
.mono { font-family: var(--mono); font-size: 12px; }
.empty { text-align: center; padding: 40px 16px; color: var(--text-3); }
.empty .big { font-size: 30px; margin-bottom: 8px; }
.pager { display: flex; gap: 6px; align-items: center; justify-content: center; margin-top: 18px; font-size: 13px; }
.pager a, .pager span { padding: 4px 10px; border-radius: 6px; border: 1px solid var(--line); color: var(--text-2); }
.pager a:hover { background: var(--line-soft); text-decoration: none; }
.pager .cur { background: var(--accent); border-color: var(--accent); color: #fff; }
footer.ft { max-width: 1120px; margin: 0 auto; padding: 20px; color: var(--text-3); font-size: 12.5px; text-align: center; }
.timeline-day { margin-bottom: 20px; }
.timeline-day .dh {
  position: sticky; top: 54px; background: var(--bg); z-index: 5; padding: 6px 0 7px;
  font-size: 13px; color: var(--text-2); font-weight: 500; display: flex; gap: 8px; align-items: baseline;
}
.timeline-day .dh .muted { font-size: 12px; }
.tl-item { display: grid; grid-template-columns: 62px 20px 1fr; gap: 10px; align-items: start; padding: 7px 0; }
.tl-item .tm { color: var(--text-3); font-size: 12.5px; font-variant-numeric: tabular-nums; padding-top: 1px; }
.tl-item .ln { display: flex; justify-content: center; position: relative; }
.tl-item .ln::before { content: ""; position: absolute; top: 12px; bottom: -12px; width: 1px; background: var(--line); }
.tl-item:last-child .ln::before { display: none; }
.tl-item .ln i { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); margin-top: 5px; position: relative; z-index: 1; }
.tl-item .bd { font-size: 13.5px; }
.tl-item .bd .meta { color: var(--text-3); font-size: 12.5px; }

/* 聚合气泡改用主题色，默认的黄蓝配色和站点风格不一致 */
.marker-cluster-small,
.marker-cluster-medium,
.marker-cluster-large { background-color: color-mix(in srgb, var(--accent) 22%, transparent); }
.marker-cluster-small div,
.marker-cluster-medium div,
.marker-cluster-large div { background-color: var(--accent); color: #fff; font-weight: 500; }

/* 筛选面板占据左上角，把缩放控件挪到右上与图层切换并列 */
.map-panel { left: 12px; }
@media (max-width: 620px) { .map-panel { left: 8px; right: 8px; } }

/* 更多筛选类型 */
.more-types { margin: 2px 0 10px; }
.more-types summary { font-size: 12.5px; color: var(--text-3); cursor: pointer; padding: 3px 0; }
.more-types summary:hover { color: var(--accent); }
.more-types .chips { margin-top: 8px; }

@media (max-width: 620px) {
  .leaflet-bottom.leaflet-right .leaflet-control-zoom { margin-bottom: 34px; }
}

/* 推荐 / 踩雷 表态按钮 */
.vote-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.vote-label { color: var(--text-3); font-size: 12.5px; min-width: 62px; }
/* 「推荐 / 踩雷」必须并排：把它们包成不可换行的组，窄屏时只让后面那句提示换行 */
.vote-btns { display: inline-flex; gap: 8px; flex-wrap: nowrap; }
.vote-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 14px; border-radius: 999px; white-space: nowrap; flex: 0 0 auto;
  border: 1px solid var(--line); background: var(--card, #fff); color: var(--text);
  font-size: 13.5px; font-weight: 500; cursor: pointer; line-height: 1;
  transition: background .12s, border-color .12s, color .12s;
}
.vote-btn:hover { border-color: var(--accent); color: var(--accent); }
.vote-btn.up.on { background: #e7f6ec; border-color: #34c759; color: #1f8f43; }
.vote-btn.down.on { background: #fdeceb; border-color: #ff3b30; color: #c62a20; }
.vote-btn:disabled { opacity: .55; cursor: default; }
.vote-tip { font-size: 12.5px; color: var(--text-3); }
.vote-tip.up { color: #1f8f43; }
.vote-tip.down { color: #c62a20; }
/* 站长页面上访客票数只读展示：沿用「我的结论」同一套行结构，尺寸/行距完全一致，只弱化配色 */
.vote-btn.ro {
  cursor: default; color: var(--text-2);
  border-style: dashed; border-color: var(--line); background: transparent;
}
.vote-btn.ro:hover { border-color: var(--line); color: var(--text-2); }
/* 列表 / 气泡里的推荐踩雷小标签 */
.tag.vote-up { background: #e7f6ec; color: #1f8f43; }
.tag.vote-down { background: #fdeceb; color: #c62a20; }

/* 地图气泡：地点信息 + 只读备注 + 就地表决 */
.mp { min-width: 240px; max-width: 300px; }
.mp-n { font-weight: 600; margin-bottom: 2px; }
.mp-m { color: var(--text-3); font-size: 12px; line-height: 1.6; }
.mp-note {
  margin-top: 6px; padding: 6px 8px; border-radius: 6px;
  background: var(--bg, #f5f6f8); color: var(--text);
  font-size: 12.5px; line-height: 1.55; white-space: pre-line;
  max-height: 150px; overflow-y: auto;
}
.mp-foot { margin-top: 7px; font-size: 12.5px; }
/* nowrap：气泡本来就窄，「👎 踩雷」被挤到第二行会很难看 */
.mp-vote { display: flex; align-items: center; gap: 6px; margin-top: 8px; flex-wrap: nowrap; }
.mp-vl { flex: 0 0 auto; color: var(--text-3); font-size: 12px; white-space: nowrap; }
.mp-vb {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--card, #fff); color: var(--text);
  font-size: 12.5px; font-weight: 500; line-height: 1; cursor: pointer;
  flex: 0 0 auto; white-space: nowrap;
  transition: background .12s, border-color .12s, color .12s;
}
.mp-vb b { font-weight: 600; }
.mp-vb:hover { border-color: var(--accent); color: var(--accent); }
.mp-vb.up.on { background: #e7f6ec; border-color: #34c759; color: #1f8f43; }
.mp-vb.down.on { background: #fdeceb; border-color: #ff3b30; color: #c62a20; }
.mp-vb:disabled { opacity: .55; cursor: default; }

/* 备注块：rond 回填的备注是按次一行的，必须保留换行 */
.note-block {
  margin-top: 4px; padding: 7px 9px; border-radius: 8px;
  background: var(--bg, #f5f6f8); color: var(--text-2);
  font-size: 12.8px; line-height: 1.65; white-space: pre-line;
}

/* 报告导出为 PDF / 长图：隐藏导航、页脚与操作按钮，卡片避免跨页断裂 */
@media print {
  .nav, .ft, .no-print { display: none !important; }
  body { background: #fff; }
  .wrap { max-width: 820px; margin: 0 auto; padding: 0 12px; }
  .page-head h1 { margin-top: 8px; }
  .card, .kpi, .kpis { break-inside: avoid; }
  .grid.g2 { grid-template-columns: 1fr 1fr; }
  a { color: inherit; text-decoration: none; }
  .bar-fill { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .chip.on { background: var(--accent-soft); color: var(--accent); }
}


/* 数据编辑页：行内编辑用 details 折叠，summary 复用 .btn 外观 */
.inline-edit { display: inline-block; position: relative; }
.inline-edit summary { list-style: none; display: inline-block; }
.inline-edit summary::-webkit-details-marker { display: none; }
.inline-edit[open] { display: block; }
.inline-edit form { background: var(--bg-2, #fafbfb); border: 1px solid var(--line); border-radius: 10px; padding: 12px; }
.inline-edit form .f { margin-bottom: 8px; }

/* 「按名称搜坐标」输入框 + 按钮：必须始终同一行（含移动端），底边对齐。
 * 不能直接复用 .row —— label.f 自带 margin-bottom，flex-end 按外边距盒对齐会把它顶高；
 * 且 .row 会换行。这里显式 nowrap + 归零外边距，并让输入框可收缩。 */
.search-row { display: flex; flex-wrap: nowrap; align-items: flex-end; gap: 8px; margin-bottom: 12px; }
.search-row > label.f { flex: 1 1 auto; min-width: 0; margin-bottom: 0; }
.search-row .btn { flex: 0 0 auto; font-size: 14px; }
.search-row > .act { display: flex; flex: 0 0 auto; gap: 8px; }

/* 按名称搜坐标的候选列表：整行可点，名称与地址分两行 */
.geo-list { display: flex; flex-direction: column; gap: 4px; margin: 0 0 12px; }
.geo-list:empty { margin: 0; }
.geo-item {
  display: block; width: 100%; text-align: left; cursor: pointer;
  padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel); color: var(--text); font: inherit;
}
.geo-item:hover { background: var(--line-soft); }
.geo-name { display: block; font-size: 13.5px; }
.geo-addr { display: block; color: var(--text-3); font-size: 12px; margin-top: 2px; }

/* 「同时创建到访」折叠区 */
.opt-visit { margin: 0 0 12px; }
.opt-visit > summary { cursor: pointer; color: var(--text-3); font-size: 12.5px; margin-bottom: 8px; }
.opt-visit .row { margin-bottom: 8px; }

/* ---------- 专题 ---------- */
/* 必须带上 #map：站点里 #map{height:100%} 是 ID 选择器，
   单靠 .topic-map 这个类压不过它，容器会被算成 0 高（地图看不见）。 */
#map.topic-map { height: 520px; width: 100%; border-radius: 10px; overflow: hidden; }
@media (max-width: 620px) { #map.topic-map { height: 360px; } }
.topic-card { display: block; text-decoration: none; color: inherit; transition: box-shadow .15s, transform .15s; }
.topic-card:hover { box-shadow: 0 6px 22px rgba(0,0,0,.08); transform: translateY(-1px); }
.topic-head { display: flex; align-items: center; gap: 8px; }
.topic-head h2 { margin: 0; }
.topic-card .kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 620px) { .topic-card .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* 地图兜底提示：脚本没就绪时留在容器里，解释为什么没有地图 */
.map-fallback {
  display: flex; align-items: center; justify-content: center; height: 100%;
  padding: 20px; text-align: center; color: var(--text-3); font-size: 13px;
}

/* 专题：时间范围独立成行（精确到分钟，塞进 KPI 网格会被挤成多行） */
.topic-range { margin-top: 5px; color: var(--text-2); font-size: 13.5px; font-variant-numeric: tabular-nums; }
.topic-card .topic-range { margin: 7px 0 0; }
.topic-desc { color: var(--text-2); white-space: pre-wrap; line-height: 1.65; }
.kpis.kpis-3 .kpi { flex: 1 1 30%; }
@media (max-width: 620px) {
  /* 三个数字都很短，窄屏保持三列比 2+1 更好看 */
  .topic-card .kpis.kpis-3 .kpi { flex: 1 1 30%; }
  .topic-card .kpi { padding: 11px 12px; }
  .topic-range { font-size: 12.5px; }
}

/* ---------- 表单里的「文字 + 内联按钮」组合 ---------- */
/* label 的文字行右侧放次要操作（活动改名/删除），不额外占高度，也就不会把整格撑高 */
label.f > span.span-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mini-actions { display: flex; gap: 8px; font-size: 12px; }
.mini-actions a { color: var(--text-3); }
.mini-actions a:hover { color: var(--accent); }
.mini-actions a.danger:hover { color: #b42318; }
/* 输入框 + 按钮同一行：input 自适应、按钮不压缩（不设 min-width:0 的话 input 会被按钮顶到下一行） */
.input-btn { display: flex; gap: 6px; }
.input-btn > input { flex: 1 1 auto; min-width: 0; }
.input-btn > .btn { flex: 0 0 auto; padding-left: 12px; padding-right: 12px; }

/* 到访列表里的收藏星标：点一下就切换，不用展开行内编辑 */
.star {
  background: none; border: 0; padding: 0 3px; cursor: pointer; line-height: 1;
  font-size: 15px; color: var(--text-3); vertical-align: -1px;
}
.star:hover { color: #e8b700; }
.star.on { color: #e8b700; }

/* 单个点位的地图弹窗 */
#point-modal {
  position: fixed; inset: 0; z-index: 1200; display: flex; align-items: flex-start;
  justify-content: center; padding: 40px 16px; overflow: auto;
  background: rgba(0, 0, 0, .45);
}
.point-modal-box {
  width: 100%; max-width: 660px; background: var(--panel); border-radius: 12px;
  padding: 14px; box-shadow: 0 12px 40px rgba(0, 0, 0, .25);
}
.point-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.point-modal-map { height: 360px; border-radius: 10px; overflow: hidden; }
@media (max-width: 620px) {
  #point-modal { padding: 16px 10px; }
  .point-modal-map { height: 260px; }
}

/* 表格里的行内操作链接不许折行：中文默认能在任意字间断开，
   「地图」「编辑」这类两字链接在窄列里会被拆成两行 */
.tb a { white-space: nowrap; }

/* 照片导入表：固定列宽比例，输入框跟着列宽走。
   否则每个 input 自带 min-width，8 列加起来必然超出视口，最右边的「说明」列要横向拖动才看得到 */
.photo-table { table-layout: fixed; width: 100%; min-width: 880px; }
.photo-table th, .photo-table td { padding: 7px 8px; vertical-align: top; }
.photo-table input, .photo-table select { width: 100%; min-width: 0; box-sizing: border-box; }
.photo-table input[type=datetime-local] { font-size: 12.5px; padding: 6px 6px; }
.photo-table input[type=checkbox] { width: auto; }
.photo-table .chip { white-space: nowrap; }

/* 窄屏：8 列在手机上放不下，把信息量最低的「文件」列去掉（地点名已经能认出是哪张），
   同时把最小宽度调小，需要横向滑动时也能更快看到最右边的操作 */
@media (max-width: 700px) {
  .photo-table { min-width: 640px; }
  .photo-table col:nth-child(2),
  .photo-table thead th:nth-child(2),
  .photo-table tbody tr td:nth-child(2) { display: none; }
}