[data-micron] {
  /* Estilos para todos los elementos con el atributo data-micron */
  cursor:pointer;
}
.mjs-linear {
  animation-timing-function: cubic-bezier(0, 0, 1, 1);
}
.mjs-ease-in {
  animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
}
.mjs-ease-out {
  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.mjs-ease-in-out {
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.mjs-jelly {
  animation-name: action-jelly;
}
@keyframes action-jelly {
  0%,
  100% {
    transform: scaleX(1);
  }
  20% {
    transform: scaleX(0.9);
  }
  50% {
    transform: scaleX(1.25);
  }
  85% {
    transform: scaleX(0.8);
  }
}
.mjs-fade {
  animation-name: action-fade;
}
@keyframes action-fade {
  0%,
  100% {
    opacity: 1;
  }
  33% {
    opacity: 0.65;
  }
  67% {
    opacity: 0.85;
  }
}
.mjs-blink {
  animation-name: action-blink;
}
@keyframes action-blink {
  0%,
  100% {
    transform: scale(1);
  }
  25% {
    transform: scale(0.95);
  }
  50% {
    transform: scale(0.97);
  }
  75% {
    transform: scale(0.93);
  }
}
.mjs-bounce {
  animation-name: action-bounce;
}
@keyframes action-bounce {
  0%,
  100% {
    transform: translate(0, 0);
  }
  10% {
    transform: translate(0, 2px);
  }
  50% {
    transform: translate(0, -7px);
  }
  90% {
    transform: translate(0, 4px);
  }
}
.mjs-flicker {
  animation-name: action-flicker;
}
@keyframes action-flicker {
  0%,
  100% {
    transform: skewX(0);
  }
  20% {
    transform: skewX(8deg);
  }
  40% {
    transform: skewX(-8deg);
  }
  60% {
    transform: skewX(4deg);
  }
  80% {
    transform: skewX(-4deg);
  }
}
.mjs-groove {
  animation-name: action-groove;
}
@keyframes action-groove {
  0%,
  100% {
    transform: skewY(0) rotate(0);
  }
  15% {
    transform: skewY(-10deg) rotateZ(8deg);
  }
  35% {
    transform: skewY(10deg) rotateZ(-8deg);
  }
  55% {
    transform: skewY(-6deg) rotateZ(-4deg);
  }
  85% {
    transform: skewY(6deg) rotateZ(4deg);
  }
}
.mjs-jerk {
  animation-name: action-jerk;
}
@keyframes action-jerk {
  0%,
  100% {
    transform: translateX(0) rotateZ(0);
  }
  20% {
    transform: translateX(-5px) rotateZ(-15deg);
  }
  40% {
    transform: translateX(5px) rotateZ(15deg);
  }
  60% {
    transform: translateX(-3px) rotateZ(5deg);
  }
  80% {
    transform: translateX(3px) rotateZ(-5deg);
  }
}
.mjs-pop {
  animation-name: action-pop;
}
@keyframes action-pop {
  0%,
  100% {
    transform: scaleX(1) scaleY(1);
  }
  20%,
  45% {
    transform: scaleX(1.35) scaleY(0.1);
  }
  65% {
    transform: scaleX(0.8) scaleY(1.7);
  }
  80% {
    transform: scaleX(0.6) scaleY(0.85);
  }
}
.mjs-shake {
  animation-name: action-shake;
}
@keyframes action-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  15% {
    transform: translateX(-3px);
  }
  25%,
  65% {
    transform: translateX(3px);
  }
  45%,
  85% {
    transform: translateX(-2px);
  }
}
.mjs-squeeze {
  animation-name: action-squeeze;
}
@keyframes action-squeeze {
  0%,
  100% {
    transform: scaleY(1);
  }
  15%,
  85% {
    transform: scaleY(0.95);
  }
  30% {
    transform: scaleY(0.9);
  }
  55% {
    transform: scaleY(0.75);
  }
  70% {
    transform: scaleY(1.3);
  }
}
.mjs-swing {
  animation-name: action-swing;
  transform-origin: center top;
}
@keyframes action-swing {
  0%,
  100% {
    transform: rotateZ(0);
  }
  20% {
    transform: rotateZ(15deg);
  }
  40% {
    transform: rotateZ(-15deg);
  }
  60% {
    transform: rotateZ(7deg);
  }
  80% {
    transform: rotateZ(-7deg);
  }
}
.mjs-tada {
  animation-name: action-tada;
}
@keyframes action-tada {
  0%,
  100% {
    transform: scale(1);
  }
  20% {
    transform: scale(1.1) rotate(3deg);
  }
  40% {
    transform: scale(0.97);
  }
  60% {
    transform: scale(0.99) rotate(-3deg);
  }
  80% {
    transform: scale(1.05);
  }
}