Fix mobile animation card sizing and layout polish

- Fix animation overlay cards rendering at wrong size: base .card CSS
  (clamp 65px min) was overriding the inline dimensions set by JS.
  Add !important to .draw-anim-front/.draw-anim-back width/height: 100%
  so overlays always match their parent container size.
- Size opponent swap held card to match opponent card dimensions instead
  of defaulting to deck size (looked oversized on mobile)
- Shrink dealer chip on mobile (38px -> 20px) to fit opponent areas
- Make header more compact: smaller fonts, tighter gaps, nowrap on badges
- Bump deck/discard to 72x101px to match player card size on mobile
- Add spacing between header/opponents, and between deck area/player cards

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

client/app.js

@@ -2780,11 +2780,22 @@ class GolfGame {
 
         // Use unified swap animation
         if (window.cardAnimations) {
+            // For opponent swaps, size the held card to match the opponent card
+            // rather than the deck size (default holding rect uses deck dimensions,
+            // which looks oversized next to small opponent cards on mobile)
+            const holdingRect = window.cardAnimations.getHoldingRect();
+            const heldRect = holdingRect ? {
+                left: holdingRect.left,
+                top: holdingRect.top,
+                width: sourceRect.width,
+                height: sourceRect.height
+            } : null;
+
             window.cardAnimations.animateUnifiedSwap(
                 discardCard,        // handCardData - card going to discard
                 newCardInHand,      // heldCardData - card going to hand
                 sourceRect,         // handRect - where the hand card is
-                null,               // heldRect - use default holding position
+                heldRect,           // heldRect - holding position, opponent card size
                 {
                     rotation: sourceRotation,
                     wasHandFaceDown: !wasFaceUp,