.vf{--vf-room:23rem;--vf-w:min(17rem, calc((100svh - var(--vf-room)) * 9 / 16), 46vw);--vf-step:calc(var(--vf-w) * .8);--vf-dir:1;position:relative}.vf:where(:not(:focus-visible)){outline:none}[dir=rtl] .vf{--vf-dir:-1}.vf:focus-visible{outline:2px solid var(--color-accent);outline-offset:.5rem;border-radius:1rem}.vf-stage{margin:0;padding:0;list-style:none}.vf:not([data-enhanced]) .vf-stage{padding-inline:var(--frame-gutter);flex-wrap:wrap;justify-content:center;gap:clamp(.75rem,2vw,1.5rem);display:flex}.vf:not([data-enhanced]) .vf-film{flex:none;inline-size:min(10rem,40vw)}.vf[data-enhanced] .vf-stage{block-size:calc(var(--vf-w) * 16 / 9 + 2.6rem);touch-action:pan-y;position:relative}.vf[data-enhanced] .vf-film{inset-block-start:0;inline-size:var(--vf-w);z-index:calc(10 - var(--d));opacity:calc(1 - var(--d) * .45);filter:blur(calc(var(--d) * 1.2px)) brightness(calc(1 - var(--d) * .3));transform:translateX(calc(-50% + var(--o) * var(--vf-step) * var(--vf-dir))) translateY(calc(var(--d) * 1.5rem)) scale(calc(1 - var(--d) * .24));transform-origin:50% 40%;transition:transform .95s var(--ease-depth), opacity .95s var(--ease-depth), filter .95s var(--ease-depth);will-change:transform, opacity;position:absolute;left:50%}.vf[data-enhanced] .vf-film[data-hidden]{opacity:0;pointer-events:none}.vf-screen>.underwater-card{padding:clamp(.3rem,.55vw,.5rem)}.vf .cv-media-frame{aspect-ratio:9/16;background:var(--color-graphite);border-radius:clamp(.8rem,1.3vw,1.2rem)}.vf-media{position:relative}.vf .vf-poster{position:relative;overflow:hidden}.vf .vf-live{background:0 0;position:absolute;inset:0}.vf .cv-media-icon{inline-size:clamp(2.6rem,4vw,3.4rem)}.vf .cv-media-icon svg{block-size:1.15rem;inline-size:1.15rem}.vf[data-enhanced] .vf-film[data-active] .vf-screen>.underwater-card{box-shadow:0 1.5rem 3.5rem #00000073,0 0 2.5rem #99e30b17}.vf-title{color:var(--color-text-secondary);font-size:var(--text-small);text-align:center;transition:opacity .6s var(--ease-depth);margin:.7rem 0 0;line-height:1.35}.vf[data-enhanced] .vf-film:not([data-active]) .vf-title{opacity:0}.vf[data-enhanced] .vf-film[data-active] .vf-title{color:var(--color-text);font-weight:600}.vf-study{font-size:var(--text-small);justify-content:center;margin:.35rem 0 0;display:flex}.vf:has(.vf-study){--vf-room:25rem}.vf[data-enhanced]:has(.vf-study) .vf-stage{block-size:calc(var(--vf-w) * 16 / 9 + 4.6rem)}.vf[data-enhanced] .vf-film:not([data-active]) .vf-study{visibility:hidden}.vf-select{z-index:2;cursor:pointer;background:0 0;border:0;position:absolute;inset:0 0 2.6rem}.vf-controls{justify-content:center;align-items:center;gap:clamp(1rem,3vw,2rem);margin-block-start:clamp(.5rem,1.5vh,1rem);display:flex}.vf-arrow{aspect-ratio:1;color:#fff;cursor:pointer;inline-size:2.9rem;transition:transform var(--motion-ui) var(--ease-depth), border-color var(--motion-ui) var(--ease-ui);background:radial-gradient(circle at 28% 20%,#ffffff4d,#0000 28%),#08191e8c;border:1px solid #e4faf88c;border-radius:48% 52% 55% 45%/45% 48% 52% 55%;place-items:center;font-size:1.6rem;line-height:1;display:grid;box-shadow:inset 0 0 .6rem #ebffff38,0 .6rem 1.6rem #00000047}.vf-arrow span{transform:translateY(-.08em)}.vf-arrow:hover,.vf-arrow:focus-visible{border-color:var(--color-accent);transform:translateY(-2px)}.vf-arrow:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}.vf-rotation{opacity:.6;inline-size:2.4rem;transition:opacity var(--motion-ui) var(--ease-ui), transform var(--motion-ui) var(--ease-depth), border-color var(--motion-ui) var(--ease-ui)}.vf-rotation:is(:hover,:focus-visible),.vf:hover .vf-rotation{opacity:1}.vf-rotation svg{block-size:.95rem;inline-size:.95rem}.vf-position{min-inline-size:4rem;color:var(--color-text-muted);font-size:var(--text-small);font-variant-numeric:tabular-nums;text-align:center;margin:0}.vf-sr{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}@media (min-width:64rem){.vf{--vf-step:calc(var(--vf-w) * 1.04)}}@media (max-width:47.999rem){.vf{--vf-w:min(15rem, calc((100svh - var(--vf-room)) * 9 / 16), 52vw);--vf-step:calc(var(--vf-w) * .72)}}@media (prefers-reduced-motion:reduce){.vf[data-enhanced] .vf-film,.vf-title,.vf-arrow{transition:none}}
