.video-frame,.video-frame__poster{background-color:var(--light-ink)}.video-frame>iframe,.video-frame>.video-frame__poster{width:calc(100% + 2px)!important;max-width:none!important;height:calc(100% + 2px)!important;inset:-1px!important}.video-frame__poster{transition:opacity .5s}.video-frame[data-playing] .video-frame__poster{opacity:0;pointer-events:none}.video-frame__loading{z-index:1;pointer-events:none;justify-content:center;align-items:center;gap:.5rem;display:flex;position:absolute;inset:0}.video-frame__loading span{background-color:var(--light-surface);opacity:.3;width:.6rem;height:.6rem;animation:1.2s ease-in-out infinite video-frame-pulse}.video-frame__loading span:nth-child(2){animation-delay:.2s}.video-frame__loading span:nth-child(3){animation-delay:.4s}@keyframes video-frame-pulse{0%,60%,to{opacity:.3}30%{opacity:1}}.video-frame__controls{z-index:2;opacity:0;gap:.4rem;transition:opacity .2s;display:flex;position:absolute;bottom:.8rem;right:.8rem}.video-frame:hover .video-frame__controls,.video-frame:focus-within .video-frame__controls{opacity:1}@media (hover:none){.video-frame__controls{opacity:1}}.video-frame__ctl{background-color:var(--light-surface);width:2.5rem;height:2.5rem;color:var(--light-ink);cursor:pointer;border:0;justify-content:center;align-items:center;padding:0;transition:background-color .2s;display:inline-flex}.video-frame__ctl:hover,.video-frame__ctl:focus-visible{background-color:var(--dark-ink)}.video-frame__ctl svg{width:1.1rem;height:1.1rem}@media (prefers-reduced-motion:reduce){.video-frame__poster,.video-frame__controls{transition:none}.video-frame__loading span{opacity:.6;animation:none}}