/* Mobile controls stay clear of the playfield, not over the HUD. */
html,body{overscroll-behavior:none;touch-action:auto;height:100%;height:100dvh}#mainMenu,#overlay,#modal{touch-action:pan-y}.overlay{overscroll-behavior:contain}button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
:root{--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px)}
#joystick{z-index:8;position:fixed;width:116px;height:116px;left:calc(22px + var(--safe-l));bottom:calc(156px + var(--safe-b));border:3px solid #9ccec9;border-radius:50%;background:radial-gradient(circle,#193f56b8 0 42%,#0b263c91 43%);box-shadow:inset 0 0 0 6px #0d2a3e55,3px 3px 0 #09253777;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
#joystick:before,#joystick:after{content:'';position:absolute;background:#b7d9d147;pointer-events:none}#joystick:before{width:2px;height:80%;left:calc(50% - 1px);top:10%}#joystick:after{height:2px;width:80%;top:calc(50% - 1px);left:10%}#joystick div{left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%);border:2px solid #d2eed9;background:#83c4b9;box-shadow:inset 0 0 0 4px #5b9e9f,2px 2px 0 #0d2b3f88;z-index:1}#joystick.active{border-color:#ffdc81;cursor:grabbing}#joystick.active div{background:#cfe2b3;border-color:#ffebad}.touch-controls #joystick{display:block}.in-dialog #joystick{visibility:hidden;pointer-events:none}
@media(pointer:coarse),(max-width:700px){#joystick{display:block}#contextButton{min-height:48px;min-width:100px;right:calc(18px + var(--safe-r));left:auto;bottom:calc(128px + var(--safe-b));transform:none}#topbar{top:calc(10px + var(--safe-t));left:calc(10px + var(--safe-l));right:calc(10px + var(--safe-r))}}
/* Portrait: one thin status row and a separate four-slot strip. */
@media(max-width:700px) and (orientation:portrait){
 #topbar{gap:6px}.location{padding:8px;min-width:90px}.location strong{font-size:12px}.run-numbers{gap:8px;padding:7px 8px}.run-numbers strong{font-size:18px}.run-numbers small{font-size:12px}.icon-button{width:42px;height:42px}#topbar nav{gap:4px}#soundButton{display:none}
 #hud{display:block;left:10px;right:10px;bottom:calc(14px + var(--safe-b));height:130px;pointer-events:none}#hud .player-panel{position:absolute;left:0;right:0;top:0;width:auto;height:53px;padding:6px 9px;gap:8px}.portrait{width:36px;height:36px;flex-shrink:0}.portrait canvas{width:32px;height:32px}.player-info{flex:1;min-width:0}.player-info>div{display:flex;justify-content:space-between}.player-info small{line-height:1.2}.hp-track{margin:4px 0;height:6px}
 #hud .moves-panel{position:absolute;left:0;right:0;bottom:0;min-width:0;height:68px;padding:4px;gap:4px}.move-slot{min-height:58px;padding:3px 2px;display:flex;align-items:center;justify-content:center;flex-direction:column}.move-slot .move-symbol{font-size:14px;line-height:14px}.move-slot strong{font-size:12px;margin:3px 0;line-height:1.1}.move-slot small{display:none}.move-slot.empty strong{font-size:12px}
 #hud .badge-panel{position:fixed;top:calc(201px + var(--safe-t));right:10px;width:106px;padding:6px;pointer-events:auto;background:#102c42d9}.badge-panel>small{font-size:12px;display:flex;justify-content:space-between;gap:3px}#badges{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:5px 0}.badge{font-size:12px}#buildButton{width:100%;height:30px;font-size:12px}
 #hud>.minimap-panel{top:calc(76px + var(--safe-t));right:10px;width:106px;height:120px}.minimap-panel canvas{width:106px;height:106px}.minimap-panel>span{font-size:12px;padding:3px}#objective{top:calc(68px + var(--safe-t));left:10px;max-width:calc(100vw - 136px);padding:7px 9px}#objectiveText{line-height:1.4;font-size:12px}#toast{top:calc(143px + var(--safe-t));max-width:calc(100vw - 136px);left:10px;transform:none;padding:7px 10px}#toast.show{transform:none}#joystick{bottom:calc(166px + var(--safe-b));left:calc(20px + var(--safe-l));width:112px;height:112px}#contextButton{bottom:calc(164px + var(--safe-b));right:16px}#xpText{display:none}#bossHud{top:calc(75px + var(--safe-t));left:10px;right:128px;width:auto;transform:none;padding:8px}#leaderPortrait{display:none}
 .roster-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.roster-preview{display:block}.evolution-forms{overflow-x:auto;justify-content:flex-start}.learn-pool{margin-top:10px;max-height:150px;overflow:auto}
}
/* Landscape phones: left thumb zone, bottom skill strip, right actions. */
@media(orientation:landscape) and (max-height:600px) and (max-width:1400px){
 #joystick{display:block;width:108px;height:108px;bottom:calc(20px + var(--safe-b));left:calc(24px + var(--safe-l))}
 #topbar{left:calc(184px + var(--safe-l));right:calc(10px + var(--safe-r));top:calc(8px + var(--safe-t));height:44px;gap:8px}.location{padding:5px 9px;min-width:102px;height:44px}.location strong{font-size:12px}.run-numbers{height:44px;padding:5px 10px;gap:12px;margin-left:auto}.run-numbers small{font-size:12px}.run-numbers strong{font-size:18px;line-height:1.1}.icon-button{width:44px;height:44px}#soundButton{display:none}#topbar nav{gap:4px}
 #hud{inset:0;display:block;pointer-events:none}#hud .player-panel{position:fixed;top:calc(8px + var(--safe-t));left:calc(10px + var(--safe-l));width:164px;height:44px;padding:5px 7px;gap:7px}.portrait{width:30px;height:30px;flex-shrink:0}.portrait canvas{width:28px;height:28px}.player-info{min-width:0;flex:1}.player-info>div{display:flex;justify-content:space-between}.player-info strong,.player-info span,.player-info small{font-size:12px}.hp-track{height:5px;margin:3px 0}.player-info small{display:none}
 #hud .moves-panel{position:fixed;left:calc(152px + var(--safe-l));right:calc(122px + var(--safe-r));bottom:calc(12px + var(--safe-b));height:58px;min-width:0;padding:4px;gap:4px}.move-slot{min-height:48px;padding:2px;display:flex;align-items:center;justify-content:center;flex-direction:column}.move-slot strong{margin:4px 0 1px;font-size:12px;line-height:1.15}.move-slot .move-symbol{font-size:14px;line-height:14px}.move-slot small{display:none}.move-slot.empty strong{font-size:12px}
 #hud .badge-panel{position:fixed;bottom:calc(12px + var(--safe-b));right:calc(10px + var(--safe-r));width:102px;height:58px;padding:5px;pointer-events:auto}.badge-panel>small{font-size:12px;display:flex;justify-content:space-between}#badges{display:none}#buildButton{height:30px;width:100%;font-size:12px}
 #hud>.minimap-panel{top:calc(62px + var(--safe-t));right:calc(10px + var(--safe-r));width:88px;height:106px}.minimap-panel canvas{width:88px;height:88px}.minimap-panel>span{font-size:12px;padding:2px;margin-top:3px}
 #objective{top:calc(62px + var(--safe-t));left:calc(10px + var(--safe-l));padding:6px 8px;max-width:270px}#objectiveText{font-size:12px;line-height:1.4}#toast{top:calc(105px + var(--safe-t));font-size:12px;max-width:270px;padding:6px 9px;left:calc(10px + var(--safe-l));transform:none}#toast.show{transform:none}#contextButton{left:auto;right:calc(10px + var(--safe-r));bottom:calc(84px + var(--safe-b));transform:none;padding:10px;min-width:102px;min-height:44px;font-size:12px}#xpText{display:none}#xpBar{height:5px}#bossHud{top:calc(62px + var(--safe-t));left:calc(294px + var(--safe-l));right:116px;width:auto;transform:none;padding:7px 10px}#bossName,#bossHpText{font-size:12px}#bossHud small,#leaderPortrait{display:none}
 #mainMenu{padding:calc(8px + var(--safe-t)) calc(16px + var(--safe-r)) calc(8px + var(--safe-b)) calc(16px + var(--safe-l));overflow:auto}.home-top{height:32px;min-height:32px}.home-counters>button{padding:5px 10px;min-height:32px}.home-layout{display:grid;grid-template-columns:minmax(210px,1fr) minmax(260px,340px);gap:24px;margin:8px auto;width:min(820px,100%);align-items:center}.home-hero .champion-title{font-size:26px!important;margin:0 0 4px}.home-hero .champion-title span{font-size:12px;letter-spacing:3px;margin:0}.hero-partner{width:142px;height:102px;margin:4px 0 0}.hero-partner canvas{width:130px;height:108px;left:2px;top:-3px}.partner-number,.partner-change{font-size:12px}.partner-number{top:5px;left:6px}.partner-change{bottom:4px;right:6px}.partner-selector{margin-top:7px;min-width:200px;gap:15px}.partner-selector strong{font-size:18px}.partner-selector>div{gap:3px}.partner-type{padding:2px 6px}.partner-selector>button{width:32px;height:32px}.hero-evolution{font-size:12px;margin-top:5px;line-height:1.3}.home-sidebar{max-width:none}.home-nav{display:grid;grid-template-columns:1fr 1fr;padding:8px;gap:5px}.nav-item{padding:8px;min-height:44px;gap:7px;margin:0}.nav-item strong{font-size:12px}.primary-nav strong{font-size:18px}.primary-nav{grid-column:1/-1}.nav-icon{font-size:18px;width:20px}.home-record{padding:6px 9px;margin-top:7px;gap:10px}.home-record span,.home-record b{font-size:12px}.home-footer{font-size:12px;margin:0;justify-content:flex-end}.home-mark{display:none}
 .overlay{padding:calc(10px + var(--safe-t)) calc(16px + var(--safe-r)) calc(10px + var(--safe-b)) calc(16px + var(--safe-l));align-items:center}#modal,#modal.wide{padding:18px 20px;max-height:calc(100dvh - 24px - var(--safe-t) - var(--safe-b));width:min(880px,100%)}#modal h2{font-size:18px;margin:0 0 10px}.eyebrow{margin-bottom:7px;font-size:12px}.choice-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.choice{min-height:116px;padding:10px;display:block}.choice .symbol{font-size:20px;margin:0 0 7px}.choice strong{font-size:18px;margin:0 0 7px}.choice small,.choice em{font-size:12px;line-height:1.4}.modal-actions{margin-top:12px;gap:8px}.modal-actions button{min-height:40px;padding:8px 16px}.close{top:8px;right:9px;width:32px;height:32px}.stat-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.stat-grid>div{padding:8px}.stat-grid strong{font-size:18px}.settings-row{margin:10px 0}.roster-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:10px 0}.roster-card{min-height:62px;padding:4px;gap:4px}.roster-card canvas{width:44px;height:44px}.roster-card em,.roster-card small{display:none}.roster-preview{grid-template-columns:1fr 1fr;padding:9px;gap:10px}.evolution-forms canvas{width:44px;height:40px}.learn-pool{max-height:95px;overflow:auto}.room-slots{gap:8px;margin:10px 0}.room-player{padding:6px}.room-player canvas{height:45px;width:45px}.room-player.empty{min-height:100px}.account-form{margin:10px auto;gap:10px}.account-form input{padding:8px}.social-layout{gap:14px}.guide-steps{gap:8px;margin:10px 0}
}
@media(orientation:landscape) and (max-height:360px){.home-record,.home-footer,.hero-evolution{display:none}.hero-partner{height:88px}.hero-partner canvas{height:95px}.home-layout{margin-top:2px}.home-hero .champion-title{font-size:24px!important}.choice{min-height:100px}.choice .symbol{display:none}.choice strong{font-size:18px}}
.learn-pool{display:flex;flex-wrap:wrap;gap:5px}.learn-pool span{font-size:12px;padding:4px 6px;border:1px solid #517783;background:#102c42;color:#d8e8d1}.learn-pool .initial{color:#f4d684;border-color:#bda76c}
@media(max-width:700px),(orientation:landscape) and (max-height:600px){#hud .badge-panel>small{padding:0;white-space:nowrap;line-height:1.4}#badgeCount{float:none;flex:none;width:auto;margin:0;white-space:nowrap}#hud #buildButton{position:static;float:none;padding:0;min-width:0;white-space:nowrap}}

#game,.shade{touch-action:none}