/* Dumpling shape — gyoza / squishy style */
.dumpling {
  --dumpling-pleat-light: rgba(255, 255, 255, 0.36);
  --dumpling-pleat-fill: var(--dumpling-pleat-light);
  --dumpling-pleat-line: rgba(80, 52, 62, 0.22);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  transform: translateY(0) scale(var(--slime-scale, 1));
  transition: transform 180ms var(--ease-bounce), filter 180ms var(--ease-smooth);
  will-change: transform;
}

.dumpling--physics {
  animation: none !important;
  transition: none;
  z-index: 5;
}

.dumpling--dragging {
  cursor: grabbing;
  filter: drop-shadow(0 20px 18px rgba(111, 73, 93, 0.2));
}

.dumpling--returning-home {
  transition: transform 540ms cubic-bezier(0.2, 0.95, 0.25, 1.18), filter 220ms var(--ease-smooth);
}

.dumpling::before {
  content: '';
  position: absolute;
  inset: 8%;
  border-radius: 50%;
  background: transparent;
  filter: blur(14px);
  opacity: 0;
  pointer-events: none;
}

.dumpling::after {
  content: '';
  position: absolute;
  left: 15%;
  right: 15%;
  top: auto;
  bottom: 2%;
  height: 16%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(111, 73, 93, 0.22), transparent 70%);
  opacity: 0.7;
  pointer-events: none;
  z-index: 0;
}

.dumpling--sm { width: 48px; height: 40px; }
.dumpling--md { width: 120px; height: 100px; }
.dumpling--lg { width: 180px; height: 150px; }

.dumpling__body {
  position: absolute;
  width: 86%;
  height: 70%;
  top: 24%;
  border-radius: 48% 52% 38% 40% / 58% 60% 36% 34%;
  z-index: 2;
  overflow: visible;
  border: 1px solid rgba(80, 52, 62, 0.12);
  transform-origin: center bottom;
}

.dumpling__body::after {
  content: '';
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: -3%;
  height: 14%;
  border-radius: 50%;
  background: rgba(90, 55, 65, 0.1);
  filter: blur(2px);
  pointer-events: none;
}

.dumpling__highlight {
  position: absolute;
  left: 17%;
  top: 17%;
  width: 22%;
  height: 17%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255, 255, 255, 0.64), rgba(255, 255, 255, 0.14) 62%, transparent 72%);
  transform: rotate(-20deg);
  pointer-events: none;
  z-index: 1;
}

/* Kawaii face */
.dumpling__face {
  position: absolute;
  inset: 26% 8% 8%;
  z-index: 2;
  pointer-events: none;
}

.dumpling__eye {
  position: absolute;
  top: 18%;
  width: 22%;
  aspect-ratio: 1;
  background: #1a1a2e;
  border-radius: 50%;
}

.dumpling__eye--left { left: 18%; }
.dumpling__eye--right { right: 18%; }

.dumpling__eye-highlight {
  position: absolute;
  top: 18%;
  left: 22%;
  width: 38%;
  height: 38%;
  background: #fff;
  border-radius: 50%;
}

.dumpling__eye-highlight::after {
  content: '';
  position: absolute;
  bottom: -60%;
  right: -20%;
  width: 28%;
  height: 28%;
  background: #fff;
  border-radius: 50%;
}

.dumpling__cheek {
  position: absolute;
  top: 48%;
  width: 20%;
  height: 12%;
  background: rgba(255, 140, 160, 0.55);
  border-radius: 50%;
}

.dumpling__cheek--left { left: 12%; }
.dumpling__cheek--right { right: 12%; }

.dumpling__mouth {
  position: absolute;
  left: 50%;
  top: 58%;
  transform: translateX(-50%);
  width: 18%;
  height: 10%;
  border: 2.5px solid #1a1a2e;
  border-top: none;
  border-radius: 0 0 50% 50% / 0 0 100% 100%;
  background: transparent;
}

/* Size tweaks */
.dumpling--sm .dumpling__mouth {
  border-width: 1.5px;
}

.dumpling--sm .dumpling__cheek {
  opacity: 0.7;
}

/* Dark dumpling — white eyes with dark pupils */
.dumpling--negro .dumpling__eye {
  background: #fff;
}

.dumpling--negro .dumpling__eye-highlight {
  display: none;
}

.dumpling--negro .dumpling__eye::before {
  content: '';
  position: absolute;
  top: 16%;
  left: 20%;
  width: 32%;
  height: 32%;
  background: #fff;
  border-radius: 50%;
  z-index: 2;
}

.dumpling--negro .dumpling__eye::after {
  content: '';
  position: absolute;
  bottom: 12%;
  left: 50%;
  transform: translateX(-50%);
  width: 58%;
  height: 58%;
  background: #1a1a2e;
  border-radius: 50%;
}

.dumpling--negro .dumpling__mouth {
  border-color: #f0f0f0;
}

.dumpling--placeholder .dumpling__face {
  opacity: 0.25;
}

.dumpling__pleats {
  display: none;
}

.dumpling__pleat {
  position: absolute;
  bottom: 2%;
  border-radius: 50% 50% 42% 42% / 82% 82% 28% 28%;
  background:
    radial-gradient(ellipse at 38% 18%, rgba(255, 255, 255, 0.28), transparent 46%),
    var(--dumpling-pleat-fill);
  border-top: 1px solid rgba(255, 255, 255, 0.24);
  box-shadow:
    inset 0 -5px 6px rgba(80, 52, 62, 0.12),
    inset 0 2px 4px rgba(255, 255, 255, 0.2);
  transform-origin: center bottom;
}

.dumpling__pleat--1 {
  left: 10%;
  width: 20%;
  height: 54%;
  transform: rotate(-28deg) skewX(-4deg);
}

.dumpling__pleat--2 {
  left: 25%;
  bottom: 8%;
  width: 19%;
  height: 68%;
  transform: rotate(-14deg) skewX(-3deg);
}

.dumpling__pleat--3 {
  left: 41%;
  bottom: 11%;
  width: 18%;
  height: 76%;
  transform: scaleY(1.02);
}

.dumpling__pleat--4 {
  left: 56%;
  bottom: 8%;
  width: 19%;
  height: 68%;
  transform: rotate(14deg) skewX(3deg);
}

.dumpling__pleat--5 {
  left: 70%;
  width: 20%;
  height: 54%;
  transform: rotate(28deg) skewX(4deg);
}

