.video-player{margin:auto;padding:0;border:0;background:transparent;color:var(--color-text);max-width:100vw;max-height:100vh}.video-player:focus{outline:none}.video-player::backdrop{background:var(--color-overlay)}.video-player__frame{position:relative;display:flex;flex-direction:column;gap:14px;width:min(100vw,1100px,calc((88vh - 96px) * 16 / 9));padding:16px}.video-player--vertical .video-player__frame{width:min(100vw,calc((88vh - 96px)*.5625 + 32px))}.video-player__embed{display:block;width:100%;aspect-ratio:16 / 9;border:0;border-radius:var(--radius-xl);background:var(--color-bg-footer)}.video-player--vertical .video-player__embed{aspect-ratio:9 / 16}.video-player__meta{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px 20px}.video-player__title{margin:0 0 4px;font-size:17px;font-weight:600;line-height:1.3}.video-player__channel{margin:0;font-size:14px;color:var(--color-muted)}.video-player__out{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;height:40px;padding:0 16px;border:1px solid var(--color-border);border-radius:var(--radius-full);background:var(--color-bg-card);color:var(--color-text);font-size:14px;font-weight:600;transition:border-color var(--transition-fast),color var(--transition-fast)}.video-player__out:hover,.video-player__out:focus-visible{border-color:var(--color-accent);color:var(--color-accent)}.video-player__close{position:absolute;top:0;right:0;z-index:1;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--color-border);border-radius:var(--radius-full);background:var(--color-bg-card);color:var(--color-text);cursor:pointer}.video-player__close:after{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px}.video-player__close:hover,.video-player__close:focus-visible{border-color:var(--color-accent);color:var(--color-accent)}