tz10

docs/tz.md

@@ -1,7 +1,8 @@
 # Техническое задание (ТЗ) на разработку PWA «HarmoniX»
 
 ## 1. Общие сведения и назначение
-Цель проекта — создать локальное одностраничное веб-приложение (PWA) для демонстрации физического сложения гармонических колебаний (теорема Фурье), амплитудно-частотного спектра и влияния нелинейных преобразований (клиппинга) на форму сигнала и его звучание. 
+**Цель проекта** — создать локальное одностраничное веб-приложение (PWA) для демонстрации физического сложения гармонических колебаний (теорема Фурье), амплитудно-частотного спектра и влияния нелинейных преобразований (клиппинга) на форму сигнала и его звучание. 
+**Актуальная версия:** v21.0 Stable.
 
 ## 2. Стек технологий и архитектурные ограничения
 *   Разработка ведется строго на чистом HTML5, CSS3 (CSS Variables, Flexbox, Grid) и JavaScript (Vanilla JS).
@@ -11,55 +12,40 @@
 
 ## 3. Архитектура экранов (Routing)
 Приложение работает без перезагрузки страниц и состоит из следующих состояний:
-*   **Welcome Screen:** Стартовая страница с анимированным градиентным логотипом. Текстовые логотипы используют CSS-градиенты (`linear-gradient` с анимацией `background-position`), имитируя неоновое свечение. В актуальной версии логотип переведен в режим круглого морфинга.
+*   **Welcome Screen:** Стартовая страница с анимированным градиентным логотипом. Эффект круглого морфинга (перетекающая капля).
+*   **Mode Select:** Промежуточный экран выбора режима работы (Базовый, Академический, PRO).
 *   **Main Dashboard:** Основная рабочая сетка графиков формата 2x2, которая динамически занимает все доступное пространство экрана (`flex-grow`).
-*   **Sidebar (Боковая навигационная панель):** Выдвижное меню (off-canvas), активируемое по кнопке "☰. Панель включает переключатель тем, загрузку локального изображения и фильтры.
+*   **Sidebar (Боковая навигационная панель):** Выдвижное меню (off-canvas), активируемое по кнопке "☰". Включает переключатель тем, загрузку локального изображения, фильтры и настройки "Жидкого стекла".
 
 ## 4. Структура основного интерфейса (Сетка 2x2)
-В приложении реализовано 4 основных графических блока, точно соответствующих записям в академическом СЦЕНАРИИ:
-
 ### 4.1. Левая верхняя часть (Базовое колебание)
 *   Динамический график выбранного базового гармонического колебания.
 
 ### 4.2. Левая нижняя часть (Управление)
-*   Выведены теоретические формулы: `y = A*cos(wt + θ)` и `V = 1/T`.
-*   Система независимых вкладок (V1, V2, V3) — для каждого колебания сохраняются свои настройки амплитуды и частоты.
+*   Выведены теоретические формулы: `y = A*cos(wt + θ)` и `ν = 1/T`.
+*   Система независимых вкладок (V1, V2, V3) с сохранением настроек амплитуды и частоты.
 *   Настройка ползунками `range` частоты (от 0 до 20 кГц) и амплитуды (0-100%).
 *   Переключатель шага настройки частоты: 10 Гц и 100 Гц.
-*   Кнопка вывода звука на динамик.
-*   Кнопка нелинейного преобразования (Клиппинга).
-*   Кнопка «Сбросить все» для быстрого возврата к стандартным параметрам.
-*   *Обновление Enterprise:* Внедрен модуль "Виброакустическая защита (ТЗИ)" с генерацией маскирующего белого шума в аудиоканал. Добавлен умный выпадающий `<select>` для автоматического определения скорости звука в различных средах.
+*   Инструменты: Кнопка вывода звука, Кнопка микрофона (захват аудио), Кнопка клиппинга, Кнопка сброса.
+*   **Информационная безопасность:** Модуль "Виброакустическая защита (ТЗИ)" с генерацией маскирующего белого шума в аудиоканал.
 
 ### 4.3. Правая верхняя часть (Сумма колебаний)
-*   Текст теоремы о том, что любое колебание может быть представлено в виде суммы.
-*   Результирующий график сложного колебания (суммы волн).
+*   Текст теоремы Фурье и график результирующего сложного колебания.
 
 ### 4.4. Правая нижняя часть (Спектр)
-*   Столбчатая диаграмма амплитудно-частотной характеристики.
-*   Координатная разметка по оси X (5кГц, 10кГц, 15кГц).
-*   Программная демонстрация появления паразитных гармоник при включении нелинейных искажений.
+*   Столбчатая диаграмма амплитудно-частотной характеристики. Координатная разметка по оси X.
 
 ## 5. Требования к UI/UX и адаптивности
