feat: draw one card after each turn with slide-in animation

client/src/game/scenes/GameScene.js

@@ -363,7 +363,12 @@ export class GameScene extends Phaser.Scene {
         if (this.playSlots.length !== state.players.length) {
           this._buildSlots(state.players.length)
         }
-        this._buildHand(state.hand)
+        // Si ce n'est pas le premier tour, animer la pioche avant d'afficher la main
+        if (state.currentTurn > 1) {
+          this._animateDraw(state.hand)
+        } else {
+          this._buildHand(state.hand)
+        }
       }
 
       if (state.phase === 'waiting') {
@@ -391,6 +396,76 @@ export class GameScene extends Phaser.Scene {
     })
   }
 
+  // ─── Animation pioche ────────────────────────────────────────────────────────
+
+  /**
+   * Affiche d'abord les cartes déjà en main, puis fait tomber la nouvelle
+   * (toujours la dernière du tableau, ajoutée par nextTurn côté serveur)
+   */
+  _animateDraw(cards) {
+    const { width, height } = this.scale
+
+    // Afficher immédiatement les cartes déjà en main (toutes sauf la dernière)
+    const existing = cards.slice(0, -1)
+    const newCard  = cards[cards.length - 1]
+
+    this._buildHand(existing)
+
+    if (!newCard) return
+
+    // Calculer la position finale de la nouvelle carte dans la main complète
+    const handY   = height - BOTTOM_MARGIN - 110
+    const spacing = Math.min(150, (width * 0.85) / cards.length)
+    const totalW  = spacing * (cards.length - 1)
+    const startX  = width / 2 - totalW / 2
+    const finalX  = startX + (cards.length - 1) * spacing
+
+    // Créer la carte hors écran (au-dessus)
+    const card = new CardObject(this, finalX, -200, newCard)
+    card.setDepth(50)
+    card.on('select', this._onCardSelected, this)
+    card.setAlpha(0)
+
+    // Animation : fade + slide vers la position finale
+    this.tweens.add({
+      targets:  card,
+      y:        handY,
+      alpha:    1,
+      duration: 400,
+      ease:     'Back.Out',
+      delay:    100,
+      onComplete: () => {
+        card._baseY = handY
+        card.setDepth(0)
+        this.handCards.push(card)
+        // Recalculer le spacing de toutes les cartes maintenant qu'on en a une de plus
+        this._repositionHand()
+      }
+    })
+  }
+
+  /** Repositionne toutes les cartes en main avec le bon espacement */
+  _repositionHand() {
+    const { width, height } = this.scale
+    const handY   = height - BOTTOM_MARGIN - 110
+    const n       = this.handCards.length
+    const spacing = Math.min(150, (width * 0.85) / n)
+    const totalW  = spacing * (n - 1)
+    const startX  = width / 2 - totalW / 2
+
+    this.handCards.forEach((card, i) => {
+      const targetX = startX + i * spacing
+      card._baseY = handY
+      this.tweens.add({
+        targets:  card,
+        x:        targetX,
+        y:        handY,
+        duration: 250,
+        ease:     'Power2'
+      })
+    })
+  }
+
   // ─── Utilitaires ─────────────────────────────────────────────────────────────
 
   _darken(hex, factor) {