/* Domiki compact-mobile v1.15.0.1: layout-only, no game-state modifications. */
@media (max-width:700px){
 html body.mobile-game{--hud-height:88px;--nav-height:58px}
 html[data-world="craft"] body.mobile-game{--hud-height:106px}
 html body.mobile-game #compactHud{box-sizing:border-box!important;height:calc(var(--hud-height) + env(safe-area-inset-top))!important;padding:calc(2px + env(safe-area-inset-top)) 7px 2px!important;gap:1px!important}
 html body.mobile-game #compactHud .hud-world{height:30px!important;min-height:30px!important}
 html body.mobile-game #compactHud .hud-world #hudWorld{font-size:12px!important;padding-inline:6px!important}
 html body.mobile-game #compactHud #hudValues .hud-chip{padding:1px!important}
 html body.mobile-game #compactHud #hudValues .hud-chip i{font-size:12px!important}
 html body.mobile-game #compactHud #hudValues .hud-chip b{font-size:12px!important}
 html body.mobile-game .game-mobile-nav{height:calc(var(--nav-height) + env(safe-area-inset-bottom))!important;box-sizing:border-box!important;padding-top:2px!important}
 html body.mobile-game .game-mobile-nav button{height:48px!important;font-size:10px!important}
 html body.mobile-game .game-mobile-nav button .nav-icon{font-size:19px!important}
 /* 3D view selectors: one slim row, keeping original inputs and event listeners. */
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls{
   display:grid!important;grid-template-columns:54px minmax(65px,1fr) 40px 40px!important;
   grid-template-rows:40px!important;gap:4px!important;flex:0 0 44px!important;
   min-height:44px!important;max-height:44px!important;align-items:center!important;
   margin:0!important;padding:2px 6px!important;overflow:hidden!important;box-sizing:border-box!important;
 }
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls>label,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls>label{
   grid-column:auto!important;grid-row:1!important;min-width:0!important;margin:0!important;font-size:0!important;
 }
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls select,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls select{
   width:100%!important;max-width:100%!important;min-width:0!important;height:40px!important;min-height:40px!important;
   padding:2px 3px!important;font-size:12px!important;border-radius:9px!important;
 }
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls #metroLots,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls #sunnyLots{
   grid-column:3!important;grid-row:1!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
   width:40px!important;min-width:40px!important;height:40px!important;min-height:40px!important;
   font-size:0!important;padding:0!important;
 }
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls #metroLots::before,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls #sunnyLots::before{content:'▦'!important;font-size:19px!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls #metroHelp,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls #sunnyHelp{
   grid-column:4!important;grid-row:1!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
   width:40px!important;height:40px!important;min-height:40px!important;padding:0!important;font-size:17px!important;
 }
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls #metroFocusBuilt,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls #sunnyFocusBuilt,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls #metroFpsHud,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls #sunnyFpsHud,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls #metroStatus,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls #sunnyStatus{display:none!important}
 /* Secondary options accessible by a compact in-game menu, created by JS. */
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls{grid-template-columns:52px minmax(55px,1fr) 40px 40px 40px!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-controls #metroHelp,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-controls #sunnyHelp{grid-column:4!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .compact-more-btn{grid-column:5!important;grid-row:1!important;width:40px!important;height:40px!important;min-height:40px!important;min-width:40px!important;padding:0!important;font-size:21px!important;line-height:1!important;border:1px solid #abc2ae;border-radius:9px;background:#fbf9ed;color:#315d4d}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.living-settings{flex:0 0 42px!important;min-height:42px!important;max-height:42px!important;padding:2px 6px!important;gap:0!important;overflow:hidden!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.living-settings .domiki-action-dock{height:38px!important;min-height:38px!important;max-height:38px!important;gap:4px!important;align-items:stretch!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.living-settings .domiki-action-dock>button{height:38px!important;min-height:38px!important;max-height:38px!important;padding:2px!important;font-size:10px!important;line-height:1!important;overflow:hidden!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.living-settings .domiki-action-dock>button span{font-size:10px!important;line-height:1!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.living-settings #tractorShortcutText{font-size:10px!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.map-hint{display:none!important}
 /* Thin rotation row, leave actual input/track fully usable by touch. */
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-rotation,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-rotation{
   flex:0 0 29px!important;min-height:29px!important;max-height:29px!important;
   height:29px!important;display:flex!important;align-items:center!important;gap:7px!important;
   padding:1px 10px!important;box-sizing:border-box!important;overflow:hidden!important;
 }
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-rotation[hidden],
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-rotation[hidden]{display:none!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-rotation .metro-rotation-heading,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-rotation .sunny-rotation-heading{
   display:flex!important;order:2!important;flex:0 0 auto!important;align-items:center!important;gap:3px!important;min-width:0!important;font-size:11px!important;
 }
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-rotation .metro-rotation-heading label,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-rotation .sunny-rotation-heading label,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-rotation .metro-rotation-scale,
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-rotation .sunny-rotation-scale{display:none!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.metro-rotation input[type=range],
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] .city.card>.sunny-rotation input[type=range]{flex:1 1 0!important;order:1!important;width:0!important;min-width:0!important;height:27px!important;min-height:27px!important;margin:0!important;touch-action:pan-y!important}
 html.gesture-map-ui body.mobile-game[data-mobile-tab="city"] #metroResetAngle{min-height:27px!important;height:27px!important;font-size:10px!important;padding:1px 5px!important}
 /* Small phone map: do not reserve extra rows for legacy controls. */
 html body.mobile-game[data-mobile-tab="city"] section.city.card>div.map-tools{flex:0 0 40px!important;min-height:40px!important;max-height:40px!important;overflow:hidden!important;padding:0 4px!important}
 html body.mobile-game[data-mobile-tab="city"] section.city.card>.map-tools #mapCenter{display:none!important}
 html body.mobile-game[data-mobile-tab="city"] section.city.card>.map-tools button{height:38px!important;min-height:38px!important}
 html body.mobile-game[data-mobile-tab="city"] section.city.card>.map-tools #zoomOut,
 html body.mobile-game[data-mobile-tab="city"] section.city.card>.map-tools #zoomIn{min-width:40px!important;width:40px!important;flex-basis:40px!important}
 /* Cranes: compact heading and actions, scene consumes released space. */
 html body.mobile-game[data-mobile-tab="build"] #builder .panel-heading{min-height:36px!important;max-height:36px!important;padding:2px 9px!important;overflow:hidden!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .panel-heading h2{font-size:14px!important;line-height:1.12!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:calc(100vw - 105px)!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .panel-heading .eyebrow{font-size:8px!important;letter-spacing:.08em!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .controls{grid-template-columns:1.25fr 1fr!important;gap:5px!important;padding:4px 7px!important;max-height:106px!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .controls button{min-height:44px!important;height:44px!important;padding:3px 5px!important;font-size:12px!important;line-height:1.1!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .controls #hint{display:none!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .controls .cancel-construction{min-height:38px!important;height:38px!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .scene{flex:1 1 0px!important;min-height:0!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .scene-label{font-size:10px!important;max-height:24px!important;overflow:hidden!important}
 html body.mobile-game[data-mobile-tab="build"] #builder .floor-hud{transform:scale(.84);transform-origin:top right}
 /* Flyout stays outside the narrow toolbar and has scrollable safe area. */
 .compact-options-menu{position:fixed!important;z-index:3000!important;right:8px!important;top:calc(var(--hud-height) + env(safe-area-inset-top) + 46px)!important;min-width:188px;max-width:min(260px,calc(100vw - 16px));max-height:calc(100dvh - 170px);overflow:auto;background:#fffdf4;border:1px solid #b3c8b2;border-radius:14px;box-shadow:0 12px 32px #213e3060;padding:6px;display:grid;gap:4px}
 .compact-options-menu[hidden]{display:none!important}
 .compact-options-menu button{display:block;width:100%;text-align:left;padding:10px 12px;min-height:42px;border:0;border-radius:9px;background:#ecf2e7;color:#345e4c;font-size:13px;font-weight:700}
}
