/* Phone controls occupy separate bands; menus remain scrollable at any height. */
:root{--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
#game-shell{height:100vh;height:100dvh}
.overlay{padding:max(12px,var(--safe-top)) max(12px,var(--safe-right)) max(12px,var(--safe-bottom)) max(12px,var(--safe-left));touch-action:pan-y}
.overlay>.panel{max-height:100%;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;scroll-padding-block:16px;-webkit-overflow-scrolling:touch}
.lobby{padding-top:max(16px,var(--safe-top));padding-right:max(18px,var(--safe-right));padding-bottom:max(12px,var(--safe-bottom));padding-left:max(18px,var(--safe-left));overflow-y:auto;touch-action:pan-y;overscroll-behavior:contain}
.lobby>*{flex-shrink:0}.lobby-content{flex-shrink:1}
.touch-copy{display:none}
@media(pointer:coarse){
 .keyboard-copy{display:none!important}.touch-copy{display:inline}
 button,.text-btn{min-height:48px}.icon-btn{min-width:48px;min-height:48px}
 .volume-control input{min-height:44px}.card-shortcut{display:none}
 .journey-hud button{min-height:48px}.panel-note,.setting-help{font-size:13px}
 button:hover,.card:hover{transform:none}
}
@media(max-width:600px){
 .hud{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto;justify-content:stretch;padding:max(12px,var(--safe-top)) max(12px,var(--safe-right)) max(12px,var(--safe-bottom)) max(12px,var(--safe-left))}
 .hud-top{grid-row:1;display:grid;grid-template-columns:minmax(112px,1fr) minmax(94px,auto) 48px;gap:8px}
 .hud .player-status{width:100%;max-width:none;min-width:0;padding:9px 8px}
 .status-label{gap:5px;flex-wrap:wrap}.status-label #level{white-space:nowrap}.status-label #hp-label{margin-left:auto;white-space:nowrap}
 .time-value{font-size:28px;letter-spacing:.02em}.wave-label{font-size:11px;line-height:1.4;max-width:110px}
 .hud-right{gap:5px}.kill-count{font-size:11px;white-space:nowrap}.hud .icon-btn{width:48px;height:48px}
 .quest-strip{position:static;grid-row:2;margin-top:8px;width:max-content;max-width:100%;gap:6px;padding:5px 7px;font-size:11px}
 .quest-strip small{font-size:10px}.quest-strip .game-icon{width:17px;height:17px}
 .combat-actions{right:max(18px,var(--safe-right));bottom:calc(max(12px,var(--safe-bottom)) + 52px);gap:12px;align-items:flex-end}
 .combat-actions .dash-btn{width:64px;height:64px;min-height:64px}.ultimate-btn{width:82px;height:86px;min-height:86px;border-radius:18px}
 .ultimate-btn b{font-size:13px}.ultimate-btn small,.dash-btn small{font-size:12px}
 .journey-hud{left:max(12px,var(--safe-left));bottom:calc(max(12px,var(--safe-bottom)) + 158px);width:calc(100% - 142px);max-width:250px;padding:8px 10px}
 .journey-hud-title{font-size:13px;gap:6px}.journey-hud p{font-size:12px;line-height:1.45}.journey-hud button{font-size:14px;margin-top:7px;padding:8px}
 .hud-bottom{grid-row:5;gap:6px}.equipment{max-width:100%;flex-wrap:wrap;gap:3px}.equipment .slot{width:27px;height:30px;font-size:17px}.equipment .slot>.game-icon{width:23px;height:23px}.equipment .slot small{font-size:9px;right:2px}
 .hud-bottom .biome-label{display:none}
 .ultimate-notice{top:calc(max(12px,var(--safe-top)) + 165px);max-width:calc(100% - 28px);white-space:normal;font-size:13px}
 .encounter-banner{top:calc(max(12px,var(--safe-top)) + 148px);max-width:calc(100% - 28px);min-width:0;width:max-content}
 .game-tip{left:max(12px,var(--safe-left));bottom:calc(max(12px,var(--safe-bottom)) + 54px);width:calc(100% - 208px);min-width:96px;max-width:170px;font-size:12px;padding:8px;transform:none}
 .lobby-content{min-height:285px}.lobby-nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.lobby-nav button{padding:9px 3px;min-width:0;min-height:80px}.lobby-nav button b{font-size:12px}.lobby-nav button small{font-size:10px}
 .lobby-play .text-btn{min-height:44px}.lobby-play .journey-summary small.lobby-carry{display:block;max-width:100%;width:100%;font-size:11px!important}
 .lobby-footer{margin-top:8px}.lobby-footer>span:first-child{display:none}
 .codex-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.codex-tabs .btn-secondary{min-width:0;padding:10px 4px;font-size:12px}
 .cards{grid-template-columns:1fr;gap:9px}.cards .card{min-height:112px;padding:14px 14px 14px 72px}.cards .card-icon{position:absolute;left:14px;top:18px;width:44px;height:52px}.cards .card-name{font-size:16px;margin:6px 0}.cards .card-desc{display:block;font-size:13px;line-height:1.5;margin:0 0 9px}.cards .card-level{font-size:12px}
 .panel{padding:20px 14px}.panel-head{margin-bottom:16px}.panel h2{font-size:23px}.panel-buttons{margin-top:18px}
 .roster-detail .ultimate-detail{grid-column:1/-1}.settings-row{gap:10px}.difficulty{flex-wrap:wrap;justify-content:flex-end}
}
@media(max-width:360px){
 .hud-top{grid-template-columns:minmax(104px,1fr) 94px 48px;gap:6px}.hud .status-label{font-size:10px}.time-value{font-size:26px}
 .lobby{padding-inline:max(12px,var(--safe-left)) max(12px,var(--safe-right))}.lobby-nav button b{font-size:11px}.roster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .quest-strip{gap:4px;font-size:10px}.quest-strip .game-icon{width:15px;height:15px}
 .carry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.book-cards{grid-template-columns:1fr}
}
@media(max-height:650px) and (max-width:600px){
 .lobby-content{min-height:240px}.hero-stage>canvas{height:108px}.lobby-intro h1{font-size:28px}.lobby-nav button{min-height:54px}.lobby-nav button>span{display:none}
 .lobby-play{margin-top:7px;padding:9px;gap:6px}.journey-summary b{font-size:12px}.lobby-footer{font-size:10px}
 .journey-hud p{font-size:11px}.journey-hud{padding:7px 8px}.encounter-banner{padding:8px 16px}
}
@media(max-height:500px) and (min-width:601px){
 .hud{padding:max(10px,var(--safe-top)) max(16px,var(--safe-right)) max(10px,var(--safe-bottom)) max(16px,var(--safe-left))}
 .combat-actions{right:calc(max(16px,var(--safe-right)) + 112px);bottom:calc(max(10px,var(--safe-bottom)) + 10px)}
 .combat-actions .dash-btn{width:60px;height:60px}.ultimate-btn{width:72px;height:76px}
 .journey-hud{left:max(16px,var(--safe-left));bottom:calc(max(10px,var(--safe-bottom)) + 48px);max-width:210px;width:27vw;padding:7px 9px}.journey-hud p{font-size:12px}.journey-hud button{min-height:44px}
 .equipment{max-width:44%;flex-wrap:wrap;gap:3px}.equipment .slot{width:28px;height:30px}.equipment .slot>.game-icon{width:24px;height:24px}.biome-label{display:none}
 .quest-strip{top:calc(max(10px,var(--safe-top)) + 72px)}
 .ultimate-notice{top:120px}.game-tip{bottom:95px;max-width:230px;font-size:12px}.lobby-nav button{min-height:54px}
}
.tutorial-panel{width:min(440px,100%);text-align:center;padding:28px 24px}
.tutorial-heading{display:flex;justify-content:space-between;align-items:center;color:var(--gold);font-size:13px}
.tutorial-progress{display:flex;gap:7px;margin:15px 0 20px}.tutorial-progress i{height:3px;flex:1;background:#504455}.tutorial-progress i.done{background:var(--gold)}
.tutorial-art{height:112px;display:grid;place-items:center;margin:8px 0 20px;background:radial-gradient(ellipse,#d6b97615,transparent 68%)}.tutorial-art .game-icon{width:96px;height:104px}
.tutorial-panel h2{font-size:24px;line-height:1.4;letter-spacing:0;margin:8px 0 16px}.tutorial-lead{font-size:17px;line-height:1.65;color:#f0dfbd;word-break:keep-all}.tutorial-panel .subtext{font-size:14px;min-height:74px;word-break:keep-all}
.tutorial-control{display:flex;flex-direction:column;gap:9px;border:1px solid #c2a16b40;background:#dac29a08;padding:14px;font-size:14px}.tutorial-control small{font-size:12px;color:var(--muted)}
.tutorial-panel .btn-primary{width:100%;min-width:0;min-height:52px;padding:14px;font-size:15px;letter-spacing:0}.tutorial-panel .text-btn{min-height:44px}.tutorial-panel .panel-note{font-size:12px;margin-top:12px}
@media(max-height:640px){.tutorial-panel{padding:18px}.tutorial-art{height:68px;margin:5px 0 10px}.tutorial-art .game-icon{width:64px;height:64px}.tutorial-progress{margin:12px 0}.tutorial-panel h2{font-size:22px}.tutorial-lead{font-size:15px}.tutorial-panel .subtext{min-height:0;font-size:13px}.tutorial-control{padding:10px}.tutorial-panel .panel-buttons{gap:5px;margin-top:14px}}
