.film{margin:0}.film-frame{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#ecefe7;border:1px solid rgba(255,255,255,.16);box-shadow:0 30px 70px -32px rgba(0,0,0,.6)}.film-frame picture,.film-full,.film-poster,.film-preview{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover}.film-full{background:#ecefe7}.film-full[hidden]{display:none}.film-full:focus{outline:none}.film-full:focus-visible{outline:3px solid var(--dusk,#f2b878);outline-offset:-3px}.film-preview{opacity:0;transition:opacity .5s ease}.film-preview.is-visible{opacity:1}.film-watch{position:absolute;left:50%;top:76%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:11px;padding:9px 20px 9px 9px;border:0;border-radius:999px;background:var(--ink,#021f4d);color:#fff;font-family:var(--font-sans);font-size:.98rem;font-weight:600;letter-spacing:.005em;line-height:1;cursor:pointer;box-shadow:0 14px 34px -12px rgba(2,16,36,.55),inset 0 0 0 1px rgba(255,255,255,.08);transition:transform .22s var(--ease-spring,ease),background-color .2s ease,box-shadow .2s ease}.film-watch:hover{background:var(--ink-hover,#0a3268);transform:translate(-50%,-50%) scale(1.04);box-shadow:0 18px 40px -12px rgba(2,16,36,.6),inset 0 0 0 1px rgba(242,184,120,.35)}.film-loop-toggle:focus-visible,.film-watch:focus-visible{outline:3px solid var(--dusk,#f2b878);outline-offset:3px}.film-watch-icon{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#fff;color:var(--ink,#021f4d)}.film-watch-icon svg{margin-left:2px}.film-loop-toggle{position:absolute;right:12px;bottom:12px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(2,31,77,.72);color:#fff;cursor:pointer;transition:background-color .2s ease}.film-loop-toggle:hover{background:rgba(2,31,77,.92)}@media (max-width:640px){.film-frame{border-radius:10px}.film-watch{font-size:.9rem;gap:9px;padding:7px 16px 7px 7px}.film-watch-icon{width:28px;height:28px}.film-loop-toggle{right:8px;bottom:8px;width:32px;height:32px}}@media (max-width:480px){.film-watch{font-size:.84rem;gap:8px;padding:5px 13px 5px 5px}.film-watch-icon{width:24px;height:24px}.film-watch-icon svg{width:11px;height:11px}}@media (prefers-reduced-motion:reduce){.film-preview,.film-watch,.film-watch:hover{transform:translate(-50%,-50%)}}