/* Stable stage: canvas intrinsic size must never change the page geometry. */
html{overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;margin:0;overflow:hidden;overscroll-behavior:none}
.shell>canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.shell>.controls>.pixel-wrap{width:clamp(140px,23%,220px);min-width:0;height:auto;aspect-ratio:309/112}
.shell>.controls .pixel-wrap button,.shell>.controls .pixel-wrap #jump,.shell>.controls .pixel-wrap #operate{font-size:clamp(11px,1.5vw,18px)}
.consilium-room .memo-footer .pixel-wrap{width:23%;min-width:0;max-width:220px;height:auto;aspect-ratio:309/112}
.consilium-room .memo-footer .pixel-wrap button{font-size:clamp(10px,1.4cqw,18px);height:100%;padding:0 7% 7%}
@media (orientation:landscape) and (max-height:550px),(orientation:landscape) and (pointer:coarse){
 body{display:flex;align-items:center;justify-content:center;width:var(--app-width,100vw);height:var(--app-height,100dvh);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
 .shell,.shell:fullscreen{flex:none;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;aspect-ratio:auto;box-shadow:none;--control-height:clamp(60px,20%,82px)}
 .shell>canvas{height:calc(100% - var(--control-height));width:100%;object-fit:fill}
 .shell>.controls{left:0;right:0;bottom:0;height:var(--control-height);padding:3px 3%;align-items:center;background:#030a19;border-top:3px solid #125389}
 .shell>.controls>.pixel-wrap{width:min(23%,190px);min-width:0;height:auto}
 .hud{padding:8px 2.3%}
 .hud .brand{font-size:clamp(8px,1.2vw,12px);padding:8px 9px}
 .hud .score{font-size:clamp(10px,1.4vw,14px);gap:clamp(7px,1.5vw,14px);padding:5px 0}
 .hud .life-count img{width:1.1em;height:1.1em}
 .sound-toggle{top:45px;width:36px;height:36px;padding:6px}
 .consilium-room .memo-footer{bottom:3%;left:3%;right:3%;height:auto;padding:0;background:none;border:0}
 .consilium-room .memo-footer .pixel-wrap{width:23%;max-width:190px;min-width:0;height:auto}
}
/* Bring touch controls into a comfortable thumb reach without shrinking the scene. */
@media (orientation:landscape) and (max-height:550px),(orientation:landscape) and (pointer:coarse){
 .shell>.controls{padding-left:11%;padding-right:11%;align-items:flex-end;padding-bottom:7px;overflow:visible}
 .shell>.controls>.pixel-wrap{width:clamp(150px,27%,220px);height:clamp(76px,23vh,100px);aspect-ratio:auto;flex:none}
}