/* =========================
   MONSTER SPRITES (PREMIUM ILLUSTRATION BLENDING)
   ========================= */

@keyframes monsterBob {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-4px);
  }
}

.monsterEntity {
  position: absolute;
  width: 112px;
  transform: translate(-50%, -100%);
  transform-origin: 50% 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  pointer-events: auto;
  z-index: 45;
}

.monsterEntity:hover {
  filter: drop-shadow(0 0 14px rgba(255, 210, 120, 0.45));
}

.monsterName {
  max-width: 112px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(18, 12, 9, 0.84);
  border: 1px solid rgba(255, 222, 159, 0.28);
  color: #ffe2aa;
  font-size: 11px;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.monsterSprite {
  position: relative;
  width: 64px;
  height: 64px;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.75));
  animation: monsterBob 3.2s ease-in-out infinite;
}

.monsterShadow {
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 44px;
  height: 10px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.01) 75%);
  z-index: -1;
}

/* Éléments de sprite en pur CSS */
.monsterBody,
.monsterHead,
.monsterFace,
.monsterAdornment,
.monsterLimbs,
.monsterTail {
  display: block;
  position: absolute;
  pointer-events: none;
  border: 1.5px solid #1c1511;
  box-shadow: inset 1px 1px 2px rgba(255, 255, 255, 0.25), inset -1px -1px 3px rgba(0, 0, 0, 0.4);
}

/* =======================================
   WOLF (Loup)
   ======================================= */
