.controlled-film .film-player-shell{color:#eee;isolation:isolate;background:#000;border-radius:12px;width:100%;min-width:0;position:relative;overflow:hidden}.controlled-film .project-film-frame{border-radius:inherit;background:#000}.controlled-film .project-film-frame:after{display:none}.controlled-film .film-playback-surface,.hero-playback-surface .hero-film-video{opacity:0;transition:opacity .8s}.controlled-film .film-playback-surface.film-is-revealed,.hero-playback-surface .hero-film-video.film-is-revealed{opacity:1}.film-controls-trigger{z-index:1;cursor:pointer;touch-action:pan-y;background:0 0;border:0;position:absolute;inset:0}.film-controls-trigger:focus-visible{outline-offset:-5px;border-radius:inherit;outline:1px solid #ffffffa6}.film-controls{z-index:3;opacity:0;visibility:hidden;pointer-events:none;background:linear-gradient(#0000,#0009);padding:32px 16px 8px;font-size:11px;line-height:1.4;transition:opacity .28s,transform .28s,visibility .28s;position:absolute;inset:auto 0 0;transform:translateY(5px)}.film-controls[data-visible=true]{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}.film-timeline-row,.film-sound-controls{align-items:center;gap:12px;min-width:0;display:flex}.film-controls button{color:#e6e6e6;cursor:pointer;background:0 0;border:0;border-radius:50%;flex-shrink:0;place-items:center;width:40px;height:44px;padding:0;transition:color .2s,background .2s;display:grid}.film-controls button svg{stroke-width:1.5px;width:18px;height:18px}.film-controls button:hover{color:#fff;background:#ffffff0f}:is(.film-controls button:focus-visible,.film-controls input:focus-visible){outline-offset:2px;outline:1px solid #fff}.film-controls button:disabled{opacity:.4;cursor:default}.film-timeline{flex:1;align-items:center;min-width:30px;display:flex}.film-controls input[type=range]{-webkit-appearance:none;appearance:none;cursor:pointer;accent-color:#eee;touch-action:pan-y;background:0 0;width:100%;height:44px;margin:0;display:block}.film-controls input[type=range]::-webkit-slider-runnable-track{background:#ffffff70;border-radius:2px;height:2px}.film-controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:0;border-radius:50%;width:8px;height:8px;margin-top:-3px}.film-controls input[type=range]::-moz-range-track{background:#ffffff70;border-radius:2px;height:2px}.film-controls input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:8px;height:8px}.film-controls input[type=range]:disabled{opacity:.35;cursor:default}.film-time{color:#ddd;font-variant-numeric:tabular-nums;white-space:nowrap;text-shadow:0 1px 4px #000;flex-shrink:0;font-size:10px}.film-sound-controls{gap:0;position:relative}.film-sound-controls input[type=range]{opacity:0;visibility:hidden;background:#141414e6;border-radius:8px;width:76px;padding:0 10px;transition:opacity .2s,visibility .2s;position:absolute;bottom:44px;left:50%;transform:translate(-50%)}.film-sound-controls:hover input[type=range],.film-sound-controls:focus-within input[type=range]{opacity:1;visibility:visible}.film-buffering{z-index:3;color:#bbb;white-space:nowrap;pointer-events:none;background:#000b;border-radius:3px;padding:10px 14px;font-size:12px;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.film-error{color:#bbb;padding:12px 0;font-size:13px;line-height:1.6}.film-error a{text-underline-offset:3px;text-decoration:underline}.film-sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.film-player-shell:-webkit-full-screen{background:#000;border-radius:0;justify-content:center;align-items:center;height:100%;display:flex}.film-player-shell:fullscreen{background:#000;border-radius:0;justify-content:center;align-items:center;height:100%;display:flex}.film-player-shell:-webkit-full-screen .project-film-frame{aspect-ratio:auto;width:100%;height:100%}.film-player-shell:fullscreen .project-film-frame{aspect-ratio:auto;width:100%;height:100%}.film-player-shell:-webkit-full-screen .film-controls{padding-inline:max(18px,env(safe-area-inset-left))}.film-player-shell:fullscreen .film-controls{padding-inline:max(18px,env(safe-area-inset-left))}@media (max-width:600px){.controlled-film .film-player-shell{border-radius:10px}.film-controls{padding:25px 8px 4px}.film-timeline-row{gap:5px}.film-controls button{width:36px}.film-controls button svg{width:17px;height:17px}.film-time{font-size:9px}}@media (prefers-reduced-motion:reduce){.controlled-film .film-playback-surface,.hero-playback-surface .hero-film-video,.film-controls{transition:none}}
