@layer components{.video-dialog{margin:0;padding:0;border:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;background:hsl(var(--background));color:hsl(var(--foreground))}.video-dialog[open]{display:flex;flex-direction:column}.video-dialog::backdrop{background:hsl(var(--background) / .88)}.video-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 0 0 1.25rem;border-bottom:1px solid hsl(var(--border))}.video-frame{display:block;flex:1 1 auto;min-height:0;width:100%;height:100%;object-fit:contain;background:hsl(var(--background))}@media(min-width:768px){.video-dialog{margin:auto;width:fit-content;height:fit-content;border:1px solid hsl(var(--border))}.video-frame{flex:none;width:auto;height:min(1280px,calc(100vh - 7rem));height:min(1280px,calc(100dvh - 7rem))}.video-frame-wide{width:min(1280px,calc(100vw - 4rem),calc((100vh - 7rem) * 16 / 9));width:min(1280px,calc(100vw - 4rem),calc((100dvh - 7rem) * 16 / 9));height:auto;aspect-ratio:16 / 9}}html[data-video-open]{overflow:hidden;padding-right:var(--video-open-gap, 0px)}@media(prefers-reduced-motion:no-preference){.video-dialog[open],.video-dialog[open]::backdrop{animation:video-in .16s ease-out}}@keyframes video-in{0%{opacity:0}}}
