.browse-image-host{position:relative}
img.browse-image-pending{visibility:hidden}
.browse-image-progress{position:absolute;inset:0;z-index:1;display:block;margin:0;padding:0;overflow:hidden;border:0;border-radius:inherit;background:var(--image-loading-bg);opacity:1;transition:opacity .18s ease-out;pointer-events:none}
.browse-image-progress.is-revealing{opacity:0}
.browse-image-progress>svg{display:block;width:100%;height:100%;fill:var(--image-loading-dot);stroke:none}
.browse-image-progress circle{transition:r .12s linear}
.card-media:has(.browse-image-progress) .card-photo-arrow{color:var(--ink);background:transparent;border-radius:50%}
.hero>.browse-image-progress{z-index:-1}
.hero:has(>.browse-image-progress)>.hero-shade{opacity:0;transition:opacity .18s ease-out}
.hero:has(>.browse-image-progress.is-revealing)>.hero-shade{opacity:1}
.hero:has(>.browse-image-progress) .hero-content,.hero:has(>.browse-image-progress) h1 em{transition:color .18s ease-out}
.hero:has(>.browse-image-progress:not(.is-revealing)) .hero-content,.hero:has(>.browse-image-progress:not(.is-revealing)) h1 em{color:var(--ink)}
@media(prefers-reduced-motion:reduce){.browse-image-progress,.browse-image-progress circle,.hero:has(>.browse-image-progress)>.hero-shade,.hero:has(>.browse-image-progress) .hero-content,.hero:has(>.browse-image-progress) h1 em{transition:none}}

.card-media:has(.browse-image-progress) .card-photo-arrow:is(:hover,:focus-visible):not(:disabled){color:var(--green);background:transparent}
