/* ============================================================
   MacCMS 2025 · Responsive Overrides
   6 断点 · 仅布局结构变更 (字号/间距通过 clamp 流体)
   ============================================================ */

/* ═══════════════════════════════════════════════════
   断点 1: ≤1279px · 桌面普通
   ═══════════════════════════════════════════════════ */
@media (max-width: 1279px) {
  .curated-carousel__track > * {
    width: clamp(130px, 20vw, 180px);
  }
}


/* ═══════════════════════════════════════════════════
   断点 2: ≤1023px · 平板横屏
   ═══════════════════════════════════════════════════ */
@media (max-width: 1023px) {
  /* 英雄区竖排 + 降低高度 */
  .hero-area { min-height: 65vh !important; }
  .hero-content {
    flex-direction: column !important;
    text-align: center;
    gap: 24px !important;
  }
  .hero-poster {
    width: clamp(140px, 30vw, 220px) !important;
  }
  .hero-info h1 { font-size: clamp(1.4rem, 4vw, 2rem) !important; }

  /* 详情页 · 英雄区竖排 */
  .detail-hero__layout {
    flex-direction: column !important;
    text-align: center;
  }
  .detail-hero__poster {
    width: clamp(160px,34vw,240px) !important;
    margin: 0 auto;
  }
  .detail-hero__bg--bottom {
    filter: blur(30px) saturate(1.2) brightness(0.38) !important;
  }
  .detail-hero__bg--top {
    filter: blur(8px) brightness(0.55) !important;
    opacity: 0.35 !important;
  }
  /* 三栏改两栏 */
  .detail-panels {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* 专题头部降低 */
  .theme-header {
    padding-top: clamp(32px, 6vh, 48px);
    padding-bottom: clamp(32px, 6vh, 48px);
  }

  /* 播放器控制栏增高 */
  .player-controls {
    height: 48px;
  }
}


/* ═══════════════════════════════════════════════════
   断点 3: ≤767px · 平板竖 / 大屏手机
   ═══════════════════════════════════════════════════ */
@media (max-width: 767px) {
  /* ── 英雄区 · 移动端重设计 ── */
  .hero-area { min-height: 60vh !important; }
  /* 隐藏竖版海报, 仅保留模糊背景 */
  .hero-poster { display: none !important; }
  /* 背景提亮: 小屏缩小模糊半径+提高亮度 */
  .hero-area__bg-blur {
    filter: blur(30px) saturate(1.2) brightness(0.45) !important;
  }
  .hero-area__bg-soft {
    filter: blur(8px) brightness(0.55) !important;
    opacity: 0.35 !important;
  }
  /* 内容居中 */
  .hero-content {
    flex-direction: column !important;
    text-align: center !important;
    justify-content: center;
  }
  .hero-info {
    text-align: center !important;
    display: flex; flex-direction: column; align-items: center;
  }
  /* 元数据标签居中 */
  .hero-info__tag-row {
    justify-content: center !important;
  }
  /* CTA 按钮居中 */
  .hero-info__actions {
    justify-content: center !important;
  }
  /* 标题 */
  .hero-info h1 {
    font-size: clamp(1.3rem, 5.5vw, 1.8rem) !important;
  }
  /* 简介最多2行 */
  .hero-info__blurb {
    -webkit-line-clamp: 2 !important;
    max-width: 40ch !important;
  }

  /* 详情页 · 手机全宽 */
  .detail-hero__layout {
    flex-direction: column !important;
    text-align: center !important;
    gap: 20px !important;
  }
  .detail-hero__poster {
    width: clamp(140px,42vw,200px) !important;
    margin: 0 auto;
  }
  .detail-hero__info [style*="font-size:0.82rem"] {
    -webkit-line-clamp: 3 !important;
  }
  /* 三栏改单列 */
  .detail-panels {
    grid-template-columns: 1fr !important;
  }

  /* 立即播放按钮固定底栏 */
  .detail-play-fixed {
    position: fixed; bottom: 0; left: 0; right: 0;
    padding: var(--space-sm) var(--page-padding);
    background: rgba(8,8,16,0.95);
    backdrop-filter: blur(20px);
    border-top: 1px solid var(--border);
    z-index: var(--z-sticky);
    display: flex; gap: var(--space-sm);
  }

  /* 竖向速览流默认开启 */
  .vertical-feed--mobile-default {
    display: flex;
  }

  /* 轮播卡片数 */
  .curated-carousel__track > * {
    width: clamp(120px, 35vw, 170px);
  }

  /* Section 间距缩小 */
  .section { padding-top: var(--space-xl); padding-bottom: var(--space-xl); }

  /* 蜂巢退化为胶囊 */
  .honeycomb:not(.honeycomb--pills):not(.honeycomb--grid2) {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: flex-start;
    gap: 8px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .honeycomb:not(.honeycomb--pills):not(.honeycomb--grid2)::-webkit-scrollbar {
    display: none;
  }
  .honeycomb:not(.honeycomb--pills):not(.honeycomb--grid2) .honeycomb__cell {
    width: auto; aspect-ratio: auto;
    padding: 8px 16px; border-radius: 20px;
    flex-shrink: 0; scroll-snap-align: start;
    flex-direction: row;
  }

  /* 感受性评论折叠 */
  .sentiment-cards { flex-direction: column; }
}


/* 专题网格平板降为2列 */
@media (max-width: 1023px) {
  .topic-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  /* 专题头部竖排 */
  .theme-header [style*="display:flex"] {
    flex-direction: column !important;
  }
  .theme-header img[style*="aspect-ratio:2/3"] {
    width: clamp(140px,28vw,200px) !important;
    margin: 0 auto;
  }
  /* 相关专题 3列→2列 */
  .topic-related-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ═══════════════════════════════════════════════════
   断点 4: ≤479px · 标准手机
   ═══════════════════════════════════════════════════ */
@media (max-width: 479px) {
  /* 专题网格降为单列 */
  .topic-grid,
  .topic-related-grid {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 479px) {
  .container {
    padding-left: clamp(12px, 3vw, 16px);
    padding-right: clamp(12px, 3vw, 16px);
  }

  /* 单列布局 */
  .grid--auto-fill,
  .grid--auto-fit {
    grid-template-columns: repeat(2, 1fr);
  }


  /* 片尾卡全屏底部 */
  .end-card {
    left: 0; right: 0; bottom: 0;
    width: auto; max-width: none;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }

  /* 惊喜按钮 */
  .surprise-btn {
    width: 44px; height: 44px;
    bottom: 80px;
  }
}


/* ═══════════════════════════════════════════════════
   断点 5: ≤359px · 极小屏
   ═══════════════════════════════════════════════════ */
@media (max-width: 359px) {
  /* 禁用所有非必要动效 */
  .ambient-bg__glow--breathing { animation: none; }

  /* 字体微调 */
  body { font-size: 14px; }

  /* 蜂巢退化为 2列图标网格 */
  .honeycomb:not(.honeycomb--grid2) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    overflow-x: visible;
  }
  .honeycomb:not(.honeycomb--grid2) .honeycomb__cell {
    width: auto; aspect-ratio: auto;
    padding: 10px; border-radius: var(--radius-md);
    flex-direction: column;
  }

  /* 进度条加粗 */
  .seekbar { height: 8px; }

  /* 片尾卡全屏覆盖 */
  .end-card {
    top: 0; bottom: 0;
    border-radius: 0;
  }

  /* 卡片缩小内边距 */
  .film-card__info {
    padding: 6px 8px;
  }

  /* 排序快捷栏在小屏横向滚动 */
  .mood-filter { flex-wrap: nowrap; }


  /* 全局导航栏高度 */
  .global-nav { height: 44px; }

  /* 按钮 */
  .surprise-btn {
    width: 40px; height: 40px;
    bottom: 72px;
  }

  /* 集数导航: 每行3个 */
  .episode-nav__grid {
    grid-template-columns: repeat(3, 1fr);
  }
  /* 英雄区 · 最小屏: 高度再压缩 · 简介隐藏 · 仅留标题+CTA */
  .hero-area { min-height: 55vh !important; }
  .hero-info h1 { font-size: 1.2rem !important; }
  .hero-info__blurb { display: none; }
  /* 详情页 · 极简屏 */
  .detail-hero__poster { width: clamp(110px,38vw,150px) !important; }
  .detail-hero__info h1 { font-size: clamp(1.1rem,4vw,1.4rem) !important; }
  .detail-panels { gap: 10px !important; }
  .topic-related-grid { grid-template-columns: 1fr !important; }
}

/* ============================================================
   断点 6: min-width 1280px · 宽屏增强
   ============================================================ */
@media (min-width: 1280px) {
  .bento-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ============================================================
   prefers-reduced-motion: 全局禁用非必要动效
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
