/* A single small landscape stands in for every deferred artwork. */
.result-image,.viewer-media{position:relative;isolation:isolate}
.benchmark-picture{position:relative;display:block;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden}
.benchmark-picture>img{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}
.benchmark-picture.is-deferred:before{content:"";position:absolute;inset:0;pointer-events:none;background:url("/benchmarks/loading-placeholder.svg") center/contain no-repeat;filter:blur(16px);transform:scale(1.12);opacity:.7}
/* An img can stop painting its old src as soon as a new request begins.
   Keep the cached placeholder on a separate layer until decode completes. */
.benchmark-picture.is-deferred>img{opacity:0}
.is-media-loading .benchmark-picture.is-deferred:before{animation:benchmark-loading-breathe 1.8s ease-in-out infinite alternate}
.is-media-loading:after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 20%,#fff8 48%,transparent 76%);background-size:240% 100%;animation:benchmark-loading-sweep 2s ease-in-out infinite}
.benchmark-picture.is-loaded>img{filter:none;transform:none;opacity:1;animation:benchmark-image-arrive .18s ease-out}
.is-media-error .benchmark-picture:before{opacity:.4;animation:none}
.benchmark-media-retry{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);padding:10px 14px;border:1px solid #87947b;border-radius:5px;background:#fffef5ed;color:#34452e;font-family:inherit;font-size:12px;font-weight:600;line-height:1.3;text-align:center;white-space:nowrap;box-shadow:0 2px 12px #29352218}
button.benchmark-media-retry{cursor:pointer}
.is-media-error:focus-visible,.benchmark-media-retry:focus-visible{outline:2px solid var(--olive,#4b6244);outline-offset:4px}
@keyframes benchmark-loading-breathe{from{opacity:.52}to{opacity:.82}}
@keyframes benchmark-loading-sweep{from{background-position:130% 0}to{background-position:-50% 0}}
@keyframes benchmark-image-arrive{from{opacity:.5}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.is-media-loading .benchmark-picture.is-deferred:before,.is-media-loading:after,.benchmark-picture.is-loaded>img{animation:none}}