/* 共通のSVGフィルターで文字を小刻みに揺らす */
@keyframes squiggly-anim {
  0%, 100% { filter: url('#squiggly-0'); }
  20% { filter: url('#squiggly-1'); }
  40% { filter: url('#squiggly-2'); }
  60% { filter: url('#squiggly-3'); }
  80% { filter: url('#squiggly-4'); }
}

.simple-page .test,
.purupuru {
  animation: squiggly-anim 0.34s steps(1, end) infinite;
}

.simple-page .test {
  display: inline-block;
  vertical-align: middle;
  width: 100%;
  text-align: center;
  line-height: 1;
}

.simple-page .test .small { font-size: 0.5em; }
.simple-page .test .smaller { font-size: 0.4em; }
.simple-page .test p { margin: 0; }

.squiggly-filters {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .simple-page .test,
  .purupuru { animation: none; }
}