.bb-film{position:relative;width:100%;height:100%;min-height:1px;overflow:hidden;background:#20221f;--film-progress:0;--pointer-x:50%;--pointer-y:50%}.bb-film-poster,.bb-film-video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;pointer-events:none}.bb-film-video{opacity:0;transition:opacity .65s ease}.bb-film-video.is-ready{opacity:1}.bb-film-surface{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent;color:#fff7e8;cursor:grab;touch-action:pan-y pinch-zoom;user-select:none;-webkit-tap-highlight-color:transparent;text-align:left;font:inherit}.bb-film-surface:focus-visible{outline:2px solid #e9c78e!important;outline-offset:-7px}.bb-film[data-dragging=true] .bb-film-surface{cursor:grabbing}.bb-film-cursor{position:absolute;left:var(--pointer-x);top:var(--pointer-y);display:grid;place-items:center;width:58px;height:58px;transform:translate(-50%,-50%) scale(.8);border:1px solid rgb(255 247 232/75%);border-radius:50%;background:rgb(24 26 22/22%);backdrop-filter:blur(5px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.bb-film-cursor svg{fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.bb-film-surface:hover .bb-film-cursor,.bb-film[data-dragging=true] .bb-film-cursor{opacity:1;transform:translate(-50%,-50%) scale(1)}.bb-film[data-held=true] .bb-film-cursor{border-color:#e9c78e;color:#e9c78e}.bb-film-hint{position:absolute;right:24px;bottom:24px;display:flex;flex-direction:column;align-items:flex-end;gap:5px;max-width:calc(55% - 24px);color:#fff7e8;text-shadow:0 1px 8px #111,0 1px 3px #111;pointer-events:none;transition:opacity .5s;line-height:1.5}.bb-film-hint>span:first-child{font-size:12px;letter-spacing:.045em}.bb-film-hint-mouse,.bb-film-hint-touch{font-size:10px;opacity:.85}.bb-film-hint-touch{display:none}.bb-film-progress{display:block;width:60px;height:1px;background:rgb(255 247 232/35%);margin-top:4px;position:relative}.bb-film-progress:after{content:"";position:absolute;inset:0;background:#e9c78e;transform:scaleX(var(--film-progress));transform-origin:left}.bb-film[data-hint-dismissed=true] .bb-film-hint{opacity:0}.bb-film-surface:focus-visible .bb-film-hint,.bb-film-surface:hover .bb-film-hint,.bb-film[data-dragging=true] .bb-film-hint,.bb-film[data-held=true] .bb-film-hint{opacity:1}.bb-film-instructions{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(hover:none),(pointer:coarse){.bb-film-cursor,.bb-film-hint-mouse{display:none}.bb-film-hint-touch{display:block}}@media(max-width:800px){.bb-film-hint{right:16px;bottom:20px;max-width:calc(50% - 20px)}.bb-film-hint>span:first-child{font-size:11px}.bb-film-hint-mouse,.bb-film-hint-touch{font-size:9px}}@media(prefers-reduced-motion:reduce){.bb-film-cursor,.bb-film-hint,.bb-film-video{transition:none}}