#stage{position:fixed;inset:0;container:stage / size}html.turned #stage{inset:0 auto auto 0;width:100vh;height:100vw;transform-origin:0 0;transform:rotate(90deg) translateY(-100%);animation:turn-in .42s cubic-bezier(.2,.9,.3,1) both}html.turned.turned-right #stage{transform:rotate(-90deg) translate(-100%);animation-name:turn-in-right}@supports (height: 100dvh){html.turned #stage{width:100dvh;height:100dvw}}html.turned{--safe-top: max(env(safe-area-inset-right), var(--tg-top));--safe-bottom: max(env(safe-area-inset-left), var(--tg-bottom))}html.turned.turned-right{--safe-top: max(env(safe-area-inset-left), var(--tg-top));--safe-bottom: max(env(safe-area-inset-right), var(--tg-bottom))}@keyframes turn-in{0%{transform:rotate(78deg) translateY(-100%);opacity:0}to{transform:rotate(90deg) translateY(-100%);opacity:1}}@keyframes turn-in-right{0%{transform:rotate(-78deg) translate(-100%);opacity:0}to{transform:rotate(-90deg) translate(-100%);opacity:1}}@media (prefers-reduced-motion: reduce){html.turned #stage{animation:none}}html.turned :is(.sheets,#overlay){position:absolute;top:0;left:0;width:100vw;height:100vh;transform-origin:0 0;transform:translateY(100vw) rotate(-90deg);container:stage / size;--tg-left: 0px;--tg-right: 0px;--safe-bottom: env(safe-area-inset-bottom)}html.turned.turned-right :is(.sheets,#overlay){transform:translate(100vh) rotate(90deg)}@supports (height: 100dvh){html.turned :is(.sheets,#overlay){width:100dvw;height:100dvh;transform:translateY(100dvw) rotate(-90deg)}html.turned.turned-right :is(.sheets,#overlay){transform:translate(100dvh) rotate(90deg)}}html.turned :is(.sheets,#overlay):empty{display:none}
