Трекер чтения: одно касание вечером — и месяц виден целиком

Промпт для трекера чтения

Скопируйте текст кнопкой и вставьте в поле сообщения нового проекта. Бот сам спросит о ваших книгах и целях.

Ты — senior product designer, UX-архитектор и фронтенд-разработчик. Помоги мне собрать личный трекер чтения «Трекер: трекер чтения» одним HTML-файлом. Я не программист: сущности, поля и экраны продумай сам.

Сначала задай мне 8–15 простых вопросов с вариантами ответов: какие книги я сейчас читаю и в каком формате (бумага, электронная, аудио); что я отмечаю — страницы, проценты или минуты аудиокниг; когда обычно читаю (вечером перед сном, в транспорте, в выходные); какая цель на месяц — в книгах или страницах; как быть с днями пропуска — обнулять серию, замораживать или разрешать один пропуск; нужны ли заметки и цитаты к книгам; в какое время напоминать о чтении; какие графики мне интересны; как я веду учёт прочитанного сейчас. Не спрашивай про базы данных, серверы, фреймворки и API. После ответов коротко перескажи, что понял, и приступай.

Сущности: книга — название, автор, жанр, формат, общее число страниц, текущая позиция, статус (читаю, отложена, прочитана); запись — дата, книга, отметка «читал сегодня», страницы или минуты, заметка; цель — период и план (книг или страниц); серия — текущая, лучшая, дата начала, заморозки; категория — жанр и порядок; напоминание — дни, время, включено.

Статусы дня: «сегодня не отмечено» → «отмечено» → «серия». Если день пропущен и заморозка не включена, серия обнуляется, но остаётся в истории как прерванная. Показывай, сколько страниц осталось до цели месяца и сколько дней осталось до лучшей серии.

Экраны: 1) «Сегодня» — книги в работе, кнопка отметки и ввод страниц, прогресс каждой книги, серия и остаток до цели; 2) «Календарь» — месяц сеткой, у каждого дня отметки, клик открывает день и позволяет поставить пропуск или заморозку; 3) «Статистика» — страницы по неделям и месяцам, темп каждой книги, среднее за читающий день, число закрытых книг; 4) «Цели» — план месяца в страницах или книгах, прогресс и прогноз; 5) «Настройки» — книги и жанры, цели, напоминания, правила пропусков, экспорт и импорт JSON, сброс данных.

Дизайн: спокойный бумажный дневник читателя — тёплый светлый фон, serif-заголовки, тонкие линии, аккуратная сетка, скругления 0–2 px, без теней и ярких пятен, один сдержанный акцент. Читаемость и крупные зоны нажатия на экране от 360 пикселей.

Технически: один HTML-файл, CSS и vanilla JS внутри, localStorage как хранилище, без backend, сборщиков, npm, библиотек и внешних шрифтов. Раздели слои: storage → сущности → фичи → компоненты → экраны → навигация. После любого действия данные сохраняются и интерфейс перерисовывается сразу. Пустые состояния, подтверждение удаления, закрытие окон по Escape, защита от битых данных в localStorage, отмена последней отметки.

Добавь демо-данные за три недели: две-три книги с разным прогрессом, отметки по вечерам, заметки к нескольким дням, одну заморозку — и кнопку «Удалить демо-данные» с подтверждением. Перед выдачей проверь сценарии: отметка и отмена, ввод страниц, пропуск с заморозкой, достижение цели месяца, переход между месяцами, перезагрузка страницы, открытие с телефона. Ответ — полный готовый HTML-файл, без «вставьте этот фрагмент». Все дальнейшие правки присылай тоже целым файлом.

Моя задача: личный трекер чтения с серией дней, календарём и целью на месяц.