/* Compact match setup: the character and map stay in focus, even in a narrow lobby. */
#menu #brTeamSizeOption,
#menu #brTeamFillOption{
  display:grid;
  grid-template-columns:minmax(66px,34%) minmax(0,1fr);
  align-items:center;
  gap:10px;
  margin-top:8px;
  font-size:9px;
  letter-spacing:.05em;
  color:#d6f4ff;
}
#menu #brTeamSizeOption[hidden],#menu #brTeamFillOption[hidden]{display:none!important}
#menu #brTeamSizeOption select,
#menu #brTeamFillOption select{
  min-width:0;
  min-height:36px;
  margin:0;
  padding:7px 9px;
  font-size:11px;
  letter-spacing:.02em;
  border:1px solid #8ec6d156;
  border-radius:5px;
  background:#173e52be;
  color:#f3fdff;
}

/* No redundant empty invite placeholders before a party is created. */
#menu .party-lobby{
  margin:9px 0 5px;
  padding:9px 10px;
  border:1px solid #9acdda40;
  border-radius:6px;
  background:#0b2a3d99;
  box-shadow:none;
}
#menu .party-lobby[hidden]{display:none!important}
#menu .party-lobby:not(.is-active){
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
}
#menu .party-lobby-heading{gap:7px;justify-content:flex-start;font-size:9px;letter-spacing:.7px}
#menu .party-lobby-heading span{font-size:9px;white-space:nowrap;color:#91d9cb}
#menu .party-lobby:not(.is-active) .party-member-list,
#menu .party-lobby:not(.is-active) #partyHint{display:none}
#menu .party-lobby-actions{margin-top:8px;gap:5px}
#menu .party-lobby:not(.is-active) .party-lobby-actions{margin:0}
#menu .party-lobby-actions button{
  min-height:29px;
  padding:5px 9px;
  border-radius:4px;
  background:#2d7183;
  font-size:8px;
  white-space:nowrap;
  letter-spacing:.25px;
}
#menu .party-member-list{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:8px;
}
#menu .party-member{
  flex:1 1 55px;
  min-width:0;
  min-height:36px;
  gap:3px;
  padding:5px 4px;
  border-radius:4px;
}
#menu .party-member strong{font-size:8px}
#menu .party-member small{font-size:7px}
#menu #partyHint{margin:7px 0 0;font-size:8px;line-height:1.3}

/* Multiplayer is a secondary action; Play remains the primary action. */
#menu .private-room-panel{margin:9px 0 5px}
#menu .private-room-panel .private-room-heading{
  min-height:37px;
  padding:8px 11px;
  border:1px solid #42c8ef;
  border-radius:5px;
  background:#21b9ed;
  box-shadow:none;
  font-size:15px;
  font-style:normal;
  font-weight:900;
  letter-spacing:.04em;
  -webkit-text-stroke:0;
}
#menu .private-room-panel[open] .private-room-heading{margin-bottom:11px}
#menu #deploy.match-play-button{
  min-height:49px;
  margin-top:9px;
  padding:9px 14px;
  border-radius:5px;
  font-size:24px;
  -webkit-text-stroke:0;
  box-shadow:3px 4px 0 #0b35894d;
}
@media(max-width:760px){
  #menu .party-lobby{padding:8px 9px}
  #menu .party-lobby-heading{font-size:9px}
  #menu .party-member{min-height:35px}
  #menu .party-lobby-actions button{min-height:29px}
  #menu .private-room-panel .private-room-heading{min-height:36px;font-size:14px;padding:7px 11px}
  #menu #deploy.match-play-button{min-height:47px;font-size:23px}
}
@media(max-height:600px) and (orientation:landscape){
  #menu .party-lobby{margin:5px 0;padding:6px 8px}
  #menu .private-room-panel{margin:6px 0 4px}
  #menu .private-room-panel .private-room-heading{min-height:32px;padding:6px 10px}
  #menu #deploy.match-play-button{min-height:39px;margin-top:6px;font-size:21px}
}