/* Loaded last: touch layouts only, keeping combat coordinates and desktop unchanged. */
.map-jump{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:#d7c493;font-size:12px}
.map-jump select{min-width:0;max-width:100%;flex:1}
.map-touch-hint{display:none}
.arena-expand{font:inherit;white-space:nowrap}
.stage:fullscreen,.stage.mobile-expanded{background:#102721;overflow:auto;border-radius:0}
.stage:fullscreen canvas,.stage.mobile-expanded canvas{max-height:65dvh;object-fit:contain}
.stage.mobile-expanded{position:fixed;inset:0;z-index:1000;height:100dvh;width:100%;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
body.arena-expanded{overflow:hidden}
@media(max-width:850px){
 .game-lobby .shell{display:block;min-height:100dvh;padding-bottom:calc(82px + env(safe-area-inset-bottom))}
 .game-lobby .sidebar{position:fixed;inset:auto 0 0;z-index:50;height:auto;display:flex;flex-direction:row;gap:4px;padding:6px max(8px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));overflow-x:auto;overscroll-behavior-x:contain;border:0;border-top:1px solid #b9985b88;background:#102522f5;box-shadow:0 -8px 24px #0006;scrollbar-width:none}
 .game-lobby .sidebar .brand,.game-lobby .sidebar .nav-caption,.game-lobby .sidebar .sidebar-bottom{display:none}
 .game-lobby .sidebar nav,.game-lobby .sidebar .future{display:contents}
 .game-lobby .sidebar .nav-item{display:flex;flex-direction:column;justify-content:center;flex:0 0 76px;width:76px;min-height:60px;gap:4px;padding:5px 3px;font-size:10px;line-height:1.4;text-align:center;white-space:nowrap}
 .game-lobby .sidebar .nav-item>span{width:auto;font-size:20px;line-height:24px}
 .game-lobby .sidebar .nav-item small{display:none}
 .game-lobby .topbar{margin:0 14px;padding:16px 0;gap:8px;flex-wrap:wrap}
 .game-lobby .topbar .eyebrow{font-size:8px;letter-spacing:1.5px}
 .game-lobby .topbar h1{font-size:21px}
 .game-lobby .top-actions{gap:8px;margin-left:auto}
 .game-lobby .resource-bar{gap:5px}
 .game-lobby .resource-pill{min-width:62px;padding:6px}
 .game-lobby .profile{min-width:44px;min-height:44px}
 .game-lobby .profile>div,.game-lobby .world-count{display:none}
 .game-lobby #main{padding:16px 14px 24px}
 .game-lobby .page-heading{display:flex;flex-direction:column;align-items:stretch;gap:12px;margin:16px 0 20px}
 .game-lobby .page-heading h2{font-size:24px;line-height:1.5;margin:8px 0}
 .game-lobby .page-heading .gold-button{align-self:flex-start}
 .game-lobby button:not(.collection-card):not(.atlas-node),.game-lobby .lobby-utilities a,.battle-page button,.battle-page header a{min-height:44px;touch-action:manipulation}
 .game-lobby input,.game-lobby select,.battle-page input:not([type=range]):not([type=checkbox]),.battle-page select{font-size:16px;min-height:44px;max-width:100%;min-width:0}
 .game-lobby .filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
 .game-lobby .filters input{grid-column:1/-1;width:100%;font-size:16px;min-height:44px}
 .game-lobby .filters select{width:100%;padding:10px 8px;font-size:16px;min-height:44px}
 .game-lobby .hero-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
 .game-lobby .collection-caption strong{font-size:14px;line-height:1.25}
 .game-lobby .collection-caption small{font-size:10px;line-height:1.3}
 .game-lobby .collection-note{font-size:10px;line-height:1.6;padding:5px 0;min-height:26px}
 .game-lobby .collection-summary{font-size:12px;line-height:1.8}
 .game-lobby .world-layout{display:flex;flex-direction:column;gap:16px}
 .game-lobby .world-scroll{min-height:300px;max-height:55dvh;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
 .game-lobby .atlas-toolbar{gap:12px;font-size:11px;margin:0 0 12px}
 .game-lobby .atlas-toolbar>div{gap:6px}
 .game-lobby .atlas-toolbar button{font-size:11px;padding:8px 10px}
 .game-lobby .atlas-toolbar button[data-zoom]{min-width:44px;font-size:20px}
 .game-lobby .map-jump{display:block;font-size:12px}
 .game-lobby .map-jump select{display:block;width:100%;margin-top:8px}
 .game-lobby .map-touch-hint{display:block;font-size:11px;color:#a7b5aa;line-height:1.6}
 .game-lobby .map-detail{width:100%;padding:18px;min-width:0}
 .game-lobby .map-detail .stage-grid,.game-lobby .journey-panel .stage-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
 .game-lobby .map-detail .enemy-wave{max-height:180px}
 .game-lobby #forge-detail{padding:18px 14px;border-width:6px}
 .game-lobby #forge-detail .hero-detail-layout{grid-template-columns:1fr;gap:20px}
 .game-lobby #forge-detail .detail-card{width:min(230px,100%);margin:auto}
 .game-lobby #forge-hero{width:100%;min-width:0}
 .game-lobby .upgrade-panel{margin-top:16px}
 .game-lobby .upgrade-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .game-lobby .upgrade-actions button{font-size:12px;padding:10px 6px;min-width:0}
 .game-lobby .star-transfer .upgrade-actions{grid-template-columns:1fr}
 .game-lobby dialog,.battle-page #result-dialog{width:calc(100% - 20px);max-width:620px;max-height:calc(100dvh - 24px);padding:18px;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
 .game-lobby .dialog-close,.battle-page .result-close{position:sticky;float:right;top:0;min-width:44px;min-height:44px;margin:0 0 0 6px;background:#102721;z-index:10}
 .game-lobby .hero-detail-layout{grid-template-columns:1fr;gap:18px}
 .game-lobby #hero-detail .detail-card{width:min(220px,100%);margin:auto}
 .game-lobby .hero-detail-layout h2{font-size:26px;overflow-wrap:anywhere}
 .game-lobby .hero-detail-layout p{font-size:13px;line-height:1.8}
 .game-lobby .card-wallet{font-size:13px}
 .game-lobby footer{margin:0 14px;padding:18px 0;display:block;line-height:2}
 .game-lobby #toast{bottom:calc(90px + env(safe-area-inset-bottom));max-width:calc(100vw - 28px);font-size:13px}
 .battle-page header{padding:8px 14px;gap:12px;flex-wrap:wrap}
 .battle-page header a{display:inline-flex;align-items:center;font-size:12px}
 .battle-page>main{padding:12px max(8px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}
 .battle-page .heading h1{font-size:24px;margin:4px 0}
 .battle-page .heading .eyebrow{margin:8px 0}
 .battle-page .heading p:not(.eyebrow){font-size:12px;margin:8px 0;line-height:1.7}
 .battle-page .heading .source{display:none}
 .battle-page .layout,.battle-page .pvp-layout{grid-template-columns:minmax(0,1fr);margin-top:14px;gap:16px}
 .battle-page .stage{min-width:0;border-width:4px}
 .battle-page .stage-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;padding:8px 10px;font-size:11px;align-items:center}
 .battle-page .stage-top strong{grid-column:1/-1;white-space:normal;line-height:1.5}
 .battle-page .stage-top>span{margin:0}
 .battle-page .arena-expand{font-size:11px;padding:8px}
 .battle-page .war-meter{padding:10px 8px 18px}
 .battle-page .war-label{font-size:10px;gap:6px;line-height:1.5}
 .battle-page .war-label>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .battle-page .timed-statuses{overflow-x:auto;flex-wrap:nowrap;min-height:36px;scrollbar-width:thin}
 .battle-page .timed-status{flex-shrink:0}
 .battle-page .toolbar{gap:8px;padding:10px;flex-wrap:wrap}
 .battle-page .toolbar button{flex:1 1 auto;font-size:12px;padding:10px 8px;min-height:44px}
 .battle-page .toolbar #field-count{order:5;width:auto;font-size:10px}
 .battle-page .toolbar #status{order:6;font-size:10px}
 .battle-page .audio-panel{display:grid;grid-template-columns:1fr 1fr;padding:10px;gap:12px}
 .battle-page .audio-panel button{grid-column:1/-1;font-size:12px;min-height:44px}
 .battle-page .audio-panel label{font-size:11px;display:flex;flex-wrap:wrap;gap:4px}
 .battle-page .audio-panel input[type=range]{width:100%;height:28px}
 .battle-page .audio-panel small{font-size:10px;line-height:1.5;width:auto;margin:0}
 .battle-page .flip-panel{padding:14px 10px}
 .battle-page .flip-heading{gap:10px;margin-bottom:12px}
 .battle-page .flip-heading strong{font-size:14px}
 .battle-page .flip-heading small{font-size:11px;line-height:1.5}
 .battle-page #flip{font-size:13px;min-width:125px;padding:12px;gap:12px;min-height:48px}
 .battle-page #draw-cards{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:142px;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;padding:4px 2px 12px;overscroll-behavior-x:contain;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
 .battle-page #draw-cards>.draw-card{scroll-snap-align:start;min-height:213px}
 .battle-page .draw-card strong,.battle-page .draw-caption strong{font-size:13px;line-height:1.4}
 .battle-page .draw-card small,.battle-page .draw-caption small{font-size:10px;line-height:1.5}
 .battle-page .draw-card.draw-effect p{font-size:11px;line-height:1.7;margin:10px}
 .battle-page .effect-symbol{font-size:32px}
 .battle-page .flip-rule{font-size:10px;line-height:1.6}
 .battle-page .queue-panel{padding:12px}
 .battle-page #queue-list{gap:12px;padding-bottom:8px;overscroll-behavior-x:contain}
 .battle-page #queue-list span{font-size:11px}
 .battle-page #result-dialog .reward-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:40dvh}
 .battle-page #result-title{font-size:23px}
 .battle-page #result-dialog .result-actions{bottom:-18px;display:flex;flex-wrap:wrap;gap:8px}
 .battle-page #result-dialog .result-actions button{width:100%}
 .battle-page .pvp-entry{grid-template-columns:1fr;padding:16px;gap:16px}
 .battle-page .pvp-actions{flex-wrap:wrap;gap:10px}
 .battle-page .pvp-actions button{flex:1}
 .battle-page #room-code{width:100%;flex:1 1 100%}
 .battle-page .pvp-layout #draw-cards p{font-size:11px;line-height:1.6;padding:0 8px}
 .battle-page .pvp-layout #draw-cards .collection-caption strong{font-size:13px;line-height:1.3}
 .battle-page .pvp-layout #draw-cards .collection-caption small{font-size:10px;line-height:1.3}
}
@media(max-width:600px){
 .game-lobby .hero-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .game-lobby .home-grid,.game-lobby .home-bottom{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:360px){
 .game-lobby .profile{display:none}
 .game-lobby .topbar h1{font-size:18px}
 .game-lobby .collection-caption strong{font-size:12px}
 .game-lobby .filters{grid-template-columns:1fr}
 .battle-page #draw-cards{grid-auto-columns:132px}
}
@media(max-height:500px) and (orientation:landscape){
 .battle-page .stage:fullscreen canvas,.battle-page .stage.mobile-expanded canvas{max-height:75dvh}
 .battle-page .stage:fullscreen .war-meter,.battle-page .stage.mobile-expanded .war-meter{padding-top:4px;padding-bottom:8px}
}