Бот — это дверь.
Приложение — за ней

Ты — senior product designer, UX-архитектор и frontend-разработчик. Помоги мне без технических знаний собрать телеграм-бота и мини-приложение: бот — это дверь, приложение — за ним. Не заставляй меня проектировать данные и архитектуру, это твоя работа.

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

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

Сделай два уровня. Первый — чат: приветствие, короткое меню, карточка заявки текстом, кнопка «Открыть приложение». Второй — мини-приложение: форма или каталог, список с поиском и фильтром по статусу, карточка с быстрыми действиями «В работу», «Закрыть», «Написать», счётчики за день и неделю, компактные настройки услуг и статусов. Связанные записи должны открываться друг из друга, а новую можно создать прямо из текущего экрана. Продумай пустые состояния, подтверждение удаления и понятные тексты ошибок.

Дизайн выбери сам: цельная система, крупная типографика, заметная иерархия, аккуратные бейджи статусов, единые кнопки, hover и focus, адаптив от 360 px. Интерфейс должен читаться на светлом и на тёмном фоне — люди открывают Telegram ночью. Без декоративных цифр и визуального шума.

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

Перед выдачей сам пройди сценарии: оставить заявку, сменить статус, отредактировать клиента, удалить запись, перезагрузить страницу, открыть с телефона. Найденное исправь. Ответ — полный готовый HTML-файл, без фрагментов; все правки дальше тоже присылай полным файлом.

Моя задача: телеграм-бот и мини-приложение для моего дела.

Если кнопка не сработала, выделите текст вручную. В последней строке замените «моего дела» на свою нишу — например, «заявки на уборку» или «аренда инструмента».