/* ===================================================================
   ds-theme-dark.css · 深色主题兜底层（方案 A「夜色微醺」）
   -------------------------------------------------------------------
   职责：只补「变量覆盖不到的硬编码浅色」，变量本身在 tokens.css 的
         html[data-theme="dark"] 里，本文件不含任何变量定义。

   作用域：所有规则一律 html[data-theme="dark"] 前缀，
           浅色主题下本文件完全不生效（这是与旧 ds-nocturne.css 的关键差别，
           旧版无条件全局生效，无法做深浅切换）。

   加载顺序：tokens.css → styles.css → ds-*.css → ds-gather-v2.css
             → 本文件（最后）。不含 !important。

   排查依据：styles.css 73 处硬编码浅色 + ds-home/gather/controls 11 处。
   已知漏网白底（本次补齐）：
     · .empty 的 #fffdfa          → 统计页「暂无数据」白框（leaderRows 空态）
     · .retry / .btn.primary 白字 → 琥珀底白字对比度不足，改 --on-brand
     .banner-dot 纯白指示点       → 深色下与未选中态区分度不足
     · 占位图 PALETTES 暖色渐变   → 相册未上传照片时的大块"白疤"
   =================================================================== */

/* ------------------------------------------------------------------
   1. 壳与导航
   ------------------------------------------------------------------ */
html[data-theme="dark"] body { background: var(--bg); color: var(--ink); }
html[data-theme="dark"] .home-header { background: var(--bg); border-bottom-color: var(--line); }
/* 底栏（.mobile-nav）已迁到唯一真源 ds-nav-v3.css（2026-10-24），本文件不再定义。 */
html[data-theme="dark"] .footer { color: var(--ds-text-tertiary); }
html[data-theme="dark"] .brandmark { background: var(--ds-surface-soft); color: var(--wine); }
html[data-theme="dark"] .brand small { color: var(--ds-text-tertiary); }
html[data-theme="dark"] .sidebar { background: var(--ds-surface); border-right-color: var(--line); }

/* ------------------------------------------------------------------
   2. 字体：去衬线 + 数字等宽
   ------------------------------------------------------------------ */
html[data-theme="dark"] .serif,
html[data-theme="dark"] .quote p,
html[data-theme="dark"] .recipe-body h3,
html[data-theme="dark"] .rank-num { font-family: var(--ds-font-display); }

html[data-theme="dark"] .stat-tile .n,
html[data-theme="dark"] .person-counter b,
html[data-theme="dark"] .mini-stat .num,
html[data-theme="dark"] .person-summary b,
html[data-theme="dark"] .leader-row .score,
html[data-theme="dark"] .album-date b,
html[data-theme="dark"] .memory-foot .micro {
  font-variant-numeric: tabular-nums;
}

/* ------------------------------------------------------------------
   3. 卡片 / 封面 / 图片
   图片描边：深色模式用纯白低透明，不可用带色调中性色（会吸底色成脏边）
   ------------------------------------------------------------------ */
