.stage{position:fixed;inset:0;overflow:hidden}.stage:has(.controls[data-idle=true]){cursor:none}.film{width:100%;height:100%;display:block}.controls{bottom:calc(16px + env(safe-area-inset-bottom));width:min(560px, calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));-webkit-backdrop-filter:blur(24px)saturate(140%);height:44px;color:var(--muted);background:#1212128c;border:1px solid #ffffff1f;align-items:center;gap:16px;padding:0 16px 0 8px;font-size:13px;line-height:16px;transition-property:opacity,translate;transition-duration:.3s;transition-timing-function:cubic-bezier(.2,0,0,1);display:flex;position:fixed;left:50%;translate:-50%;box-shadow:0 40px 120px -40px #000c}.controls[data-idle=true]:not(:focus-within):not(:has(#pause[aria-pressed=true])){opacity:0;pointer-events:none;translate:-50% 8px}@media (prefers-reduced-motion:reduce){.controls{transition-property:opacity}.controls[data-idle=true]:not(:focus-within):not(:has(#pause[aria-pressed=true])){translate:-50%}}.toggle{min-width:56px;color:var(--bright);font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex:none;padding:8px}.toggle:focus-visible{outline:2px solid var(--bright);outline-offset:-2px}.timecode{font-variant-numeric:tabular-nums;flex:none}.track{background:var(--track);flex:1;min-width:0;height:2px}.progress{background:var(--bright);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.shot{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:40%;overflow:hidden}@media (max-width:480px){.shot{display:none}}