/* ====== 卡片滚动出现/消失动画（触发后平滑执行到底） ====== */

/* 参与动画的卡片：首页文章卡片、侧边栏卡片、相关文章卡片 */
#recent-posts > .recent-post-item,
#aside-content .card-widget,
.relatedPosts > .relatedPosts-list > div {
  scale: var(--reveal-scale, 1);
  opacity: var(--reveal-opacity, 1);
  will-change: scale, opacity;
}

/* 动画一旦触发就平滑执行到底：scale/opacity 用 1.1s 过渡，其余属性保留主题原有过渡 */
.reveal-card {
  transition: scale 1.1s cubic-bezier(.22, .61, .36, 1), opacity 1.1s cubic-bezier(.22, .61, .36, 1),
              transform .3s, box-shadow .3s, background-color .3s, color .3s, border-color .3s,
              top .3s, left .3s, right .3s !important;
}

/* 兼容不支持 scale 属性的旧浏览器（回退到 transform） */
@supports not (scale: 1) {
  #recent-posts > .recent-post-item,
  #aside-content .card-widget,
  .relatedPosts > .relatedPosts-list > div {
    transform: scale(var(--reveal-scale, 1));
  }
}

/* 尊重系统“减少动态效果”设置 */
@media (prefers-reduced-motion: reduce) {
  #recent-posts > .recent-post-item,
  #aside-content .card-widget,
  .relatedPosts > .relatedPosts-list > div {
    scale: none;
    transform: none;
    opacity: 1;
    will-change: auto;
  }
}