/* Larger mobile artwork: six roster entries per page and a stacked portrait VS. */
.roster-pager{display:none}

@media(max-width:760px),(max-height:520px) and (pointer:coarse){
  .shell .main{grid-template-rows:minmax(390px,1fr) auto}
  .shell .selector{padding-top:4px;padding-bottom:3px}
  .shell .selector-heading{margin-bottom:6px}.shell .selector h2{font-size:16px}
  .shell .roster{--roster-columns:3;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:7px 9px;min-height:0;padding:0 5px}
  .shell .character-card{height:clamp(62px,8.2dvh,78px);min-height:58px}
  .shell .character-card:not([hidden]){display:block}
  .shell .versus-picks{margin-bottom:6px}
  .roster-pager{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:6px;margin:6px 5px 1px}
  .roster-pager>button,.roster-pager span button{min-width:44px;min-height:44px;border:1px solid #9fb9d94d;background:#091424d9;color:#dcecff;font-size:18px;touch-action:manipulation}
  .roster-pager>button:disabled{opacity:.28}.roster-pager span{display:flex;justify-content:center;gap:6px}.roster-pager span button{font-size:9px;letter-spacing:1px;color:#89a0bc}
  .roster-pager span button[aria-pressed=true]{border-color:var(--accent);color:#fff;background:rgba(var(--rgb),.22);box-shadow:inset 0 -2px var(--accent),0 0 12px rgba(var(--rgb),.35)}
  .shell .roster-caption{padding-top:4px}
  .shell .art-region{left:8%;right:8%}
}

@media(max-width:760px) and (orientation:portrait){
  .vs-screen{--vs-stack-overlap:55%}
  .vs-fighter{left:0;right:0;width:100%;height:var(--vs-stack-overlap);transition:height .34s cubic-bezier(.16,1,.3,1),opacity .24s ease,transform .34s cubic-bezier(.16,1,.3,1),clip-path .34s ease}
  .vs-fighter-left{top:0;bottom:auto;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
  .vs-fighter-right{top:auto;bottom:0;clip-path:polygon(0 12%,100% 0,100% 100%,0 100%)}
  .vs-fighter-art{inset:calc(env(safe-area-inset-top,0px) + 2px) 3% 3%;mask-image:none}
  .vs-fighter-right .vs-fighter-art{inset:3% 3% calc(var(--vs-dock) + env(safe-area-inset-bottom,0px) + 4px)}
  .vs-fighter-art img{object-fit:contain;object-position:center center}
  .vs-nameplate{left:4%;right:52%;bottom:6%;padding:6px 8px}
  .vs-fighter-right .vs-nameplate{left:52%;right:4%;bottom:calc(var(--vs-dock) + env(safe-area-inset-bottom,0px) + 8px)}
  .vs-given{font-size:clamp(24px,7vw,42px)}.vs-japanese{font-size:11px}
  .vs-stage>.vs-arena-left,.vs-stage>.vs-arena-right{left:0;right:0;width:100%;height:var(--vs-stack-overlap);transition:height .34s ease,opacity .24s ease,clip-path .34s ease}
  .vs-stage>.vs-arena-left{top:0;bottom:auto;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
  .vs-stage>.vs-arena-right{top:auto;bottom:0;clip-path:polygon(0 12%,100% 0,100% 100%,0 100%)}
  .vs-seam{top:49%;left:-10%;width:120%;height:2px;transform:rotate(-6deg);transform-origin:center;box-shadow:0 0 8px white,0 -9px 35px var(--left-color),0 9px 35px var(--right-color),0 0 70px #ffffff70}
  .vs-core{top:49%;max-width:38vw}.vs-stage{--impact-y:49%}
  .vs-ring,.vs-spark,.vs-bolt{top:var(--impact-y)}
  .vs-fighter:before{top:8%;font-size:25vw}.vs-fighter-right:before{top:16%}

}

@media(max-width:760px) and (max-height:710px) and (orientation:portrait){
  .shell .main{grid-template-rows:minmax(300px,1fr) auto}.shell .character-card{height:52px;min-height:48px}.roster-pager{margin-top:4px}
}

@media(max-width:760px) and (max-height:620px) and (orientation:portrait){
  .shell .main{grid-template-rows:minmax(270px,1fr) auto}.shell .selector-heading{display:none}.shell .character-card{height:46px;min-height:44px}.roster-pager{margin-top:3px}.shell .roster-caption{display:none}
}

@media(orientation:landscape) and (max-height:520px) and (pointer:coarse){
  .shell .main{grid-template-columns:49% 51%;grid-template-rows:minmax(260px,1fr)}
  .shell .roster{--roster-columns:3;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,52px)}
  .shell .character-card{height:52px;min-height:48px}.roster-pager{margin-top:4px}
}