/* One responsive scale for every physical card; retain the printed playmat positions. */
.battle-page{--card-width:clamp(58px,calc((100dvh - 410px)/10),116px);--hand-width:calc(var(--card-width)*1.12)}
.battle-page.tutorial-page{--card-width:clamp(58px,calc((100dvh - 320px)/10),122px)}
.battle-page .battle-layout{grid-template-columns:minmax(0,1fr) clamp(270px,20vw,370px);min-height:calc(100dvh - 44px)}
.battle-page .arena{align-self:stretch;padding:8px 12px 0;display:flex;flex-direction:column}
.battle-page .playmat{flex-shrink:0;gap:3px 8px;padding:4px 8px;grid-template-columns:minmax(95px,.85fr) .08fr 1fr 1fr 1fr .08fr minmax(95px,.85fr)}
.battle-page .field-zone>small,.battle-page .field-temple-count{font-size:10px;height:14px;line-height:14px}
.battle-page .field-temple-count b{font-size:16px}.battle-page .field-temple-count img{width:15px;height:15px}.battle-page .field-temple-count .auto-label{font-size:9px}
.battle-page .duelist{min-height:34px}.battle-page .duelist h3{font-size:15px}.battle-page .duelist small{font-size:10px}.battle-page .duelist-portrait{width:34px;height:34px}
.battle-page .stats{gap:18px}.battle-page .stat{font-size:22px}.battle-page .stat img{width:19px;height:19px}.battle-page .stat small{font-size:10px}.battle-page .hp b{font-size:28px}
.battle-page .grave-pile{min-height:36px;font-size:12px;padding:5px 8px}.battle-page .grave-label,.battle-page .field-grave-title{font-size:11px}.battle-page .grave-pile>b{font-size:17px}.battle-page .grave-art{width:29px;flex-basis:29px;height:23px}.battle-page .grave-art img{width:18px;height:26px}
.battle-page .field-resource-title{font-size:12px}.battle-page .field-resource-title small{font-size:10px}.battle-page .field-resource-title span{font-size:17px}.battle-page .field-pile>small{font-size:11px}.battle-page .field-pile>b{font-size:28px}
.battle-page .evolution-caption,.battle-page .evolution-state{font-size:11px}.battle-page .evolution-ring{width:51px}.battle-page .evolution-ring b{font-size:20px;line-height:51px}.battle-page .evolution-ring em{font-size:10px}.battle-page .field-evolution{padding:9px 4px}
.battle-page .hand{flex:1;min-height:calc(var(--hand-width)*1.397 + 32px);padding:25px 16px 7px;align-items:flex-end}
.battle-page .hand-card{width:var(--hand-width);flex-basis:var(--hand-width);margin-left:-9px}.battle-page .hand-card:first-child{margin-left:0}
.battle-page .battle-notice{font-size:10px;padding:4px}.battle-page .battle-top{min-height:44px;font-size:13px}.battle-page .battle-top button{font-size:12px;padding:7px 10px}
.battle-page .tutorial-action-note{font-size:11px;padding:5px}.battle-page .battle-sidebar.right{max-height:calc(100dvh - 44px)}
.battle-page .battle-card-info .detail-art{max-width:260px}.battle-page .battle-card-info p{font-size:13px!important}.battle-page .tutorial-coach p{font-size:14px!important}
@media(max-width:1100px){
 .battle-page .battle-layout{grid-template-columns:minmax(0,1fr) 260px}
 .battle-page .playmat{grid-template-columns:minmax(78px,.85fr) 0 1fr 1fr 1fr 0 minmax(78px,.85fr);gap:3px 5px;padding:4px}
 .battle-page .stats{gap:9px}.battle-page .stat{font-size:18px}.battle-page .duelist h3{font-size:14px}.battle-page .duelist-portrait{width:28px;height:28px}
 .battle-page .field-zone>small,.battle-page .field-temple-count{font-size:9px}.battle-page .grave-label{font-size:10px}.battle-page .grave-art{display:none}.battle-page .evolution-ring{width:39px}.battle-page .evolution-ring b{font-size:17px;line-height:39px}.battle-page .evolution-caption,.battle-page .evolution-state{font-size:9px}
}
@media(max-width:780px){
 .battle-page,.battle-page.tutorial-page{--card-width:clamp(48px,10vw,66px);--hand-width:calc(var(--card-width)*1.15)}
 .battle-page .battle-layout{display:flex}.battle-page .arena{padding-inline:5px}
 .battle-page .playmat{grid-template-columns:minmax(54px,.8fr) 0 1fr 1fr 1fr 0 minmax(54px,.8fr);gap:3px 2px}
 .battle-page .field-zone>small,.battle-page .field-temple-count{font-size:8px;height:16px;line-height:16px}.battle-page .field-temple-count .auto-label{display:none}
 .battle-page .grave-label{font-size:9px}.battle-page .grave-pile{padding:4px;min-height:30px;flex-wrap:nowrap}.battle-page .grave-label{order:0;flex:1;white-space:normal}.battle-page .grave-pile>b{font-size:14px}.battle-page .field-resource-title{font-size:10px}.battle-page .field-resource-title small{font-size:8px}
 .battle-page .evolution-ring{width:30px}.battle-page .evolution-ring b{font-size:13px;line-height:30px}.battle-page .evolution-ring em{font-size:8px}.battle-page .evolution-caption,.battle-page .evolution-state{font-size:8px}
 .battle-page .duelist{gap:6px}.battle-page .duelist h3{font-size:12px}.battle-page .duelist small{font-size:8px}.battle-page .stat{font-size:16px}.battle-page .stat small{display:none}.battle-page .stats{gap:7px}.battle-page .duelist-portrait{display:none}.battle-page .stat img{width:14px;height:14px}.battle-page .hp{margin-left:4px}.battle-page .hp b{font-size:23px}
 .battle-page .phase-rail>span{font-size:11px}.battle-page .phase-rail .current{font-size:15px}.battle-page .battle-top button{font-size:11px}
}
/* Short landscape screens keep legible cards and scroll vertically rather than miniaturising. */
@media(min-width:781px) and (max-height:550px){.battle-page,.battle-page.tutorial-page{--card-width:62px}.battle-page .battle-layout{grid-template-columns:minmax(0,1fr) 250px}.battle-page .battle-sidebar.right{position:sticky}}

@media(min-width:781px){.battle-page .phase-rail{padding:7px 6px;margin-top:6px}.battle-page .phase-rail .current{padding:4px 8px}.battle-page .stage-draw b{font-size:16px}.battle-page .stage-draw small{font-size:9px}.battle-page .hand{padding-top:22px;min-height:calc(var(--hand-width)*1.397 + 29px)}}