/*!
 * theme-auto.css — 跟隨手機深淺模式（v2.4）
 * 在 style.css / flat-2d.css / risk-2d.css / ai-search.css 之後載入。
 * 預設（無 data-theme 或 light）完全不覆蓋既有淺色平面外觀；
 * 只有 html[data-theme="dark"] 與 html[data-accent="system"] 生效。
 * 系統主題色變數（--sys-accent*）由 theme-scheme.js 依 CSS AccentColor 寫入。
 */

/* ---------- 1. 深色平面主題：只覆蓋變數，既有元件自然變深 ---------- */
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0b1420;--bg-soft:#101c2a;
  --surface:#152231;--surface-2:#1b2b3c;--surface-3:#223447;
  --line:#2a3d50;--line-strong:#40586e;
  --text:#e7eef7;--text-2:#bfcedd;--muted:#8ea3ba;--muted-2:#7c90a5;
  --charger:#34d399;--parking:#60a5fa;--fuel:#fbbf24;--carwash:#c084fc;--danger:#fb7185;--risk:#fb923c;
  --accent:#60a5fa;--accent-2:#3b82f6;--accent-soft:rgba(96,165,250,.18);
  --accent-line:rgba(96,165,250,.55);--accent-grad:#60a5fa;--on-accent:#0b1420;
  --r-lg:14px;--r:12px;--r-sm:9px;
  --shadow-1:0 1px 2px rgba(0,0,0,.4);--shadow-2:0 18px 40px rgba(0,0,0,.5);--blur:none;
}