.monsterEntity[data-variant="wolf"] .monsterBody {
  width: 30px;
  height: 20px;
  left: 17px;
  top: 26px;
  border-radius: 8px;
  background: linear-gradient(180deg, #57606f, #2f3542);
}

.monsterEntity[data-variant="wolf"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 12px;
  border-radius: 50%;
  background: #2f3542;
}

.monsterEntity[data-variant="wolf"] .monsterLimbs {
  width: 5px;
  height: 14px;
  left: 19px;
  top: 42px;
  border-radius: 2px;
  background: #2f3542;
  box-shadow: 6px 0 #2f3542, 16px 0 #2f3542, 22px 0 #2f3542, inset 1px 1px 2px rgba(255, 255, 255, 0.25);
}

.monsterEntity[data-variant="wolf"] .monsterTail {
  width: 8px;
  height: 16px;
  left: 11px;
  top: 22px;
  border-radius: 4px;
  background: #57606f;
  transform: rotate(-35deg);
}

.monsterEntity[data-variant="wolf"] .monsterAdornment {
  width: 5px;
  height: 8px;
  left: 22px;
  top: 6px;
  border-radius: 3px 3px 0 0;
  background: #57606f;
  box-shadow: 10px 0 #57606f;
  border-bottom: 0;
}

.monsterEntity[data-variant="wolf"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 26px;
  top: 17px;
  border-radius: 50%;
  background: #ffdd59;
  box-shadow: 6px 0 #ffdd59;
  border: none;
}

/* =======================================
   ARACHNID (Araignée)
   ======================================= */
.monsterEntity[data-variant="arachnid"] .monsterBody {
  width: 34px;
  height: 28px;
  left: 15px;
  top: 16px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #a55eea, #4b1a7a);
}

.monsterEntity[data-variant="arachnid"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 34px;
  border-radius: 50%;
  background: #1e1e24;
}

.monsterEntity[data-variant="arachnid"] .monsterLimbs {
  width: 52px;
  height: 14px;
  left: 6px;
  top: 26px;
  border-radius: 4px;
  background: transparent;
  border: none;
  box-shadow: none;
  border-top: 3px solid #1e1e24;
  border-bottom: 3px solid #1e1e24;
}

.monsterEntity[data-variant="arachnid"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 39px;
  border-radius: 50%;
  background: #ff3f34;
  box-shadow: 3px 0 #ff3f34, 6px 0 #ff3f34;
  border: none;
}

.monsterEntity[data-variant="arachnid"] .monsterAdornment {
  width: 3px;
  height: 5px;
  left: 28px;
  top: 46px;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  background: #ffffff;
  box-shadow: 5px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="arachnid"] .monsterTail {
  display: none;
}

/* =======================================
   CRAB (Crabe)
   ======================================= */
.monsterEntity[data-variant="crab"] .monsterBody {
  width: 32px;
  height: 20px;
  left: 16px;
  top: 28px;
  border-radius: 12px 12px 8px 8px;
  background: radial-gradient(circle at 35% 25%, #ff4757, #ff214f, #9b1c31);
}

.monsterEntity[data-variant="crab"] .monsterHead {
  width: 20px;
  height: 10px;
  left: 22px;
  top: 18px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="crab"] .monsterHead::before,
.monsterEntity[data-variant="crab"] .monsterHead::after {
  content: "";
  position: absolute;
  width: 3px;
  height: 10px;
  background: #ff214f;
  border: 1.5px solid #1c1511;
  border-radius: 2px;
}

.monsterEntity[data-variant="crab"] .monsterHead::before {
  left: 2px;
}

.monsterEntity[data-variant="crab"] .monsterHead::after {
  right: 2px;
}

.monsterEntity[data-variant="crab"] .monsterFace {
  width: 20px;
  height: 10px;
  left: 22px;
  top: 12px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="crab"] .monsterFace::before,
.monsterEntity[data-variant="crab"] .monsterFace::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  background: #ffffff;
  border: 1.5px solid #1c1511;
  border-radius: 50%;
}

.monsterEntity[data-variant="crab"] .monsterFace::before {
  left: 0px;
  background: radial-gradient(circle at 50% 50%, #000 1.5px, #fff 1.5px);
}

.monsterEntity[data-variant="crab"] .monsterFace::after {
  right: 0px;
  background: radial-gradient(circle at 50% 50%, #000 1.5px, #fff 1.5px);
}

.monsterEntity[data-variant="crab"] .monsterAdornment {
  width: 48px;
  height: 20px;
  left: 8px;
  top: 22px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="crab"] .monsterAdornment::before,
.monsterEntity[data-variant="crab"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="crab"] .monsterAdornment::before {
  left: 0;
  top: 0;
  border-radius: 12px 3px 12px 12px;
  background: radial-gradient(circle at 60% 40%, #ff6b81, #ff214f, #9b1c31);
  transform: rotate(-20deg);
}

.monsterEntity[data-variant="crab"] .monsterAdornment::after {
  right: 0;
  top: 0;
  border-radius: 3px 12px 12px 12px;
  background: radial-gradient(circle at 40% 40%, #ff6b81, #ff214f, #9b1c31);
  transform: rotate(20deg);
}

.monsterEntity[data-variant="crab"] .monsterLimbs {
  width: 50px;
  height: 16px;
  left: 7px;
  top: 34px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="crab"] .monsterLimbs::before,
.monsterEntity[data-variant="crab"] .monsterLimbs::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 6px;
  background: #ff214f;
  border: 1.5px solid #1c1511;
  border-radius: 3px;
}

.monsterEntity[data-variant="crab"] .monsterLimbs::before {
  left: 0;
  top: 2px;
  transform: rotate(20deg);
  box-shadow: 3px 5px 0 #ff214f, 3px 5px 0 1.5px #1c1511;
}

.monsterEntity[data-variant="crab"] .monsterLimbs::after {
  right: 0;
  top: 2px;
  transform: rotate(-20deg);
  box-shadow: -3px 5px 0 #ff214f, -3px 5px 0 1.5px #1c1511;
}

.monsterEntity[data-variant="crab"] .monsterTail {
  display: none;
}

/* =======================================
   HARE (Lièvre)
   ======================================= */
.monsterEntity[data-variant="hare"] .monsterBody {
  width: 28px;
  height: 26px;
  left: 18px;
  top: 28px;
  border-radius: 50% 50% 45% 45%;
  background: radial-gradient(circle at 35% 35%, #ffffff, #e3f2fd, #90caf9);
}

.monsterEntity[data-variant="hare"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 12px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="hare"] .monsterHead::before,
.monsterEntity[data-variant="hare"] .monsterHead::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 18px;
  background: #ffffff;
  border: 1.5px solid #1c1511;
  border-radius: 4px;
}

.monsterEntity[data-variant="hare"] .monsterHead::before {
  left: 1px;
  transform: rotate(-8deg);
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.8), inset 0 -6px 0 #ffb8b8;
}

.monsterEntity[data-variant="hare"] .monsterHead::after {
  right: 1px;
  transform: rotate(8deg);
  box-shadow: inset -1px 1px 0 rgba(255, 255, 255, 0.8), inset 0 -6px 0 #ffb8b8;
}

.monsterEntity[data-variant="hare"] .monsterFace {
  width: 14px;
  height: 10px;
  left: 25px;
  top: 32px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="hare"] .monsterFace::before,
.monsterEntity[data-variant="hare"] .monsterFace::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #2c3e50;
  border-radius: 50%;
}

.monsterEntity[data-variant="hare"] .monsterFace::before {
  left: 1px;
}

.monsterEntity[data-variant="hare"] .monsterFace::after {
  right: 1px;
}

.monsterEntity[data-variant="hare"] .monsterAdornment {
  width: 6px;
  height: 4px;
  left: 29px;
  top: 37px;
  border-radius: 50%;
  background: #ffb8b8;
  border: 1px solid #1c1511;
  box-shadow: none;
}

.monsterEntity[data-variant="hare"] .monsterLimbs {
  width: 34px;
  height: 8px;
  left: 15px;
  top: 50px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="hare"] .monsterLimbs::before,
.monsterEntity[data-variant="hare"] .monsterLimbs::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 8px;
  background: #e3f2fd;
  border: 1.5px solid #1c1511;
  border-radius: 4px;
}

.monsterEntity[data-variant="hare"] .monsterLimbs::before {
  left: 2px;
  transform: rotate(5deg);
}

.monsterEntity[data-variant="hare"] .monsterLimbs::after {
  right: 2px;
  transform: rotate(-5deg);
}

.monsterEntity[data-variant="hare"] .monsterTail {
  width: 10px;
  height: 10px;
  left: 12px;
  top: 40px;
  border-radius: 50%;
  background: #ffffff;
  border: 1.5px solid #1c1511;
}

/* =======================================
   PIKE (Brochet mutant)
   ======================================= */
.monsterEntity[data-variant="pike"] .monsterBody {
  width: 42px;
  height: 20px;
  left: 11px;
  top: 22px;
  border-radius: 50% 80% 80% 50%;
  background: linear-gradient(135deg, #0f8a5f, #1e3f66, #0e1e38);
  transform: rotate(-10deg);
}

.monsterEntity[data-variant="pike"] .monsterTail {
  width: 14px;
  height: 22px;
  left: 2px;
  top: 23px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="pike"] .monsterTail::before,
.monsterEntity[data-variant="pike"] .monsterTail::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 12px;
  background: linear-gradient(to right, #0f8a5f, #3ae374);
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 50%;
}

.monsterEntity[data-variant="pike"] .monsterTail::before {
  left: 0;
  top: 0;
  transform: rotate(-30deg);
}

.monsterEntity[data-variant="pike"] .monsterTail::after {
  left: 0;
  top: 6px;
  transform: rotate(30deg) scaleY(-1);
}

.monsterEntity[data-variant="pike"] .monsterLimbs {
  width: 30px;
  height: 30px;
  left: 17px;
  top: 10px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="pike"] .monsterLimbs::before,
.monsterEntity[data-variant="pike"] .monsterLimbs::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background: #3ae374;
  border: 1.5px solid #1c1511;
  border-radius: 10px 0 10px 10px;
}

.monsterEntity[data-variant="pike"] .monsterLimbs::before {
  left: 10px;
  top: 2px;
  transform: rotate(45deg) skewX(-20deg);
  background: linear-gradient(135deg, #3ae374, #0f8a5f);
}

.monsterEntity[data-variant="pike"] .monsterLimbs::after {
  left: 8px;
  bottom: -4px;
  transform: rotate(-135deg) skewX(-20deg);
  background: linear-gradient(135deg, #3ae374, #0f8a5f);
}

.monsterEntity[data-variant="pike"] .monsterHead {
  width: 18px;
  height: 16px;
  left: 40px;
  top: 18px;
  border-radius: 40% 80% 80% 40%;
  background: linear-gradient(135deg, #1e3f66, #0e1e38);
  transform: rotate(-10deg);
}

.monsterEntity[data-variant="pike"] .monsterFace {
  width: 10px;
  height: 10px;
  left: 45px;
  top: 19px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="pike"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  background: #fffb00;
  border: 1px solid #000;
  border-radius: 50%;
  box-shadow: 0 0 6px #ff007f;
}

.monsterEntity[data-variant="pike"] .monsterAdornment {
  width: 12px;
  height: 10px;
  left: 48px;
  top: 25px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="pike"] .monsterAdornment::before,
.monsterEntity[data-variant="pike"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 5px solid #ffffff;
}

.monsterEntity[data-variant="pike"] .monsterAdornment::before {
  left: 1px;
  transform: rotate(-20deg);
}

.monsterEntity[data-variant="pike"] .monsterAdornment::after {
  left: 5px;
  transform: rotate(-10deg);
}

/* =======================================
   GOLEM (Golem de pierre)
   ======================================= */
.monsterEntity[data-variant="golem"] .monsterBody {
  width: 38px;
  height: 32px;
  left: 13px;
  top: 18px;
  border-radius: 6px;
  background: linear-gradient(135deg, #7f8c8d, #2c3e50);
}

.monsterEntity[data-variant="golem"] .monsterHead {
  width: 16px;
  height: 14px;
  left: 24px;
  top: 8px;
  border-radius: 3px;
  background: #95a5a6;
}

.monsterEntity[data-variant="golem"] .monsterLimbs {
  width: 50px;
  height: 10px;
  left: 7px;
  top: 20px;
  border-radius: 4px;
  background: #57606f;
}

.monsterEntity[data-variant="golem"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 27px;
  top: 12px;
  border-radius: 50%;
  background: #00d2d3;
  box-shadow: 6px 0 #00d2d3;
  border: none;
}

.monsterEntity[data-variant="golem"] .monsterAdornment {
  width: 6px;
  height: 6px;
  left: 9px;
  top: 14px;
  transform: rotate(45deg);
  background: #54a0ff;
  box-shadow: 38px 0 #54a0ff;
  border: none;
}

.monsterEntity[data-variant="golem"] .monsterTail {
  width: 8px;
  height: 12px;
  left: 20px;
  top: 46px;
  border-radius: 2px;
  background: #2c3e50;
  box-shadow: 16px 0 #2c3e50;
}

/* =======================================
   SCORPION (Scorpion)
   ======================================= */
.monsterEntity[data-variant="scorpion"] .monsterBody {
  width: 24px;
  height: 16px;
  left: 20px;
  top: 28px;
  border-radius: 4px;
  background: #1e272e;
}

.monsterEntity[data-variant="scorpion"] .monsterLimbs {
  width: 42px;
  height: 8px;
  left: 11px;
  top: 34px;
  border-radius: 3px;
  background: transparent;
  border: 2px solid #1e272e;
  border-bottom: 0;
  box-shadow: none;
}

.monsterEntity[data-variant="scorpion"] .monsterTail {
  width: 8px;
  height: 22px;
  left: 28px;
  top: 8px;
  border-radius: 50% 50% 0 0;
  background: transparent;
  border: 3px solid #ff3f34;
  border-right: 0;
  border-bottom: 0;
  box-shadow: none;
}

.monsterEntity[data-variant="scorpion"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 29px;
  top: 31px;
  border-radius: 50%;
  background: #2ecc71;
  box-shadow: 4px 0 #2ecc71;
  border: none;
}

.monsterEntity[data-variant="scorpion"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="scorpion"] .monsterAdornment {
  display: none;
}

/* =======================================
   COBRA (Cobra)
   ======================================= */
.monsterEntity[data-variant="cobra"] .monsterBody {
  width: 22px;
  height: 30px;
  left: 21px;
  top: 12px;
  border-radius: 10px 10px 4px 4px;
  background: radial-gradient(circle at 50% 30%, #2ecc71 0%, #16a085 60%, #117a65 100%);
}

.monsterEntity[data-variant="cobra"] .monsterTail {
  width: 30px;
  height: 14px;
  left: 17px;
  top: 38px;
  border-radius: 8px;
  background: #27ae60;
}

.monsterEntity[data-variant="cobra"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 27px;
  top: 18px;
  border-radius: 50%;
  background: #ff3f34;
  box-shadow: 6px 0 #ff3f34;
  border: none;
}

.monsterEntity[data-variant="cobra"] .monsterAdornment {
  width: 2px;
  height: 6px;
  left: 31px;
  top: 25px;
  background: #ff3f34;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="cobra"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="cobra"] .monsterLimbs {
  display: none;
}

/* =======================================
   BOAR (Sanglier)
   ======================================= */
.monsterEntity[data-variant="boar"] .monsterBody {
  width: 36px;
  height: 24px;
  left: 14px;
  top: 22px;
  border-radius: 8px;
  background: linear-gradient(180deg, #784212, #4a2704);
}

.monsterEntity[data-variant="boar"] .monsterHead {
  width: 20px;
  height: 16px;
  left: 28px;
  top: 16px;
  border-radius: 6px 3px 3px 6px;
  background: #4a2704;
}

.monsterEntity[data-variant="boar"] .monsterAdornment {
  width: 3px;
  height: 8px;
  left: 40px;
  top: 10px;
  transform: rotate(15deg);
  background: #ffffff;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="boar"] .monsterLimbs {
  width: 4px;
  height: 10px;
  left: 17px;
  top: 44px;
  background: #4a2704;
  box-shadow: 8px 0 #4a2704, 18px 0 #4a2704, 26px 0 #4a2704;
}

.monsterEntity[data-variant="boar"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 34px;
  top: 20px;
  border-radius: 50%;
  background: #ff3f34;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="boar"] .monsterTail {
  display: none;
}

/* =======================================
   YETI (Yéti)
   ======================================= */
.monsterEntity[data-variant="yeti"] .monsterBody {
  width: 40px;
  height: 36px;
  left: 12px;
  top: 18px;
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff, #dff9fb);
}

.monsterEntity[data-variant="yeti"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 10px;
  border-radius: 50%;
  background: #7ed6df;
}

.monsterEntity[data-variant="yeti"] .monsterLimbs {
  width: 48px;
  height: 12px;
  left: 8px;
  top: 20px;
  border-radius: 5px;
  background: #ffffff;
}

.monsterEntity[data-variant="yeti"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 14px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 6px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="yeti"] .monsterAdornment {
  width: 4px;
  height: 8px;
  left: 20px;
  top: 42px;
  background: #ffffff;
  box-shadow: 20px 0 #ffffff;
}

.monsterEntity[data-variant="yeti"] .monsterTail {
  display: none;
}

/* =======================================
   BANDIT (Bandit / Humanoïde)
   ======================================= */
.monsterEntity[data-variant="bandit"] .monsterBody {
  width: 22px;
  height: 30px;
  left: 21px;
  top: 22px;
  border-radius: 6px 6px 3px 3px;
  background: linear-gradient(180deg, #2c3e50, #0f171e);
}

.monsterEntity[data-variant="bandit"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 6px;
  border-radius: 50%;
  background: #1e272e;
}

.monsterEntity[data-variant="bandit"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 13px;
  border-radius: 50%;
  background: #f1c40f;
  box-shadow: 5px 0 #f1c40f;
  border: none;
}

.monsterEntity[data-variant="bandit"] .monsterLimbs {
  width: 4px;
  height: 14px;
  left: 39px;
  top: 18px;
  transform: rotate(45deg);
  background: #bdc3c7;
}

.monsterEntity[data-variant="bandit"] .monsterTail {
  width: 5px;
  height: 8px;
  left: 24px;
  top: 48px;
  background: #0f171e;
  box-shadow: 11px 0 #0f171e;
}

.monsterEntity[data-variant="bandit"] .monsterAdornment {
  display: none;
}

/* =======================================
   HARPY (Harpie)
   ======================================= */
.monsterEntity[data-variant="harpy"] .monsterBody {
  width: 20px;
  height: 26px;
  left: 22px;
  top: 20px;
  border-radius: 5px;
  background: #8c7ae6;
}

.monsterEntity[data-variant="harpy"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 6px;
  border-radius: 50%;
  background: #f5cd79;
}

.monsterEntity[data-variant="harpy"] .monsterLimbs {
  width: 52px;
  height: 14px;
  left: 6px;
  top: 16px;
  border-radius: 6px;
  background: #6c5ce7;
  clip-path: polygon(0 50%, 50% 0, 100% 50%, 80% 100%, 20% 100%);
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="harpy"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 11px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 5px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="harpy"] .monsterTail {
  width: 4px;
  height: 8px;
  left: 26px;
  top: 44px;
  background: #f5cd79;
  box-shadow: 7px 0 #f5cd79;
}

.monsterEntity[data-variant="harpy"] .monsterAdornment {
  display: none;
}

/* =======================================
   BEAST (Bête)
   ======================================= */
.monsterEntity[data-variant="beast"] .monsterBody {
  width: 30px;
  height: 24px;
  left: 17px;
  top: 24px;
  border-radius: 8px;
  background: linear-gradient(180deg, #ff7f50, #ff4757);
}

.monsterEntity[data-variant="beast"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 10px;
  border-radius: 50%;
  background: #ff4757;
}

.monsterEntity[data-variant="beast"] .monsterAdornment {
  width: 4px;
  height: 8px;
  left: 22px;
  top: 4px;
  border-radius: 50% 50% 0 0;
  background: #eccc68;
  box-shadow: 14px 0 #eccc68;
  border-bottom: 0;
}

.monsterEntity[data-variant="beast"] .monsterLimbs {
  width: 5px;
  height: 12px;
  left: 19px;
  top: 46px;
  background: #ff4757;
  box-shadow: 8px 0 #ff4757, 18px 0 #ff4757, 24px 0 #ff4757;
}

.monsterEntity[data-variant="beast"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 27px;
  top: 15px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 6px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="beast"] .monsterTail {
  display: none;
}

/* =======================================
   GOAT (Bouc)
   ======================================= */
.monsterEntity[data-variant="goat"] .monsterBody {
  width: 32px;
  height: 22px;
  left: 16px;
  top: 24px;
  border-radius: 8px;
  background: #d2dae2;
}

.monsterEntity[data-variant="goat"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 12px;
  border-radius: 40%;
  background: #bdc5c9;
}

.monsterEntity[data-variant="goat"] .monsterAdornment {
  width: 3px;
  height: 10px;
  left: 25px;
  top: 4px;
  border-radius: 3px 3px 0 0;
  background: #57606f;
  box-shadow: 11px 0 #57606f;
  border-bottom: 0;
}

.monsterEntity[data-variant="goat"] .monsterLimbs {
  width: 4px;
  height: 12px;
  left: 18px;
  top: 44px;
  background: #bdc5c9;
  box-shadow: 8px 0 #bdc5c9, 20px 0 #bdc5c9, 26px 0 #bdc5c9;
}

.monsterEntity[data-variant="goat"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 16px;
  border-radius: 50%;
  background: #2c3e50;
  box-shadow: 5px 0 #2c3e50;
  border: none;
}

.monsterEntity[data-variant="goat"] .monsterTail {
  display: none;
}

.monsterGroupBadge {
  margin-top: -2px;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(49, 34, 20, 0.92);
  border: 1px solid rgba(255, 207, 121, 0.4);
  color: #ffd98a;
  font-size: 10px;
  font-weight: bold;
}

.monsterJoinCombatBtn {
  margin-top: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255, 214, 116, 0.58);
  background: linear-gradient(180deg, rgba(86, 58, 22, 0.95), rgba(48, 28, 12, 0.92));
  color: #ffe4a1;
  font-size: 10px;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 0 12px rgba(255, 190, 92, 0.18);
}

.monsterStats {
  font-size: 10px;
  line-height: 1.2;
  color: #efe3c8;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}

.monsterHpBar {
  width: 60px;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(26, 14, 12, 0.9);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.monsterHpBar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #7de06e, #d6f07a);
}

/* =========================
   BOSS VISUAL OVERRIDES & ANIMATIONS
   ========================= */

.monsterEntity.is-boss {
  z-index: 99 !important;
  /* Always render on top */
}

.monsterEntity.is-boss .monsterName {
  background: linear-gradient(135deg, #ffb300 0%, #ff8f00 50%, #e65100 100%) !important;
  color: #ffffff !important;
  border: 1px solid #ffd54f !important;
  box-shadow:
    0 0 16px rgba(255, 143, 0, 0.9),
    0 2px 6px rgba(0, 0, 0, 0.6) !important;
  font-size: 12px !important;
  padding: 3px 10px !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
}

.monsterEntity.is-boss .monsterSprite {
  transform: scale(1.6);
  transform-origin: bottom center;
  animation: bossPulse 2s ease-in-out infinite, monsterBob 2.4s ease-in-out infinite !important;
}

@keyframes bossPulse {

  0%,
  100% {
    filter:
      drop-shadow(0 0 8px rgba(255, 143, 0, 0.75)) drop-shadow(-2px -1px 0 rgba(255, 0, 80, 0.4)) drop-shadow(2px 1px 0 rgba(0, 255, 200, 0.4)) drop-shadow(0 6px 12px rgba(0, 0, 0, 0.85));
  }

  50% {
    filter:
      drop-shadow(0 0 22px rgba(255, 215, 0, 0.95)) drop-shadow(-3px -2px 0 rgba(255, 0, 80, 0.5)) drop-shadow(3px 2px 0 rgba(0, 255, 200, 0.5)) drop-shadow(0 6px 16px rgba(0, 0, 0, 0.9));
  }
}

/* Combat Board Boss Overrides */
.combatActorSpriteContainer.is-boss {
  transform: scale(1.42) !important;
  transform-origin: bottom center !important;
  filter: drop-shadow(0 0 18px rgba(255, 143, 0, 0.95)) !important;
  z-index: 100 !important;
}

/* =======================================
   FIRE LIZARD (Lézard de feu)
   ======================================= */
.monsterEntity[data-variant="fire_lizard"] .monsterBody {
  width: 32px;
  height: 16px;
  left: 16px;
  top: 30px;
  border-radius: 8px 12px 12px 8px;
  background: linear-gradient(180deg, #ff4d00, #b33600);
}

.monsterEntity[data-variant="fire_lizard"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 34px;
  top: 22px;
  border-radius: 40%;
  background: #b33600;
}

.monsterEntity[data-variant="fire_lizard"] .monsterLimbs {
  width: 4px;
  height: 10px;
  left: 20px;
  top: 42px;
  background: #ff4d00;
  box-shadow: 8px 0 #ff4d00, 16px 0 #ff4d00, 24px 0 #ff4d00;
}

.monsterEntity[data-variant="fire_lizard"] .monsterTail {
  width: 16px;
  height: 6px;
  left: 6px;
  top: 32px;
  border-radius: 3px;
  background: #ff3300;
  transform: rotate(-15deg);
}

.monsterEntity[data-variant="fire_lizard"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 38px;
  top: 26px;
  border-radius: 50%;
  background: #ffff00;
  box-shadow: 3px 0 #ffff00;
  border: none;
}

.monsterEntity[data-variant="fire_lizard"] .monsterAdornment {
  display: none;
}

/* =======================================
   FIRE ELEMENTAL (Élémentaire / Effrit / Spawn)
   ======================================= */
.monsterEntity[data-variant="fire_elemental"] .monsterBody {
  width: 28px;
  height: 28px;
  left: 18px;
  top: 20px;
  border-radius: 50% 50% 10% 10%;
  background: radial-gradient(circle at 35% 35%, #7f8c8d, #2c3e50);
  animation: flameFloat 1.5s ease-in-out infinite alternate;
}

.monsterEntity[data-variant="fire_elemental"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 8px;
  border-radius: 50%;
  background: #e74c3c;
  box-shadow: 0 0 10px #ff3300;
}

.monsterEntity[data-variant="fire_elemental"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 27px;
  top: 14px;
  border-radius: 50%;
  background: #ffff00;
  box-shadow: 6px 0 #ffff00;
  border: none;
}

.monsterEntity[data-variant="fire_elemental"] .monsterAdornment {
  width: 32px;
  height: 12px;
  left: 16px;
  top: 36px;
  border-radius: 6px;
  background: linear-gradient(90deg, #ff3300, #ff9900);
  border: none;
}

.monsterEntity[data-variant="fire_elemental"] .monsterLimbs {
  display: none;
}

.monsterEntity[data-variant="fire_elemental"] .monsterTail {
  display: none;
}

@keyframes flameFloat {
  0% {
    transform: translateY(0) scale(1);
  }

  100% {
    transform: translateY(-4px) scale(1.05);
  }
}

/* =======================================
   FIRE LORD (Seigneur des Flammes - Boss)
   ======================================= */
.monsterEntity[data-variant="fire_lord"] .monsterBody {
  width: 44px;
  height: 40px;
  left: 10px;
  top: 20px;
  border-radius: 12px;
  background: radial-gradient(circle at 50% 30%, #ff3300 0%, #990000 70%, #1c0000 100%);
  box-shadow: 0 0 15px rgba(255, 51, 0, 0.6);
}

.monsterEntity[data-variant="fire_lord"] .monsterHead {
  width: 22px;
  height: 22px;
  left: 21px;
  top: 4px;
  border-radius: 4px;
  background: #2c0e0e;
  border: 2.5px solid #ff3300;
}

.monsterEntity[data-variant="fire_lord"] .monsterAdornment {
  width: 8px;
  height: 14px;
  left: 16px;
  top: -4px;
  border-radius: 4px 4px 0 0;
  background: #ff9900;
  box-shadow: 24px 0 #ff9900;
  transform: rotate(-10deg);
}

.monsterEntity[data-variant="fire_lord"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 12px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 8px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="fire_lord"] .monsterLimbs {
  width: 6px;
  height: 16px;
  left: 16px;
  top: 48px;
  background: #2c0e0e;
  box-shadow: 26px 0 #2c0e0e;
}

.monsterEntity[data-variant="fire_lord"] .monsterTail {
  width: 14px;
  height: 24px;
  left: 6px;
  top: 30px;
  border-radius: 4px;
  background: #ff3300;
  transform: rotate(-30deg);
}

/* =======================================
   WIND SPIRIT (Esprit du Vent / Gardien)
   ======================================= */
.monsterEntity[data-variant="wind_spirit"] .monsterBody {
  width: 24px;
  height: 32px;
  left: 20px;
  top: 18px;
  border-radius: 50% 50% 30% 30%;
  background: radial-gradient(circle at 35% 35%, rgba(224, 247, 250, 0.8), rgba(0, 229, 255, 0.5));
  border: 1px solid rgba(0, 229, 255, 0.8);
}

.monsterEntity[data-variant="wind_spirit"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 25px;
  top: 8px;
  border-radius: 50%;
  background: #e0f7fa;
  box-shadow: 0 0 12px #00e5ff;
}

.monsterEntity[data-variant="wind_spirit"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 29px;
  top: 13px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 4px 0 #00e5ff;
  border: none;
}

.monsterEntity[data-variant="wind_spirit"] .monsterAdornment {
  width: 28px;
  height: 8px;
  left: 18px;
  top: 4px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.6);
  border: none;
}

.monsterEntity[data-variant="wind_spirit"] .monsterLimbs {
  display: none;
}

.monsterEntity[data-variant="wind_spirit"] .monsterTail {
  display: none;
}

/* =======================================
   THUNDER BIRD (Faucon / Phénix)
   ======================================= */
.monsterEntity[data-variant="thunder_bird"] .monsterBody {
  width: 24px;
  height: 22px;
  left: 20px;
  top: 24px;
  border-radius: 12px;
  background: linear-gradient(180deg, #f1c40f, #d35400);
}

.monsterEntity[data-variant="thunder_bird"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 25px;
  top: 12px;
  border-radius: 50%;
  background: #f1c40f;
}

.monsterEntity[data-variant="thunder_bird"] .monsterLimbs {
  width: 44px;
  height: 14px;
  left: 10px;
  top: 16px;
  border-radius: 5px;
  background: #9b59b6;
  opacity: 0.8;
  border: 1.5px solid #2c3e50;
}

.monsterEntity[data-variant="thunder_bird"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 28px;
  top: 16px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 5px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="thunder_bird"] .monsterTail {
  width: 8px;
  height: 16px;
  left: 28px;
  top: 40px;
  border-radius: 4px;
  background: #e74c3c;
}

.monsterEntity[data-variant="thunder_bird"] .monsterAdornment {
  display: none;
}

/* =======================================
   FALLEN ARCHANGEL (Archange / Valkyrie / Chérubin)
   ======================================= */
.monsterEntity[data-variant="archangel"] .monsterBody {
  width: 24px;
  height: 30px;
  left: 20px;
  top: 22px;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f1c40f);
}

.monsterEntity[data-variant="archangel"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 8px;
  border-radius: 50%;
  background: #f39c12;
}

.monsterEntity[data-variant="archangel"] .monsterAdornment {
  width: 20px;
  height: 20px;
  left: 22px;
  top: 2px;
  border-radius: 50%;
  background: transparent;
  border: 2px solid #f1c40f;
  box-shadow: 0 0 10px #f1c40f;
}

.monsterEntity[data-variant="archangel"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 14px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 6px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="archangel"] .monsterLimbs {
  width: 54px;
  height: 12px;
  left: 5px;
  top: 18px;
  border-radius: 6px;
  background: #2c3e50;
  border: 1.5px solid #1a252f;
}

.monsterEntity[data-variant="archangel"] .monsterTail {
  width: 6px;
  height: 12px;
  left: 23px;
  top: 48px;
  background: #f1c40f;
  box-shadow: 12px 0 #f1c40f;
}

/* =======================================
   DRAGON (Dragon)
   ======================================= */
.monsterEntity[data-variant="dragon"] .monsterBody {
  width: 48px;
  height: 44px;
  left: 8px;
  top: 12px;
  border-radius: 50% 50% 40% 40%;
  background: radial-gradient(circle at 50% 30%, #ff6600, #ff3300);
  box-shadow: 0 0 12px rgba(255, 70, 0, 0.6);
}

.monsterEntity[data-variant="dragon"] .monsterHead {
  width: 28px;
  height: 28px;
  left: 22px;
  top: -4px;
  border-radius: 50%;
  background: radial-gradient(circle, #ffcc00, #ff8800);
  box-shadow: 0 0 8px rgba(255, 200, 0, 0.5);
}

.monsterEntity[data-variant="dragon"] .monsterLimbs {
  width: 12px;
  height: 30px;
  left: 20px;
  top: 44px;
  border-radius: 6px;
  background: #ff6600;
}

.monsterEntity[data-variant="dragon"] .monsterTail {
  width: 14px;
  height: 30px;
  left: 32px;
  top: 36px;
  border-radius: 6px 6px 0 0;
  background: #ff3300;
  transform: rotate(30deg);
}

.monsterEntity[data-variant="dragon"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 34px;
  top: 6px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 4px #fff;
}

/* =======================================
   PHOENIX (Phoenix)
   ======================================= */
.monsterEntity[data-variant="phoenix"] .monsterBody {
  width: 44px;
  height: 36px;
  left: 12px;
  top: 20px;
  border-radius: 50%;
  background: radial-gradient(circle, #ff5e62, #ff9966);
  box-shadow: 0 0 10px rgba(255, 100, 80, 0.6);
}

.monsterEntity[data-variant="phoenix"] .monsterHead {
  width: 24px;
  height: 24px;
  left: 24px;
  top: 8px;
  border-radius: 50%;
  background: radial-gradient(circle, #ffcc33, #ff6600);
  box-shadow: 0 0 8px rgba(255, 170, 0, 0.5);
}

.monsterEntity[data-variant="phoenix"] .monsterTail {
  width: 8px;
  height: 24px;
  left: 28px;
  top: 40px;
  border-radius: 4px 4px 0 0;
  background: #ff5e62;
  transform: rotate(45deg);
}

.monsterEntity[data-variant="phoenix"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 30px;
  top: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 4px #fff;
}

/* =======================================
   GHOST (Fantôme)
   ======================================= */
.monsterEntity[data-variant="ghost"] .monsterBody {
  width: 36px;
  height: 48px;
  left: 14px;
  top: 10px;
  border-radius: 50% 50% 45% 45%;
  background: rgba(200, 200, 255, 0.2);
  border: 2px solid rgba(150, 150, 255, 0.5);
  box-shadow: 0 0 12px rgba(150, 150, 255, 0.4);
}

.monsterEntity[data-variant="ghost"] .monsterHead {
  width: 20px;
  height: 20px;
  left: 24px;
  top: -6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.5);
}

.monsterEntity[data-variant="ghost"] .monsterLimbs {
  width: 8px;
  height: 30px;
  left: 22px;
  top: 48px;
  border-radius: 4px;
  background: rgba(200, 200, 255, 0.2);
}

.monsterEntity[data-variant="ghost"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 30px;
  top: 6px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 2px #fff;
}

/* =========================
   MONSTER SPRITES SUPPLÉMENTAIRES
   ========================= */

/* =======================================
   RAT (Rat des champs / Rat sauvage)
   ======================================= */
.monsterEntity[data-variant="rat"] .monsterBody {
  width: 22px;
  height: 14px;
  left: 21px;
  top: 34px;
  border-radius: 6px 10px 6px 6px;
  background: linear-gradient(180deg, #a0856a, #6b5040);
}

.monsterEntity[data-variant="rat"] .monsterHead {
  width: 14px;
  height: 13px;
  left: 33px;
  top: 24px;
  border-radius: 50% 60% 50% 50%;
  background: #6b5040;
}

.monsterEntity[data-variant="rat"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 40px;
  top: 28px;
  border-radius: 50%;
  background: #ff3f34;
  box-shadow: 3px 0 #ff3f34;
  border: none;
}

.monsterEntity[data-variant="rat"] .monsterAdornment {
  width: 3px;
  height: 3px;
  left: 44px;
  top: 32px;
  border-radius: 50%;
  background: #f5c8a8;
  border: 1px solid #6b5040;
}

.monsterEntity[data-variant="rat"] .monsterLimbs {
  width: 3px;
  height: 8px;
  left: 23px;
  top: 44px;
  background: #6b5040;
  box-shadow: 6px 0 #6b5040, 14px 0 #6b5040, 18px 0 #6b5040;
}

.monsterEntity[data-variant="rat"] .monsterTail {
  width: 14px;
  height: 5px;
  left: 10px;
  top: 38px;
  border-radius: 0 0 0 8px;
  background: transparent;
  border: 2px solid #6b5040;
  border-right: 0;
  border-top: 0;
  box-shadow: none;
}

/* =======================================
   BEAR (Ours / Ours des glaces / Ours polaire)
   ======================================= */
.monsterEntity[data-variant="bear"] .monsterBody {
  width: 36px;
  height: 30px;
  left: 14px;
  top: 22px;
  border-radius: 8px;
  background: linear-gradient(180deg, #8d6e63, #5d4037);
}

.monsterEntity[data-variant="bear"] .monsterHead {
  width: 22px;
  height: 20px;
  left: 21px;
  top: 6px;
  border-radius: 50%;
  background: #6d4c41;
}

.monsterEntity[data-variant="bear"] .monsterAdornment {
  width: 7px;
  height: 7px;
  left: 19px;
  top: 2px;
  border-radius: 50%;
  background: #5d4037;
  box-shadow: 18px 0 #5d4037;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="bear"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 25px;
  top: 12px;
  border-radius: 50%;
  background: #111;
  box-shadow: 7px 0 #111;
  border: none;
}

.monsterEntity[data-variant="bear"] .monsterLimbs {
  width: 6px;
  height: 12px;
  left: 16px;
  top: 48px;
  border-radius: 3px;
  background: #5d4037;
  box-shadow: 26px 0 #5d4037;
}

.monsterEntity[data-variant="bear"] .monsterTail {
  display: none;
}

/* =======================================
   ICE BEAR (Ours polaire corrompu / Ours des glaces)
   ======================================= */
.monsterEntity[data-variant="ice_bear"] .monsterBody {
  width: 38px;
  height: 32px;
  left: 13px;
  top: 20px;
  border-radius: 8px;
  background: linear-gradient(180deg, #e3f2fd, #90caf9);
}

.monsterEntity[data-variant="ice_bear"] .monsterHead {
  width: 24px;
  height: 22px;
  left: 20px;
  top: 4px;
  border-radius: 50%;
  background: #bbdefb;
  box-shadow: 0 0 10px rgba(0, 200, 255, 0.4);
}

.monsterEntity[data-variant="ice_bear"] .monsterAdornment {
  width: 8px;
  height: 8px;
  left: 17px;
  top: 0px;
  border-radius: 50%;
  background: #90caf9;
  box-shadow: 18px 0 #90caf9;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="ice_bear"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 26px;
  top: 10px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 7px 0 #00e5ff;
  border: none;
}

.monsterEntity[data-variant="ice_bear"] .monsterLimbs {
  width: 7px;
  height: 14px;
  left: 15px;
  top: 48px;
  border-radius: 3px;
  background: #90caf9;
  box-shadow: 24px 0 #90caf9;
}

.monsterEntity[data-variant="ice_bear"] .monsterTail {
  display: none;
}

/* =======================================
   SERPENT (Serpent des profondeurs / Vipère)
   ======================================= */
.monsterEntity[data-variant="serpent"] .monsterBody {
  width: 36px;
  height: 14px;
  left: 14px;
  top: 26px;
  border-radius: 8px;
  background: linear-gradient(90deg, #004d40, #00796b, #1de9b6);
}

.monsterEntity[data-variant="serpent"] .monsterHead {
  width: 16px;
  height: 12px;
  left: 36px;
  top: 22px;
  border-radius: 40% 60% 60% 40%;
  background: #004d40;
}

.monsterEntity[data-variant="serpent"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 45px;
  top: 25px;
  border-radius: 50%;
  background: #ffff00;
  box-shadow: 3px 0 #ffff00;
  border: none;
}

.monsterEntity[data-variant="serpent"] .monsterAdornment {
  width: 6px;
  height: 2px;
  left: 48px;
  top: 30px;
  background: #ff3f34;
  border: none;
  box-shadow: none;
  border-radius: 2px;
}

.monsterEntity[data-variant="serpent"] .monsterTail {
  width: 18px;
  height: 10px;
  left: 6px;
  top: 24px;
  border-radius: 0 0 10px 10px;
  background: transparent;
  border: 3px solid #00796b;
  border-top: 0;
  box-shadow: none;
}

.monsterEntity[data-variant="serpent"] .monsterLimbs {
  display: none;
}

/* =======================================
   KRAKEN (Kraken juvénile / Tentacule)
   ======================================= */
.monsterEntity[data-variant="kraken"] .monsterBody {
  width: 30px;
  height: 22px;
  left: 17px;
  top: 10px;
  border-radius: 50% 50% 30% 30%;
  background: radial-gradient(circle at 40% 35%, #4a148c, #1a0033);
  box-shadow: 0 0 8px rgba(120, 0, 200, 0.5);
}

.monsterEntity[data-variant="kraken"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 25px;
  top: 2px;
  border-radius: 50%;
  background: #6a1b9a;
}

.monsterEntity[data-variant="kraken"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 28px;
  top: 7px;
  border-radius: 50%;
  background: #ea80fc;
  box-shadow: 6px 0 #ea80fc;
  border: none;
}

.monsterEntity[data-variant="kraken"] .monsterLimbs {
  width: 56px;
  height: 22px;
  left: 4px;
  top: 26px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="kraken"] .monsterLimbs::before,
.monsterEntity[data-variant="kraken"] .monsterLimbs::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 18px;
  background: #4a148c;
  border: 1.5px solid #1c1511;
  border-radius: 3px;
}

.monsterEntity[data-variant="kraken"] .monsterLimbs::before {
  left: 4px;
  top: 0;
  transform: rotate(-15deg);
  box-shadow: 10px 2px 0 #4a148c, 10px 2px 0 1.5px #1c1511,
    20px -4px 0 #4a148c, 20px -4px 0 1.5px #1c1511;
}

.monsterEntity[data-variant="kraken"] .monsterLimbs::after {
  right: 4px;
  top: 0;
  transform: rotate(15deg);
  box-shadow: -10px 2px 0 #4a148c, -10px 2px 0 1.5px #1c1511,
    -20px -4px 0 #4a148c, -20px -4px 0 1.5px #1c1511;
}

.monsterEntity[data-variant="kraken"] .monsterAdornment {
  width: 4px;
  height: 10px;
  left: 30px;
  top: 28px;
  border-radius: 2px;
  background: #7b1fa2;
  box-shadow: 8px 0 #7b1fa2;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="kraken"] .monsterTail {
  display: none;
}

/* =======================================
   SPHINX (Le Sphinx du Désert)
   ======================================= */
.monsterEntity[data-variant="sphinx"] .monsterBody {
  width: 44px;
  height: 22px;
  left: 10px;
  top: 30px;
  border-radius: 10px 14px 6px 6px;
  background: linear-gradient(180deg, #f9a825, #e65100);
}

.monsterEntity[data-variant="sphinx"] .monsterHead {
  width: 24px;
  height: 24px;
  left: 20px;
  top: 8px;
  border-radius: 50% 50% 40% 40%;
  background: radial-gradient(circle at 40% 35%, #ffcc02, #e65100);
}

.monsterEntity[data-variant="sphinx"] .monsterAdornment {
  width: 28px;
  height: 12px;
  left: 18px;
  top: 14px;
  border-radius: 4px;
  background: #bf360c;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="sphinx"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 12px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 8px 0 #fff;
  border: none;
}

.monsterEntity[data-variant="sphinx"] .monsterLimbs {
  width: 46px;
  height: 10px;
  left: 9px;
  top: 50px;
  border-radius: 4px;
  background: #e65100;
}

.monsterEntity[data-variant="sphinx"] .monsterTail {
  width: 10px;
  height: 20px;
  left: 42px;
  top: 20px;
  border-radius: 4px;
  background: #f9a825;
  transform: rotate(30deg);
}

/* =======================================
   ICE DRAGON (Le Dragon de Givre)
   ======================================= */
.monsterEntity[data-variant="ice_dragon"] .monsterBody {
  width: 46px;
  height: 40px;
  left: 9px;
  top: 14px;
  border-radius: 50% 50% 40% 40%;
  background: radial-gradient(circle at 50% 30%, #b3e5fc, #0288d1);
  box-shadow: 0 0 12px rgba(0, 200, 255, 0.5);
}

.monsterEntity[data-variant="ice_dragon"] .monsterHead {
  width: 26px;
  height: 26px;
  left: 19px;
  top: -2px;
  border-radius: 50%;
  background: radial-gradient(circle, #e1f5fe, #29b6f6);
  box-shadow: 0 0 8px rgba(0, 220, 255, 0.6);
}

.monsterEntity[data-variant="ice_dragon"] .monsterAdornment {
  width: 6px;
  height: 12px;
  left: 22px;
  top: -8px;
  border-radius: 3px 3px 0 0;
  background: #81d4fa;
  box-shadow: 16px 0 #81d4fa;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="ice_dragon"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 28px;
  top: 6px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 8px 0 #00e5ff;
  border: none;
}

.monsterEntity[data-variant="ice_dragon"] .monsterLimbs {
  width: 12px;
  height: 28px;
  left: 18px;
  top: 44px;
  border-radius: 6px;
  background: #29b6f6;
}

.monsterEntity[data-variant="ice_dragon"] .monsterTail {
  width: 16px;
  height: 28px;
  left: 34px;
  top: 36px;
  border-radius: 6px 6px 0 0;
  background: #0288d1;
  transform: rotate(28deg);
}

/* =======================================
   SAND GOLEM (Golem de sable)
   ======================================= */
.monsterEntity[data-variant="sand_golem"] .monsterBody {
  width: 38px;
  height: 30px;
  left: 13px;
  top: 20px;
  border-radius: 6px;
  background: linear-gradient(135deg, #d7b15b, #a07c3c);
}

.monsterEntity[data-variant="sand_golem"] .monsterHead {
  width: 18px;
  height: 16px;
  left: 23px;
  top: 8px;
  border-radius: 4px;
  background: #c9a84c;
}

.monsterEntity[data-variant="sand_golem"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 27px;
  top: 12px;
  border-radius: 50%;
  background: #ff6f00;
  box-shadow: 7px 0 #ff6f00;
  border: none;
}

.monsterEntity[data-variant="sand_golem"] .monsterAdornment {
  width: 6px;
  height: 6px;
  left: 10px;
  top: 16px;
  transform: rotate(45deg);
  background: #e65100;
  box-shadow: 36px 0 #e65100;
  border: none;
}

.monsterEntity[data-variant="sand_golem"] .monsterLimbs {
  width: 48px;
  height: 10px;
  left: 8px;
  top: 22px;
  border-radius: 4px;
  background: #a07c3c;
}

.monsterEntity[data-variant="sand_golem"] .monsterTail {
  width: 8px;
  height: 12px;
  left: 20px;
  top: 46px;
  border-radius: 2px;
  background: #a07c3c;
  box-shadow: 16px 0 #a07c3c;
}

/* =======================================
   LAVA GOLEM (Golem de Lave)
   ======================================= */
.monsterEntity[data-variant="lava_golem"] .monsterBody {
  width: 40px;
  height: 34px;
  left: 12px;
  top: 18px;
  border-radius: 6px;
  background: radial-gradient(circle at 40% 30%, #ff6d00, #b71c1c, #1a0000);
  box-shadow: 0 0 10px rgba(255, 80, 0, 0.5);
}

.monsterEntity[data-variant="lava_golem"] .monsterHead {
  width: 20px;
  height: 18px;
  left: 22px;
  top: 4px;
  border-radius: 4px;
  background: #bf360c;
  border: 2px solid #ff3300;
}

.monsterEntity[data-variant="lava_golem"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 10px;
  border-radius: 50%;
  background: #ffff00;
  box-shadow: 7px 0 #ffff00;
  border: none;
}

.monsterEntity[data-variant="lava_golem"] .monsterAdornment {
  width: 7px;
  height: 7px;
  left: 12px;
  top: 14px;
  transform: rotate(45deg);
  background: #ff6d00;
  box-shadow: 30px 0 #ff6d00;
  border: none;
}

.monsterEntity[data-variant="lava_golem"] .monsterLimbs {
  width: 52px;
  height: 12px;
  left: 6px;
  top: 22px;
  border-radius: 5px;
  background: #bf360c;
}

.monsterEntity[data-variant="lava_golem"] .monsterTail {
  width: 9px;
  height: 14px;
  left: 20px;
  top: 48px;
  border-radius: 2px;
  background: #bf360c;
  box-shadow: 14px 0 #bf360c;
}

/* =======================================
   MAGMA SPIDER (Araignée de Magma)
   ======================================= */
.monsterEntity[data-variant="magma_spider"] .monsterBody {
  width: 30px;
  height: 24px;
  left: 17px;
  top: 18px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ff6d00, #7f0000);
  box-shadow: 0 0 8px rgba(255, 80, 0, 0.4);
}

.monsterEntity[data-variant="magma_spider"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 25px;
  top: 32px;
  border-radius: 50%;
  background: #3e0000;
}

.monsterEntity[data-variant="magma_spider"] .monsterLimbs {
  width: 54px;
  height: 16px;
  left: 5px;
  top: 24px;
  background: transparent;
  border: none;
  box-shadow: none;
  border-top: 3px solid #7f0000;
  border-bottom: 3px solid #7f0000;
}

.monsterEntity[data-variant="magma_spider"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 29px;
  top: 37px;
  border-radius: 50%;
  background: #ffff00;
  box-shadow: 3px 0 #ffff00, 6px 0 #ffff00;
  border: none;
}

.monsterEntity[data-variant="magma_spider"] .monsterAdornment {
  width: 3px;
  height: 5px;
  left: 30px;
  top: 44px;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  background: #ff6d00;
  box-shadow: 5px 0 #ff6d00;
  border: none;
}

.monsterEntity[data-variant="magma_spider"] .monsterTail {
  display: none;
}

/* =======================================
   CHERUB (Chérubin Corrompu)
   ======================================= */
.monsterEntity[data-variant="cherub"] .monsterBody {
  width: 20px;
  height: 24px;
  left: 22px;
  top: 22px;
  border-radius: 6px;
  background: linear-gradient(180deg, #fce4ec, #c2185b);
}

.monsterEntity[data-variant="cherub"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 8px;
  border-radius: 50%;
  background: #f48fb1;
}

.monsterEntity[data-variant="cherub"] .monsterAdornment {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 2px;
  border-radius: 50%;
  background: transparent;
  border: 2px solid #ff4081;
  box-shadow: 0 0 8px rgba(255, 64, 129, 0.5);
}

.monsterEntity[data-variant="cherub"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 13px;
  border-radius: 50%;
  background: #ad1457;
  box-shadow: 5px 0 #ad1457;
  border: none;
}

.monsterEntity[data-variant="cherub"] .monsterLimbs {
  width: 48px;
  height: 10px;
  left: 8px;
  top: 18px;
  border-radius: 6px;
  background: #f06292;
  border: 1.5px solid #1a252f;
}

.monsterEntity[data-variant="cherub"] .monsterTail {
  width: 5px;
  height: 10px;
  left: 24px;
  top: 46px;
  background: #c2185b;
  box-shadow: 10px 0 #c2185b;
}

/* =======================================
   VALKYRIE (Valkyrie des Cieux)
   ======================================= */
.monsterEntity[data-variant="valkyrie"] .monsterBody {
  width: 22px;
  height: 28px;
  left: 21px;
  top: 22px;
  border-radius: 6px 6px 3px 3px;
  background: linear-gradient(180deg, #e8eaf6, #5c6bc0);
}

.monsterEntity[data-variant="valkyrie"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 6px;
  border-radius: 50%;
  background: #ffe082;
}

.monsterEntity[data-variant="valkyrie"] .monsterAdornment {
  width: 24px;
  height: 6px;
  left: 20px;
  top: 2px;
  border-radius: 3px;
  background: #ffd54f;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="valkyrie"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 11px;
  border-radius: 50%;
  background: #1a237e;
  box-shadow: 5px 0 #1a237e;
  border: none;
}

.monsterEntity[data-variant="valkyrie"] .monsterLimbs {
  width: 52px;
  height: 10px;
  left: 6px;
  top: 16px;
  border-radius: 5px;
  background: #9fa8da;
  border: 1.5px solid #1a252f;
}

.monsterEntity[data-variant="valkyrie"] .monsterTail {
  width: 5px;
  height: 10px;
  left: 24px;
  top: 48px;
  background: #5c6bc0;
  box-shadow: 12px 0 #5c6bc0;
}

/* =======================================
   CELESTIAL DRAGON (Dragon Céleste)
   ======================================= */
.monsterEntity[data-variant="celestial_dragon"] .monsterBody {
  width: 46px;
  height: 40px;
  left: 9px;
  top: 14px;
  border-radius: 50% 50% 40% 40%;
  background: radial-gradient(circle at 45% 30%, #e0f7fa, #006064);
  box-shadow: 0 0 14px rgba(0, 229, 255, 0.6);
}

.monsterEntity[data-variant="celestial_dragon"] .monsterHead {
  width: 28px;
  height: 26px;
  left: 18px;
  top: -2px;
  border-radius: 50%;
  background: radial-gradient(circle, #ffffff, #00acc1);
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.7);
}

.monsterEntity[data-variant="celestial_dragon"] .monsterAdornment {
  width: 7px;
  height: 14px;
  left: 20px;
  top: -8px;
  border-radius: 3px 3px 0 0;
  background: #e0f7fa;
  box-shadow: 18px 0 #e0f7fa;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="celestial_dragon"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 7px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 8px 0 #fff;
  border: none;
}

.monsterEntity[data-variant="celestial_dragon"] .monsterLimbs {
  width: 14px;
  height: 30px;
  left: 18px;
  top: 44px;
  border-radius: 6px;
  background: #006064;
}

.monsterEntity[data-variant="celestial_dragon"] .monsterTail {
  width: 16px;
  height: 30px;
  left: 34px;
  top: 36px;
  border-radius: 6px 6px 0 0;
  background: #004d40;
  transform: rotate(28deg);
}

/* =======================================
   LIGHTNING SPHINX (Sphinx de Foudre)
   ======================================= */
.monsterEntity[data-variant="lightning_sphinx"] .monsterBody {
  width: 44px;
  height: 22px;
  left: 10px;
  top: 30px;
  border-radius: 10px 14px 6px 6px;
  background: linear-gradient(180deg, #ffd600, #6a1b9a);
}

.monsterEntity[data-variant="lightning_sphinx"] .monsterHead {
  width: 24px;
  height: 24px;
  left: 20px;
  top: 8px;
  border-radius: 50% 50% 40% 40%;
  background: radial-gradient(circle at 40% 35%, #fff176, #f9a825);
  box-shadow: 0 0 10px rgba(255, 200, 0, 0.6);
}

.monsterEntity[data-variant="lightning_sphinx"] .monsterAdornment {
  width: 28px;
  height: 12px;
  left: 18px;
  top: 16px;
  border-radius: 4px;
  background: #4a148c;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="lightning_sphinx"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 12px;
  border-radius: 50%;
  background: #e040fb;
  box-shadow: 8px 0 #e040fb;
  border: none;
}

.monsterEntity[data-variant="lightning_sphinx"] .monsterLimbs {
  width: 46px;
  height: 10px;
  left: 9px;
  top: 50px;
  border-radius: 4px;
  background: #6a1b9a;
}

.monsterEntity[data-variant="lightning_sphinx"] .monsterTail {
  width: 10px;
  height: 20px;
  left: 42px;
  top: 20px;
  border-radius: 4px;
  background: #ffd600;
  transform: rotate(30deg);
}

/* =======================================
   FIRE SCARAB (Scarabée de Feu)
   ======================================= */
.monsterEntity[data-variant="fire_scarab"] .monsterBody {
  width: 30px;
  height: 22px;
  left: 17px;
  top: 22px;
  border-radius: 50% 50% 40% 40%;
  background: radial-gradient(circle at 40% 30%, #ff6d00, #880e4f);
}

.monsterEntity[data-variant="fire_scarab"] .monsterHead {
  width: 12px;
  height: 12px;
  left: 26px;
  top: 34px;
  border-radius: 50%;
  background: #4a0020;
}

.monsterEntity[data-variant="fire_scarab"] .monsterLimbs {
  width: 52px;
  height: 14px;
  left: 6px;
  top: 28px;
  background: transparent;
  border: none;
  box-shadow: none;
  border-top: 3px solid #880e4f;
  border-bottom: 3px solid #880e4f;
}

.monsterEntity[data-variant="fire_scarab"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 29px;
  top: 38px;
  border-radius: 50%;
  background: #ffab40;
  box-shadow: 4px 0 #ffab40;
  border: none;
}

.monsterEntity[data-variant="fire_scarab"] .monsterAdornment {
  width: 14px;
  height: 5px;
  left: 25px;
  top: 15px;
  border-radius: 3px;
  background: #ff6d00;
  border: 1.5px solid #1c1511;
  box-shadow: none;
}

.monsterEntity[data-variant="fire_scarab"] .monsterTail {
  display: none;
}

/* =======================================
   GARGOYLE (Gargouille de Pierre)
   ======================================= */
.monsterEntity[data-variant="gargoyle"] .monsterBody {
  width: 30px;
  height: 26px;
  left: 17px;
  top: 22px;
  border-radius: 6px;
  background: linear-gradient(180deg, #78909c, #37474f);
}

.monsterEntity[data-variant="gargoyle"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 6px;
  border-radius: 40%;
  background: #546e7a;
}

.monsterEntity[data-variant="gargoyle"] .monsterAdornment {
  width: 5px;
  height: 9px;
  left: 21px;
  top: 0;
  border-radius: 50% 50% 0 0;
  background: #37474f;
  box-shadow: 16px 0 #37474f;
  border: 1.5px solid #1c1511;
  border-bottom: 0;
}

.monsterEntity[data-variant="gargoyle"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 27px;
  top: 11px;
  border-radius: 50%;
  background: #e53935;
  box-shadow: 6px 0 #e53935;
  border: none;
}

.monsterEntity[data-variant="gargoyle"] .monsterLimbs {
  width: 52px;
  height: 10px;
  left: 6px;
  top: 18px;
  border-radius: 5px;
  background: #607d8b;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="gargoyle"] .monsterTail {
  width: 8px;
  height: 14px;
  left: 22px;
  top: 46px;
  border-radius: 2px;
  background: #37474f;
  box-shadow: 16px 0 #37474f;
}

/* =======================================
   GHOST WOLF (Loup spectral)
   ======================================= */
.monsterEntity[data-variant="ghost_wolf"] .monsterBody {
  width: 30px;
  height: 20px;
  left: 17px;
  top: 26px;
  border-radius: 8px;
  background: rgba(100, 130, 255, 0.3);
  border: 1.5px solid rgba(130, 160, 255, 0.7);
  box-shadow: 0 0 10px rgba(100, 130, 255, 0.4);
}

.monsterEntity[data-variant="ghost_wolf"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 12px;
  border-radius: 50%;
  background: rgba(180, 200, 255, 0.3);
  border: 1.5px solid rgba(130, 160, 255, 0.7);
}

.monsterEntity[data-variant="ghost_wolf"] .monsterLimbs {
  width: 5px;
  height: 12px;
  left: 19px;
  top: 42px;
  border-radius: 2px;
  background: rgba(100, 130, 255, 0.4);
  box-shadow: 6px 0 rgba(100, 130, 255, 0.4), 16px 0 rgba(100, 130, 255, 0.4), 22px 0 rgba(100, 130, 255, 0.4);
  border: 1px solid rgba(130, 160, 255, 0.5);
}

.monsterEntity[data-variant="ghost_wolf"] .monsterTail {
  width: 8px;
  height: 16px;
  left: 11px;
  top: 22px;
  border-radius: 4px;
  background: rgba(100, 130, 255, 0.3);
  transform: rotate(-35deg);
  border: 1px solid rgba(130, 160, 255, 0.6);
}

.monsterEntity[data-variant="ghost_wolf"] .monsterAdornment {
  width: 5px;
  height: 8px;
  left: 22px;
  top: 6px;
  border-radius: 3px 3px 0 0;
  background: rgba(130, 160, 255, 0.4);
  border: 1px solid rgba(130, 160, 255, 0.6);
  border-bottom: 0;
  box-shadow: 10px 0 rgba(130, 160, 255, 0.4);
}

.monsterEntity[data-variant="ghost_wolf"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 26px;
  top: 17px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 6px 0 #00e5ff;
  border: none;
}

/* =======================================
   ICE HARE (Lièvre givre)
   ======================================= */
.monsterEntity[data-variant="ice_hare"] .monsterBody {
  width: 28px;
  height: 26px;
  left: 18px;
  top: 28px;
  border-radius: 50% 50% 45% 45%;
  background: radial-gradient(circle at 35% 35%, #e3f2fd, #29b6f6);
}

.monsterEntity[data-variant="ice_hare"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 12px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="ice_hare"] .monsterHead::before,
.monsterEntity[data-variant="ice_hare"] .monsterHead::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 18px;
  background: #b3e5fc;
  border: 1.5px solid #1c1511;
  border-radius: 4px;
}

.monsterEntity[data-variant="ice_hare"] .monsterHead::before {
  left: 1px;
  transform: rotate(-8deg);
  box-shadow: inset 0 -6px 0 #00bcd4;
}

.monsterEntity[data-variant="ice_hare"] .monsterHead::after {
  right: 1px;
  transform: rotate(8deg);
  box-shadow: inset 0 -6px 0 #00bcd4;
}

.monsterEntity[data-variant="ice_hare"] .monsterFace {
  width: 14px;
  height: 10px;
  left: 25px;
  top: 32px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="ice_hare"] .monsterFace::before,
.monsterEntity[data-variant="ice_hare"] .monsterFace::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #01579b;
  border-radius: 50%;
}

.monsterEntity[data-variant="ice_hare"] .monsterFace::before {
  left: 1px;
}

.monsterEntity[data-variant="ice_hare"] .monsterFace::after {
  right: 1px;
}

.monsterEntity[data-variant="ice_hare"] .monsterAdornment {
  width: 6px;
  height: 4px;
  left: 29px;
  top: 37px;
  border-radius: 50%;
  background: #80deea;
  border: 1px solid #1c1511;
  box-shadow: none;
}

.monsterEntity[data-variant="ice_hare"] .monsterLimbs {
  width: 34px;
  height: 8px;
  left: 15px;
  top: 50px;
  border: none;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="ice_hare"] .monsterLimbs::before,
.monsterEntity[data-variant="ice_hare"] .monsterLimbs::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 8px;
  background: #b3e5fc;
  border: 1.5px solid #1c1511;
  border-radius: 4px;
}

.monsterEntity[data-variant="ice_hare"] .monsterLimbs::before {
  left: 2px;
  transform: rotate(5deg);
}

.monsterEntity[data-variant="ice_hare"] .monsterLimbs::after {
  right: 2px;
  transform: rotate(-5deg);
}

.monsterEntity[data-variant="ice_hare"] .monsterTail {
  width: 10px;
  height: 10px;
  left: 12px;
  top: 40px;
  border-radius: 50%;
  background: #e1f5fe;
  border: 1.5px solid #1c1511;
}

/* =======================================
   MUMMY (Momie du désert)
   ======================================= */
.monsterEntity[data-variant="mummy"] .monsterBody {
  width: 22px;
  height: 30px;
  left: 21px;
  top: 22px;
  border-radius: 4px;
  background: linear-gradient(180deg, #e8d5b0, #a68b5b);
  box-shadow: inset 3px 0 0 rgba(0, 0, 0, 0.15), inset -3px 0 0 rgba(0, 0, 0, 0.15);
}

.monsterEntity[data-variant="mummy"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 6px;
  border-radius: 50%;
  background: #d4b896;
  box-shadow: inset 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.monsterEntity[data-variant="mummy"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 27px;
  top: 13px;
  border-radius: 50%;
  background: #ff6f00;
  box-shadow: 6px 0 #ff6f00;
  border: none;
}

.monsterEntity[data-variant="mummy"] .monsterAdornment {
  width: 22px;
  height: 4px;
  left: 21px;
  top: 18px;
  border-radius: 2px;
  background: #a68b5b;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="mummy"] .monsterLimbs {
  width: 34px;
  height: 8px;
  left: 15px;
  top: 24px;
  border-radius: 4px;
  background: #c4a06e;
}

.monsterEntity[data-variant="mummy"] .monsterTail {
  width: 5px;
  height: 10px;
  left: 25px;
  top: 50px;
  background: #a68b5b;
  box-shadow: 10px 0 #a68b5b;
}

/* =======================================
   SIREN (Sirène hostile)
   ======================================= */
.monsterEntity[data-variant="siren"] .monsterBody {
  width: 16px;
  height: 22px;
  left: 24px;
  top: 22px;
  border-radius: 4px;
  background: linear-gradient(180deg, #f48fb1, #00796b);
}

.monsterEntity[data-variant="siren"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 8px;
  border-radius: 50%;
  background: #f8bbd0;
}

.monsterEntity[data-variant="siren"] .monsterTail {
  width: 28px;
  height: 16px;
  left: 18px;
  top: 40px;
  border-radius: 4px 4px 12px 12px;
  background: linear-gradient(180deg, #00796b, #00bcd4);
}

.monsterEntity[data-variant="siren"] .monsterAdornment {
  width: 28px;
  height: 8px;
  left: 18px;
  top: 14px;
  border-radius: 5px;
  background: #f06292;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="siren"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 12px;
  border-radius: 50%;
  background: #1a237e;
  box-shadow: 5px 0 #1a237e;
  border: none;
}

.monsterEntity[data-variant="siren"] .monsterLimbs {
  display: none;
}

/* =======================================
   TURTLE (Tortue d'eau)
   ======================================= */
.monsterEntity[data-variant="turtle"] .monsterBody {
  width: 36px;
  height: 22px;
  left: 14px;
  top: 28px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #558b2f, #1b5e20);
}

.monsterEntity[data-variant="turtle"] .monsterHead {
  width: 14px;
  height: 12px;
  left: 34px;
  top: 22px;
  border-radius: 40% 60% 60% 40%;
  background: #2e7d32;
}

.monsterEntity[data-variant="turtle"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 41px;
  top: 25px;
  border-radius: 50%;
  background: #111;
  box-shadow: 3px 0 #111;
  border: none;
}

.monsterEntity[data-variant="turtle"] .monsterAdornment {
  width: 30px;
  height: 18px;
  left: 17px;
  top: 22px;
  border-radius: 50%;
  background: transparent;
  border: 2.5px solid #33691e;
  box-shadow: none;
}

.monsterEntity[data-variant="turtle"] .monsterLimbs {
  width: 4px;
  height: 8px;
  left: 16px;
  top: 46px;
  border-radius: 2px;
  background: #2e7d32;
  box-shadow: 8px 0 #2e7d32, 22px 0 #2e7d32, 30px 0 #2e7d32;
}

.monsterEntity[data-variant="turtle"] .monsterTail {
  width: 6px;
  height: 5px;
  left: 10px;
  top: 32px;
  border-radius: 3px;
  background: #2e7d32;
}

/* =======================================
   RAVEN (Corbeau des plaines / Corbeau enragé)
   ======================================= */
.monsterEntity[data-variant="raven"] .monsterBody {
  width: 22px;
  height: 18px;
  left: 21px;
  top: 28px;
  border-radius: 8px 12px 8px 8px;
  background: linear-gradient(180deg, #212121, #0a0a0a);
}

.monsterEntity[data-variant="raven"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 30px;
  top: 16px;
  border-radius: 50%;
  background: #1a1a1a;
}

.monsterEntity[data-variant="raven"] .monsterAdornment {
  width: 8px;
  height: 4px;
  left: 36px;
  top: 22px;
  border-radius: 0 2px 2px 0;
  background: #ffd600;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="raven"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 36px;
  top: 17px;
  border-radius: 50%;
  background: #e53935;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="raven"] .monsterLimbs {
  width: 26px;
  height: 10px;
  left: 19px;
  top: 38px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="raven"] .monsterLimbs::before,
.monsterEntity[data-variant="raven"] .monsterLimbs::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 10px;
  border: 2px solid #1a1a1a;
  border-radius: 10px 10px 0 10px;
}

.monsterEntity[data-variant="raven"] .monsterLimbs::before {
  left: 0;
  top: 0;
  transform: rotate(-20deg);
  background: #212121;
}

.monsterEntity[data-variant="raven"] .monsterLimbs::after {
  right: 0;
  top: 0;
  transform: rotate(20deg) scaleX(-1);
  background: #212121;
}

.monsterEntity[data-variant="raven"] .monsterTail {
  width: 6px;
  height: 14px;
  left: 13px;
  top: 36px;
  border-radius: 3px;
  background: #1a1a1a;
  transform: rotate(-10deg);
}

/* =======================================
   CONDOR (Condor des cimes / Aigle des sommets)
   ======================================= */
.monsterEntity[data-variant="condor"] .monsterBody {
  width: 24px;
  height: 20px;
  left: 20px;
  top: 26px;
  border-radius: 10px;
  background: linear-gradient(180deg, #5d4037, #3e2723);
}

.monsterEntity[data-variant="condor"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 25px;
  top: 14px;
  border-radius: 50%;
  background: #ff7043;
}

.monsterEntity[data-variant="condor"] .monsterAdornment {
  width: 10px;
  height: 5px;
  left: 28px;
  top: 20px;
  border-radius: 0 2px 2px 0;
  background: #ffd600;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="condor"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 32px;
  top: 15px;
  border-radius: 50%;
  background: #111;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="condor"] .monsterLimbs {
  width: 52px;
  height: 14px;
  left: 6px;
  top: 18px;
  background: #4e342e;
  border: 1.5px solid #1c1511;
  border-radius: 5px;
}

.monsterEntity[data-variant="condor"] .monsterTail {
  width: 8px;
  height: 16px;
  left: 28px;
  top: 42px;
  border-radius: 3px;
  background: #3e2723;
}

/* =======================================
   SHADOW WOLF (Loup des ombres)
   ======================================= */
.monsterEntity[data-variant="shadow_wolf"] .monsterBody {
  width: 30px;
  height: 20px;
  left: 17px;
  top: 26px;
  border-radius: 8px;
  background: linear-gradient(180deg, #1a1a2e, #0a0a0a);
  box-shadow: 0 0 8px rgba(120, 0, 255, 0.4);
}

.monsterEntity[data-variant="shadow_wolf"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 12px;
  border-radius: 50%;
  background: #16213e;
}

.monsterEntity[data-variant="shadow_wolf"] .monsterLimbs {
  width: 5px;
  height: 14px;
  left: 19px;
  top: 42px;
  border-radius: 2px;
  background: #0a0a0a;
  box-shadow: 6px 0 #0a0a0a, 16px 0 #0a0a0a, 22px 0 #0a0a0a;
}

.monsterEntity[data-variant="shadow_wolf"] .monsterTail {
  width: 8px;
  height: 16px;
  left: 11px;
  top: 22px;
  border-radius: 4px;
  background: #1a1a2e;
  transform: rotate(-35deg);
}

.monsterEntity[data-variant="shadow_wolf"] .monsterAdornment {
  width: 5px;
  height: 8px;
  left: 22px;
  top: 6px;
  border-radius: 3px 3px 0 0;
  background: #1a1a2e;
  border-bottom: 0;
  box-shadow: 10px 0 #1a1a2e;
}

.monsterEntity[data-variant="shadow_wolf"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 26px;
  top: 17px;
  border-radius: 50%;
  background: #9c27b0;
  box-shadow: 6px 0 #9c27b0;
  border: none;
}

/* =======================================
   FALLEN ANGEL (Goule gelée)
   ======================================= */
.monsterEntity[data-variant="frozen_ghoul"] .monsterBody {
  width: 22px;
  height: 30px;
  left: 21px;
  top: 22px;
  border-radius: 6px 6px 3px 3px;
  background: linear-gradient(180deg, #b3e5fc, #455a64);
  box-shadow: 0 0 6px rgba(0, 200, 255, 0.3);
}

.monsterEntity[data-variant="frozen_ghoul"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 6px;
  border-radius: 50%;
  background: #e1f5fe;
}

.monsterEntity[data-variant="frozen_ghoul"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 13px;
  border-radius: 50%;
  background: #00e5ff;
  box-shadow: 5px 0 #00e5ff;
  border: none;
}

.monsterEntity[data-variant="frozen_ghoul"] .monsterAdornment {
  width: 22px;
  height: 4px;
  left: 21px;
  top: 20px;
  border-radius: 2px;
  background: #80deea;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="frozen_ghoul"] .monsterLimbs {
  width: 4px;
  height: 14px;
  left: 39px;
  top: 18px;
  transform: rotate(45deg);
  background: #90a4ae;
}

.monsterEntity[data-variant="frozen_ghoul"] .monsterTail {
  width: 5px;
  height: 8px;
  left: 24px;
  top: 48px;
  background: #455a64;
  box-shadow: 11px 0 #455a64;
}

/* =======================================
   ENT (Ent jeune & Ent corrompu)
   ======================================= */
.monsterEntity[data-variant="ent"] .monsterBody {
  width: 24px;
  height: 32px;
  left: 20px;
  top: 20px;
  border-radius: 4px;
  background: linear-gradient(180deg, #5c4033, #3d2b1f);
}

.monsterEntity[data-variant="ent"] .monsterHead {
  width: 18px;
  height: 14px;
  left: 23px;
  top: 8px;
  border-radius: 3px;
  background: #3d2b1f;
}

.monsterEntity[data-variant="ent"] .monsterAdornment {
  width: 38px;
  height: 16px;
  left: 13px;
  top: -2px;
  border-radius: 50% 50% 20% 20%;
  background: linear-gradient(135deg, #2e7d32, #1b5e20);
  border: 1.5px solid #1c1511;
  box-shadow: inset 1px 1px 2px rgba(255, 255, 255, 0.25);
}

.monsterEntity[data-variant="ent"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 27px;
  top: 13px;
  border-radius: 50%;
  background: #ffb300;
  box-shadow: 6px 0 #ffb300, 0 0 4px #ffb300;
  border: none;
}

.monsterEntity[data-variant="ent"] .monsterLimbs {
  width: 6px;
  height: 16px;
  left: 15px;
  top: 24px;
  border-radius: 2px;
  background: #3d2b1f;
  transform: rotate(25deg);
  box-shadow: 24px 0 #3d2b1f;
}

.monsterEntity[data-variant="ent"] .monsterTail {
  width: 8px;
  height: 12px;
  left: 18px;
  top: 48px;
  border-radius: 2px;
  background: #271911;
  box-shadow: 18px 0 #271911;
}

/* =======================================
   ENT CORROMPU
   ======================================= */
.monsterEntity[data-variant="ent_corrupt"] .monsterBody {
  width: 26px;
  height: 34px;
  left: 19px;
  top: 18px;
  border-radius: 4px;
  background: linear-gradient(180deg, #3b0764, #1e0038);
  box-shadow: 0 0 10px rgba(168, 85, 247, 0.4);
}

.monsterEntity[data-variant="ent_corrupt"] .monsterHead {
  width: 18px;
  height: 14px;
  left: 23px;
  top: 8px;
  border-radius: 3px;
  background: #2e0854;
}

.monsterEntity[data-variant="ent_corrupt"] .monsterAdornment {
  width: 40px;
  height: 18px;
  left: 12px;
  top: -4px;
  border-radius: 50% 50% 20% 20%;
  background: linear-gradient(135deg, #7e22ce, #3b0764);
  border: 1.5px solid #1e0038;
  box-shadow: 0 0 12px #a855f7, inset 1px 1px 2px rgba(255, 255, 255, 0.3);
}

.monsterEntity[data-variant="ent_corrupt"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 12px;
  border-radius: 50%;
  background: #e879f9;
  box-shadow: 7px 0 #e879f9, 0 0 6px #e879f9;
  border: none;
}

.monsterEntity[data-variant="ent_corrupt"] .monsterLimbs {
  width: 6px;
  height: 16px;
  left: 14px;
  top: 24px;
  border-radius: 2px;
  background: #2e0854;
  transform: rotate(25deg);
  box-shadow: 26px 0 #2e0854;
}

.monsterEntity[data-variant="ent_corrupt"] .monsterTail {
  width: 8px;
  height: 12px;
  left: 18px;
  top: 48px;
  border-radius: 2px;
  background: #1e0038;
  box-shadow: 18px 0 #1e0038;
}

/* =======================================
   ANCESTRAL TREE (L'Arbre Ancestral)
   ======================================= */
.monsterEntity[data-variant="ancestral_tree"] .monsterBody {
  width: 38px;
  height: 40px;
  left: 13px;
  top: 16px;
  border-radius: 6px;
  background: linear-gradient(180deg, #422a1d, #271911);
}

.monsterEntity[data-variant="ancestral_tree"] .monsterHead {
  width: 24px;
  height: 18px;
  left: 20px;
  top: 4px;
  border-radius: 4px;
  background: #271911;
}

.monsterEntity[data-variant="ancestral_tree"] .monsterAdornment {
  width: 56px;
  height: 32px;
  left: 4px;
  top: -22px;
  border-radius: 50%;
  background: radial-gradient(circle, #ffd54f 10%, #2e7d32 60%, #1b5e20 100%);
  border: 2px solid #1c1511;
  box-shadow: 0 0 15px rgba(255, 213, 79, 0.4), inset 2px 2px 4px rgba(255, 255, 255, 0.3);
}

.monsterEntity[data-variant="ancestral_tree"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 10px;
  border-radius: 50%;
  background: #ffd700;
  box-shadow: 8px 0 #ffd700, 0 0 8px #ffd700;
  border: none;
}

.monsterEntity[data-variant="ancestral_tree"] .monsterLimbs {
  width: 8px;
  height: 22px;
  left: 7px;
  top: 20px;
  border-radius: 3px;
  background: #271911;
  transform: rotate(20deg);
  box-shadow: 38px 0 #271911;
}

.monsterEntity[data-variant="ancestral_tree"] .monsterTail {
  width: 10px;
  height: 14px;
  left: 12px;
  top: 50px;
  border-radius: 3px;
  background: #150e0a;
  box-shadow: 28px 0 #150e0a;
}

/* =======================================
   TREE SPROUT (Pousse d'arbre)
   ======================================= */
.monsterEntity[data-variant="tree_sprout"] .monsterBody {
  width: 16px;
  height: 20px;
  left: 24px;
  top: 30px;
  border-radius: 3px;
  background: linear-gradient(180deg, #8d6e63, #5d4037);
}

.monsterEntity[data-variant="tree_sprout"] .monsterHead {
  width: 12px;
  height: 10px;
  left: 26px;
  top: 22px;
  border-radius: 2px;
  background: #5d4037;
}

.monsterEntity[data-variant="tree_sprout"] .monsterAdornment {
  width: 14px;
  height: 10px;
  left: 29px;
  top: 14px;
  border-radius: 0 85% 0 85%;
  background: #81c784;
  transform: rotate(-15deg);
  border: 1px solid #1c1511;
}

.monsterEntity[data-variant="tree_sprout"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 29px;
  top: 25px;
  border-radius: 50%;
  background: #a5d6a7;
  box-shadow: 4px 0 #a5d6a7;
  border: none;
}

.monsterEntity[data-variant="tree_sprout"] .monsterLimbs {
  width: 4px;
  height: 8px;
  left: 22px;
  top: 46px;
  border-radius: 1px;
  background: #5d4037;
  box-shadow: 12px 0 #5d4037;
}

.monsterEntity[data-variant="tree_sprout"] .monsterTail {
  display: none;
}

/* =======================================
   CRYSTAL GOLEM (Le Golem de Cristal)
   ======================================= */
.monsterEntity[data-variant="crystal_golem"] .monsterBody {
  width: 36px;
  height: 32px;
  left: 14px;
  top: 18px;
  border-radius: 6px;
  background: linear-gradient(135deg, #e0f7fa, #80deea, #00acc1);
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.4);
}

.monsterEntity[data-variant="crystal_golem"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 4px;
  border-radius: 4px;
  background: #80deea;
}

.monsterEntity[data-variant="crystal_golem"] .monsterAdornment {
  width: 8px;
  height: 8px;
  left: 10px;
  top: 14px;
  transform: rotate(45deg);
  background: #e0f7fa;
  box-shadow: 36px 0 #e0f7fa, 0 0 8px rgba(0, 229, 255, 0.6);
  border: 1px solid #1c1511;
}

.monsterEntity[data-variant="crystal_golem"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 28px;
  top: 10px;
  border-radius: 50%;
  background: #e91e63;
  box-shadow: 5px 0 #e91e63, 0 0 5px #e91e63;
  border: none;
}

.monsterEntity[data-variant="crystal_golem"] .monsterLimbs {
  width: 8px;
  height: 20px;
  left: 8px;
  top: 22px;
  border-radius: 3px;
  background: #00acc1;
  box-shadow: 40px 0 #00acc1;
}

.monsterEntity[data-variant="crystal_golem"] .monsterTail {
  width: 8px;
  height: 10px;
  left: 20px;
  top: 46px;
  background: #00838f;
  box-shadow: 16px 0 #00838f;
}

/* =======================================
   CRYSTAL SHARD (Éclat de cristal)
   ======================================= */
.monsterEntity[data-variant="crystal_shard"] .monsterBody {
  width: 18px;
  height: 30px;
  left: 23px;
  top: 16px;
  background: linear-gradient(135deg, #ffffff, #80deea, #00acc1);
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  border: none;
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.85);
}

.monsterEntity[data-variant="crystal_shard"] .monsterHead,
.monsterEntity[data-variant="crystal_shard"] .monsterFace,
.monsterEntity[data-variant="crystal_shard"] .monsterAdornment,
.monsterEntity[data-variant="crystal_shard"] .monsterLimbs,
.monsterEntity[data-variant="crystal_shard"] .monsterTail {
  display: none;
}

/* =======================================
   LEVIATHAN (Le Léviathan)
   ======================================= */
.monsterEntity[data-variant="leviathan"] .monsterBody {
  width: 48px;
  height: 24px;
  left: 8px;
  top: 20px;
  border-radius: 50% 80% 80% 50%;
  background: linear-gradient(135deg, #0d47a1, #006064, #001020);
  box-shadow: 0 0 15px rgba(0, 229, 255, 0.5);
}

.monsterEntity[data-variant="leviathan"] .monsterHead {
  width: 22px;
  height: 18px;
  left: 36px;
  top: 14px;
  border-radius: 40% 80% 80% 40%;
  background: #0d47a1;
}

.monsterEntity[data-variant="leviathan"] .monsterAdornment {
  width: 14px;
  height: 26px;
  left: 16px;
  top: 4px;
  border-radius: 10px 0 10px 10px;
  background: linear-gradient(185deg, #00e5ff, #0d47a1);
  transform: rotate(45deg);
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="leviathan"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 44px;
  top: 19px;
  border-radius: 50%;
  background: #ffd700;
  box-shadow: 0 0 6px #ffd700;
  border: none;
}

.monsterEntity[data-variant="leviathan"] .monsterLimbs {
  width: 20px;
  height: 8px;
  left: 22px;
  top: 38px;
  background: #006064;
  border-radius: 50%;
}

.monsterEntity[data-variant="leviathan"] .monsterTail {
  width: 14px;
  height: 20px;
  left: -2px;
  top: 22px;
  background: linear-gradient(to right, #006064, #00e5ff);
  border-radius: 50% 0 0 50%;
  transform: rotate(-15deg);
}

/* =======================================
   TENTACLE (Tentacule)
   ======================================= */
.monsterEntity[data-variant="tentacle"] .monsterBody {
  width: 16px;
  height: 34px;
  left: 24px;
  top: 18px;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(180deg, #0288d1, #01579b);
  transform: skewX(-8deg);
}

.monsterEntity[data-variant="tentacle"] .monsterAdornment {
  width: 4px;
  height: 4px;
  left: 21px;
  top: 24px;
  border-radius: 50%;
  background: #81d4fa;
  box-shadow: 0 6px #81d4fa, 0 12px #81d4fa;
  border: none;
}

.monsterEntity[data-variant="tentacle"] .monsterHead,
.monsterEntity[data-variant="tentacle"] .monsterFace,
.monsterEntity[data-variant="tentacle"] .monsterLimbs,
.monsterEntity[data-variant="tentacle"] .monsterTail {
  display: none;
}

/* =======================================
   SKELETON (Squelette / Chafer)
   ======================================= */
.monsterEntity[data-variant="skeleton"] .monsterBody {
  width: 16px;
  height: 26px;
  left: 24px;
  top: 22px;
  background: #dfe4ea;
  border-radius: 4px;
}

.monsterEntity[data-variant="skeleton"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 6px;
  border-radius: 8px 8px 4px 4px;
  background: #f1f2f6;
}

.monsterEntity[data-variant="skeleton"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 26px;
  top: 12px;
  border-radius: 50%;
  background: #000000;
  box-shadow: 6px 0 #000000;
  border: none;
}

.monsterEntity[data-variant="skeleton"] .monsterAdornment {
  width: 4px;
  height: 18px;
  left: 30px;
  top: 24px;
  background: #dfe4ea;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="skeleton"] .monsterLimbs {
  width: 4px;
  height: 16px;
  left: 20px;
  top: 44px;
  background: #dfe4ea;
  box-shadow: 20px 0 #dfe4ea, inset 1px 1px 2px rgba(255, 255, 255, 0.25);
  border-radius: 2px;
}

.monsterEntity[data-variant="skeleton"] .monsterTail {
  display: none;
}

/* =======================================
   SKELETON KING (Maître des squelettes - Boss)
   ======================================= */
.monsterEntity[data-variant="skeleton_king"] .monsterBody {
  width: 24px;
  height: 28px;
  left: 20px;
  top: 20px;
  background: linear-gradient(180deg, #747d8c, #2f3542);
  border-radius: 6px;
}

.monsterEntity[data-variant="skeleton_king"] .monsterHead {
  width: 20px;
  height: 20px;
  left: 22px;
  top: 2px;
  border-radius: 8px 8px 5px 5px;
  background: #f1f2f6;
}

.monsterEntity[data-variant="skeleton_king"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 25px;
  top: 8px;
  border-radius: 50%;
  background: #ff4757;
  box-shadow: 0 0 4px #ff4757, 6px 0 #ff4757, 6px 0 4px #ff4757;
  border: none;
}

.monsterEntity[data-variant="skeleton_king"] .monsterAdornment {
  width: 22px;
  height: 8px;
  left: 21px;
  top: -5px;
  background: #eccc68;
  clip-path: polygon(0% 100%, 0% 0%, 25% 60%, 50% 0%, 75% 60%, 100% 0%, 100% 100%);
  border: none;
  box-shadow: 0 0 6px #eccc68;
}

.monsterEntity[data-variant="skeleton_king"] .monsterLimbs {
  width: 6px;
  height: 18px;
  left: 16px;
  top: 44px;
  background: #f1f2f6;
  box-shadow: 26px 0 #f1f2f6;
  border-radius: 2px;
}

.monsterEntity[data-variant="skeleton_king"] .monsterTail {
  width: 32px;
  height: 32px;
  left: 16px;
  top: 24px;
  background: #57606f;
  border-radius: 4px;
  z-index: -1;
}

/* =======================================
   ZOMBIE (Fossoyeur / Zombi)
   ======================================= */
.monsterEntity[data-variant="zombie"] .monsterBody {
  width: 26px;
  height: 28px;
  left: 19px;
  top: 20px;
  background: linear-gradient(180deg, #2ed573, #2f3542);
  border-radius: 8px;
}

.monsterEntity[data-variant="zombie"] .monsterHead {
  width: 20px;
  height: 18px;
  left: 22px;
  top: 4px;
  border-radius: 50% 40% 40% 50%;
  background: #2ed573;
}

.monsterEntity[data-variant="zombie"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 25px;
  top: 9px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 3px #ffffff;
  border: none;
}

.monsterEntity[data-variant="zombie"] .monsterAdornment {
  width: 14px;
  height: 5px;
  left: 25px;
  top: 1px;
  background: #ff4757;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="zombie"] .monsterLimbs {
  width: 14px;
  height: 6px;
  left: 8px;
  top: 24px;
  background: #2ed573;
  box-shadow: 34px 0 #2ed573;
  border-radius: 3px;
}

.monsterEntity[data-variant="zombie"] .monsterTail {
  display: none;
}

/* =======================================
   LICH (Liche - Boss)
   ======================================= */
.monsterEntity[data-variant="lich"] .monsterBody {
  width: 28px;
  height: 38px;
  left: 18px;
  top: 16px;
  background: linear-gradient(180deg, #5f27cd, #222f3e);
  border-radius: 12px 12px 0 0;
  box-shadow: 0 0 15px rgba(95, 39, 205, 0.6);
}

.monsterEntity[data-variant="lich"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 0px;
  border-radius: 50%;
  background: #000000;
  border: 1.5px solid #5f27cd;
}

.monsterEntity[data-variant="lich"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 6px;
  border-radius: 50%;
  background: #1dd1a1;
  box-shadow: 0 0 6px #1dd1a1, 6px 0 #1dd1a1, 6px 0 6px #1dd1a1;
  border: none;
}

.monsterEntity[data-variant="lich"] .monsterAdornment {
  width: 10px;
  height: 10px;
  left: 6px;
  top: 24px;
  background: radial-gradient(circle, #1dd1a1, #10ac84);
  border-radius: 50%;
  box-shadow: 0 0 10px #1dd1a1;
  border: none;
}

.monsterEntity[data-variant="lich"] .monsterLimbs {
  width: 6px;
  height: 12px;
  left: 29px;
  top: 52px;
  background: #5f27cd;
  border-radius: 0 0 50% 50%;
  filter: blur(1px);
}

.monsterEntity[data-variant="lich"] .monsterTail {
  display: none;
}

/* =======================================
   MONKEY (Marmouset)
   ======================================= */
.monsterEntity[data-variant="monkey"] .monsterBody {
  width: 26px;
  height: 24px;
  left: 19px;
  top: 24px;
  background: radial-gradient(circle at 30% 30%, #a0522d, #5c3a21);
  border-radius: 50%;
}

.monsterEntity[data-variant="monkey"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 10px;
  background: #a0522d;
  border-radius: 50%;
}

.monsterEntity[data-variant="monkey"] .monsterFace {
  width: 14px;
  height: 10px;
  left: 25px;
  top: 14px;
  background: #f5cd79;
  border-radius: 50%;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="monkey"] .monsterFace::before,
.monsterEntity[data-variant="monkey"] .monsterFace::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 2px;
  background: #000000;
  border-radius: 50%;
  top: 3px;
}

.monsterEntity[data-variant="monkey"] .monsterFace::before {
  left: 3px;
}

.monsterEntity[data-variant="monkey"] .monsterFace::after {
  right: 3px;
}

.monsterEntity[data-variant="monkey"] .monsterAdornment {
  width: 6px;
  height: 6px;
  left: 19px;
  top: 12px;
  background: #a0522d;
  border-radius: 50%;
  box-shadow: 20px 0 #a0522d;
}

.monsterEntity[data-variant="monkey"] .monsterLimbs {
  width: 6px;
  height: 16px;
  left: 15px;
  top: 38px;
  background: #5c3a21;
  box-shadow: 28px 0 #5c3a21;
  border-radius: 3px;
}

.monsterEntity[data-variant="monkey"] .monsterTail {
  width: 20px;
  height: 10px;
  left: 5px;
  top: 30px;
  border-radius: 50%;
  border: 3px solid #5c3a21;
  border-top: none;
  border-left: none;
  transform: rotate(-20deg);
  box-shadow: none;
}

/* =======================================
   GORILLA (Gorille)
   ======================================= */
.monsterEntity[data-variant="gorilla"] .monsterBody {
  width: 36px;
  height: 32px;
  left: 14px;
  top: 22px;
  background: linear-gradient(135deg, #2f3542, #11141a);
  border-radius: 12px 12px 8px 8px;
}

.monsterEntity[data-variant="gorilla"] .monsterHead {
  width: 22px;
  height: 20px;
  left: 21px;
  top: 8px;
  background: #2f3542;
  border-radius: 8px 8px 4px 4px;
}

.monsterEntity[data-variant="gorilla"] .monsterFace {
  width: 4px;
  height: 3px;
  left: 26px;
  top: 14px;
  background: #ff4757;
  box-shadow: 8px 0 #ff4757;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="gorilla"] .monsterAdornment {
  width: 44px;
  height: 16px;
  left: 10px;
  top: 18px;
  background: #2f3542;
  border-radius: 6px;
  z-index: -1;
}

.monsterEntity[data-variant="gorilla"] .monsterLimbs {
  width: 8px;
  height: 18px;
  left: 12px;
  top: 40px;
  background: #11141a;
  box-shadow: 32px 0 #11141a;
  border-radius: 4px;
}

.monsterEntity[data-variant="gorilla"] .monsterTail {
  display: none;
}

/* =======================================
   MONKEY KING (Roi Singe - Boss)
   ======================================= */
.monsterEntity[data-variant="monkey_king"] .monsterBody {
  width: 32px;
  height: 30px;
  left: 16px;
  top: 22px;
  background: linear-gradient(135deg, #d35400, #f1c40f);
  border-radius: 8px;
  box-shadow: 0 0 12px rgba(241, 196, 15, 0.4);
}

.monsterEntity[data-variant="monkey_king"] .monsterHead {
  width: 22px;
  height: 22px;
  left: 21px;
  top: 6px;
  background: #d35400;
  border-radius: 50%;
}

.monsterEntity[data-variant="monkey_king"] .monsterFace {
  width: 16px;
  height: 12px;
  left: 24px;
  top: 11px;
  background: #ffeaa7;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="monkey_king"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #2ecc71;
  box-shadow: 8px 0 #2ecc71;
  border-radius: 50%;
  top: 3px;
  left: 3px;
}

.monsterEntity[data-variant="monkey_king"] .monsterAdornment {
  width: 24px;
  height: 6px;
  left: 20px;
  top: 2px;
  background: #e74c3c;
  border-radius: 3px;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="monkey_king"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 16px;
  background: #e74c3c;
  left: 4px;
  top: -14px;
  transform: rotate(-20deg);
}

.monsterEntity[data-variant="monkey_king"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 16px;
  background: #e74c3c;
  right: 4px;
  top: -14px;
  transform: rotate(20deg);
}

.monsterEntity[data-variant="monkey_king"] .monsterLimbs {
  width: 8px;
  height: 18px;
  left: 10px;
  top: 38px;
  background: #d35400;
  box-shadow: 36px 0 #d35400;
  border-radius: 3px;
}

.monsterEntity[data-variant="monkey_king"] .monsterTail {
  width: 22px;
  height: 12px;
  left: 4px;
  top: 26px;
  border: 3px solid #f1c40f;
  border-top: none;
  border-left: none;
  border-radius: 50%;
  transform: rotate(-10deg);
}

/* =======================================
   JAGUAR (Jaguar)
   ======================================= */
.monsterEntity[data-variant="jaguar"] .monsterBody {
  width: 32px;
  height: 22px;
  left: 16px;
  top: 26px;
  background: linear-gradient(135deg, #f39c12, #d35400);
  border-radius: 8px;
}

.monsterEntity[data-variant="jaguar"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 28px;
  top: 12px;
  background: #f39c12;
  border-radius: 50%;
}

.monsterEntity[data-variant="jaguar"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 34px;
  top: 16px;
  background: #2ecc71;
  box-shadow: 6px 0 #2ecc71;
  border: none;
}

.monsterEntity[data-variant="jaguar"] .monsterAdornment {
  width: 5px;
  height: 6px;
  left: 29px;
  top: 7px;
  background: #d35400;
  box-shadow: 10px 0 #d35400;
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  border: none;
}

.monsterEntity[data-variant="jaguar"] .monsterLimbs {
  width: 6px;
  height: 14px;
  left: 19px;
  top: 44px;
  background: #f39c12;
  box-shadow: 10px 0 #f39c12, 18px 0 #f39c12;
  border-radius: 2px;
}

.monsterEntity[data-variant="jaguar"] .monsterTail {
  width: 16px;
  height: 16px;
  left: 6px;
  top: 18px;
  border: 3px solid #d35400;
  border-bottom: none;
  border-right: none;
  border-radius: 50%;
  transform: rotate(15deg);
  box-shadow: none;
}

/* =======================================
   TIKOK (Tikok)
   ======================================= */
.monsterEntity[data-variant="tikok"] .monsterBody {
  width: 24px;
  height: 36px;
  left: 20px;
  top: 16px;
  background: linear-gradient(180deg, #8e44ad, #2c3e50);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.5);
}

.monsterEntity[data-variant="tikok"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="tikok"] .monsterFace {
  width: 16px;
  height: 6px;
  left: 24px;
  top: 22px;
  background: #e74c3c;
  box-shadow: 0 10px #f1c40f;
  border-radius: 3px;
  border: none;
}

.monsterEntity[data-variant="tikok"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #000000;
  left: 2px;
  top: 1px;
  box-shadow: 8px 0 #000000;
  border-radius: 50%;
}

.monsterEntity[data-variant="tikok"] .monsterAdornment {
  width: 6px;
  height: 12px;
  left: 29px;
  top: 4px;
  background: #2ecc71;
  box-shadow: -8px 2px #e67e22, 8px 2px #f1c40f;
  border-radius: 50% 50% 0 0;
  border: none;
}

.monsterEntity[data-variant="tikok"] .monsterLimbs {
  width: 6px;
  height: 8px;
  left: 23px;
  top: 50px;
  background: #7f8c8d;
  box-shadow: 12px 0 #7f8c8d;
  border-radius: 3px;
}

.monsterEntity[data-variant="tikok"] .monsterTail {
  display: none;
}

/* =======================================
   MINOTAUR VARIANTS (Minotor / Labyrinthe)
   ======================================= */

/* 1. Minotaure des Plaines (Base Minotaur) */
.monsterEntity[data-variant="minotaur"] .monsterBody {
  width: 32px;
  height: 28px;
  left: 16px;
  top: 24px;
  background: linear-gradient(180deg, #5c3a21, #2f1b0c);
  border-radius: 8px;
}

.monsterEntity[data-variant="minotaur"] .monsterHead {
  width: 22px;
  height: 20px;
  left: 21px;
  top: 8px;
  background: #5c3a21;
  border-radius: 6px 6px 10px 10px;
}

.monsterEntity[data-variant="minotaur"] .monsterFace {
  width: 6px;
  height: 6px;
  left: 29px;
  top: 22px;
  border: 1.5px solid #f1c40f;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="minotaur"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #ff4757;
  left: -1px;
  top: -7px;
  box-shadow: 6px 0 #ff4757;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotaur"] .monsterAdornment {
  width: 36px;
  height: 10px;
  left: 14px;
  top: 4px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="minotaur"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 6px;
  background: #f1f2f6;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-45deg);
}

.monsterEntity[data-variant="minotaur"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 6px;
  background: #f1f2f6;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(45deg);
}

.monsterEntity[data-variant="minotaur"] .monsterLimbs {
  width: 8px;
  height: 14px;
  left: 18px;
  top: 48px;
  background: #2f1b0c;
  box-shadow: 20px 0 #2f1b0c;
  border-radius: 2px 2px 0 0;
}

.monsterEntity[data-variant="minotaur"] .monsterTail {
  display: none;
}

/* 2. Minotaure Corrompu (Dark void purple & glowing eyes) */
.monsterEntity[data-variant="minotaur_corrupt"] .monsterBody {
  width: 32px;
  height: 28px;
  left: 16px;
  top: 24px;
  background: linear-gradient(180deg, #3b0764, #1e0038);
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(168, 85, 247, 0.5);
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterHead {
  width: 22px;
  height: 20px;
  left: 21px;
  top: 8px;
  background: #2e0854;
  border-radius: 6px 6px 10px 10px;
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterFace {
  width: 6px;
  height: 6px;
  left: 29px;
  top: 22px;
  border: 1.5px solid #c084fc;
  border-radius: 50%;
  background: transparent;
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #e879f9;
  left: -1px;
  top: -7px;
  box-shadow: 6px 0 #e879f9;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterAdornment {
  width: 38px;
  height: 12px;
  left: 13px;
  top: 3px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 7px;
  background: #7e22ce;
  border: 1.5px solid #1e0038;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-50deg);
  box-shadow: 0 0 6px #c084fc;
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 7px;
  background: #7e22ce;
  border: 1.5px solid #1e0038;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(50deg);
  box-shadow: 0 0 6px #c084fc;
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterLimbs {
  width: 8px;
  height: 14px;
  left: 18px;
  top: 48px;
  background: #1e0038;
  box-shadow: 20px 0 #1e0038;
  border-radius: 2px;
}

.monsterEntity[data-variant="minotaur_corrupt"] .monsterTail {
  display: none;
}

/* 3. Minotaure de Pierre (Granite stone golem minotaur) */
.monsterEntity[data-variant="minotaur_stone"] .monsterBody {
  width: 34px;
  height: 28px;
  left: 15px;
  top: 24px;
  background: linear-gradient(180deg, #64748b, #334155);
  border-radius: 4px;
  box-shadow: inset 0 0 4px #94a3b8;
}

.monsterEntity[data-variant="minotaur_stone"] .monsterHead {
  width: 24px;
  height: 20px;
  left: 20px;
  top: 8px;
  background: #475569;
  border-radius: 4px;
}

.monsterEntity[data-variant="minotaur_stone"] .monsterFace {
  width: 8px;
  height: 4px;
  left: 28px;
  top: 23px;
  background: #1e293b;
  border: 1px solid #94a3b8;
  border-radius: 2px;
}

.monsterEntity[data-variant="minotaur_stone"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #eab308;
  left: -2px;
  top: -8px;
  box-shadow: 8px 0 #eab308;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotaur_stone"] .monsterAdornment {
  width: 40px;
  height: 12px;
  left: 12px;
  top: 2px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minotaur_stone"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 8px;
  background: #94a3b8;
  border: 1.5px solid #1e293b;
  left: 0;
  top: 0;
  transform: rotate(-35deg);
}

.monsterEntity[data-variant="minotaur_stone"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 8px;
  background: #94a3b8;
  border: 1.5px solid #1e293b;
  right: 0;
  top: 0;
  transform: rotate(35deg);
}

.monsterEntity[data-variant="minotaur_stone"] .monsterLimbs {
  width: 10px;
  height: 14px;
  left: 16px;
  top: 48px;
  background: #334155;
  box-shadow: 22px 0 #334155;
  border-radius: 2px;
}

.monsterEntity[data-variant="minotaur_stone"] .monsterTail {
  display: none;
}

/* 4. Guerrier Sabot (Armored Minotaur warrior with helmet & steel horns) */
.monsterEntity[data-variant="minotaur_warrior"] .monsterBody {
  width: 34px;
  height: 30px;
  left: 15px;
  top: 23px;
  background: linear-gradient(180deg, #475569, #1e293b);
  border: 2px solid #d97706;
  border-radius: 8px 8px 4px 4px;
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterHead {
  width: 24px;
  height: 20px;
  left: 20px;
  top: 7px;
  background: #334155;
  border: 1.5px solid #d97706;
  border-radius: 6px 6px 10px 10px;
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterFace {
  width: 8px;
  height: 6px;
  left: 28px;
  top: 22px;
  border: 1.5px solid #f59e0b;
  border-radius: 3px;
  background: #78350f;
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #ef4444;
  left: 0px;
  top: -7px;
  box-shadow: 6px 0 #ef4444;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterAdornment {
  width: 40px;
  height: 12px;
  left: 12px;
  top: 2px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 7px;
  background: #cbd5e1;
  border: 1.5px solid #d97706;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-45deg);
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 7px;
  background: #cbd5e1;
  border: 1.5px solid #d97706;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(45deg);
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterLimbs {
  width: 9px;
  height: 15px;
  left: 17px;
  top: 49px;
  background: #1e293b;
  box-shadow: 21px 0 #1e293b;
  border-radius: 2px;
}

.monsterEntity[data-variant="minotaur_warrior"] .monsterTail {
  display: none;
}

/* 5. Bélier Cornu (Ram-horned Minotaur with massive curved horns) */
.monsterEntity[data-variant="minotaur_ram"] .monsterBody {
  width: 34px;
  height: 28px;
  left: 15px;
  top: 24px;
  background: linear-gradient(180deg, #4a3728, #261910);
  border-radius: 10px;
}

.monsterEntity[data-variant="minotaur_ram"] .monsterHead {
  width: 24px;
  height: 20px;
  left: 20px;
  top: 8px;
  background: #4a3728;
  border-radius: 8px 8px 12px 12px;
}

.monsterEntity[data-variant="minotaur_ram"] .monsterFace {
  width: 8px;
  height: 6px;
  left: 28px;
  top: 22px;
  border: 1.5px solid #d97706;
  border-radius: 4px;
  background: #261910;
}

.monsterEntity[data-variant="minotaur_ram"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #f59e0b;
  left: 0px;
  top: -7px;
  box-shadow: 6px 0 #f59e0b;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotaur_ram"] .monsterAdornment {
  width: 44px;
  height: 16px;
  left: 10px;
  top: 0px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minotaur_ram"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 12px;
  background: transparent;
  border: 3px solid #d97706;
  border-right: none;
  border-bottom: none;
  border-radius: 50% 0 0 50%;
  left: 0;
  top: 2px;
  transform: rotate(-30deg);
}

.monsterEntity[data-variant="minotaur_ram"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 12px;
  background: transparent;
  border: 3px solid #d97706;
  border-left: none;
  border-bottom: none;
  border-radius: 0 50% 50% 0;
  right: 0;
  top: 2px;
  transform: rotate(30deg);
}

.monsterEntity[data-variant="minotaur_ram"] .monsterLimbs {
  width: 9px;
  height: 14px;
  left: 17px;
  top: 48px;
  background: #261910;
  box-shadow: 21px 0 #261910;
  border-radius: 2px;
}

.monsterEntity[data-variant="minotaur_ram"] .monsterTail {
  display: none;
}

/* 6. Minotocure (Mystic shamanic healer minotaur) */
.monsterEntity[data-variant="minotocure"] .monsterBody {
  width: 32px;
  height: 30px;
  left: 16px;
  top: 23px;
  background: linear-gradient(180deg, #0f766e, #134e4a);
  border-radius: 8px;
  box-shadow: 0 0 12px #2dd4bf;
}

.monsterEntity[data-variant="minotocure"] .monsterHead {
  width: 22px;
  height: 20px;
  left: 21px;
  top: 7px;
  background: #1e1b4b;
  border-radius: 6px 6px 10px 10px;
  border: 1px solid #2dd4bf;
}

.monsterEntity[data-variant="minotocure"] .monsterFace {
  width: 6px;
  height: 6px;
  left: 29px;
  top: 22px;
  border: 1.5px solid #2dd4bf;
  border-radius: 50%;
  background: transparent;
}

.monsterEntity[data-variant="minotocure"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #67e8f9;
  left: -1px;
  top: -7px;
  box-shadow: 6px 0 #67e8f9;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotocure"] .monsterAdornment {
  width: 36px;
  height: 12px;
  left: 14px;
  top: 2px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minotocure"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 11px;
  height: 7px;
  background: #99f6e4;
  border: 1.5px solid #134e4a;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-45deg);
  box-shadow: 0 0 8px #2dd4bf;
}

.monsterEntity[data-variant="minotocure"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 11px;
  height: 7px;
  background: #99f6e4;
  border: 1.5px solid #134e4a;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(45deg);
  box-shadow: 0 0 8px #2dd4bf;
}

.monsterEntity[data-variant="minotocure"] .monsterLimbs {
  width: 8px;
  height: 14px;
  left: 18px;
  top: 49px;
  background: #134e4a;
  box-shadow: 20px 0 #134e4a;
  border-radius: 2px;
}

.monsterEntity[data-variant="minotocure"] .monsterTail {
  display: none;
}

/* 7. Minotaure Enragé (Enraged fiery berserker minotaur) */
.monsterEntity[data-variant="minotaur_enraged"] .monsterBody {
  width: 34px;
  height: 30px;
  left: 15px;
  top: 23px;
  background: linear-gradient(180deg, #b91c1c, #450a0a);
  border-radius: 8px;
  box-shadow: 0 0 16px #ef4444;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterHead {
  width: 24px;
  height: 20px;
  left: 20px;
  top: 7px;
  background: #7f1d1d;
  border-radius: 6px 6px 12px 12px;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterFace {
  width: 8px;
  height: 8px;
  left: 28px;
  top: 21px;
  border: 2px solid #fef08a;
  border-radius: 50%;
  background: transparent;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #facc15;
  left: -1px;
  top: -6px;
  box-shadow: 8px 0 #facc15;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterAdornment {
  width: 40px;
  height: 14px;
  left: 12px;
  top: 1px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 8px;
  background: #991b1b;
  border: 1.5px solid #450a0a;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-55deg);
  box-shadow: 0 0 8px #ef4444;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 8px;
  background: #991b1b;
  border: 1.5px solid #450a0a;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(55deg);
  box-shadow: 0 0 8px #ef4444;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterLimbs {
  width: 9px;
  height: 14px;
  left: 17px;
  top: 49px;
  background: #450a0a;
  box-shadow: 21px 0 #450a0a;
  border-radius: 2px;
}

.monsterEntity[data-variant="minotaur_enraged"] .monsterTail {
  width: 6px;
  height: 18px;
  left: 10px;
  top: 34px;
  background: #ef4444;
  border-radius: 50%;
  transform: rotate(-25deg);
}

/* 8. MINOTOT (Garde Minotot & Le Minotot - Boss) */
.monsterEntity[data-variant="minotot"] .monsterBody {
  width: 36px;
  height: 32px;
  left: 14px;
  top: 22px;
  background: linear-gradient(180deg, #d35400, #7f0f00);
  border-radius: 8px;
  box-shadow: 0 0 15px #e67e22;
}

.monsterEntity[data-variant="minotot"] .monsterHead {
  width: 24px;
  height: 22px;
  left: 20px;
  top: 6px;
  background: #7f0f00;
  border-radius: 6px 6px 12px 12px;
}

.monsterEntity[data-variant="minotot"] .monsterFace {
  width: 8px;
  height: 8px;
  left: 28px;
  top: 21px;
  border: 2px solid #ffd700;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
}

.monsterEntity[data-variant="minotot"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #f1c40f;
  left: -1px;
  top: -6px;
  box-shadow: 8px 0 #f1c40f;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotot"] .monsterAdornment {
  width: 36px;
  height: 10px;
  left: 14px;
  top: 4px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="minotot"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 8px;
  background: #ffd700;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  left: 8px;
  top: 0px;
  transform: rotate(-55deg);
  box-shadow: 0 0 8px #ffd700;
}

.monsterEntity[data-variant="minotot"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 8px;
  background: #ffd700;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  right: 8px;
  top: 0px;
  transform: rotate(55deg);
  box-shadow: 0 0 8px #ffd700;
}

.monsterEntity[data-variant="minotot"] .monsterLimbs {
  width: 10px;
  height: 14px;
  left: 16px;
  top: 50px;
  background: #ffd700;
  box-shadow: 22px 0 #ffd700;
  border-radius: 3px;
}

.monsterEntity[data-variant="minotot"] .monsterTail {
  width: 6px;
  height: 20px;
  left: 8px;
  top: 32px;
  background: #e67e22;
  border-radius: 50%;
  transform: rotate(-30deg);
  box-shadow: 0 0 10px #e67e22;
}

/* 9. Minos de Magma (Molten lava obsidian Minotaur) */
.monsterEntity[data-variant="minos_magma"] .monsterBody {
  width: 34px;
  height: 30px;
  left: 15px;
  top: 23px;
  background: linear-gradient(180deg, #dc2626, #18181b);
  border: 1.5px solid #f97316;
  border-radius: 8px;
  box-shadow: 0 0 18px #f97316;
}

.monsterEntity[data-variant="minos_magma"] .monsterHead {
  width: 24px;
  height: 20px;
  left: 20px;
  top: 7px;
  background: #27272a;
  border: 1px solid #f97316;
  border-radius: 6px 6px 12px 12px;
}

.monsterEntity[data-variant="minos_magma"] .monsterFace {
  width: 8px;
  height: 8px;
  left: 28px;
  top: 21px;
  border: 2px solid #ffedd5;
  border-radius: 50%;
  background: transparent;
}

.monsterEntity[data-variant="minos_magma"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #f97316;
  left: -1px;
  top: -6px;
  box-shadow: 8px 0 #f97316;
  border-radius: 50%;
}

.monsterEntity[data-variant="minos_magma"] .monsterAdornment {
  width: 40px;
  height: 14px;
  left: 12px;
  top: 1px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minos_magma"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 8px;
  background: #f97316;
  border: 1.5px solid #7f1d1d;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-55deg);
  box-shadow: 0 0 10px #f97316;
}

.monsterEntity[data-variant="minos_magma"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 8px;
  background: #f97316;
  border: 1.5px solid #7f1d1d;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(55deg);
  box-shadow: 0 0 10px #f97316;
}

.monsterEntity[data-variant="minos_magma"] .monsterLimbs {
  width: 9px;
  height: 14px;
  left: 17px;
  top: 49px;
  background: #18181b;
  box-shadow: 21px 0 #18181b;
  border-radius: 2px;
}

.monsterEntity[data-variant="minos_magma"] .monsterTail {
  width: 6px;
  height: 18px;
  left: 10px;
  top: 34px;
  background: #ea580c;
  border-radius: 50%;
  transform: rotate(-25deg);
  box-shadow: 0 0 8px #ea580c;
}

/* 10. Le Minotaure Géant (Colossal Giant Boss Minotaur) */
.monsterEntity[data-variant="minotaur_giant"] .monsterBody {
  width: 40px;
  height: 34px;
  left: 12px;
  top: 20px;
  background: linear-gradient(180deg, #581c87, #1e1b4b);
  border: 2px solid #eab308;
  border-radius: 10px;
  box-shadow: 0 0 22px #eab308;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterHead {
  width: 28px;
  height: 24px;
  left: 18px;
  top: 2px;
  background: #2e1065;
  border: 1.5px solid #eab308;
  border-radius: 8px 8px 14px 14px;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterFace {
  width: 10px;
  height: 8px;
  left: 27px;
  top: 18px;
  border: 2px solid #fde047;
  border-radius: 50%;
  background: #1e1b4b;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #ef4444;
  left: -1px;
  top: -8px;
  box-shadow: 10px 0 #ef4444;
  border-radius: 50%;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterAdornment {
  width: 48px;
  height: 16px;
  left: 8px;
  top: -6px;
  background: transparent;
  border: none;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 18px;
  height: 10px;
  background: #f59e0b;
  border: 2px solid #1e1b4b;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-50deg);
  box-shadow: 0 0 12px #eab308;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 10px;
  background: #f59e0b;
  border: 2px solid #1e1b4b;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(50deg);
  box-shadow: 0 0 12px #eab308;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterLimbs {
  width: 11px;
  height: 16px;
  left: 15px;
  top: 50px;
  background: #1e1b4b;
  box-shadow: 24px 0 #1e1b4b;
  border-radius: 3px;
}

.monsterEntity[data-variant="minotaur_giant"] .monsterTail {
  width: 7px;
  height: 22px;
  left: 6px;
  top: 30px;
  background: #eab308;
  border-radius: 50%;
  transform: rotate(-30deg);
  box-shadow: 0 0 12px #eab308;
}

/* =======================================
   RAM (Bélier)
   ======================================= */
.monsterEntity[data-variant="ram"] .monsterBody {
  width: 32px;
  height: 26px;
  left: 16px;
  top: 24px;
  background: radial-gradient(circle, #f1f2f6, #ced6e0);
  border-radius: 16px;
  box-shadow: inset 2px 2px 5px #ffffff;
}

.monsterEntity[data-variant="ram"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 12px;
  background: #ced6e0;
  border-radius: 50%;
}

.monsterEntity[data-variant="ram"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 27px;
  top: 18px;
  background: #000000;
  box-shadow: 6px 0 #000000;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="ram"] .monsterAdornment {
  width: 32px;
  height: 10px;
  left: 16px;
  top: 8px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="ram"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 2px solid #70a1ff;
  border-radius: 50%;
  border-top: none;
  border-right: none;
  left: 2px;
  transform: rotate(-45deg);
}

.monsterEntity[data-variant="ram"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 2px solid #70a1ff;
  border-radius: 50%;
  border-top: none;
  border-left: none;
  right: 2px;
  transform: rotate(45deg);
}

.monsterEntity[data-variant="ram"] .monsterLimbs {
  width: 6px;
  height: 12px;
  left: 20px;
  top: 46px;
  background: #747d8c;
  box-shadow: 18px 0 #747d8c;
  border-radius: 2px;
}

.monsterEntity[data-variant="ram"] .monsterTail {
  width: 8px;
  height: 8px;
  left: 10px;
  top: 28px;
  background: #f1f2f6;
  border-radius: 50%;
}

/* =======================================
   T-REX (T-Rex - Boss)
   ======================================= */
.monsterEntity[data-variant="trex"] .monsterBody {
  width: 38px;
  height: 32px;
  left: 13px;
  top: 22px;
  background: linear-gradient(135deg, #27ae60, #1e824c, #1a5235);
  border-radius: 12px;
}

.monsterEntity[data-variant="trex"] .monsterHead {
  width: 26px;
  height: 20px;
  left: 24px;
  top: 6px;
  background: #27ae60;
  border-radius: 4px 12px 6px 4px;
}

.monsterEntity[data-variant="trex"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 38px;
  top: 10px;
  background: #f1c40f;
  border-radius: 50%;
  border: none;
  box-shadow: 0 0 5px #f1c40f;
}

.monsterEntity[data-variant="trex"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 3px;
  background: #ffffff;
  clip-path: polygon(0 0, 10% 100%, 20% 0, 30% 100%, 40% 0, 50% 100%, 60% 0, 70% 100%, 80% 0, 90% 100%, 100% 0);
  left: -10px;
  top: 8px;
}

.monsterEntity[data-variant="trex"] .monsterAdornment {
  width: 6px;
  height: 24px;
  left: 10px;
  top: 16px;
  background: #e67e22;
  border-radius: 3px;
  border: none;
  box-shadow: 0 6px #e67e22, 0 12px #e67e22;
}

.monsterEntity[data-variant="trex"] .monsterLimbs {
  width: 10px;
  height: 16px;
  left: 22px;
  top: 48px;
  background: #1e824c;
  border-radius: 4px;
  box-shadow: 12px -18px 0 -4px #27ae60;
}

.monsterEntity[data-variant="trex"] .monsterTail {
  width: 24px;
  height: 12px;
  left: -6px;
  top: 34px;
  background: #1e824c;
  border-radius: 50% 0 0 50%;
  transform: rotate(-20deg);
}

/* =======================================
   RAPTOR (Raptor)
   ======================================= */
.monsterEntity[data-variant="raptor"] .monsterBody {
  width: 30px;
  height: 18px;
  left: 17px;
  top: 26px;
  background: linear-gradient(135deg, #2ecc71, #27ae60);
  border-radius: 6px;
}

.monsterEntity[data-variant="raptor"] .monsterHead {
  width: 20px;
  height: 12px;
  left: 27px;
  top: 16px;
  background: #2ecc71;
  border-radius: 3px 8px 4px 3px;
}

.monsterEntity[data-variant="raptor"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 39px;
  top: 19px;
  background: #f1c40f;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="raptor"] .monsterAdornment {
  width: 10px;
  height: 4px;
  left: 24px;
  top: 13px;
  background: #e74c3c;
  border-radius: 50% 50% 0 0;
  border: none;
}

.monsterEntity[data-variant="raptor"] .monsterLimbs {
  width: 6px;
  height: 16px;
  left: 22px;
  top: 40px;
  background: #27ae60;
  box-shadow: 10px 0 #27ae60;
  border-radius: 2px;
}

.monsterEntity[data-variant="raptor"] .monsterTail {
  width: 24px;
  height: 6px;
  left: -3px;
  top: 26px;
  background: #27ae60;
  border-radius: 3px;
  transform: rotate(-5deg);
}

/* =======================================
   PTERODACTYL (Ptérodactyle)
   ======================================= */
.monsterEntity[data-variant="pterodactyl"] .monsterBody {
  width: 20px;
  height: 22px;
  left: 22px;
  top: 22px;
  background: #9b59b6;
  border-radius: 4px;
}

.monsterEntity[data-variant="pterodactyl"] .monsterHead {
  width: 24px;
  height: 10px;
  left: 24px;
  top: 12px;
  background: #8e44ad;
  border-radius: 12px 2px 2px 12px;
  transform: rotate(-10deg);
}

.monsterEntity[data-variant="pterodactyl"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 15px;
  background: #ffffff;
  border: none;
}

.monsterEntity[data-variant="pterodactyl"] .monsterAdornment {
  width: 48px;
  height: 14px;
  left: 8px;
  top: 20px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="pterodactyl"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 22px;
  height: 12px;
  background: #9b59b6;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-25deg);
}

.monsterEntity[data-variant="pterodactyl"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 22px;
  height: 12px;
  background: #9b59b6;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(25deg);
}

.monsterEntity[data-variant="pterodactyl"] .monsterLimbs {
  width: 4px;
  height: 8px;
  left: 26px;
  top: 42px;
  background: #7d3c98;
  box-shadow: 8px 0 #7d3c98;
  border-radius: 1px;
}

.monsterEntity[data-variant="pterodactyl"] .monsterTail {
  width: 6px;
  height: 8px;
  left: 29px;
  top: 40px;
  background: #9b59b6;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  border: none;
}

/* =======================================
   TRICERATOPS (Tricératops)
   ======================================= */
.monsterEntity[data-variant="triceratops"] .monsterBody {
  width: 34px;
  height: 24px;
  left: 15px;
  top: 26px;
  background: linear-gradient(135deg, #95a5a6, #7f8c8d);
  border-radius: 8px;
}

.monsterEntity[data-variant="triceratops"] .monsterHead {
  width: 24px;
  height: 24px;
  left: 26px;
  top: 12px;
  background: #7f8c8d;
  border-radius: 50% 50% 4px 4px;
}

.monsterEntity[data-variant="triceratops"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 38px;
  top: 22px;
  background: #000000;
  box-shadow: -6px 0 #000000;
  border: none;
}

.monsterEntity[data-variant="triceratops"] .monsterAdornment {
  width: 20px;
  height: 6px;
  left: 28px;
  top: 10px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="triceratops"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 4px;
  background: #ffffff;
  border: 1px solid #1c1511;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-30deg);
}

.monsterEntity[data-variant="triceratops"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 4px;
  background: #ffffff;
  border: 1px solid #1c1511;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(30deg);
}

.monsterEntity[data-variant="triceratops"] .monsterLimbs {
  width: 8px;
  height: 12px;
  left: 18px;
  top: 48px;
  background: #7f8c8d;
  box-shadow: 14px 0 #7f8c8d, 22px 0 #7f8c8d;
  border-radius: 2px;
}

.monsterEntity[data-variant="triceratops"] .monsterTail {
  width: 14px;
  height: 10px;
  left: 4px;
  top: 32px;
  background: #7f8c8d;
  border-radius: 50%;
  transform: rotate(15deg);
}

/* =======================================
   SAUROPOD (Diplodocus)
   ======================================= */
.monsterEntity[data-variant="sauropod"] .monsterBody {
  width: 36px;
  height: 26px;
  left: 14px;
  top: 26px;
  background: linear-gradient(135deg, #27ae60, #1e824c);
  border-radius: 12px;
}

.monsterEntity[data-variant="sauropod"] .monsterHead {
  width: 8px;
  height: 26px;
  left: 38px;
  top: 4px;
  background: #27ae60;
  border-radius: 4px 4px 0 0;
}

.monsterEntity[data-variant="sauropod"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 42px;
  top: 8px;
  background: #000000;
  border: none;
}

.monsterEntity[data-variant="sauropod"] .monsterAdornment {
  display: none;
}

.monsterEntity[data-variant="sauropod"] .monsterLimbs {
  width: 8px;
  height: 14px;
  left: 18px;
  top: 48px;
  background: #1e824c;
  box-shadow: 14px 0 #1e824c, 22px 0 #1e824c;
  border-radius: 2px;
}

.monsterEntity[data-variant="sauropod"] .monsterTail {
  width: 20px;
  height: 8px;
  left: -2px;
  top: 34px;
  background: #1e824c;
  border-radius: 50%;
  transform: rotate(25deg);
}

/* =======================================
   ANKYLOSAUR (Ankylosaure)
   ======================================= */
.monsterEntity[data-variant="ankylosaur"] .monsterBody {
  width: 34px;
  height: 22px;
  left: 15px;
  top: 26px;
  background: linear-gradient(135deg, #d35400, #a04000);
  border-radius: 16px 16px 8px 8px;
}

.monsterEntity[data-variant="ankylosaur"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 34px;
  top: 26px;
  background: #a04000;
  border-radius: 4px;
}

.monsterEntity[data-variant="ankylosaur"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 42px;
  top: 29px;
  background: #f1c40f;
  border: none;
}

.monsterEntity[data-variant="ankylosaur"] .monsterAdornment {
  width: 30px;
  height: 8px;
  left: 17px;
  top: 21px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="ankylosaur"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 6px;
  background: #f1f2f6;
  border: 1px solid #1c1511;
  border-radius: 50% 50% 0 0;
  left: 4px;
  box-shadow: 8px 0 #f1f2f6, 16px 0 #f1f2f6;
}

.monsterEntity[data-variant="ankylosaur"] .monsterLimbs {
  width: 8px;
  height: 10px;
  left: 18px;
  top: 46px;
  background: #a04000;
  box-shadow: 16px 0 #a04000;
  border-radius: 2px;
}

.monsterEntity[data-variant="ankylosaur"] .monsterTail {
  width: 18px;
  height: 10px;
  left: -1px;
  top: 30px;
  background: #a04000;
  border-radius: 50%;
  transform: rotate(10deg);
}

.monsterEntity[data-variant="ankylosaur"] .monsterTail::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  background: #7f8c8d;
  border: 1.5px solid #1c1511;
  border-radius: 50%;
  left: -3px;
  top: 1px;
}

/* =======================================
   CHRISTMAS YETI (Yéti de Noël - Boss)
   ======================================= */
.monsterEntity[data-variant="christmas_yeti"] .monsterBody {
  width: 36px;
  height: 32px;
  left: 14px;
  top: 22px;
  background: radial-gradient(circle, #ffffff, #dcdde1);
  border-radius: 12px;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}

.monsterEntity[data-variant="christmas_yeti"] .monsterHead {
  width: 22px;
  height: 20px;
  left: 21px;
  top: 8px;
  background: #ffffff;
  border-radius: 50%;
}

.monsterEntity[data-variant="christmas_yeti"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 26px;
  top: 14px;
  background: #00a8ff;
  box-shadow: 8px 0 #00a8ff, 0 0 4px #00a8ff;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="christmas_yeti"] .monsterAdornment {
  width: 18px;
  height: 10px;
  left: 23px;
  top: 1px;
  background: #e84118;
  border-radius: 50% 50% 0 0;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="christmas_yeti"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  background: #ffffff;
  border: 1px solid #1c1511;
  border-radius: 50%;
  right: -2px;
  top: -2px;
}

.monsterEntity[data-variant="christmas_yeti"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 22px;
  height: 4px;
  background: #ffffff;
  border: 1px solid #1c1511;
  border-radius: 2px;
  left: -3px;
  bottom: -3px;
}

.monsterEntity[data-variant="christmas_yeti"] .monsterLimbs {
  width: 8px;
  height: 16px;
  left: 12px;
  top: 42px;
  background: #ffffff;
  box-shadow: 32px 0 #ffffff;
  border-radius: 3px;
}

.monsterEntity[data-variant="christmas_yeti"] .monsterTail {
  width: 6px;
  height: 22px;
  left: 6px;
  top: 24px;
  background: linear-gradient(180deg, #70a1ff, #1e90ff);
  border-radius: 3px;
  transform: rotate(-20deg);
  box-shadow: 0 0 8px #70a1ff;
}

/* =======================================
   ELF (Lutin)
   ======================================= */
.monsterEntity[data-variant="elf"] .monsterBody {
  width: 22px;
  height: 24px;
  left: 21px;
  top: 26px;
  background: #44bd32;
  border-radius: 6px;
}

.monsterEntity[data-variant="elf"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 12px;
  background: #ffdd59;
  border-radius: 50%;
}

.monsterEntity[data-variant="elf"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 18px;
  background: #000000;
  box-shadow: 6px 0 #000000;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="elf"] .monsterAdornment {
  width: 14px;
  height: 12px;
  left: 25px;
  top: 2px;
  background: #c23616;
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  border: none;
}

.monsterEntity[data-variant="elf"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #ffdd59;
  border-radius: 50%;
  left: 50%;
  transform: translateX(-50%);
  top: -2px;
}

.monsterEntity[data-variant="elf"] .monsterLimbs {
  width: 4px;
  height: 12px;
  left: 24px;
  top: 48px;
  background: #c23616;
  box-shadow: 2px 0 #ffffff, 8px 0 #c23616, 10px 0 #ffffff;
  border: none;
}

.monsterEntity[data-variant="elf"] .monsterTail {
  display: none;
}

/* =======================================
   SNOWMAN (Bonhomme de neige)
   ======================================= */
.monsterEntity[data-variant="snowman"] .monsterBody {
  width: 30px;
  height: 26px;
  left: 17px;
  top: 28px;
  background: radial-gradient(circle at 35% 35%, #ffffff, #dcdde1);
  border-radius: 50%;
}

.monsterEntity[data-variant="snowman"] .monsterHead {
  width: 22px;
  height: 20px;
  left: 21px;
  top: 12px;
  background: radial-gradient(circle at 35% 35%, #ffffff, #dcdde1);
  border-radius: 50%;
}

.monsterEntity[data-variant="snowman"] .monsterFace {
  width: 6px;
  height: 4px;
  left: 29px;
  top: 20px;
  background: #e67e22;
  clip-path: polygon(0 50%, 100% 0, 100% 100%);
  transform: rotate(180deg);
  border: none;
}

.monsterEntity[data-variant="snowman"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 2px;
  background: #000000;
  left: 2px;
  top: -6px;
  box-shadow: 4px 0 #000000;
  border-radius: 50%;
}

.monsterEntity[data-variant="snowman"] .monsterAdornment {
  width: 18px;
  height: 12px;
  left: 23px;
  top: 2px;
  background: #2f3542;
  border-radius: 2px;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="snowman"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 26px;
  height: 3px;
  background: #2f3542;
  border: 1.5px solid #1c1511;
  left: -5px;
  bottom: -3px;
  border-radius: 2px;
}

.monsterEntity[data-variant="snowman"] .monsterLimbs {
  width: 16px;
  height: 3px;
  left: 5px;
  top: 22px;
  background: #8c7ae6;
  transform: rotate(15deg);
  box-shadow: 38px -4px #8c7ae6;
  border: none;
}

.monsterEntity[data-variant="snowman"] .monsterTail {
  width: 24px;
  height: 6px;
  left: 20px;
  top: 28px;
  background: #e84118;
  border-radius: 3px;
  border: 1.5px solid #1c1511;
}

/* =======================================
   REINDEER (Renne)
   ======================================= */
.monsterEntity[data-variant="reindeer"] .monsterBody {
  width: 32px;
  height: 22px;
  left: 16px;
  top: 26px;
  background: linear-gradient(135deg, #cd6133, #8c2e0b);
  border-radius: 8px;
}

.monsterEntity[data-variant="reindeer"] .monsterHead {
  width: 16px;
  height: 18px;
  left: 28px;
  top: 12px;
  background: #cd6133;
  border-radius: 50% 50% 4px 4px;
}

.monsterEntity[data-variant="reindeer"] .monsterFace {
  width: 5px;
  height: 5px;
  left: 36px;
  top: 20px;
  background: #ff4d4d;
  box-shadow: 0 0 5px #ff4d4d;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="reindeer"] .monsterAdornment {
  width: 24px;
  height: 10px;
  left: 24px;
  top: 4px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="reindeer"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 10px;
  background: #8c2e0b;
  left: 4px;
  top: 0;
  transform: rotate(-30deg);
  box-shadow: 2px -4px #8c2e0b;
}

.monsterEntity[data-variant="reindeer"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 10px;
  background: #8c2e0b;
  right: 4px;
  top: 0;
  transform: rotate(30deg);
  box-shadow: -2px -4px #8c2e0b;
}

.monsterEntity[data-variant="reindeer"] .monsterLimbs {
  width: 4px;
  height: 14px;
  left: 18px;
  top: 46px;
  background: #cd6133;
  box-shadow: 8px 0 #cd6133, 16px 0 #cd6133, 24px 0 #cd6133;
  border-radius: 1px;
}

.monsterEntity[data-variant="reindeer"] .monsterTail {
  width: 6px;
  height: 10px;
  left: 11px;
  top: 22px;
  background: #cd6133;
  border-radius: 50%;
  transform: rotate(-30deg);
}

/* =======================================
   GLOUTON (Glouton)
   ======================================= */
.monsterEntity[data-variant="glouton"] .monsterBody {
  width: 36px;
  height: 36px;
  left: 14px;
  top: 20px;
  background: radial-gradient(circle at 35% 35%, #00a8ff, #0056b3);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 168, 255, 0.4);
}

.monsterEntity[data-variant="glouton"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="glouton"] .monsterFace {
  width: 24px;
  height: 14px;
  left: 20px;
  top: 32px;
  background: #000000;
  border-radius: 0 0 12px 12px;
  border: 1.5px solid #1c1511;
}

.monsterEntity[data-variant="glouton"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 20px;
  height: 3px;
  background: #ffffff;
  clip-path: polygon(0 0, 10% 100%, 20% 0, 30% 100%, 40% 0, 50% 100%, 60% 0, 70% 100%, 80% 0, 90% 100%, 100% 0);
  left: 1px;
  top: 0px;
}

.monsterEntity[data-variant="glouton"] .monsterFace::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #ffdd59;
  left: 4px;
  top: -14px;
  box-shadow: 10px 0 #ffdd59;
  border-radius: 50%;
}

.monsterEntity[data-variant="glouton"] .monsterAdornment {
  width: 6px;
  height: 10px;
  left: 18px;
  top: 12px;
  background: #70a1ff;
  border-radius: 50% 50% 0 0;
  transform: rotate(-25deg);
  box-shadow: 18px 8px #70a1ff;
}

.monsterEntity[data-variant="glouton"] .monsterLimbs {
  width: 8px;
  height: 8px;
  left: 18px;
  top: 52px;
  background: #0056b3;
  box-shadow: 12px 0 #0056b3;
  border-radius: 50%;
}

.monsterEntity[data-variant="glouton"] .monsterTail {
  display: none;
}

/* =======================================
   CHRISTMAS GIFT (Cadeau de Noël)
   ======================================= */
.monsterEntity[data-variant="christmas_gift"] .monsterBody {
  width: 32px;
  height: 32px;
  left: 16px;
  top: 22px;
  background: linear-gradient(135deg, #e84118, #c23616);
  border-radius: 4px;
}

.monsterEntity[data-variant="christmas_gift"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="christmas_gift"] .monsterFace {
  width: 6px;
  height: 32px;
  left: 29px;
  top: 22px;
  background: #44bd32;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="christmas_gift"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 32px;
  height: 6px;
  background: #44bd32;
  left: -13px;
  top: 13px;
}

.monsterEntity[data-variant="christmas_gift"] .monsterAdornment {
  width: 14px;
  height: 10px;
  left: 25px;
  top: 14px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="christmas_gift"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 2px solid #44bd32;
  border-radius: 50%;
  left: 0;
  transform: rotate(-45deg);
}

.monsterEntity[data-variant="christmas_gift"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 2px solid #44bd32;
  border-radius: 50%;
  right: 0;
  transform: rotate(45deg);
}

.monsterEntity[data-variant="christmas_gift"] .monsterLimbs {
  width: 6px;
  height: 10px;
  left: 20px;
  top: 52px;
  background: #ffdd59;
  box-shadow: 12px 0 #ffdd59;
  border-radius: 2px;
}

.monsterEntity[data-variant="christmas_gift"] .monsterTail {
  display: none;
}

/* =======================================
   FATHER WHIPPER (Père Fouettard - Boss)
   ======================================= */
.monsterEntity[data-variant="father_whipper"] .monsterBody {
  width: 26px;
  height: 36px;
  left: 19px;
  top: 20px;
  background: linear-gradient(180deg, #2f3542, #1e272e);
  border-radius: 6px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.7);
}

.monsterEntity[data-variant="father_whipper"] .monsterHead {
  width: 20px;
  height: 20px;
  left: 22px;
  top: 4px;
  background: #1e272e;
  border-radius: 50% 50% 2px 2px;
}

.monsterEntity[data-variant="father_whipper"] .monsterFace {
  width: 3px;
  height: 3px;
  left: 26px;
  top: 11px;
  background: #ff4757;
  box-shadow: 6px 0 #ff4757, 0 0 4px #ff4757;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="father_whipper"] .monsterAdornment {
  width: 4px;
  height: 26px;
  left: 8px;
  top: 24px;
  background: #8c7ae6;
  border-radius: 2px;
  transform: rotate(15deg);
  box-shadow: 0 0 6px rgba(140, 122, 230, 0.6);
}

.monsterEntity[data-variant="father_whipper"] .monsterLimbs {
  width: 6px;
  height: 10px;
  left: 22px;
  top: 54px;
  background: #1e272e;
  box-shadow: 8px 0 #1e272e;
  border-radius: 2px;
}

.monsterEntity[data-variant="father_whipper"] .monsterTail {
  width: 14px;
  height: 14px;
  left: 4px;
  top: 38px;
  border: 2.5px solid #8c7ae6;
  border-top: none;
  border-left: none;
  border-radius: 50%;
  transform: rotate(30deg);
  box-shadow: none;
}

/* =======================================
   MUSHROOM (Champignon)
   ======================================= */
.monsterEntity[data-variant="mushroom"] .monsterBody {
  width: 14px;
  height: 24px;
  left: 25px;
  top: 28px;
  background: #f5f6fa;
  border-radius: 4px;
}

.monsterEntity[data-variant="mushroom"] .monsterHead {
  width: 34px;
  height: 18px;
  left: 15px;
  top: 12px;
  background: radial-gradient(circle at 50% 0%, #ff4757, #ff214f);
  border-radius: 18px 18px 4px 4px;
}

.monsterEntity[data-variant="mushroom"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 29px;
  top: 34px;
  background: #000000;
  box-shadow: 4px 0 #000000;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="mushroom"] .monsterAdornment {
  width: 4px;
  height: 4px;
  left: 22px;
  top: 16px;
  background: #ffffff;
  border-radius: 50%;
  border: none;
  box-shadow: 8px -2px #ffffff, 16px 2px #ffffff;
}

.monsterEntity[data-variant="mushroom"] .monsterLimbs {
  width: 6px;
  height: 6px;
  left: 24px;
  top: 50px;
  background: #ced6e0;
  box-shadow: 10px 0 #ced6e0;
  border-radius: 50%;
}

.monsterEntity[data-variant="mushroom"] .monsterTail {
  display: none;
}

/* =======================================
   DANDELION (Pissenlit)
   ======================================= */
.monsterEntity[data-variant="dandelion"] .monsterBody {
  width: 4px;
  height: 28px;
  left: 30px;
  top: 24px;
  background: #2ed573;
}

.monsterEntity[data-variant="dandelion"] .monsterHead {
  width: 26px;
  height: 26px;
  left: 19px;
  top: 4px;
  background: radial-gradient(circle, #f1c40f, #ffdd59);
  border-radius: 50%;
  border: 1.5px dashed #ffbe0f;
  box-shadow: none;
}

.monsterEntity[data-variant="dandelion"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 14px;
  background: #000000;
  box-shadow: 6px 0 #000000;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="dandelion"] .monsterAdornment {
  width: 16px;
  height: 10px;
  left: 24px;
  top: 44px;
  background: #2ecc71;
  clip-path: polygon(50% 0, 0 100%, 100% 100%);
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="dandelion"] .monsterLimbs {
  width: 6px;
  height: 6px;
  left: 26px;
  top: 50px;
  background: #27ae60;
  box-shadow: 6px 0 #27ae60;
  border-radius: 50%;
}

.monsterEntity[data-variant="dandelion"] .monsterTail {
  display: none;
}

/* =======================================
   MILIMULOU (Milimulou)
   ======================================= */
.monsterEntity[data-variant="milimulou"] .monsterBody {
  width: 24px;
  height: 20px;
  left: 20px;
  top: 26px;
  background: linear-gradient(180deg, #747d8c, #57606f);
  border-radius: 6px;
}

.monsterEntity[data-variant="milimulou"] .monsterHead {
  width: 16px;
  height: 16px;
  left: 24px;
  top: 12px;
  background: #57606f;
  border-radius: 50%;
}

.monsterEntity[data-variant="milimulou"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 28px;
  top: 17px;
  background: #ffbe0f;
  box-shadow: 4px 0 #ffbe0f;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="milimulou"] .monsterAdornment {
  width: 4px;
  height: 6px;
  left: 23px;
  top: 7px;
  background: #747d8c;
  box-shadow: 10px 0 #747d8c;
  clip-path: polygon(50% 0, 0 100%, 100% 100%);
  border: none;
}

.monsterEntity[data-variant="milimulou"] .monsterLimbs {
  width: 5px;
  height: 12px;
  left: 22px;
  top: 44px;
  background: #57606f;
  box-shadow: 10px 0 #57606f;
  border-radius: 2px;
}

.monsterEntity[data-variant="milimulou"] .monsterTail {
  width: 6px;
  height: 12px;
  left: 15px;
  top: 22px;
  background: #747d8c;
  border-radius: 3px;
  transform: rotate(-30deg);
}

/* =======================================
   CRAQUELEUR (Craqueleur)
   ======================================= */
.monsterEntity[data-variant="craqueleur"] .monsterBody {
  width: 32px;
  height: 26px;
  left: 16px;
  top: 22px;
  background: linear-gradient(135deg, #7f8c8d, #34495e);
  border-radius: 6px;
}

.monsterEntity[data-variant="craqueleur"] .monsterHead {
  width: 18px;
  height: 16px;
  left: 23px;
  top: 8px;
  background: #7f8c8d;
  border-radius: 4px;
}

.monsterEntity[data-variant="craqueleur"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 27px;
  top: 13px;
  background: #00d2d3;
  box-shadow: 6px 0 #00d2d3, 0 0 4px #00d2d3;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="craqueleur"] .monsterAdornment {
  width: 40px;
  height: 10px;
  left: 12px;
  top: 18px;
  background: #34495e;
  border-radius: 3px;
  z-index: -1;
}

.monsterEntity[data-variant="craqueleur"] .monsterLimbs {
  width: 8px;
  height: 16px;
  left: 18px;
  top: 46px;
  background: #34495e;
  box-shadow: 18px 0 #34495e;
  border-radius: 2px;
}

.monsterEntity[data-variant="craqueleur"] .monsterTail {
  display: none;
}

/* =======================================
   FISH (Pichon)
   ======================================= */
.monsterEntity[data-variant="fish"] .monsterBody {
  width: 32px;
  height: 16px;
  left: 16px;
  top: 24px;
  background: linear-gradient(to right, #ff7f50, #1e90ff);
  border-radius: 50%;
}

.monsterEntity[data-variant="fish"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="fish"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 38px;
  top: 28px;
  background: #ffffff;
  border-radius: 50%;
  border: 1px solid #000000;
  box-shadow: none;
}

.monsterEntity[data-variant="fish"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 2px;
  background: #000000;
  left: 1px;
  top: 1px;
  border-radius: 50%;
}

.monsterEntity[data-variant="fish"] .monsterAdornment {
  width: 12px;
  height: 8px;
  left: 26px;
  top: 18px;
  background: #ff7f50;
  clip-path: polygon(50% 0, 0 100%, 100% 100%);
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="fish"] .monsterLimbs {
  width: 8px;
  height: 6px;
  left: 28px;
  top: 38px;
  background: #1e90ff;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="fish"] .monsterTail {
  width: 10px;
  height: 18px;
  left: 8px;
  top: 23px;
  background: #ff7f50;
  clip-path: polygon(100% 50%, 0 0, 0 100%);
  border: none;
}

/* =======================================
   SQUID (Kralamour)
   ======================================= */
.monsterEntity[data-variant="squid"] .monsterBody {
  width: 22px;
  height: 26px;
  left: 21px;
  top: 16px;
  background: linear-gradient(180deg, #9c27b0, #673ab7);
  border-radius: 50% 50% 0 0;
}

.monsterEntity[data-variant="squid"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="squid"] .monsterFace {
  width: 10px;
  height: 10px;
  left: 27px;
  top: 26px;
  background: radial-gradient(circle, #000000 3px, #ffffff 3px);
  border-radius: 50%;
  border: 1.5px solid #1c1511;
  box-shadow: none;
}

.monsterEntity[data-variant="squid"] .monsterAdornment {
  width: 32px;
  height: 8px;
  left: 16px;
  top: 20px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="squid"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  background: #9c27b0;
  border: 1.5px solid #1c1511;
  border-radius: 50%;
  left: 0;
}

.monsterEntity[data-variant="squid"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  background: #9c27b0;
  border: 1.5px solid #1c1511;
  border-radius: 50%;
  right: 0;
}

.monsterEntity[data-variant="squid"] .monsterLimbs {
  width: 4px;
  height: 20px;
  left: 20px;
  top: 40px;
  background: #673ab7;
  border-radius: 2px;
  box-shadow: 6px 2px 0 #673ab7, 12px 0 0 #673ab7, 18px 2px 0 #673ab7;
}

.monsterEntity[data-variant="squid"] .monsterTail {
  display: none;
}

/* =======================================
   SCARAFEUILLE (Scarafeuille)
   ======================================= */
.monsterEntity[data-variant="scarafeuille"] .monsterBody {
  width: 30px;
  height: 24px;
  left: 17px;
  top: 24px;
  background: linear-gradient(135deg, #2ecc71, #27ae60);
  border-radius: 50%;
}

.monsterEntity[data-variant="scarafeuille"] .monsterBody::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 24px;
  background: #1a5235;
  left: 14px;
  top: 0;
}

.monsterEntity[data-variant="scarafeuille"] .monsterHead {
  width: 12px;
  height: 12px;
  left: 26px;
  top: 14px;
  background: #1e824c;
  border-radius: 50%;
}

.monsterEntity[data-variant="scarafeuille"] .monsterFace {
  width: 2px;
  height: 2px;
  left: 29px;
  top: 18px;
  background: #f1c40f;
  box-shadow: 4px 0 #f1c40f;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="scarafeuille"] .monsterAdornment {
  width: 14px;
  height: 6px;
  left: 25px;
  top: 9px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="scarafeuille"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 6px;
  background: #1e824c;
  left: 2px;
  transform: rotate(-30deg);
}

.monsterEntity[data-variant="scarafeuille"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 6px;
  background: #1e824c;
  right: 2px;
  transform: rotate(30deg);
}

.monsterEntity[data-variant="scarafeuille"] .monsterLimbs {
  width: 4px;
  height: 10px;
  left: 20px;
  top: 44px;
  background: #1a5235;
  box-shadow: 6px 0 #1a5235, 14px 0 #1a5235, 20px 0 #1a5235;
  border-radius: 1px;
}

.monsterEntity[data-variant="scarafeuille"] .monsterTail {
  display: none;
}

/* =======================================
   TOAD (Crapaud)
   ======================================= */
.monsterEntity[data-variant="toad"] .monsterBody {
  width: 32px;
  height: 20px;
  left: 16px;
  top: 30px;
  background: linear-gradient(180deg, #78e08f, #38ae53);
  border-radius: 12px 12px 8px 8px;
}

.monsterEntity[data-variant="toad"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="toad"] .monsterFace {
  width: 8px;
  height: 8px;
  left: 20px;
  top: 24px;
  background: #f1c40f;
  border-radius: 50%;
  border: 1.5px solid #1c1511;
  box-shadow: 12px 0 #f1c40f;
}

.monsterEntity[data-variant="toad"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  background: #000000;
  left: 2px;
  top: 2px;
  border-radius: 50%;
  box-shadow: 12px 0 #000000;
}

.monsterEntity[data-variant="toad"] .monsterAdornment {
  width: 4px;
  height: 4px;
  left: 24px;
  top: 34px;
  background: #e67e22;
  border-radius: 50%;
  border: none;
  box-shadow: 12px 2px #e67e22, 6px -2px #e67e22;
}

.monsterEntity[data-variant="toad"] .monsterLimbs {
  width: 6px;
  height: 12px;
  left: 12px;
  top: 38px;
  background: #38ae53;
  border-radius: 3px;
  transform: rotate(-30deg);
  box-shadow: 28px -16px 0 #38ae53;
}

.monsterEntity[data-variant="toad"] .monsterLimbs::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 12px;
  background: #38ae53;
  left: 22px;
  top: -14px;
  transform: rotate(60deg);
}

.monsterEntity[data-variant="toad"] .monsterTail {
  display: none;
}

/* =======================================
   DRAGOEUF (Dragoeuf)
   ======================================= */
.monsterEntity[data-variant="dragoeuf"] .monsterBody {
  width: 24px;
  height: 26px;
  left: 20px;
  top: 24px;
  background: #f1c40f;
  border-radius: 6px;
}

.monsterEntity[data-variant="dragoeuf"] .monsterHead {
  width: 18px;
  height: 18px;
  left: 23px;
  top: 10px;
  background: #f1c40f;
  border-radius: 8px 8px 4px 4px;
}

.monsterEntity[data-variant="dragoeuf"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 26px;
  top: 14px;
  background: #ffffff;
  border-radius: 50%;
  border: 1px solid #000000;
  box-shadow: 6px 0 #ffffff;
}

.monsterEntity[data-variant="dragoeuf"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 2px;
  height: 2px;
  background: #000000;
  left: 1px;
  top: 1px;
  border-radius: 50%;
  box-shadow: 6px 0 #000000;
}

.monsterEntity[data-variant="dragoeuf"] .monsterAdornment {
  width: 28px;
  height: 12px;
  left: 18px;
  top: 38px;
  background: #f5f6fa;
  border-radius: 0 0 6px 6px;
  border: 1.5px solid #1c1511;
  clip-path: polygon(0 0, 20% 50%, 40% 0, 60% 50%, 80% 0, 100% 50%, 100% 100%, 0 100%);
  box-shadow: none;
}

.monsterEntity[data-variant="dragoeuf"] .monsterLimbs {
  width: 6px;
  height: 8px;
  left: 22px;
  top: 48px;
  background: #f1c40f;
  box-shadow: 10px 0 #f1c40f;
  border-radius: 2px;
}

.monsterEntity[data-variant="dragoeuf"] .monsterTail {
  width: 12px;
  height: 8px;
  left: 12px;
  top: 34px;
  background: #d35400;
  border-radius: 50%;
  transform: rotate(-20deg);
}

/* =======================================
   SCORIA (Scoria)
   ======================================= */
.monsterEntity[data-variant="scoria"] .monsterBody {
  width: 28px;
  height: 28px;
  left: 18px;
  top: 22px;
  background: linear-gradient(135deg, #2f3542, #1e272e);
  border-radius: 4px;
  box-shadow: 0 0 10px #ff4757;
}

.monsterEntity[data-variant="scoria"] .monsterHead {
  display: none;
}

.monsterEntity[data-variant="scoria"] .monsterFace {
  width: 20px;
  height: 4px;
  left: 22px;
  top: 32px;
  background: #ff4757;
  box-shadow: 0 -8px #ff7f50, 0 8px #ff9f43;
  border-radius: 2px;
  border: none;
}

.monsterEntity[data-variant="scoria"] .monsterAdornment {
  width: 10px;
  height: 10px;
  left: 27px;
  top: 6px;
  background: radial-gradient(circle, #ff9f43, #ff4757);
  border-radius: 50% 50% 0 50%;
  transform: rotate(-45deg);
  box-shadow: 0 0 8px #ff9f43;
  border: none;
}

.monsterEntity[data-variant="scoria"] .monsterLimbs {
  width: 4px;
  height: 6px;
  left: 22px;
  top: 50px;
  background: #ff4757;
  box-shadow: 16px 0 #ff4757;
  border-radius: 50%;
  border: none;
}

.monsterEntity[data-variant="scoria"] .monsterTail {
  display: none;
}

/* =======================================
   PLUME OR (Plume d'or)
   ======================================= */
.monsterEntity[data-variant="plume_or"] .monsterBody {
  width: 24px;
  height: 24px;
  left: 20px;
  top: 24px;
  background: linear-gradient(135deg, #ffd700, #ff9f43);
  border-radius: 50%;
  box-shadow: 0 0 12px rgba(255, 215, 0, 0.6);
}

.monsterEntity[data-variant="plume_or"] .monsterHead {
  width: 14px;
  height: 14px;
  left: 28px;
  top: 14px;
  background: #ffd700;
  border-radius: 50%;
}

.monsterEntity[data-variant="plume_or"] .monsterFace {
  width: 4px;
  height: 4px;
  left: 38px;
  top: 18px;
  background: #e67e22;
  clip-path: polygon(0 50%, 100% 0, 100% 100%);
  transform: rotate(180deg);
  border: none;
}

.monsterEntity[data-variant="plume_or"] .monsterFace::before {
  content: "";
  position: absolute;
  width: 1.5px;
  height: 1.5px;
  background: #000000;
  left: 2px;
  top: -4px;
  border-radius: 50%;
}

.monsterEntity[data-variant="plume_or"] .monsterAdornment {
  width: 36px;
  height: 12px;
  left: 14px;
  top: 20px;
  background: transparent;
  border: none;
  box-shadow: none;
}

.monsterEntity[data-variant="plume_or"] .monsterAdornment::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 10px;
  background: #ffd700;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  left: 0;
  transform: rotate(-30deg);
}

.monsterEntity[data-variant="plume_or"] .monsterAdornment::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 10px;
  background: #ffd700;
  border: 1.5px solid #1c1511;
  border-radius: 50% 50% 0 0;
  right: 0;
  transform: rotate(30deg);
}

.monsterEntity[data-variant="plume_or"] .monsterLimbs {
  width: 2px;
  height: 12px;
  left: 24px;
  top: 46px;
  background: #ff9f43;
  box-shadow: 8px 0 #ff9f43;
  border-radius: 1px;
  border: none;
}

.monsterEntity[data-variant="plume_or"] .monsterTail {
  width: 12px;
  height: 14px;
  left: 12px;
  top: 30px;
  background: #ff9f43;
  clip-path: polygon(100% 50%, 0 0, 0 100%);
  border: none;
}

/* =======================================
   CLOUD (Nuage)
   ======================================= */
.monsterEntity[data-variant="cloud"] .monsterBody {
  width: 38px;
  height: 22px;
  left: 13px;
  top: 24px;
  background: radial-gradient(circle, #ffffff, #e3f2fd);
  border-radius: 12px;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}

.monsterEntity[data-variant="cloud"] .monsterBody::before {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  background: #ffffff;
  border-radius: 50%;
  left: 4px;
  top: -10px;
  border-top: 1.5px solid #b0bec5;
  border-left: 1.5px solid #b0bec5;
}

.monsterEntity[data-variant="cloud"] .monsterBody::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  right: 4px;
  top: -12px;
  border-top: 1.5px solid #b0bec5;
  border-right: 1.5px solid #b0bec5;
}

.monsterEntity[data-variant="cloud"] .monsterHead,
.monsterEntity[data-variant="cloud"] .monsterFace,
.monsterEntity[data-variant="cloud"] .monsterAdornment,
.monsterEntity[data-variant="cloud"] .monsterLimbs,
.monsterEntity[data-variant="cloud"] .monsterTail {
  display: none;
}

/* =======================================
   EVEILAM SOULS / AMES SPECIALE VISUELS
   ======================================= */
@keyframes soulFloat {
  0% {
    transform: translateY(0px) scale(1);
    filter: drop-shadow(0 0 4px rgba(129, 236, 236, 0.7)) brightness(1.2);
  }
  50% {
    transform: translateY(-5px) scale(1.03);
    filter: drop-shadow(0 0 12px rgba(129, 236, 236, 0.95)) brightness(1.4);
  }
  100% {
    transform: translateY(0px) scale(1);
    filter: drop-shadow(0 0 4px rgba(129, 236, 236, 0.7)) brightness(1.2);
  }
}

.monsterEntity[data-biome*="eveilam"] {
  opacity: 0.85;
}

.monsterEntity[data-biome*="eveilam"] .monsterSprite {
  animation: soulFloat 3s ease-in-out infinite;
}

.monsterEntity[data-biome*="eveilam"] .monsterSprite div:not(.monsterShadow) {
  box-shadow: 0 0 8px rgba(129, 236, 236, 0.7) !important;
  background: rgba(129, 236, 236, 0.75) !important;
  border-color: #81ecec !important;
}

@keyframes bossSoulFloat {
  0% {
    transform: translateY(0px) scale(1);
    filter: drop-shadow(0 0 8px rgba(162, 155, 254, 0.8)) brightness(1.3);
  }
  50% {
    transform: translateY(-8px) scale(1.05);
    filter: drop-shadow(0 0 20px rgba(162, 155, 254, 1)) brightness(1.6);
  }
  100% {
    transform: translateY(0px) scale(1);
    filter: drop-shadow(0 0 8px rgba(162, 155, 254, 0.8)) brightness(1.3);
  }
}

.monsterEntity[data-biome*="eveilam"].is-boss {
  opacity: 0.95;
}

.monsterEntity[data-biome*="eveilam"].is-boss .monsterSprite {
  animation: bossSoulFloat 4s ease-in-out infinite;
}

.monsterEntity[data-biome*="eveilam"].is-boss .monsterSprite div:not(.monsterShadow) {
  background: rgba(162, 155, 254, 0.8) !important;
  border-color: #a29bfe !important;
  box-shadow: 0 0 12px rgba(162, 155, 254, 0.8) !important;
}

/* =============================================================================
   MONSTER FACING & PROFILE VIEWS OVERRIDES
   ============================================================================= */
.monsterSprite.facing-left {
  scale: -1 1 !important;
}

.monsterSprite.facing-side .monsterBody {
  transform: scaleX(0.7) !important;
}

.monsterSprite.facing-side .monsterHead {
  transform: scaleX(0.8) translateX(2px) !important;
}

.monsterSprite.facing-side .monsterFace {
  transform: translateX(4px) scaleX(0.8) !important;
}

/* =============================================================================
   COMBAT PREPARATION POPUP ON MAP
   ============================================================================= */
.monsterEntity.in-combat-prep {
  width: 320px !important;
  min-height: 120px;
  background: rgba(22, 17, 13, 0.95) !important;
  border: 2px solid var(--ui-gold, #d8b46a) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.8), 0 0 10px rgba(216, 180, 106, 0.3) !important;
  padding: 8px 12px !important;
  transform: translate(-50%, -100%) !important;
  transform-origin: 50% 100% !important;
  z-index: 100 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.monsterEntity.in-combat-prep:hover {
  filter: none !important;
}

.combat-prep-title {
  color: var(--ui-gold, #d8b46a);
  font-size: 0.85rem;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  border-bottom: 1px solid rgba(216, 180, 106, 0.2);
  padding-bottom: 4px;
  font-family: 'Outfit', sans-serif;
  letter-spacing: 0.5px;
}

.combat-prep-sides {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.combat-prep-side {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.combat-prep-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  background: rgba(255, 255, 255, 0.03);
  padding: 2px 4px;
  border-radius: 4px;
}

.prep-sword-icon {
  font-size: 0.85rem;
  display: flex;
  align-items: center;
}

.prep-side-label {
  font-size: 0.75rem;
  font-weight: bold;
  color: #efe6d2;
}

.combat-prep-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-height: 40px;
  max-height: 80px;
  overflow-y: auto;
  padding: 4px;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
}

.prep-entity-name {
  font-size: 0.73rem;
  color: #ccc;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
}

.prep-entity-name svg {
  flex-shrink: 0 !important;
  margin-right: 0 !important;
}

.prep-empty {
  font-size: 0.7rem;
  color: #777;
  font-style: italic;
  text-align: center;
  margin-top: 10px;
}

.combat-prep-vs {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: bold;
  color: var(--ui-gold, #d8b46a);
  opacity: 0.6;
}

/* Button Customization for Prep */
.friendlyJoinBtn {
  background: linear-gradient(135deg, #2980b9, #3498db) !important;
  border: 1px solid #3498db !important;
  color: #fff !important;
  font-size: 0.75rem !important;
  font-weight: bold !important;
  padding: 4px 6px !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.5) !important;
  transition: all 0.2s ease !important;
  width: 100% !important;
}

.friendlyJoinBtn:hover {
  background: linear-gradient(135deg, #3498db, #2980b9) !important;
  transform: scale(1.03) !important;
}

.enemyJoinBtn {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #666 !important;
  font-size: 0.75rem !important;
  font-weight: bold !important;
  padding: 4px 6px !important;
  border-radius: 4px !important;
  cursor: not-allowed !important;
  width: 100% !important;
}