System Requirements Document for crimson-giant

1. Introduction

crimson-giant — це вебсайт для продажу мобільних телефонів та аксесуарів, призначений виключно для приватних клієнтів. Мета продукту — дати приватному покупцеві змогу знайти потрібний телефон або аксесуар і самостійно оформити замовлення прямо на сайті, без переходу до телефонного дзвінка чи месенджера.

Аудиторія продукту:

• Приватний покупець — фізична особа, яка купує телефон або аксесуар для власного користування. Вона хоче спокійно переглянути каталог, порівняти характеристики, переконатися в наявності реального товару й завершити покупку онлайн.
• Власник магазину (адміністратор) — особа, яка веде магазин: наповнює каталог телефонами й аксесуарами та обробляє замовлення, оформлені покупцями на сайті.

Бізнес- та оптові замовники до обсягу продукту не входять.

2. System Overview

crimson-giant — це першопартійний вебзастосунок із власним інтерфейсом, який складається з публічної частини (вхідна сторінка, каталог) та захищених робочих поверхонь для покупця й адміністратора. Уся взаємодія — перегляд товарів, вибір, оформлення замовлення, керування каталогом і обробка замовлень — відбувається прямо на сайті.

Поточні актори:

• Приватний покупець — переглядає каталог, обирає товари, реєструється, входить і оформлює замовлення онлайн.
• Власник магазину (адміністратор) — керує товарами каталогу та обробляє оформлені замовлення.

Поточна прийнята поведінка охоплює: публічний вхід на сайт, каталог мобільних телефонів і аксесуарів, самостійну реєстрацію та повторний вхід приватного покупця, оформлення замовлення на сайті, а також захищене керування каталогом і замовленнями для адміністратора. Збереження товарів, замовлень, ідентичностей і рольових прав доступу забезпечується серверною частиною.

Вузькі виключення:

• Бізнес/оптові замовники не обслуговуються.
• Замовлення не приймаються через телефон чи месенджер — лише прямо на сайті.

2a. Product Interpretation and Delivery Boundary

Хто володіє доставкою. crimson-giant — це власний вебзастосунок із власним інтерфейсом. Публічні поверхні (Landing, Products) доступні анонімно. Захищені поверхні (Checkout, Catalog Management, Order Management) вимагають входу, а роль визначає доступ до адміністративних даних.

Ідентичність. Оскільки покупець має приватно володіти своїм замовленням і повертатися до нього, а адміністратор має керувати каталогом і замовленнями, застосунок володіє ідентичністю:

• Приватний покупець самостійно реєструється (Sign Up) і надалі повертається через Login.
• Власник магазину (адміністратор) отримує обліковий запис через запрошення або попереднє provisioning-встановлення та повертається через Login.

Вхідні поверхні (Landing, Login, Sign Up, Products) доступні анонімно; захищений стан залишається недоступним до встановлення ідентичності.

Поточний і майбутній горизонт. Усе, що описано в розділах 3–5,\x20\xd1\x94 поточним обсягом. Майбутні ідеї, якщо вони з'являться, виносяться в розділ 11 і не входять до поточної архітектури сторінок чи приймання.

2c. Page Content and Component Coverage

Landing

• Призначення / інформація: анонімна перша сторінка, яка пояснює, що магазин продає мобільні телефони та аксесуари приватним клієнтам, і веде до каталогу.
• Стан: публічний, без входу.
• Основні дії: перехід до каталогу («Дивитись каталог»), перехід до порівняння моделей (текстове посилання), перехід до входу/реєстрації.
• Доменні сутності: актуальна лінійка телефонів, аксесуари, характеристики.
• Компоненти:
  • Асиметрична продуктова сцена: заголовок Archivo 300 зліва, зображення телефона праворуч із виходом за край.
  • Однорядковий підпис із характеристикою в сірому алюмінієвому кольорі.
  • Основна CTA-пігулка в кармазиновому кольорі під заголовком.
  • Горизонтальна стрічка «поточна лінійка».
  • Триптих аксесуарів (3-up).
  • Блок характеристик у вигляді таблиці-ле\xd2\x91ера.
  • Однорядкова смуга довіри.
