.viewport-container{position:relative}.viewport-wrapper{width:100%;display:flex;justify-content:center;align-items:start}.app-frame{aspect-ratio:var(--asp-w) /var(--asp-h);width:min(calc(var(--zoom) * 1dvw),calc(calc(var(--zoom) * 1dvh) * (var(--asp-w) / var(--asp-h))));height:min(calc(var(--zoom) * 1dvh),calc(calc(var(--zoom) * 1dvw) * (var(--asp-h) / var(--asp-w))));max-width:min(var(--max-w,calc(var(--zoom) * 1dvw))*1px,calc(var(--zoom) * 1dvw));max-height:min(var(--max-h,calc(var(--zoom) * 1dvh))*1px,calc(var(--zoom) * 1dvh));border:0;border-radius:.3rem;transition:all .3s ease}.toolbar{height:2.5rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.75rem;padding:0 .75rem;border:1px solid rgb(39 39 42/.6);border-radius:.5rem;backdrop-filter:blur(6px)}.viewport-container:fullscreen .app-frame{width:min(var(--max-w,100vw) * 1px,100vw);height:min(var(--max-h,100vh) * 1px,100vh)}.viewport-container:fullscreen .toolbar{display:none}