html[data-theme="dark"] .memory-card:hover { box-shadow: 0 10px 28px rgba(0, 0, 0, .5); }
html[data-theme="dark"] .memory-art { background: var(--ds-surface-soft); }
html[data-theme="dark"] .memory-art .pill { background: rgba(21, 18, 26, .82); color: var(--ink); }
html[data-theme="dark"] .memory-art img,
html[data-theme="dark"] .photo-tile img,
html[data-theme="dark"] .detail-hero img,
html[data-theme="dark"] .recipe-art img,
html[data-theme="dark"] .modal-art img,
html[data-theme="dark"] .hero-art img,
html[data-theme="dark"] .banner-slide img {
  outline: 1px solid rgba(255, 255, 255, .10);
  outline-offset: -1px;
}
html[data-theme="dark"] .photo-tile { background: var(--ds-surface-soft); }
html[data-theme="dark"] .photo-tile .photo-overlay { background: linear-gradient(transparent, rgba(10, 8, 14, .88)); }
html[data-theme="dark"] .media-badge { background: rgba(21, 18, 26, .82); }
html[data-theme="dark"] .hero,
html[data-theme="dark"] .detail-hero,
html[data-theme="dark"] .gallery-feature,
html[data-theme="dark"] .recipe-art,
html[data-theme="dark"] .modal-art { background: var(--ds-surface-soft); border-color: var(--line); }
html[data-theme="dark"] .hero .subtitle { color: var(--ds-text-secondary); }
html[data-theme="dark"] .hero-art { background: #2E2839; }
html[data-theme="dark"] .hero .btn { background: var(--ds-surface); }
html[data-theme="dark"] .game-symbol { background: var(--ds-surface-soft); color: var(--wine); }

/* 占位图（core.js art() 生成的暖色渐变 SVG）：深色下降亮降饱和，
   否则相册未上传照片处会出现一大块"白疤"。真实照片是 img，不受影响。 */
html[data-theme="dark"] .memory-art svg,
html[data-theme="dark"] .photo-tile svg,
html[data-theme="dark"] .detail-hero svg,
html[data-theme="dark"] .recipe-art svg,
html[data-theme="dark"] .modal-art svg,
html[data-theme="dark"] .hero-art svg,
html[data-theme="dark"] .banner-slide svg,
html[data-theme="dark"] .album-grid svg {
  filter: brightness(.78) saturate(.82);
}

/* ------------------------------------------------------------------
   4. 按钮：主按钮文字统一 --on-brand（深色主题自动转墨色）
   ------------------------------------------------------------------ */
html[data-theme="dark"] .btn { background: var(--ds-surface); border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] .btn:hover { background: #2E2839; }
html[data-theme="dark"] .btn.primary { background: var(--wine); border-color: var(--wine); color: var(--on-brand); }
html[data-theme="dark"] .btn.primary:hover { background: var(--ds-brand-hover); }
html[data-theme="dark"] .btn.soft { background: var(--wine-soft); color: var(--wine); }
html[data-theme="dark"] .fab-primary { background: var(--wine); color: var(--on-brand); }
html[data-theme="dark"] .fab-primary:hover { background: var(--ds-brand-hover); }
html[data-theme="dark"] .retry { color: var(--on-brand); }
html[data-theme="dark"] .ds-button-primary { color: var(--on-brand); }
html[data-theme="dark"] .float-actions .icon-act { background: var(--ds-surface); border-color: var(--ds-border); }

/* ------------------------------------------------------------------
   5. 输入 / 表单 / 选择区
   ------------------------------------------------------------------ */
html[data-theme="dark"] .search,
html[data-theme="dark"] .filter { background: var(--ds-surface); border-color: var(--line); }
html[data-theme="dark"] .filter { color: var(--ds-text-secondary); }
html[data-theme="dark"] .field > span { color: var(--ds-text-secondary); }
html[data-theme="dark"] .field input,
html[data-theme="dark"] .field select,
html[data-theme="dark"] .field textarea { background: var(--ds-surface-soft); border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] .composer textarea { background: var(--ds-surface-soft); }
html[data-theme="dark"] .form-hint { background: var(--ds-surface-soft); color: var(--ds-text-secondary); }
html[data-theme="dark"] .check-pill,
html[data-theme="dark"] .check-list,
html[data-theme="dark"] .people-picker { background: var(--ds-surface-soft); }
html[data-theme="dark"] .person-row:hover { background: #2E2839; }
html[data-theme="dark"] .close-btn { background: var(--ds-surface-soft); }
html[data-theme="dark"] .file-drop {
  background: var(--ds-surface-soft);
  border-color: rgba(243, 239, 234, .18);
  color: var(--ds-text-secondary);
}
html[data-theme="dark"] .progress,
html[data-theme="dark"] .quota-bar,
html[data-theme="dark"] .meter { background: var(--ds-surface-soft); }
html[data-theme="dark"] .meter span,
html[data-theme="dark"] .progress span { background: var(--wine); }

/* ------------------------------------------------------------------
   6. 标签 / 分段 / 徽标
   ------------------------------------------------------------------ */
html[data-theme="dark"] .pill { background: var(--ds-surface-soft); color: var(--ds-text-secondary); }
html[data-theme="dark"] .pill.wine { background: var(--wine-soft); color: var(--wine); }
html[data-theme="dark"] .pill.green { background: var(--green-soft); color: var(--green); }
html[data-theme="dark"] .pill.red { background: rgba(232, 131, 111, .14); color: var(--ds-error); }
html[data-theme="dark"] .tag { background: var(--ds-surface-soft); color: var(--ds-text-secondary); }
html[data-theme="dark"] .segmented { background: var(--ds-surface-soft); }
html[data-theme="dark"] .segmented button.active { background: #2E2839; color: var(--wine); box-shadow: none; }
html[data-theme="dark"] .drink-strip { background: var(--ds-surface-soft); }
html[data-theme="dark"] .drink-strip label { color: var(--ds-text-secondary); }
html[data-theme="dark"] .drink-chip.active { background: #2E2839; border-color: rgba(232, 163, 74, .40); }
html[data-theme="dark"] .memory-status.ongoing { color: var(--green); }
html[data-theme="dark"] .memory-status.ongoing .dot { background: var(--green); }
/* 轮播指示点：纯白在深色下与未选中态区分不足，改用暖白 + 琥珀选中 */
html[data-theme="dark"] .banner-dot { background: rgba(243, 239, 234, .28); }
html[data-theme="dark"] .banner-dot.active { background: var(--wine); }

/* ------------------------------------------------------------------
   7. 列表 / 统计 / 图表 / 空态
   .empty 原 background:#fffdfa 是统计页「暂无数据」白框的直接来源
   ------------------------------------------------------------------ */
html[data-theme="dark"] .empty {
  background: var(--ds-surface);
  border-color: var(--line);
  color: var(--ds-text-secondary);
}
html[data-theme="dark"] .empty .empty-art { background: var(--ds-surface-soft); color: var(--ds-text-secondary); }
html[data-theme="dark"] .mini-stat { border-bottom-color: var(--line); }
html[data-theme="dark"] .mini-stat .badge { background: var(--ds-surface-soft); color: var(--wine); }
html[data-theme="dark"] .event,
html[data-theme="dark"] .games-mini { border-bottom-color: var(--line); }
html[data-theme="dark"] .games-mini .ico { color: var(--wine); }
html[data-theme="dark"] .event-time { color: var(--ds-text-tertiary); }
html[data-theme="dark"] .person-meta,
html[data-theme="dark"] .live-note,
html[data-theme="dark"] .warning-note { color: var(--ds-text-secondary); }
html[data-theme="dark"] .quote { background: var(--ds-surface-soft); }
html[data-theme="dark"] .quote small { color: var(--ds-text-secondary); }
html[data-theme="dark"] .callout { background: var(--ds-surface-soft); border-left-color: var(--wine); color: #C9C3D2; }
html[data-theme="dark"] .callout.warn { background: rgba(232, 163, 74, .10); border-left-color: var(--amber); color: #E8CFA0; }
html[data-theme="dark"] .node { background: var(--ds-surface-soft); border-color: var(--line); }
html[data-theme="dark"] .node.wine { background: var(--wine-soft); border-color: rgba(232, 163, 74, .30); }
html[data-theme="dark"] .node.green { background: var(--green-soft); border-color: rgba(127, 176, 138, .30); }
html[data-theme="dark"] .branch { background: var(--ds-surface-soft); }
html[data-theme="dark"] .branch-line { color: var(--ds-text-secondary); }
html[data-theme="dark"] .branch-line + .branch-line { border-top-color: rgba(243, 239, 234, .12); }
html[data-theme="dark"] .rules-table th { background: var(--ds-surface-soft); color: var(--ds-text-secondary); }
html[data-theme="dark"] .rules-table tr:nth-child(even) { background: rgba(243, 239, 234, .03); }
html[data-theme="dark"] .bar { background: #3A3450; }
html[data-theme="dark"] .bar-item b { color: var(--ds-text-secondary); }
html[data-theme="dark"] .calendar-day { background: var(--ds-surface-soft); }
html[data-theme="dark"] .calendar-day.has {
  background: var(--wine-soft);
  color: var(--wine);
  border-color: rgba(232, 163, 74, .35);
}
html[data-theme="dark"] .month-grid .weekday { color: var(--ds-text-tertiary); }
html[data-theme="dark"] .me-row .ico { color: var(--wine); }
html[data-theme="dark"] .me-row .arrow-ico { color: var(--ds-text-tertiary); }
html[data-theme="dark"] .spec-grid ol,
html[data-theme="dark"] .spec-grid ul { color: var(--ds-text-secondary); }
html[data-theme="dark"] .node small,
html[data-theme="dark"] .arrow { color: var(--ds-text-tertiary); }

/* ------------------------------------------------------------------
   8. 弹窗 / toast / 骨架
   ------------------------------------------------------------------ */
html[data-theme="dark"] .modal-backdrop { background: rgba(8, 6, 10, .66); }
html[data-theme="dark"] .toast { background: #2E2839; color: var(--ink); }
html[data-theme="dark"] .toast button { color: var(--wine); }
html[data-theme="dark"] .skeleton .sk-card { background: var(--ds-surface-soft); }
html[data-theme="dark"] .sk-line {
  background: linear-gradient(90deg, #262130 25%, #2E2839 37%, #262130 63%);
  background-size: 400% 100%;
}

/* ------------------------------------------------------------------
   9. 头像色块 a0–a5：原浅色在深底上过艳
   ------------------------------------------------------------------ */
html[data-theme="dark"] .a0 { background: #243642; color: #8FB3CC; }
html[data-theme="dark"] .a1 { background: #3A3221; color: #C9A96A; }
html[data-theme="dark"] .a2 { background: #302A3C; color: #B49BC2; }
html[data-theme="dark"] .a3 { background: #3C2A2C; color: #C89097; }
html[data-theme="dark"] .a4 { background: #26362A; color: #90B79C; }
html[data-theme="dark"] .a5 { background: #3A3128; color: #C0A075; }

/* ------------------------------------------------------------------
   10. 交互反馈
   ------------------------------------------------------------------ */
html[data-theme="dark"] button:focus-visible,
html[data-theme="dark"] a:focus-visible { outline-color: var(--wine); }
html[data-theme="dark"] .focus-media { outline-color: var(--wine); }
html[data-theme="dark"] .field input:focus,
html[data-theme="dark"] .field select:focus,
html[data-theme="dark"] .field textarea:focus { outline-color: var(--wine); }
/* 按压 0.96 是手感下限，不得更小 */
html[data-theme="dark"] .btn:active,
html[data-theme="dark"] .person-actions .btn:active,
html[data-theme="dark"] .action-row .btn:active,
html[data-theme="dark"] .home-tab:active { transform: scale(.96); }
/* 只过渡具体属性，禁止 transition: all */
html[data-theme="dark"] .btn { transition: background-color .16s ease, transform .12s ease; }