• Стани: loading (скелетон стрічки й триптика), empty (якщо лінійка порожня — повідомлення й посилання на каталог), success (повний контент), error (не вдалося завантажити лінійку — показати решту сторінки й повторну спробу), recovery (повторне завантаження блоку).

Login

• Призначення / інформація: повернення приватного покупця та адміністратора до захищених робочих процесів; роль визначає доступ до адміністративних даних.
• Стан: публічний, без входу.
• Основні дії: введення облікових даних, підтвердження входу, перехід до реєстрації.
• Доменні сутності: ідентичність, роль.
• Компоненти: форма входу, поле email/логіна, поле пароля, кнопка входу, посилання на Sign Up, повідомлення про помилку.
• Стани: loading (кнопка в стані очікування), empty (порожні поля), success (перехід до захищеної поверхні за роллю), error (невірні дані — повідомлення без розкриття, яке саме поле хибне), recovery (повторна спроба).

Sign Up

• Призначення / інформація: самостійна перша реєстрація приватного покупця для оформлення замовлення онлайн.
• Стан: публічний, без входу.
• Основні дії: введення реєстраційних даних, створення облікового запису, перехід до входу.
• Доменні сутності: ідентичність приватного покупця.
• Компоненти: форма реєстрації, поля даних, кнопка створення, посилання на Login, повідомлення про помилку.
• Стани: loading, empty, success (обліковий запис створено — перехід до входу або захищеної поверхні), error (зайнятий email / невалідні дані), recovery (виправлення й повторна спроба).

Products

• Призначення / інформація: каталог для перегляду та вибору мобільних телефонів і аксесуарів приватним покупцем.
• Стан: публічний, без входу.
• Основні дії: перегляд сітки товарів, фільтрація, вибір товару, додавання до кошика, перехід до оформлення.
• Доменні сутності: товар (телефон, аксесуар), характеристики, ціна, наявність.
• Компоненти:
  • Ліва панель фільтрів (згортається в нижній аркуш під 768px).
  • Сітка товарів: 3-up на 1280px, 2-up на 768px, 1-up на 375px.
  • Картка товару з верхнім підсвічуванням і 1px алюмінієвою рамкою при наведенні.
  • Панель характеристик у вигляді ле\xd2\x91ера.
• Стани: loading (скелетони карток), empty (немає товарів за фільтром — повідомлення й скидання фільтрів), success (сітка товарів), error (не вдалося завантажити — повторна спроба), recovery (скидання фільтрів / повторне завантаження).

Checkout

• Призначення / інформація: оформлення вибраних товарів у замовлення без переходу до телефону чи месенджера.
• Стан: захищений, доступний приватному покупцеві після входу.
• Основні дії: перегляд вибраних товарів, введення даних доставки, підтвердження замовлення, перехід до завершення.
• Доменні сутності: кошик, замовлення, дані доставки, приватний покупець.
• Компоненти:
  • Список вибраних товарів із цінами.
  • Форма даних доставки.
  • Панель підтвердження як фізичний об'єкт: 12px радіус, верхнє підсвічування, ціна в Archivo 300 39px, повноширинна кармазинова пігулка «Оформити замовлення».
• Стани: loading, empty (кошик порожній — повідомлення й посилання до каталогу), success (замовлення створено — підтвердження), error (не вдалося оформити — повідомлення й повторна спроба), recovery (виправлення даних і повторне підтвердження).

Catalog Management

• Призначення / інформація: захищене робоче місце адміністратора для керування товарами каталогу.
• Стан: захищений, доступний лише власнику магазину (адміністратору).
• Основні дії: додавання товару, редагування товару, видалення товару, перегляд списку товарів.
• Доменні сутності: товар (телефон, аксесуар), характеристики, ціна, наявність.
• Компоненти: таблиця/список товарів, форма додавання/редагування, керування наявністю, підтвердження видалення.
• Стани: loading, empty (каталог порожній — запрошення додати перший товар), success (товар збережено), error (не вдалося зберегти — повідомлення й повторна спроба), recovery (повторне збереження).

Order Management

