/* The game is a viewport, not a document that needs scrolling behind a canvas. */
html[data-game-viewport="mobile"],html[data-game-viewport="mobile"] body{
 width:100%;height:var(--game-viewport-height,100dvh)!important;min-height:0!important;
 margin:0;overflow:hidden;overscroll-behavior:none;
}
html[data-game-viewport="mobile"] body{
 position:fixed;inset:0;bottom:auto;contain:layout;
}
html[data-game-viewport="mobile"] body>:is(canvas#scene,canvas#world,canvas#view,#world,#scene,#mall-scene),
html[data-game-viewport="mobile"] .project-city-ui{
 position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;
}
html[data-game-viewport="mobile"] :is(dialog,.project-directory){
 box-sizing:border-box;max-height:calc(var(--game-viewport-height,100dvh) - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
 max-width:calc(100% - 20px - env(safe-area-inset-left) - env(safe-area-inset-right));
 overflow:auto;overscroll-behavior:contain;touch-action:manipulation;
}
html[data-game-viewport="mobile"] :is(dialog,.project-directory) :is(input,textarea,select){scroll-margin-block:24px}
/* Native panels remain scrollable without dragging the game underneath them. */
html[data-game-viewport="mobile"] :is(.catalog,.mall-menu-panel,.project-directory,.product-panel,.consultant-panel,#panel-body,#dialog-body){
 min-height:0;overscroll-behavior:contain;touch-action:manipulation;
}
html[data-game-landscape="true"] .project-city-ui .project-city-nav{
 top:52px;left:max(10px,env(safe-area-inset-left));right:max(62px,env(safe-area-inset-right));
 max-width:none;gap:4px;flex-wrap:nowrap;overflow-x:auto;
}
html[data-game-landscape="true"] .project-city-nav>*{flex-shrink:0;font-size:11px;min-height:36px;padding:7px 9px}
html[data-game-landscape="true"] .project-city-ui .project-city-notice{top:88px;max-width:60%;padding:6px 10px;font-size:10px;pointer-events:none}
html[data-game-landscape="true"] .project-city-ui .room-audio-control{top:52px;right:max(10px,env(safe-area-inset-right))}
html[data-game-landscape="true"] .project-city-ui .gastro-voice{top:98px;right:max(10px,env(safe-area-inset-right))}
html[data-game-landscape="true"] .project-city-ui .gastro-mic span{display:none}
html[data-game-landscape="true"] .halwa-imported-scene>header{
 height:44px;min-height:0;padding-top:0;padding-bottom:0;
 padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));
}
html[data-game-landscape="true"] .halwa-imported-scene>header :is(.topmiddle,.edition,.header-place,.brand small,.identity .eyebrow){display:none}
html[data-game-landscape="true"] .halwa-imported-scene>header nav{min-width:0;overflow-x:auto;flex-wrap:nowrap}
/* The automobile catalogue is a panel on short touch screens, including wide phones. */
html[data-game-landscape="true"][data-city-project="auto"] body>header{position:absolute;inset:0 0 auto;z-index:10}
html[data-game-landscape="true"][data-city-project="auto"] body>main{height:100%!important;min-height:0}
html[data-game-landscape="true"][data-city-project="auto"] .catalog{display:none;position:absolute;top:94px;bottom:8px;left:max(8px,env(safe-area-inset-left));width:min(310px,70%);min-width:0;padding:12px;overflow:auto}
html[data-game-landscape="true"][data-city-project="auto"] .catalog.open{display:flex}
html[data-game-landscape="true"][data-city-project="auto"] .mobile-catalog{display:block;bottom:auto;top:98px;left:max(10px,env(safe-area-inset-left))}
html[data-game-landscape="true"][data-city-project="auto"] .view-top{top:98px;left:150px;right:10px}
html[data-game-landscape="true"][data-city-project="auto"] .scene-title{display:none}
html[data-game-landscape="true"][data-city-project="auto"] .zonebar{top:140px}
html[data-game-landscape="true"][data-city-project="auto"] .detail{top:94px;bottom:8px;max-height:calc(var(--game-viewport-height) - 102px)}

html[data-game-landscape="true"] .halwa-imported-scene :is(#run,#jump,#touchRun,#touchJump,#touch-run,#touch-jump){display:none!important}
html[data-game-landscape="true"] .project-consultant-open{top:min(257px,calc(var(--game-viewport-height) - 52px - env(safe-area-inset-bottom)))}

/* Keep contextual pavilion buttons clear of the voice column and city navigation. */
html[data-game-landscape="true"] .project-merch-configure{top:100px;right:calc(64px + env(safe-area-inset-right));max-width:32vw}
html[data-game-landscape="true"] .project-merch-hint{top:auto;bottom:54px;max-width:calc(100% - 260px);font-size:11px!important}
