/* 图片优化CSS */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* 懒加载图片的占位符效果 */
img[loading="lazy"] {
    background-color: rgba(255, 255, 255, 0.1);
    background-image: linear-gradient(45deg, transparent 25%, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.05) 75%, transparent 75%);
    background-size: 20px 20px;
    min-height: 100px;
}

/* 图片加载完成后移除占位符效果 */
img[loading="lazy"]:not([src=""]) {
    background: none;
}

/* 优化图片渲染性能 */
img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: optimize-contrast;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* 移动端图片优化 */
@media (max-width: 768px) {
    img {
        max-width: 100%;
        height: auto;
        object-fit: cover;
    }
    
    /* 减少移动端图片的内存使用 */
    img[loading="lazy"] {
        will-change: auto;
    }
}

/* 高DPI屏幕优化 */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    img {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}