• Призначення / інформація: захищене робоче місце адміністратора для перегляду та обробки оформлених замовлень.
• Стан: захищений, доступний лише власнику магазину (адміністратору).
• Основні дії: перегляд списку замовлень, відкриття замовлення, зміна статусу обробки.
• Доменні сутності: замовлення, приватний покупець, товари замовлення, статус.
• Компоненти: список замовлень, деталі замовлення, керування статусом.
• Стани: loading, empty (замовлень ще немає — повідомлення), success (статус оновлено), error (не вдалося оновити — повідомлення й повторна спроба), recovery (повторне оновлення).

3. Functional Requirements

FR-1. Продаж мобільних телефонів та аксесуарів приватним клієнтам (explicit) As a Приватний покупець, I should бачити на сайті мобільні телефони та аксесуари, доступні для покупки, so that я можу придбати потрібний товар онлайн.

• Тригер: відкриття сайту.
• Результат: каталог товарів доступний для перегляду.
• Провал/відновлення: якщо каталог не завантажується — повідомлення й повторна спроба.
• Продовження: перехід до вибору товару.

FR-2. Перегляд каталогу (explicit) As a Приватний покупець, I should переглядати каталог мобільних телефонів і аксесуарів, so that я можу знайти потрібний товар.

• Тригер: перехід на Products.
• Результат: сітка товарів із характеристиками й цінами.
• Провал/відновлення: порожній результат фільтра — скидання фільтрів; помилка завантаження — повторна спроба.
• Продовження: вибір товару.

FR-3. Самостійна реєстрація приватного покупця (required_inference) As a Приватний покупець, I should самостійно зареєструватися на сайті, so that я можу оформити замовлення онлайн.

• Тригер: перехід на Sign Up.
• Результат: створений обліковий запис приватного покупця.
• Провал/відновлення: зайнятий email або невалідні дані — повідомлення й повторна спроба.
• Продовження: вхід і оформлення замовлення.

FR-4. Повернення та повторна перевірка особи приватного покупця (required_inference) As a Приватний покупець, I should увійти на сайт повторно, so that я можу повернутися до захищеного оформлення замовлення.

• Тригер: перехід на Login.
• Результат: встановлена ідентичність покупця.
• Провал/відновлення: невірні дані — повідомлення й повторна спроба.
• Продовження: доступ до Checkout.

FR-5. Оформлення замовлення прямо на сайті (explicit) As a Приватний покупець, I should оформити замовлення прямо на сайті, so that я завершую покупку без переходу до телефону чи месенджера.

• Тригер: підтвердження замовлення на Checkout.
• Результат: створене замовлення з вибраними товарами й даними доставки.
• Провал/відновлення: помилка оформлення — повідомлення й повторна спроба.
• Продовження: замовлення стає доступним адміністратору для обробки.

FR-6. Запрошення або попереднє provisioning-встановлення облікового запису адміністратора (required_inference) As a Власник магазину (адміністратор), I should отримати обліковий запис через запрошення або попереднє provisioning-встановлення, so that я можу керувати магазином.

• Тригер: запрошення або provisioning.
• Результат: обліковий запис адміністратора з відповідною роллю.
• Провал/відновлення: невдале встановлення — повторне запрошення.
• Продовження: вхід через Login.

FR-7. Повернення та повторна перевірка особи адміністратора (required_inference) As a Власник магазину (адміністратор), I should увійти повторно, so that я можу повернутися до керування каталогом і замовленнями.

• Тригер: перехід на Login.
• Результат: встановлена ідентичність адміністратора; роль визначає доступ до адміністративних даних.
• Провал/відновлення: невірні дані — повідомлення й повторна спроба.
• Продовження: доступ до Catalog Management і Order Management.

FR-8. Керування товарами каталогу (required_inference) As a Власник магазину (адміністратор), I should додавати, редагувати та видаляти товари каталогу, so that каталог залишається актуальним.

• Тригер: дія на Catalog Management.
• Результат: змінений каталог товарів.
• Провал/відновлення: помилка збереження — повідомлення й повторна спроба.
• Продовження: оновлений каталог видно покупцям на Products.

FR-9. Перегляд та обробка замовлень (required_inference) As a Власник магазину (адміністратор), I should переглядати оформлені замовлення та змінювати\x20\xd1\x97хній статус обробки, so that онлайн-замовлення виконуються.

