ANKU

vite-plugin-prerender
Ставишь, добавляешь в конфиг и делаешь сборку
Или vite-plugin-ssr, только в конфиге поставь ssr({ prerender: true })

Держи, скопируй в Т123


Или вот покороче вариант

<script src="https://cdn.jsdelivr.net/gh/shiza7872/My-First-Project/Fluid.js"></script>

<style>
  #renderSurface {
    width: 100%;
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
  }
</style>
<canvas id="renderSurface"></canvas>

<script>
  const canvas = document.getElementById('renderSurface');
  let myFluid = new Fluid(canvas);
  myFluid.activate();
</script>

Чтобы дать точный ответ, надо увидеть макет формы.
Но должно быть что-то типа
V1 - jQuery

$(document).ready(() => {
  // Все элементы с классом img-N
  $('[class*="img-"]').on('click', function() {
    const $img = $(this);
    // Среди классов img-<число>
    const imgClass = $img.attr('class')
      .split(/\s+/)
      .find(c => /^img-\d+$/.test(c));
    if (!imgClass) return;

    const idx = imgClass.split('-')[1];
    const $checkbox = $(`input[name="check-${idx}"]`);
    if (!$checkbox.length) return;

    // Тогглим класс и состояние чекбокса
    const isActive = $img.toggleClass('active').hasClass('active');
    $checkbox.prop('checked', isActive);
  });
});

V2 - Vanilla

document.addEventListener('DOMContentLoaded', () => {
  // Все элементы с классом img-N
  const images = document.querySelectorAll('[class*="img-"]');

  images.forEach(img => {
    img.addEventListener('click', () => {
      // Класс вида img-N
      const imgClass = img.className
        .split(/\s+/)
        .find(c => /^img-\d+$/.test(c));
      if (!imgClass) return;

      const idx = imgClass.split('-')[1];
      const checkbox = document.querySelector(`input[name="check-${idx}"]`);
      if (!checkbox) return;

      // Тогглим класс и состояние чекбокса
      const isActive = img.classList.toggle('active');
      checkbox.checked = isActive;
    });
  });
});