.image-load-frame { position: relative; display: block; width: 100%; max-width: 100%; overflow: hidden; isolation: isolate; }
.image-load-frame > .image-load-preview { display: block; width: 100%; height: auto; max-height: inherit; opacity: 0; }
.image-load-frame > .image-load-blur { position: absolute; inset: 0; width: 100%; height: 100%; filter: blur(20px); scale: 1.04; opacity: 0; }
.image-load-frame > img.image-load-full { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-height: none; margin: 0; border: 0; border-radius: 0; object-fit: contain; }
@media (scripting: enabled) {
  .image-load-frame > .image-load-preview { opacity: 1; transition: opacity 500ms cubic-bezier(.22,1,.36,1); }
  .image-load-frame > .image-load-blur { opacity: 1; transition: opacity 500ms cubic-bezier(.22,1,.36,1); }
  .image-load-frame > img.image-load-full { opacity: 0; filter: blur(20px); scale: 1.04; transition: opacity 500ms cubic-bezier(.22,1,.36,1), filter 500ms cubic-bezier(.22,1,.36,1), scale 500ms cubic-bezier(.22,1,.36,1); }
  .image-load-frame.is-ready > img.image-load-full { opacity: 1; filter: blur(0); scale: 1; }
  .image-load-frame.is-ready > .image-load-preview { opacity: 0; }
  .image-load-frame.is-ready > .image-load-blur { opacity: 0; }
  .image-load-frame.is-cached > img.image-load-full, .image-load-frame.is-cached > .image-load-preview, .image-load-frame.is-cached > .image-load-blur { transition: none; }
}
.image-load-frame.is-error::after { content: '圖片暫時無法載入'; position: absolute; inset: 0; display: grid; place-items: center; padding: 12px; color: #fff; background: #0003; font: 12px/1.5 sans-serif; text-align: center; }
html[lang="en"] .image-load-frame.is-error::after { content: 'Image could not be loaded'; }
.recommended-entry__crop > .image-load-frame { position: absolute; inset: 0; height: 100%; }
.recommended-entry__crop > .image-load-frame > .image-load-preview { height: 100%; }
.recommended-entry__crop > .image-load-frame > img.image-load-full, .collection-item__cover > .image-load-frame > img.image-load-full { object-fit: cover; }
.collection-item__cover > .image-load-frame { height: 100%; }
.collection-item__cover > .image-load-frame > .image-load-preview { height: 100%; }
.article-cover > .image-load-frame { width: min(100%, 520px); max-height: 560px; }
.script-cover > .image-load-frame { max-height: 480px; }
.issue-head:has(> .image-load-frame), .record-detail-head:has(> .image-load-frame) { display: grid; }
.issue-head:has(> .image-load-frame) .issue-head__intro { margin-top: 0; }
.issue-head > .image-load-frame > .image-load-preview, .record-detail-head > .image-load-frame > .image-load-preview { aspect-ratio: 3/4; height: auto; }
.record-track__cover.image-load-frame > .image-load-preview { height: auto; aspect-ratio: 4/3; }
.record-track__cover.image-load-frame > img.image-load-full, .about-avatar.image-load-frame > img.image-load-full { object-fit: cover; }
.about-avatar.image-load-frame > .image-load-preview { height: 100%; }
.about-copy .post-image > .image-load-frame { margin-top: 52px; }
.gallery-image > .image-load-frame { max-height: 78vh; }
.gallery-image:hover .image-load-frame.is-ready > img.image-load-full { opacity: .82; }
.gallery-lightbox .image-load-frame { height: 100%; min-height: 0; }
.gallery-lightbox [data-gallery-lightbox-image] { height: 100%; min-height: 0; }
.gallery-lightbox .image-load-frame > .image-load-preview { height: 100%; }
@media (max-width: 720px) {
  .record-detail-head > .image-load-frame { width: min(70vw, 280px); }
}
@media (prefers-reduced-motion: reduce) {
  .image-load-frame > img.image-load-full { scale: 1; filter: none; transition: none; }
  .image-load-frame > .image-load-preview, .image-load-frame > .image-load-blur { transition: none; }
}
