/* Twelve equally sized entries, with legible names for alternate outfits. */
.roster{--roster-columns:6;grid-template-columns:repeat(var(--roster-columns),minmax(0,1fr));gap:13px 10px}
.character-card.variant .card-details strong{font-family:"Helvetica Neue","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;font-style:normal;font-size:clamp(10px,.97vw,16px);font-weight:700;letter-spacing:.2px;white-space:nowrap}
.character-card.variant .card-details small{font-size:8px;letter-spacing:1px;color:#c3d4e9}
.character-card.variant .card-details{left:6px;right:4px;bottom:11px}
@media(min-width:761px) and (max-width:1100px){.roster{gap:10px 7px}.character-card.variant .card-details{left:4px;right:2px}.character-card.variant .card-details strong{font-size:10px;letter-spacing:0}.character-card.variant .card-details small{font-size:7px;letter-spacing:.5px}.card-details strong{font-size:14px}.card-details small{font-size:8px;letter-spacing:0}}
@media(max-width:760px),(max-height:520px) and (pointer:coarse){
  .shell .roster{--roster-columns:4;grid-template-columns:repeat(var(--roster-columns),minmax(0,1fr));gap:7px 9px;padding:0 5px}
  .shell .character-card{height:clamp(54px,8.4dvh,80px);min-height:54px;max-height:80px}
  .shell .card-details strong{font-size:13px}.shell .character-card.variant .card-details strong{font-size:11px;letter-spacing:0}.shell .character-card.variant .card-details{bottom:6px;left:5px;right:3px}.shell .character-card.variant .card-details small{display:none}
  .card-no{font-size:8px}.card-marker{font-size:14px}.character-card.player-one-picked:before{bottom:23px;font-size:12px}
}
@media(max-width:760px) and (max-height:710px){.shell .character-card{height:54px;min-height:54px}.shell .roster{gap:6px 8px}.shell .card-details strong{font-size:11px}.shell .character-card.variant .card-details strong{font-size:10px}.card-marker{font-size:12px;top:3px}.card-no{top:5px}.card-details{bottom:5px}}
@media(max-width:760px) and (max-height:620px){.shell{min-height:562px}.shell .character-card{height:44px;min-height:44px}.shell .roster{gap:5px 8px}.shell .card-details strong{font-size:10px}.shell .character-card.variant .card-details strong{font-size:9px}.shell .character-card.variant .card-details{bottom:4px}.card-corner{width:17px;height:17px}.card-marker{font-size:11px;top:2px}.card-no{font-size:7px;top:4px}.character-card.player-one-picked:before{font-size:10px;bottom:19px}}
@media(orientation:landscape) and (min-width:700px) and (max-height:520px) and (pointer:coarse){.shell .roster{--roster-columns:6;gap:7px 6px}.shell .character-card{height:60px;min-height:52px}.shell .character-card.variant .card-details strong{font-size:9px}.shell .card-details strong{font-size:11px}.card-marker{font-size:12px}}