/* DumpStationMap：目录站。深湖蓝 + 地图黄，像一张公路图 */
:root {
  --bg: #f4f6f5;
  --surface: #ffffff;
  --surface-2: #e8eeec;
  --text: #17262c;
  --muted: #5a6a70;
  --line: #d6dfdd;
  --accent: #1d4e63;
  --accent-ink: #ffffff;
  --accent-soft: #dbe8ee;
  --accent-2: #2f8a4c;
  --accent-2-soft: #dcefe2;
  --accent-3: #d99a1e;
  --accent-3-soft: #fbefd6;
  --radius: 12px;
  --radius-sm: 8px;
  --font-display: "Trebuchet MS", "Segoe UI", system-ui, sans-serif;
  --dsm-bg: #e3ebe8;
  --dsm-dot: #1d4e63;
}
/* 上面改了哪些浅色变量，深色模式就必须同样全部改一遍 */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #121a1d;
    --surface: #182327;
    --surface-2: #1f2d32;
    --text: #e6eef0;
    --muted: #97a8ad;
    --line: #2c3c42;
    --accent: #7cc3df;
    --accent-ink: #121a1d;
    --accent-soft: #1d3540;
    --accent-2: #6fcf8f;
    --accent-2-soft: #1d3326;
    --accent-3: #f2b134;
    --accent-3-soft: #3a3020;
    --radius: 12px;
    --radius-sm: 8px;
    --font-display: "Trebuchet MS", "Segoe UI", system-ui, sans-serif;
    --dsm-bg: #1b282c;
    --dsm-dot: #7cc3df;
  }
}
.site-header { background: var(--accent); border: 0; }
.site-header .logo, .site-header nav a { color: #fff; }
.site-header nav a:hover { background: rgba(255, 255, 255, .15); color: #fff; }
.site-header nav a[aria-current] { background: #f2b134; color: #17262c; }
@media (prefers-color-scheme: dark) { .site-header { background: #0f2a35; } }
.dsm-map { display: block; width: 100%; height: auto; }
.dsm-bg { fill: var(--dsm-bg); }
.dsm-dot { fill: var(--dsm-dot); fill-opacity: .75; stroke: var(--surface); stroke-width: 1.2; }
.dsm-dot.free { fill: var(--accent-2); }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 18px 0; }
.stats p { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 14px; }
.stats b { display: block; font: 700 28px var(--font-display); color: var(--accent); }
.stats span { font-size: 14px; color: var(--muted); }
.content { max-width: none; }
.table-scroll { overflow-x: auto; }
.dsm-table td { vertical-align: top; }
.dsm-table small { display: block; color: var(--muted); font-size: 13px; }
.dsm-table .maps { white-space: nowrap; font-size: 14px; }
.tag { display: inline-block; font-size: 12px; font-weight: 700; padding: 1px 8px; border-radius: 99px; background: var(--accent-3-soft); color: var(--text); }
.tag.free { background: var(--accent-2-soft); color: var(--accent-2); }
.tag.warn { background: var(--surface-2); color: var(--muted); }
.state-list { list-style: none; padding: 0; columns: 3 200px; column-gap: 24px; }
.state-list li { display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 6px 2px; break-inside: avoid; }
.state-list b { color: var(--muted); font-weight: 600; font-variant-numeric: tabular-nums; }
.near-list { list-style: none; padding: 0; margin: 14px 0 0; }
.near-list li { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.near-list small { display: block; color: var(--muted); }
.near-list .dist { font: 700 18px var(--font-display); color: var(--accent); }
@media (max-width: 520px) { .near-list li { grid-template-columns: 1fr auto; } .near-list .btn { grid-column: 1 / -1; justify-self: start; } }
