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

styles/simple.css

@@ -1547,22 +1547,11 @@ li {
   width: 100px;
   vertical-align: top;
 }
-.MaleficesDialog .tirage-tarot-dialog .tirage-card:hover {
-  position: relative;
-  z-index: 100;
-}
-.MaleficesDialog .tirage-tarot-dialog .tirage-card:hover .tirage-card-img {
-  transform: scale(2.2);
-  transform-origin: center top;
-  box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.4);
-}
 .MaleficesDialog .tirage-tarot-dialog .tirage-card .tirage-card-img {
   width: 100px;
   border: 1px solid rgba(139, 105, 20, 0.45);
   border-radius: 2px;
   box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
-  transition: transform 0.2s ease, box-shadow 0.2s ease;
-  transform-origin: center center;
   cursor: zoom-in;
 }
 .MaleficesDialog .tirage-tarot-dialog .tirage-card .tirage-card-name {
@@ -1616,6 +1605,29 @@ li {
   border-color: #8b6914;
   color: #5a0a14;
 }
+#tirage-card-zoom-overlay {
+  position: fixed;
+  z-index: 10000;
+  pointer-events: none;
+  border: 2px solid rgba(139, 105, 20, 0.45);
+  border-radius: 3px;
+  box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.55);
+  opacity: 0;
+  transition: opacity 0.15s ease;
+  background: #000;
+}
+#tirage-card-zoom-overlay.visible {
+  opacity: 1;
+}
+#tirage-card-zoom-overlay img {
+  display: block;
+  width: 220px;
+  height: auto;
+  border-radius: 2px;
+}
+#tirage-card-zoom-overlay img.flip-tarot {
+  transform: scaleY(-1);
+}
 .malefices-chat-card {
   font-size: 0.85rem;
   color: #3d2b1f;