YGChatCS/docs/superpowers/specs/2026-08-10-explore-card-unified-gradient-design.md

ExploreCards 统一媒体渐变设计

目标

统一 ExploreCards 中图片和视频上方的渐变浮层。渐变不再随卡片 tone 使用不同主题色，而是固定为顶部透明、底部浅黑半透明，以保持不同媒体内容上的文字可读性和视觉一致性。

实现范围

• 在 src/pages/Discovery/components/ExploreCards/styles/index.scss 中保留一条公共 .explore-card-gradient 规则。

• 公共渐变使用以下色阶：

  linear-gradient(
    180deg,
    rgba(5, 24, 24, 0) 0%,
    rgba(5, 24, 24, 0.18) 46%,
    rgba(5, 24, 24, 0.34) 100%
  )
  

• 删除 culture、adventure 和 nightlife 对 .explore-card-gradient 的主题色覆盖。

• 保留各 tone 的卡片底色，确保没有封面媒体时现有视觉不变。

• 不调整图片或视频渲染、文字内容区、箭头和点击行为。

验证

• 静态检查样式中仅存在一条 .explore-card-gradient 背景定义。
• 检查所有渐变色标均为 rgba(5, 24, 24, ...)，且顶部透明度为 0、底部透明度为 0.34。
• 运行 git diff --check，确认没有空白符错误。