/* V249 — first mobile pass. Desktop stays canonical; phones play in landscape. */
:root{--mobile-safe-top:env(safe-area-inset-top,0px);--mobile-safe-right:env(safe-area-inset-right,0px);--mobile-safe-bottom:env(safe-area-inset-bottom,0px);--mobile-safe-left:env(safe-area-inset-left,0px)}
html,body,#app{min-height:100%;height:100%}
@supports(height:100dvh){html,body,#app{height:100dvh;min-height:100dvh}}

#mobileRotateGateV249,#mobileTouchControlsV249{display:none}
#mobileRotateGateV249{
 position:fixed;inset:0;z-index:30000;align-items:center;justify-content:center;
 padding:calc(20px + var(--mobile-safe-top)) calc(20px + var(--mobile-safe-right)) calc(20px + var(--mobile-safe-bottom)) calc(20px + var(--mobile-safe-left));
 background:radial-gradient(circle at 50% 40%,#16232d 0,#070b0f 62%,#020304 100%);text-align:center
}
.mobileRotateCardV249{width:min(360px,88vw);padding:26px 20px;border:2px solid #9d7837;box-shadow:inset 0 0 0 3px #080d11,0 14px 48px #000;background:#0b1218;color:#ebcf83}
.mobileRotateIconV249{display:block;font-size:46px;line-height:1;margin-bottom:12px;color:#6ed8ff;transform:rotate(-35deg)}
.mobileRotateCardV249 strong,.mobileRotateCardV249 small{display:block;letter-spacing:.12em}
.mobileRotateCardV249 strong{font-size:20px}.mobileRotateCardV249 small{margin-top:9px;color:#92a7b4;font-size:11px}

#mobileTouchControlsV249{position:absolute;inset:0;z-index:150;pointer-events:none;user-select:none;-webkit-user-select:none}
#mobileTouchControlsV249 button{
 pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;min-width:52px;min-height:48px;padding:7px 9px;
 border:1px solid #6b8190;border-bottom:3px solid #273945;border-radius:4px;background:linear-gradient(#14222cdd,#081017ee);color:#d9e7ee;
 box-shadow:inset 0 0 0 2px #05090d,0 4px 12px #0009;font:900 11px/1 var(--font-ui);letter-spacing:.05em
}
#mobileTouchControlsV249 button:active,#mobileTouchControlsV249 button.pressed{transform:translateY(2px);border-color:#e1b34f;color:#ffe092;filter:brightness(1.18)}
.mobileMovePadV249,.mobileActionPadV249{position:absolute;bottom:8px;display:flex;gap:7px;align-items:flex-end}
.mobileMovePadV249{left:calc(8px + var(--mobile-safe-left))}.mobileActionPadV249{right:calc(8px + var(--mobile-safe-right))}
.mobileMovePadV249 button{font-size:18px;min-width:58px}
body:not(.tavernHub) .mobileTalkV249{display:none}body.tavernHub .mobileAttackV249{display:none}

/* V254: Tavern navigation on touch devices is performed directly on the world. */
@media (pointer:coarse){
 body.tavernHub .mobileMovePadV249,body.tavernHub .mobileTalkV249{display:none!important}
 body.tavernHub #game{touch-action:none}
}

@media (orientation:portrait) and (max-width:1000px){#mobileRotateGateV249{display:flex}}

@media (pointer:coarse) and (orientation:landscape) and (max-height:520px){
 #mobileTouchControlsV249{display:block}
 #app{grid-template-rows:46px minmax(0,1fr) calc(48px + var(--mobile-safe-bottom))!important}
 .top{padding:calc(3px + var(--mobile-safe-top)) calc(7px + var(--mobile-safe-right)) 3px calc(7px + var(--mobile-safe-left))!important;gap:5px!important}
 .topBrandBlock{width:120px!important;height:36px!important;padding-left:8px!important}.topBrandBlock .brand{display:block!important;min-width:0!important;font-size:14px!important}.topBrandBlock small{display:none!important}
 .resourceDock{gap:3px!important}.resourceDock .currency{height:34px!important;min-width:68px!important;padding:0 6px!important;font-size:0!important}.resourceDock .currency b{font-size:11px!important}.topActions{display:none!important}
 .bottom{min-height:48px!important;padding:4px calc(7px + var(--mobile-safe-right)) calc(4px + var(--mobile-safe-bottom)) calc(7px + var(--mobile-safe-left))!important;gap:7px!important;justify-content:flex-start!important;overflow-x:auto!important;scrollbar-width:none}
 .bottom::-webkit-scrollbar{display:none}.bottomNavCore,.bottomNavInventory{flex:0 0 auto!important;gap:4px!important}.bottomNavCore{padding-right:8px!important}.bottom .navbtn{height:38px!important;min-width:66px!important;padding:0 7px!important;font-size:11px!important}
 .partyStatusSidebar{left:calc(5px + var(--mobile-safe-left))!important;top:5px!important;width:165px!important;gap:3px!important;padding-top:18px!important;transform:none!important}
 .partyStatusSidebar::before{height:17px!important;padding:4px 7px!important;font-size:11px!important}.partyStatusCard{height:52px!important;padding:3px 5px!important;grid-template-columns:34px 1fr!important;gap:5px!important}
 .partyStatusPortrait{width:32px!important;height:42px!important}.partyStatusHead{height:10px!important}.partyStatusHead b,.partyStatusHead strong{font-size:11px!important}.partyFaithStack{display:none!important}.partyStatusBars{gap:2px!important;margin-top:1px!important}.partyStatusLine{grid-template-columns:1fr 38px!important;gap:3px!important}.partyStatusBar{height:5px!important}.partyStatusVal{font-size:11px!important}
 #portalSurvivalTimer{right:calc(5px + var(--mobile-safe-right))!important;top:5px!important;min-width:250px!important;padding:3px!important;gap:3px!important}
 #portalSurvivalTimer .portalSurvivalInfo{min-width:138px!important}.portalSurvivalInfo .pstClock{font-size:14px!important}#portalSurvivalTimer #stageRerunToggle{min-width:96px!important;padding:3px 5px!important}
 .stagePanel{right:calc(5px + var(--mobile-safe-right))!important;top:70px!important;width:164px!important;min-width:164px!important;padding:6px 8px!important}.lootLog,.hint{display:none!important}
 #sixSkillBar{left:50%!important;bottom:calc(52px + var(--mobile-safe-bottom))!important;max-width:48vw!important;overflow-x:auto!important;gap:3px!important;padding:4px 5px 5px!important;scrollbar-width:none}
 #sixSkillBar::-webkit-scrollbar{display:none}#sixSkillBar .heroSkill,#sixSkillBar #autoSkillsBtn{flex:0 0 42px!important;width:42px!important;height:42px!important;min-height:42px!important}.skillName{font-size:11px!important}
 #potionQuickbarV234 button{width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important}
 .navbtn,.npcDialogBtn,.portalDifficulty button,.stageClearBtn,.gameOverBtn,.tacticalHandButton{min-height:40px}
}

@media (pointer:coarse) and (orientation:landscape) and (max-height:390px){
 #app{grid-template-rows:42px minmax(0,1fr) calc(44px + var(--mobile-safe-bottom))!important}.topBrandBlock{height:33px!important}.resourceDock .currency{height:31px!important}.bottom{min-height:44px!important}.bottom .navbtn{height:34px!important}
 .partyStatusSidebar{width:154px!important}.partyStatusCard{height:47px!important}.partyStatusPortrait{height:37px!important}.stagePanel{display:none!important}
 #sixSkillBar{bottom:calc(47px + var(--mobile-safe-bottom))!important;max-width:45vw!important}#sixSkillBar .heroSkill,#sixSkillBar #autoSkillsBtn,#potionQuickbarV234 button{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;flex-basis:38px!important}
 #mobileTouchControlsV249 button{min-width:48px;min-height:44px}.mobileMovePadV249 button{min-width:52px}
}