@media (max-width: 640px) {
  #app {
    padding: 5px;
    gap: 6px;
  }

  .seat[data-seat="south"] {
    --cw: 50px;
    --ch: 71px;
  }

  .table-zone {
    --cw: 44px;
    --ch: 63px;
  }

  #board.mode-2p .seat[data-seat="north"] {
    --cw: 40px;
    --ch: 57px;
  }

  #board.mode-4p .seat[data-seat="north"] {
    --cw: 34px;
    --ch: 49px;
  }

  #board.mode-4p .seat[data-seat="west"],
  #board.mode-4p .seat[data-seat="east"] {
    --cw: 28px;
    --ch: 41px;
  }

  .team-score .tval {
    font-size: 1.2rem;
  }

  .mini {
    width: 16px;
    height: 23px;
    font-size: 7px;
  }

  .chkobba-flash {
    font-size: 2.2rem;
  }

  .hayya-flash {
    font-size: 1.8rem;
  }

  .modal {
    padding: 20px;
  }

  #action-bar {
    bottom: max(14px, env(safe-area-inset-bottom));
  }
}