/* ===================================
   图片加载优化和备用样式
   =================================== */

/* 图片加载前的占位背景 */
.article-cover-img,
.popular-article-img {
    background-color: #e0e0e0;
}

[data-theme="dark"] .article-cover-img,
[data-theme="dark"] .popular-article-img {
    background-color: #2d3748;
}

/* 图片懒加载动画 */
.article-cover-img {
    animation: fadeInImage 0.6s ease;
}

@keyframes fadeInImage {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* 响应式调整 */
@media (max-width: 968px) {
    .article-cover-img {
        height: 220px;
    }
}