/* ============================================================
   ds-gather-v2.css · 「聚一聚」新中式 Apple 极简风 · 视觉重构 v2
   ------------------------------------------------------------
   范围：仅「聚一聚」首页信息流（吸顶头部 / 状态条 / 轮播 / 筛选行 /
         三段信息流 hero-卡片-分组 / 触底提示 / 右下 FAB）。
   加载顺序：styles.css → ds-shell/controls/home/gather/social/account/a11y
            → 本文件（最后引入，纯叠加覆盖，不含 !important）。
   约束：
     1) 只做颜色 / 字体 / 圆角 / 阴影 / 间距 / 动效层面的覆盖；
        不新增任何 data-* 选择器依赖，不改变盒模型导致的点击区域变化。
     2) 结构类名（.home-header .memory-card .gather-hero 等）完全沿用
        真实渲染产物（server/public/app.js、components.js），
        不是凭空假设的类名。
     3) 本文件专门清理 styles.css 里残留的「暖米旧色」
        （--wine/--amber/--paper/--line/--muted/--ink 等旧变量）
        在聚一聚页面范围内的最后几处遗留引用，统一换成 tokens.css
        的 --ds-* 新中式令牌；不触碰 styles.css 本身。
   ============================================================ */

/* ---------------------------------------------------------------
   0. 吸顶头部：冷灰白基底，去掉旧暖米背景 / 边框
   --------------------------------------------------------------- */