• Тригер: дія на Order Management.
• Результат: оновлений статус замовлення.
• Провал/відновлення: помилка оновлення — повідомлення й повторна спроба.
• Продовження: замовлення виконано.

FR-10. Backend-виконання для збереження даних (required_inference) As a система, I should зберігати товари, замовлення, ідентичності та рольові права доступу, so that усі захищені робочі процеси працюють коректно.

• Тригер: будь-яка операція з даними.
• Результат: узгоджений стан товарів, замовлень, ідентичностей і ролей.
• Провал/відновлення: помилка збереження — повторна спроба.
• Продовження: подальші операції з даними.

4. User Personas

Приватний покупець

Контекст. Фізична особа, яка купує мобільний телефон або аксесуар для власного користування. Вона приходить на сайт без попереднього облікового запису й хоче спокійно, без тиску, розібратися в товарах.

Основна мета. Знайти потрібний телефон або аксесуар і завершити покупку онлайн, не дзвонячи й не пишучи в месенджер.

Прийняті обов'язки. Перегляд каталогу мобільних телефонів і аксесуарів; вибір товару; самостійна реєстрація; повторний вхід; оформлення замовлення прямо на сайті.

Вхідні дані та рішення. Вибір товару за характеристиками й ціною; рішення про реєстрацію перед оформленням; введення даних доставки; підтвердження замовлення.

Взаємодія з іншими учасниками. Покупець створює замовлення, яке надходить адміністратору для обробки. Покупець не взаємодіє з адміністратором напряму — уся комунікація відбувається через стан замовлення на сайті.

Спостережуваний успіх. Замовлення створено й підтверджено на сайті; покупець бачить підтвердження.

Що робить роль відмінною. Покупець —\x20\xd1\x94дина роль, яка ініціює покупку й створює замовлення; вона не має доступу до адміністративних даних і не керує каталогом.

Власник магазину (адміністратор)

Контекст. Особа, яка запускає та веде магазин crimson-giant. Вона відповідає за те, щоб каталог був актуальним, а онлайн-замовлення — виконаними.

Основна мета. Тримати актуальний каталог телефонів і аксесуарів та обробляти замовлення, оформлені покупцями на сайті.

Прийняті обов'язки. Отримання облікового запису через запрошення або provisioning; повторний вхід; додавання, редагування та видалення товарів каталогу; перегляд і обробка замовлень.

Вхідні дані та рішення. Дані товарів (характеристики, ціна, наявність); рішення про зміну статусу замовлення.

Взаємодія з іншими учасниками. Адміністратор отримує замовлення, створені покупцями, і змінює\x20\xd1\x97хній статус. Він не оформлює замовлення від імені покупця.

Спостережуваний успіх. Каталог актуальний; замовлення переведені у виконаний стан.

Що робить роль відмінною. Адміністратор —\x20\xd1\x94дина роль із доступом до адміністративних даних; вона керує товарами й замовленнями, але не ініціює покупку.

5. Core User Flows

Потік 1. Приватний покупець переглядає каталог і обирає товар

1. Покупець відкриває Landing (анонімно).
2. Бачить асиметричну продуктову сцену: заголовок «Телефон, який варто тримати», зображення телефона праворуч, кармазинову CTA-пігулку «Дивитись каталог».
3. Натискає «Дивитись каталог» → переходить на Products.
4. На Products переглядає сітку товарів (3-up на 1280px, 2-up на 768px, 1-up на 375px), за потреби фільтрує через ліву панель (під 768px — нижній аркуш).
5. Обирає товар; бачить характеристики у вигляді ле\xd2\x91ера.
6. Провал/відновлення: якщо фільтр не дає результатів — скидає фільтри; якщо каталог не завантажився — повторює спробу.
7. Продовження: додає товар до кошика й переходить до оформлення.

Потік 2. Приватний покупець реєструється та входить

1. Покупець на Products вирішує оформити замовлення й переходить до Checkout.
2. Оскільки Checkout захищений, покупця скеровують до Sign Up (або Login, якщо обліковий запис уже\x20\xd1\x94).
3. На Sign Up вводить реєстраційні дані й створює обліковий запис.
4. Провал/відновлення: якщо email зайнятий або дані невалідні — бачить повідомлення й виправляє\x20\xd1\x97х.
5. Продовження: входить через Login; після встановлення ідентичності отримує доступ до Checkout.

