.prose [data-effect] {
  --effect-accent: var(--theme-accent-dark, var(--wine-dark, #3e284a));
  transform-origin: center;
}

.rich-text-effect-letter {
  display: inline-block;
  position: relative;
  min-width: 0.01em;
  transform-origin: 50% 70%;
}

.prose [data-effect="zittern"] {
  font-weight: 620;
}

.prose [data-effect="zittern"] .rich-text-effect-letter {
  animation: rich-text-zittern 620ms steps(2, end) infinite;
  animation-delay: calc(var(--effect-index, 0) * -79ms);
}

.prose [data-effect="zittern"] .rich-text-effect-letter[data-motion="1"],
.prose [data-effect="zittern"] .rich-text-effect-letter[data-motion="4"] {
  animation-direction: reverse;
}

.prose [data-effect="schreien"] {
  color: var(--effect-accent);
  font-weight: 850;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.prose [data-effect="schreien"] .rich-text-effect-letter {
  animation: rich-text-schreien 2.1s cubic-bezier(0.18, 0.78, 0.22, 1) infinite;
  animation-delay: var(--effect-flow-delay, 0ms);
}

.prose [data-effect="pulsieren"] {
  color: var(--effect-accent);
  font-weight: 680;
}

.prose [data-effect="pulsieren"] .rich-text-effect-letter {
  animation: rich-text-pulsieren 1.8s ease-in-out infinite;
  animation-delay: calc(var(--effect-index, 0) * -74ms);
}

.prose [data-effect="fluestern"] {
  color: var(--theme-muted, var(--muted, #796d7e));
  font-size: 0.86em;
  font-style: italic;
  letter-spacing: 0.045em;
}

.prose [data-effect="fluestern"] .rich-text-effect-letter {
  animation: rich-text-fluestern 2.8s ease-in-out infinite;
  animation-delay: calc(var(--effect-index, 0) * -105ms);
}

.prose [data-effect="fluestern"] .rich-text-effect-letter[data-motion="1"],
.prose [data-effect="fluestern"] .rich-text-effect-letter[data-motion="3"] {
  animation-duration: 3.15s;
}

.prose [data-effect="flackern"] {
  --flicker-outline: var(--theme-muted, var(--muted, #785e83));
  color: transparent;
  font-size: 0.8em;
  font-style: italic;
  letter-spacing: 0.055em;
  -webkit-text-fill-color: transparent;
}

.prose [data-effect="flackern"] .rich-text-effect-letter {
  -webkit-text-stroke: 0.04em var(--flicker-outline);
  text-shadow: 0 0 0.075em color-mix(in srgb, var(--flicker-outline) 68%, transparent);
  animation: rich-text-flackern 3.8s ease-in-out infinite;
  animation-delay: calc(var(--effect-index, 0) * -143ms);
}

.prose [data-effect="flackern"] .rich-text-effect-letter[data-motion="1"],
.prose [data-effect="flackern"] .rich-text-effect-letter[data-motion="3"] {
  animation-duration: 4.25s;
}

.prose [data-effect="flackern"] .rich-text-effect-letter[data-motion="4"] {
  animation-duration: 3.45s;
}

@keyframes rich-text-zittern {

  0%,
  100% {
    transform: translate(0, 0) rotate(0);
  }

  20% {
    transform: translate(-0.055em, 0.035em) rotate(-1.1deg);
  }

  40% {
    transform: translate(0.045em, -0.045em) rotate(0.8deg);
  }

  60% {
    transform: translate(-0.025em, -0.015em) rotate(-0.6deg);
  }

  80% {
    transform: translate(0.06em, 0.025em) rotate(1deg);
  }
}

@keyframes rich-text-schreien {

  0%,
  56%,
  100% {
    transform: translateY(0) scale(1);
    text-shadow: 0 0 0 transparent;
  }

  66% {
    transform: translateY(-0.15em) scale(1.3, 1.24) rotate(-0.55deg);
    text-shadow: 0 0.02em 0.14em color-mix(in srgb, currentColor 48%, transparent);
  }

  78% {
    transform: translateY(0.025em) scale(1.04, 1.08) rotate(0.25deg);
    text-shadow: 0 0 0.045em color-mix(in srgb, currentColor 32%, transparent);
  }
}

@keyframes rich-text-pulsieren {

  0%,
  100% {
    transform: translateY(0) scale(1);
    opacity: 0.72;
    filter: saturate(0.75);
  }

  48% {
    transform: translateY(-0.025em) scale(1.075);
    opacity: 1;
    filter: saturate(1.2);
  }
}

@keyframes rich-text-fluestern {

  0%,
  100% {
    transform: translateY(0.015em) scale(0.97);
    opacity: 0.42;
    filter: blur(0.018em);
  }

  50% {
    transform: translateY(-0.025em) scale(1.025);
    opacity: 0.9;
    filter: blur(0);
  }
}

@keyframes rich-text-flackern {

  0%,
  100% {
    -webkit-text-stroke-width: 0.022em;
    opacity: 0.78;
    filter: blur(0.02em);
    text-shadow: 0 0 0.07em color-mix(in srgb, var(--flicker-outline) 62%, transparent);
  }

  50% {
    -webkit-text-stroke-width: 0.072em;
    opacity: 0.98;
    filter: blur(0.006em);
    text-shadow: 0 0 0.11em color-mix(in srgb, var(--flicker-outline) 76%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rich-text-effect-letter {
    animation: none !important;
    transform: none !important;
    opacity: 1;
    filter: none;
  }

  .prose [data-effect="zittern"] {
    text-decoration: underline wavy currentColor 0.06em;
    text-underline-offset: 0.18em;
  }

  .prose [data-effect="pulsieren"] {
    text-shadow: 0 0 0.08em color-mix(in srgb, currentColor 24%, transparent);
  }

  .prose [data-effect="flackern"] {
    text-decoration: underline dotted currentColor;
    text-underline-offset: 0.2em;
  }
}

