@media (min-width:1200px) {
  /* The suit selector belongs to the local winning bidder only. Position it in
     the open left side of the felt, away from the opponent cards. */
  #pepper-app > div > .row.mb-4.g-0 > .col-md-5:first-child .winning-bidder-suit-picker {
    position:absolute !important;
    z-index:90 !important;
    left:120px !important;
    right:auto !important;
    top:90px !important;
    bottom:auto !important;
    width:142px !important;
    margin:0 !important;
    padding:8px !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:12px !important;
    background:rgba(8,24,19,.82) !important;
    box-shadow:0 10px 24px rgba(0,0,0,.24) !important;
  }

  #pepper-app > div > .row.mb-4.g-0 > .col-md-5:first-child .winning-bidder-suit-picker .btn-group-vertical {
    width:100% !important;
  }

  #pepper-app > div > .row.mb-4.g-0 > .col-md-5:first-child .winning-bidder-suit-picker .btn {
    width:100% !important;
    min-width:0 !important;
    min-height:34px !important;
    height:34px !important;
    padding:5px 8px !important;
    font-size:13px !important;
    line-height:1 !important;
  }

  /* Opponent components must never display a suit selector, even if stale
     client state briefly exists while room state is synchronizing. */
  #pepper-app > div > .row.g-0:has(> [id^="el_"]) .suit-picker {
    display:none !important;
  }
}