-*   **Масштабирование:** Все графические блоки `canvas` завернуты во врапперы с поддержкой ручного изменения размера (`resize: both`). Перерисовка графиков жестко привязана к API `ResizeObserver`, что исключает растягивание пикселей при изменении соотношения сторон элемента.
-*   **Плавающее меню (Top Bar):** Обеспечивает переключение предустановленных тем (Базовая, Темная, Неон).
-*   **Кастомизация:** Реализована загрузка пользовательского фонового изображения из файловой системы и применение графических фильтров к фону (Размытие, Ч/Б, Сепия, Инверсия) через CSS-свойство `backdrop-filter`.
-*   **Современный дизайн:** Интерфейсные элементы (панели) используют эффект матового стекла (Glassmorphism). Кнопки управления реализованы с применением "волновой геометрии" (асимметричные `border-radius`), глубокими тенями для защиты от сливания текста и плавной анимацией масштабирования (scale down) при клике.
-*   **Локализация (i18n):** Интерфейс должен поддерживать динамический перевод на английский язык без перезагрузки документа.
-
-## 6. Требования к интерактивному аудио (UI Audio)
-Помимо основного физического звука (генерации частот), интерфейс должен иметь независимый звуковой отклик:
-*   **Кнопки:** Короткие синтезированные звуки (beep) при нажатии и наведении (hover). Реализованы отдельные звуки подтверждения действия и ошибки/сброса.
-*   **Ползунки (Range):** Динамическое изменение тональности UI-звука при перетаскивании ползунка (частота звука математически зависит от текущего значения `value` ползунка).
-*   **Изоляция:** Для системных звуков интерфейса реализован отдельный независимый экземпляр `AudioContext`, чтобы системные уведомления не смешивались с физической демонстрацией частот.
-
-## 7. Модуль тестирования (Testing Module)
-Геймифицированный тест реализован в виде отдельного модального окна без жесткой нумерации страниц. 
-*   **База данных:** Содержит базу на 30 вопросов в формате JSON. При запуске алгоритм перемешивает как порядок вопросов, так и порядок ответов (`Math.random`).
-*   **Режимы:** Предусмотрено три уровня сложности: Легкий (5 вопросов), Средний (15 вопросов), Сложный (30 вопросов).
-*   **Навигация:** Использован пошаговый слайдер вопросов (без вертикального скролла) с кнопками «Назад» и «Вперед». Присутствуют навигационные кнопки "Выйти" и "Рестарт" (Начать сначала).
-*   **Проверка ответов:** Правильные варианты подсвечиваются зеленым цветом со звуком колокольчика (ding), неверные — красным со звуком зуммера (buzz). В случае ошибки предоставляется прямая ссылка на Wikipedia для разбора темы.
-*   **Итоги:** Динамический расчет процентов. Итоговый результат выводится мгновенно в виде анимированного SVG-кольца с эффектом Count-up (накрутка процентов). Финальный результат сопровождается уникальной музыкой (победной или проигрышной в зависимости от баллов).
+*   **Масштабирование:** `canvas` завернуты во врапперы с поддержкой ручного изменения размера (`resize: both` и ползунок в меню). Перерисовка привязана к `ResizeObserver`.
+*   **Кастомизация:** Загрузка фонового изображения и графических фильтров через `backdrop-filter`.
+*   **Современный дизайн:** Эффект Glassmorphism. Кнопки используют "волновую геометрию" (асимметричные `border-radius: 18px 6px`). Для защиты белого текста от сливания с фоном применяется глубокая контрастная обводка (`text-shadow`).
+*   **Локализация (i18n):** Динамический перевод интерфейса на английский язык без перезагрузки документа.
+
+## 6. Модуль тестирования (Testing Module)
+*   **База данных:** 30 вопросов в JSON. Случайное перемешивание вопросов и ответов (`Math.random`).
+*   **Режимы:** Экспресс (5), Стандарт (15), Полный курс (30), Ультра Профи (50).
+*   **Навигация:** Пошаговый слайдер вопросов без скролла. "Умная лента таймера", меняющая цвет от зеленого к красному.
+*   **Итоги:** Динамический расчет процентов в виде анимированного SVG-кольца (Count-up). Прямые ссылки на Wikipedia для разбора ошибок.
 
 ## Структура интерфейса (БОЛЕЕ СТАРЫЕ ВЕРСИИ: v2.6 - v14.0)
 В приложении реализовано 4 блока, точно соответствующих записям в конспекте: