.film{--at:0;margin:0;min-width:0}.film-screen{position:relative;width:100%;aspect-ratio:16/9;min-height:200px;overflow:hidden;border-radius:8px;background:#000;isolation:isolate}.film-screen:before{content:"";position:absolute;inset:auto 0 0;height:30%;background:radial-gradient(60% 100% at 50% 100%,color-mix(in oklab,var(--glow,#9DB4D6) 45%,transparent),transparent)}.film-slot,.film-screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.film-screen iframe.bare{inset:-70% 0 auto;height:240%;transform-origin:0 0}.film-door{position:absolute;inset:0;z-index:1;width:100%;padding:0;border:0;background:#000;color:var(--paper);cursor:pointer;translate:0 -2.5%;transition:translate .7s var(--ease);-webkit-tap-highlight-color:transparent}.film-door:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:#fff;box-shadow:0 0 12px 2px #ffffffbf,0 0 54px 10px color-mix(in oklab,var(--glow,#9DB4D6) 55%,transparent)}.film-door:is(:hover,:focus-visible){translate:0 -7%}.film-door:focus-visible{outline:2px solid var(--paper);outline-offset:-4px}.film-plate{position:absolute;inset:0;overflow:hidden}.film-plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;filter:saturate(.8) contrast(1.06) brightness(.72);transition:opacity .9s;animation:film-pan 15s ease-in-out infinite alternate paused}.film-plate img.on{opacity:1}.film-plate img.bars{scale:1.34}.film-plate img:nth-child(2){animation-name:film-push}.film-plate img:nth-child(3){animation-direction:alternate-reverse}.film.rolling .film-plate img{animation-play-state:running}@keyframes film-pan{0%{transform:scale(1.04) translate(-1.5%)}to{transform:scale(1.12) translate(1.5%)}}@keyframes film-push{0%{transform:scale(1.03)}to{transform:scale(1.14)}}.film-plate:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,rgba(255,255,255,.05) 0 1px,transparent 1px calc(100%/12 - 2px),rgba(0,0,0,.42) calc(100%/12 - 2px) calc(100%/12)),radial-gradient(100% 90% at 50% 45%,transparent 40%,rgba(0,0,0,.72))}.film-key{position:absolute;left:50%;top:50%;z-index:1;width:76px;height:76px;margin:-38px;display:grid;place-items:center;border-radius:50%;background:#0a0b0d9e;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .3s,color .3s}.film-key:before{content:"";position:absolute;inset:3px;border-radius:50%;background:repeating-conic-gradient(var(--paper) 0 1.6deg,transparent 1.6deg 7.5deg);-webkit-mask:radial-gradient(closest-side,transparent 86%,#000 87%);mask:radial-gradient(closest-side,transparent 86%,#000 87%)}.film-key svg{width:30px;height:30px;fill:currentColor}.film-door:is(:hover,:focus-visible) .film-key{background:var(--paper);color:#000}.starting .film-key:before{animation:film-rev 1s linear infinite}@keyframes film-rev{to{rotate:1turn}}.film.up .film-door{translate:0 -106%;pointer-events:none;visibility:hidden;transition:translate 1.3s cubic-bezier(.65,0,.25,1),visibility 0s 1.3s}.film-deck{display:flex;align-items:center;gap:10px;min-height:48px;color:var(--steel);font:400 .6rem/1 var(--m)}.film-deck[hidden]{display:none}@media (max-width:480px){.film-deck{gap:2px}.film-deck [data-all]{display:none}}.film-deck button{flex:none;width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;background:none;color:var(--paper);cursor:pointer}.film-deck button[hidden]{display:none}.film-deck button:hover{color:#fff}.film-deck button:focus-visible{outline:2px solid var(--paper);outline-offset:-4px;border-radius:8px}.film-deck svg{width:20px;height:20px;fill:currentColor}.film-deck .stroke svg{fill:none;stroke:currentColor;stroke-width:2}.film-gauge{position:relative;flex:1;min-width:0;height:28px}.film-gauge.vol{flex:0 0 64px}@media (hover:none){.film-gauge.vol{display:none}}.film-gauge:before,.film-gauge:after{content:"";position:absolute;left:0;top:10px;height:8px;pointer-events:none}.film-gauge:before{width:100%;background:repeating-linear-gradient(90deg,rgba(255,255,255,.3) 0 1px,transparent 1px 6px)}.film-gauge:after{width:calc(var(--at)*100%);background:repeating-linear-gradient(90deg,var(--paper) 0 1px,transparent 1px 6px);border-right:2px solid var(--paper);top:6px;height:16px;background-size:100% 8px;background-position:0 4px;background-repeat:no-repeat}.film-gauge input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.film-gauge:has(input:focus-visible){outline:2px solid var(--paper);outline-offset:2px;border-radius:2px}.film-res{flex:none;padding:17px 4px;border:0;background:none;color:var(--paper);font:400 .6rem/1 var(--m);cursor:pointer}.film-res[hidden]{display:none}.film-res:focus-visible{outline:2px solid var(--paper);outline-offset:-4px;border-radius:8px}.film-res option{background:#0a0b0d;color:var(--paper)}@supports (appearance:base-select){.film-res,.film-res::picker(select){appearance:base-select}.film-res::picker-icon{display:none}.film-res::picker(select){position-area:block-start;margin-bottom:6px;padding:4px;border:1px solid rgba(255,255,255,.24);border-radius:8px;background:#0a0b0deb}.film-res option{padding:9px 12px;border-radius:5px;background:none;cursor:pointer}.film-res option::checkmark{display:none}.film-res option:is(:hover,:focus-visible){background:#ffffff1f}.film-res option:checked{color:#fff;box-shadow:inset 2px 0 var(--paper)}}.film-cap{display:grid;gap:2px;padding-top:12px;font-size:.84rem;line-height:1.4}.film-deck:not([hidden])+.film-cap{padding-top:4px}.film-cap>a{color:var(--paper);text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.film-cap>a:hover{text-decoration:underline}.film-cap span{color:var(--steel);font-size:.76rem}.film-cap span a{color:var(--paper);padding-block:6px}.film-cap .film-yt{display:inline-flex;align-items:center;gap:4px;text-decoration:none}.film-yt svg{width:14px;height:10px;fill:currentColor}.film:fullscreen{display:flex;flex-direction:column;background:#000;--paper:#F2F2EF}.film:fullscreen .film-screen{flex:1;aspect-ratio:auto;border-radius:0}.film:fullscreen .film-cap{display:none}.film:fullscreen .film-deck{padding:0 12px}@media (prefers-reduced-motion:reduce){.film-plate img{animation:none}.film-door{transition:none}.film.up .film-door{translate:none;opacity:0;transition:opacity .3s,visibility 0s .3s}.starting .film-key:before{animation:none}}