/* Film A: the poster moves independently behind the stationary copy and action. */
.film .film-poster.fm-photo { overflow:hidden; }
.film .fm-pan { position:absolute;inset:0; }
.film .fm-mask { clip-path:inset(-.25em); }
.film .film-frame.fm-reveal { clip-path:inset(0 0 var(--fm-cut,100%) 0); }

/* H1. Keep ::after's existing Safari square sizing untouched. */
.film .film-play { position:relative;border-color:var(--ground); }
.film .film-play::before { content:'';position:absolute;inset:0;border-radius:inherit;background:var(--ground);opacity:0;pointer-events:none;transition:opacity 160ms ease-out; }
.film .film-play span { position:relative;z-index:1;transition:color 160ms ease-out,transform 100ms ease-out; }
.film .film-play:focus-visible { outline:2px solid var(--ground);outline-offset:6px; }
.film .film-play:active span { transform:scale(.97); }
@media(hover:hover) and (pointer:fine) {
 .film .film-play:hover::before { opacity:1;transition-duration:180ms; }
 .film .film-play:hover span { color:var(--ink);transition-duration:180ms; }
}
@media(prefers-reduced-motion:reduce) {
 .film .fm-mask,.film .film-frame.fm-reveal { clip-path:none; }
 .film .fm-pan { transform:none!important; }
 .film .film-play::before,.film .film-play span { transition:none; }
 .film .film-play:active span { transform:none; }
}
