/* Rotate the complete scene, including the wall and START screen. */
.site-stage{position:relative;isolation:isolate;min-height:100svh}
@media(max-width:600px),(max-height:600px){
 html[data-theme],html[data-theme] body{height:100%;overflow:hidden;overscroll-behavior:none}
 html[data-theme] .site-stage{width:100%;height:100dvh;min-height:0;overflow:hidden}
 html[data-theme] .player-page{
  width:100%;height:100%;min-height:0;align-content:center;
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
 }
 html[data-theme] .site-stage .start-screen{width:100%;height:100%;max-height:100%;padding:12px}
 html[data-theme] .site-stage .start-panel{zoom:var(--start-screen-zoom,1)}
 html[data-theme] .settings-panel{max-height:calc((var(--stage-height,100dvh) - 110px)/var(--console-frame-zoom,1))}
}
@media(max-width:600px) and (orientation:portrait){
 html[data-theme] .site-stage{
  position:fixed;inset:0 auto auto 0;width:100dvh;height:100dvw;min-height:0;
  transform-origin:0 0;transform:translateX(100dvw) rotate(90deg);
 }
 html[data-theme] .player-page{
  padding:max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-top));
 }
 html[data-theme] .playlist,html[data-theme] .settings-panel{touch-action:auto}
}