.dumpling__pleat-line {
  position: absolute;
  bottom: -1%;
  width: 17%;
  height: 64%;
  border-left: 2px solid var(--dumpling-pleat-line);
  border-radius: 50% 0 0 50%;
  opacity: 0.58;
  transform-origin: bottom center;
}

.dumpling__pleat-line--1 { left: 24%; transform: rotate(18deg); }
.dumpling__pleat-line--2 { left: 38%; transform: rotate(7deg); }
.dumpling__pleat-line--3 { left: 53%; transform: rotate(-7deg) scaleX(-1); }
.dumpling__pleat-line--4 { left: 67%; transform: rotate(-18deg) scaleX(-1); }

.dumpling__pleats::after {
  content: '';
  position: absolute;
  left: 18%;
  right: 18%;
  bottom: 0;
  height: 30%;
  border-radius: 0 0 50% 50%;
  background: linear-gradient(180deg, transparent, rgba(80, 52, 62, 0.06));
}

.dumpling--sm .dumpling__pleats {
  top: 3%;
  height: 40%;
}

.dumpling--sm .dumpling__pleat-line {
  border-left-width: 1px;
  opacity: 0.72;
}

/* Color variants */
.dumpling--rojo .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #ff6b6b, var(--color-rojo) 50%, var(--color-rojo-dark));
}
.dumpling--rojo .dumpling__pleats {
  --dumpling-pleat-light: #ff9a9a;
  --dumpling-pleat-fill: linear-gradient(180deg, #ff8a8a, var(--color-rojo));
  --dumpling-pleat-line: rgba(145, 35, 48, 0.34);
}

.dumpling--naranja .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #ffb347, var(--color-naranja) 50%, var(--color-naranja-dark));
}
.dumpling--naranja .dumpling__pleats {
  --dumpling-pleat-light: #ffc875;
  --dumpling-pleat-fill: linear-gradient(180deg, #ffbe68, var(--color-naranja));
  --dumpling-pleat-line: rgba(166, 82, 12, 0.32);
}

.dumpling--amarillo .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #fff3a0, var(--color-amarillo) 50%, var(--color-amarillo-dark));
}
.dumpling--amarillo .dumpling__pleats {
  --dumpling-pleat-light: #fff7b8;
  --dumpling-pleat-fill: linear-gradient(180deg, #fff1a0, var(--color-amarillo));
  --dumpling-pleat-line: rgba(170, 140, 24, 0.28);
}

.dumpling--verde .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #6ee7a0, var(--color-verde) 50%, var(--color-verde-dark));
}
.dumpling--verde .dumpling__pleats {
  --dumpling-pleat-light: #95f0ba;
  --dumpling-pleat-fill: linear-gradient(180deg, #8eeab4, var(--color-verde));
  --dumpling-pleat-line: rgba(31, 132, 74, 0.3);
}

.dumpling--azul .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #7ec8ff, var(--color-azul) 50%, var(--color-azul-dark));
}
.dumpling--azul .dumpling__pleats {
  --dumpling-pleat-light: #9ed9ff;
  --dumpling-pleat-fill: linear-gradient(180deg, #8dd0ff, var(--color-azul));
  --dumpling-pleat-line: rgba(38, 92, 150, 0.32);
}

.dumpling--morado .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #c77dff, var(--color-morado) 50%, var(--color-morado-dark));
}
.dumpling--morado .dumpling__pleats {
  --dumpling-pleat-light: #dab0ff;
  --dumpling-pleat-fill: linear-gradient(180deg, #c996ff, var(--color-morado));
  --dumpling-pleat-line: rgba(97, 54, 145, 0.32);
}

.dumpling--rosa .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #ffb3c6, var(--color-rosa) 50%, var(--color-rosa-dark));
}
.dumpling--rosa .dumpling__pleats {
  --dumpling-pleat-light: #ffc7d6;
  --dumpling-pleat-fill: linear-gradient(180deg, #ffbad0, var(--color-rosa));
  --dumpling-pleat-line: rgba(168, 74, 102, 0.28);
}

.dumpling--blanco .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #ffffff, var(--color-blanco) 50%, var(--color-blanco-dark));
  box-shadow: inset 0 -4px 8px rgba(0, 0, 0, 0.08);
}
.dumpling--blanco .dumpling__pleats {
  --dumpling-pleat-light: #ffffff;
  --dumpling-pleat-fill: linear-gradient(180deg, #ffffff, var(--color-blanco));
  --dumpling-pleat-line: rgba(148, 130, 116, 0.28);
}

.dumpling--negro .dumpling__body {
  background: radial-gradient(ellipse at 35% 30%, #4a4e69, var(--color-negro) 50%, var(--color-negro-dark));
}
.dumpling--negro .dumpling__pleats {
  --dumpling-pleat-light: #5b607c;
  --dumpling-pleat-fill: linear-gradient(180deg, #4a4e69, var(--color-negro));
  --dumpling-pleat-line: rgba(235, 238, 255, 0.28);
}

.dumpling--dorado .dumpling__body {
  background: radial-gradient(ellipse at 35% 25%, var(--color-dorado-light), var(--color-dorado) 45%, var(--color-dorado-dark));
}
.dumpling--dorado .dumpling__pleats {
  --dumpling-pleat-light: #ffe891;
  --dumpling-pleat-fill: linear-gradient(180deg, var(--color-dorado-light), var(--color-dorado));
  --dumpling-pleat-line: rgba(148, 96, 10, 0.3);
}

.dumpling--arcoiris .dumpling__body {
  background:
    radial-gradient(ellipse at 30% 20%, rgba(255, 255, 255, 0.9) 0 13%, transparent 26%),
    radial-gradient(ellipse at 55% 12%, rgba(255, 255, 255, 0.6) 0 9%, transparent 20%),
    linear-gradient(155deg,
      #ff83b2 0%,
      #ff9f7a 18%,
      #ffe96d 35%,
      #92f2b1 50%,
      #55d7f3 66%,
      #a284ff 82%,
      #ff72c9 100%);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow:
    inset 0 8px 15px rgba(255, 255, 255, 0.52),
    inset 0 -10px 18px rgba(179, 56, 150, 0.2),
    0 0 22px rgba(255, 124, 201, 0.28),
    0 0 38px rgba(86, 215, 243, 0.2),
    0 10px 24px rgba(111, 73, 93, 0.22);
}

.dumpling--arcoiris .dumpling__body::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(105deg, transparent 0 20%, rgba(255, 255, 255, 0.36) 30%, transparent 42%),
    radial-gradient(ellipse at 25% 38%, rgba(255, 255, 255, 0.5) 0 8%, transparent 17%),
    radial-gradient(ellipse at 58% 26%, rgba(255, 255, 255, 0.42) 0 7%, transparent 16%);
  mix-blend-mode: screen;
  opacity: 0.9;
  pointer-events: none;
  z-index: 1;
}

.dumpling--arcoiris .dumpling__face {
  z-index: 3;
}

.dumpling--arcoiris .dumpling__eye {
  width: 24%;
  background:
    radial-gradient(circle at 34% 28%, #fff 0 18%, transparent 19%),
    radial-gradient(circle at 68% 72%, rgba(255, 255, 255, 0.92) 0 7%, transparent 8%),
    #111225;
  box-shadow: 0 2px 5px rgba(19, 18, 37, 0.26);
}

.dumpling--arcoiris .dumpling__eye-highlight {
  display: none;
}

.dumpling--arcoiris .dumpling__cheek {
  top: 50%;
  width: 23%;
  height: 16%;
  background: radial-gradient(ellipse, #ff7ca6 0 54%, rgba(255, 124, 166, 0.32) 72%, transparent 100%);
  opacity: 0.92;
}

.dumpling--arcoiris .dumpling__mouth {
  top: 58%;
  width: 23%;
  height: 20%;
  border: 0;
  border-radius: 0 0 58% 58% / 0 0 92% 92%;
  background:
    radial-gradient(ellipse at 50% 78%, #ff7a9e 0 28%, transparent 30%),
    #111225;
  box-shadow: inset 0 -2px 0 rgba(255, 255, 255, 0.22);
}

.dumpling__rainbow-badge {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
  z-index: 2;
}

.dumpling__rainbow-sparkle {
  position: absolute;
  width: 4.8%;
  aspect-ratio: 1;
  background: #fffef4;
  clip-path: polygon(50% 0%, 62% 36%, 100% 50%, 62% 64%, 50% 100%, 38% 64%, 0% 50%, 38% 36%);
  box-shadow:
    0 0 6px rgba(255, 255, 255, 0.82),
    0 0 12px rgba(255, 234, 128, 0.38);
  animation: rainbowBadgeSparkle 2.4s ease-in-out infinite;
}

.dumpling__rainbow-sparkle--0 { left: 20%; top: 22%; animation-delay: 0s; }
.dumpling__rainbow-sparkle--1 { left: 42%; top: 34%; animation-delay: -0.25s; width: 3.2%; }
.dumpling__rainbow-sparkle--2 { left: 68%; top: 24%; animation-delay: -0.5s; }
.dumpling__rainbow-sparkle--3 { left: 17%; top: 56%; animation-delay: -0.75s; width: 3.6%; }
.dumpling__rainbow-sparkle--4 { left: 55%; top: 54%; animation-delay: -1s; width: 4.2%; }
.dumpling__rainbow-sparkle--5 { left: 78%; top: 60%; animation-delay: -1.25s; width: 3.4%; }
.dumpling__rainbow-sparkle--6 { left: 36%; top: 72%; animation-delay: -1.5s; width: 3%; }

.dumpling--fuego .dumpling__body {
  background:
    radial-gradient(ellipse at 48% 18%, #fffdf4 0 8%, #fff0a6 12%, transparent 24%),
    radial-gradient(ellipse at 30% 38%, rgba(255, 249, 190, 0.95) 0 10%, transparent 25%),
    radial-gradient(ellipse at 66% 36%, rgba(255, 207, 92, 0.9) 0 12%, transparent 27%),
    radial-gradient(ellipse at 50% 64%, #fff079 0%, #ffb12f 24%, #ff611f 50%, #d51f17 72%, #5f0712 100%);
  box-shadow:
    inset 0 11px 16px rgba(255, 255, 255, 0.42),
    inset 0 -12px 18px rgba(102, 8, 10, 0.25),
    0 0 18px rgba(255, 239, 109, 0.54),
    0 0 34px rgba(255, 122, 31, 0.46),
    0 0 58px rgba(255, 45, 31, 0.26);
  overflow: hidden;
  animation: llamitaGlow 1.45s ease-in-out infinite;
}

.dumpling--fuego::before {
  inset: -18%;
  background:
    radial-gradient(ellipse at 50% 54%, rgba(255, 237, 113, 0.82), rgba(255, 113, 31, 0.42) 34%, rgba(255, 45, 31, 0.18) 56%, transparent 74%);
  opacity: 0.92;
  filter: blur(10px);
  animation: llamitaAura 1.2s ease-in-out infinite;
}

.dumpling--fuego .dumpling__body::before {
  content: '';
  position: absolute;
  inset: -18% 1% 3%;
  border-radius: inherit;
  background:
    radial-gradient(ellipse at 25% 56%, rgba(255, 255, 194, 0.88) 0 8%, transparent 20%),
    radial-gradient(ellipse at 43% 34%, rgba(255, 246, 139, 0.78) 0 9%, transparent 22%),
    radial-gradient(ellipse at 58% 47%, rgba(255, 255, 205, 0.72) 0 8%, transparent 20%),
    radial-gradient(ellipse at 75% 60%, rgba(255, 193, 72, 0.62) 0 9%, transparent 22%),
    conic-gradient(from 210deg at 50% 46%, transparent 0 9%, rgba(255, 246, 112, 0.65) 12% 20%, transparent 25% 34%, rgba(255, 115, 31, 0.48) 39% 48%, transparent 54% 65%, rgba(255, 232, 92, 0.52) 70% 80%, transparent 86% 100%);
  mix-blend-mode: screen;
  opacity: 0.9;
  transform-origin: center bottom;
  animation: llamitaFlicker 0.9s ease-in-out infinite;
  pointer-events: none;
  z-index: 1;
}

.dumpling--fuego .dumpling__highlight {
  background: radial-gradient(ellipse, rgba(255, 255, 255, 0.9), rgba(255, 249, 171, 0.36) 58%, transparent 74%);
  filter: blur(0.2px);
}

.dumpling--fuego .dumpling__face {
  z-index: 3;
}

.dumpling--transparente .dumpling__body {
  background:
    radial-gradient(ellipse at 30% 22%, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.2) 24%, transparent 46%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.22), rgba(130, 230, 255, 0.08) 48%, rgba(255, 255, 255, 0.04));
  border: 2px solid rgba(255, 255, 255, 0.72);
  box-shadow:
    inset 0 6px 12px rgba(255, 255, 255, 0.48),
    inset 0 -8px 16px rgba(130, 210, 255, 0.12),
    0 0 18px rgba(255, 255, 255, 0.34);
  opacity: 0.72;
  backdrop-filter: blur(1px);
}

.dumpling--arcoiris .dumpling__pleats {
  --dumpling-pleat-light: rgba(255, 255, 255, 0.76);
  --dumpling-pleat-fill: conic-gradient(from 210deg, #ff5f8f, #ffd76b, #66e6a7, #5fd6ff, #9d7cff, #ff5f8f);
  --dumpling-pleat-line: rgba(92, 59, 122, 0.26);
}

.dumpling--fuego .dumpling__pleats {
  --dumpling-pleat-light: #fff0a6;
  --dumpling-pleat-fill: linear-gradient(180deg, #fff0a6, #ff8a1f 58%, #ff3b1f);
  --dumpling-pleat-line: rgba(160, 48, 12, 0.34);
}

.dumpling--transparente .dumpling__pleats {
  --dumpling-pleat-light: rgba(255, 255, 255, 0.58);
  --dumpling-pleat-fill: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(130, 230, 255, 0.18));
  --dumpling-pleat-line: rgba(150, 220, 255, 0.32);
}

/* Rarity: Normal — smooth matte */
.dumpling--normal .dumpling__body {
  filter: saturate(0.92) brightness(1.04);
  box-shadow:
    inset 0 -6px 12px rgba(0, 0, 0, 0.12),
    inset 0 3px 8px rgba(255, 255, 255, 0.18),
    0 8px 18px rgba(0, 0, 0, 0.22);
}

.dumpling--normal::before {
  content: none;
  display: none;
}


/* Rarity: Raro — super squishy jelly */
.dumpling--raro {
  animation: floatSquish 3s ease-in-out infinite;
}

.dumpling--raro::before {
  display: none;
}

.dumpling--raro .dumpling__body {
  animation: squishDeform 2s ease-in-out infinite;
  overflow: hidden;
  box-shadow:
    inset 0 -8px 16px rgba(0, 0, 0, 0.12),
    0 12px 30px rgba(0, 0, 0, 0.2),
    0 0 22px rgba(19, 242, 208, 0.24),
    0 0 36px rgba(157, 53, 255, 0.16);
  filter: saturate(1.18) brightness(1.04);
}

.dumpling--raro .dumpling__body::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 18% 30%, rgba(255, 255, 255, 0.5) 0 4.5%, transparent 6.5%),
    radial-gradient(circle at 28% 58%, rgba(255, 255, 255, 0.36) 0 3.5%, transparent 5.5%),
    radial-gradient(circle at 38% 40%, rgba(255, 255, 255, 0.42) 0 5%, transparent 7%),
    radial-gradient(circle at 46% 72%, rgba(255, 255, 255, 0.34) 0 4%, transparent 6%),
    radial-gradient(circle at 58% 28%, rgba(255, 255, 255, 0.46) 0 4.5%, transparent 6.5%),
    radial-gradient(circle at 66% 56%, rgba(255, 255, 255, 0.38) 0 5.5%, transparent 7.5%),
    radial-gradient(circle at 78% 38%, rgba(255, 255, 255, 0.44) 0 4%, transparent 6%),
    radial-gradient(circle at 82% 72%, rgba(255, 255, 255, 0.32) 0 3.8%, transparent 5.8%),
    radial-gradient(circle at 22% 78%, rgba(255, 255, 255, 0.3) 0 3.2%, transparent 5.2%);
  mix-blend-mode: screen;
  opacity: 0.95;
  animation: bubbleDrift 2.8s ease-in-out infinite;
  pointer-events: none;
}

.dumpling--sleepy .dumpling__body {
  filter: saturate(0.7) brightness(1.08);
  animation: sleepyFloat 2.8s ease-in-out infinite;
}

.dumpling--sleepy .dumpling__eye,
.dumpling--sleepy .dumpling__eye::before,
.dumpling--sleepy .dumpling__eye::after {
  height: 6%;
  top: 28%;
  border-radius: 999px;
}

.dumpling--sleepy .dumpling__mouth {
  width: 14%;
  top: 64%;
  border-radius: 999px;
  border-top: 2.5px solid #1a1a2e;
  border-bottom: none;
}

.dumpling--sleepy::after {
  content: 'Zzz';
  left: auto;
  right: 8%;
  top: -8%;
  width: auto;
  height: auto;
  background: transparent;
  opacity: 1;
  color: rgba(90, 110, 155, 0.82);
  font-weight: 900;
  font-size: 0.9rem;
  animation: zzzFloat 1.8s ease-in-out infinite;
}

.dumpling--laughing .dumpling__body {
  animation: laughSquash 0.42s ease-in-out infinite;
}

.dumpling--laughing .dumpling__mouth {
  width: 28%;
  height: 18%;
  top: 60%;
  border-radius: 0 0 60% 60% / 0 0 100% 100%;
  border-width: 2.5px;
}

.dumpling--laughing .dumpling__cheek {
  opacity: 0.9;
  transform: scale(1.2);
}

.dumpling--laughing::after {
  content: 'ha ha';
  left: auto;
  right: 4%;
  top: -4%;
  width: auto;
  height: auto;
  background: transparent;
  color: rgba(157, 53, 255, 0.72);
  font-weight: 900;
  font-size: 0.75rem;
  opacity: 1;
}

.dumpling--surprised .dumpling__mouth {
  width: 14%;
  height: 14%;
  top: 60%;
  border: 2.5px solid #1a1a2e;
  border-radius: 50%;
}

.dumpling--surprised .dumpling__eye {
  transform: scale(1.08);
}

.dumpling--slime {
  --slime-scale: 1;
}

.dumpling--slime .dumpling__body {
  animation: slimeWobble 0.95s ease-in-out infinite;
  filter: saturate(1.08) brightness(1.03);
}

.dumpling--slime .dumpling__body::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 22% 28%, rgba(255, 255, 255, 0.38) 0 5%, transparent 7%),
    radial-gradient(circle at 58% 38%, rgba(255, 255, 255, 0.3) 0 4%, transparent 6%),
    radial-gradient(circle at 72% 64%, rgba(255, 255, 255, 0.26) 0 3.5%, transparent 5.5%);
  mix-blend-mode: screen;
  opacity: 0.85;
}

.dumpling--thrown-up {
  animation: thrownUp 1.15s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.dumpling--thrown-up .dumpling__body {
  filter: saturate(1.05) brightness(1.06);
}

.dumpling--thrown-down {
  animation: thrownDown 1.05s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.dumpling--thrown-side {
  animation: thrownSide 1.1s cubic-bezier(0.2, 0.82, 0.2, 1) forwards;
}

.dumpling--thrown-down .dumpling__body {
  animation: squashHit 0.3s ease-out 0s 2;
}

.dumpling--floor-squash .dumpling__body {
  transform-origin: center bottom;
  animation: floorSquash 0.64s cubic-bezier(0.18, 0.88, 0.26, 1.2) forwards;
}

.dumpling--angry .dumpling__eyebrow,
.dumpling--thrown-down .dumpling__eyebrow {
  display: none;
}

.dumpling--angry .dumpling__mouth,
.dumpling--thrown-down .dumpling__mouth {
  border-color: #b82d38;
}

.dumpling--action-fun-squash .dumpling__body {
  animation: laughSquash 0.36s ease-in-out 0s 3;
}

.dumpling--action-dancing .dumpling__body {
  animation: actionDance 0.58s ease-in-out infinite;
}

.dumpling--action-tongue .dumpling__mouth {
  width: 18%;
  height: 20%;
  top: 58%;
  border: 0;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(180deg, #1a1a2e 0 35%, #ff6b9d 36% 100%);
}

.dumpling--action-balloon .dumpling__body {
  animation: balloonPuff 0.82s ease-in-out infinite;
}

.dumpling--action-wink .dumpling__eye--right {
  height: 6%;
  top: 28%;
  border-radius: 999px;
}

.dumpling--action-tiny-hat::after {
  content: '◠';
  left: 34%;
  right: auto;
  top: -22%;
  width: 32%;
  height: 24%;
  border-radius: 10px 10px 4px 4px;
  background: linear-gradient(180deg, #9d35ff, #5c3b7a);
  color: #ffd76b;
  font-size: 1.2rem;
  line-height: 0.8;
  text-align: center;
  opacity: 1;
  transform: rotate(-8deg);
  box-shadow: 0 5px 0 #13f2d0;
}

.dumpling--action-sparkle-trail::after,
.dumpling--action-confetti-burst::after,
.dumpling--action-fireworks::after {
  content: '✦ ✧ ✦';
  left: 0;
  right: 0;
  top: -20%;
  width: auto;
  height: auto;
  background: transparent;
  opacity: 1;
  color: #9d35ff;
  font-weight: 900;
  text-align: center;
  animation: sparkleTrail 0.9s ease-in-out infinite;
}

.dumpling--action-spin {
  animation: actionSpin 0.78s ease-in-out 1 !important;
}

.dumpling--action-sunglasses .dumpling__eye {
  width: 25%;
  height: 15%;
  top: 24%;
  border-radius: 4px 4px 8px 8px;
  background: #101018;
}

.dumpling--action-sunglasses .dumpling__eye-highlight {
  display: none;
}

.dumpling--action-golden-pose .dumpling__body {
  filter: saturate(1.25) brightness(1.18);
  box-shadow:
    inset 0 -8px 14px rgba(0, 0, 0, 0.16),
    inset 0 5px 8px rgba(255, 255, 255, 0.44),
    0 0 28px rgba(255, 215, 107, 0.72);
}

.dumpling--action-cosmic-portal::before {
  inset: -22%;
  background:
    conic-gradient(from 0deg, rgba(19, 242, 208, 0.06), rgba(157, 53, 255, 0.58), rgba(255, 215, 107, 0.4), rgba(19, 242, 208, 0.06));
  opacity: 0.85;
  filter: blur(1px);
  animation: actionSpin 1.4s linear infinite;
}

.dumpling--action-dragon-cloud::after {
  content: '〜 〜';
  left: auto;
  right: -18%;
  top: 2%;
  width: 64%;
  height: auto;
  background: transparent;
  color: rgba(90, 110, 155, 0.75);
  font-weight: 900;
  font-size: 1.25rem;
  opacity: 1;
  animation: dragonCloud 1.2s ease-in-out infinite;
}

.dumpling--action-rainbow-aura::before {
  inset: -14%;
  background: conic-gradient(#ff6b9d, #ffd76b, #13f2d0, #4895ef, #9d35ff, #ff6b9d);
  opacity: 0.72;
  filter: blur(13px);
  animation: actionSpin 2s linear infinite;
}

.dumpling--action-time-freeze {
  filter: saturate(0.85) brightness(1.18) hue-rotate(18deg);
}

.dumpling--action-time-freeze::after {
  content: 'Ⅱ';
  left: auto;
  right: 2%;
  top: -10%;
  width: auto;
  height: auto;
  background: transparent;
  color: rgba(19, 242, 208, 0.82);
  font-weight: 900;
  font-size: 1.4rem;
  opacity: 1;
}

.dumpling--action-clones::before {
  opacity: 0.55;
  background: transparent;
  filter: none;
  box-shadow:
    -34px 10px 0 rgba(157, 53, 255, 0.28),
    34px 10px 0 rgba(19, 242, 208, 0.28);
  animation: clonePulse 0.8s ease-in-out infinite;
}

@keyframes squishDeform {
  0%, 100% { transform: scale(1, 1); border-radius: 50% 50% 45% 45% / 60% 60% 40% 40%; }
  25% { transform: scale(1.08, 0.92); border-radius: 48% 52% 42% 48% / 55% 65% 38% 42%; }
  50% { transform: scale(0.95, 1.05); border-radius: 52% 48% 48% 42% / 62% 58% 42% 38%; }
  75% { transform: scale(1.04, 0.96); border-radius: 46% 54% 44% 46% / 58% 62% 40% 40%; }
}

@keyframes floatSquish {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

@keyframes auraPulse {
  0%, 100% { transform: scale(0.92); opacity: 0.48; }
  50% { transform: scale(1.08); opacity: 0.78; }
}

@keyframes bubbleDrift {
  0%, 100% { transform: translateY(0) scale(1); opacity: 0.58; }
  50% { transform: translateY(-4px) scale(1.03); opacity: 0.82; }
}

@keyframes sleepyFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

@keyframes zzzFloat {
  0%, 100% { transform: translateY(0) translateX(0); opacity: 0.6; }
  50% { transform: translateY(-8px) translateX(3px); opacity: 1; }
}

@keyframes laughSquash {
  0%, 100% { transform: scale(1, 1) rotate(-1deg); }
  50% { transform: scale(1.05, 0.94) rotate(1deg); }
}

@keyframes slimeWobble {
  0%, 100% { transform: scale(1) rotate(0deg); }
  30% { transform: scale(1.08, 0.92) rotate(-2deg); }
  60% { transform: scale(0.96, 1.06) rotate(2deg); }
}

@keyframes thrownUp {
  0% { transform: translateY(0) scale(1); }
  20% { transform: translateY(-28px) scale(1.04); }
  45% { transform: translateY(-90px) scale(0.98); }
  70% { transform: translateY(-28px) scale(1.02); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes thrownDown {
  0% { transform: translateY(0) scale(1); }
  20% { transform: translateY(18px) scale(1.04, 0.84); }
  45% { transform: translateY(40px) scale(1.08, 0.72); }
  70% { transform: translateY(10px) scale(1.02, 0.94); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes floorSquash {
  0% { transform: scale(1, 1); }
  24% { transform: scale(1.38, 0.48); border-radius: 56% 56% 34% 34% / 42% 42% 24% 24%; }
  48% { transform: scale(0.82, 1.22); border-radius: 48% 52% 46% 44% / 64% 58% 38% 42%; }
  72% { transform: scale(1.08, 0.9); }
  100% { transform: scale(1, 1); }
}

@keyframes thrownSide {
  0% { transform: translateX(0) rotate(0) scale(1); }
  28% { transform: translateX(calc(var(--throw-direction, 1) * (62px + 82px * var(--throw-power, 0.5)))) rotate(calc(var(--throw-direction, 1) * 18deg)) scale(1.02); }
  48% { transform: translateX(calc(var(--throw-direction, 1) * (34px + 42px * var(--throw-power, 0.5)))) rotate(calc(var(--throw-direction, 1) * -10deg)) scale(0.98, 1.04); }
  72% { transform: translateX(calc(var(--throw-direction, 1) * (14px + 18px * var(--throw-power, 0.5)))) rotate(calc(var(--throw-direction, 1) * 5deg)) scale(1.01); }
  100% { transform: translateX(0) rotate(0) scale(1); }
}

@keyframes squashHit {
  0%, 100% { transform: scale(1, 1); }
  50% { transform: scale(1.08, 0.72); }
}

@keyframes actionDance {
  0%, 100% { transform: translateX(0) rotate(0); }
  25% { transform: translateX(-5px) rotate(-5deg); }
  50% { transform: translateY(-5px) rotate(0); }
  75% { transform: translateX(5px) rotate(5deg); }
}

@keyframes balloonPuff {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.18, 1.14); }
}

@keyframes sparkleTrail {
  0%, 100% { transform: translateY(0) scale(0.95); opacity: 0.55; }
  50% { transform: translateY(-10px) scale(1.08); opacity: 1; }
}

@keyframes actionSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes dragonCloud {
  0%, 100% { transform: translateX(0) scale(0.9); opacity: 0.45; }
  50% { transform: translateX(12px) scale(1.08); opacity: 0.9; }
}

@keyframes clonePulse {
  0%, 100% { transform: scale(0.92); opacity: 0.34; }
  50% { transform: scale(1.04); opacity: 0.62; }
}

/* Rarity: Legendario — brillante */
.dumpling--legendario {
  animation: legendarioFloat 4.2s ease-in-out infinite;
}

.dumpling--legendario::before {
  inset: 0;
  background: radial-gradient(ellipse, rgba(255, 215, 107, 0.58), rgba(157, 53, 255, 0.24) 46%, transparent 70%);
  opacity: 0.9;
  animation: auraPulse 2s ease-in-out infinite;
}

.dumpling--legendario .dumpling__body {
  box-shadow:
    inset 0 -8px 14px rgba(0, 0, 0, 0.18),
    inset 0 5px 8px rgba(255, 255, 255, 0.4),
    0 0 22px rgba(255, 215, 107, 0.42),
    0 8px 24px rgba(0, 0, 0, 0.24);
  filter: saturate(1.25) brightness(1.12) contrast(1.04);
}

.dumpling--legendario.dumpling--rojo .dumpling__body {
  background: linear-gradient(115deg, #fff1df 0%, var(--metal-red) 18%, #ff7777 42%, #66151b 72%, #ffd6b2 100%);
}

.dumpling--legendario.dumpling--naranja .dumpling__body {
      background: linear-gradient(115deg, #fff0d6 0%, #ffb14a 16%, #ff7a1a 38%, #c85800 68%, #ffe0a6 100%);
    }

.dumpling--legendario.dumpling--dorado .dumpling__body {
      background: linear-gradient(115deg, #fff6ba 0%, var(--metal-gold) 18%, #ffe07a 42%, #8f5c10 72%, #fff0a8 100%);
    }

.dumpling--legendario.dumpling--amarillo .dumpling__body {
    background: linear-gradient(115deg, #fffbe3 0%, #fff4a8 18%, #ffe95c 42%, #d7b800 72%, #fff7ca 100%);
  }

.dumpling--mitico {
  animation: mythicOrbit 5.4s ease-in-out infinite;
}

.dumpling--mitico::before {
  inset: -10%;
  background: radial-gradient(ellipse, rgba(255, 255, 255, 0.72), rgba(255, 107, 157, 0.28) 28%, rgba(19, 242, 208, 0.28) 48%, transparent 72%);
  opacity: 0.92;
  animation: auraPulse 1.7s ease-in-out infinite;
}

.dumpling--mitico .dumpling__body {
  box-shadow:
    inset 0 6px 12px rgba(255, 255, 255, 0.42),
    inset 0 -10px 18px rgba(0, 0, 0, 0.16),
    0 0 24px rgba(255, 107, 157, 0.38),
    0 0 38px rgba(19, 242, 208, 0.26),
    0 10px 24px rgba(0, 0, 0, 0.22);
  filter: saturate(1.2) brightness(1.08);
}

.dumpling--diamantito .dumpling__body {
  background:
    radial-gradient(circle at 48% 22%, rgba(255, 255, 255, 0.32), transparent 16%),
    linear-gradient(145deg, #effaff 0%, #89d9ff 18%, #3c9fe9 42%, #164e87 68%, #d4f4ff 100%);
  overflow: hidden;
  box-shadow:
    inset 0 7px 14px rgba(255, 255, 255, 0.44),
    inset 0 -10px 16px rgba(0, 0, 0, 0.16),
    0 0 20px rgba(116, 207, 255, 0.36),
    0 0 42px rgba(81, 159, 231, 0.22);
}

.dumpling--diamantito::before,
.dumpling--diamantito::after {
  content: none;
  display: none;
}

.dumpling--diamantito .dumpling__pleats {
  display: none;
}

.dumpling__diamonds {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  border-radius: inherit;
  opacity: 0.82;
  mix-blend-mode: screen;
}

.dumpling__diamond {
  position: absolute;
  width: 6.2%;
  aspect-ratio: 1;
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.9), rgba(149, 230, 255, 0.66) 42%, rgba(72, 164, 232, 0.52) 100%);
  box-shadow: 0 0 7px rgba(164, 234, 255, 0.38);
  transform: translate(var(--diamond-shift-x, 0), var(--diamond-shift-y, 0)) rotate(var(--diamond-spin, 0deg));
  animation: diamondPulse 2.8s ease-in-out infinite, diamondDrift 4.8s ease-in-out infinite;
  animation-timing-function: ease-in-out, ease-in-out;
}

.dumpling__diamond--0 { animation-delay: 0s; }
.dumpling__diamond--1 { animation-delay: -0.2s; }
.dumpling__diamond--2 { animation-delay: -0.4s; }
.dumpling__diamond--3 { animation-delay: -0.6s; }
.dumpling__diamond--4 { animation-delay: -0.8s; }
.dumpling__diamond--5 { animation-delay: -1s; }

.dumpling--nocheestrellada .dumpling__body {
  background:
    radial-gradient(circle at 24% 22%, rgba(255, 255, 255, 0.22), transparent 16%),
    radial-gradient(circle at 72% 26%, rgba(255, 255, 255, 0.12), transparent 14%),
    radial-gradient(circle at 48% 64%, rgba(97, 235, 255, 0.16), transparent 18%),
    linear-gradient(160deg, #081022 0%, #101b42 34%, #1d2d68 58%, #0a0d20 100%);
  box-shadow:
    inset 0 8px 16px rgba(255, 255, 255, 0.12),
    inset 0 -10px 18px rgba(0, 0, 0, 0.22),
    0 0 20px rgba(101, 148, 255, 0.32),
    0 0 48px rgba(29, 45, 104, 0.28);
  overflow: hidden;
}

.dumpling--nocheestrellada .dumpling__pleats {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.58), rgba(115, 188, 255, 0.52), rgba(255, 255, 255, 0.58));
  opacity: 0.56;
}

.dumpling--nocheestrellada .dumpling__eye {
  background: #fff;
}

.dumpling--nocheestrellada .dumpling__eye-highlight {
  display: none;
}

.dumpling--nocheestrellada .dumpling__eye::before {
  content: '';
  position: absolute;
  top: 16%;
  left: 20%;
  width: 32%;
  height: 32%;
  background: #fff;
  border-radius: 50%;
  z-index: 2;
}

.dumpling--nocheestrellada .dumpling__eye::after {
  content: '';
  position: absolute;
  bottom: 12%;
  left: 50%;
  transform: translateX(-50%);
  width: 58%;
  height: 58%;
  background: #1a1a2e;
  border-radius: 50%;
}

.dumpling--nocheestrellada .dumpling__mouth {
  border-color: #f0f0f0;
}

.dumpling__cosmos {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  border-radius: inherit;
}

.dumpling__cosmos-star {
  position: absolute;
  width: 6.5%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #fff9d1 0 34%, rgba(255, 234, 128, 0.14) 35% 100%);
  box-shadow: 0 0 8px rgba(255, 232, 140, 0.54), 0 0 16px rgba(255, 210, 72, 0.28);
  animation: starDrift 3.2s ease-in-out infinite;
}

.dumpling__cosmos-star::before {
  content: '';
  position: absolute;
  inset: 28%;
  border-radius: 50%;
  background: rgba(255, 248, 200, 0.98);
}

.dumpling__cosmos-star--0 { left: 16%; top: 18%; animation-delay: 0s; }
.dumpling__cosmos-star--1 { left: 30%; top: 34%; animation-delay: -0.35s; }
.dumpling__cosmos-star--2 { left: 48%; top: 20%; animation-delay: -0.7s; }
.dumpling__cosmos-star--3 { left: 66%; top: 39%; animation-delay: -1.05s; }
.dumpling__cosmos-star--4 { left: 76%; top: 22%; animation-delay: -1.4s; width: 5.5%; }
.dumpling__cosmos-star--5 { left: 18%; top: 62%; animation-delay: -1.75s; width: 5.5%; }

.dumpling__cosmos .dumpling__cosmos-star:nth-child(7) { left: 34%; top: 68%; animation-delay: -0.9s; width: 5.2%; }
.dumpling__cosmos .dumpling__cosmos-star:nth-child(8) { left: 58%; top: 64%; animation-delay: -1.25s; width: 5%; }
.dumpling__cosmos .dumpling__cosmos-star:nth-child(9) { left: 72%; top: 68%; animation-delay: -1.6s; width: 5.4%; }
.dumpling__cosmos .dumpling__cosmos-star:nth-child(10) { left: 22%; top: 44%; animation-delay: -1.95s; width: 4.4%; }
.dumpling__cosmos .dumpling__cosmos-star:nth-child(11) { left: 52%; top: 48%; animation-delay: -2.2s; width: 4.2%; }
.dumpling__cosmos .dumpling__cosmos-star:nth-child(12) { left: 80%; top: 56%; animation-delay: -2.45s; width: 4.6%; }

.dumpling--legendario.dumpling--verde .dumpling__body {
  background: linear-gradient(115deg, #eaffd5 0%, var(--mint-green) 18%, #39d898 42%, #176b4d 72%, #d4ffe9 100%);
}

.dumpling--legendario.dumpling--azul .dumpling__body {
  background: linear-gradient(115deg, #e7f6ff 0%, var(--metal-blue) 18%, #7fc7ff 42%, #123c67 72%, #d8ecff 100%);
}

.dumpling--legendario.dumpling--morado .dumpling__body {
        background: linear-gradient(115deg, #fff0ff 0%, var(--violet-spark) 18%, var(--sakura-pink) 44%, #4c146f 74%, #f5d9ff 100%);
      }

.dumpling--legendario.dumpling--rosa .dumpling__body {
        background: linear-gradient(115deg, #fff4fb 0%, #ffd1ea 16%, #ff9fd3 38%, #ff5fb8 62%, #d81d8d 100%);
      }

.dumpling--legendario.dumpling--blanco .dumpling__body {
  background: linear-gradient(115deg, #ffffff 0%, var(--metal-silver) 22%, #f8f8f2 44%, #8e9ca8 72%, #ffffff 100%);
}

.dumpling--legendario.dumpling--negro .dumpling__body {
  background: linear-gradient(115deg, #f2f0ff 0%, #60647a 18%, #2b2d42 45%, #0d0e18 72%, var(--metal-silver) 100%);
}

.dumpling--legendario .dumpling__pleats {
  opacity: 0.64;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.48), transparent 28%, rgba(255, 215, 107, 0.42), transparent 58%, rgba(255, 255, 255, 0.38), transparent);
  filter: drop-shadow(0 0 6px rgba(255, 215, 107, 0.45));
}

.dumpling--legendario.dumpling--dorado .dumpling__body {
  box-shadow:
    inset 0 -6px 12px rgba(0, 0, 0, 0.1),
    0 0 30px rgba(255, 215, 0, 0.6),
    0 0 60px rgba(255, 215, 0, 0.3),
    0 8px 24px rgba(0, 0, 0, 0.2);
}

.dumpling__shimmer {
  position: absolute;
  inset: -12%;
  border-radius: 50%;
  background: conic-gradient(
    from 0deg,
    transparent 0%,
    rgba(255, 255, 255, 0.7) 10%,
    transparent 20%,
    transparent 50%,
    rgba(255, 215, 107, 0.55) 60%,
    transparent 70%
  );
  animation: shimmerRotate 2.5s linear infinite;
  z-index: 0;
  pointer-events: none;
  mix-blend-mode: screen;
}

@keyframes shimmerRotate {
  to { transform: rotate(360deg); }
}

@keyframes legendarioFloat {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  50% { transform: translateX(0); }
  75% { transform: translateX(5px); }
}

@keyframes mythicOrbit {
  0%, 100% { transform: translate(0, 0); }
  12.5% { transform: translate(2px, -3px); }
  25% { transform: translate(4px, 0); }
  37.5% { transform: translate(2px, 3px); }
  50% { transform: translate(0, 4px); }
  62.5% { transform: translate(-2px, 3px); }
  75% { transform: translate(-4px, 0); }
  87.5% { transform: translate(-2px, -3px); }
}

@keyframes diamondPulse {
  0%, 100% { opacity: 0.76; }
  50% { opacity: 1; }
}

@keyframes diamondDrift {
  0%, 100% { transform: translate(var(--diamond-shift-x, 0), var(--diamond-shift-y, 0)) rotate(var(--diamond-spin, 0deg)); }
  25% { transform: translate(calc(var(--diamond-shift-x, 0) + 1px), calc(var(--diamond-shift-y, 0) - 2px)) rotate(calc(var(--diamond-spin, 0deg) + 5deg)); }
  50% { transform: translate(var(--diamond-shift-x, 0), var(--diamond-shift-y, 0)) rotate(var(--diamond-spin, 0deg)); }
  75% { transform: translate(calc(var(--diamond-shift-x, 0) - 1px), calc(var(--diamond-shift-y, 0) + 2px)) rotate(calc(var(--diamond-spin, 0deg) - 5deg)); }
}

@keyframes starDrift {
  0%, 100% { transform: translateY(0) scale(0.86) rotate(0deg); opacity: 0.62; }
  50% { transform: translateY(-5px) scale(1.08) rotate(18deg); opacity: 1; }
}

@keyframes rainbowBadgeSparkle {
  0%, 100% { transform: scale(0.78) rotate(0deg); opacity: 0.42; }
  45% { transform: scale(1.18) rotate(18deg); opacity: 1; }
  70% { transform: scale(0.92) rotate(34deg); opacity: 0.72; }
}

@keyframes llamitaGlow {
  0%, 100% {
    filter: saturate(1.18) brightness(1.05);
    transform: scale(1, 1);
  }
  45% {
    filter: saturate(1.42) brightness(1.18);
    transform: scale(1.025, 0.985);
  }
  72% {
    filter: saturate(1.28) brightness(1.1);
    transform: scale(0.99, 1.02);
  }
}

@keyframes llamitaAura {
  0%, 100% { transform: scale(0.92); opacity: 0.66; }
  50% { transform: scale(1.08); opacity: 0.98; }
}

@keyframes llamitaFlicker {
  0%, 100% { transform: translateY(0) scaleX(1) skewX(0deg); opacity: 0.68; }
  30% { transform: translateY(-3%) scaleX(0.96) skewX(-5deg); opacity: 1; }
  62% { transform: translateY(-1%) scaleX(1.04) skewX(4deg); opacity: 0.84; }
}

.dumpling__sparkles {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}

.dumpling__sparkles::before,
.dumpling__sparkles::after {
  content: '✦';
  position: absolute;
  color: var(--golden-aura);
  font-size: 0.7rem;
  animation: sparkle 1.5s ease-in-out infinite;
  text-shadow: 0 0 8px rgba(255, 215, 107, 0.9), 0 0 14px rgba(157, 53, 255, 0.45);
}

.dumpling__sparkles::before {
  top: 10%;
  right: 15%;
  animation-delay: 0s;
}

.dumpling__sparkles::after {
  bottom: 20%;
  left: 10%;
  animation-delay: 0.75s;
  font-size: 0.5rem;
}

.dumpling--lg .dumpling__sparkles::before { font-size: 1rem; }
.dumpling--lg .dumpling__sparkles::after { font-size: 0.75rem; }

@keyframes sparkle {
  0%, 100% { opacity: 0.2; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.2); }
}

/* Placeholder */
.dumpling--placeholder .dumpling__body {
  background: rgba(243, 227, 198, 0.08);
  border: 2px dashed rgba(243, 227, 198, 0.22);
  box-shadow: none;
}

/* Pop reveal animation */
.dumpling--pop {
  animation: dumplingPop 0.7s var(--ease-bounce) forwards;
}

@keyframes dumplingPop {
  0% { transform: scale(0) rotate(-10deg); opacity: 0; }
  60% { transform: scale(1.15) rotate(3deg); opacity: 1; }
  100% { transform: scale(1) rotate(0); opacity: 1; }
}