/* Mobile-only HUD; the new top wrapper does not create a PC layout box. */
#mobileTopCluster{display:contents}
#appShopButton{display:none}
.ui-v30 #hud #pcHotbar #appAssist{display:none}
.ui-v30.app-mobile{--mobile-dock-cell:36px}
.ui-v30.app-mobile.game-fullscreen{--v30-safe-l:max(3px,env(safe-area-inset-left));--v30-safe-r:max(3px,env(safe-area-inset-right));--v30-safe-t:max(3px,env(safe-area-inset-top));--v30-safe-b:max(3px,env(safe-area-inset-bottom))}
.ui-v30.app-mobile #game:fullscreen,.ui-v30.app-mobile #game:-webkit-full-screen{width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0}
/* Currency, shop and menu occupy one measured row at the safe right edge. */
.ui-v30.app-mobile #hud #mobileTopCluster{display:flex;position:absolute;top:var(--v30-safe-t);right:var(--v30-safe-r);align-items:center;gap:3px;max-width:calc(100% - 190px);z-index:5;pointer-events:auto}
.ui-v30.app-mobile #hud #mobileTopCluster #appResources{position:static;inset:auto;transform:none;margin:0;min-width:0;max-width:118px;padding:3px 6px;overflow:hidden}
.ui-v30.app-mobile #hud #mobileTopCluster #appTop{position:static;inset:auto;gap:3px;flex:none}
.ui-v30.app-mobile #hud #appTop #appShopButton{display:grid;place-items:center}
.ui-v30.app-mobile #hud #appTop #appShopButton .ui-icon{width:23px;height:23px}
/* Guidance is a real child of the folding task group, below its services. */
.ui-v30.app-mobile #hud #mobileQuestBody #routeBanner{position:relative;inset:auto;transform:none;display:grid;grid-template-columns:minmax(0,1fr) 42px;align-items:center;gap:4px;width:100%;max-width:none;height:auto;max-height:none;min-height:0;margin:3px 0 0;padding:4px;border:1px solid #9f8d5355;border-radius:5px;background:#16291fe8;box-shadow:none;font-size:8px;line-height:12px;pointer-events:auto}
.ui-v30.app-mobile #hud #mobileQuestBody #routeBanner span{min-width:0;font-size:8px;line-height:12px;white-space:normal;overflow-wrap:anywhere}
.ui-v30.app-mobile #hud #mobileQuestBody #routeBanner button{min-width:0;min-height:27px;padding:3px 2px;font-size:8px;line-height:11px;border-radius:4px}
/* One centered, tightly spaced action row. No duplicate map/shop below. */
.ui-v30.app-mobile:not(.app-home) #hud #pcHotbar{display:flex;position:absolute;left:50%;right:auto;bottom:var(--v30-safe-b);transform:translateX(-50%);width:max-content;max-width:calc(100% - 8px);justify-content:center;align-items:center;gap:0;padding:0;margin:0;border:0;background:none;box-shadow:none;overflow:visible}
.ui-v30.app-mobile #hud #pcHotbar button,.ui-v30.app-mobile #hud #pcHotbar .hotbar-utility{flex:0 0 var(--mobile-dock-cell);width:var(--mobile-dock-cell);min-width:var(--mobile-dock-cell);height:38px;min-height:38px;padding:3px;margin:0;border:0;background:none;box-shadow:none;grid-row:auto}
.ui-v30.app-mobile #hud #pcHotbar img{width:28px;height:28px}
.ui-v30.app-mobile #hud #pcHotbar .hotbar-utility img{width:26px;height:26px;top:0}
.ui-v30.app-mobile #hud #pcHotbar .mobile-utility-label,.ui-v30.app-mobile #hud #pcHotbar [data-panel=map],.ui-v30.app-mobile #hud #pcHotbar [data-panel=styleShop]{display:none}
.ui-v30.app-mobile #hud #pcHotbar #appAssist{display:grid;position:relative;inset:auto;transform:none;isolation:auto;flex:0 0 var(--mobile-dock-cell);width:var(--mobile-dock-cell);min-width:var(--mobile-dock-cell);height:38px;min-height:38px;margin:0;padding:3px;border:0;border-radius:50%;background:none;box-shadow:none}
.ui-v30.app-mobile #hud #pcHotbar #appAssist:before,.ui-v30.app-mobile #hud #pcHotbar #appAssist:after{display:none;content:none}
.ui-v30.app-mobile #hud #pcHotbar #appAssistLabel{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ui-v30.app-mobile #hud #pcHotbar #appAssistState{position:absolute;bottom:0;right:0;left:0;font-size:7px;line-height:9px;text-align:center;color:#ddd8c0;text-shadow:0 1px 3px #000,0 0 3px #000}
.ui-v30.app-mobile #hud #pcHotbar #appAssist.active img{filter:drop-shadow(0 0 3px #91ee77)}
.ui-v30.app-mobile #hud #pcHotbar #appAssist.active #appAssistState{color:#c1ff8a}
.ui-v30.app-mobile #hud #appCommandDock{left:50%;right:auto;bottom:calc(var(--v30-safe-b) + 43px);transform:translateX(-50%);max-width:calc(100% - 24px);gap:2px;padding:3px}
@media(max-width:700px){.ui-v30.app-mobile{--mobile-dock-cell:32px}}
@media(max-width:560px){
 .ui-v30.app-mobile{--mobile-dock-cell:clamp(28px,8vw,32px)}
 .ui-v30.app-mobile #hud #joystick{bottom:calc(var(--v30-safe-b) + 44px)}
 .ui-v30.app-mobile #hud #pcHotbar img{width:26px;height:26px}
}
/* Map pins are not general modal buttons. Reset the inherited green panels. */
.ui-v30.app-mobile #modal[data-panel=map] #modalBody .kingdom-pin,
.ui-v30.app-mobile #modal[data-panel=map] #modalBody .kingdom-pin:hover,
.ui-v30.app-mobile #modal[data-panel=map] #modalBody .kingdom-pin:active,
.ui-v30.app-mobile #modal[data-panel=map] #modalBody .kingdom-pin[aria-pressed=true]{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:88px;min-width:0;height:auto;min-height:60px;padding:0;margin:0;border:0;border-radius:0;background:none;box-shadow:none;transform:translate(-50%,-15px);line-height:1.2;touch-action:pan-x pan-y}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-pin-emblem{width:30px;height:30px;border-width:1px}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-pin-emblem>.kingdom-icon{width:18px;height:18px}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-pin-emblem>.kingdom-pin-lock,.ui-v30.app-mobile #modal[data-panel=map] .kingdom-pin-emblem>.kingdom-pin-check{width:11px;height:11px;padding:2px;right:-3px;bottom:-2px}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-pin-caption{max-width:88px;margin-top:4px;padding:3px 4px;border-radius:3px}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-pin-caption strong{font-size:9px;line-height:12px}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-pin-caption small{font-size:7px;line-height:10px;margin-top:1px}
/* Both axes are scrollable; do not clip the lower half of the kingdom. Native
   scrolling keeps touch inertia, scrollbar/wheel input and keyboard support. */
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-map-viewport{height:clamp(170px,52dvh,340px);max-height:none;min-height:0;overflow-x:auto;overflow-y:auto;touch-action:pan-x pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scroll-behavior:auto}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-map-art{width:100%;min-width:850px;aspect-ratio:1586/992}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-help{font-size:9px;line-height:13px;margin-bottom:6px}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-help>span{font-size:9px}
.ui-v30.app-mobile #modal[data-panel=map] .kingdom-legend{gap:6px 12px;padding:8px 2px;font-size:8px}