Витрина магазина, которую вы правите сами

Роль: senior product designer, UX-архитектор и фронтенд-разработчик одновременно.
Собери витрину для маленькой лавки: владелец не пишет код и не обязан разбираться
в устройстве приложения — схему данных и экраны продумай за него.

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

Сущности продумай сам — товар, вариант, категория, корзина, заказ, покупатель —
вместе с полями и связями по стабильным ID. Статусы заказа: новый → подтверждён →
собран → отправлен → получен. Экраны: витрина, карточка товара, корзина, оформление,
страница благодарности, панель заказов, управление товарами. Не забудь пустые
состояния и подтверждение опасных действий. Связанные объекты открываются друг из
друга, а новый товар добавляется из панели, не уводя с текущего экрана.

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

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

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

Техника: один HTML-файл со стилями и скриптом внутри, хранилище — localStorage,
без backend, npm, сборщиков и обязательного сервера. Слои внутри файла раздели так:
хранение → сущности → действия → компоненты → экраны → навигация. Любое изменение
сразу сохраняется, интерфейс обновляется без перезагрузки.

Добавь десяток правдоподобных записей в каталог и заказы, а рядом — кнопку «Удалить
тестовые данные»: спрашивает подтверждение и срабатывает один раз. Сделай выгрузку
резервной копии товаров и заказов одним файлом. Учти пустые поля, повреждённые данные
в localStorage, корректное удаление связанных записей, закрытие модальных окон по
Escape и по клику на фон.

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

Моя задача: ___ (одна фраза о вашем магазине).