/* 我的收藏 / 我的喜欢（Figma 1356:16932 / 1356:18152）。外壳 / 卡片 / 分页复用全站；这里只管页头与 underline tab。
   左右 gutter 与个人中心 hub 同源（--hg-page-gutter），内容区封顶 1664。 */
.hg-profile-fav{
  box-sizing:border-box;
  max-width:calc(1664px + 2 * var(--hg-page-gutter));
  margin:0 auto;
  padding:20px var(--hg-page-gutter) 48px
}
.hg-profile-fav__head{margin-top:8px}
.hg-profile-fav__head h1{
  margin:0;color:#fff;font-size:26px;font-weight:600;line-height:1.2;letter-spacing:-.2px
}
.hg-profile-fav__head p{
  margin:8px 0 0;color:rgba(255,255,255,.6);font-size:14px;line-height:1.4
}
/* 标题行右侧统计胶囊（禅道 44567）：「当前频道名 · N 部」，与 h1 同一行、右端、垂直居中。
   目前只有「我的喜欢」下发 statPill，收藏/历史两页这层里只有 h1 一个子元素，
   flex 单子元素与原来的裸 h1 渲染一致，不会有视觉变化。
   胶囊刻意用 <span> 而不是 <button>：common.css 里有 button:not(.hg-btn){background-color:unset}
   （特异度 (0,1,1)），单类名给 button 设背景会被它清成透明，胶囊肉眼几乎看不见。
   flex-wrap + margin-left:auto：窄屏放不下时胶囊整体换到下一行仍靠右，不会与标题挤在一起、
   也不会把页面撑出横向滚动。 */
.hg-profile-fav__headline{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px 12px
}
.hg-profile-fav__stat{
  margin-left:auto;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.55);
  font-size:13px;
  line-height:20px;
  white-space:nowrap
}
.hg-profile-fav .hg-channel-tabs{
  display:flex;
  align-items:flex-end;
  gap:20px;
  margin-top:20px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  border-bottom:1px solid rgba(255,255,255,.07)
}
.hg-profile-fav .hg-channel-tabs::-webkit-scrollbar{display:none}
.hg-profile-fav .hg-channel-tabs__item{
  position:relative;
  flex-shrink:0;
  padding:0 0 12px;
  text-decoration:none;
  font-size:15px;
  font-weight:400;
  line-height:22px;
  color:rgba(255,255,255,.45);
  white-space:nowrap
}
.hg-profile-fav .hg-channel-tabs__item.is-active{
  color:#ffd21c;
  font-weight:600
}
.hg-profile-fav .hg-channel-tabs__item.is-active::after{
  content:'';
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:2px;border-radius:99px;background:#ffd21c
}
.hg-profile-fav .hg-card-grid{gap:20px;margin-top:24px}
/* 黄果吃瓜页签的帖子卡（禅道 44538）：封面框改横版。
   hg/shell.tpl 头部就地样式把全站视频卡封面定成 .hg-drama-card__cover{aspect-ratio:9/12}
   + img{object-fit:contain}——那是给 9:16 竖版影片封面定的，为的是「一个像素都不裁」。
   帖子封面是 1300×640 的 2:1 横图，落进 9:12 竖框后按 contain 缩放：实测 399×532 的框里
   只画出 399×196，上下各留 168px 底色，就是 bug 里红箭头指的那片黑。
   这里改成 2/1 + cover，与站内既有的吃瓜卡片同口径——参照物是 /chigua/ 列表卡
   （layouts/cyber-community.tpl 的 hgCommunityPostCard / hgPostCardStyle：
   .hg-post-card__gallery{aspect-ratio:2/1} + .hg-post-card__img img{object-fit:cover}），
   社区标签聚合页、博主页帖子 Tab、首页「最近浏览」弹窗的黄果吃瓜页签也都是这一套。
   选择器带 .hg-profile-fav + .hg-drama-card--post 两层，特异性高于上述全站规则，
   且本文件在 hg/head 的 <style> 之后加载；只有带 --post 的帖子卡吃这条，不波及视频卡。

   作用域是收藏/喜欢/历史三页：历史页(/profile/history/)的 layout 也引入了本文件，
   外层 <main> 同样是 .hg-profile-fav，帖子卡由 hg/history-card 加 --post（见 hgHistoryCard.IsPost），
   于是直接复用这条规则，不在 hg-profile-history.css 里另写一份免得两边漂移。 */
.hg-profile-fav .hg-drama-card--post .hg-drama-card__cover{aspect-ratio:2/1}
.hg-profile-fav .hg-drama-card--post .hg-drama-card__cover img{
  -o-object-fit:cover;object-fit:cover
}
@media (max-width:900px){
  .hg-profile-fav{padding:16px var(--hg-page-gutter) 32px}
  .hg-profile-fav__head h1{font-size:22px}
  .hg-profile-fav__head p{font-size:13px}
  .hg-profile-fav__stat{padding:5px 10px;font-size:12px;line-height:18px}
  .hg-profile-fav .hg-channel-tabs{gap:16px;margin-top:16px}
  .hg-profile-fav .hg-channel-tabs__item{font-size:14px;padding-bottom:10px}
  .hg-profile-fav .hg-card-grid{gap:12px;margin-top:16px}
  .hg-profile-fav .hg-pager__jump{display:none}
}