/* Touch controls sit below dialogs and keep the center clear for aiming. */
html,body{height:100%;height:100dvh;overscroll-behavior:none}
#small-screen{display:none!important}
#world canvas{touch-action:none}
button{touch-action:manipulation}
#touch-pad{display:none;position:absolute;inset:0;pointer-events:none;z-index:12;user-select:none;-webkit-user-select:none}
.touch-controls #touch-pad{display:block}
#touch-stick{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:calc(30px + env(safe-area-inset-bottom));width:126px;height:126px;border:2px solid #d0c39c65;border-radius:50%;background:#14281f88;pointer-events:auto;touch-action:none}
#touch-stick:after{content:'MOVE';position:absolute;top:-24px;left:0;width:100%;text-align:center;font-size:9px;letter-spacing:2px;color:#d1d9bd;pointer-events:none}
#touch-knob{position:absolute;left:50%;top:50%;width:48px;height:48px;border-radius:50%;background:#ced4ae70;border:1px solid #f5e1acb0;transform:translate(-50%,-50%);pointer-events:none}
.touch-main-actions{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:calc(205px + env(safe-area-inset-bottom));display:flex;gap:10px;pointer-events:auto}
.touch-main-actions button{min-width:64px;min-height:56px;background:#14251ef0;border:1px solid #dec38a9c;border-radius:16px;font-size:12px;touch-action:none}
#touch-attack{min-width:100px;background:#425443ee;font-weight:700}
#touch-attack.pressed{background:#7c8660}
body:not(.playing) .touch-main-actions{display:none}
.touch-help{position:absolute;left:50%;bottom:calc(10px + env(safe-area-inset-bottom));transform:translateX(-50%);font-size:9px;color:#ccd5c0;white-space:nowrap;pointer-events:none}
.touch-controls #app:has(#modal-backdrop:not([hidden])) #touch-pad{display:none}
.touch-controls .game-hint,.touch-controls .hall-controls,.touch-controls #camera-look,.touch-controls #camera-cursor,.touch-controls .camera-tools>small,.touch-controls .camera-tools>span{display:none}
.touch-controls #hud .ability-bar,.touch-controls.playing.ninja-playing #hud .ability-bar{left:auto;right:max(12px,env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));transform:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:228px;gap:5px}
.touch-controls #hud .ability-bar>.ability{min-width:0;min-height:54px;padding:8px 6px;order:initial;border-radius:8px;touch-action:manipulation}
.touch-controls #hud .ability-bar>.ability:first-child,.touch-controls #hud .ability-bar>div:nth-last-child(2){display:none}
.touch-controls .ability kbd,.touch-controls .inventory-button kbd,.touch-controls #interact kbd,.touch-controls .hall-interact kbd,.touch-controls .camera-tools kbd{display:none}
.touch-controls .ability strong{font-size:10px;line-height:1.15}
.touch-controls .ability small{font-size:9px;margin-top:5px}
.touch-controls .camera-tools,.touch-controls.playing.ninja-playing .camera-tools{bottom:calc(270px + env(safe-area-inset-bottom));right:max(12px,env(safe-area-inset-right));width:auto;gap:6px}
.touch-controls .camera-tools button{min-height:44px;padding:8px;border-radius:8px}
.touch-controls #interact,.touch-controls .hall-interact{pointer-events:auto;bottom:calc(200px + env(safe-area-inset-bottom));max-width:55%;white-space:normal;text-align:center;min-height:44px;padding:10px 14px;border-radius:8px}
.touch-controls #interact{left:20px;transform:none;max-width:calc(100% - 270px)}
.touch-controls .hall-character{left:18px;bottom:calc(195px + env(safe-area-inset-bottom));padding:8px 12px}
.touch-controls .hall-character>span{font-size:18px}
.touch-controls .route-panel{top:122px;right:max(12px,env(safe-area-inset-right));bottom:auto;width:65px;padding:5px;opacity:.8}
.touch-controls .route-panel #dungeon-map{height:85px}
.touch-controls .route-panel small{display:none}
.touch-controls #toast-area{top:115px;left:16px;right:auto;width:min(270px,70vw)}
.touch-controls #modal-backdrop:not([hidden]){padding:calc(8px + env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) calc(60px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}
.touch-controls #modal-backdrop:not([hidden]) #modal{width:min(780px,100%);max-height:calc(100dvh - 80px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:26px 20px;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch}
.touch-controls #modal .close{right:6px;top:5px;width:44px;height:44px;z-index:3}
.touch-controls #modal button{min-height:44px}
.touch-controls #modal input,.touch-controls #modal select{font-size:16px}
.touch-controls #modal h2{font-size:32px;padding-right:26px}
@media(max-width:600px){
 header,body:not(.playing) #header{padding:10px 14px;height:72px;padding-top:env(safe-area-inset-top)}
 .wordmark{font-size:18px;letter-spacing:1px;padding-left:26px}.brand-icon{font-size:26px}.wordmark small{font-size:6px}.wallet{display:none}nav{gap:14px}.nav{font-size:12px;min-height:44px}
 .hall-title{top:80px;left:18px}.hall-title h1{font-size:24px}.hall-title .eyebrow{display:none}
 .touch-controls .hall-title p{font-size:11px}
 .touch-controls .player-hud{left:12px;top:calc(12px + env(safe-area-inset-top));gap:8px}.touch-controls .hud-class{display:none}.touch-controls .health-wrap{width:145px}.touch-controls .health-heading{font-size:10px}.touch-controls .hud-weapon{font-size:9px}
 .touch-controls .pause-button{right:12px;top:calc(12px + env(safe-area-inset-top));min-width:44px;min-height:44px;padding:8px}.touch-controls .pause-button span{display:none}
 .touch-controls .inventory-button{right:65px;top:calc(12px + env(safe-area-inset-top));min-height:44px;padding:8px}
 .touch-controls .settings-button{right:12px;top:calc(64px + env(safe-area-inset-top));min-height:44px;padding:8px}
 .touch-controls .objective{top:calc(78px + env(safe-area-inset-top));left:12px;transform:none;min-width:0;width:calc(100% - 100px);text-align:left}.touch-controls .objective h3{font-size:19px;margin:6px 0}.touch-controls .objective .eyebrow{font-size:7px;letter-spacing:1px}.touch-controls #enemy-count{font-size:10px}
 .touch-controls #boss-hud{top:160px;left:12px;transform:none;width:calc(100% - 100px);font-size:8px}
 .touch-controls #touch-stick{width:104px;height:104px;left:12px;bottom:calc(45px + env(safe-area-inset-bottom))}
 .touch-controls #touch-knob{width:42px;height:42px}
 .touch-controls #hud .ability-bar,.touch-controls.playing.ninja-playing #hud .ability-bar{width:min(216px,calc(100vw - 140px));right:10px}
 .touch-controls .touch-main-actions{right:10px}
 .touch-controls #interact{left:12px;max-width:125px;bottom:calc(205px + env(safe-area-inset-bottom));font-size:10px}
 .inventory-grid,.calling-grid,.guide-grid{grid-template-columns:1fr}.calling-card{padding:14px}.calling-card>span{float:right}.calling-card h3{margin:0 0 8px}.calling-card small{margin:10px 0}.item-card{padding:14px}.result-stats{gap:15px;flex-wrap:wrap}
 .touch-controls #modal .reward-art{width:130px;height:130px}.touch-controls #modal .reward-art .weapon-icon{height:110px;width:70px}
}
@media(max-height:500px) and (min-width:601px){
 .touch-controls .player-hud{top:10px;left:max(14px,env(safe-area-inset-left))}.touch-controls .hud-class{display:none}.touch-controls .health-wrap{width:145px}.touch-controls .objective{top:12px;min-width:0;width:40%}.touch-controls .objective h3{font-size:20px;margin:5px 0}.touch-controls .objective .eyebrow{font-size:7px;letter-spacing:1px}.touch-controls #enemy-count{font-size:9px}
 .touch-controls .pause-button{top:10px;right:max(12px,env(safe-area-inset-right));min-height:44px}.touch-controls .inventory-button{top:10px;right:95px;min-height:44px}.touch-controls .settings-button{top:60px;right:max(12px,env(safe-area-inset-right));min-height:44px}
 .touch-controls #boss-hud{top:80px;width:220px;font-size:8px}.touch-controls .route-panel{left:max(14px,env(safe-area-inset-left));right:auto;top:75px;width:58px}.touch-controls .route-panel #dungeon-map{height:62px}
 .touch-controls .camera-tools,.touch-controls.playing.ninja-playing .camera-tools{right:190px;bottom:auto;top:75px}
 .touch-controls .hall-title{top:70px}.touch-controls .hall-title h1{font-size:22px}.touch-controls .hall-title .eyebrow,.touch-controls .hall-character{display:none}
 .touch-controls .hall-interact{bottom:30px}.touch-controls #interact{left:170px;bottom:30px;max-width:calc(100% - 430px)}
 .touch-controls #touch-stick{bottom:24px}.touch-controls .touch-help{left:42%;bottom:8px;font-size:8px}.touch-controls #toast-area{top:95px;left:30%;width:240px}
}

/* Suppress browser double-tap zoom without disabling accessibility pinch zoom
   in menus. The canvas handles its own pinch camera gesture. */
html,body,#app{touch-action:manipulation}
.touch-controls #hud,.touch-controls #touch-pad{touch-action:none}
.account-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 18px}
.account-options button{min-height:48px;padding:12px;border:1px solid #a99c7366;border-radius:6px;font-size:14px;background:#14231e;color:#e5ddc9}
.account-options button[aria-pressed="true"]{background:#c7b182;color:#19231c;border-color:#e3cd9e;font-weight:700}
#modal[data-panel="account"]{width:min(540px,92vw)}
#modal[data-panel="account"] .account-fields{margin:12px 0;gap:12px}
#account-submit{width:100%;justify-content:center;min-height:48px}