.home-header {
  background: var(--ds-surface, #fff);
  border-bottom: 1px solid var(--ds-border, rgba(26, 26, 26, .08));
}
.home-filter .home-crumb {
  font-family: var(--ds-font-display, "Songti SC", SimSun, serif);
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--ds-ink, #1a1a1a);
}
.home-filter .home-crumb .ico { color: var(--ds-text-tertiary, #a1a1a6); }
.home-filter .home-slogan { color: var(--ds-text-secondary, #6e6e73); }

/* 四个 Tab：未选中冷灰，选中态朱砂下划线（选中态 = 朱砂的唯一出场之一） */
.home-tab { color: var(--ds-text-secondary, #6e6e73); }
.home-tab.active { color: var(--ds-ink, #1a1a1a); }
.home-tab.active::after { background: var(--ds-brand, #9a2a2a); }

/* ---------------------------------------------------------------
   1. 状态条：当前状态只给文字权重，不再借用旧 --green/--muted
   --------------------------------------------------------------- */
.status-strip { color: var(--ds-ink, #1a1a1a); }
.status-strip.idle { color: var(--ds-text-secondary, #6e6e73); }
.status-strip .auto { color: var(--ds-text-tertiary, #a1a1a6); }

/* ---------------------------------------------------------------
   2. 轮播：圆角已是 20px，指示器改成真正的长条胶囊（原为 4px 圆角矩形）
   --------------------------------------------------------------- */
.banner-dot {
  border-radius: var(--ds-radius-button, 999px);
  transition: width .25s ease, background-color .25s ease;
}
.banner-dot.active {
  width: 20px;
  border-radius: var(--ds-radius-button, 999px);
}

/* 2.1 封面图片：禁止任何滤镜/渲染加工，单纯展示原图（覆盖旧版降饱和处理）
   —— 覆盖 styles.css 里 is-ended 卡片对封面加的 saturate(.75) 滤镜 */
.memory-art img,
.memory-art svg,
.hero-art img,
.hero-art svg,
.banner-slide img,
.banner-slide svg {
  filter: none;
}
.memory-card.is-ended .memory-art img,
.memory-card.is-ended .memory-art svg {
  filter: none;
}

/* ---------------------------------------------------------------
   3. 筛选行：输入态文字颜色跟随新墨色，placeholder 用三级灰
   --------------------------------------------------------------- */
#home-feed .filters input,
#home-feed .filters select {
  color: var(--ds-ink, #1a1a1a);
}
#home-feed .filters input::placeholder {
  color: var(--ds-text-tertiary, #a1a1a6);
}
#home-feed .filters .search .ico {
  color: var(--ds-text-tertiary, #a1a1a6);
}

/* ---------------------------------------------------------------
   4. 分组标题 / 卡片标题：统一宋体衬线，字重 600，字距放宽
   --------------------------------------------------------------- */
.group-head h3 {
  font-family: var(--ds-font-display, "Songti SC", SimSun, serif);
  letter-spacing: .025em;
}
.memory-card .memory-copy h3 {
  font-family: var(--ds-font-display, "Songti SC", SimSun, serif);
  font-weight: 600;
  letter-spacing: .02em;
}
/* 标题预留右上悬浮操作键（开始 / 置顶 / 编辑，最多 3 个 × 30px + 间距）的位置，
   避免长标题被图标盖住；标题本身仍是单行省略，不换行 */
.memory-card .memory-copy h3 { padding-right: 100px; }
.memory-meta,
.memory-status { color: var(--ds-text-secondary, #6e6e73); }
.memory-status.ongoing { color: var(--ds-bronze, #4a5d4e); }
.memory-status.ongoing .dot { background: var(--ds-bronze, #4a5d4e); }
.memory-foot .micro { color: var(--ds-text-tertiary, #a1a1a6); }

/* 置顶 = 选中态，统一用朱砂（原来是旧 --amber 暖橙，与新色板不协调） */
.memory-foot .pill.amber {
  background: var(--ds-brand-soft, #f7ebeb);
  color: var(--ds-brand, #9a2a2a);
  font-weight: 650;
  border: none;
}

/* ---------------------------------------------------------------
   5. 卡片 = 一整个白框，左半部分是完整展示的封面图片
   - 整卡统一 20px 圆角 + 卡片阴影，封面区不再有任何叠加元素
     （日期徽章 card-date、封面角标头像 cover-faces 已在 components.js 移除）
   - 封面图片完整展示：object-fit:contain 不裁剪不变形，底衬中性冷灰，
     让左半部分本身就是一张干净完整的图
   - 「查看详情 →」入口按需求移除，底部一行只留头像 + 计数 + 置顶徽标
   --------------------------------------------------------------- */
.memory-card {
  border-radius: var(--ds-radius-card, 20px);
  box-shadow: var(--ds-shadow-card, 0 4px 12px rgba(0, 0, 0, .05));
}
.memory-card .memory-art {
  /* 中性冷灰底衬，避免图片留白处出现偏色块 */
  background: var(--ds-surface-soft, #fafafb);
}
.memory-card .memory-art img,
.memory-card .memory-art svg {
  /* 完整展示：不裁切、不拉伸变形 */
  object-fit: contain;
  padding: 0;
}

/* ---------------------------------------------------------------
   6. 悬浮操作键（开始 / 置顶 / 编辑）：冷灰收口，仅「开始」给朱砂
   --------------------------------------------------------------- */
.float-actions .icon-act { color: var(--ds-text-secondary, #6e6e73); }
.float-actions .icon-act.start {
  color: var(--ds-brand, #9a2a2a);
  border-color: var(--ds-brand-soft, #f7ebeb);
}
.float-actions .icon-act.pin.active {
  background: var(--ds-brand-soft, #f7ebeb);
  color: var(--ds-brand, #9a2a2a);
}

/* ---------------------------------------------------------------
   7. 进行中 Hero 大卡：顶部 2px 朱砂细线替代旧暖米底色；衬线标题放大留白
   --------------------------------------------------------------- */
.gather-hero {
  position: relative;
  border: none;
}
.gather-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--ds-brand, #9a2a2a);
}
.gather-hero h2.serif {
  font-family: var(--ds-font-display, "Songti SC", SimSun, serif);
  font-size: 22px;
  letter-spacing: .02em;
  margin: var(--ds-space-2, 8px) 0 var(--ds-space-2, 8px);
}
.gather-hero .hero-chip { border-color: transparent; }

/* ---------------------------------------------------------------
   8. 右下 FAB：主按钮换成朱砂（原来是旧 --wine），次按钮保持冷灰留白
   --------------------------------------------------------------- */
.fab-primary {
  background: var(--ds-brand, #9a2a2a);
  color: #fff;
}
.fab-primary:hover { background: var(--ds-brand-hover, #802323); }
.fab-ghost {
  background: var(--ds-surface, #fff);
  color: var(--ds-ink, #1a1a1a);
  border-color: var(--ds-border, rgba(26, 26, 26, .08));
}

/* ---------------------------------------------------------------
   9. 间距放宽：卡片之间、卡片内边距略微放大（移动端仍保持紧凑可读）
   --------------------------------------------------------------- */
.gather-item { margin-bottom: var(--ds-space-3, 12px); }
html.force-mobile .memory-card .memory-copy { padding: 12px 14px; }

/* ---------------------------------------------------------------
   10. 动效：仅 hover 阴影轻抬 + 圆点/下划线过渡，遵守减弱动效偏好
   --------------------------------------------------------------- */
@media (hover: hover) {
  .memory-card,
  .gather-hero {
    transition: box-shadow .2s ease, transform .2s ease;
  }
  .memory-card:hover,
  .gather-hero:hover {
    box-shadow: var(--ds-shadow-floating, 0 12px 32px rgba(0, 0, 0, .08));
    transform: translateY(-1px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .memory-card,
  .gather-hero,
  .banner-dot,
  .float-actions .icon-act {
    transition: none !important;
    transform: none !important;
  }
}
