.hero-video-selectors{display:flex;align-items:center;gap:3px;margin-top:20px;min-height:44px;max-width:100%}
.hero-video-selector{display:flex;align-items:center;justify-content:flex-start;width:43px;height:44px;flex:0 1 43px;border:0;padding:0 5px 0 0;background:transparent;cursor:pointer;transition:width .3s ease,flex-basis .3s ease}
.hero-video-selector span{display:block;width:28px;height:6px;border-radius:999px;background:#d7e8f273;transition:width .3s ease,background-color .25s ease}
.hero-video-selector[aria-pressed=true] span{background:#fff}
.hero-video-selector:hover,.hero-video-selector:focus-visible{width:75px;flex-basis:75px}
.hero-video-selector:hover span,.hero-video-selector:focus-visible span{width:60px;background:#fff}
.hero-video-selector:focus-visible{outline:2px solid #9dd7ff;outline-offset:2px;border-radius:8px}
@media(max-width:700px){.hero-video-selectors{gap:0;margin-top:12px}.hero-video-selector{width:40px;flex-basis:40px}.hero-video-selector:hover,.hero-video-selector:focus-visible{width:62px;flex-basis:62px}.hero-video-selector:hover span,.hero-video-selector:focus-visible span{width:48px}}
@media(prefers-reduced-motion:reduce){.hero-video-selector,.hero-video-selector span{transition:none}}

@media(max-width:700px){#film-panel.compact{top:32%;bottom:auto;height:60%}}