img.is-image-loading{
    background-color:var(--surface-soft);
    background-image:linear-gradient(105deg,transparent 32%,color-mix(in srgb,var(--surface) 72%,transparent) 48%,transparent 64%);
    background-size:220% 100%;
    animation:image-loading-shimmer 1.15s linear infinite;
}
.image-loading-host{position:relative}
.image-loading-host::after{
    content:'';
    position:absolute;
    z-index:3;
    inset:50% auto auto 50%;
    width:1.65rem;
    height:1.65rem;
    margin:-.825rem 0 0 -.825rem;
    border:.2rem solid color-mix(in srgb,var(--accent) 24%,var(--surface));
    border-top-color:var(--accent);
    border-radius:50%;
    animation:image-loading-spin .72s linear infinite;
    pointer-events:none;
}
.reader-pages .image-loading-host::after{position:absolute;border-color:#ffffff42;border-top-color:var(--accent)}
@keyframes image-loading-shimmer{to{background-position:-220% 0}}
@keyframes image-loading-spin{to{transform:rotate(1turn)}}
@media(prefers-reduced-motion:reduce){
    img.is-image-loading{animation:none}
    .image-loading-host::after{animation:none;border-top-color:transparent}
}