Потік 3. Приватний покупець оформлює замовлення прямо на сайті

1. Покупець на Checkout (після входу) бачить список вибраних товарів із цінами.
2. Вводить дані доставки у форму.
3. Бачить панель підтвердження як фізичний об'єкт: ціна в Archivo 300 39px, повноширинна кармазинова пігулка «Оформити замовлення».
4. Натискає «Оформити замовлення».
5. Результат: замовлення створено; покупець бачить підтвердження.
6. Провал/відновлення: якщо оформлення не вдалося — бачить повідомлення й повторює спробу; якщо кошик порожній — бачить повідомлення й посилання до каталогу.
7. Продовження: замовлення стає доступним адміністратору для обробки.

Потік 4. Власник магазину (адміністратор) отримує доступ

1. Адміністратор отримує обліковий запис через запрошення або попереднє provisioning-встановлення.
2. Переходить на Login і вводить облікові дані.
3. Результат: ідентичність встановлена; роль визначає доступ до адміністративних даних.
4. Провал/відновлення: невірні дані — повідомлення й повторна спроба.
5. Продовження: отримує доступ до Catalog Management і Order Management.

Потік 5. Власник магазину (адміністратор) керує каталогом

1. Адміністратор на Catalog Management бачить список товарів.
2. Додає новий телефон або аксесуар, або редагує наявний товар (характеристики, ціна, наявність).
3. Результат: змінений каталог збережено.
4. Провал/відновлення: якщо збереження не вдалося — повідомлення й повторна спроба; якщо каталог порожній — запрошення додати перший товар.
5. Продовження: оновлений каталог видно покупцям на Products.

Потік 6. Власник магазину (адміністратор) обробляє замовлення

1. Адміністратор на Order Management бачить список оформлених замовлень.
2. Відкриває замовлення й переглядає його деталі (товари, покупець, дані доставки).
3. Змінює статус обробки замовлення.
4. Результат: статус замовлення оновлено.
5. Провал/відновлення: якщо оновлення не вдалося — повідомлення й повторна спроба; якщо замовлень ще немає — повідомлення.
6. Продовження: замовлення виконано.

6. Visuals Colors and Theme

Музa: Jony Ive. Головна ідея: продуктова точність — один бездоганно освітлений телефон, безмежне алюмінієве повітря, один кармазиновий сигнал.

Палітра (темний режим):

Кармазиновий #D8232A —\x20\xd1\x94диний сигнальний колір: зарезервований для основної CTA, акценту ціни на рекомендованому пристрої та 2px підкреслення активного пункту навігації; ніколи не більше ~5% екрана. Теплий алюміній #E8E4DC — матеріальний відблиск для значень характеристик, важливих роздільників і\x20\xd1\x94диного освітленого краю на картках товарів.

Типографіка:

• Заголовки: Archivo, вага 300–400 для дисплея (легка, широко розставлена, трекінг −0.03em, реченнєвий регістр), зрідка вага 600 для одного наголошеного слова.
• Специфікаційні підписи: Archivo 500, uppercase, трекінг 0.16em, 12px, алюмінієво-сірий.
• Основний текст: Inter Tight.
• Модульна шкала 1.25: 14 / 16 / 20 / 25 / 31 / 39 / 49 / 61 / 76 / 96.
• Дисплейні розміри clamp: hero 40px мобільний → 96px десктоп; заголовки секцій 30px → 56px; заголовки карток 18px → 20px; основний текст 16px; специфікаційні підписи 12px.

Мова форм: м'які безперервні радіуси (12px картки, 999px пігулки для фільтрів і CTA), 1px волосяні рамки #2A2D31, без тіней на темних поверхнях — глибина з\x20\xd1\x94диного верхнього підсвічування (inset 0 1px 0 rgba(232,228,220,0.06)) і ледь помітної 1px алюмінієвої рамки при наведенні. Нічого декоративного, що не\x20\xd1\x94 функціональним.

