Расшифровка (scramble)

Буквы мельтешат случайными символами и по одной «фиксируются» слева направо.

Кнопка «Повторить» — в углу.

Код

<h1 data-scramble="ФИНАЛЬНЫЙ ТЕКСТ"></h1>

<script>
var CH = "!<>-_\/[]{}=+*^?#ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
function scramble(el) {
  var fin = el.getAttribute("data-scramble"), frame = 0;
  var iv = setInterval(function () {
    var out = "";
    for (var i = 0; i < fin.length; i++) {
      // слева направо буквы «фиксируются», остальные мельтешат
      out += i < (frame - 6) / 2 ? fin[i]
           : CH[Math.floor(Math.random() * CH.length)];
    }
    el.textContent = out;
    frame++;
    if ((frame - 6) / 2 >= fin.length) { clearInterval(iv); el.textContent = fin; }
  }, 28);
}
scramble(document.querySelector("[data-scramble]"));
</script>

<style>
[data-scramble] { font-family: ui-monospace, monospace; min-height: 1.3em; }
</style>

Промпт для ИИ

Сделай эффект расшифровки текста (scramble/decode): элемент с data-scramble='финальный текст'; интервал каждые ~28мс перерисовывает строку — позиции слева от (frame-6)/2 показывают финальные буквы, остальные — случайные символы из набора !<>-_/[]{}=+*^?#A-Z0-9. Когда все позиции зафиксированы — интервал останавливается. Обязательно моноширинный шрифт и min-height, чтобы строка не прыгала. Запускай при появлении в кадре (IntersectionObserver).