Сайт магазина косметики, который вы собираете сами

Собери одностраничное приложение «Магазин: магазин косметики» одним HTML-файлом: HTML, CSS и JavaScript внутри, без внешних библиотек, шрифтов, CDN и иконок-шрифтов. Интерфейс на русском, спокойный продуктовый стиль: фон #f8fafc, текст #0f172a, вторичный #64748b, линии #e2e8f0, акцент #0f766e только на кнопках и ссылках, карточки с рамкой 1px и скруглением 12px, цены и объёмы — моноширинными цифрами. После загрузки страница работает без интернета.

Данные храни в localStorage и восстанавливай при открытии: товары, категории, корзина, заказы, покупатели.

Сущности:
1. Товар: название, бренд, категория, подкатегория, объём в миллилитрах, цена, цена за 100 мл (считается автоматически), состав, тип кожи, описание, фото, остаток, наличие пробника, метка «новинка».
2. Категория: название, порядок вывода.
3. Корзина: товар, количество, выбранный объём, пробник, сумма.
4. Заказ: номер, дата создания, состав, сумма, покупатель, телефон, способ получения, адрес, комментарий, статус, история статусов.
5. Покупатель: имя, телефон, адрес доставки, история покупок.

Жизненный цикл заказа: новый → подтверждён → собран → отправлен → получен. Статус ставьте вручную в карточке заказа и показывайте, когда он изменён. Предусмотри отмену с причиной.

Экраны:
- Витрина: сетка карточек, на каждой название, объём, ключевые компоненты состава, цена и бейдж наличия; фильтры по категории, типу кожи, объёму, цене от и до, наличию и пробнику; поиск по названию и по компоненту состава; сортировка по цене и новизне.
- Карточка товара: фото, объём, цена за 100 мл, полный состав, тип кожи, противопоказания, кнопка «В корзину», выбор количества.
- Корзина: список позиций, изменение количества, удаление, пробник, итоговая сумма, кнопка «Перейти к оформлению».
- Оформление заказа: имя, телефон с проверкой формата, доставка или самовывоз, адрес, комментарий, согласие на обработку данных; три коротких шага без регистрации.
- Список заказов: свежие сверху, фильтр по статусу и дате, поиск по номеру и телефону, сумма и состав в строке.
- Карточка заказа: все данные, смена статуса, кнопки «Скопировать заказ текстом» и «Отправить в Telegram».
- Товары: добавление и редактирование, загрузка фото, объём, состав, остатки, скрытие с витрины, управление категориями.

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

Демо-данные: 10 товаров в категориях «Уход за лицом», «Уход за телом», «Макияж», «Парфюм» с реальными объёмами и ценами в рублях, 6 заказов в разных статусах и 4 покупателя.

Адаптивность: телефон в приоритете, одна-две карточки в ряд, кнопки от 44 пикселей, никакой горизонтальной прокрутки. Проверь, что файл открывается двойным щелчком и в консоли нет ошибок.