[MNoya]

On a phone, the spectator Live Review and the player's own pack used most of the screen poorly: a single column of cards with the right half empty, and a header split over five rows. This only changes styles below 600px, so the desktop layout is untouched.

• Booster cards fit two per row at phone width, for both players and spectators. The zoom slider still scales them
• The Live Review header fits in two rows: the Pack and Pick selectors share a row with the zoom slider, and the picked card name goes below them. A long player name is cut with an ellipsis instead of wrapping
• Player chips use a bit less padding so the player list takes less height

The Live Review cards were squeezed into half the width because the zoom slider is floated right and the card container, being a flex box, sat beside the float. Making the header a wrapping flex row removes the float's effect.

Booster card width and margin now come from --booster-card-base-width and --booster-card-margin variables that default to 200px and 0.75em, so the pick animation and the pack's min-height follow the smaller phone cards.

Spectator Live Review at 390px

Before	After

Player pack at 390px

Before	After

[Senryoku]

The float: right was a mistake, we should get rid of it.
Sorry if I got a bit carried away this the changes, the normal booster controls switch to a column layout in portrait mode, I figured we could use the same approach here.

Otherwise I'm in favor of using a better default card width for smaller screens. Thanks!