/* Keep room cards inside their own column as the desktop lobby narrows. */
@media screen and (min-width:1000px) and (max-width:1399px){
 html body #root main.entertainmentLobby .tablesArea.lobbyCenterStage{
  min-width:0!important;overflow-x:hidden!important;overflow-y:auto!important;
 }
 html body #root main.entertainmentLobby .tablesArea .funTableGrid{
  box-sizing:border-box!important;width:100%!important;min-width:0!important;max-width:100%!important;
  grid-template-columns:minmax(0,1fr)!important;gap:8px!important;padding:8px!important;overflow-x:hidden!important;
 }
 html body #root main.entertainmentLobby .tablesArea article.tableCard.funTableCard{
  box-sizing:border-box!important;display:grid!important;width:100%!important;min-width:0!important;max-width:100%!important;
  height:auto!important;min-height:0!important;max-height:none!important;overflow:hidden!important;
  grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto auto auto auto auto!important;
  column-gap:0!important;row-gap:6px!important;padding:9px!important;
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .tableCardTop{grid-column:1!important;grid-row:1!important;min-width:0!important}
 html body #root main.entertainmentLobby .tablesArea .funTableCard h3{
  grid-column:1!important;grid-row:2!important;min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard>p{
  grid-column:1!important;grid-row:3!important;text-align:left!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .tableSeatVisual{
  grid-column:1!important;grid-row:4!important;box-sizing:border-box!important;width:100%!important;min-width:0!important;max-width:100%!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:40px 48px 40px!important;
  gap:3px!important;padding:5px!important;overflow:hidden!important;height:140px!important;min-height:140px!important;max-height:140px!important;
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .seatBubble{
  box-sizing:border-box!important;width:100%!important;min-width:0!important;max-width:100%!important;
  height:36px!important;padding:2px!important;gap:3px!important;overflow:hidden!important;
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .seatBubble>span{
  flex:0 0 22px!important;width:22px!important;height:22px!important;font-size:8px!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .seatBubble small{
  min-width:0!important;max-width:100%!important;font-size:8px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .compactMeta{
  grid-column:1!important;grid-row:5!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  box-sizing:border-box!important;width:100%!important;min-width:0!important;max-width:100%!important;
  height:auto!important;min-height:0!important;max-height:none!important;padding:6px!important;gap:4px!important;overflow:hidden!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .compactMeta span{
  box-sizing:border-box!important;min-width:0!important;max-width:100%!important;min-height:26px!important;
  white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.15!important;font-size:9px!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .joinFun{
  grid-column:1!important;grid-row:6!important;width:100%!important;min-width:0!important;max-width:100%!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard>button:last-child{
  grid-column:1!important;grid-row:7!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important
 }
}
/* Make preview seat names readable without letting long names escape their seat. */
@media screen and (min-width:1000px){
 html body #root main.entertainmentLobby .funTableCard .seatBubble small{
  font-size:11px!important;line-height:1.1!important;font-weight:900!important;
  min-width:0!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important
 }
}
@media screen and (min-width:1000px) and (max-width:1399px){
 html body #root main.entertainmentLobby .funTableCard .seatBubble>span{
  flex:0 0 24px!important;width:24px!important;height:24px!important;font-size:9px!important
 }
 html body #root main.entertainmentLobby .funTableCard .seatBubble small{font-size:10px!important}
}
@media screen and (min-width:1000px) and (max-width:1399px){
 html body #root main.entertainmentLobby .tablesArea .funTableCard .seatBubble>span{
  flex:0 0 24px!important;width:24px!important;height:24px!important;font-size:9px!important
 }
 html body #root main.entertainmentLobby .tablesArea .funTableCard .seatBubble small{
  font-size:10px!important;line-height:1.1!important;font-weight:900!important
 }
}