Пожалуйста, сформируй полный HTML-код (ничего не пропускай), выделив его обратными тройными кавычками, для следующего запроса: "На основе данного HTML-шаблона создай приложение под названием “AI Stories” с красивым и приятным интерфейсом. Это должен быть генератор бесконечных историй на основе нейросети, в котором пользователь может вносить свои сюжетные повороты в историю на каждом этапе. Важные ключевые моменты: 1) В шаблоне уже есть функция requestAI, которую нужно использовать для запросов к нейросети, ее нельзя менять.  2) Приложение должно быть адаптивно и иметь мобильную версию. 3) JavaScript-код должен иметь модульную структуру. 4) Приложение должно быть на двух языках: RU и EN, должно быть переключение. По умолчанию язык RU. 5) Для иконок нужно использовать Font Awesome. В целом приложение должно иметь 2 большие секции: 1) Главная страница. Она должна быть в красивом привлекательном дизайне. На ней должно находиться: - Название приложения. - Переключатель языка, он должен быть на двух секциях, поэтому его можно сделать независимым элементом, который всегда закреплен в верхнем правом углу. - Большое поле ввода начала истории. - Иконка с волшебной палочкой рядом с полем для запроса случайной истории у нейросети. - Кнопка начала истории.". В прошлой итерации код выглядел следующим образом: "<!DOCTYPE html>
<html lang="ru">

<head>
  <meta charset="UTF-8">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
  <title>AI Stories</title>
  <style>
    /* CSS код приложения. Надо учитывать, что приложение должно быть адаптивно и иметь мобильную версию. */

    
  </style>
</head>

<body>
  <!-- HTML код приложения -->


  <script>
    /* Java Script код приложения. Должна быть модульная структура кода. Надо учитывать, что приложение должно быть на двух языках: RU и EN, должно быть переключение. По умолчанию язык RU. */


    /* 
      Функция запроса к нейросети

      Пример использования:

      Запрос на получение текста (ограничение 20 запросов каждые 2 минуты): 
      requestAI('Придумай краткое начало истории', {
        responseCallback: ({ data, modData, message, isStream, isStreaming }) => {
          console.log({ callback: 'responseCallback', data, modData, message, isStream, isStreaming });
        },
        errorCallback: ({ message, error }) => {
          console.log(message);
        },
      });

      Запрос на получение картинки (ограничение 4 запроса каждые 5 минут): 
      requestAI('A cat', {
        type: 'image',
        responseCallback: ({ data, modData, images, image, imageNode }) => { // image - src картинки, imageNode - DOM-элемент картинки с указанным src
          console.log({ callback: 'responseCallback', data, modData, images, image, imageNode }); 
        },
        errorCallback: ({ message, error }) => {
          console.log(message);
        },
      });

    */
    function requestAI(prompt, {
      url = 'https://nexra.aryahcr.cc/api/chat/complements',
      model = 'gpt-4o',
      stream = false,
      markdown = false,
      type = 'text',
      messages = [], // Бывают roles: system, user, assistant
      responseCallback = () => { }, // Колбек ответа от сервера вне зависимости от стриминга
      successCallback = () => { }, // Колбек для успешного завершения
      errorCallback = () => { }, // Колбек ошибки
    } = {}) {
      if (type === 'text') { // Текст
        messages.push({ role: 'user', content: prompt });

        let body = {
          messages,
          model,
          stream,
          markdown,
        };

        if (url.indexOf('/gptweb') !== -1) {
          body = {
            prompt,
            markdown,
          };
        }

        if (messages.length > 1 && model === 'llama-3.1') {
          body.messages = [{ role: 'user', content: JSON.stringify({ messages: messages }) }];
        }

        if (model === 'Bing') {
          body['conversation_style'] = 'balanced';
        }

        if (model === 'blackbox') {
          body['websearch'] = false;
        }

        fetch(url, {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify(body),
        }).then(response => response.text()).then((data) => {
          const modData = JSON.parse(data.slice(data.indexOf('{')));
          const message = modData.message || modData.gpt;

          responseCallback({ data, modData, message, isStream: stream, isStreaming: false });
          successCallback({ data, modData, message, isStream: stream, isStreaming: false });
        }).catch((error) => {
          errorCallback({ message: `Ошибка в функции requestAI (type: text, stream: false): ${error}`, error });
        });
      } else if (type === 'image') { // Картинка
        model = 'emi';

        fetch("https://nexra.aryahcr.cc/api/image/complements", {
          method: "POST",
          headers: {
            "Content-Type": "application/json"
          },
          body: JSON.stringify({
            prompt,
            model,
            //response: "base64"
          })
        }).then((response) => {
          response.text().then((data) => {
            const modData = JSON.parse(data.slice(data.indexOf('{')));
            const images = modData.images;
            const imageNode = document.createElement('img');
            imageNode.className = 'image';
            imageNode.src = images[0];

            responseCallback({ data, modData, images, image: images[0], imageNode });
            successCallback({ data, modData, images, image: images[0], imageNode });
          }).catch((err) => {
            errorCallback({ message: `Ошибка в функции requestAI (type: image): ${err}`, err });
          });
        }).catch((err) => {
          errorCallback({ message: `Ошибка в функции requestAI (type: image): ${err}`, err });
        });
      }
    }

    // Функция навешивания событий на элементы, в том числе на динамически созданные
    function onEvent(eventType, childSelector, callback) {
      // Навешиваем обработчик события на document.body
      document.body.addEventListener(eventType, function (event) {
        // Проверяем, соответствует ли цель события нужному селектору
        const potentialElements = document.querySelectorAll(childSelector);
        const targetElement = event.target;

        // Проверяем, совпадает ли элемент, на который было событие, с одним из элементов по селектору
        potentialElements.forEach(elem => {
          if (elem === targetElement || elem.contains(targetElement)) {
            callback(targetElement, event);
          }
        });
      });
    }
  </script>
</body>

</html>". Запрос прошлой итерации был таким: "Imported HTML".