Макет: одноколонковий фокус із широкими полями (максимальна ширина контенту 1120px, 96px поля на 1280px, 24px на 375px). Landing: повноекранний hero, горизонтальна стрічка «поточна лінійка», триптих аксесуарів (3-up), блок характеристик у вигляді таблиці, однорядкова смуга довіри. Products: ліва панель фільтрів (згортається в нижній аркуш під 768px), сітка 3-up на 1280px, 2-up на 768px, 1-up на 375px. Деталі товару: розподіл 7/5 — зображення ліворуч, закріплена панель покупки праворуч. Адміністративні поверхні повторюють ту саму сітку з щільнішими відступами 4/8-pt.

Зображення: студійні продуктові рендери й макро-деталі на графітовому або алюмінієвому тлі — пристрій під кутом три чверті, макро кільця камери, макро порту, рука з телефоном на безшовному тлі (без стокових офісних людей). Аксесуари — ізольовані об'єкти з однією м'якою тінню. Жодного кліп-арту, градієнтних плям, строкатих колажів;\x20\xd1\x94дина топографічна волосяна текстура може лежати на 4% непрозорості за блоком характеристик.

7. Signature Design Concept

Асиметрична продуктова сцена для публічного входу (Landing):

• Повноекранна графітова сцена #101113.
• Рекомендований телефон розміщений великим і зміщеним праворуч (займає ~52% висоти в'юпорта, злегка виходить за правий край на 1280px), освітлений зверху зліва з м'яким алюмінієвим контуром.
• Ліворуч, урівень із 96px полем, складений дисплейний заголовок Archivo 300 до 96px на десктопі / 40px на мобільному: «Телефон, який варто тримати» над кармазиновою 2px лінійкою.
• Однорядковий специфікаційний підпис алюмінієво-сірим кольором.
• Суцільна кармазинова пігулка CTA «Дивитись каталог» безпосередньо під заголовком, плюс текстове вторинне посилання «Порівняти моделі».
• Жодного центрованого стеку, жодної синьої кнопки, жодної градієнтної плями — композиція\x20\xd1\x94 асиметричною продуктовою сценою, а не SaaS-банером.
• На 375px телефон опускається під заголовок як повноширинний кроп, а CTA залишається вище згину.

Додаткові сигнатурні ходи:

• Специфікаційний ле\xd2\x91ер: характеристики товару як вирівняні рядки «мітка/значення», розділені 1px волосяними лініями; значення теплим алюмінієм #E8E4DC із табличними цифрами, мітки — 12px uppercase Archivo.
• Кармазинова волосяна навігація: верхня навігація без заливки, активний пункт позначений 2px кармазиновим підкресленням, яке ковзає між пунктами при наведенні; логотип — Archivo 600 із трекінгом −0.04em.
• Студійний світловий прохід: раз за сесію 1.2s діагональний світловий прохід перетинає hero-пристрій і завмирає; той самий 480ms easing керує появою кожного зображення товару при прокручуванні (зображення з'являється на 12px, волосяна лінія виїжджає зліва).
• Панель покупки як фізичний об'єкт: на деталях товару закріплена права панель із 12px радіусом,\x20\xd1\x94диним верхнім підсвічуванням замість тіні, ціною в Archivo 300 39px і повноширинною кармазиновою пігулкою «Додати до кошика» з вторинною контурною «Додати до порівняння» —\x20\xd1\x94дине місце, де дві кнопки колись стекуються.

8. Interaction Model & Motion Direction

Interaction Model: Animated Motion Tempo: restrained Hero Dimensionality: layered_2d

Landing Hero Motion Brief:

• Фокальний суб'єкт: рекомендований телефон, освітлений зверху зліва, з м'яким алюмінієвим контуром, зміщений праворуч і злегка виходить за правий край.
• Тезис (вхід → трансформація → результат): при завантаженні сторінки студійне світло проходить діагонально по пристрою (1.2s, раз за сесію) і завмирає; заголовок і кармазинова лінійка з'являються зліва; CTA-пігулка фіксується під заголовком. Результат — спокійна, освітлена продуктова сцена, готова до взаємодії.
• Словник руху: повільний фізичний easing cubic-bezier(0.22, 1, 0.36, 1), 480–700ms; один прояв продукту при прокручуванні; волосяні роздільники виїжджають зліва при вході секції; при наведенні на картку товару зображення піднімається на 6px і теплішає верхнє підсвічування. Нічого не відскакує, жодних частинок, жодного scroll-jacking.
• Скомпонований перший кадр: графітова сцена, телефон праворуч, заголовок Archivo 300 зліва над кармазиновою 2px лінійкою, специфікаційний підпис алюмінієво-сірим, кармазинова пігулка CTA під заголовком.
• Стан зі зменшеним рухом: усі прояви миттєво переходять у фінальний стан; світловий прохід видалено.

9. Non-Functional Requirements

• NFR-1. Читабельність і цілісність контролів (explicit, з креативної директиви): заголовки, логотипи, мітки, числа, текст карток і контроли повністю залишаються всередині в'юпорта й контейнера на 375px, 768px і 1280px, переносячись або масштабуючись (наприклад, font-size: clamp(...) з мобільним розміром); жоден інший елемент не перекриває\x20\xd1\x97х.
• NFR-2. Зменшений рух (explicit, з креативної директиви): за prefers-reduced-motion усі прояви миттєво переходять у фінальний стан, світловий прохід видалено; для рухомого/прокручуваного контенту надається статичне компонування (перенос у рядки або горизонтальне прокручування), щоб кожен елемент можна було повністю побачити.
• NFR-3. Контраст і доступність (required_inference): текст #F2F2F0 на #101113 і #1A1C1F забезпечує достатній контраст; кармазиновий #D8232A використовується лише як сигнальний колір і не несе\x20\xd1\x94диного смислового навантаження.
• NFR-4. Продуктивність (required_inference): студійні зображення товарів оптимізовані для швидкого завантаження; скелетони показуються під час завантаження каталогу.
• NFR-5. Збереження даних (required_inference): товари, замовлення, ідентичності та рольові права доступу зберігаються на сервері; захищені дані недоступні без встановленої ідентичності.

10. Tech Stack

• Frontend: React (вебзастосунок із власним інтерфейсом).
• Backend: Python / FastAPI — обробка каталогу, замовлень, ідентичностей і рольових прав доступу.
• Сховище: реляційна база даних для товарів, замовлень, ідентичностей і ролей.
• Контейнеризація: Docker / docker-compose для локального запуску сервісів.
• Розгортання: Kubernetes — лише якщо розгортання цього потребує.

11. Assumptions and Constraints

Обмеження (explicit):

• Цільова аудиторія — приватні клієнти; бізнес/оптові замовники не входять до обсягу.
• Замовлення оформлюється прямо на сайті, а не через телефон чи месенджер.

Припущення (required_inference):

• Самостійна реєстрація приватного покупця перед захищеним оформленням замовлення\x20\xd1\x94 необхідною для виконання прийнятого потоку.
• Повернення та повторна перевірка особи приватного покупця потрібні для доступу до захищеного оформлення.
• Обліковий запис власника магазину (адміністратора) створюється через запрошення або попереднє provisioning-встановлення.
• Повернення та повторна перевірка особи адміністратора потрібні для доступу до адміністративних даних.
• Backend-виконання потрібне для збереження товарів, замовлень, ідентичностей і рольових прав доступу.

Майбутній горизонт: наразі не визначено жодних майбутніх вимог; усе описане вище\x20\xd1\x94 поточним обсягом.

Дефолти (не вказані користувачем):

• [Default — not specified by user] Конкретна реляційна база даних не вказана; обрано сумісну з FastAPI.
• [Default — not specified by user] Конкретний спосіб розгортання (Kubernetes) застосовується лише за потреби.

12. Glossary

• Приватний покупець — фізична особа, яка купує телефон або аксесуар для власного користування;\x20\xd1\x94дина цільова аудиторія продукту.
• Власник магазину (адміністратор) — особа, яка керує каталогом і обробляє замовлення.
• Каталог — сукупність мобільних телефонів і аксесуарів, доступних для покупки.
• Замовлення — оформлена на сайті покупка з вибраними товарами, даними доставки та статусом обробки.
• Специфікаційний ле\xd2\x91ер — спосіб подання характеристик товару як вирівняних рядків «мітка/значення», розділених 1px волосяними лініями.
• Кармазиновий сигнал —\x20\xd1\x94диний акцентний колір #D8232A, зарезервований для основної CTA, акценту ціни та активного пункту навігації.