/* Shared Apple TV-style image surface. Geometry and image crops stay page-specific. */
.image-motion-frame{perspective:1000px}
.image-motion-frame:where(a,.release-arrival){position:relative}
.photo-open.image-surface{position:absolute}
.image-surface{display:block;position:relative;border-radius:3px;transform-style:preserve-3d;transform:perspective(950px) rotateX(calc(var(--rx,0deg) + var(--scroll-rx,0deg))) rotateY(calc(var(--ry,0deg) + var(--scroll-ry,0deg))) translateY(calc(var(--lift,0px) + var(--scroll-lift,0px)));transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s;will-change:auto}
.image-surface:before,.image-surface:after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:var(--light-strength,var(--scroll-light-strength,0));transition:opacity .35s;transform:translateZ(.1px)}
.image-surface:before{z-index:1;mix-blend-mode:screen;background:radial-gradient(ellipse 75% 70% at var(--light-x,var(--scroll-light-x,50%)) var(--light-y,var(--scroll-light-y,50%)),rgba(255,250,238,.2),rgba(255,250,238,.065) 38%,transparent 78%)}
.image-surface:after{z-index:2;background:linear-gradient(var(--shade-angle,var(--scroll-shade-angle,135deg)),transparent 25%,rgba(0,0,0,.14))}
.image-surface.is-returning{transition:transform .7s cubic-bezier(.22,1,.36,1),box-shadow .7s cubic-bezier(.22,1,.36,1)}
.image-surface.is-returning:before,.image-surface.is-returning:after{transition:opacity .7s cubic-bezier(.22,1,.36,1)}
.image-surface:is(.merch-record-image,.about-record-art)>img{border-radius:inherit}
.image-surface .mockup-badge{z-index:3}
.image-surface .preview-player{z-index:3}
@media(hover:hover) and (pointer:fine){.image-surface:hover{box-shadow:var(--shadow-x,0px) var(--shadow-y,18px) 45px #0009}.image-motion-frame:has(>.image-surface:is(:hover,.is-returning)){z-index:1}}
@media(hover:none),(pointer:coarse),(max-width:760px){.photo-open.image-surface,.listener-record.image-surface{transform:none;transform-style:flat}.photo-open.image-surface:before,.photo-open.image-surface:after,.listener-record.image-surface:before,.listener-record.image-surface:after{transform:none}}
@media(prefers-reduced-motion:reduce){.image-surface{transform:none!important;transition:none!important;box-shadow:none!important}.image-surface:before,.image-surface:after{opacity:0!important;transition:none!important}}