/* ---------- 2. 系統主題色（Material You / AccentColor），由 JS 決定是否啟用 ---------- */
html[data-accent="system"],
html[data-accent="system"] body[data-vehicle="ev"],
html[data-accent="system"] body[data-vehicle="fuel"]{
  --accent:var(--sys-accent);--accent-2:var(--sys-accent-2);
  --accent-soft:var(--sys-accent-soft);--accent-line:var(--sys-accent-line);
  --accent-grad:var(--sys-accent);
}
/* 強調色上的文字：JS 按系統主題色亮度提供 --on-accent，確保對比 */
html[data-theme="dark"] .tab.active,
html[data-theme="dark"] .navActions .primary,
html[data-theme="dark"] .gps-actions .primary,
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .navTurnIcon,
html[data-accent="system"] .tab.active,
html[data-accent="system"] .navActions .primary,
html[data-accent="system"] .gps-actions .primary,
html[data-accent="system"] .btn-primary,
html[data-accent="system"] .navTurnIcon{color:var(--on-accent,#fff)}
html[data-theme="dark"] .navActions .primary:hover,
html[data-theme="dark"] .gps-actions .primary:hover,
html[data-theme="dark"] .btn-primary:hover,
html[data-accent="system"] .navActions .primary:hover,
html[data-accent="system"] .gps-actions .primary:hover,
html[data-accent="system"] .btn-primary:hover{color:var(--on-accent,#fff)}
html[data-theme="dark"] button:focus-visible,
html[data-theme="dark"] a:focus-visible,
html[data-theme="dark"] [tabindex]:focus-visible,
html[data-theme="dark"] input:focus-visible,
html[data-theme="dark"] select:focus-visible,
html[data-theme="dark"] summary:focus-visible,
html[data-accent="system"] button:focus-visible,
html[data-accent="system"] a:focus-visible,
html[data-accent="system"] [tabindex]:focus-visible,
html[data-accent="system"] input:focus-visible,
html[data-accent="system"] select:focus-visible,
html[data-accent="system"] summary:focus-visible{outline-color:var(--accent)}

/* ---------- 3. 基礎、連結、選取 ---------- */
html[data-theme="dark"] body{background:var(--bg);color:var(--text)}
html[data-theme="dark"] ::selection{background:rgba(96,165,250,.32);color:#f2f8ff}
html[data-theme="dark"] a,
html[data-theme="dark"] .about-sources a,
html[data-theme="dark"] .flood-src li a,
html[data-theme="dark"] .flood-pending li a,
html[data-theme="dark"] .flood-live-zone a,
html[data-theme="dark"] .wx-links a,
html[data-theme="dark"] .popup a,
html[data-theme="dark"] .native-popup a{color:#7cc4ff}

/* ---------- 4. 側欄、標頭、搜尋、頁籤、篩選 ---------- */
html[data-theme="dark"] .side{background:var(--surface);border-right-color:var(--line)}
html[data-theme="dark"] .map,
html[data-theme="dark"] .navMap{background:#0b1420}
html[data-theme="dark"] .sheet-grab{background:var(--surface)}
html[data-theme="dark"] .sheet-grab::after{background:var(--line-strong)}
html[data-theme="dark"] .logo{background:#0b806e;border-color:rgba(255,255,255,.18);box-shadow:none}
html[data-theme="dark"] .field input,
html[data-theme="dark"] .iconbtn,
html[data-theme="dark"] .panel-toggle,
html[data-theme="dark"] .origin-controls button,
html[data-theme="dark"] .filters select,
html[data-theme="dark"] .navActions button,
html[data-theme="dark"] .gps-actions button,
html[data-theme="dark"] .navBack,
html[data-theme="dark"] .navVoice,
html[data-theme="dark"] .navStop,
html[data-theme="dark"] .geo-copy,
html[data-theme="dark"] .gm-copy{
  background:var(--surface);background-color:var(--surface);color:var(--text);border-color:var(--line);
}
html[data-theme="dark"] .field input:focus{background:var(--surface-2);box-shadow:0 0 0 3px var(--accent-soft)}
html[data-theme="dark"] .iconbtn.sm{color:var(--text-2)}
html[data-theme="dark"] .tab{background:var(--surface-2);color:var(--text-2)}
html[data-theme="dark"] .tab.active{background:var(--accent);border-color:var(--accent)}
html[data-theme="dark"] .nearestBox,
html[data-theme="dark"] .stat,
html[data-theme="dark"] .card,
html[data-theme="dark"] .navPanel,
html[data-theme="dark"] .audit,
html[data-theme="dark"] .about,
html[data-theme="dark"] .flood-summary,
html[data-theme="dark"] .navNow,
html[data-theme="dark"] .compat-note,
html[data-theme="dark"] .fuel-notice,
html[data-theme="dark"] .flood-history-details,
html[data-theme="dark"] .official-risk-dashboard{
  background:var(--surface);color:var(--text);border-color:var(--line);box-shadow:none;
}
html[data-theme="dark"] .nearestBox:hover,
html[data-theme="dark"] .card:hover{background:var(--surface-2);border-color:var(--accent-line)}
html[data-theme="dark"] .empty{background:var(--surface-2);color:var(--muted)}
html[data-theme="dark"] .card[data-type="charger"]{--card-accent:var(--charger)}
html[data-theme="dark"] .card[data-type="parking"]{--card-accent:var(--parking)}
html[data-theme="dark"] .card[data-type="fuel"]{--card-accent:var(--fuel)}
html[data-theme="dark"] .card[data-type="carwash"]{--card-accent:var(--carwash)}
html[data-theme="dark"] .card[data-vacancy="none"]{--card-accent:var(--danger)}
html[data-theme="dark"] .stat[data-k="total"]{--stat-color:#94a3b8}
html[data-theme="dark"] .stat[data-k="free"]{--stat-color:var(--charger)}
html[data-theme="dark"] .stat[data-k="chargers"]{--stat-color:var(--parking)}
html[data-theme="dark"] .stat[data-k="fuel"]{--stat-color:var(--fuel)}
html[data-theme="dark"] .risk-warning{background:#2a2214;border-color:#5c4a2a}
html[data-theme="dark"] .rw-body b{color:#f5c97b}
html[data-theme="dark"] .rw-body p{color:#d9c4a0}
html[data-theme="dark"] .dist{background:var(--surface-3);color:var(--text-2)}
html[data-theme="dark"] .badge{background:var(--surface-3);color:var(--text-2)}
html[data-theme="dark"] .badge.green{background:rgba(52,211,153,.18);color:#6ee7b7}
html[data-theme="dark"] .badge.amber{background:rgba(251,191,36,.18);color:#fcd34d}
html[data-theme="dark"] .badge.red{background:rgba(251,113,133,.18);color:#fda4af}
html[data-theme="dark"] .badge.flood.lv-vhigh,
html[data-theme="dark"] .wx-chip.lv-vhigh,
html[data-theme="dark"] .wx-level.lv-vhigh{background:rgba(251,113,133,.2);color:#ffd0d9;border-color:rgba(251,113,133,.45)}
html[data-theme="dark"] .badge.flood.lv-high,
html[data-theme="dark"] .wx-chip.lv-high,
html[data-theme="dark"] .wx-level.lv-high{background:rgba(251,146,60,.2);color:#ffe0d1;border-color:rgba(251,146,60,.45)}
html[data-theme="dark"] .badge.flood.lv-mid,
html[data-theme="dark"] .wx-chip.lv-mid,
html[data-theme="dark"] .wx-level.lv-mid{background:rgba(251,191,36,.18);color:#ffe9c2;border-color:rgba(251,191,36,.4)}
html[data-theme="dark"] .badge.flood.lv-low,
html[data-theme="dark"] .wx-chip.lv-low,
html[data-theme="dark"] .wx-level.lv-low{background:rgba(56,189,248,.18);color:#cdeaff;border-color:rgba(56,189,248,.4)}
html[data-theme="dark"] .wx-chip{background:var(--surface-3);color:var(--text-2);border-color:var(--line)}
html[data-theme="dark"] .ev-chip{background:var(--surface-3);color:var(--text-2)}
html[data-theme="dark"] .ev-chip.ev-carpark{background:rgba(52,211,153,.18);color:#6ee7b7;border-color:rgba(52,211,153,.35)}
html[data-theme="dark"] .ev-chip.ev-area{background:rgba(251,191,36,.16);color:#fcd34d;border-color:rgba(251,191,36,.35)}
html[data-theme="dark"] .ev-chip.ev-unverified{background:var(--surface-3);color:var(--text-2);border-color:var(--line)}

/* ---------- 5. 天氣橫幅、水浸、地理碼 ---------- */
html[data-theme="dark"] .wx-banner{background:var(--surface);border-color:var(--line)}
html[data-theme="dark"] .wx-banner[data-level="amber"]{background:rgba(120,83,10,.22);border-color:rgba(237,196,109,.45)}
html[data-theme="dark"] .wx-banner[data-level="red"],
html[data-theme="dark"] .wx-banner[data-level="black"]{background:rgba(120,25,32,.28);border-color:rgba(230,157,157,.45)}
html[data-theme="dark"] .wx-banner[data-level="flood"]{background:rgba(15,90,78,.26);border-color:rgba(156,207,196,.4)}
html[data-theme="dark"] .wx-banner[data-level="thunder"]{background:rgba(80,55,140,.26);border-color:rgba(195,178,234,.4)}
html[data-theme="dark"] .wx-ico{background:var(--surface-3);color:var(--text-2)}
html[data-theme="dark"] .wx-banner[data-level="amber"] .wx-ico{background:rgba(251,191,36,.22);color:#ffe4a3}
html[data-theme="dark"] .wx-banner[data-level="red"] .wx-ico,
html[data-theme="dark"] .wx-banner[data-level="black"] .wx-ico{background:rgba(251,113,133,.24);color:#ffd0d9}
html[data-theme="dark"] .wx-banner[data-level="flood"] .wx-ico{background:rgba(45,212,191,.22);color:#b5eadb}
html[data-theme="dark"] .wx-banner[data-level="thunder"] .wx-ico{background:rgba(167,139,250,.24);color:#e7dcff}
html[data-theme="dark"] .wx-warn,
html[data-theme="dark"] .wx-rain-grid div{background:var(--surface-2);border-color:var(--line)}
html[data-theme="dark"] .wx-rain{background:rgba(56,189,248,.1);border-color:rgba(56,189,248,.3)}
html[data-theme="dark"] .wx-rain>b{color:#cdeaff}
html[data-theme="dark"] .wx-rain p{color:#b9d8ec}
html[data-theme="dark"] .wx-links a{color:#8fd6ff;background:rgba(56,189,248,.14)}
html[data-theme="dark"] .flood-live{background:rgba(56,189,248,.1);border-color:rgba(56,189,248,.3)}
html[data-theme="dark"] .flood-live[data-level="none"]{background:rgba(56,189,248,.1);border-color:rgba(56,189,248,.3)}
html[data-theme="dark"] .flood-live[data-level="amber"]{background:rgba(120,83,10,.24);border-color:rgba(237,196,109,.42)}
html[data-theme="dark"] .flood-live[data-level="red"],
html[data-theme="dark"] .flood-live[data-level="black"]{background:rgba(120,25,32,.28);border-color:rgba(230,157,157,.45)}
html[data-theme="dark"] .flood-live[data-level="flood"]{background:rgba(15,90,78,.26);border-color:rgba(156,207,196,.4)}
html[data-theme="dark"] .flood-live-grid>div,
html[data-theme="dark"] .flood-live-zone{background:var(--surface-2);border-color:var(--line);color:var(--text-2)}
html[data-theme="dark"] .flood-live-grid b{color:var(--text)}
html[data-theme="dark"] .flood-src{background:var(--surface-2)}
html[data-theme="dark"] .flood-src.ref{background:rgba(56,189,248,.1);border-color:rgba(56,189,248,.3)}
html[data-theme="dark"] .flood-src summary,
html[data-theme="dark"] .flood-src.ref summary,
html[data-theme="dark"] .flood-method b{color:#8fd6ff}
html[data-theme="dark"] .flood-pending{background:var(--surface-2)}
html[data-theme="dark"] .flood-card .flood-rank,
html[data-theme="dark"] .flood-card .flood-chip{background:var(--surface-3);color:var(--text-2)}
html[data-theme="dark"] .flood-card.lv-vhigh .flood-rank,
html[data-theme="dark"] .flood-card .flood-chip.lv-vhigh{background:rgba(251,113,133,.22);color:#ffd0d9}
html[data-theme="dark"] .flood-card.lv-high .flood-rank,
html[data-theme="dark"] .flood-card .flood-chip.lv-high{background:rgba(251,146,60,.22);color:#ffe0d1}
html[data-theme="dark"] .flood-card.lv-mid .flood-rank,
html[data-theme="dark"] .flood-card .flood-chip.lv-mid{background:rgba(251,191,36,.2);color:#ffe9c2}
html[data-theme="dark"] .flood-card.lv-low .flood-rank,
html[data-theme="dark"] .flood-card .flood-chip.lv-low{background:rgba(56,189,248,.2);color:#cdeaff}
html[data-theme="dark"] .flood-alert{background:rgba(120,25,32,.28);border-color:rgba(233,154,167,.45)}
html[data-theme="dark"] .flood-alert b,
html[data-theme="dark"] .flood-alert span{color:#ffd0d9}
html[data-theme="dark"] .flood-alert.lv-mid{background:rgba(120,83,10,.24);border-color:rgba(237,196,109,.42)}
html[data-theme="dark"] .flood-alert.lv-mid b,
html[data-theme="dark"] .flood-alert.lv-mid span{color:#ffe3a8}
html[data-theme="dark"] .flood-alert.lv-low{background:rgba(56,189,248,.18);border-color:rgba(184,213,235,.4)}
html[data-theme="dark"] .flood-alert.lv-low b,
html[data-theme="dark"] .flood-alert.lv-low span{color:#cdeaff}
html[data-theme="dark"] .flood-advice{background:rgba(251,113,133,.16);color:#ffd0d9;border-color:rgba(251,113,133,.4)}
html[data-theme="dark"] .flood-card.lv-mid .flood-advice,
html[data-theme="dark"] .flood-card.lv-low .flood-advice{background:rgba(56,189,248,.14);color:#cdeaff;border-color:rgba(56,189,248,.35)}
html[data-theme="dark"] .flood-live-line{background:rgba(56,189,248,.14);color:#cdeaff;border-color:rgba(56,189,248,.35)}
html[data-theme="dark"] .flood-pop b{color:#ffd0d9}
html[data-theme="dark"] .geocode-me{background:rgba(56,189,248,.12);border-color:rgba(56,189,248,.35)}
html[data-theme="dark"] .gm-label,
html[data-theme="dark"] .geocode-me b,
html[data-theme="dark"] .nav-geo span,
html[data-theme="dark"] .nav-geo b,
html[data-theme="dark"] .geo-line b{color:#8fd6ff}
html[data-theme="dark"] .geo-line b,
html[data-theme="dark"] .nav-code,
html[data-theme="dark"] .geo-pop,
html[data-theme="dark"] .nav-geo{background:var(--surface-2);color:var(--text-2);border-color:var(--line)}
html[data-theme="dark"] .geo-pop b,
html[data-theme="dark"] .nav-code{color:#bfe3ff}
html[data-theme="dark"] .geo-copy,
html[data-theme="dark"] .gm-copy{color:#8fd6ff;border-color:rgba(56,189,248,.35)}
html[data-theme="dark"] .geo-copy:hover,
html[data-theme="dark"] .gm-copy:hover{background:var(--surface-3);color:#cbeaff}

/* ---------- 6. 導航面板與導航頁 ---------- */
html[data-theme="dark"] .navPanel{background:#13251f;border-color:rgba(110,231,183,.3)}
html[data-theme="dark"] .navNow{background:var(--surface-2)}
html[data-theme="dark"] .voiceOn{color:#6ee7b7!important;background:rgba(52,211,153,.16)!important;border-color:rgba(110,231,183,.4)!important}
html[data-theme="dark"] .navTurnIcon{background:var(--accent);color:var(--on-accent,#0b1420)}
html[data-theme="dark"] .navProgress{background:var(--surface-3)}
html[data-theme="dark"] .external-nav{background:rgba(56,189,248,.14);color:#8fd6ff;border-color:rgba(56,189,248,.35)}
html[data-theme="dark"] .external-nav:hover{background:rgba(56,189,248,.22);color:#cbeaff}
html[data-theme="dark"] .navStop{background:rgba(251,113,133,.16);border-color:rgba(251,113,133,.4);color:#fda4af}
html[data-theme="dark"] .navStop:hover{background:rgba(251,113,133,.24);color:#fecdd3}
html[data-theme="dark"] .nav-wx{background:rgba(251,191,36,.16);color:#fde68a}
html[data-theme="dark"] .nav-wx[data-level="red"],
html[data-theme="dark"] .nav-wx[data-level="black"]{background:rgba(251,113,133,.16);color:#ffd0d9}
html[data-theme="dark"] .nav-wx[data-level="flood"]{background:rgba(45,212,191,.16);color:#c9fff8}
html[data-theme="dark"] .gps-panel,
html[data-theme="dark"] .navMetrics .metric{background:var(--surface-2);border-color:var(--line)}
html[data-theme="dark"] .navTopCard,
html[data-theme="dark"] .navBottom{background:var(--surface)}
html[data-theme="dark"] .navPage{background:var(--bg)}

/* ---------- 7. 地圖覆蓋層、圖例、工具列、瓦片 ---------- */
html[data-theme="dark"] .map-deck,
html[data-theme="dark"] .panel-open,
html[data-theme="dark"] .legend,
html[data-theme="dark"] .native-zoom,
html[data-theme="dark"] .native-popup,
html[data-theme="dark"] .map-attribution{
  background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important;
}
html[data-theme="dark"] .deck-nav,
html[data-theme="dark"] .deck-option{color:var(--text-2)}
html[data-theme="dark"] .deck-nav:hover,
html[data-theme="dark"] .deck-option:hover{color:var(--accent);background:var(--accent-soft)}
html[data-theme="dark"] .deck-dots i{background:var(--line-strong)}
html[data-theme="dark"] .deck-dots i.on{background:var(--accent)}
html[data-theme="dark"] .legend .lg{background:var(--surface-2);color:var(--text-2);border-color:var(--line)}
html[data-theme="dark"] .native-attribution{color:#b8c8da!important}
html[data-theme="dark"] .native-attribution a{color:#8fd6ff!important}
html[data-theme="dark"] .native-zoom button{background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}
html[data-theme="dark"] .native-zoom button:hover{background:var(--surface-3)!important}
html[data-theme="dark"] .native-popup{background:var(--surface)!important;color:var(--text)!important;border-radius:11px!important}
html[data-theme="dark"] .native-popup::after,
html[data-theme="dark"] .native-popup-tip{background:var(--surface)!important}
html[data-theme="dark"] .wx-map-badge{background:#2a2214!important;color:#f5c97b!important;border-color:#5c4a2a!important}
html[data-theme="dark"] .wx-map-badge[data-level="red"],
html[data-theme="dark"] .wx-map-badge[data-level="black"]{background:#33161c!important;color:#ffd0d9!important;border-color:rgba(230,157,157,.5)!important}
html[data-theme="dark"] .wx-map-badge[data-level="flood"]{background:#0f2a24!important;color:#b5eadb!important;border-color:rgba(156,207,196,.45)!important}
html[data-theme="dark"] .wx-map-badge[data-level="thunder"]{background:#211b33!important;color:#e7dcff!important;border-color:rgba(195,178,234,.45)!important}
html[data-theme="dark"] .district-tag,
html[data-theme="dark"] .geo2d{background:var(--surface)!important;border-color:var(--line-strong);color:var(--text)}
html[data-theme="dark"] .district-tag.lv-light{background:#12324c!important;border-color:rgba(56,189,248,.58)!important}
html[data-theme="dark"] .district-tag.lv-light b,
html[data-theme="dark"] .district-tag.lv-light span{color:#bfe9ff}
html[data-theme="dark"] .district-tag.lv-moderate{background:#33260a!important;border-color:rgba(251,191,36,.6)!important}
html[data-theme="dark"] .district-tag.lv-moderate b,
html[data-theme="dark"] .district-tag.lv-moderate span{color:#ffe3a8}
html[data-theme="dark"] .district-tag.lv-heavy{background:#331b0e!important;border-color:rgba(251,146,60,.65)!important}
html[data-theme="dark"] .district-tag.lv-heavy b,
html[data-theme="dark"] .district-tag.lv-heavy span{color:#ffd4bd}
html[data-theme="dark"] .district-tag.lv-vheavy{background:#331019!important;border-color:rgba(251,113,133,.7)!important}
html[data-theme="dark"] .district-tag.lv-vheavy b,
html[data-theme="dark"] .district-tag.lv-vheavy span{color:#ffd0d9}
html[data-theme="dark"] .district-tag.active{border-color:var(--accent)!important}
html[data-theme="dark"] .marker2d small{background:var(--surface);color:var(--text);border-color:var(--line-strong)}
html[data-theme="dark"] .dest-label{background:var(--surface);color:var(--text);border-color:var(--line)}
html[data-theme="dark"] .native-ui{filter:none}
html[data-theme="dark"] .native-tiles{background:#0b1420!important}
html[data-theme="dark"] .native-tiles img{filter:invert(1) hue-rotate(180deg) brightness(.82) contrast(.9) saturate(.65)}
html[data-theme="dark"] .native-vectors{filter:none}
html[data-theme="dark"] .side,
html[data-theme="dark"] .steps,
html[data-theme="dark"] .navBottom,
html[data-theme="dark"] .navUpcoming,
html[data-theme="dark"] .audit-body,
html[data-theme="dark"] .about-body,
html[data-theme="dark"] .navTopCard,
html[data-theme="dark"] .start-panel{scrollbar-color:#40586e transparent}

/* ---------- 8. 開始畫面、到達畫面、車輛選擇 ---------- */
html[data-theme="dark"] .start-screen,
html[data-theme="dark"] .arrival-scene{background:rgba(8,15,24,.97)}
html[data-theme="dark"] .start-panel,
html[data-theme="dark"] .arrival-card{background:var(--surface);color:var(--text);border-color:var(--line)}
html[data-theme="dark"] .vehicle-choice{background:var(--surface-2);color:var(--text);border-color:var(--line)}
html[data-theme="dark"] .vehicle-choice:hover{background:var(--accent-soft);border-color:var(--accent)}
html[data-theme="dark"] .vehicle-choice.fuel .vicon{background:rgba(251,146,60,.18)}
html[data-theme="dark"] .vehicle-choice.ev .vicon{background:rgba(52,211,153,.18)}
html[data-theme="dark"] .vehicle-choice .vgo{color:#6ee7b7}
html[data-theme="dark"] .vehicle-choice.fuel .vgo{color:#fcd34d}
html[data-theme="dark"] .start-features li{background:var(--surface-2);color:var(--text-2);border-color:var(--line)}
html[data-theme="dark"] #locationConsentStatus{color:#8fd6ff}
html[data-theme="dark"] #allowLocationNow:disabled{background:var(--surface-3);border-color:var(--line)}

/* ---------- 9. details / 稽核 / 關於 ---------- */
html[data-theme="dark"] .about-meta{color:#8fd6ff}
html[data-theme="dark"] .about-list b,
html[data-theme="dark"] .about-sources dd b{color:#dcebf8}
html[data-theme="dark"] .about-sources dt{color:#bcd6ea}
html[data-theme="dark"] .audit-body b{color:#7ef0c0}
html[data-theme="dark"] .about-body code{color:#bfe3ff;background:rgba(56,189,248,.12);border-color:var(--line)}
html[data-theme="dark"] .about-note{background:rgba(251,191,36,.12);color:#f3c97a;border-color:rgba(251,191,36,.35)}
html[data-theme="dark"] .audit summary:hover,
html[data-theme="dark"] .about summary:hover,
html[data-theme="dark"] .flood-src summary:hover{color:var(--accent)}

/* ---------- 10. 官方風險儀表板（risk-2d.css）---------- */
html[data-theme="dark"] .official-risk-dashboard{background:var(--surface);border-color:var(--line);color:var(--text-2)}
html[data-theme="dark"] .official-title h3{color:var(--text)}
html[data-theme="dark"] .official-title p{color:var(--text-2)}
html[data-theme="dark"] .official-eyebrow{color:#5eead4}
html[data-theme="dark"] .official-kpi>div{background:var(--surface-2);border-color:var(--line)}
html[data-theme="dark"] .official-kpi b{color:#5eead4}
html[data-theme="dark"] .official-kpi span{color:var(--muted)}
html[data-theme="dark"] .official-filter-title,
html[data-theme="dark"] .official-subhead h4,
html[data-theme="dark"] .official-terrain h4{color:var(--text)}
html[data-theme="dark"] .official-filter{background:var(--surface-2);border-color:var(--line);color:var(--text-2)}
html[data-theme="dark"] .official-filter:has(input:checked){background:rgba(45,212,191,.16);border-color:rgba(94,234,212,.45);color:#99f6e4}
html[data-theme="dark"] .official-filter input{accent-color:var(--accent)}
html[data-theme="dark"] .official-subhead>span,
html[data-theme="dark"] .official-muted{color:var(--muted)}
html[data-theme="dark"] .official-sections,
html[data-theme="dark"] .official-tide,
html[data-theme="dark"] .official-terrain{border-top-color:var(--line)}
html[data-theme="dark"] .official-record{background:var(--surface-2);border-color:var(--line)}
html[data-theme="dark"] .official-record strong{color:var(--text-2)}
html[data-theme="dark"] .official-record small{color:var(--muted)}
html[data-theme="dark"] .official-record-actions button{background:rgba(56,189,248,.14);border-color:rgba(56,189,248,.35);color:#8fd6ff}
html[data-theme="dark"] .official-record-actions a,
html[data-theme="dark"] .official-links a{color:#7cc4ff}
html[data-theme="dark"] .official-terrain{background:rgba(251,191,36,.08);border-color:rgba(251,191,36,.25)}
html[data-theme="dark"] .official-terrain p{color:#d8c9a8}
html[data-theme="dark"] .official-tide>p{color:var(--muted)}
html[data-theme="dark"] .official-tide p strong{color:var(--text-2)}
html[data-theme="dark"] .official-status{background:var(--surface-3);color:var(--text-2)}
html[data-theme="dark"] .official-status.is-fresh{background:rgba(52,211,153,.2);color:#6ee7b7}
html[data-theme="dark"] .official-status.is-stale{background:rgba(251,191,36,.2);color:#fcd34d}
html[data-theme="dark"] .official-tide-row{background:var(--surface-2);border-color:var(--line)}
html[data-theme="dark"] .official-tide-row b{color:var(--text-2)}
html[data-theme="dark"] .official-tide-row strong{color:#8fd6ff}
html[data-theme="dark"] .official-tide-row small{color:var(--muted)}
html[data-theme="dark"] .official-principles{background:rgba(251,191,36,.1);border-left-color:#c5802f}
html[data-theme="dark"] .official-principles b{color:#f3c97a}
html[data-theme="dark"] .official-principles p{color:#d0bd9d}
html[data-theme="dark"] .official-anchor-popup h3{color:#8fd6ff}
html[data-theme="dark"] .official-more,
html[data-theme="dark"] .flood-history-details{background:var(--surface-2);border-color:var(--line)}
html[data-theme="dark"] .official-more>summary,
html[data-theme="dark"] .flood-history-details>summary{color:#8fd6ff}

/* 深色下不作多餘動畫（尊重 prefers-reduced-motion 亦不新增過渡） */
@media(prefers-reduced-motion:reduce){
  html[data-theme="dark"] .deck-track{transition:none}
}