/* Published-site group motion is provided by cinema.css. Only Watch uses the preview flight. */
.cinema-flight-word{position:absolute;left:50%;top:50%;z-index:25;display:block;white-space:nowrap;color:#f4f2ed;pointer-events:none;transform-origin:center;will-change:transform,opacity}
body.cinema-opening #play.play{opacity:0!important;transition:none!important}
body.cinema-opening #player.beget-player #video{animation:beget-cinema-enter 800ms cubic-bezier(.22,1,.36,1) 680ms both}
body.cinema-opening .beget-controls,body.cinema-opening .beget-player .close-video{animation:beget-tools-enter 250ms ease 1150ms both}

/* Numbered film titles sit above their own preview progress line. */
#works>.film-title{display:none}
.film-nav{align-items:end;gap:28px}
.film-nav button{font:700 clamp(18px,2vw,32px)/1.2 Unbounded,sans-serif;letter-spacing:-.025em;padding:0 0 22px;min-height:0;align-self:stretch;opacity:.55;text-wrap:balance}
.film-nav button[aria-pressed=true]{opacity:1}
.film-nav button:before,.film-nav button:after{top:auto;bottom:0}
.film-nav .film-number{display:block;font:400 12px/1.3 Golos,sans-serif;letter-spacing:.08em;margin-bottom:12px;opacity:.7}
@media(max-width:700px){.film-nav{gap:12px}.film-nav button{font-size:clamp(11px,3.2vw,18px);line-height:1.3;padding-bottom:16px;overflow-wrap:anywhere}.film-nav .film-number{font-size:10px;margin-bottom:9px}}

.film-nav button{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}

/* Keep each index beside its title. */
.film-nav button{flex-direction:row;gap:10px;align-items:baseline}
.film-nav .film-number{flex:0 0 auto;margin:0}
.film-nav button>span:last-child{min-width:0}
@media(max-width:700px){.film-nav button{gap:5px}}