Affichage des cartes améliorés dans la vue /tirage

modules/malefices-tirage-tarot-dialog.js

@@ -53,6 +53,58 @@ export class MaleficesTirageTarotDialog extends HandlebarsApplicationMixin(Appli
     })
 
     el.querySelector('.tirage-close-btn')?.addEventListener('click', () => this.close())
+
+    this._setupCardZoom(el)
+  }
+
+  /* -------------------------------------------- */
+  _setupCardZoom(el) {
+    let overlay = document.getElementById('tirage-card-zoom-overlay')
+    if (!overlay) {
+      overlay = document.createElement('div')
+      overlay.id = 'tirage-card-zoom-overlay'
+      overlay.innerHTML = '<img src="" alt="" />'
+      document.body.appendChild(overlay)
+    }
+    const overlayImg = overlay.querySelector('img')
+    const ZOOM_W = 224  // 220px image + 2px border × 2
+    const TAROT_RATIO = 5 / 3  // hauteur / largeur (cartes tarot portrait)
+
+    const position = (rect) => {
+      const vw = window.innerWidth
+      const vh = window.innerHeight
+      const zoomH = Math.round(ZOOM_W * TAROT_RATIO)
+
+      let left = rect.left + rect.width / 2 - ZOOM_W / 2
+      let top  = rect.top - zoomH - 10
+
+      left = Math.max(8, Math.min(left, vw - ZOOM_W - 8))
+      if (top < 8) top = rect.bottom + 8
+      if (top + zoomH > vh - 8) top = Math.max(8, vh - zoomH - 8)
+
+      overlay.style.left = left + 'px'
+      overlay.style.top  = top  + 'px'
+    }
+
+    const show = (cardImg) => {
+      overlayImg.src = cardImg.src
+      overlayImg.className = cardImg.className
+      overlay.classList.add('visible')
+      position(cardImg.getBoundingClientRect())
+    }
+
+    const hide = () => overlay.classList.remove('visible')
+
+    el.querySelectorAll('.tirage-card-img').forEach(img => {
+      img.addEventListener('mouseenter', () => show(img))
+      img.addEventListener('mouseleave', hide)
+    })
+  }
+
+  /* -------------------------------------------- */
+  _onClose(_options) {
+    document.getElementById('tirage-card-zoom-overlay')?.remove()
+    return super._onClose(_options)
   }
 
   /* -------------------------------------------- */