Реализация 1-страничного сайта-тренажера

Тех. задание:
"Продукт реализации представляет собой 1-страничный сайт без клиент-серверной / микросервисной архитектуры. Он предназначен для личного пользования (только локально). Механика подготовлена заказчиком в виде блок-схемы и требует реализации. Немного стиля приветствуется.
Элементы страницы:
- поле ввода fld1 (занимает 3/4 ширины и высоты страницы);
- кнопка btn_start (Старт) (расположена под полем fld1);
- кнопка btn_stop (Стоп) (расположена на том же месте, что и кнопка Старт (появляется, когда начинается процесс тестирования и кнопка Старт исчезает);
- кнопка btn_back (Назад) (располагается справа от кнопки Стоп);
- блок с кнопками (располагается в правой части страницы - на оставшейся 1/4 страницы).

Популярно о механике.
Вы располагаете некоторый текст в поле fld1. Нажимаете кнопку старта, происходят указанные в схеме проверки. Если идти по хэппи пас, то в поле fld1 появляется скелет исходного текста, где все, что не относится к разделителям, заменено на ХХХ. Запускается таймер обратного отсчета. Надо все ХХХ заполнить. Заполнение скелета исходного текста происходит последовательно слева - направо. Возврат (кнопка Назад) последовательно заменяет вставленный вариант на ХХХ, справа - налево.
Исходный текст при начале тестирования сохраняется со всеми отступами, разделяется на части, после чего эти части становятся вариантами ответа. Варианты ответа после старта тестирования представляются в виде кнопок в блоке с кнопками (располагаются в столбик). Нажатие кнопки - соответствующий текст, отображенный на ней, заполняет очередной ХХХ; сама кнопка скрывается и ее пространство сужается, чтобы было проще скроллить в правой части, если вариантов ответов много. В конце концов останется только один :) - заполненный текст в fld1."