@media(max-width:560px){
  .hand{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:start;
    justify-content:stretch;
    gap:7px;
    min-height:0;
    margin:16px 0 12px;
    padding:4px 0 8px;
    overflow:visible;
    scroll-snap-type:none;
  }
  .hand .card,
  .hand .card:first-child,
  .hand .card:nth-child(n){
    width:auto;
    min-width:0;
    max-width:none;
    flex:none;
    margin:0;
    transform:none;
    scroll-snap-align:none;
    border-width:2px;
    border-radius:8px;
  }
  .hand .card:hover{transform:none}
  .hand .card.selected{transform:translateY(-4px);z-index:4}
  .hand .liveRule{left:4%;right:4%;bottom:2.5%;min-height:20%;padding:3px 4px;border-width:2px;border-radius:4px}
  .hand .liveRule strong{font-size:.48rem;line-height:1.02}
  .hand .liveRule span{font-size:.43rem;line-height:1.08}
  .hand .order{width:25px;height:25px;right:4px;top:4px;font-size:.78rem;border-width:1px}
}
@media(max-width:365px){
  .hand{gap:5px}
  .hand .liveRule strong{font-size:.44rem}
  .hand .liveRule span{font-size:.39rem}
}