/* =========================================================
   HN720 · 二级列表页卡片统一美化  (secondary.css)
   ----------------------------------------------------------
   作用域 :is(#pictures_content, #video_content)
   （id 优先级压过 redefine.css 中失效的 .wrap-main-content
    .item-post 规则 —— 那些规则因 /pictures、/videos 页面实际
    DOM 链为 .row>.wrap-element>.videos-list（无 .wrap-main-content）
    而完全不生效，导致卡片是裸的）。
   只动卡片内部 + 外层间距，绝不改容器布局/列数（保护 Isotope 定位）。
   三卡片家族:
     .av-card     → aurora（已精致，仅去 emoji）
     .item-post   → nebula/new/720mo/black2021（裸→美化，/pictures + /videos）
     .card        → default（zui，修图片 fill 拉伸）
   ========================================================= */
:is(#pictures_content, #video_content) .item-post{
  background:var(--color-surface);
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-card);
  transition:transform .3s var(--ease-out,ease), box-shadow .3s, border-color .3s;
}
:is(#pictures_content, #video_content) .item-post:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
  border-color:var(--color-border-strong);
}
:is(#pictures_content, #video_content) .pic-item{
  position:relative; overflow:hidden;
  aspect-ratio:4/3;
  background:var(--color-surface-2,#f0f0f3);
}
:is(#pictures_content, #video_content) .picno{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s var(--ease-out,ease);
}
:is(#pictures_content, #video_content) .item-post:hover .picno{ transform:scale(1.05); }
:is(#pictures_content, #video_content) .overlay{
  position:absolute; inset:0;
  background:linear-gradient(to bottom, transparent 55%, rgba(0,0,0,.55));
  opacity:0; transition:opacity .3s var(--ease-out,ease);
}
:is(#pictures_content, #video_content) .item-post:hover .overlay{ opacity:1; }
:is(#pictures_content, #video_content) .meta-info{
  position:absolute; top:10px; right:10px; z-index:2;
  color:#fff; font-size:12px; font-weight:600;
  background:rgba(0,0,0,.45); padding:3px 9px; border-radius:999px;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  font-variant-numeric:tabular-nums;
}
:is(#pictures_content, #video_content) .meta-info .imdb .value{ color:#ffd479; margin-right:3px; font-weight:700; }
:is(#pictures_content, #video_content) .btn-play{ position:absolute; inset:0; z-index:1; }
:is(#pictures_content, #video_content) .text-item{ padding:12px 14px 14px; }
:is(#pictures_content, #video_content) .text-item .title{ margin:0; font-size:15px; line-height:1.45; font-weight:600; }
:is(#pictures_content, #video_content) .text-item .title a{ color:var(--color-text); text-decoration:none; }
:is(#pictures_content, #video_content) .text-item .title a:hover{ color:var(--color-accent); }
:is(#pictures_content, #video_content) .text-item .title a span{ color:var(--color-text-3); font-weight:400; }

/* 垂直间距：加在外层 isotope 容器，padding 计入 offsetHeight，Isotope 尊重 */
:is(#pictures_content, #video_content) .isotope-item{ padding-bottom:var(--space-5,20px); }

/* ---------- 家族 C: default（zui .card） ---------- */
:is(#pictures_content, #video_content) .card{
  display:block; background:var(--color-surface);
  border:1px solid var(--color-border); border-radius:var(--radius-lg);
  overflow:hidden; box-shadow:var(--shadow-card);
  transition:transform .3s var(--ease-out,ease), box-shadow .3s, border-color .3s;
}
:is(#pictures_content, #video_content) .card:hover{
  transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:var(--color-border-strong);
}
:is(#pictures_content, #video_content) .card img{
  width:100% !important; height:200px !important; max-height:none !important;
  aspect-ratio:4/3 !important; object-fit:cover !important; display:block;
}
:is(#pictures_content, #video_content) .card .card-heading{ padding:12px 14px 14px; }
:is(#pictures_content, #video_content) .card .card-heading strong{ font-size:15px; font-weight:600; color:var(--color-text); }
:is(#pictures_content, #video_content) .card:hover .card-heading strong{ color:var(--color-accent); }
/* default 外层 col-md-3 加垂直间距；重置 .card-heading 内部同名 col，避免误伤 */
:is(#pictures_content, #video_content) .col-md-3{ margin-bottom:var(--space-5,20px); }
:is(#pictures_content, #video_content) .card .col-md-3{ margin-bottom:0; padding-bottom:0; }

/* ---------- nebula 暗色主题专属（覆盖上面的浅色值） ---------- */
body.nebula-body :is(#pictures_content, #video_content) .item-post{
  background:#161b25; border-color:rgba(255,255,255,.08);
  box-shadow:0 1px 2px rgba(0,0,0,.45), 0 8px 22px rgba(0,0,0,.35);
}
body.nebula-body :is(#pictures_content, #video_content) .item-post:hover{
  border-color:rgba(255,255,255,.16);
  box-shadow:0 14px 34px rgba(0,0,0,.55), 0 0 0 1px rgba(78,201,176,.35);
}
body.nebula-body :is(#pictures_content, #video_content) .pic-item{ background:#0e1018; }
body.nebula-body :is(#pictures_content, #video_content) .text-item .title a{ color:#e8edf4; }
body.nebula-body :is(#pictures_content, #video_content) .text-item .title a:hover{ color:#4ec9b0; }
body.nebula-body :is(#pictures_content, #video_content) .text-item .title a span{ color:#67707f; }
body.nebula-body :is(#pictures_content, #video_content) .meta-info{ background:rgba(0,0,0,.5); }

/* ---------- aurora: 仅保证 meta 排版（emoji 已在 aurora.js 模板移除） ---------- */
:is(#pictures_content, #video_content) .av-card .av-meta .av-stat{ font-variant-numeric:tabular-nums; }
