diff --git a/INTEGRATION_GUIDE.md b/INTEGRATION_GUIDE.md
new file mode 100644
index 0000000..1806a12
--- /dev/null
+++ b/INTEGRATION_GUIDE.md
@@ -0,0 +1,183 @@
+# Интеграция маркетингового анализа v4.0 в существующую архитектуру
+
+## ✅ Что было сделано
+
+### 1. Восстановлена старая архитектура Vue.js
+- Восстановлены все файлы из `origin/main`
+- Сохранена структура проекта (Vue 3 + PrimeVue + Vite)
+
+### 2. Добавлен новый функционал v4.0
+
+#### Типы и сервисы
+- `src/types/marketing-v3.js` — все enum'ы и маппинги для UI
+- `src/service/MarketingV3Service.js` — API сервис для работы с v4.0
+
+#### Новый многошаговый опросник
+- `src/components/marketing/MarketingBriefWizardV3.vue` — главный компонент опросника
+- `src/components/marketing/wizard/StepSection.vue` — секция шага
+- `src/components/marketing/wizard/RadioGroupField.vue` — радио-группа с карточками
+- `src/components/marketing/wizard/CheckboxCardsLimitedField.vue` — чекбоксы с ограничением (max 2)
+- `src/components/marketing/wizard/CheckboxCardsField.vue` — обычные чекбоксы
+- `src/components/marketing/wizard/TagArrayField.vue` — поле для массивов (города)
+- `src/components/marketing/wizard/DynamicLinksField.vue` — динамические ссылки
+
+#### Дашборд результатов
+- `src/views/pages/marketing/MarketingAnalysisV3.vue` — страница результатов с поллингом
+- `src/components/marketing/MetricCard.vue` — карточка метрики
+
+### 3. Обновлён дизайн существующих компонентов
+- `src/views/pages/auth/Login.vue` — обновлён под новый стиль (градиенты, современные карточки)
+- `src/views/pages/marketing/MarketingMain.vue` — добавлена ссылка на новый опросник v4.0, улучшен hover-эффект
+
+### 4. Добавлены новые роуты
+- `/marketing-analysis/v3` — новый опросник v4.0
+- `/marketing-analysis/v3/:id` — страница результатов анализа v4.0
+
+---
+
+## 🚀 Как запустить и протестировать
+
+### 1. Установка зависимостей
+
+```bash
+npm install
+```
+
+### 2. Запуск проекта
+
+```bash
+npm run dev
+```
+
+Открой в браузере: **http://localhost:5173** (или другой порт, который покажет Vite)
+
+### 3. Тестирование нового функционала
+
+#### Шаг 1: Авторизация
+1. Перейди на `/auth/login`
+2. Войди в систему (используй существующие credentials)
+
+#### Шаг 2: Новый опросник v4.0
+1. Перейди в раздел "Маркетинг" (`/marketing-analysis`)
+2. Выбери **"Маркетинговый анализ v4.0 (новый)"** — первый пункт в меню
+3. Или перейди напрямую на `/marketing-analysis/v3`
+
+#### Шаг 3: Заполнение опросника
+- Пройди все 5 шагов:
+  1. **Базовая информация** — ниша, название, цель, этап бизнеса
+  2. **География и чек** — города, средний чек
+  3. **Продукт и поведение** — описание, частота покупок, приоритеты
+  4. **Текущая ситуация** — SMM статус, заявки, ограничения
+  5. **Ссылки и настройки** — соцсети, конкуренты, уровень детализации
+
+**Особенности:**
+- Ограничение выбора: некоторые поля позволяют выбрать только 1–2 варианта (карточки серые, если достигнут лимит)
+- Динамические поля: города добавляются по Enter, ссылки — кнопкой "Добавить ссылку"
+- Казахстанские примеры в placeholder'ах (Алматы, Астана, Шымкент и т.д.)
+
+#### Шаг 4: Результаты анализа
+- После отправки формы тебя перенаправит на `/marketing-analysis/v3/{analysisId}`
+- Страница автоматически делает поллинг каждые 5 секунд
+- Пока статус `QUEUED` или `PROCESSING` — показывается красивый лоадер с меняющимися сообщениями
+- Когда статус `COMPLETED` — отображается дашборд с:
+  - Hero-карточками (Executive Summary)
+  - Графиками (сезонность, платформы конкурентов)
+  - Таблицей конкурентов с аккордеоном
+  - Выводами и стратегией
+
+---
+
+## 📋 Структура файлов
+
+```
+src/
+├── components/
+│   └── marketing/
+│       ├── MarketingBriefWizardV3.vue      # Главный опросник v4.0
+│       ├── MetricCard.vue                  # Карточка метрики
+│       └── wizard/                         # Компоненты для опросника
+│           ├── StepSection.vue
+│           ├── RadioGroupField.vue
+│           ├── CheckboxCardsLimitedField.vue
+│           ├── CheckboxCardsField.vue
+│           ├── TagArrayField.vue
+│           └── DynamicLinksField.vue
+├── views/
+│   └── pages/
+│       ├── auth/
+│       │   └── Login.vue                   # Обновлённый дизайн
+│       └── marketing/
+│           ├── MarketingMain.vue            # Обновлённое меню
+│           └── MarketingAnalysisV3.vue     # Дашборд результатов v4.0
+├── service/
+│   └── MarketingV3Service.js               # API для v4.0
+└── types/
+    └── marketing-v3.js                      # Типы и enum'ы
+```
+
+---
+
+## 🔧 API эндпоинты
+
+Новый функционал использует:
+- `POST /api/v3/marketing-analysis/start` — запуск анализа v4.0
+- `GET /api/v3/marketing-analysis/{id}` — получение статуса и результатов
+
+**Важно:** Убедись, что на бэкенде эти эндпоинты реализованы и возвращают данные в формате:
+- `POST` → `{ analysisId: string }`
+- `GET` → `MarketingAnalysisV3Document` с полями `status`, `resultData`, `errorMessage`
+
+---
+
+## 🎨 Особенности дизайна
+
+### Новый стиль опросника
+- Премиальные карточки для выбора (Radio Cards)
+- Плавные анимации переходов между шагами
+- Прогресс-бар с градиентом
+- Индикаторы шагов с галочками для завершённых
+
+### Обновлённый Login
+- Градиентный фон
+- Современная карточка с тенью
+- Иконка замка в градиентном круге
+- Улучшенная типографика
+
+### Дашборд результатов
+- Карточки метрик с иконками
+- Графики Chart.js (линейный и doughnut)
+- Таблица конкурентов с аккордеоном
+- Адаптивная сетка
+
+---
+
+## ⚠️ Важные замечания
+
+1. **Поллинг:** Дашборд автоматически опрашивает статус каждые 5 секунд. Поллинг останавливается при статусе `COMPLETED` или `FAILED`.
+
+2. **Валидация:** Форма валидируется перед отправкой. Обязательные поля и ограничения на массивы проверяются.
+
+3. **Казахстанский контекст:** Все примеры адаптированы под казахстанский рынок (города, примеры ниш).
+
+4. **Совместимость:** Новый функционал не ломает существующий опросник — он доступен по старому роуту `/marketing-analysis/analysis`.
+
+---
+
+## 🐛 Если что-то не работает
+
+1. **Ошибки компиляции:**
+   - Проверь, что все зависимости установлены: `npm install`
+   - Убедись, что Vue 3 и PrimeVue установлены
+
+2. **Ошибки API:**
+   - Проверь, что бэкенд запущен и доступен
+   - Проверь URL в `src/config/api.js`
+   - Убедись, что эндпоинты `/api/v3/marketing-analysis/*` реализованы на бэкенде
+
+3. **Компоненты не отображаются:**
+   - Проверь консоль браузера на ошибки
+   - Убедись, что все компоненты правильно импортированы
+
+---
+
+Готово! Теперь можно тестировать новый функционал. 🎉
diff --git a/QUICK_START.md b/QUICK_START.md
new file mode 100644
index 0000000..14fceb5
--- /dev/null
+++ b/QUICK_START.md
@@ -0,0 +1,155 @@
+# 🚀 Быстрый старт — Маркетинговый анализ v4.0
+
+## Что было сделано
+
+✅ **Восстановлена старая архитектура Vue.js** из Git  
+✅ **Добавлен новый многошаговый опросник v4.0** с премиальным дизайном  
+✅ **Создан дашборд результатов** с графиками и таблицами  
+✅ **Обновлён дизайн Login.vue** под новый стиль  
+✅ **Обновлён дизайн маркетинговых страниц**  
+✅ **Интегрированы новые роуты** в существующий роутер  
+
+---
+
+## 📦 Запуск проекта
+
+### 1. Установка зависимостей
+
+```bash
+npm install
+```
+
+### 2. Запуск dev-сервера
+
+```bash
+npm run dev
+```
+
+Открой в браузере: **http://localhost:5173** (или порт, который покажет Vite)
+
+---
+
+## 🧪 Как протестировать
+
+### Шаг 1: Авторизация
+1. Перейди на `/auth/login`
+2. Войди в систему
+
+### Шаг 2: Новый опросник v4.0
+1. Перейди в **"Маркетинг"** (`/marketing-analysis`)
+2. Выбери **"Маркетинговый анализ v4.0 (новый)"** — первый пункт в меню
+3. Или перейди напрямую на `/marketing-analysis/v3`
+
+### Шаг 3: Заполнение опросника
+Пройди все 5 шагов:
+- **Шаг 1:** Базовая информация (ниша, название, цель, этап бизнеса)
+- **Шаг 2:** География и чек (города, средний чек)
+- **Шаг 3:** Продукт и поведение (описание, частота покупок, приоритеты клиентов)
+- **Шаг 4:** Текущая ситуация (SMM статус, заявки, ограничения)
+- **Шаг 5:** Ссылки и настройки (соцсети, конкуренты, уровень детализации)
+
+**Особенности:**
+- ✨ Красивые карточки для выбора (Radio Cards)
+- 🔢 Ограничение выбора: некоторые поля позволяют выбрать только 1–2 варианта
+- 🏙️ Динамические поля для городов (добавляются по Enter)
+- 🔗 Динамические ссылки (кнопка "Добавить ссылку")
+- 🇰🇿 Казахстанские примеры (Алматы, Астана, Шымкент и т.д.)
+
+### Шаг 4: Результаты анализа
+- После отправки формы тебя перенаправит на `/marketing-analysis/v3/{analysisId}`
+- Страница автоматически делает **поллинг каждые 5 секунд**
+- Пока статус `QUEUED` или `PROCESSING` — показывается **красивый лоадер** с меняющимися сообщениями
+- Когда статус `COMPLETED` — отображается **дашборд** с:
+  - 📊 Hero-карточками (Executive Summary)
+  - 📈 Графиками (сезонность, платформы конкурентов)
+  - 📋 Таблицей конкурентов с аккордеоном (strengths/weaknesses)
+  - ✅ Выводами и стратегией
+
+---
+
+## 🎨 Новые роуты
+
+- `/marketing-analysis/v3` — новый опросник v4.0
+- `/marketing-analysis/v3/:id` — страница результатов анализа v4.0
+
+**Старый опросник остался доступен:**
+- `/marketing-analysis/analysis` — старый опросник (не изменён)
+
+---
+
+## 📋 Структура новых файлов
+
+```
+src/
+├── components/marketing/
+│   ├── MarketingBriefWizardV3.vue      # Новый опросник v4.0
+│   ├── MetricCard.vue                  # Карточка метрики
+│   └── wizard/                          # Компоненты для опросника
+│       ├── StepSection.vue
+│       ├── RadioGroupField.vue
+│       ├── CheckboxCardsLimitedField.vue
+│       ├── CheckboxCardsField.vue
+│       ├── TagArrayField.vue
+│       └── DynamicLinksField.vue
+├── views/pages/marketing/
+│   └── MarketingAnalysisV3.vue         # Дашборд результатов v4.0
+├── service/
+│   └── MarketingV3Service.js           # API для v4.0
+└── types/
+    └── marketing-v3.js                  # Типы и enum'ы
+```
+
+---
+
+## ⚙️ API эндпоинты
+
+Новый функционал использует:
+- `POST /api/v3/marketing-analysis/start` — запуск анализа v4.0
+- `GET /api/v3/marketing-analysis/{id}` — получение статуса и результатов
+
+**Важно:** Убедись, что на бэкенде эти эндпоинты реализованы и возвращают:
+- `POST` → `{ analysisId: string }`
+- `GET` → `MarketingAnalysisV3Document` с полями `status`, `resultData`, `errorMessage`
+
+---
+
+## 🎯 Особенности
+
+### Дизайн
+- ✨ Премиальные карточки для выбора (Radio Cards)
+- 🎭 Плавные анимации переходов между шагами
+- 📊 Прогресс-бар с градиентом
+- ✅ Индикаторы шагов с галочками
+
+### Функционал
+- 🔄 Автоматический поллинг статуса анализа
+- ✅ Валидация формы перед отправкой
+- 🏙️ Динамические поля для городов и ссылок
+- 🔢 Ограничения на выбор (max 2 для некоторых полей)
+
+### Казахстанский контекст
+- 🇰🇿 Примеры городов: Алматы, Астана, Шымкент, Караганда, Актобе
+- 📱 Примеры ниш: стоматология в Алматы, клиники
+- 🔗 Примеры ссылок: Instagram профили, 2ГИС
+
+---
+
+## 🐛 Если что-то не работает
+
+1. **Ошибки компиляции:**
+   ```bash
+   npm install
+   ```
+
+2. **Ошибки API:**
+   - Проверь, что бэкенд запущен
+   - Проверь URL в `src/config/api.js`
+   - Убедись, что эндпоинты `/api/v3/marketing-analysis/*` реализованы
+
+3. **Компоненты не отображаются:**
+   - Проверь консоль браузера
+   - Убедись, что все компоненты правильно импортированы
+
+---
+
+Готово! Теперь можно тестировать. 🎉
diff --git a/a.md b/a.md
deleted file mode 100644
index edf931c..0000000
--- a/a.md
+++ /dev/null
@@ -1,351 +0,0 @@
-# Руководство по API для фронтенда
-
-## Обзор
-
-Это руководство описывает API сервиса `Parser`, который собирает и предоставляет новостные данные. API спроектировано для эффективной работы с клиентскими приложениями и поддерживает пагинацию, сортировку и фильтрацию.
-
-## Реализация в UI: что мы должны показать пользователю
-
-Ниже описаны ключевые элементы интерфейса, которые необходимо создать, используя эндпоинты из этого руководства.
-
-### 1. Основной экран: Лента новостей 📰
-
-Это главный экран приложения, где пользователь видит все собранные новости.
-
--   **Функционал:**
-    -   **Отображение новостей:** Используйте `GET /api/parser/items` для загрузки и отображения списка новостей. Каждая новость в списке должна показывать заголовок, источник, дату публикации и краткий текст (`rawText` или `analytics.summary`, когда он будет готов).
-    -   **Пагинация:** Так как новостей может быть много, реализуйте "бесконечную прокрутку" (подгрузка новых статей при скролле вниз) или классические кнопки пагинации («1, 2, 3...»). API полностью это поддерживает.
-    -   **Сортировка:** По умолчанию новости должны быть отсортированы по дате публикации (`sort=publishedAt,desc`), чтобы пользователь видел сначала самое свежее.
-
-### 2. Панель фильтров 🔎
-
-Сбоку или сверху от ленты новостей должна быть панель, позволяющая пользователю отфильтровать данные.
-
--   **Функционал:**
-    -   **Фильтр по источнику:** Добавьте выпадающий список или чекбоксы с названиями источников (например, "Kursiv", "Kapital.kz"). При выборе источника отправляйте его в параметре `sourceName` в запросе к `GET /api/parser/items`.
-    -   **Фильтр по дате:** Добавьте два поля для выбора даты ("от" и "до") с календарем. Это позволит пользователю смотреть новости за конкретный период. Используйте параметры `startDate` и `endDate`.
-
-### 3. Дашборд/Статистика 📊
-
-Нужно создать отдельную страницу "Дашборд" или "Статистика", где будет отображаться общая информация о системе.
-
--   **Функционал:**
-    -   **Общее количество новостей:** Используйте `GET /api/parser/stats` для получения и отображения общего числа статей в базе (`totalItems`).
-    -   **Разбивка по источникам:** На основе поля `sourceStatistics` постройте круговую диаграмму (pie chart), которая наглядно покажет, сколько новостей пришло с каждого источника.
-    -   **Статус системы:** Используйте `GET /api/parser/health`, чтобы показать пользователю (скорее, администратору) текущий статус сервиса и планировщика. Можно добавить зелёный/красный индикатор.
-
-### 4. Админ-панель: Управление парсером (опционально, для администраторов) ⚙️
-
-Эта часть интерфейса может быть скрыта от обычных пользователей и доступна только администраторам.
-
--   **Функционал:**
-    -   **Ручной запуск парсинга:** Добавьте кнопки "Запустить парсинг Kursiv", "Запустить парсинг Kapital" и "Запустить все". Эти кнопки будут отправлять запросы на эндпоинты `POST /api/parser/parse/{source}` и `POST /api/parser/parse/all`.
-    -   **Мониторинг состояния БД:** Используйте `GET /api/parser/health/mongodb` для проверки статуса подключения к базе данных и выводите сообщение об успехе или ошибке.
-
----
-
-## API Endpoints
-
-### 1. Получение записей с фильтрацией и пагинацией
-
-```http
-GET /api/parser/items?page=0&size=10&sort=publishedAt,desc&sourceName=Kursiv&startDate=2025-01-01&endDate=2025-01-31
-```
-
-**Параметры:**
-
--   `page` (optional, default: 0) - номер страницы
--   `size` (optional, default: 20) - размер страницы
--   `sort` (optional, default: "publishedAt,desc") - сортировка
--   `sourceName` (optional) - фильтр по источнику
--   `startDate` (optional) - начальная дата (ISO format)
--   `endDate` (optional) - конечная дата (ISO format)
-
-**Ответ:**
-
-```json
-{
-    "success": true,
-    "message": "Записи получены успешно",
-    "data": {
-        "content": [
-            {
-                "id": "...",
-                "sourceName": "Kursiv (Бизнес/экономика)",
-                "title": "Заголовок новости",
-                "url": "https://kursiv.media/...",
-                "publishedAt": "2025-01-14T10:30:00",
-                "addedAt": "2025-01-14T12:00:00",
-                "rawText": "Текст статьи...",
-                "hash": "...",
-                "category": "Бизнес",
-                "analytics": {
-                    "summary": null,
-                    "sentiment": null,
-                    "tags": [],
-                    "entities": {}
-                }
-            }
-        ],
-        "pageable": {
-            "sort": {
-                "sorted": true,
-                "unsorted": false,
-                "empty": false
-            },
-            "pageNumber": 0,
-            "pageSize": 10,
-            "offset": 0,
-            "paged": true,
-            "unpaged": false
-        },
-        "totalElements": 25,
-        "totalPages": 3,
-        "last": false,
-        "first": true,
-        "numberOfElements": 10,
-        "size": 10,
-        "number": 0,
-        "sort": {
-            "sorted": true,
-            "unsorted": false,
-            "empty": false
-        },
-        "empty": false
-    }
-}
-```
-
-### 2. Статистика системы
-
-```http
-GET /api/parser/stats
-```
-
-**Ответ:**
-
-```json
-{
-    "success": true,
-    "message": "Статистика получена успешно",
-    "data": {
-        "totalItems": 150,
-        "sourceStatistics": {
-            "Kursiv (Бизнес/экономика)": 75,
-            "Kapital.kz (Бизнес)": 75
-        },
-        "lastUpdate": "2025-01-14T12:00:00"
-    }
-}
-```
-
-### 3. Запуск парсинга
-
-#### Парсинг всех источников
-
-```http
-POST /api/parser/parse/all
-```
-
-**Ответ:**
-
-```json
-{
-    "success": true,
-    "message": "Парсинг всех источников завершен успешно",
-    "data": [
-        {
-            "source": "Kursiv",
-            "processedItems": 15,
-            "totalItemsInDb": 90,
-            "status": "completed"
-        },
-        {
-            "source": "Kapital",
-            "processedItems": 12,
-            "totalItemsInDb": 90,
-            "status": "completed"
-        }
-    ]
-}
-```
-
-#### Парсинг конкретного источника
-
-```http
-POST /api/parser/parse/kursiv
-POST /api/parser/parse/kapital
-```
-
-### 4. Проверка состояния
-
-#### Общее состояние
-
-```http
-GET /api/parser/health
-```
-
-**Ответ:**
-
-```json
-{
-    "success": true,
-    "message": "Сервис работает",
-    "data": {
-        "status": "UP",
-        "service": "RSS Parser System",
-        "timestamp": 1705123456789,
-        "scheduler": "Enabled - runs every 30 minutes"
-    }
-}
-```
-
-#### Состояние MongoDB
-
-```http
-GET /api/parser/health/mongodb
-```
-
-**Ответ при успехе:**
-
-```json
-{
-    "success": true,
-    "message": "MongoDB подключение успешно",
-    "data": {
-        "status": "UP",
-        "message": "MongoDB подключение успешно",
-        "timestamp": 1705123456789
-    }
-}
-```
-
-**Ответ при ошибке:**
-
-```json
-{
-    "success": false,
-    "message": "Ошибка подключения к MongoDB",
-    "data": {
-        "status": "DOWN",
-        "message": "Ошибка подключения к MongoDB: Command failed with error 13 (Unauthorized)",
-        "timestamp": 1705123456789,
-        "suggestion": "Проверьте учетные данные в application.properties"
-    }
-}
-```
-
-## Примеры использования
-
-### 1. Получение последних новостей с пагинацией
-
-```javascript
-// Получить первую страницу с 10 записями, отсортированными по дате публикации
-fetch('/api/parser/items?page=0&size=10&sort=publishedAt,desc')
-    .then((response) => response.json())
-    .then((data) => {
-        if (data.success) {
-            const items = data.data.content;
-            const totalPages = data.data.totalPages;
-            // Обработка данных
-        }
-    });
-```
-
-### 2. Фильтрация по источнику
-
-```javascript
-// Получить только новости от Kursiv
-fetch('/api/parser/items?sourceName=Kursiv (Бизнес/экономика)&page=0&size=20')
-    .then((response) => response.json())
-    .then((data) => {
-        if (data.success) {
-            const kursivNews = data.data.content;
-            // Обработка данных
-        }
-    });
-```
-
-### 3. Фильтрация по датам
-
-```javascript
-// Получить новости за последнюю неделю
-const endDate = new Date().toISOString();
-const startDate = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000).toISOString();
-
-fetch(`/api/parser/items?startDate=${startDate}&endDate=${endDate}`)
-    .then((response) => response.json())
-    .then((data) => {
-        if (data.success) {
-            const recentNews = data.data.content;
-            // Обработка данных
-        }
-    });
-```
-
-### 4. Комплексная фильтрация
-
-```javascript
-// Получить новости Kapital за последний месяц, отсортированные по дате
-const endDate = new Date().toISOString();
-const startDate = new Date(Date.now() - 30 * 24 * 60 * 60 * 1000).toISOString();
-
-fetch(`/api/parser/items?sourceName=Kapital.kz (Бизнес)&startDate=${startDate}&endDate=${endDate}&sort=publishedAt,desc&page=0&size=50`)
-    .then((response) => response.json())
-    .then((data) => {
-        if (data.success) {
-            const kapitalNews = data.data.content;
-            const totalCount = data.data.totalElements;
-            // Обработка данных
-        }
-    });
-```
-
-### 5. Получение статистики
-
-```javascript
-fetch('/api/parser/stats')
-    .then((response) => response.json())
-    .then((data) => {
-        if (data.success) {
-            const stats = data.data;
-            console.log(`Всего новостей: ${stats.totalItems}`);
-            console.log('По источникам:', stats.sourceStatistics);
-        }
-    });
-```
-
-## Поддерживаемые форматы дат
-
-API поддерживает следующие форматы дат:
-
--   `yyyy-MM-dd` (например: 2025-01-14)
--   `yyyy-MM-dd'T'HH:mm:ss` (например: 2025-01-14T10:30:00)
--   `yyyy-MM-dd'T'HH:mm:ss.SSS` (например: 2025-01-14T10:30:00.000)
--   `yyyy-MM-dd HH:mm:ss` (например: 2025-01-14 10:30:00)
-
-## Обработка ошибок
-
-Все ответы API следуют единому формату:
-
-```json
-{
-    "success": false,
-    "message": "Описание ошибки",
-    "error": "Детальная информация об ошибке"
-}
-```
-
-HTTP статус коды:
-
--   `200` - Успешный запрос
--   `500` - Внутренняя ошибка сервера
--   `503` - Сервис недоступен (например, MongoDB)
-
-## Рекомендации для фронтенда
-
-1. **Кэширование**: Используйте кэширование для статистики и часто запрашиваемых данных
-2. **Пагинация**: Реализуйте бесконечную прокрутку или традиционную пагинацию
-3. **Фильтры**: Предоставьте пользователю удобные фильтры по источнику и датам
-4. **Обновление**: Используйте WebSocket или polling для обновления данных в реальном времени
-5. **Обработка ошибок**: Всегда проверяйте поле `success` в ответе
diff --git a/d.md b/d.md
deleted file mode 100644
index acc937a..0000000
--- a/d.md
+++ /dev/null
@@ -1,52 +0,0 @@
-### Инструкция (Промпт) для AI Агента
-
-Ты — Senior Vue.js разработчик. Мне нужно исправить рендеринг Markdown в компоненте.
-
-**Проблема:**
-Компонент отображает сырой Markdown (символы #, \*, таблицы в виде текста), вместо HTML разметки. Стили CSS есть, но они не применяются, так как HTML не генерируется.
-
-**Анализ кода:**
-
-1. В секции imports из 'vue' забыли добавить `computed`.
-2. Функция `renderMarkdown` скорее всего падает в `catch` и возвращает исходную строку.
-3. Библиотека `marked` в последних версиях изменила API (удален `setOptions`, используется `marked.parse`).
-
-**Задача:**
-Перепиши секцию `<script setup>` и исправь логику рендеринга.
-
-**Требования к исправлению:**
-
-1. Добавь `computed` в импорты из 'vue'.
-2. Обнови использование библиотеки `marked`. Убедись, что используется `marked.parse(text)`. Вместо устаревшего `setOptions` используй современный подход (или `marked.use()`, или просто дефолтный парсинг, так как `gfm` и `breaks` обычно включены по умолчанию).
-3. Убедись, что переменная `renderedSummary` корректно обрабатывает `report.summary` и возвращает безопасный HTML (если summary нет, возвращать пустую строку).
-4. (Опционально) Добавь импорт `DomPurify` (если он есть в проекте) для очистки HTML перед выводом в `v-html`, но если нет — оставь просто парсинг.
-
-**Ожидаемый результат:**
-Код компонента, где `renderedSummary` возвращает корректный HTML, и заголовки/таблицы отображаются красиво согласно CSS стилям `.markdown-content`.
-
-````
-
-### Что именно должен изменить агент (для вашего понимания):
-
-Агент должен изменить блок скрипта примерно так:
-
-```javascript
-// Было
-import { onBeforeUnmount, onMounted, ref } from 'vue';
-// Станет (добавится computed)
-import { onBeforeUnmount, onMounted, ref, computed } from 'vue';
-
-// Было (конфигурация marked)
-if (marked.setOptions) { ... }
-// Станет (упрощенно и надежно)
-const renderMarkdown = (markdown) => {
-    if (!markdown) return '';
-    try {
-        // Просто парсим, так как в новых версиях gfm включен по умолчанию
-        return marked.parse(markdown, { breaks: true });
-    } catch (e) {
-        console.error('Markdown parsing error:', e);
-        return markdown;
-    }
-};
-````
diff --git a/package-lock.json b/package-lock.json
index caa4d2e..54ffdc1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1152,6 +1152,7 @@
             "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
             "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
             "dev": true,
+            "peer": true,
             "bin": {
                 "acorn": "bin/acorn"
             },
@@ -1333,6 +1334,7 @@
                     "url": "https://github.com/sponsors/ai"
                 }
             ],
+            "peer": true,
             "dependencies": {
                 "caniuse-lite": "^1.0.30001640",
                 "electron-to-chromium": "^1.4.820",
@@ -1639,6 +1641,7 @@
             "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.0.tgz",
             "integrity": "sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ==",
             "dev": true,
+            "peer": true,
             "dependencies": {
                 "@eslint-community/eslint-utils": "^4.2.0",
                 "@eslint-community/regexpp": "^4.6.1",
@@ -1694,6 +1697,7 @@
             "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz",
             "integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==",
             "dev": true,
+            "peer": true,
             "bin": {
                 "eslint-config-prettier": "bin/cli.js"
             },
@@ -2394,6 +2398,7 @@
             "resolved": "https://registry.npmjs.org/marked/-/marked-17.0.1.tgz",
             "integrity": "sha512-boeBdiS0ghpWcSwoNm/jJBwdpFaMnZWRzjA6SkUMYb40SVaN1x7mmfGKp0jvexGcx+7y2La5zRZsYFZI6Qpypg==",
             "license": "MIT",
+            "peer": true,
             "bin": {
                 "marked": "bin/marked.js"
             },
@@ -2739,6 +2744,7 @@
                     "url": "https://github.com/sponsors/ai"
                 }
             ],
+            "peer": true,
             "dependencies": {
                 "nanoid": "^3.3.8",
                 "picocolors": "^1.1.1",
@@ -2882,6 +2888,7 @@
             "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
             "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
             "dev": true,
+            "peer": true,
             "bin": {
                 "prettier": "bin/prettier.cjs"
             },
@@ -3026,6 +3033,7 @@
             "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.19.1.tgz",
             "integrity": "sha512-K5vziVlg7hTpYfFBI+91zHBEMo6jafYXpkMlqZjg7/zhIG9iHqazBf4xz9AVdjS9BruRn280ROqLI7G3OFRIlw==",
             "dev": true,
+            "peer": true,
             "dependencies": {
                 "@types/estree": "1.0.5"
             },
@@ -3083,6 +3091,7 @@
             "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.8.tgz",
             "integrity": "sha512-4UHg6prsrycW20fqLGPShtEvo/WyHRVRHwOP4DzkUrObWoWI05QBSfzU71TVB7PFaL104TwNaHpjlWXAZbQiNQ==",
             "dev": true,
+            "peer": true,
             "dependencies": {
                 "chokidar": ">=3.0.0 <4.0.0",
                 "immutable": "^4.0.0",
@@ -3345,6 +3354,7 @@
             "version": "3.4.7",
             "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.7.tgz",
             "integrity": "sha512-rxWZbe87YJb4OcSopb7up2Ba4U82BoiSGUdoDr3Ydrg9ckxFS/YWsvhN323GMcddgU65QRy7JndC7ahhInhvlQ==",
+            "peer": true,
             "dependencies": {
                 "@alloc/quick-lru": "^5.2.0",
                 "arg": "^5.0.2",
@@ -3587,6 +3597,7 @@
             "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.5.tgz",
             "integrity": "sha512-MdjglKR6AQXQb9JGiS7Rc2wC6uMjcm7Go/NHNO63EwiJXfuk9PgqiP/n5IDJCziMkfw9n4Ubp7lttNwz+8ZVKA==",
             "dev": true,
+            "peer": true,
             "dependencies": {
                 "esbuild": "^0.21.3",
                 "postcss": "^8.4.39",
@@ -3641,6 +3652,7 @@
             "version": "3.5.13",
             "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.13.tgz",
             "integrity": "sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==",
+            "peer": true,
             "dependencies": {
                 "@vue/compiler-dom": "3.5.13",
                 "@vue/compiler-sfc": "3.5.13",
diff --git a/src/components/marketing/HeatmapTable.vue b/src/components/marketing/HeatmapTable.vue
index 0d5de2f..9275382 100644
--- a/src/components/marketing/HeatmapTable.vue
+++ b/src/components/marketing/HeatmapTable.vue
@@ -1,36 +1,5 @@
-<template>
-    <div v-if="normalized && normalized.data.length" class="heatmap-table mt-6">
-        <div v-if="showHeader" class="flex align-items-center mb-3">
-            <i v-if="icon" :class="icon" class="text-primary-500 mr-2"></i>
-            <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ title }}</h4>
-        </div>
-
-        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-            <table class="heatmap-table__table w-full border-collapse">
-                <thead>
-                    <tr>
-                        <th class="heatmap-table__th">Сегмент</th>
-                        <th v-for="col in normalized.columns" :key="col" class="heatmap-table__th text-center">
-                            {{ col }}
-                        </th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr v-for="(row, idx) in normalized.data" :key="idx" class="heatmap-table__tr">
-                        <td class="heatmap-table__td font-semibold">{{ getRowName(row) }}</td>
-                        <td v-for="col in normalized.columns" :key="col" class="heatmap-table__td text-center">
-                            <span class="heatmap-table__badge" :style="getCellStyle(row?.[col])">
-                                {{ formatCell(row?.[col]) }}
-                            </span>
-                        </td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import { computed } from 'vue';
 
 const props = defineProps({
@@ -94,6 +63,38 @@ const formatCell = (value) => {
 };
 </script>
 
+<template>
+    <div v-if="normalized && normalized.data.length" class="heatmap-table mt-6">
+        <div v-if="showHeader" class="flex align-items-center mb-3">
+            <i v-if="icon" :class="icon" class="text-primary-500 mr-2"></i>
+            <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ title }}</h4>
+        </div>
+
+        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+            <table class="heatmap-table__table w-full border-collapse">
+                <thead>
+                    <tr>
+                        <th class="heatmap-table__th">Сегмент</th>
+                        <th v-for="col in normalized.columns" :key="col" class="heatmap-table__th text-center">
+                            {{ col }}
+                        </th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr v-for="(row, idx) in normalized.data" :key="idx" class="heatmap-table__tr">
+                        <td class="heatmap-table__td font-semibold">{{ getRowName(row) }}</td>
+                        <td v-for="col in normalized.columns" :key="col" class="heatmap-table__td text-center">
+                            <span class="heatmap-table__badge" :style="getCellStyle(row?.[col])">
+                                {{ formatCell(row?.[col]) }}
+                            </span>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .heatmap-table__table {
     border: 1px solid var(--surface-border);
diff --git a/src/components/marketing/MarketingBriefWizardV3.vue b/src/components/marketing/MarketingBriefWizardV3.vue
new file mode 100644
index 0000000..f1375df
--- /dev/null
+++ b/src/components/marketing/MarketingBriefWizardV3.vue
@@ -0,0 +1,654 @@
+<script setup>
+import MarketingV3Service from '@/service/MarketingV3Service';
+import {
+    AverageCheckLabels,
+    AverageChecks,
+    BusinessConstraintLabels,
+    BusinessConstraints,
+    BusinessStageLabels,
+    BusinessStages,
+    ClientTargetLabels,
+    ClientTargets,
+    CustomerBehaviorLabels,
+    CustomerBehaviors,
+    DecisionPriorities,
+    DecisionPriorityLabels,
+    DiscoveryMethodLabels,
+    DiscoveryMethods,
+    GeoScopeLabels,
+    GeoScopes,
+    LeadVolumeLabels,
+    LeadVolumes,
+    OfferTypeLabels,
+    OfferTypes,
+    PriceFeedbackLabels,
+    PriceFeedbacks,
+    PurchaseFrequencies,
+    PurchaseFrequencyLabels,
+    ResponseHandlerLabels,
+    ResponseHandlers,
+    SmmStatuses,
+    SmmStatusLabels,
+    VisualFactorLabels,
+    VisualFactors
+} from '@/types/marketing-v3';
+import { useToast } from 'primevue/usetoast';
+import { computed, ref, watch } from 'vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+const toast = useToast();
+
+const STEPS = ['Базовая информация', 'География и чек', 'Продукт и поведение', 'Текущая ситуация', 'Ссылки и настройки'];
+
+const currentStep = ref(0);
+const submitting = ref(false);
+const errors = ref({});
+
+// Form Data
+const formData = ref({
+    businessNiche: '',
+    productName: '',
+    goal: '',
+    businessStage: 'JUST_STARTING',
+    clientTarget: 'MIXED',
+    offerType: 'SERVICES',
+    averageCheck: 'MEDIUM',
+    customerBehaviors: [],
+    geoScope: 'SINGLE_CITY',
+    mainCity: '',
+    presenceCities: [],
+    promotionCities: [],
+    productDescription: '',
+    purchaseFrequency: 'ONCE',
+    visualFactor: 'VISUALS_IMPORTANT',
+    decisionPriorities: [],
+    discoveryMethods: [],
+    priceFeedback: 'AS_EXPECTED',
+    smmStatus: 'NONE',
+    leadVolume: 'NONE',
+    responseHandler: 'MYSELF',
+    constraints: [],
+    userSocialLinks: [],
+    knownCompetitorLinks: [],
+    detailLevel: 'СТАНДАРТНО',
+    analysisType: []
+});
+
+// Options для Radio Groups
+const businessStageOptions = computed(() =>
+    BusinessStages.map((value) => ({
+        value,
+        label: BusinessStageLabels[value]
+    }))
+);
+
+const clientTargetOptions = computed(() =>
+    ClientTargets.map((value) => ({
+        value,
+        label: ClientTargetLabels[value]
+    }))
+);
+
+const offerTypeOptions = computed(() =>
+    OfferTypes.map((value) => ({
+        value,
+        label: OfferTypeLabels[value]
+    }))
+);
+
+const geoScopeOptions = computed(() =>
+    GeoScopes.map((value) => ({
+        value,
+        label: GeoScopeLabels[value]
+    }))
+);
+
+const averageCheckOptions = computed(() =>
+    AverageChecks.map((value) => ({
+        value,
+        label: AverageCheckLabels[value]
+    }))
+);
+
+const purchaseFrequencyOptions = computed(() =>
+    PurchaseFrequencies.map((value) => ({
+        value,
+        label: PurchaseFrequencyLabels[value]
+    }))
+);
+
+const visualFactorOptions = computed(() =>
+    VisualFactors.map((value) => ({
+        value,
+        label: VisualFactorLabels[value]
+    }))
+);
+
+const customerBehaviorOptions = computed(() =>
+    CustomerBehaviors.map((value) => ({
+        value,
+        label: CustomerBehaviorLabels[value]
+    }))
+);
+
+const decisionPriorityOptions = computed(() =>
+    DecisionPriorities.map((value) => ({
+        value,
+        label: DecisionPriorityLabels[value]
+    }))
+);
+
+const discoveryMethodOptions = computed(() =>
+    DiscoveryMethods.map((value) => ({
+        value,
+        label: DiscoveryMethodLabels[value]
+    }))
+);
+
+const priceFeedbackOptions = computed(() =>
+    PriceFeedbacks.map((value) => ({
+        value,
+        label: PriceFeedbackLabels[value]
+    }))
+);
+
+const smmStatusOptions = computed(() =>
+    SmmStatuses.map((value) => ({
+        value,
+        label: SmmStatusLabels[value]
+    }))
+);
+
+const leadVolumeOptions = computed(() =>
+    LeadVolumes.map((value) => ({
+        value,
+        label: LeadVolumeLabels[value]
+    }))
+);
+
+const responseHandlerOptions = computed(() =>
+    ResponseHandlers.map((value) => ({
+        value,
+        label: ResponseHandlerLabels[value]
+    }))
+);
+
+const businessConstraintOptions = computed(() =>
+    BusinessConstraints.map((value) => ({
+        value,
+        label: BusinessConstraintLabels[value]
+    }))
+);
+
+const detailLevelOptions = [
+    { value: 'КРАТКО', label: 'Кратко — только главное' },
+    { value: 'СТАНДАРТНО', label: 'Стандартно — баланс деталей и скорости' },
+    { value: 'ПОДРОБНО', label: 'Максимально подробно — глубокий разбор' }
+];
+
+const analysisTypeOptions = [
+    { value: 'РЫНОК', label: 'Рынок и спрос' },
+    { value: 'КОНКУРЕНТЫ', label: 'Конкуренты и позиционирование' },
+    { value: 'ЦА', label: 'Целевая аудитория' },
+    { value: 'КАНАЛЫ', label: 'Каналы продвижения' }
+];
+
+// Валидация конкретного шага (запускается перед переходом)
+const validateStep = (stepIndex) => {
+    let isValid = true;
+
+    if (stepIndex === 0) {
+        if (!formData.value.businessNiche?.trim() || formData.value.businessNiche.trim().length < 2) {
+            errors.value.businessNiche = 'Введите не менее 2 символов';
+            isValid = false;
+        } else delete errors.value.businessNiche;
+
+        if (!formData.value.productName?.trim() || formData.value.productName.trim().length < 2) {
+            errors.value.productName = 'Введите не менее 2 символов';
+            isValid = false;
+        } else delete errors.value.productName;
+
+        if (!formData.value.goal?.trim() || formData.value.goal.trim().length < 5) {
+            errors.value.goal = 'Введите не менее 5 символов';
+            isValid = false;
+        } else delete errors.value.goal;
+    }
+
+    if (stepIndex === 1) {
+        if (formData.value.geoScope === 'SINGLE_CITY') {
+            if (!formData.value.mainCity?.trim()) {
+                errors.value.mainCity = 'Укажите основной город';
+                isValid = false;
+            } else {
+                delete errors.value.mainCity;
+            }
+        }
+
+        if (formData.value.geoScope === 'MULTI_CITY') {
+            if (!formData.value.presenceCities?.length) {
+                errors.value.presenceCities = 'Укажите хотя бы один город присутствия';
+                isValid = false;
+            } else {
+                delete errors.value.presenceCities;
+            }
+        }
+
+        if (!formData.value.promotionCities?.length) {
+            errors.value.promotionCities = 'Укажите хотя бы один город для продвижения';
+            isValid = false;
+        } else {
+            delete errors.value.promotionCities;
+        }
+    }
+
+    if (stepIndex === 2) {
+        if (!formData.value.productDescription?.trim() || formData.value.productDescription.trim().length < 10) {
+            errors.value.productDescription = 'Введите подробное описание (не менее 10 символов)';
+            isValid = false;
+        } else delete errors.value.productDescription;
+
+        if (!formData.value.customerBehaviors?.length) {
+            errors.value.customerBehaviors = 'Выберите хотя бы один вариант';
+            isValid = false;
+        } else if (formData.value.customerBehaviors.length > 2) {
+            errors.value.customerBehaviors = 'Не более двух вариантов';
+            isValid = false;
+        } else delete errors.value.customerBehaviors;
+
+        if (!formData.value.decisionPriorities?.length) {
+            errors.value.decisionPriorities = 'Выберите хотя бы один приоритет';
+            isValid = false;
+        } else if (formData.value.decisionPriorities.length > 2) {
+            errors.value.decisionPriorities = 'Не более двух приоритетов';
+            isValid = false;
+        } else delete errors.value.decisionPriorities;
+
+        if (!formData.value.discoveryMethods?.length) {
+            errors.value.discoveryMethods = 'Выберите хотя бы один вариант';
+            isValid = false;
+        } else if (formData.value.discoveryMethods.length > 2) {
+            errors.value.discoveryMethods = 'Не более двух вариантов';
+            isValid = false;
+        } else delete errors.value.discoveryMethods;
+    }
+
+    if (stepIndex === 4) {
+        if (!formData.value.analysisType?.length) {
+            errors.value.analysisType = 'Выберите хотя бы один тип анализа';
+            isValid = false;
+        } else delete errors.value.analysisType;
+    }
+
+    return isValid;
+};
+
+// Navigation
+const goNext = () => {
+    // ИСПРАВЛЕНИЕ: Блокируем переход, если шаг не заполнен
+    if (validateStep(currentStep.value)) {
+        if (currentStep.value < STEPS.length - 1) {
+            currentStep.value++;
+        }
+    } else {
+        toast.add({
+            severity: 'warn',
+            summary: 'Заполните поля',
+            detail: 'Пожалуйста, заполните все обязательные поля на этом шаге',
+            life: 3000
+        });
+    }
+};
+
+const goBack = () => {
+    if (currentStep.value > 0) {
+        currentStep.value--;
+    }
+};
+
+// Submit
+const handleSubmit = async () => {
+    // Финальная проверка всех шагов перед отправкой на всякий случай
+    let isAllValid = true;
+    for (let i = 0; i < STEPS.length; i++) {
+        if (!validateStep(i)) {
+            currentStep.value = i; // Возвращаем пользователя на шаг с ошибкой
+            isAllValid = false;
+            toast.add({
+                severity: 'error',
+                summary: 'Ошибка валидации',
+                detail: `Пожалуйста, проверьте заполнение полей на шаге "${STEPS[i]}"`,
+                life: 5000
+            });
+            break;
+        }
+    }
+
+    if (!isAllValid) return;
+
+    submitting.value = true;
+    try {
+        const payload = {
+            ...formData.value,
+            discoveryMethods: formData.value.discoveryMethods || []
+        };
+
+        const result = await MarketingV3Service.startAnalysisV3(payload);
+        const analysisId = result.analysisId || result.id;
+
+        if (analysisId) {
+            toast.add({
+                severity: 'success',
+                summary: 'Анализ запущен',
+                detail: 'Маркетинговый анализ успешно запущен',
+                life: 3000
+            });
+
+            router.push(`/marketing-analysis/v3/${analysisId}`);
+        } else {
+            throw new Error('Не получен ID анализа');
+        }
+    } catch (error) {
+        // ИСПРАВЛЕНИЕ: Теперь мы вытягиваем конкретную ошибку от бекенда (Axios)
+        const errorMessage = error.response?.data?.message || error.response?.data?.detail || error.message || 'Не удалось запустить анализ';
+
+        toast.add({
+            severity: 'error',
+            summary: 'Ошибка при отправке',
+            detail: errorMessage,
+            life: 6000
+        });
+    } finally {
+        submitting.value = false;
+    }
+};
+
+// Watch geoScope для очистки зависимых полей
+watch(
+    () => formData.value.geoScope,
+    (newVal) => {
+        if (newVal === 'FULL_COUNTRY') {
+            formData.value.promotionCities = ['Алматы', 'Астана', 'Шымкент', 'Караганда', 'Актобе'];
+        } else if (newVal === 'ONLINE') {
+            formData.value.promotionCities = ['Remote'];
+        }
+
+        if (newVal !== 'SINGLE_CITY') {
+            formData.value.mainCity = '';
+        }
+        if (newVal !== 'MULTI_CITY') {
+            formData.value.presenceCities = [];
+        }
+    }
+);
+</script>
+
+<script>
+import CheckboxCardsField from './wizard/CheckboxCardsField.vue';
+import CheckboxCardsLimitedField from './wizard/CheckboxCardsLimitedField.vue';
+import DynamicLinksField from './wizard/DynamicLinksField.vue';
+import RadioGroupField from './wizard/RadioGroupField.vue';
+import StepSection from './wizard/StepSection.vue';
+import TagArrayField from './wizard/TagArrayField.vue';
+
+export default {
+    components: {
+        StepSection,
+        RadioGroupField,
+        CheckboxCardsLimitedField,
+        CheckboxCardsField,
+        TagArrayField,
+        DynamicLinksField
+    }
+};
+</script>
+
+<template>
+    <div class="marketing-brief-wizard-v3 bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
+        <Toast />
+        <div class="max-w-4xl mx-auto">
+            <div class="card">
+                <div class="card-header mb-6">
+                    <div class="flex items-center justify-between gap-4 mb-4">
+                        <div>
+                            <h1 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Бриф для маркетингового анализа v4.0</h1>
+                            <p class="text-sm text-surface-500 dark:text-surface-400 mt-1">{{ STEPS[currentStep] }} · шаг {{ currentStep + 1 }} из {{ STEPS.length }}</p>
+                        </div>
+                        <div class="hidden sm:block text-right text-xs text-surface-500 dark:text-surface-400">
+                            <p>Можно пройти за 5–7 минут.</p>
+                            <p>Данные нужны, чтобы ИИ дал максимально точные выводы.</p>
+                        </div>
+                    </div>
+
+                    <div class="relative h-2 overflow-hidden rounded-full bg-surface-200 dark:bg-surface-800 mb-4">
+                        <div class="absolute inset-y-0 left-0 rounded-full bg-gradient-to-r from-primary-500 via-purple-500 to-pink-500 transition-all duration-300" :style="{ width: `${((currentStep + 1) / STEPS.length) * 100}%` }" />
+                    </div>
+
+                    <div class="flex flex-wrap gap-2 text-xs text-surface-500 dark:text-surface-400">
+                        <div
+                            v-for="(label, index) in STEPS"
+                            :key="label"
+                            class="flex items-center gap-1 rounded-full px-2 py-1"
+                            :class="{
+                                'bg-primary-50 text-primary-700 dark:bg-primary-900/40 dark:text-primary-200': index === currentStep,
+                                'bg-emerald-50 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-200': index < currentStep,
+                                'bg-surface-100 dark:bg-surface-800': index > currentStep
+                            }"
+                        >
+                            <i v-if="index < currentStep" class="pi pi-check-circle text-xs" />
+                            <span v-else class="h-3 w-3 rounded-full bg-surface-300 dark:bg-surface-600" />
+                            <span class="hidden sm:inline">{{ label }}</span>
+                            <span class="sm:hidden">{{ index + 1 }}</span>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="card-content min-h-[400px]">
+                    <Transition name="slide-fade" mode="out-in">
+                        <div v-if="currentStep === 0" key="step-0" class="space-y-5">
+                            <StepSection title="Базовая информация">
+                                <div class="field md:col-span-2">
+                                    <label for="businessNiche" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Ниша бизнеса * </label>
+                                    <InputText id="businessNiche" v-model="formData.businessNiche" placeholder="Например: стоматологическая клиника в Алматы" class="w-full" :class="{ 'p-invalid': errors.businessNiche }" />
+                                    <small v-if="errors.businessNiche" class="p-error">{{ errors.businessNiche }}</small>
+                                </div>
+
+                                <div class="field md:col-span-2">
+                                    <label for="productName" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Название продукта или бренда * </label>
+                                    <InputText id="productName" v-model="formData.productName" placeholder="Например: DentArt Clinic или ТОО 'Стоматология Плюс'" class="w-full" :class="{ 'p-invalid': errors.productName }" />
+                                    <small v-if="errors.productName" class="p-error">{{ errors.productName }}</small>
+                                </div>
+
+                                <div class="field md:col-span-2">
+                                    <label for="goal" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Главная цель маркетинга сейчас * </label>
+                                    <InputText id="goal" v-model="formData.goal" placeholder="Например: увеличить поток заявок из Instagram и 2ГИС" class="w-full" :class="{ 'p-invalid': errors.goal }" />
+                                    <small v-if="errors.goal" class="p-error">{{ errors.goal }}</small>
+                                </div>
+                            </StepSection>
+
+                            <StepSection title="Этап и формат бизнеса">
+                                <RadioGroupField v-model="formData.businessStage" label="Этап развития бизнеса" :options="businessStageOptions" :error="errors.businessStage" @update:modelValue="formData.businessStage = $event" />
+
+                                <RadioGroupField v-model="formData.clientTarget" label="Для кого вы работаете в первую очередь?" :options="clientTargetOptions" :error="errors.clientTarget" @update:modelValue="formData.clientTarget = $event" />
+
+                                <RadioGroupField v-model="formData.offerType" label="Что вы продаёте?" :options="offerTypeOptions" :error="errors.offerType" @update:modelValue="formData.offerType = $event" />
+                            </StepSection>
+                        </div>
+
+                        <div v-else-if="currentStep === 1" key="step-1" class="space-y-5">
+                            <StepSection title="География и чек">
+                                <RadioGroupField v-model="formData.geoScope" label="Где вы работаете?" :options="geoScopeOptions" :error="errors.geoScope" @update:modelValue="formData.geoScope = $event" />
+
+                                <div v-if="formData.geoScope === 'SINGLE_CITY'" class="field md:col-span-2">
+                                    <label for="mainCity" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Основной город * </label>
+                                    <InputText id="mainCity" v-model="formData.mainCity" placeholder="Например: Алматы, Астана, Шымкент, Караганда" class="w-full" :class="{ 'p-invalid': errors.mainCity }" />
+                                    <small v-if="errors.mainCity" class="p-error">{{ errors.mainCity }}</small>
+                                </div>
+
+                                <div v-if="formData.geoScope === 'MULTI_CITY'" class="field md:col-span-2">
+                                    <TagArrayField
+                                        v-model="formData.presenceCities"
+                                        label="Города присутствия *"
+                                        placeholder="Например: Алматы, Астана, Актобе"
+                                        :max="5"
+                                        :error="errors.presenceCities"
+                                        @update:modelValue="formData.presenceCities = $event"
+                                    />
+                                    <small v-if="errors.presenceCities" class="p-error">{{ errors.presenceCities }}</small>
+                                </div>
+
+                                <div class="field md:col-span-2">
+                                    <TagArrayField
+                                        v-model="formData.promotionCities"
+                                        label="Города, где хотите усиливать продвижение *"
+                                        placeholder="Например: Алматы, Астана, Шымкент"
+                                        :max="5"
+                                        :error="errors.promotionCities"
+                                        @update:modelValue="formData.promotionCities = $event"
+                                    />
+                                    <small v-if="errors.promotionCities" class="p-error">{{ errors.promotionCities }}</small>
+                                </div>
+
+                                <RadioGroupField v-model="formData.averageCheck" label="Средний чек" :options="averageCheckOptions" :error="errors.averageCheck" @update:modelValue="formData.averageCheck = $event" />
+                            </StepSection>
+                        </div>
+
+                        <div v-else-if="currentStep === 2" key="step-2" class="space-y-5">
+                            <StepSection title="Продукт и поведение клиентов">
+                                <div class="field md:col-span-2">
+                                    <label for="productDescription" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Опишите продукт или услугу простыми словами * </label>
+                                    <Textarea
+                                        id="productDescription"
+                                        v-model="formData.productDescription"
+                                        placeholder="Например: Лечение зубов премиум-класса с использованием немецкого оборудования. Работаем на казахском, русском и английском языках."
+                                        rows="4"
+                                        class="w-full"
+                                        :class="{ 'p-invalid': errors.productDescription }"
+                                    />
+                                    <small v-if="errors.productDescription" class="p-error">{{ errors.productDescription }}</small>
+                                </div>
+
+                                <RadioGroupField
+                                    v-model="formData.purchaseFrequency"
+                                    label="Как часто клиенты обычно покупают?"
+                                    :options="purchaseFrequencyOptions"
+                                    :error="errors.purchaseFrequency"
+                                    @update:modelValue="formData.purchaseFrequency = $event"
+                                />
+
+                                <RadioGroupField v-model="formData.visualFactor" label="Насколько для вашей ниши важен визуал?" :options="visualFactorOptions" :error="errors.visualFactor" @update:modelValue="formData.visualFactor = $event" />
+
+                                <CheckboxCardsLimitedField
+                                    v-model="formData.customerBehaviors"
+                                    label="Как клиенты обычно принимают решение?"
+                                    :options="customerBehaviorOptions"
+                                    :max="2"
+                                    :error="errors.customerBehaviors"
+                                    @update:modelValue="formData.customerBehaviors = $event"
+                                />
+                                <small v-if="errors.customerBehaviors" class="p-error">{{ errors.customerBehaviors }}</small>
+
+                                <CheckboxCardsLimitedField
+                                    v-model="formData.decisionPriorities"
+                                    label="Что для клиентов важнее всего при выборе?"
+                                    :options="decisionPriorityOptions"
+                                    :max="2"
+                                    :error="errors.decisionPriorities"
+                                    @update:modelValue="formData.decisionPriorities = $event"
+                                />
+                                <small v-if="errors.decisionPriorities" class="p-error">{{ errors.decisionPriorities }}</small>
+
+                                <CheckboxCardsLimitedField
+                                    v-model="formData.discoveryMethods"
+                                    label="Как клиенты обычно находят вас?"
+                                    :options="discoveryMethodOptions"
+                                    :max="2"
+                                    :error="errors.discoveryMethods"
+                                    @update:modelValue="formData.discoveryMethods = $event"
+                                />
+                                <small v-if="errors.discoveryMethods" class="p-error">{{ errors.discoveryMethods }}</small>
+                            </StepSection>
+                        </div>
+
+                        <div v-else-if="currentStep === 3" key="step-3" class="space-y-5">
+                            <StepSection title="Текущая ситуация и ресурсы">
+                                <RadioGroupField v-model="formData.smmStatus" label="Как сейчас обстоят дела с соцсетями?" :options="smmStatusOptions" :error="errors.smmStatus" @update:modelValue="formData.smmStatus = $event" />
+
+                                <RadioGroupField v-model="formData.leadVolume" label="Приходят ли заявки из онлайн-каналов?" :options="leadVolumeOptions" :error="errors.leadVolume" @update:modelValue="formData.leadVolume = $event" />
+
+                                <RadioGroupField v-model="formData.responseHandler" label="Кто чаще всего отвечает на заявки?" :options="responseHandlerOptions" :error="errors.responseHandler" @update:modelValue="formData.responseHandler = $event" />
+
+                                <RadioGroupField v-model="formData.priceFeedback" label="Как клиенты чаще всего реагируют на цену?" :options="priceFeedbackOptions" :error="errors.priceFeedback" @update:modelValue="formData.priceFeedback = $event" />
+
+                                <CheckboxCardsField
+                                    v-model="formData.constraints"
+                                    label="Есть ли у бизнеса ограничения, которые нужно учесть?"
+                                    :options="businessConstraintOptions"
+                                    :error="errors.constraints"
+                                    @update:modelValue="formData.constraints = $event"
+                                />
+                            </StepSection>
+                        </div>
+
+                        <div v-else-if="currentStep === 4" key="step-4" class="space-y-5">
+                            <StepSection title="Ссылки и настройки отчёта">
+                                <DynamicLinksField
+                                    v-model="formData.userSocialLinks"
+                                    label="Ссылки на ваши соцсети"
+                                    placeholder="Например: https://instagram.com/dentart_kz или https://vk.com/clinic_almaty"
+                                    :max="5"
+                                    :error="errors.userSocialLinks"
+                                    @update:modelValue="formData.userSocialLinks = $event"
+                                />
+
+                                <DynamicLinksField
+                                    v-model="formData.knownCompetitorLinks"
+                                    label="Ссылки на конкурентов (если знаете)"
+                                    placeholder="Например: https://instagram.com/competitor_clinic или профиль в 2ГИС"
+                                    :max="5"
+                                    :error="errors.knownCompetitorLinks"
+                                    @update:modelValue="formData.knownCompetitorLinks = $event"
+                                />
+
+                                <RadioGroupField v-model="formData.detailLevel" label="Насколько детальным должен быть отчёт?" :options="detailLevelOptions" :error="errors.detailLevel" @update:modelValue="formData.detailLevel = $event" />
+
+                                <CheckboxCardsField
+                                    v-model="formData.analysisType"
+                                    label="Что важно проанализировать в первую очередь?"
+                                    :options="analysisTypeOptions"
+                                    :error="errors.analysisType"
+                                    @update:modelValue="formData.analysisType = $event"
+                                />
+                                <small v-if="errors.analysisType" class="p-error block mt-1">{{ errors.analysisType }}</small>
+                            </StepSection>
+                        </div>
+                    </Transition>
+                </div>
+
+                <div class="card-footer flex items-center justify-between gap-4 pt-6 border-t border-surface-200 dark:border-surface-700">
+                    <Button label="Назад" icon="pi pi-arrow-left" severity="secondary" outlined :disabled="currentStep === 0 || submitting" @click="goBack" />
+
+                    <Button v-if="currentStep < STEPS.length - 1" label="Далее" icon="pi pi-arrow-right" icon-pos="right" @click="goNext" />
+                    <Button v-else label="Запустить маркетинговый анализ" icon="pi pi-send" icon-pos="right" :loading="submitting" :disabled="submitting" @click="handleSubmit" />
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.slide-fade-enter-active,
+.slide-fade-leave-active {
+    transition: all 0.25s ease;
+}
+
+.slide-fade-enter-from {
+    opacity: 0;
+    transform: translateX(20px);
+}
+
+.slide-fade-leave-to {
+    opacity: 0;
+    transform: translateX(-20px);
+}
+</style>
diff --git a/src/components/marketing/MetricCard.vue b/src/components/marketing/MetricCard.vue
new file mode 100644
index 0000000..dd268f7
--- /dev/null
+++ b/src/components/marketing/MetricCard.vue
@@ -0,0 +1,39 @@
+<script setup>
+defineProps({
+    icon: {
+        type: String,
+        required: true
+    },
+    label: {
+        type: String,
+        required: true
+    },
+    value: {
+        type: [String, Number],
+        required: true
+    },
+    helper: {
+        type: String,
+        default: null
+    }
+});
+</script>
+
+<template>
+    <div class="card flex flex-col gap-3 transition hover:-translate-y-0.5 hover:shadow-md">
+        <div class="flex items-center justify-between">
+            <p class="text-xs font-medium uppercase tracking-widest text-surface-400">
+                {{ label }}
+            </p>
+            <span class="inline-flex h-9 w-9 items-center justify-center rounded-full bg-primary-50 dark:bg-primary-900/40">
+                <i :class="[icon, 'text-primary-600 dark:text-primary-300']" />
+            </span>
+        </div>
+        <p class="text-2xl font-semibold text-surface-900 dark:text-surface-0">
+            {{ value }}
+        </p>
+        <p v-if="helper" class="text-xs text-surface-500 dark:text-surface-400">
+            {{ helper }}
+        </p>
+    </div>
+</template>
diff --git a/src/components/marketing/PptConclusionBox.vue b/src/components/marketing/PptConclusionBox.vue
index 326464c..1fabd57 100644
--- a/src/components/marketing/PptConclusionBox.vue
+++ b/src/components/marketing/PptConclusionBox.vue
@@ -1,3 +1,10 @@
+<script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
+defineProps({
+    text: { type: String, required: true }
+});
+</script>
+
 <template>
     <div class="rounded-2xl bg-slate-100/70 border border-slate-200/60 px-5 py-4">
         <div class="flex items-start gap-3">
@@ -13,10 +20,3 @@
         </div>
     </div>
 </template>
-
-<script setup>
-defineProps({
-    text: { type: String, required: true }
-});
-</script>
-
diff --git a/src/components/marketing/PptFunnel.vue b/src/components/marketing/PptFunnel.vue
index 270f1a6..80d6e5d 100644
--- a/src/components/marketing/PptFunnel.vue
+++ b/src/components/marketing/PptFunnel.vue
@@ -1,40 +1,5 @@
-<template>
-    <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-        <div class="flex items-center justify-between mb-3">
-            <div class="flex items-center gap-1.5">
-                <div class="text-[15px] font-semibold text-slate-800">{{ title }}</div>
-                <i v-if="description" class="pi pi-question-circle text-[12px] text-slate-400 cursor-help" v-tooltip.top="description"></i>
-            </div>
-            <div v-if="subtitle" class="text-[12px] text-slate-500">{{ subtitle }}</div>
-        </div>
-
-        <div class="relative w-full">
-            <svg :viewBox="`0 0 ${viewW} ${viewH}`" class="w-full h-auto">
-                <g v-for="(s, idx) in normalizedSteps" :key="s.key">
-                    <polygon :points="polygonPoints(idx)" :fill="s.color" opacity="0.95"></polygon>
-                    <polygon :points="polygonPoints(idx)" fill="none" stroke="rgba(255,255,255,0.65)" stroke-width="2"></polygon>
-
-                    <text :x="viewW / 2" :y="stageTextY(idx) - 6" text-anchor="middle" fill="rgba(15,23,42,0.85)" font-size="14" font-weight="600">
-                        {{ s.label }}
-                    </text>
-                    <text :x="viewW / 2" :y="stageTextY(idx) + 14" text-anchor="middle" fill="rgba(15,23,42,0.75)" font-size="13">
-                        {{ s.value }}
-                    </text>
-
-                    <!-- conversion badge between stages -->
-                    <g v-if="s.rateToNext && idx < normalizedSteps.length - 1">
-                        <rect :x="viewW / 2 - 34" :y="badgeY(idx)" rx="10" ry="10" width="68" height="22" fill="white" stroke="rgba(15,23,42,0.12)"></rect>
-                        <text :x="viewW / 2" :y="badgeY(idx) + 15" text-anchor="middle" fill="#52C41A" font-size="12" font-weight="700">
-                            {{ s.rateToNext }}
-                        </text>
-                    </g>
-                </g>
-            </svg>
-        </div>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import { computed } from 'vue';
 
 const props = defineProps({
@@ -101,3 +66,39 @@ function badgeY(index) {
     return y + stageH + (gap - 22) / 2;
 }
 </script>
+
+<template>
+    <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+        <div class="flex items-center justify-between mb-3">
+            <div class="flex items-center gap-1.5">
+                <div class="text-[15px] font-semibold text-slate-800">{{ title }}</div>
+                <i v-if="description" class="pi pi-question-circle text-[12px] text-slate-400 cursor-help" v-tooltip.top="description"></i>
+            </div>
+            <div v-if="subtitle" class="text-[12px] text-slate-500">{{ subtitle }}</div>
+        </div>
+
+        <div class="relative w-full">
+            <svg :viewBox="`0 0 ${viewW} ${viewH}`" class="w-full h-auto">
+                <g v-for="(s, idx) in normalizedSteps" :key="s.key">
+                    <polygon :points="polygonPoints(idx)" :fill="s.color" opacity="0.95"></polygon>
+                    <polygon :points="polygonPoints(idx)" fill="none" stroke="rgba(255,255,255,0.65)" stroke-width="2"></polygon>
+
+                    <text :x="viewW / 2" :y="stageTextY(idx) - 6" text-anchor="middle" fill="rgba(15,23,42,0.85)" font-size="14" font-weight="600">
+                        {{ s.label }}
+                    </text>
+                    <text :x="viewW / 2" :y="stageTextY(idx) + 14" text-anchor="middle" fill="rgba(15,23,42,0.75)" font-size="13">
+                        {{ s.value }}
+                    </text>
+
+                    <!-- conversion badge between stages -->
+                    <g v-if="s.rateToNext && idx < normalizedSteps.length - 1">
+                        <rect :x="viewW / 2 - 34" :y="badgeY(idx)" rx="10" ry="10" width="68" height="22" fill="white" stroke="rgba(15,23,42,0.12)"></rect>
+                        <text :x="viewW / 2" :y="badgeY(idx) + 15" text-anchor="middle" fill="#52C41A" font-size="12" font-weight="700">
+                            {{ s.rateToNext }}
+                        </text>
+                    </g>
+                </g>
+            </svg>
+        </div>
+    </div>
+</template>
diff --git a/src/components/marketing/PptKpiCard.vue b/src/components/marketing/PptKpiCard.vue
index 6063a5b..8b7a7d1 100644
--- a/src/components/marketing/PptKpiCard.vue
+++ b/src/components/marketing/PptKpiCard.vue
@@ -1,3 +1,39 @@
+<script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
+import { computed } from 'vue';
+
+const props = defineProps({
+    title: { type: String, required: true },
+    value: { type: [String, Number], required: true },
+    subtitle: { type: String, default: '' },
+    icon: { type: String, default: 'pi-chart-line' },
+    accentColor: { type: String, default: '#5B89FF' },
+    trendText: { type: String, default: '' },
+    description: { type: String, default: '' }
+});
+
+function hexToRgba(hex, alpha) {
+    const h = String(hex || '')
+        .replace('#', '')
+        .trim();
+    const full =
+        h.length === 3
+            ? h
+                  .split('')
+                  .map((c) => c + c)
+                  .join('')
+            : h;
+    if (full.length !== 6) return `rgba(91, 137, 255, ${alpha})`;
+    const r = parseInt(full.slice(0, 2), 16);
+    const g = parseInt(full.slice(2, 4), 16);
+    const b = parseInt(full.slice(4, 6), 16);
+    return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+}
+
+const headerBg = computed(() => `linear-gradient(90deg, ${hexToRgba(props.accentColor, 0.2)}, ${hexToRgba(props.accentColor, 0.06)})`);
+const iconBg = computed(() => hexToRgba(props.accentColor, 0.16));
+</script>
+
 <template>
     <div class="relative overflow-hidden rounded-2xl bg-white shadow-sm border border-slate-200/60">
         <!-- subtle top tint like PPT -->
@@ -38,38 +74,3 @@
         </div>
     </div>
 </template>
-
-<script setup>
-import { computed } from 'vue';
-
-const props = defineProps({
-    title: { type: String, required: true },
-    value: { type: [String, Number], required: true },
-    subtitle: { type: String, default: '' },
-    icon: { type: String, default: 'pi-chart-line' },
-    accentColor: { type: String, default: '#5B89FF' },
-    trendText: { type: String, default: '' },
-    description: { type: String, default: '' }
-});
-
-function hexToRgba(hex, alpha) {
-    const h = String(hex || '')
-        .replace('#', '')
-        .trim();
-    const full =
-        h.length === 3
-            ? h
-                .split('')
-                .map((c) => c + c)
-                .join('')
-            : h;
-    if (full.length !== 6) return `rgba(91, 137, 255, ${alpha})`;
-    const r = parseInt(full.slice(0, 2), 16);
-    const g = parseInt(full.slice(2, 4), 16);
-    const b = parseInt(full.slice(4, 6), 16);
-    return `rgba(${r}, ${g}, ${b}, ${alpha})`;
-}
-
-const headerBg = computed(() => `linear-gradient(90deg, ${hexToRgba(props.accentColor, 0.2)}, ${hexToRgba(props.accentColor, 0.06)})`);
-const iconBg = computed(() => hexToRgba(props.accentColor, 0.16));
-</script>
diff --git a/src/components/marketing/SegmentsChannelMatrixHeatmap.vue b/src/components/marketing/SegmentsChannelMatrixHeatmap.vue
index 5a65f18..8e0a23f 100644
--- a/src/components/marketing/SegmentsChannelMatrixHeatmap.vue
+++ b/src/components/marketing/SegmentsChannelMatrixHeatmap.vue
@@ -1,36 +1,5 @@
-<template>
-    <div v-if="normalized && normalized.data.length" class="scm mt-6">
-        <div v-if="showHeader" class="flex align-items-center mb-3">
-            <i v-if="icon" :class="icon" class="text-primary-500 mr-2"></i>
-            <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ title }}</h4>
-        </div>
-
-        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-            <table class="scm__table w-full border-collapse">
-                <thead>
-                    <tr>
-                        <th class="scm__th">Сегмент</th>
-                        <th v-for="channel in normalized.channels" :key="channel" class="scm__th text-center">
-                            {{ channel }}
-                        </th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr v-for="(row, idx) in normalized.data" :key="idx" class="scm__tr">
-                        <td class="scm__td font-semibold">{{ getSegmentName(row) }}</td>
-                        <td v-for="channel in normalized.channels" :key="channel" class="scm__td text-center">
-                            <span class="scm__badge" :style="getCellStyle(row?.[channel])">
-                                {{ formatCell(row?.[channel]) }}
-                            </span>
-                        </td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import { computed } from 'vue';
 
 const props = defineProps({
@@ -100,6 +69,38 @@ const formatCell = (value) => {
 };
 </script>
 
+<template>
+    <div v-if="normalized && normalized.data.length" class="scm mt-6">
+        <div v-if="showHeader" class="flex align-items-center mb-3">
+            <i v-if="icon" :class="icon" class="text-primary-500 mr-2"></i>
+            <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ title }}</h4>
+        </div>
+
+        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+            <table class="scm__table w-full border-collapse">
+                <thead>
+                    <tr>
+                        <th class="scm__th">Сегмент</th>
+                        <th v-for="channel in normalized.channels" :key="channel" class="scm__th text-center">
+                            {{ channel }}
+                        </th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr v-for="(row, idx) in normalized.data" :key="idx" class="scm__tr">
+                        <td class="scm__td font-semibold">{{ getSegmentName(row) }}</td>
+                        <td v-for="channel in normalized.channels" :key="channel" class="scm__td text-center">
+                            <span class="scm__badge" :style="getCellStyle(row?.[channel])">
+                                {{ formatCell(row?.[channel]) }}
+                            </span>
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .scm__table {
     border: 1px solid var(--surface-border);
diff --git a/src/components/marketing/analysis/BoxplotPlaceholder.vue b/src/components/marketing/analysis/BoxplotPlaceholder.vue
new file mode 100644
index 0000000..fd87e6a
--- /dev/null
+++ b/src/components/marketing/analysis/BoxplotPlaceholder.vue
@@ -0,0 +1,54 @@
+<script setup>
+const props = defineProps({
+    data: { type: Object, default: null }
+    // data: { min, q1, median, q3, max }
+});
+
+const scaleX = (val) => {
+    if (!props.data) return 0;
+    const { min, max } = props.data;
+    const range = max - min || 1;
+    const padding = 20;
+    const width = 280 - padding * 2;
+    return padding + ((val - min) / range) * width;
+};
+</script>
+
+<template>
+    <div class="rounded-xl border border-surface-200 dark:border-surface-700 p-4">
+        <template v-if="data">
+            <!-- Simplified SVG boxplot -->
+            <svg viewBox="0 0 280 80" class="w-full h-20">
+                <!-- whisker line -->
+                <line :x1="scaleX(data.min)" y1="40" :x2="scaleX(data.max)" y2="40" stroke="currentColor" stroke-width="1.5" class="text-surface-400" />
+                <!-- left whisker cap -->
+                <line :x1="scaleX(data.min)" y1="28" :x2="scaleX(data.min)" y2="52" stroke="currentColor" stroke-width="1.5" class="text-surface-400" />
+                <!-- right whisker cap -->
+                <line :x1="scaleX(data.max)" y1="28" :x2="scaleX(data.max)" y2="52" stroke="currentColor" stroke-width="1.5" class="text-surface-400" />
+                <!-- IQR box -->
+                <rect :x="scaleX(data.q1)" y="22" :width="scaleX(data.q3) - scaleX(data.q1)" height="36" rx="4" fill="rgba(79,70,229,0.15)" stroke="#4F46E5" stroke-width="1.5" />
+                <!-- median line -->
+                <line :x1="scaleX(data.median)" y1="22" :x2="scaleX(data.median)" y2="58" stroke="#4F46E5" stroke-width="2.5" />
+                <!-- labels -->
+                <text :x="scaleX(data.min)" y="72" class="text-surface-400 text-[8px]" fill="#9CA3AF" text-anchor="middle" font-size="8">{{ data.min }}</text>
+                <text :x="scaleX(data.q1)" y="72" class="text-surface-400 text-[8px]" fill="#9CA3AF" text-anchor="middle" font-size="8">Q1</text>
+                <text :x="scaleX(data.median)" y="72" class="text-primary-500 text-[8px]" fill="#4F46E5" text-anchor="middle" font-size="8" font-weight="600">M</text>
+                <text :x="scaleX(data.q3)" y="72" class="text-surface-400 text-[8px]" fill="#9CA3AF" text-anchor="middle" font-size="8">Q3</text>
+                <text :x="scaleX(data.max)" y="72" class="text-surface-400 text-[8px]" fill="#9CA3AF" text-anchor="middle" font-size="8">{{ data.max }}</text>
+            </svg>
+            <div class="mt-2 flex justify-between text-xs text-surface-500 dark:text-surface-400">
+                <span
+                    >Медиана: <strong class="text-surface-700 dark:text-surface-300">{{ data.median }}</strong></span
+                >
+                <span
+                    >IQR: <strong class="text-surface-700 dark:text-surface-300">{{ data.q1 }}–{{ data.q3 }}</strong></span
+                >
+            </div>
+        </template>
+        <template v-else>
+            <div class="flex items-center justify-center h-20 rounded-lg border-2 border-dashed border-surface-300 dark:border-surface-600">
+                <p class="text-xs text-surface-400 dark:text-surface-500">Нет данных по распределению отзывов</p>
+            </div>
+        </template>
+    </div>
+</template>
diff --git a/src/components/marketing/analysis/ChartPlaceholder.vue b/src/components/marketing/analysis/ChartPlaceholder.vue
new file mode 100644
index 0000000..07f6169
--- /dev/null
+++ b/src/components/marketing/analysis/ChartPlaceholder.vue
@@ -0,0 +1,12 @@
+<script setup>
+defineProps({ text: { type: String, default: 'Нет данных' } });
+</script>
+
+<template>
+    <div class="flex items-center justify-center h-full min-h-[120px] rounded-xl border-2 border-dashed border-surface-300 dark:border-surface-600 bg-surface-50 dark:bg-surface-800">
+        <div class="text-center px-4">
+            <i class="pi pi-chart-bar text-2xl text-surface-400 dark:text-surface-500 mb-2" />
+            <p class="text-xs text-surface-400 dark:text-surface-500">{{ text }}</p>
+        </div>
+    </div>
+</template>
diff --git a/src/components/marketing/analysis/ExecCard.vue b/src/components/marketing/analysis/ExecCard.vue
new file mode 100644
index 0000000..c312a94
--- /dev/null
+++ b/src/components/marketing/analysis/ExecCard.vue
@@ -0,0 +1,78 @@
+<script setup>
+defineProps({
+    label: { type: String, required: true },
+    value: { type: String, required: true },
+    icon: { type: String, default: 'pi pi-chart-bar' },
+    color: { type: String, default: 'indigo' },
+    trend: { type: String, default: null } // 'up' | 'down' | 'neutral'
+});
+
+const colorMap = {
+    indigo: {
+        bg: 'bg-indigo-50 dark:bg-indigo-900/20',
+        border: 'border-indigo-200 dark:border-indigo-800',
+        label: 'text-indigo-500 dark:text-indigo-400',
+        value: 'text-indigo-800 dark:text-indigo-200',
+        iconBg: 'bg-indigo-100 dark:bg-indigo-900/40',
+        iconColor: 'text-indigo-600 dark:text-indigo-300'
+    },
+    blue: {
+        bg: 'bg-blue-50 dark:bg-blue-900/20',
+        border: 'border-blue-200 dark:border-blue-800',
+        label: 'text-blue-500 dark:text-blue-400',
+        value: 'text-blue-800 dark:text-blue-200',
+        iconBg: 'bg-blue-100 dark:bg-blue-900/40',
+        iconColor: 'text-blue-600 dark:text-blue-300'
+    },
+    violet: {
+        bg: 'bg-violet-50 dark:bg-violet-900/20',
+        border: 'border-violet-200 dark:border-violet-800',
+        label: 'text-violet-500 dark:text-violet-400',
+        value: 'text-violet-800 dark:text-violet-200',
+        iconBg: 'bg-violet-100 dark:bg-violet-900/40',
+        iconColor: 'text-violet-600 dark:text-violet-300'
+    },
+    amber: {
+        bg: 'bg-amber-50 dark:bg-amber-900/20',
+        border: 'border-amber-200 dark:border-amber-800',
+        label: 'text-amber-500 dark:text-amber-400',
+        value: 'text-amber-800 dark:text-amber-200',
+        iconBg: 'bg-amber-100 dark:bg-amber-900/40',
+        iconColor: 'text-amber-600 dark:text-amber-300'
+    },
+    emerald: {
+        bg: 'bg-emerald-50 dark:bg-emerald-900/20',
+        border: 'border-emerald-200 dark:border-emerald-800',
+        label: 'text-emerald-500 dark:text-emerald-400',
+        value: 'text-emerald-800 dark:text-emerald-200',
+        iconBg: 'bg-emerald-100 dark:bg-emerald-900/40',
+        iconColor: 'text-emerald-600 dark:text-emerald-300'
+    },
+    orange: {
+        bg: 'bg-orange-50 dark:bg-orange-900/20',
+        border: 'border-orange-200 dark:border-orange-800',
+        label: 'text-orange-500 dark:text-orange-400',
+        value: 'text-orange-800 dark:text-orange-200',
+        iconBg: 'bg-orange-100 dark:bg-orange-900/40',
+        iconColor: 'text-orange-600 dark:text-orange-300'
+    }
+};
+</script>
+
+<template>
+    <div :class="['exec-card rounded-xl border p-4 flex flex-col gap-2 transition hover:-translate-y-0.5 hover:shadow-md', colorMap[color].border, colorMap[color].bg]">
+        <div class="flex items-center justify-between">
+            <p class="text-xs font-semibold uppercase tracking-widest truncate" :class="colorMap[color].label">{{ label }}</p>
+            <span class="inline-flex h-8 w-8 items-center justify-center rounded-full shrink-0" :class="colorMap[color].iconBg">
+                <i :class="[icon, 'text-sm', colorMap[color].iconColor]" />
+            </span>
+        </div>
+        <p class="text-xl font-black leading-none" :class="colorMap[color].value">{{ value }}</p>
+        <div v-if="trend" class="flex items-center gap-1 text-xs font-medium">
+            <i :class="['pi', trend === 'up' ? 'pi-arrow-up text-emerald-500' : trend === 'down' ? 'pi-arrow-down text-rose-500' : 'pi-minus text-surface-400']" />
+            <span :class="trend === 'up' ? 'text-emerald-600' : trend === 'down' ? 'text-rose-600' : 'text-surface-400'">
+                {{ trend === 'up' ? 'Выше среднего' : trend === 'down' ? 'Ниже среднего' : 'Нейтрально' }}
+            </span>
+        </div>
+    </div>
+</template>
diff --git a/src/components/marketing/analysis/GaugeChart.vue b/src/components/marketing/analysis/GaugeChart.vue
new file mode 100644
index 0000000..9a88732
--- /dev/null
+++ b/src/components/marketing/analysis/GaugeChart.vue
@@ -0,0 +1,52 @@
+<script setup>
+import { computed } from 'vue';
+
+const props = defineProps({
+    value: { type: Number, default: 0 }, // 0–100
+    label: { type: String, default: null } // Пользовательский лейбл
+});
+
+const clampedValue = computed(() => Math.min(100, Math.max(0, Math.round(props.value))));
+const ARC_LENGTH = Math.PI * 80; // ≈ 251.3
+const trackPath = 'M 20 100 A 80 80 0 0 1 180 100';
+
+const arcDash = computed(() => {
+    const filled = (clampedValue.value / 100) * ARC_LENGTH;
+    return `${filled} ${ARC_LENGTH}`;
+});
+
+const arcColor = computed(() => {
+    const v = clampedValue.value;
+    if (v >= 70) return '#EF4444';
+    if (v >= 40) return '#F97316';
+    return '#22C55E';
+});
+
+const displayLabel = computed(() => {
+    if (props.label) return props.label;
+    const v = clampedValue.value;
+    if (v >= 70) return 'Высокая интенсивность';
+    if (v >= 40) return 'Средняя интенсивность';
+    return 'Низкая интенсивность';
+});
+</script>
+
+<template>
+    <div class="flex flex-col items-center">
+        <svg viewBox="0 0 200 130" class="w-56 h-36">
+            <!-- Background arc (track) -->
+            <path :d="trackPath" fill="none" stroke="#E5E7EB" stroke-width="18" stroke-linecap="round" class="dark:stroke-surface-700" />
+            <!-- Colored fill arc -->
+            <path :d="trackPath" fill="none" :stroke="arcColor" stroke-width="18" stroke-linecap="round" :stroke-dasharray="arcDash" stroke-dashoffset="0" style="transition: stroke-dasharray 0.9s ease" />
+            <!-- Center value -->
+            <text x="100" y="105" text-anchor="middle" font-size="28" font-weight="800" :fill="arcColor">{{ clampedValue }}</text>
+            <text x="100" y="122" text-anchor="middle" font-size="10" fill="#9CA3AF">из 100</text>
+            <!-- Min / Max labels -->
+            <text x="22" y="118" text-anchor="middle" font-size="9" fill="#9CA3AF">0</text>
+            <text x="178" y="118" text-anchor="middle" font-size="9" fill="#9CA3AF">100</text>
+        </svg>
+        <p v-if="displayLabel" class="mt-1 text-xs font-semibold uppercase tracking-widest" :style="{ color: arcColor }">
+            {{ displayLabel }}
+        </p>
+    </div>
+</template>
diff --git a/src/components/marketing/analysis/ScatterPlotSvg.vue b/src/components/marketing/analysis/ScatterPlotSvg.vue
new file mode 100644
index 0000000..0af2092
--- /dev/null
+++ b/src/components/marketing/analysis/ScatterPlotSvg.vue
@@ -0,0 +1,73 @@
+<script setup>
+import { computed } from 'vue';
+
+const props = defineProps({
+    competitors: { type: Array, default: () => [] }
+});
+
+const COLORS = ['#4F46E5', '#7C3AED', '#EC4899', '#F97316', '#22C55E', '#06B6D4', '#EAB308', '#EF4444'];
+
+const plotData = computed(() => {
+    const arr = props.competitors.slice(0, 12);
+    if (!arr.length) return [];
+
+    const maxPosts = Math.max(...arr.map((c) => c.postsPerMonth ?? 0), 1);
+    const maxEr = Math.max(...arr.map((c) => parseFloat(c.er) || 0), 1);
+    const maxFoll = Math.max(...arr.map((c) => c.followers ?? 0), 1);
+
+    const PAD = 50,
+        W = 280,
+        H = 150;
+
+    return arr.map((c) => ({
+        name: (c.name || '').slice(0, 12),
+        cx: PAD + ((c.postsPerMonth ?? 0) / maxPosts) * W,
+        cy: H - ((parseFloat(c.er) || 0) / maxEr) * H + 10,
+        r: Math.max(5, Math.min(18, ((c.followers ?? 0) / maxFoll) * 18)),
+        original: c
+    }));
+});
+</script>
+
+<template>
+    <div class="rounded-xl border border-surface-200 dark:border-surface-700 p-4">
+        <template v-if="competitors.length >= 2">
+            <svg viewBox="0 0 340 200" class="w-full h-48">
+                <!-- Grid lines -->
+                <line v-for="i in 4" :key="'gy' + i" x1="40" :y1="40 * i" x2="330" :y2="40 * i" stroke="currentColor" stroke-width="0.5" class="text-surface-200 dark:text-surface-700" opacity="0.5" />
+                <line v-for="i in 6" :key="'gx' + i" :x1="40 + i * 48" y1="0" :x2="40 + i * 48" y2="168" stroke="currentColor" stroke-width="0.5" class="text-surface-200 dark:text-surface-700" opacity="0.5" />
+                <!-- Axes -->
+                <line x1="40" y1="0" x2="40" y2="170" stroke="#9CA3AF" stroke-width="1" />
+                <line x1="38" y1="168" x2="335" y2="168" stroke="#9CA3AF" stroke-width="1" />
+                <!-- Axis labels -->
+                <text x="185" y="195" fill="#9CA3AF" font-size="9" text-anchor="middle">Активность (постов/мес)</text>
+                <text x="8" y="90" fill="#9CA3AF" font-size="9" text-anchor="middle" transform="rotate(-90,8,90)">Вовлечённость (ER%)</text>
+                <!-- Bubbles -->
+                <g v-for="(c, i) in plotData" :key="i">
+                    <circle
+                        :cx="c.cx"
+                        :cy="c.cy"
+                        :r="c.r"
+                        :fill="COLORS[i % COLORS.length]"
+                        opacity="0.7"
+                        class="transition-all duration-300"
+                        v-tooltip.top="`${c.name}\nПостов: ${c.original.postsPerMonth}, ER: ${c.original.er}%\nПодписчиков: ${c.original.followers}`"
+                    />
+                    <text :x="c.cx" :y="c.cy - c.r - 3" fill="#4B5563" font-size="7" text-anchor="middle" class="dark:fill-gray-300">{{ c.name }}</text>
+                </g>
+            </svg>
+            <div class="mt-2 flex justify-between text-xs text-surface-500 dark:text-surface-400">
+                <span>Размер пузыря = аудитория</span>
+                <span>{{ plotData.length }} игроков</span>
+            </div>
+        </template>
+        <template v-else>
+            <div class="flex items-center justify-center h-48 rounded-lg border-2 border-dashed border-surface-300 dark:border-surface-600">
+                <div class="text-center">
+                    <i class="pi pi-chart-scatter text-2xl text-surface-400 mb-2" />
+                    <p class="text-xs text-surface-400">Нет данных для Scatter Plot</p>
+                </div>
+            </div>
+        </template>
+    </div>
+</template>
diff --git a/src/components/marketing/analysis/SectionBlock.vue b/src/components/marketing/analysis/SectionBlock.vue
new file mode 100644
index 0000000..dc9bcdc
--- /dev/null
+++ b/src/components/marketing/analysis/SectionBlock.vue
@@ -0,0 +1,22 @@
+<script setup>
+defineProps({
+    id: { type: String, default: '' },
+    title: { type: String, required: true },
+    subtitle: { type: String, default: '' }
+});
+</script>
+
+<template>
+    <div :id="id" class="card scroll-mt-4">
+        <div class="flex items-start justify-between mb-4 gap-2">
+            <div>
+                <h2 class="text-base font-bold text-surface-900 dark:text-surface-0 tracking-tight">{{ title }}</h2>
+                <p v-if="subtitle" class="text-xs text-surface-500 dark:text-surface-400 mt-0.5">{{ subtitle }}</p>
+            </div>
+            <slot name="actions" />
+        </div>
+        <div class="border-t border-surface-200 dark:border-surface-700 pt-4">
+            <slot />
+        </div>
+    </div>
+</template>
diff --git a/src/components/marketing/wizard/CheckboxCardsField.vue b/src/components/marketing/wizard/CheckboxCardsField.vue
new file mode 100644
index 0000000..d756975
--- /dev/null
+++ b/src/components/marketing/wizard/CheckboxCardsField.vue
@@ -0,0 +1,58 @@
+<script setup>
+const props = defineProps({
+    modelValue: {
+        type: Array,
+        default: () => []
+    },
+    label: {
+        type: String,
+        required: true
+    },
+    options: {
+        type: Array,
+        required: true
+    },
+    error: {
+        type: String,
+        default: null
+    }
+});
+
+const emit = defineEmits(['update:modelValue']);
+
+const isSelected = (value) => {
+    return props.modelValue.includes(value);
+};
+
+const toggle = (value) => {
+    const newValue = [...props.modelValue];
+    if (isSelected(value)) {
+        const index = newValue.indexOf(value);
+        newValue.splice(index, 1);
+    } else {
+        newValue.push(value);
+    }
+    emit('update:modelValue', newValue);
+};
+</script>
+
+<template>
+    <div class="field md:col-span-2 space-y-2">
+        <p class="text-xs font-medium text-surface-600 dark:text-surface-300">{{ label }}</p>
+        <div class="grid grid-cols-1 gap-2 sm:grid-cols-2">
+            <div
+                v-for="option in options"
+                :key="option.value"
+                class="flex items-start gap-2 rounded-xl border px-4 py-3 text-left text-sm transition cursor-pointer"
+                :class="{
+                    'border-primary-500 bg-primary-50 text-primary-900 shadow-sm dark:border-primary-400 dark:bg-primary-900/30 dark:text-primary-50': isSelected(option.value),
+                    'border-surface-200 bg-surface-0 text-surface-900 hover:border-primary-200 hover:bg-primary-50/40 dark:border-surface-700 dark:bg-surface-900 dark:text-surface-100 dark:hover:border-primary-500/60': !isSelected(option.value)
+                }"
+                @click="toggle(option.value)"
+            >
+                <span class="font-medium">{{ option.label }}</span>
+            </div>
+        </div>
+        <small v-if="error" class="p-error">{{ error }}</small>
+    </div>
+</template>
diff --git a/src/components/marketing/wizard/CheckboxCardsLimitedField.vue b/src/components/marketing/wizard/CheckboxCardsLimitedField.vue
new file mode 100644
index 0000000..c0423c9
--- /dev/null
+++ b/src/components/marketing/wizard/CheckboxCardsLimitedField.vue
@@ -0,0 +1,75 @@
+<script setup>
+import { computed } from 'vue';
+
+const props = defineProps({
+    modelValue: {
+        type: Array,
+        default: () => []
+    },
+    label: {
+        type: String,
+        required: true
+    },
+    options: {
+        type: Array,
+        required: true
+    },
+    max: {
+        type: Number,
+        default: 2
+    },
+    error: {
+        type: String,
+        default: null
+    }
+});
+
+const emit = defineEmits(['update:modelValue']);
+
+const isSelected = (value) => {
+    return props.modelValue.includes(value);
+};
+
+const isDisabled = (value) => {
+    return !isSelected(value) && props.modelValue.length >= props.max;
+};
+
+const toggle = (value) => {
+    if (isDisabled(value)) return;
+
+    const newValue = [...props.modelValue];
+    if (isSelected(value)) {
+        const index = newValue.indexOf(value);
+        newValue.splice(index, 1);
+    } else {
+        newValue.push(value);
+    }
+    emit('update:modelValue', newValue);
+};
+</script>
+
+<template>
+    <div class="field md:col-span-2 space-y-2">
+        <p class="text-xs font-medium text-surface-600 dark:text-surface-300">
+            {{ label }}
+            <span class="font-normal text-surface-400">(можно выбрать до {{ max }})</span>
+        </p>
+        <div class="grid grid-cols-1 gap-2 sm:grid-cols-2">
+            <div
+                v-for="option in options"
+                :key="option.value"
+                class="flex items-start gap-2 rounded-xl border px-4 py-3 text-left text-sm transition cursor-pointer"
+                :class="{
+                    'border-primary-500 bg-primary-50 text-primary-900 shadow-sm dark:border-primary-400 dark:bg-primary-900/30 dark:text-primary-50': isSelected(option.value),
+                    'border-surface-200 bg-surface-0 text-surface-900 hover:border-primary-200 hover:bg-primary-50/40 dark:border-surface-700 dark:bg-surface-900 dark:text-surface-100 dark:hover:border-primary-500/60':
+                        !isSelected(option.value) && !isDisabled(option.value),
+                    'opacity-50 cursor-not-allowed': isDisabled(option.value)
+                }"
+                @click="toggle(option.value)"
+            >
+                <span class="font-medium">{{ option.label }}</span>
+            </div>
+        </div>
+        <small v-if="error" class="p-error">{{ error }}</small>
+    </div>
+</template>
diff --git a/src/components/marketing/wizard/DynamicLinksField.vue b/src/components/marketing/wizard/DynamicLinksField.vue
new file mode 100644
index 0000000..f8078f2
--- /dev/null
+++ b/src/components/marketing/wizard/DynamicLinksField.vue
@@ -0,0 +1,61 @@
+<script setup>
+import { watch } from 'vue';
+
+const props = defineProps({
+    modelValue: {
+        type: Array,
+        default: () => []
+    },
+    label: {
+        type: String,
+        required: true
+    },
+    placeholder: {
+        type: String,
+        default: 'https://...'
+    },
+    max: {
+        type: Number,
+        default: 5
+    },
+    error: {
+        type: String,
+        default: null
+    }
+});
+
+const emit = defineEmits(['update:modelValue']);
+
+const addLink = () => {
+    if (props.modelValue.length >= props.max) return;
+    emit('update:modelValue', [...props.modelValue, '']);
+};
+
+const removeLink = (index) => {
+    const newValue = [...props.modelValue];
+    newValue.splice(index, 1);
+    emit('update:modelValue', newValue);
+};
+
+const updateLink = (index, value) => {
+    const newValue = [...props.modelValue];
+    newValue[index] = value;
+    emit('update:modelValue', newValue);
+};
+</script>
+
+<template>
+    <div class="field md:col-span-2 space-y-2">
+        <div class="flex items-center justify-between">
+            <p class="text-xs font-medium text-surface-600 dark:text-surface-300">{{ label }}</p>
+            <Button label="Добавить ссылку" icon="pi pi-plus" size="small" text severity="secondary" @click="addLink" />
+        </div>
+        <div class="space-y-2">
+            <div v-for="(link, index) in modelValue" :key="index" class="flex items-center gap-2">
+                <InputText :modelValue="link" :placeholder="placeholder" class="flex-1 text-xs" @update:modelValue="updateLink(index, $event)" />
+                <Button icon="pi pi-times" severity="danger" text rounded size="small" @click="removeLink(index)" />
+            </div>
+        </div>
+        <small v-if="error" class="p-error">{{ error }}</small>
+    </div>
+</template>
diff --git a/src/components/marketing/wizard/RadioGroupField.vue b/src/components/marketing/wizard/RadioGroupField.vue
new file mode 100644
index 0000000..75db88d
--- /dev/null
+++ b/src/components/marketing/wizard/RadioGroupField.vue
@@ -0,0 +1,43 @@
+<script setup>
+defineProps({
+    modelValue: {
+        type: String,
+        required: true
+    },
+    label: {
+        type: String,
+        required: true
+    },
+    options: {
+        type: Array,
+        required: true
+    },
+    error: {
+        type: String,
+        default: null
+    }
+});
+
+defineEmits(['update:modelValue']);
+</script>
+
+<template>
+    <div class="field md:col-span-2 space-y-2">
+        <p class="text-xs font-medium text-surface-600 dark:text-surface-300">{{ label }}</p>
+        <div class="grid grid-cols-1 gap-2 sm:grid-cols-2">
+            <div
+                v-for="option in options"
+                :key="option.value"
+                class="flex items-start gap-2 rounded-xl border px-4 py-3 text-left text-sm transition cursor-pointer"
+                :class="{
+                    'border-primary-500 bg-primary-50 text-primary-900 shadow-sm dark:border-primary-400 dark:bg-primary-900/30 dark:text-primary-50': modelValue === option.value,
+                    'border-surface-200 bg-surface-0 text-surface-900 hover:border-primary-200 hover:bg-primary-50/40 dark:border-surface-700 dark:bg-surface-900 dark:text-surface-100 dark:hover:border-primary-500/60': modelValue !== option.value
+                }"
+                @click="$emit('update:modelValue', option.value)"
+            >
+                <span class="font-medium">{{ option.label }}</span>
+            </div>
+        </div>
+        <small v-if="error" class="p-error">{{ error }}</small>
+    </div>
+</template>
diff --git a/src/components/marketing/wizard/StepSection.vue b/src/components/marketing/wizard/StepSection.vue
new file mode 100644
index 0000000..e78cff6
--- /dev/null
+++ b/src/components/marketing/wizard/StepSection.vue
@@ -0,0 +1,19 @@
+<script setup>
+defineProps({
+    title: {
+        type: String,
+        required: true
+    }
+});
+</script>
+
+<template>
+    <section class="space-y-4">
+        <h2 class="text-sm font-semibold uppercase tracking-wider text-surface-500 dark:text-surface-400">
+            {{ title }}
+        </h2>
+        <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
+            <slot />
+        </div>
+    </section>
+</template>
diff --git a/src/components/marketing/wizard/TagArrayField.vue b/src/components/marketing/wizard/TagArrayField.vue
new file mode 100644
index 0000000..53d6b1c
--- /dev/null
+++ b/src/components/marketing/wizard/TagArrayField.vue
@@ -0,0 +1,68 @@
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+    modelValue: {
+        type: Array,
+        default: () => []
+    },
+    label: {
+        type: String,
+        default: ''
+    },
+    placeholder: {
+        type: String,
+        default: 'Введите значение и нажмите Enter'
+    },
+    max: {
+        type: Number,
+        default: 5
+    },
+    error: {
+        type: String,
+        default: null
+    }
+});
+
+const emit = defineEmits(['update:modelValue']);
+
+const inputValue = ref('');
+
+const addTag = () => {
+    const value = inputValue.value.trim();
+    if (!value) return;
+    if (props.modelValue.includes(value)) return;
+    if (props.modelValue.length >= props.max) return;
+
+    emit('update:modelValue', [...props.modelValue, value]);
+    inputValue.value = '';
+};
+
+const remove = (index) => {
+    const newValue = [...props.modelValue];
+    newValue.splice(index, 1);
+    emit('update:modelValue', newValue);
+};
+</script>
+
+<template>
+    <div class="field md:col-span-2 space-y-1">
+        <label class="text-xs font-medium text-surface-600 dark:text-surface-300">{{ label }}</label>
+        <div class="rounded-lg border border-surface-200 bg-surface-0 px-3 py-2 shadow-sm dark:border-surface-700 dark:bg-surface-950">
+            <div class="flex flex-wrap gap-1">
+                <Tag v-for="(item, index) in modelValue" :key="index" :value="item" severity="info" class="cursor-pointer" @click="remove(index)" />
+                <div class="flex items-center gap-1 flex-1">
+                    <input
+                        v-model="inputValue"
+                        type="text"
+                        :placeholder="placeholder"
+                        class="min-w-[120px] flex-1 border-0 bg-transparent text-xs text-surface-900 placeholder:text-surface-400 focus:outline-none focus:ring-0 dark:text-surface-100"
+                        @keydown.enter.prevent="addTag"
+                    />
+                    <Button icon="pi pi-plus" size="small" text rounded :disabled="!inputValue.trim() || modelValue.length >= max" @click="addTag" v-tooltip.top="'Добавить'" />
+                </div>
+            </div>
+        </div>
+        <small v-if="error" class="p-error">{{ error }}</small>
+    </div>
+</template>
diff --git a/src/components/news/NewsFilters.vue b/src/components/news/NewsFilters.vue
index cd381d9..505953c 100644
--- a/src/components/news/NewsFilters.vue
+++ b/src/components/news/NewsFilters.vue
@@ -1,83 +1,3 @@
-<template>
-    <Card class="mb-4">
-        <template #title>
-            <div class="flex align-items-center">
-                <i class="pi pi-filter mr-2"></i>
-                Фильтры
-            </div>
-        </template>
-        <template #content>
-            <div class="grid">
-                <!-- Фильтр по источнику -->
-                <div class="col-12 md:col-4">
-                    <div class="field">
-                        <label for="sourceFilter" class="font-medium block mb-2">Источник</label>
-                        <Dropdown id="sourceFilter" v-model="localFilters.sourceName" :options="sourceOptions" optionLabel="label" optionValue="value" placeholder="Все источники" :loading="loading" showClear class="w-full" />
-                    </div>
-                </div>
-
-                <!-- Фильтр по дате начала -->
-                <div class="col-12 md:col-4">
-                    <div class="field">
-                        <label for="startDate" class="font-medium block mb-2">Дата от</label>
-                        <Calendar id="startDate" v-model="localFilters.startDate" placeholder="Выберите дату" dateFormat="yy-mm-dd" showIcon class="w-full" />
-                    </div>
-                </div>
-
-                <!-- Фильтр по дате окончания -->
-                <div class="col-12 md:col-4">
-                    <div class="field">
-                        <label for="endDate" class="font-medium block mb-2">Дата до</label>
-                        <Calendar id="endDate" v-model="localFilters.endDate" placeholder="Выберите дату" dateFormat="yy-mm-dd" showIcon class="w-full" />
-                    </div>
-                </div>
-
-                <!-- Сортировка -->
-                <div class="col-12 md:col-6">
-                    <div class="field">
-                        <label for="sortField" class="font-medium block mb-2">Сортировка по</label>
-                        <Dropdown id="sortField" v-model="sortField" :options="sortFieldOptions" optionLabel="label" optionValue="value" placeholder="Выберите поле" class="w-full" />
-                    </div>
-                </div>
-
-                <div class="col-12 md:col-6">
-                    <div class="field">
-                        <label for="sortOrder" class="font-medium block mb-2">Порядок</label>
-                        <Dropdown id="sortOrder" v-model="sortOrder" :options="sortOrderOptions" optionLabel="label" optionValue="value" placeholder="Выберите порядок" class="w-full" />
-                    </div>
-                </div>
-
-                <!-- Размер страницы -->
-                <div class="col-12 md:col-6">
-                    <div class="field">
-                        <label for="pageSize" class="font-medium block mb-2">Новостей на странице</label>
-                        <Dropdown id="pageSize" v-model="localFilters.size" :options="pageSizeOptions" optionLabel="label" optionValue="value" placeholder="Выберите размер" class="w-full" />
-                    </div>
-                </div>
-
-                <!-- Быстрые фильтры -->
-                <div class="col-12 md:col-6">
-                    <div class="field">
-                        <label class="font-medium block mb-2">Быстрые фильтры</label>
-                        <div class="flex flex-wrap gap-2">
-                            <Button label="Сегодня" size="small" severity="secondary" @click="setTodayFilter" />
-                            <Button label="Неделя" size="small" severity="secondary" @click="setWeekFilter" />
-                            <Button label="Месяц" size="small" severity="secondary" @click="setMonthFilter" />
-                            <Button label="Очистить" size="small" severity="danger" @click="clearFilters" />
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            <!-- Кнопки действий -->
-            <div class="flex justify-content-end gap-2 mt-3">
-                <Button label="Сбросить" icon="pi pi-times" severity="secondary" @click="resetFilters" />
-                <Button label="Применить" icon="pi pi-check" @click="applyFilters" :loading="loading" />
-            </div>
-        </template>
-    </Card>
-</template>
-
 <script setup>
 import Button from 'primevue/button';
 import Calendar from 'primevue/calendar';
@@ -213,6 +133,86 @@ const initializeFromProps = () => {
 watch(() => props.filters, initializeFromProps, { immediate: true, deep: true });
 </script>
 
+<template>
+    <Card class="mb-4">
+        <template #title>
+            <div class="flex align-items-center">
+                <i class="pi pi-filter mr-2"></i>
+                Фильтры
+            </div>
+        </template>
+        <template #content>
+            <div class="grid">
+                <!-- Фильтр по источнику -->
+                <div class="col-12 md:col-4">
+                    <div class="field">
+                        <label for="sourceFilter" class="font-medium block mb-2">Источник</label>
+                        <Dropdown id="sourceFilter" v-model="localFilters.sourceName" :options="sourceOptions" optionLabel="label" optionValue="value" placeholder="Все источники" :loading="loading" showClear class="w-full" />
+                    </div>
+                </div>
+
+                <!-- Фильтр по дате начала -->
+                <div class="col-12 md:col-4">
+                    <div class="field">
+                        <label for="startDate" class="font-medium block mb-2">Дата от</label>
+                        <Calendar id="startDate" v-model="localFilters.startDate" placeholder="Выберите дату" dateFormat="yy-mm-dd" showIcon class="w-full" />
+                    </div>
+                </div>
+
+                <!-- Фильтр по дате окончания -->
+                <div class="col-12 md:col-4">
+                    <div class="field">
+                        <label for="endDate" class="font-medium block mb-2">Дата до</label>
+                        <Calendar id="endDate" v-model="localFilters.endDate" placeholder="Выберите дату" dateFormat="yy-mm-dd" showIcon class="w-full" />
+                    </div>
+                </div>
+
+                <!-- Сортировка -->
+                <div class="col-12 md:col-6">
+                    <div class="field">
+                        <label for="sortField" class="font-medium block mb-2">Сортировка по</label>
+                        <Dropdown id="sortField" v-model="sortField" :options="sortFieldOptions" optionLabel="label" optionValue="value" placeholder="Выберите поле" class="w-full" />
+                    </div>
+                </div>
+
+                <div class="col-12 md:col-6">
+                    <div class="field">
+                        <label for="sortOrder" class="font-medium block mb-2">Порядок</label>
+                        <Dropdown id="sortOrder" v-model="sortOrder" :options="sortOrderOptions" optionLabel="label" optionValue="value" placeholder="Выберите порядок" class="w-full" />
+                    </div>
+                </div>
+
+                <!-- Размер страницы -->
+                <div class="col-12 md:col-6">
+                    <div class="field">
+                        <label for="pageSize" class="font-medium block mb-2">Новостей на странице</label>
+                        <Dropdown id="pageSize" v-model="localFilters.size" :options="pageSizeOptions" optionLabel="label" optionValue="value" placeholder="Выберите размер" class="w-full" />
+                    </div>
+                </div>
+
+                <!-- Быстрые фильтры -->
+                <div class="col-12 md:col-6">
+                    <div class="field">
+                        <label class="font-medium block mb-2">Быстрые фильтры</label>
+                        <div class="flex flex-wrap gap-2">
+                            <Button label="Сегодня" size="small" severity="secondary" @click="setTodayFilter" />
+                            <Button label="Неделя" size="small" severity="secondary" @click="setWeekFilter" />
+                            <Button label="Месяц" size="small" severity="secondary" @click="setMonthFilter" />
+                            <Button label="Очистить" size="small" severity="danger" @click="clearFilters" />
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Кнопки действий -->
+            <div class="flex justify-content-end gap-2 mt-3">
+                <Button label="Сбросить" icon="pi pi-times" severity="secondary" @click="resetFilters" />
+                <Button label="Применить" icon="pi pi-check" @click="applyFilters" :loading="loading" />
+            </div>
+        </template>
+    </Card>
+</template>
+
 <style scoped>
 .field {
     margin-bottom: 1rem;
diff --git a/src/router/index.js b/src/router/index.js
index 0e8b3c1..a83161f 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -271,6 +271,30 @@ const router = createRouter({
             component: () => import('@/views/pages/marketing/MarketingCredentials.vue'),
             meta: { requiresAuth: true }
         },
+        {
+            path: '/marketing-analysis/v3',
+            name: 'marketing-v3-list',
+            component: () => import('@/views/pages/marketing/MarketingAnalysisV3List.vue'),
+            meta: { requiresAuth: true }
+        },
+        {
+            path: '/marketing-analysis/v3/new',
+            name: 'marketing-v3-wizard',
+            component: () => import('@/components/marketing/MarketingBriefWizardV3.vue'),
+            meta: { requiresAuth: true }
+        },
+        {
+            path: '/marketing-analysis/v3/:id',
+            name: 'marketing-v3-analysis',
+            component: () => import('@/views/pages/marketing/MarketingAnalysisV3.vue'),
+            meta: { requiresAuth: true }
+        },
+        {
+            path: '/marketing-analysis/v3/strategy',
+            name: 'marketing-v3-strategy',
+            component: () => import('@/views/pages/marketing/MarketingStrategyV3.vue'),
+            meta: { requiresAuth: true }
+        },
         {
             path: '/pages/notfound',
             name: 'notfound',
diff --git a/src/service/AuthService.js b/src/service/AuthService.js
index 7e95e5a..d145b95 100644
--- a/src/service/AuthService.js
+++ b/src/service/AuthService.js
@@ -1,7 +1,7 @@
 // Lightweight auth service to manage tokens and API calls
 
 // Use proxy in development, direct API in production
-const API_URL = import.meta.env.VITE_API_URL || (import.meta.env.DEV ? '' : 'https://api.konturai.kz');
+const API_URL = import.meta.env.VITE_API_URL || 'https://api.konturai.kz';
 
 const TOKEN_STORAGE_KEY = 'auth.accessToken';
 const REFRESH_STORAGE_KEY = 'auth.refreshToken';
@@ -82,7 +82,11 @@ async function authFetch(input, init = {}) {
     const headers = new Headers(restInit.headers || {});
     const token = getAccessToken();
     if (token) headers.set('Authorization', `Bearer ${token}`);
-    headers.set('Content-Type', headers.get('Content-Type') || 'application/json');
+    // If body is FormData, don't set Content-Type header - browser will set it with boundary
+    const isFormData = typeof FormData !== 'undefined' && restInit.body instanceof FormData;
+    if (!isFormData) {
+        headers.set('Content-Type', headers.get('Content-Type') || 'application/json');
+    }
 
     let timeoutId = null;
     let controller = null;
@@ -132,7 +136,11 @@ async function authFetch(input, init = {}) {
         const newAccess = await refreshToken();
         const retryHeaders = new Headers(restInit.headers || {});
         retryHeaders.set('Authorization', `Bearer ${newAccess}`);
-        if (!retryHeaders.get('Content-Type')) retryHeaders.set('Content-Type', 'application/json');
+
+        const isRetryFormData = typeof FormData !== 'undefined' && restInit.body instanceof FormData;
+        if (!isRetryFormData && !retryHeaders.get('Content-Type')) {
+            retryHeaders.set('Content-Type', 'application/json');
+        }
 
         // Retry uses the same timeout/signal settings
         let retryTimeoutId = null;
diff --git a/src/service/MarketingService.js b/src/service/MarketingService.js
index 892fa09..f93eaad 100644
--- a/src/service/MarketingService.js
+++ b/src/service/MarketingService.js
@@ -3,6 +3,7 @@ import AuthService from './AuthService';
 
 const API_BASE_URL = API_CONFIG.BASE_URL;
 
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 class MarketingService {
     /**
      * Запуск маркетингового анализа
@@ -141,7 +142,7 @@ class MarketingService {
             // v2: извлекаем data из обёртки {success, message, data}, если она есть
             // для обратной совместимости поддерживаем оба формата
             let extracted = result.data || result;
-            
+
             // Убеждаемся, что sources сохраняются, если они есть в исходных данных
             if (extracted && !extracted.sources) {
                 if (result.data?.sources) {
@@ -150,7 +151,7 @@ class MarketingService {
                     extracted.sources = result.sources;
                 }
             }
-            
+
             return extracted;
         } catch (error) {
             console.error('Ошибка при запуске маркетингового анализа v2:', error);
diff --git a/src/service/MarketingV3Service.js b/src/service/MarketingV3Service.js
new file mode 100644
index 0000000..1332995
--- /dev/null
+++ b/src/service/MarketingV3Service.js
@@ -0,0 +1,136 @@
+import { API_CONFIG, DEFAULT_REQUEST_CONFIG } from '@/config/api';
+import AuthService from './AuthService';
+
+const API_BASE_URL = API_CONFIG.BASE_URL;
+
+class MarketingV3Service {
+    /**
+     * Запуск маркетингового анализа v4.0
+     * POST /api/marketing/v3/start
+     * @param {Object} data - MarketingAnalysisV3Request
+     * @returns {Promise<Object>} { analysisId: string }
+     */
+    async startAnalysisV3(data) {
+        try {
+            const response = await AuthService.authFetch(`${API_BASE_URL}/api/marketing/v3/start`, {
+                method: 'POST',
+                ...DEFAULT_REQUEST_CONFIG,
+                body: JSON.stringify(data)
+            });
+
+            const result = await response.json().catch(() => null);
+
+            if (!response.ok) {
+                throw new Error(result?.message || result?.error?.message || 'Ошибка при запуске анализа v4.0');
+            }
+
+            return result?.data ?? result;
+        } catch (error) {
+            console.error('Ошибка при запуске маркетингового анализа v4.0:', error);
+            throw error;
+        }
+    }
+
+    /**
+     * Получение анализа v4.0 по ID
+     * GET /api/marketing/v3/{id}
+     * @param {string} id - Идентификатор анализа
+     * @returns {Promise<Object>} MarketingAnalysisV3Document
+     */
+    async getAnalysisV3ById(id) {
+        try {
+            const response = await AuthService.authFetch(`${API_BASE_URL}/api/marketing/v3/${id}`);
+
+            const result = await response.json().catch(() => null);
+
+            if (!response.ok) {
+                throw new Error(result?.message || result?.error?.message || 'Ошибка при получении анализа v4.0');
+            }
+
+            return result?.data ?? result;
+        } catch (error) {
+            console.error('Ошибка при получении анализа v4.0:', error);
+            throw error;
+        }
+    }
+    async getUserAnalyses() {
+        try {
+            const response = await AuthService.authFetch(`${API_BASE_URL}/api/marketing/v3/my`);
+            const result = await response.json().catch(() => null);
+            if (!response.ok) {
+                throw new Error(result?.message || result?.error?.message || 'Ошибка при получении списка анализов');
+            }
+            // ApiResponse wrapper: { data: [...] } или прямой массив
+            return result?.data ?? result ?? [];
+        } catch (error) {
+            console.error('Ошибка при получении списка анализов v4.0:', error);
+            throw error;
+        }
+    }
+
+    /**
+     * ЭТАП 2: Предпросмотр стратегии
+     * GET /api/marketing/v3/{analysisId}/strategy-preview
+     * @param {string} analysisId - Идентификатор анализа
+     * @returns {Promise<Object>} Описание рекомендуемой стратегии
+     */
+    async getStrategyPreview(analysisId) {
+        try {
+            const response = await AuthService.authFetch(`${API_BASE_URL}/api/marketing/v3/${analysisId}/strategy-preview`);
+            const result = await response.json().catch(() => null);
+            if (!response.ok) {
+                throw new Error(result?.message || result?.error?.message || 'Ошибка при получении предпросмотра стратегии');
+            }
+            return result?.data ?? result;
+        } catch (error) {
+            console.error('Ошибка при предпросмотре стратегии v4.0:', error);
+            throw error;
+        }
+    }
+
+    /**
+     * ЭТАП 3: Запуск генерации стратегии (с логотипом)
+     * POST /api/marketing/v3/{analysisId}/strategy/generate
+     * @param {string} analysisId - Идентификатор анализа
+     * @param {FormData} formData - Объект FormData (содержит поля request Blob и необязательно logo File)
+     * @returns {Promise<Object>} { strategyId: string }
+     */
+    async generateStrategy(analysisId, formData) {
+        try {
+            const response = await AuthService.authFetch(`${API_BASE_URL}/api/marketing/v3/${analysisId}/strategy/generate`, {
+                method: 'POST',
+                body: formData // Не указываем Content-Type, браузер сам поставит multipart/form-data с правильным boundary
+            });
+            const result = await response.json().catch(() => null);
+            if (!response.ok) {
+                throw new Error(result?.message || result?.error?.message || 'Ошибка при запуске генерации стратегии');
+            }
+            return result?.data ?? result;
+        } catch (error) {
+            console.error('Ошибка при запуске генерации стратегии v4.0:', error);
+            throw error;
+        }
+    }
+
+    /**
+     * ЭТАП 4: Поллинг статуса стратегии
+     * GET /api/marketing/v3/strategy/{strategyId}
+     * @param {string} strategyId - Идентификатор стратегии
+     * @returns {Promise<Object>} Данные стратегии, включая статус и результаты, когда готово
+     */
+    async getStrategyStatus(strategyId) {
+        try {
+            const response = await AuthService.authFetch(`${API_BASE_URL}/api/marketing/v3/strategy/${strategyId}`);
+            const result = await response.json().catch(() => null);
+            if (!response.ok) {
+                throw new Error(result?.message || result?.error?.message || 'Ошибка при проверке статуса стратегии');
+            }
+            return result?.data ?? result;
+        } catch (error) {
+            console.error('Ошибка при проверке статуса стратегии v4.0:', error);
+            throw error;
+        }
+    }
+}
+
+export default new MarketingV3Service();
diff --git a/src/types/marketing-v3.js b/src/types/marketing-v3.js
new file mode 100644
index 0000000..804e5ed
--- /dev/null
+++ b/src/types/marketing-v3.js
@@ -0,0 +1,129 @@
+// Типы для маркетингового анализа v4.0
+// Адаптировано из TypeScript версии для Vue.js
+
+export const MARKETING_ANALYSIS_STATUS = {
+    QUEUED: 'QUEUED',
+    PROCESSING: 'PROCESSING',
+    COMPLETED: 'COMPLETED',
+    FAILED: 'FAILED'
+};
+
+// Enum маппинги для UI
+export const BusinessStageLabels = {
+    JUST_STARTING: 'Только запускаемся',
+    LESS_THAN_ONE_YEAR: 'Работаем до 1 года',
+    ONE_TO_THREE_YEARS: 'Работаем 1–3 года',
+    MORE_THAN_THREE_YEARS: 'Работаем более 3 лет'
+};
+
+export const ClientTargetLabels = {
+    PRIVATE_CLIENTS: 'Работаем с конечными клиентами (B2C)',
+    BUSINESS: 'Работаем с бизнесом (B2B)',
+    MIXED: 'Смешанная модель (B2B + B2C)'
+};
+
+export const OfferTypeLabels = {
+    SERVICES: 'Услуги',
+    GOODS: 'Товары',
+    SUBSCRIPTION: 'Подписка / доступ'
+};
+
+export const AverageCheckLabels = {
+    LOW: 'Низкий чек',
+    MEDIUM: 'Средний чек',
+    HIGH: 'Высокий чек'
+};
+
+export const CustomerBehaviorLabels = {
+    BUY_QUICKLY: 'Покупают быстро, без долгих раздумий',
+    COMPARE_OPTIONS: 'Сравнивают варианты и предложения',
+    REQUEST_PROPOSAL: 'Запрашивают индивидуальное коммерческое предложение',
+    CHECK_REVIEWS: 'Внимательно читают отзывы и рейтинги',
+    NEED_CONSULTATION: 'Нуждаются в консультации перед покупкой'
+};
+
+export const GeoScopeLabels = {
+    SINGLE_CITY: 'Один город',
+    MULTI_CITY: 'Несколько городов',
+    FULL_COUNTRY: 'Вся страна',
+    ONLINE: 'Онлайн по всему миру'
+};
+
+export const PurchaseFrequencyLabels = {
+    ONCE: 'Одна покупка',
+    MULTIPLE_PER_YEAR: 'Несколько раз в год',
+    REGULARLY: 'Регулярно (ежемесячно / чаще)'
+};
+
+export const VisualFactorLabels = {
+    VISUALS_IMPORTANT: 'Визуал критически важен (эстетика, фото, видео)',
+    PARTIALLY: 'Важно, но не критично',
+    EXPLANATION_IMPORTANT: 'Тексты и экспертность важнее визуала для доверия'
+};
+
+export const DecisionPriorityLabels = {
+    PRICE: 'Цена',
+    QUALITY: 'Качество',
+    SPEED: 'Скорость',
+    TRUST: 'Доверие к бренду',
+    SERVICE: 'Сервис и сопровождение'
+};
+
+export const DiscoveryMethodLabels = {
+    SEARCH_WEB: 'Ищут в поиске и сравнивают',
+    RECOMMENDATIONS: 'Приходят по рекомендациям / сарафанке',
+    PRICE_SELECTION: 'Выбирают по цене / акциям',
+    REVIEWS: 'Ориентируются на отзывы и рейтинги',
+    CONVENIENCE: 'Выбирают по удобству (сайт, UX, доставка)'
+};
+
+export const PriceFeedbackLabels = {
+    LOWER_THAN_EXPECTED: 'Часто говорят, что «дёшево / ниже ожиданий»',
+    AS_EXPECTED: 'Цена воспринимается как ожидаемая',
+    HIGHER_THAN_EXPECTED: 'Считают, что «дорого / выше ожиданий»',
+    NOT_DISCUSSED: 'Цену обычно подробно не обсуждают'
+};
+
+export const SmmStatusLabels = {
+    NONE: 'Соцсетей нет',
+    DORMANT: 'Есть, но почти не ведём',
+    IRREGULAR: 'Ведём нерегулярно',
+    ACTIVE: 'Активно ведём и развиваем'
+};
+
+export const LeadVolumeLabels = {
+    NONE: 'Заявок практически нет',
+    SOMETIMES: 'Иногда приходят заявки',
+    REGULARLY: 'Заявки приходят регулярно'
+};
+
+export const ResponseHandlerLabels = {
+    MYSELF: 'Отвечает лично основатель / владелец',
+    EMPLOYEE: 'Есть выделенный сотрудник',
+    DELAYED: 'Отвечаем не сразу, с задержками'
+};
+
+export const BusinessConstraintLabels = {
+    NONE: 'Серьезных ограничений нет',
+    SEASONALITY: 'Ярко выраженная сезонность',
+    SMALL_TEAM: 'Маленькая команда',
+    LIMITED_BUDGET: 'Ограниченный маркетинговый бюджет',
+    LONG_DEAL_CYCLE: 'Длинный цикл сделки'
+};
+
+// Значения enum'ов
+export const BusinessStages = Object.keys(BusinessStageLabels);
+export const ClientTargets = Object.keys(ClientTargetLabels);
+export const OfferTypes = Object.keys(OfferTypeLabels);
+export const AverageChecks = Object.keys(AverageCheckLabels);
+export const CustomerBehaviors = Object.keys(CustomerBehaviorLabels);
+export const GeoScopes = Object.keys(GeoScopeLabels);
+export const PurchaseFrequencies = Object.keys(PurchaseFrequencyLabels);
+export const VisualFactors = Object.keys(VisualFactorLabels);
+export const DecisionPriorities = Object.keys(DecisionPriorityLabels);
+export const DiscoveryMethods = Object.keys(DiscoveryMethodLabels);
+export const PriceFeedbacks = Object.keys(PriceFeedbackLabels);
+export const SmmStatuses = Object.keys(SmmStatusLabels);
+export const LeadVolumes = Object.keys(LeadVolumeLabels);
+export const ResponseHandlers = Object.keys(ResponseHandlerLabels);
+export const BusinessConstraints = Object.keys(BusinessConstraintLabels);
diff --git a/src/views/DashboardNew.vue b/src/views/DashboardNew.vue
index c45fc99..caf2b23 100644
--- a/src/views/DashboardNew.vue
+++ b/src/views/DashboardNew.vue
@@ -1,3 +1,9 @@
+<script>
+export default {
+    name: 'DashboardNew'
+};
+</script>
+
 <template>
     <div class="card">
         <h1 class="text-2xl font-semibold">New Dashboard</h1>
@@ -5,10 +11,4 @@
     </div>
 </template>
 
-<script>
-export default {
-    name: 'DashboardNew'
-};
-</script>
-
 <style scoped></style>
diff --git a/src/views/news/NewsAdmin.vue b/src/views/news/NewsAdmin.vue
index 16364e9..af662d1 100644
--- a/src/views/news/NewsAdmin.vue
+++ b/src/views/news/NewsAdmin.vue
@@ -1,220 +1,3 @@
-<template>
-    <div class="card">
-        <Toast />
-        <div class="flex justify-content-between align-items-center mb-4">
-            <h1 class="text-2xl font-semibold m-0">Управление парсером</h1>
-            <Button icon="pi pi-refresh" label="Обновить статус" @click="loadStatus" :loading="loading" severity="secondary" />
-        </div>
-
-        <!-- Статус системы -->
-        <div class="grid mb-4">
-            <div class="col-12 md:col-6">
-                <Card>
-                    <template #title>
-                        <div class="flex align-items-center">
-                            <i class="pi pi-cog mr-2"></i>
-                            Статус сервиса
-                        </div>
-                    </template>
-                    <template #content>
-                        <div v-if="healthLoading" class="text-center py-3">
-                            <ProgressSpinner size="30" />
-                        </div>
-                        <div v-else-if="health" class="space-y-3">
-                            <div class="flex justify-content-between align-items-center">
-                                <span class="font-medium">Статус:</span>
-                                <Tag :value="health.status" :severity="health.status === 'UP' ? 'success' : 'danger'" />
-                            </div>
-                            <div class="flex justify-content-between align-items-center">
-                                <span class="font-medium">Сервис:</span>
-                                <span>{{ health.service }}</span>
-                            </div>
-                            <div class="flex justify-content-between align-items-center">
-                                <span class="font-medium">Планировщик:</span>
-                                <span>{{ health.scheduler }}</span>
-                            </div>
-                            <div class="flex justify-content-between align-items-center">
-                                <span class="font-medium">Время:</span>
-                                <span>{{ formatDate(health.timestamp) }}</span>
-                            </div>
-                        </div>
-                        <div v-else class="text-center py-3 text-color-secondary">
-                            <i class="pi pi-exclamation-triangle text-2xl mb-2"></i>
-                            <p>Не удалось загрузить статус сервиса</p>
-                        </div>
-                    </template>
-                </Card>
-            </div>
-            <div class="col-12 md:col-6">
-                <Card>
-                    <template #title>
-                        <div class="flex align-items-center">
-                            <i class="pi pi-database mr-2"></i>
-                            Статус базы данных
-                        </div>
-                    </template>
-                    <template #content>
-                        <div v-if="mongoHealthLoading" class="text-center py-3">
-                            <ProgressSpinner size="30" />
-                        </div>
-                        <div v-else-if="mongoHealth" class="space-y-3">
-                            <div class="flex justify-content-between align-items-center">
-                                <span class="font-medium">Статус:</span>
-                                <Tag :value="mongoHealth.status" :severity="mongoHealth.status === 'UP' ? 'success' : 'danger'" />
-                            </div>
-                            <div class="flex justify-content-between align-items-center">
-                                <span class="font-medium">Сообщение:</span>
-                                <span class="text-sm">{{ mongoHealth.message }}</span>
-                            </div>
-                            <div class="flex justify-content-between align-items-center">
-                                <span class="font-medium">Время:</span>
-                                <span>{{ formatDate(mongoHealth.timestamp) }}</span>
-                            </div>
-                            <div v-if="mongoHealth.suggestion" class="mt-3 p-2 bg-orange-50 border-orange-200 rounded">
-                                <div class="text-sm text-orange-800">
-                                    <i class="pi pi-info-circle mr-1"></i>
-                                    {{ mongoHealth.suggestion }}
-                                </div>
-                            </div>
-                        </div>
-                        <div v-else class="text-center py-3 text-color-secondary">
-                            <i class="pi pi-exclamation-triangle text-2xl mb-2"></i>
-                            <p>Не удалось загрузить статус базы данных</p>
-                        </div>
-                    </template>
-                </Card>
-            </div>
-        </div>
-
-        <!-- Управление парсингом -->
-        <Card class="mb-4">
-            <template #title>
-                <div class="flex align-items-center">
-                    <i class="pi pi-play mr-2"></i>
-                    Запуск парсинга
-                </div>
-            </template>
-            <template #content>
-                <div class="grid">
-                    <!-- Кнопка для всех источников -->
-                    <div class="col-12 md:col-4">
-                        <div class="text-center p-4 border-round bg-blue-50">
-                            <i class="pi pi-globe text-blue-500 text-4xl mb-3"></i>
-                            <h3 class="text-lg font-semibold mb-2">Все источники</h3>
-                            <p class="text-sm text-color-secondary mb-3">Запустить парсинг всех доступных источников</p>
-                            <Button label="Запустить все" icon="pi pi-play" @click="parseAll" :loading="parsingAll" severity="info" class="w-full" />
-                        </div>
-                    </div>
-
-                    <!-- Динамические кнопки для каждого источника -->
-                    <div v-if="sourcesLoading" class="col-12">
-                        <div class="text-center py-4">
-                            <ProgressSpinner size="30" />
-                            <p class="mt-2 text-color-secondary">Загрузка источников...</p>
-                        </div>
-                    </div>
-                    <div v-else-if="sources.length === 0" class="col-12">
-                        <div class="text-center py-4">
-                            <i class="pi pi-exclamation-triangle text-orange-500 text-4xl mb-3"></i>
-                            <p class="text-color-secondary">Источники не найдены</p>
-                        </div>
-                    </div>
-                    <div v-else v-for="(source, index) in sources" :key="source" class="col-12 md:col-4">
-                        <div class="text-center p-4 border-round" :class="getSourceCardClass(index)">
-                            <i :class="getSourceIcon(index)" class="text-4xl mb-3"></i>
-                            <h3 class="text-lg font-semibold mb-2">{{ source }}</h3>
-                            <p class="text-sm text-color-secondary mb-3">Запустить парсинг только {{ source }}</p>
-                            <Button :label="`Запустить ${source}`" icon="pi pi-play" @click="parseSource(getSourceKey(source))" :loading="parsingSources[getSourceKey(source)]" :severity="getSourceSeverity(index)" class="w-full" />
-                        </div>
-                    </div>
-                </div>
-            </template>
-        </Card>
-
-        <!-- Результаты последнего парсинга -->
-        <Card v-if="lastParseResult" class="mb-4">
-            <template #title>
-                <div class="flex align-items-center">
-                    <i class="pi pi-check-circle mr-2"></i>
-                    Результаты последнего парсинга
-                </div>
-            </template>
-            <template #content>
-                <div class="grid">
-                    <div v-for="result in lastParseResult" :key="result.source" class="col-12 md:col-6">
-                        <div class="p-3 border-round" :class="getResultCardClass(result.status)">
-                            <div class="flex justify-content-between align-items-center mb-2">
-                                <h4 class="text-lg font-semibold m-0">{{ result.source }}</h4>
-                                <Tag :value="result.status" :severity="getStatusSeverity(result.status)" />
-                            </div>
-                            <div class="space-y-2">
-                                <div class="flex justify-content-between">
-                                    <span class="text-sm text-color-secondary">Обработано:</span>
-                                    <span class="font-semibold">{{ result.processedItems }}</span>
-                                </div>
-                                <div class="flex justify-content-between">
-                                    <span class="text-sm text-color-secondary">Всего в БД:</span>
-                                    <span class="font-semibold">{{ result.totalItemsInDb }}</span>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </template>
-        </Card>
-
-        <!-- Статистика -->
-        <Card class="mb-4">
-            <template #title>
-                <div class="flex align-items-center">
-                    <i class="pi pi-chart-bar mr-2"></i>
-                    Текущая статистика
-                </div>
-            </template>
-            <template #content>
-                <div v-if="statsLoading" class="text-center py-3">
-                    <ProgressSpinner size="30" />
-                </div>
-                <div v-else-if="stats" class="grid">
-                    <div class="col-12 md:col-3">
-                        <div class="text-center p-3 border-round bg-blue-50">
-                            <div class="text-2xl font-bold text-blue-900">{{ stats.totalItems || 0 }}</div>
-                            <div class="text-sm text-blue-600">Всего новостей</div>
-                        </div>
-                    </div>
-                    <div class="col-12 md:col-3">
-                        <div class="text-center p-3 border-round bg-green-50">
-                            <div class="text-2xl font-bold text-green-900">{{ sourceCount }}</div>
-                            <div class="text-sm text-green-600">Источников</div>
-                        </div>
-                    </div>
-                    <div class="col-12 md:col-3">
-                        <div class="text-center p-3 border-round bg-orange-50">
-                            <div class="text-2xl font-bold text-orange-900">{{ averagePerSource }}</div>
-                            <div class="text-sm text-orange-600">Среднее на источник</div>
-                        </div>
-                    </div>
-                    <div class="col-12 md:col-3">
-                        <div class="text-center p-3 border-round bg-purple-50">
-                            <div class="text-2xl font-bold text-purple-900">{{ formatDate(stats.lastUpdate) }}</div>
-                            <div class="text-sm text-purple-600">Последнее обновление</div>
-                        </div>
-                    </div>
-                </div>
-                <div v-else class="text-center py-3 text-color-secondary">
-                    <p>Не удалось загрузить статистику</p>
-                </div>
-            </template>
-        </Card>
-
-        <!-- Действия -->
-        <div class="flex justify-content-center gap-2">
-            <Button label="Перейти к новостям" icon="pi pi-arrow-right" @click="goToNews" severity="info" />
-            <Button label="Статистика" icon="pi pi-chart-bar" @click="goToDashboard" severity="secondary" />
-        </div>
-    </div>
-</template>
-
 <script setup>
 import NewsService from '@/service/NewsService';
 import Button from 'primevue/button';
@@ -487,6 +270,223 @@ onMounted(() => {
 });
 </script>
 
+<template>
+    <div class="card">
+        <Toast />
+        <div class="flex justify-content-between align-items-center mb-4">
+            <h1 class="text-2xl font-semibold m-0">Управление парсером</h1>
+            <Button icon="pi pi-refresh" label="Обновить статус" @click="loadStatus" :loading="loading" severity="secondary" />
+        </div>
+
+        <!-- Статус системы -->
+        <div class="grid mb-4">
+            <div class="col-12 md:col-6">
+                <Card>
+                    <template #title>
+                        <div class="flex align-items-center">
+                            <i class="pi pi-cog mr-2"></i>
+                            Статус сервиса
+                        </div>
+                    </template>
+                    <template #content>
+                        <div v-if="healthLoading" class="text-center py-3">
+                            <ProgressSpinner size="30" />
+                        </div>
+                        <div v-else-if="health" class="space-y-3">
+                            <div class="flex justify-content-between align-items-center">
+                                <span class="font-medium">Статус:</span>
+                                <Tag :value="health.status" :severity="health.status === 'UP' ? 'success' : 'danger'" />
+                            </div>
+                            <div class="flex justify-content-between align-items-center">
+                                <span class="font-medium">Сервис:</span>
+                                <span>{{ health.service }}</span>
+                            </div>
+                            <div class="flex justify-content-between align-items-center">
+                                <span class="font-medium">Планировщик:</span>
+                                <span>{{ health.scheduler }}</span>
+                            </div>
+                            <div class="flex justify-content-between align-items-center">
+                                <span class="font-medium">Время:</span>
+                                <span>{{ formatDate(health.timestamp) }}</span>
+                            </div>
+                        </div>
+                        <div v-else class="text-center py-3 text-color-secondary">
+                            <i class="pi pi-exclamation-triangle text-2xl mb-2"></i>
+                            <p>Не удалось загрузить статус сервиса</p>
+                        </div>
+                    </template>
+                </Card>
+            </div>
+            <div class="col-12 md:col-6">
+                <Card>
+                    <template #title>
+                        <div class="flex align-items-center">
+                            <i class="pi pi-database mr-2"></i>
+                            Статус базы данных
+                        </div>
+                    </template>
+                    <template #content>
+                        <div v-if="mongoHealthLoading" class="text-center py-3">
+                            <ProgressSpinner size="30" />
+                        </div>
+                        <div v-else-if="mongoHealth" class="space-y-3">
+                            <div class="flex justify-content-between align-items-center">
+                                <span class="font-medium">Статус:</span>
+                                <Tag :value="mongoHealth.status" :severity="mongoHealth.status === 'UP' ? 'success' : 'danger'" />
+                            </div>
+                            <div class="flex justify-content-between align-items-center">
+                                <span class="font-medium">Сообщение:</span>
+                                <span class="text-sm">{{ mongoHealth.message }}</span>
+                            </div>
+                            <div class="flex justify-content-between align-items-center">
+                                <span class="font-medium">Время:</span>
+                                <span>{{ formatDate(mongoHealth.timestamp) }}</span>
+                            </div>
+                            <div v-if="mongoHealth.suggestion" class="mt-3 p-2 bg-orange-50 border-orange-200 rounded">
+                                <div class="text-sm text-orange-800">
+                                    <i class="pi pi-info-circle mr-1"></i>
+                                    {{ mongoHealth.suggestion }}
+                                </div>
+                            </div>
+                        </div>
+                        <div v-else class="text-center py-3 text-color-secondary">
+                            <i class="pi pi-exclamation-triangle text-2xl mb-2"></i>
+                            <p>Не удалось загрузить статус базы данных</p>
+                        </div>
+                    </template>
+                </Card>
+            </div>
+        </div>
+
+        <!-- Управление парсингом -->
+        <Card class="mb-4">
+            <template #title>
+                <div class="flex align-items-center">
+                    <i class="pi pi-play mr-2"></i>
+                    Запуск парсинга
+                </div>
+            </template>
+            <template #content>
+                <div class="grid">
+                    <!-- Кнопка для всех источников -->
+                    <div class="col-12 md:col-4">
+                        <div class="text-center p-4 border-round bg-blue-50">
+                            <i class="pi pi-globe text-blue-500 text-4xl mb-3"></i>
+                            <h3 class="text-lg font-semibold mb-2">Все источники</h3>
+                            <p class="text-sm text-color-secondary mb-3">Запустить парсинг всех доступных источников</p>
+                            <Button label="Запустить все" icon="pi pi-play" @click="parseAll" :loading="parsingAll" severity="info" class="w-full" />
+                        </div>
+                    </div>
+
+                    <!-- Динамические кнопки для каждого источника -->
+                    <div v-if="sourcesLoading" class="col-12">
+                        <div class="text-center py-4">
+                            <ProgressSpinner size="30" />
+                            <p class="mt-2 text-color-secondary">Загрузка источников...</p>
+                        </div>
+                    </div>
+                    <div v-else-if="sources.length === 0" class="col-12">
+                        <div class="text-center py-4">
+                            <i class="pi pi-exclamation-triangle text-orange-500 text-4xl mb-3"></i>
+                            <p class="text-color-secondary">Источники не найдены</p>
+                        </div>
+                    </div>
+                    <div v-else v-for="(source, index) in sources" :key="source" class="col-12 md:col-4">
+                        <div class="text-center p-4 border-round" :class="getSourceCardClass(index)">
+                            <i :class="getSourceIcon(index)" class="text-4xl mb-3"></i>
+                            <h3 class="text-lg font-semibold mb-2">{{ source }}</h3>
+                            <p class="text-sm text-color-secondary mb-3">Запустить парсинг только {{ source }}</p>
+                            <Button :label="`Запустить ${source}`" icon="pi pi-play" @click="parseSource(getSourceKey(source))" :loading="parsingSources[getSourceKey(source)]" :severity="getSourceSeverity(index)" class="w-full" />
+                        </div>
+                    </div>
+                </div>
+            </template>
+        </Card>
+
+        <!-- Результаты последнего парсинга -->
+        <Card v-if="lastParseResult" class="mb-4">
+            <template #title>
+                <div class="flex align-items-center">
+                    <i class="pi pi-check-circle mr-2"></i>
+                    Результаты последнего парсинга
+                </div>
+            </template>
+            <template #content>
+                <div class="grid">
+                    <div v-for="result in lastParseResult" :key="result.source" class="col-12 md:col-6">
+                        <div class="p-3 border-round" :class="getResultCardClass(result.status)">
+                            <div class="flex justify-content-between align-items-center mb-2">
+                                <h4 class="text-lg font-semibold m-0">{{ result.source }}</h4>
+                                <Tag :value="result.status" :severity="getStatusSeverity(result.status)" />
+                            </div>
+                            <div class="space-y-2">
+                                <div class="flex justify-content-between">
+                                    <span class="text-sm text-color-secondary">Обработано:</span>
+                                    <span class="font-semibold">{{ result.processedItems }}</span>
+                                </div>
+                                <div class="flex justify-content-between">
+                                    <span class="text-sm text-color-secondary">Всего в БД:</span>
+                                    <span class="font-semibold">{{ result.totalItemsInDb }}</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </template>
+        </Card>
+
+        <!-- Статистика -->
+        <Card class="mb-4">
+            <template #title>
+                <div class="flex align-items-center">
+                    <i class="pi pi-chart-bar mr-2"></i>
+                    Текущая статистика
+                </div>
+            </template>
+            <template #content>
+                <div v-if="statsLoading" class="text-center py-3">
+                    <ProgressSpinner size="30" />
+                </div>
+                <div v-else-if="stats" class="grid">
+                    <div class="col-12 md:col-3">
+                        <div class="text-center p-3 border-round bg-blue-50">
+                            <div class="text-2xl font-bold text-blue-900">{{ stats.totalItems || 0 }}</div>
+                            <div class="text-sm text-blue-600">Всего новостей</div>
+                        </div>
+                    </div>
+                    <div class="col-12 md:col-3">
+                        <div class="text-center p-3 border-round bg-green-50">
+                            <div class="text-2xl font-bold text-green-900">{{ sourceCount }}</div>
+                            <div class="text-sm text-green-600">Источников</div>
+                        </div>
+                    </div>
+                    <div class="col-12 md:col-3">
+                        <div class="text-center p-3 border-round bg-orange-50">
+                            <div class="text-2xl font-bold text-orange-900">{{ averagePerSource }}</div>
+                            <div class="text-sm text-orange-600">Среднее на источник</div>
+                        </div>
+                    </div>
+                    <div class="col-12 md:col-3">
+                        <div class="text-center p-3 border-round bg-purple-50">
+                            <div class="text-2xl font-bold text-purple-900">{{ formatDate(stats.lastUpdate) }}</div>
+                            <div class="text-sm text-purple-600">Последнее обновление</div>
+                        </div>
+                    </div>
+                </div>
+                <div v-else class="text-center py-3 text-color-secondary">
+                    <p>Не удалось загрузить статистику</p>
+                </div>
+            </template>
+        </Card>
+
+        <!-- Действия -->
+        <div class="flex justify-content-center gap-2">
+            <Button label="Перейти к новостям" icon="pi pi-arrow-right" @click="goToNews" severity="info" />
+            <Button label="Статистика" icon="pi pi-chart-bar" @click="goToDashboard" severity="secondary" />
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .space-y-2 > * + * {
     margin-top: 0.5rem;
diff --git a/src/views/news/NewsDashboard.vue b/src/views/news/NewsDashboard.vue
index 90a3158..9a0da27 100644
--- a/src/views/news/NewsDashboard.vue
+++ b/src/views/news/NewsDashboard.vue
@@ -1,3 +1,160 @@
+<script setup>
+import NewsService from '@/service/NewsService';
+import Button from 'primevue/button';
+import Card from 'primevue/card';
+import Chart from 'primevue/chart';
+import ProgressSpinner from 'primevue/progressspinner';
+import Tag from 'primevue/tag';
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+
+// Реактивные данные
+const stats = ref({});
+const health = ref(null);
+const mongoHealth = ref(null);
+const loading = ref(false);
+const healthLoading = ref(false);
+const mongoHealthLoading = ref(false);
+
+// Цвета для источников
+const sourceColors = ['#3B82F6', '#10B981', '#F59E0B', '#EF4444', '#8B5CF6', '#06B6D4', '#84CC16', '#F97316', '#EC4899', '#6366F1'];
+
+// Вычисляемые свойства
+const sourceCount = computed(() => {
+    return stats.value.sourceStatistics ? Object.keys(stats.value.sourceStatistics).length : 0;
+});
+
+const averagePerSource = computed(() => {
+    if (!stats.value.sourceStatistics || sourceCount.value === 0) return 0;
+    const total = Object.values(stats.value.sourceStatistics).reduce((sum, count) => sum + count, 0);
+    return Math.round(total / sourceCount.value);
+});
+
+const chartData = computed(() => {
+    if (!stats.value.sourceStatistics) return { labels: [], datasets: [] };
+
+    const sources = Object.keys(stats.value.sourceStatistics);
+    const counts = Object.values(stats.value.sourceStatistics);
+
+    return {
+        labels: sources,
+        datasets: [
+            {
+                data: counts,
+                backgroundColor: sources.map((_, index) => getSourceColor(index)),
+                borderWidth: 2,
+                borderColor: '#ffffff'
+            }
+        ]
+    };
+});
+
+const chartOptions = {
+    responsive: true,
+    maintainAspectRatio: false,
+    plugins: {
+        legend: {
+            position: 'bottom',
+            labels: {
+                padding: 20,
+                usePointStyle: true
+            }
+        },
+        tooltip: {
+            callbacks: {
+                label: function (context) {
+                    const label = context.label || '';
+                    const value = context.parsed;
+                    const total = context.dataset.data.reduce((a, b) => a + b, 0);
+                    const percentage = ((value / total) * 100).toFixed(1);
+                    return `${label}: ${value} новостей (${percentage}%)`;
+                }
+            }
+        }
+    }
+};
+
+// Методы
+const loadData = async () => {
+    loading.value = true;
+    try {
+        await Promise.all([loadStats(), loadHealth(), loadMongoHealth()]);
+    } finally {
+        loading.value = false;
+    }
+};
+
+const loadStats = async () => {
+    try {
+        const response = await NewsService.getStats();
+        if (response.success) {
+            stats.value = response.data;
+        }
+    } catch (error) {
+        console.error('Ошибка при загрузке статистики:', error);
+    }
+};
+
+const loadHealth = async () => {
+    healthLoading.value = true;
+    try {
+        const response = await NewsService.getHealth();
+        if (response.success) {
+            health.value = response.data;
+        }
+    } catch (error) {
+        console.error('Ошибка при загрузке статуса сервиса:', error);
+    } finally {
+        healthLoading.value = false;
+    }
+};
+
+const loadMongoHealth = async () => {
+    mongoHealthLoading.value = true;
+    try {
+        const response = await NewsService.getMongoHealth();
+        if (response.success) {
+            mongoHealth.value = response.data;
+        }
+    } catch (error) {
+        console.error('Ошибка при загрузке статуса MongoDB:', error);
+    } finally {
+        mongoHealthLoading.value = false;
+    }
+};
+
+const getSourceColor = (source) => {
+    if (typeof source === 'number') {
+        return sourceColors[source % sourceColors.length];
+    }
+
+    const sources = Object.keys(stats.value.sourceStatistics || {});
+    const index = sources.indexOf(source);
+    return sourceColors[index % sourceColors.length];
+};
+
+const getPercentage = (count) => {
+    if (!stats.value.totalItems || stats.value.totalItems === 0) return 0;
+    return ((count / stats.value.totalItems) * 100).toFixed(1);
+};
+
+const formatDate = (timestamp) => {
+    if (!timestamp) return 'Неизвестно';
+    return NewsService.formatDate(new Date(timestamp).toISOString());
+};
+
+const goToNews = () => {
+    router.push('/news');
+};
+
+// Жизненный цикл
+onMounted(() => {
+    loadData();
+});
+</script>
+
 <template>
     <div class="card">
         <div class="flex justify-content-between align-items-center mb-4">
@@ -202,163 +359,6 @@
     </div>
 </template>
 
-<script setup>
-import NewsService from '@/service/NewsService';
-import Button from 'primevue/button';
-import Card from 'primevue/card';
-import Chart from 'primevue/chart';
-import ProgressSpinner from 'primevue/progressspinner';
-import Tag from 'primevue/tag';
-import { computed, onMounted, ref } from 'vue';
-import { useRouter } from 'vue-router';
-
-const router = useRouter();
-
-// Реактивные данные
-const stats = ref({});
-const health = ref(null);
-const mongoHealth = ref(null);
-const loading = ref(false);
-const healthLoading = ref(false);
-const mongoHealthLoading = ref(false);
-
-// Цвета для источников
-const sourceColors = ['#3B82F6', '#10B981', '#F59E0B', '#EF4444', '#8B5CF6', '#06B6D4', '#84CC16', '#F97316', '#EC4899', '#6366F1'];
-
-// Вычисляемые свойства
-const sourceCount = computed(() => {
-    return stats.value.sourceStatistics ? Object.keys(stats.value.sourceStatistics).length : 0;
-});
-
-const averagePerSource = computed(() => {
-    if (!stats.value.sourceStatistics || sourceCount.value === 0) return 0;
-    const total = Object.values(stats.value.sourceStatistics).reduce((sum, count) => sum + count, 0);
-    return Math.round(total / sourceCount.value);
-});
-
-const chartData = computed(() => {
-    if (!stats.value.sourceStatistics) return { labels: [], datasets: [] };
-
-    const sources = Object.keys(stats.value.sourceStatistics);
-    const counts = Object.values(stats.value.sourceStatistics);
-
-    return {
-        labels: sources,
-        datasets: [
-            {
-                data: counts,
-                backgroundColor: sources.map((_, index) => getSourceColor(index)),
-                borderWidth: 2,
-                borderColor: '#ffffff'
-            }
-        ]
-    };
-});
-
-const chartOptions = {
-    responsive: true,
-    maintainAspectRatio: false,
-    plugins: {
-        legend: {
-            position: 'bottom',
-            labels: {
-                padding: 20,
-                usePointStyle: true
-            }
-        },
-        tooltip: {
-            callbacks: {
-                label: function (context) {
-                    const label = context.label || '';
-                    const value = context.parsed;
-                    const total = context.dataset.data.reduce((a, b) => a + b, 0);
-                    const percentage = ((value / total) * 100).toFixed(1);
-                    return `${label}: ${value} новостей (${percentage}%)`;
-                }
-            }
-        }
-    }
-};
-
-// Методы
-const loadData = async () => {
-    loading.value = true;
-    try {
-        await Promise.all([loadStats(), loadHealth(), loadMongoHealth()]);
-    } finally {
-        loading.value = false;
-    }
-};
-
-const loadStats = async () => {
-    try {
-        const response = await NewsService.getStats();
-        if (response.success) {
-            stats.value = response.data;
-        }
-    } catch (error) {
-        console.error('Ошибка при загрузке статистики:', error);
-    }
-};
-
-const loadHealth = async () => {
-    healthLoading.value = true;
-    try {
-        const response = await NewsService.getHealth();
-        if (response.success) {
-            health.value = response.data;
-        }
-    } catch (error) {
-        console.error('Ошибка при загрузке статуса сервиса:', error);
-    } finally {
-        healthLoading.value = false;
-    }
-};
-
-const loadMongoHealth = async () => {
-    mongoHealthLoading.value = true;
-    try {
-        const response = await NewsService.getMongoHealth();
-        if (response.success) {
-            mongoHealth.value = response.data;
-        }
-    } catch (error) {
-        console.error('Ошибка при загрузке статуса MongoDB:', error);
-    } finally {
-        mongoHealthLoading.value = false;
-    }
-};
-
-const getSourceColor = (source) => {
-    if (typeof source === 'number') {
-        return sourceColors[source % sourceColors.length];
-    }
-
-    const sources = Object.keys(stats.value.sourceStatistics || {});
-    const index = sources.indexOf(source);
-    return sourceColors[index % sourceColors.length];
-};
-
-const getPercentage = (count) => {
-    if (!stats.value.totalItems || stats.value.totalItems === 0) return 0;
-    return ((count / stats.value.totalItems) * 100).toFixed(1);
-};
-
-const formatDate = (timestamp) => {
-    if (!timestamp) return 'Неизвестно';
-    return NewsService.formatDate(new Date(timestamp).toISOString());
-};
-
-const goToNews = () => {
-    router.push('/news');
-};
-
-// Жизненный цикл
-onMounted(() => {
-    loadData();
-});
-</script>
-
 <style scoped>
 .space-y-3 > * + * {
     margin-top: 0.75rem;
diff --git a/src/views/news/NewsDetail.vue b/src/views/news/NewsDetail.vue
index 1d99063..f103589 100644
--- a/src/views/news/NewsDetail.vue
+++ b/src/views/news/NewsDetail.vue
@@ -1,3 +1,143 @@
+<script setup>
+import NewsService from '@/service/NewsService';
+import Button from 'primevue/button';
+import Card from 'primevue/card';
+import ProgressSpinner from 'primevue/progressspinner';
+import Tag from 'primevue/tag';
+import { computed, onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+const route = useRoute();
+const router = useRouter();
+
+// Реактивные данные
+const news = ref(null);
+const loading = ref(false);
+const error = ref(null);
+
+// Вычисляемые свойства
+const hasAnalytics = computed(() => {
+    return (
+        news.value?.analytics &&
+        (news.value.analytics.summary || news.value.analytics.sentiment || (news.value.analytics.tags && news.value.analytics.tags.length > 0) || (news.value.analytics.entities && Object.keys(news.value.analytics.entities).length > 0))
+    );
+});
+
+// Методы
+const loadNews = async () => {
+    const newsId = route.params.id;
+    if (!newsId) {
+        error.value = 'ID новости не указан';
+        return;
+    }
+
+    loading.value = true;
+    error.value = null;
+
+    try {
+        // Поскольку у нас нет отдельного API для получения одной новости,
+        // мы будем использовать общий API с фильтром по ID
+        // В реальном приложении здесь должен быть отдельный эндпоинт
+        const response = await NewsService.getNewsItems({
+            page: 0,
+            size: 1
+            // Здесь можно добавить фильтр по ID, если API это поддерживает
+        });
+
+        if (response.success && response.data.content.length > 0) {
+            // Найдем новость по ID (временное решение)
+            const foundNews = response.data.content.find((item) => item.id === newsId);
+            if (foundNews) {
+                news.value = foundNews;
+            } else {
+                error.value = 'Новость не найдена';
+            }
+        } else {
+            error.value = 'Не удалось загрузить новость';
+        }
+    } catch (err) {
+        console.error('Ошибка при загрузке новости:', err);
+        error.value = 'Ошибка при загрузке новости';
+    } finally {
+        loading.value = false;
+    }
+};
+
+const goBack = () => {
+    router.push('/news');
+};
+
+const openOriginalUrl = () => {
+    if (news.value?.url) {
+        window.open(news.value.url, '_blank');
+    }
+};
+
+const shareNews = async () => {
+    if (navigator.share && news.value) {
+        try {
+            await navigator.share({
+                title: news.value.title,
+                text: news.value.rawText?.substring(0, 200) + '...',
+                url: news.value.url
+            });
+        } catch (err) {
+            console.log('Поделиться отменено или не поддерживается');
+        }
+    } else {
+        // Fallback - копирование URL в буфер обмена
+        if (news.value?.url) {
+            try {
+                await navigator.clipboard.writeText(news.value.url);
+                // Здесь можно показать уведомление об успешном копировании
+                console.log('URL скопирован в буфер обмена');
+            } catch (err) {
+                console.error('Ошибка при копировании URL:', err);
+            }
+        }
+    }
+};
+
+const getSentimentSeverity = (sentiment) => {
+    switch (sentiment?.toLowerCase()) {
+        case 'positive':
+        case 'позитивный':
+            return 'success';
+        case 'negative':
+        case 'негативный':
+            return 'danger';
+        case 'neutral':
+        case 'нейтральный':
+            return 'info';
+        default:
+            return 'secondary';
+    }
+};
+
+const formatDate = (dateString) => {
+    return NewsService.formatDate(dateString);
+};
+
+const formatDateShort = (dateString) => {
+    return NewsService.formatDateShort(dateString);
+};
+
+const truncateUrl = (url) => {
+    if (!url) return '';
+    return url.length > 50 ? url.substring(0, 50) + '...' : url;
+};
+
+const truncateHash = (hash) => {
+    if (!hash) return '';
+    return hash.length > 20 ? hash.substring(0, 20) + '...' : hash;
+};
+
+// Жизненный цикл
+onMounted(() => {
+    loadNews();
+});
+</script>
+
 <template>
     <div class="card">
         <!-- Загрузка -->
@@ -168,146 +308,6 @@
     </div>
 </template>
 
-<script setup>
-import NewsService from '@/service/NewsService';
-import Button from 'primevue/button';
-import Card from 'primevue/card';
-import ProgressSpinner from 'primevue/progressspinner';
-import Tag from 'primevue/tag';
-import { computed, onMounted, ref } from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-
-const route = useRoute();
-const router = useRouter();
-
-// Реактивные данные
-const news = ref(null);
-const loading = ref(false);
-const error = ref(null);
-
-// Вычисляемые свойства
-const hasAnalytics = computed(() => {
-    return (
-        news.value?.analytics &&
-        (news.value.analytics.summary || news.value.analytics.sentiment || (news.value.analytics.tags && news.value.analytics.tags.length > 0) || (news.value.analytics.entities && Object.keys(news.value.analytics.entities).length > 0))
-    );
-});
-
-// Методы
-const loadNews = async () => {
-    const newsId = route.params.id;
-    if (!newsId) {
-        error.value = 'ID новости не указан';
-        return;
-    }
-
-    loading.value = true;
-    error.value = null;
-
-    try {
-        // Поскольку у нас нет отдельного API для получения одной новости,
-        // мы будем использовать общий API с фильтром по ID
-        // В реальном приложении здесь должен быть отдельный эндпоинт
-        const response = await NewsService.getNewsItems({
-            page: 0,
-            size: 1
-            // Здесь можно добавить фильтр по ID, если API это поддерживает
-        });
-
-        if (response.success && response.data.content.length > 0) {
-            // Найдем новость по ID (временное решение)
-            const foundNews = response.data.content.find((item) => item.id === newsId);
-            if (foundNews) {
-                news.value = foundNews;
-            } else {
-                error.value = 'Новость не найдена';
-            }
-        } else {
-            error.value = 'Не удалось загрузить новость';
-        }
-    } catch (err) {
-        console.error('Ошибка при загрузке новости:', err);
-        error.value = 'Ошибка при загрузке новости';
-    } finally {
-        loading.value = false;
-    }
-};
-
-const goBack = () => {
-    router.push('/news');
-};
-
-const openOriginalUrl = () => {
-    if (news.value?.url) {
-        window.open(news.value.url, '_blank');
-    }
-};
-
-const shareNews = async () => {
-    if (navigator.share && news.value) {
-        try {
-            await navigator.share({
-                title: news.value.title,
-                text: news.value.rawText?.substring(0, 200) + '...',
-                url: news.value.url
-            });
-        } catch (err) {
-            console.log('Поделиться отменено или не поддерживается');
-        }
-    } else {
-        // Fallback - копирование URL в буфер обмена
-        if (news.value?.url) {
-            try {
-                await navigator.clipboard.writeText(news.value.url);
-                // Здесь можно показать уведомление об успешном копировании
-                console.log('URL скопирован в буфер обмена');
-            } catch (err) {
-                console.error('Ошибка при копировании URL:', err);
-            }
-        }
-    }
-};
-
-const getSentimentSeverity = (sentiment) => {
-    switch (sentiment?.toLowerCase()) {
-        case 'positive':
-        case 'позитивный':
-            return 'success';
-        case 'negative':
-        case 'негативный':
-            return 'danger';
-        case 'neutral':
-        case 'нейтральный':
-            return 'info';
-        default:
-            return 'secondary';
-    }
-};
-
-const formatDate = (dateString) => {
-    return NewsService.formatDate(dateString);
-};
-
-const formatDateShort = (dateString) => {
-    return NewsService.formatDateShort(dateString);
-};
-
-const truncateUrl = (url) => {
-    if (!url) return '';
-    return url.length > 50 ? url.substring(0, 50) + '...' : url;
-};
-
-const truncateHash = (hash) => {
-    if (!hash) return '';
-    return hash.length > 20 ? hash.substring(0, 20) + '...' : hash;
-};
-
-// Жизненный цикл
-onMounted(() => {
-    loadNews();
-});
-</script>
-
 <style scoped>
 .prose {
     max-width: none;
diff --git a/src/views/news/NewsList.vue b/src/views/news/NewsList.vue
index 37d83dd..1b3c718 100644
--- a/src/views/news/NewsList.vue
+++ b/src/views/news/NewsList.vue
@@ -1,133 +1,3 @@
-<template>
-    <div class="card">
-        <div class="flex justify-content-between align-items-center mb-4">
-            <h1 class="text-2xl font-semibold m-0">Лента новостей</h1>
-            <Button icon="pi pi-refresh" label="Обновить" @click="loadNews" :loading="loading" severity="secondary" />
-        </div>
-
-        <!-- Фильтры -->
-        <NewsFilters v-model:filters="filters" @filter-change="onFilterChange" :sources="sources" :loading="loading" />
-
-        <!-- Статистика -->
-        <div class="grid mb-4">
-            <div class="col-12 md:col-3">
-                <div class="card bg-blue-50 border-blue-200">
-                    <div class="flex align-items-center">
-                        <i class="pi pi-align-left text-blue-500 text-2xl mr-3"></i>
-                        <div>
-                            <div class="text-sm text-blue-600">Всего новостей</div>
-                            <div class="text-xl font-semibold text-blue-900">{{ totalElements || 0 }}</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="col-12 md:col-3">
-                <div class="card bg-green-50 border-green-200">
-                    <div class="flex align-items-center">
-                        <i class="pi pi-calendar text-green-500 text-2xl mr-3"></i>
-                        <div>
-                            <div class="text-sm text-green-600">На странице</div>
-                            <div class="text-xl font-semibold text-green-900">{{ numberOfElements || 0 }}</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="col-12 md:col-3">
-                <div class="card bg-orange-50 border-orange-200">
-                    <div class="flex align-items-center">
-                        <i class="pi pi-clock text-orange-500 text-2xl mr-3"></i>
-                        <div>
-                            <div class="text-sm text-orange-600">Последнее обновление</div>
-                            <div class="text-sm font-semibold text-orange-900">{{ lastUpdateTime }}</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="col-12 md:col-3">
-                <div class="card bg-purple-50 border-purple-200">
-                    <div class="flex align-items-center">
-                        <i class="pi pi-filter text-purple-500 text-2xl mr-3"></i>
-                        <div>
-                            <div class="text-sm text-purple-600">Активные фильтры</div>
-                            <div class="text-xl font-semibold text-purple-900">{{ activeFiltersCount }}</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- Список новостей -->
-        <div v-if="loading && news.length === 0" class="text-center py-6">
-            <ProgressSpinner />
-            <p class="mt-3 text-color-secondary">Загрузка новостей...</p>
-        </div>
-
-        <div v-else-if="news.length === 0" class="text-center py-6">
-            <i class="pi pi-inbox text-6xl text-color-secondary mb-3"></i>
-            <h3 class="text-xl font-semibold mb-2">Новости не найдены</h3>
-            <p class="text-color-secondary">Попробуйте изменить фильтры или обновить страницу</p>
-        </div>
-
-        <div v-else class="grid">
-            <div v-for="item in news" :key="item.id" class="col-12">
-                <Card class="mb-3 hover:shadow-2 transition-all transition-duration-200">
-                    <template #header>
-                        <div class="p-3 pb-0">
-                            <div class="flex justify-content-between align-items-start mb-2">
-                                <Tag :value="item.sourceName" severity="info" class="mr-2" />
-                                <div class="flex align-items-center text-sm text-color-secondary">
-                                    <i class="pi pi-calendar mr-1"></i>
-                                    {{ formatDate(item.publishedAt) }}
-                                </div>
-                            </div>
-                            <h3 class="text-xl font-semibold mb-2 line-height-3">
-                                {{ item.title }}
-                            </h3>
-                        </div>
-                    </template>
-                    <template #content>
-                        <div class="p-3 pt-0">
-                            <p class="text-color-secondary line-height-3 mb-3">
-                                {{ getPreviewText(item.rawText) }}
-                            </p>
-                            <div class="flex justify-content-between align-items-center">
-                                <div class="flex align-items-center">
-                                    <Tag v-if="item.category" :value="item.category" severity="success" class="mr-2" />
-                                    <span class="text-sm text-color-secondary">
-                                        <i class="pi pi-clock mr-1"></i>
-                                        Добавлено: {{ formatDateShort(item.addedAt) }}
-                                    </span>
-                                </div>
-                                <div class="flex gap-2">
-                                    <Button icon="pi pi-external-link" label="Читать" size="small" @click="openNewsDetail(item.id)" severity="secondary" />
-                                    <Button icon="pi pi-external-link" size="small" @click="openOriginalUrl(item.url)" severity="info" v-tooltip.top="'Открыть оригинал'" />
-                                </div>
-                            </div>
-                        </div>
-                    </template>
-                </Card>
-            </div>
-        </div>
-
-        <!-- Пагинация -->
-        <div v-if="totalPages > 1" class="flex justify-content-center mt-4">
-            <Paginator
-                v-model:first="first"
-                :rows="filters.size"
-                :totalRecords="totalElements"
-                :rowsPerPageOptions="[10, 20, 50, 100]"
-                @page="onPageChange"
-                template="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown"
-            />
-        </div>
-
-        <!-- Кнопка "Загрузить еще" для бесконечной прокрутки -->
-        <div v-if="!last && news.length > 0" class="text-center mt-4">
-            <Button label="Загрузить еще" icon="pi pi-plus" @click="loadMore" :loading="loadingMore" severity="secondary" />
-        </div>
-    </div>
-</template>
-
 <script setup>
 import NewsFilters from '@/components/news/NewsFilters.vue';
 import NewsService from '@/service/NewsService';
@@ -297,6 +167,136 @@ watch(
 );
 </script>
 
+<template>
+    <div class="card">
+        <div class="flex justify-content-between align-items-center mb-4">
+            <h1 class="text-2xl font-semibold m-0">Лента новостей</h1>
+            <Button icon="pi pi-refresh" label="Обновить" @click="loadNews" :loading="loading" severity="secondary" />
+        </div>
+
+        <!-- Фильтры -->
+        <NewsFilters v-model:filters="filters" @filter-change="onFilterChange" :sources="sources" :loading="loading" />
+
+        <!-- Статистика -->
+        <div class="grid mb-4">
+            <div class="col-12 md:col-3">
+                <div class="card bg-blue-50 border-blue-200">
+                    <div class="flex align-items-center">
+                        <i class="pi pi-align-left text-blue-500 text-2xl mr-3"></i>
+                        <div>
+                            <div class="text-sm text-blue-600">Всего новостей</div>
+                            <div class="text-xl font-semibold text-blue-900">{{ totalElements || 0 }}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-12 md:col-3">
+                <div class="card bg-green-50 border-green-200">
+                    <div class="flex align-items-center">
+                        <i class="pi pi-calendar text-green-500 text-2xl mr-3"></i>
+                        <div>
+                            <div class="text-sm text-green-600">На странице</div>
+                            <div class="text-xl font-semibold text-green-900">{{ numberOfElements || 0 }}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-12 md:col-3">
+                <div class="card bg-orange-50 border-orange-200">
+                    <div class="flex align-items-center">
+                        <i class="pi pi-clock text-orange-500 text-2xl mr-3"></i>
+                        <div>
+                            <div class="text-sm text-orange-600">Последнее обновление</div>
+                            <div class="text-sm font-semibold text-orange-900">{{ lastUpdateTime }}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-12 md:col-3">
+                <div class="card bg-purple-50 border-purple-200">
+                    <div class="flex align-items-center">
+                        <i class="pi pi-filter text-purple-500 text-2xl mr-3"></i>
+                        <div>
+                            <div class="text-sm text-purple-600">Активные фильтры</div>
+                            <div class="text-xl font-semibold text-purple-900">{{ activeFiltersCount }}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Список новостей -->
+        <div v-if="loading && news.length === 0" class="text-center py-6">
+            <ProgressSpinner />
+            <p class="mt-3 text-color-secondary">Загрузка новостей...</p>
+        </div>
+
+        <div v-else-if="news.length === 0" class="text-center py-6">
+            <i class="pi pi-inbox text-6xl text-color-secondary mb-3"></i>
+            <h3 class="text-xl font-semibold mb-2">Новости не найдены</h3>
+            <p class="text-color-secondary">Попробуйте изменить фильтры или обновить страницу</p>
+        </div>
+
+        <div v-else class="grid">
+            <div v-for="item in news" :key="item.id" class="col-12">
+                <Card class="mb-3 hover:shadow-2 transition-all transition-duration-200">
+                    <template #header>
+                        <div class="p-3 pb-0">
+                            <div class="flex justify-content-between align-items-start mb-2">
+                                <Tag :value="item.sourceName" severity="info" class="mr-2" />
+                                <div class="flex align-items-center text-sm text-color-secondary">
+                                    <i class="pi pi-calendar mr-1"></i>
+                                    {{ formatDate(item.publishedAt) }}
+                                </div>
+                            </div>
+                            <h3 class="text-xl font-semibold mb-2 line-height-3">
+                                {{ item.title }}
+                            </h3>
+                        </div>
+                    </template>
+                    <template #content>
+                        <div class="p-3 pt-0">
+                            <p class="text-color-secondary line-height-3 mb-3">
+                                {{ getPreviewText(item.rawText) }}
+                            </p>
+                            <div class="flex justify-content-between align-items-center">
+                                <div class="flex align-items-center">
+                                    <Tag v-if="item.category" :value="item.category" severity="success" class="mr-2" />
+                                    <span class="text-sm text-color-secondary">
+                                        <i class="pi pi-clock mr-1"></i>
+                                        Добавлено: {{ formatDateShort(item.addedAt) }}
+                                    </span>
+                                </div>
+                                <div class="flex gap-2">
+                                    <Button icon="pi pi-external-link" label="Читать" size="small" @click="openNewsDetail(item.id)" severity="secondary" />
+                                    <Button icon="pi pi-external-link" size="small" @click="openOriginalUrl(item.url)" severity="info" v-tooltip.top="'Открыть оригинал'" />
+                                </div>
+                            </div>
+                        </div>
+                    </template>
+                </Card>
+            </div>
+        </div>
+
+        <!-- Пагинация -->
+        <div v-if="totalPages > 1" class="flex justify-content-center mt-4">
+            <Paginator
+                v-model:first="first"
+                :rows="filters.size"
+                :totalRecords="totalElements"
+                :rowsPerPageOptions="[10, 20, 50, 100]"
+                @page="onPageChange"
+                template="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown"
+            />
+        </div>
+
+        <!-- Кнопка "Загрузить еще" для бесконечной прокрутки -->
+        <div v-if="!last && news.length > 0" class="text-center mt-4">
+            <Button label="Загрузить еще" icon="pi pi-plus" @click="loadMore" :loading="loadingMore" severity="secondary" />
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .hover\:shadow-2:hover {
     box-shadow:
diff --git a/src/views/pages/MarketingAnalysis.vue b/src/views/pages/MarketingAnalysis.vue
index 28b2be2..ebdb205 100644
--- a/src/views/pages/MarketingAnalysis.vue
+++ b/src/views/pages/MarketingAnalysis.vue
@@ -1,1034 +1,5 @@
-<template>
-    <div class="min-h-screen bg-indigo-50/30 p-4 md:p-6">
-        <Toast />
-
-        <div class="mx-auto max-w-[1920px] space-y-7">
-            <!-- Header (hide in embedded) -->
-            <div v-if="!embedded" class="flex flex-col gap-3 md:flex-row md:items-end md:justify-between">
-                <div class="min-w-0">
-                    <div class="flex items-center gap-2 text-[13px] text-slate-500">
-                        <i class="pi pi-chart-line"></i>
-                        <span>Маркетинг</span>
-                        <i class="pi pi-angle-right text-[11px]"></i>
-                        <span class="font-medium text-slate-700">Маркетинговый анализ</span>
-                    </div>
-                    <h1 class="mt-1 text-2xl md:text-3xl font-semibold text-slate-900 truncate">
-                        {{ report?.report_title || 'Маркетинговый анализ' }}
-                    </h1>
-                </div>
-            </div>
-
-            <!-- Generate (API v2) (hide in embedded) -->
-            <div v-if="!embedded" class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-5 relative overflow-hidden">
-                <div
-                    class="absolute inset-0 pointer-events-none opacity-[0.10]"
-                    style="background: radial-gradient(900px 260px at 10% 0%, rgba(91, 137, 255, 0.3), transparent), radial-gradient(900px 260px at 90% 0%, rgba(255, 142, 79, 0.28), transparent)"
-                ></div>
-
-                <div class="relative flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
-                    <div>
-                        <div class="text-[16px] font-semibold text-slate-800">Параметры анализа (API v2)</div>
-                        <div class="text-[12px] text-slate-500 mt-0.5">Заполните поля и нажмите Generate — мок-данные не используются.</div>
-                    </div>
-                    <div class="flex items-center gap-2">
-                        <Button icon="pi pi-sparkles" label="Generate" :loading="loading" :disabled="loading" @click="loadAnalysisV2" />
-                        <Button severity="secondary" outlined icon="pi pi-trash" label="Reset" :disabled="loading" @click="resetDashboard" />
-                    </div>
-                </div>
-
-                <div class="relative mt-4 grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-6">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Ниша бизнеса</label>
-                        <InputText v-model="formData.businessNiche" class="w-full" placeholder="Например: стоматология, фитнес, недвижимость" />
-                    </div>
-                    <div class="col-span-12 md:col-span-6">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Продукт / услуга</label>
-                        <InputText v-model="formData.product" class="w-full" placeholder="Например: имплантация зубов, абонемент, аренда" />
-                    </div>
-
-                    <div class="col-span-12 md:col-span-6">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Регионы</label>
-                        <MultiSelect v-model="formData.region" :options="REGION_OPTIONS" class="w-full" placeholder="Выберите регионы" display="chip" />
-                    </div>
-                    <div class="col-span-12 md:col-span-6">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Уровень детализации</label>
-                        <Dropdown v-model="formData.detailLevel" :options="DETAIL_LEVEL_OPTIONS" class="w-full" placeholder="Выберите" />
-                    </div>
-
-                    <div class="col-span-12">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Тип анализа</label>
-                        <MultiSelect v-model="formData.analysisType" :options="ANALYSIS_TYPE_OPTIONS" class="w-full" placeholder="Выберите типы" display="chip" />
-                    </div>
-
-                    <div class="col-span-12 md:col-span-4">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">ЦА: гендер</label>
-                        <MultiSelect v-model="formData.targetAudience.genders" :options="GENDER_OPTIONS" class="w-full" placeholder="Выберите" display="chip" />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">ЦА: возраст</label>
-                        <MultiSelect v-model="formData.targetAudience.ageRanges" :options="AGE_RANGE_OPTIONS" class="w-full" placeholder="Выберите" display="chip" />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">ЦА: тип</label>
-                        <MultiSelect v-model="formData.targetAudience.types" :options="AUDIENCE_TYPE_OPTIONS" class="w-full" placeholder="Выберите" display="chip" />
-                    </div>
-
-                    <div class="col-span-12">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Цель на 6–12 месяцев</label>
-                        <Textarea v-model="formData.goal" class="w-full" autoResize rows="2" placeholder="Например: увеличить заявки, снизить CAC, выйти в новый регион" />
-                    </div>
-
-                    <div class="col-span-12 md:col-span-6">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Сильная сторона (опционально)</label>
-                        <InputText v-model="formData.strongSide" class="w-full" placeholder="Например: лучший сервис, гарантия, цена" />
-                    </div>
-                    <div class="col-span-12 md:col-span-6">
-                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Слабая сторона (опционально)</label>
-                        <InputText v-model="formData.weakSide" class="w-full" placeholder="Например: слабый сайт, мало отзывов, низкая скорость обработки" />
-                    </div>
-                </div>
-
-                <div v-if="error" class="relative mt-4">
-                    <Message severity="error" class="api-error" :closable="false">{{ error }}</Message>
-                </div>
-
-                <div v-if="loading" class="absolute inset-0 bg-white/65 backdrop-blur-[1px] flex items-center justify-center">
-                    <ProgressSpinner size="48" />
-                </div>
-            </div>
-
-            <!-- Embedded loading / error -->
-            <div v-if="embedded && !report && loading" class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-6 text-center">
-                <ProgressSpinner size="48" />
-                <div class="mt-3 text-[13px] text-slate-600">Загружаем v2 отчёт…</div>
-            </div>
-            <div v-if="embedded && error" class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                <Message severity="error" class="api-error" :closable="false">{{ error }}</Message>
-            </div>
-
-            <div v-if="!embedded && !report && !loading" class="rounded-2xl border border-dashed border-slate-300 bg-white/60 p-8 text-center text-slate-600">
-                <div class="text-[15px] font-semibold text-slate-800">Данные ещё не загружены</div>
-                <div class="mt-2 text-[13px]">Заполните параметры сверху и нажмите <span class="font-semibold">Generate</span>, чтобы получить отчёт из API v2.</div>
-            </div>
-
-            <!-- Slide: Обзор рынка -->
-            <section v-if="report" class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.market_overview?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Индекс онлайн-спроса"
-                            :value="marketDemandIndexValue"
-                            :subtitle="marketPotentialSubtitle"
-                            icon="pi-search"
-                            :accentColor="PPT_BLUE"
-                            description="Коэффициент востребованности в сети (отношение текущего спроса к базисному). Показывает, насколько активен спрос на ваш продукт/услугу в цифровых каналах."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Темп изменения спроса"
-                            :value="marketYoYGrowthValue"
-                            subtitle="рост за год"
-                            icon="pi-arrow-up-right"
-                            :accentColor="PPT_ORANGE"
-                            description="Процент роста спроса по сравнению с прошлым годом. Положительное значение означает рост интереса к продукту/услуге."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Коэффициент сезонности"
-                            :value="marketSeasonalityValue"
-                            :subtitle="`диапазон ${seasonalityRangeValue}`"
-                            icon="pi-calendar"
-                            :accentColor="PPT_GREEN"
-                            description="Индекс активности спроса в весенний период. Например, 1.15x означает рост на 15% выше среднего. Помогает планировать маркетинговые кампании с учетом сезонности."
-                        />
-                    </div>
-
-                    <div class="col-span-12 lg:col-span-8">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                            <div class="flex items-center justify-between gap-3 mb-3">
-                                <div class="flex items-center gap-1.5">
-                                    <div class="text-[16px] font-semibold text-slate-800">Динамика онлайн-спроса</div>
-                                    <i
-                                        class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                        v-tooltip.top="'Массив числовых значений интереса по конкретным месяцам. Показывает сезонные колебания спроса и помогает планировать рекламные кампании.'"
-                                    ></i>
-                                </div>
-                                <div class="text-[14px] font-semibold text-green-700">{{ marketYoYGrowthValue }}</div>
-                            </div>
-                            <div class="h-[260px]">
-                                <Chart type="line" :data="marketDynamicsLineData" :options="marketDynamicsLineOptions" :plugins="barPlugins" />
-                            </div>
-                            <!-- <div class="mt-4 pt-4 border-t border-slate-200/70">
-                                <div class="overflow-hidden rounded-xl border border-slate-200/70">
-                                    <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
-                                        <div class="col-span-8 px-3 py-2">Месяц</div>
-                                        <div class="col-span-4 px-3 py-2 text-right">Индекс</div>
-                                    </div>
-                                    <div class="divide-y divide-slate-200/70">
-                                        <div v-for="row in marketDynamicsTableRows" :key="row.label" class="grid grid-cols-12 px-3 py-2.5">
-                                            <div class="col-span-8 text-[13px] text-slate-800">{{ row.label }}</div>
-                                            <div class="col-span-4 text-[13px] text-slate-800 text-right">{{ row.value }}</div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div> -->
-                        </div>
-                    </div>
-
-                    <div class="col-span-12 lg:col-span-4">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-[315px] flex flex-col">
-                            <div class="flex items-center gap-1.5 mb-3">
-                                <div class="text-[16px] font-semibold text-slate-800">География онлайн-интереса за год</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Список приоритетных регионов, где зафиксирован наибольший спрос. Помогает определить географию для фокусировки маркетинговых усилий.'"
-                                ></i>
-                            </div>
-                            <div v-if="geographyRows.length > 0" class="space-y-3 flex-1 flex flex-col min-h-0">
-                                <div class="flex-1 overflow-y-auto rounded-xl border border-slate-200/70" style="scrollbar-width: thin; scrollbar-color: rgb(203 213 225) rgb(241 245 249);">
-                                    <div class="divide-y divide-slate-200/70">
-                                        <div v-for="(row, idx) in geographyRows" :key="row.city" class="px-4 py-3">
-                                            <div class="flex items-center justify-between gap-3 mb-2">
-                                                <div class="flex items-center gap-2">
-                                                    <div class="h-2 w-2 rounded-full" :style="{ background: getGeographyColor(row.percentage, idx) }"></div>
-                                                    <div class="text-[14px] font-medium text-slate-800">{{ row.city }}</div>
-                                                </div>
-                                                <div class="text-[14px] font-semibold text-slate-800">{{ row.value }}</div>
-                                            </div>
-                                            <div class="h-2.5 rounded-full bg-slate-200/70 overflow-hidden">
-                                                <div
-                                                    class="h-full rounded-full transition-all duration-500"
-                                                    :style="{
-                                                        width: `${row.percentage}%`,
-                                                        background: getGeographyGradient(row.percentage, idx)
-                                                    }"
-                                                ></div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="flex items-center justify-center gap-3 text-[12px] text-slate-500 flex-shrink-0">
-                                    <span class="inline-flex items-center gap-2">
-                                        <span class="h-2.5 w-10 rounded-full" style="background: linear-gradient(90deg, #ff8e4f, #52c41a)"></span>
-                                        <span>Высокий → Низкий</span>
-                                    </span>
-                                </div>
-                            </div>
-                            <div v-else class="flex-1 flex items-center justify-center rounded-xl border border-dashed border-slate-300 bg-slate-50/70 px-4 py-6 text-center text-slate-500">
-                                <div class="text-sm">Нет данных</div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.market_overview?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Целевая аудитория -->
-            <section class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.target_audience?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Размер аудитории"
-                            :value="audienceTotalValue"
-                            subtitle="высокий онлайн-потенциал"
-                            icon="pi-users"
-                            :accentColor="PPT_BLUE"
-                            description="Оценочное количество потенциальных клиентов в выбранных регионах. Помогает оценить масштаб рынка и потенциал для роста."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Лидирующий сегмент"
-                            :value="audienceLeadingSegmentValue"
-                            subtitle="рост за год"
-                            icon="pi-user"
-                            :accentColor="PPT_ORANGE"
-                            description="Название самого активного или многочисленного сегмента. Показывает, на какую группу потребителей стоит фокусировать маркетинговый бюджет."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Доход"
-                            :value="audienceIncomeAboveAvgText"
-                            subtitle="доход выше среднего"
-                            icon="pi-wallet"
-                            :accentColor="PPT_GREEN"
-                            description="Процент аудитории с уровнем дохода «выше среднего». Показывает платёжеспособность целевой аудитории."
-                        />
-                    </div>
-
-                    <div class="col-span-12">
-                        <div class="grid grid-cols-12 gap-4">
-                            <div class="col-span-12 lg:col-span-6">
-                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                                    <div class="flex items-center gap-1.5 mb-2">
-                                        <div class="text-[16px] font-semibold text-slate-800">Возрастная структура</div>
-                                        <i
-                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                            v-tooltip.top="'Процентное распределение аудитории по возрастным категориям (от 18 до 55+). Помогает адаптировать рекламные сообщения под возрастные группы.'"
-                                        ></i>
-                                    </div>
-                                    <div class="h-[240px]">
-                                        <Chart type="bar" :data="ageBarData" :options="compactBarOptions" :plugins="barPlugins" />
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="col-span-12 lg:col-span-6">
-                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                                    <div class="flex items-center gap-1.5 mb-2">
-                                        <div class="text-[16px] font-semibold text-slate-800">Доход и платёжеспособность</div>
-                                        <i
-                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                            v-tooltip.top="'Распределение аудитории по уровню дохода. Показывает, какая доля аудитории имеет доход выше среднего и может позволить себе ваш продукт/услугу.'"
-                                        ></i>
-                                    </div>
-                                    <div class="h-[220px]">
-                                        <Chart type="bar" :data="incomeBarData" :options="compactBarOptions" :plugins="barPlugins" />
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div v-if="segmentRows.length > 0" class="col-span-12">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                            <div class="flex items-center gap-1.5 mb-2">
-                                <div class="text-[16px] font-semibold text-slate-800">Сегменты аудитории</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Распределение аудитории по поведенческим сегментам. Помогает понять, какие группы клиентов доминируют и как их приоритизировать.'"
-                                ></i>
-                            </div>
-                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
-                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
-                                    <div class="col-span-7 px-3 py-2">Сегмент</div>
-                                    <div class="col-span-5 px-3 py-2 text-right">Доля</div>
-                                </div>
-                                <div class="divide-y divide-slate-200/70">
-                                    <div v-for="row in segmentRows" :key="row.name" class="grid grid-cols-12 px-3 py-2.5">
-                                        <div class="col-span-7 text-[13px] text-slate-800">{{ row.name }}</div>
-                                        <div class="col-span-5 text-[13px] text-slate-800 text-right">{{ row.shareLabel }}</div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.target_audience?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Конкурентная среда -->
-            <section class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.competitive_environment?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Доля ключевого конкурента на рынке"
-                            :value="competitionMarketShareValue"
-                            :subtitle="competitionLeaderSubtitle"
-                            icon="pi-sitemap"
-                            :accentColor="PPT_BLUE"
-                            description="Оценочная доля онлайн-трафика, которую занимает текущий бизнес. Показывает вашу позицию на рынке относительно общего объема трафика в нише."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            :title="competitionRankTitle"
-                            :value="competitionRankValue"
-                            subtitle=""
-                            icon="pi-chart-bar"
-                            :accentColor="PPT_GREEN"
-                            :description="competitionRankDescription"
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            :title="competitionAdPressureTitle"
-                            :value="competitionCompetitorShareValue"
-                            :subtitle="competitionAdPressureSubtitle"
-                            icon="pi-wallet"
-                            :accentColor="PPT_ORANGE"
-                            :description="competitionAdPressureDescription"
-                        />
-                    </div>
-
-                    <div class="col-span-12 lg:col-span-7">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                            <div class="flex items-center justify-between gap-3 mb-2">
-                                <div class="flex items-center gap-1.5">
-                                    <div class="text-[16px] font-semibold text-slate-800">Digital-видимость: топ конкурентов</div>
-                                    <i
-                                        class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                        v-tooltip.top="'Сравнительный индекс видимости (баллы от 0 до 100) для вашего бизнеса и конкурентов. Показывает, насколько хорошо вы заметны в цифровых каналах по сравнению с конкурентами.'"
-                                    ></i>
-                                </div>
-                                <div class="text-[12px] text-slate-500">Бенчмарк</div>
-                            </div>
-                            <div class="h-[280px]">
-                                <Chart type="bar" :data="visibilityBarData" :options="visibilityBarOptions" :plugins="barPlugins" />
-                            </div>
-                        </div>
-                    </div>
-                    <div class="col-span-12 lg:col-span-5">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                            <div class="flex items-center gap-1.5 mb-3">
-                                <div class="text-[16px] font-semibold text-slate-800">Ключевые сильные стороны основных конкурентов</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Список конкретных преимуществ для каждого игрока рынка (включая ваш бизнес). Помогает понять конкурентные преимущества и слабые места.'"
-                                ></i>
-                            </div>
-                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
-                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
-                                    <div class="col-span-5 px-3 py-2">Конкурент</div>
-                                    <div class="col-span-7 px-3 py-2">Бенчмарк (Астана)</div>
-                                </div>
-                                <div class="divide-y divide-slate-200/70">
-                                    <div v-for="row in competitionStrengthRows" :key="row.label" class="grid grid-cols-12 px-3 py-3">
-                                        <div class="col-span-5 text-[14px] text-slate-800">{{ row.label }}</div>
-                                        <div class="col-span-7 text-[13px] text-slate-600">
-                                            <span v-if="row.strengths?.length">{{ row.strengths.join(', ') }}</span>
-                                            <span v-else class="text-slate-400">—</span>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.competitive_environment?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Спрос и поведение -->
-            <section class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.demand_and_behavior?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Поиск в Google"
-                            :value="behaviorSearchGrowthValue"
-                            subtitle=""
-                            icon="pi-search"
-                            :accentColor="PPT_BLUE"
-                            description="Динамика роста поисковых запросов в нише. Показывает, растет ли интерес к продукту/услуге в поисковых системах."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Взаимодействия до покупки"
-                            :value="behaviorInteractionsValue"
-                            subtitle=""
-                            icon="pi-send"
-                            :accentColor="PPT_ORANGE"
-                            description="Среднее количество касаний (визитов, кликов), необходимых клиенту для принятия решения. Помогает понять длину пути клиента и необходимое количество контактов."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Вероятность повторного отказа"
-                            :value="behaviorRepeatRefusalValue"
-                            subtitle=""
-                            icon="pi-refresh"
-                            :accentColor="PPT_GREEN"
-                            description="Вероятность того, что клиент не вернется после первого опыта. Высокое значение указывает на проблемы с качеством сервиса или продукта."
-                        />
-                    </div>
-
-                    <div class="col-span-12 lg:col-span-5">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                            <div class="flex items-center gap-1.5 mb-2">
-                                <div class="text-[16px] font-semibold text-slate-800">Типы поисковых запросов</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Структура запросов: каталожные, информационные, брендовые. Показывает, как пользователи ищут ваш продукт/услугу и какие типы контента им нужны.'"
-                                ></i>
-                            </div>
-                            <div class="h-[260px]">
-                                <Chart type="doughnut" :data="queryTypesDonutData" :options="queryTypesDonutOptions" :plugins="donutPlugins" />
-                            </div>
-                            <!-- Метрики под диаграммой -->
-                            <div v-if="queryTypesMetrics.length > 0" class="mt-4 pt-4 border-t border-slate-200/70">
-                                <div class="grid grid-cols-2 gap-3">
-                                    <div v-for="metric in queryTypesMetrics" :key="metric.label" class="flex items-center gap-2">
-                                        <div class="h-3 w-3 rounded-full" :style="{ background: metric.color }"></div>
-                                        <div class="flex-1 min-w-0">
-                                            <div class="text-[12px] text-slate-600 truncate">{{ metric.label }}</div>
-                                        </div>
-                                        <div class="text-[13px] font-semibold text-slate-800 whitespace-nowrap">{{ metric.value }}%</div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="col-span-12 lg:col-span-7">
-                        <div class="grid grid-cols-12 gap-4">
-                            <div class="col-span-12">
-                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                                    <div class="flex items-center gap-1.5 mb-2">
-                                        <div class="text-[16px] font-semibold text-slate-800">Факторы принятия решения</div>
-                                        <i
-                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                            v-tooltip.top="'Что важнее всего для клиента при выборе: Цена, Отзывы, Сервис и т.д. Помогает понять приоритеты клиентов и адаптировать оффер.'"
-                                        ></i>
-                                    </div>
-                                    <div class="h-[220px]">
-                                        <Chart type="bar" :data="decisionFactorsBarData" :options="compactBarOptions" :plugins="barPlugins" />
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="col-span-12">
-                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                                    <div class="flex items-center gap-1.5 mb-2">
-                                        <div class="text-[16px] font-semibold text-slate-800">Причины отказов</div>
-                                        <i
-                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                            v-tooltip.top="'Барьеры, которые мешают завершить покупку (например, «непонятный оффер», высокая цена, отсутствие отзывов). Помогает выявить и устранить препятствия на пути к конверсии.'"
-                                        ></i>
-                                    </div>
-                                    <div class="h-[200px]">
-                                        <Chart type="bar" :data="refusalReasonsBarData" :options="compactBarOptions" :plugins="barPlugins" />
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.demand_and_behavior?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Путь клиента -->
-            <section class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.customer_journey?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Конверсия лид → запись"
-                            :value="report?.sections?.customer_journey?.conversion_rates?.lead_to_booking"
-                            subtitle=""
-                            icon="pi-comments"
-                            :accentColor="PPT_BLUE"
-                            description="Процент перехода от лида к записи. Показывает эффективность работы отдела продаж на этапе конверсии лида в клиента."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Конверсия запись → оплата"
-                            :value="report?.sections?.customer_journey?.conversion_rates?.booking_to_payment"
-                            subtitle=""
-                            icon="pi-comment"
-                            :accentColor="PPT_ORANGE"
-                            description="Процент перехода от записи к оплате. Показывает, сколько клиентов, сделавших запись, завершают покупку."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Конверсия лид → оплата"
-                            :value="report?.sections?.customer_journey?.conversion_rates?.lead_to_payment_total"
-                            subtitle=""
-                            icon="pi-wallet"
-                            :accentColor="PPT_ORANGE"
-                            description="Общая конверсия от лида до оплаты. Показывает эффективность всей воронки продаж от первого контакта до завершения сделки."
-                        />
-                    </div>
-
-                    <div class="col-span-12">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                            <div class="flex items-center gap-1.5 mb-2">
-                                <div class="text-[16px] font-semibold text-slate-800">Воронка продаж</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Абсолютные показатели воронки: сколько человек пришло с рекламы, сколько стали лидами, сколько купили. Визуализирует потери клиентов на каждом этапе.'"
-                                ></i>
-                            </div>
-                            <div class="h-[320px]">
-                                <Chart type="bar" :data="funnelBarData" :options="funnelBarOptions" :plugins="barPlugins" />
-                            </div>
-                        </div>
-                    </div>
-
-                    <div v-if="funnelBottleneckRows.length > 0" class="col-span-12">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                            <div class="flex items-center gap-1.5 mb-2">
-                                <div class="text-[16px] font-semibold text-slate-800">Узкие места воронки</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Этапы, где теряется больше всего клиентов, и основные причины отказа.'"
-                                ></i>
-                            </div>
-                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
-                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
-                                    <div class="col-span-4 px-3 py-2">Этап</div>
-                                    <div class="col-span-8 px-3 py-2">Причина</div>
-                                </div>
-                                <div class="divide-y divide-slate-200/70">
-                                    <div v-for="row in funnelBottleneckRows" :key="row.key" class="grid grid-cols-12 px-3 py-2.5">
-                                        <div class="col-span-4 text-[13px] text-slate-800">{{ row.stage }}</div>
-                                        <div class="col-span-8 text-[13px] text-slate-600">{{ row.reason }}</div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.customer_journey?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Каналы привлечения -->
-            <section class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.acquisition_channels?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Доля поискового трафика"
-                            :value="channelsSearchShareValue"
-                            subtitle=""
-                            icon="pi-search"
-                            :accentColor="PPT_BLUE"
-                            description="Процент клиентов, приходящих из поисковых систем. Показывает важность SEO и контекстной рекламы для вашего бизнеса."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Средняя стоимость лида"
-                            :value="channelsLeadCostValue"
-                            subtitle=""
-                            icon="pi-chart-bar"
-                            :accentColor="PPT_GREEN"
-                            description="Средняя стоимость одного лида (CPL) в валюте региона. Помогает оценить эффективность инвестиций в маркетинг и сравнить каналы."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Потенциал каналов к росту"
-                            :value="channelsGrowthPotentialValue"
-                            subtitle=""
-                            icon="pi-arrow-up-right"
-                            :accentColor="PPT_ORANGE"
-                            description="Оценка возможности роста в различных каналах привлечения. Помогает определить, в какие каналы стоит инвестировать больше."
-                        />
-                    </div>
-
-                    <div class="col-span-12">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                            <div class="flex items-center gap-1.5 mb-2">
-                                <div class="text-[16px] font-semibold text-slate-800">Доли каналов</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Распределение долей трафика по каналам. Помогает понять, какие каналы дают основной вклад в привлечение клиентов.'"
-                                ></i>
-                            </div>
-                            <div class="h-[240px]">
-                                <Chart v-if="channelSharesBarData.labels.length > 0" type="bar" :data="channelSharesBarData" :options="channelSharesBarOptions" :plugins="barPlugins" />
-                                <div v-else class="h-full flex items-center justify-center text-slate-500 text-[13px]">
-                                    Нет данных по долям каналов
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.acquisition_channels?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Экономика маркетинга -->
-            <section class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.marketing_economics?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Стоимость клиента"
-                            :value="cacValue"
-                            subtitle=""
-                            icon="pi-wallet"
-                            :accentColor="PPT_BLUE"
-                            description="Стоимость привлечения одного платящего клиента (CAC). Рассчитывается как отношение маркетинговых расходов к количеству новых клиентов. Показывает эффективность маркетинговых инвестиций."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Конверсия в повторные продажи"
-                            :value="repeatSalesConversionValue"
-                            subtitle=""
-                            icon="pi-refresh"
-                            :accentColor="PPT_GREEN"
-                            description="Доля клиентов, совершающих вторую и последующие покупки. Показывает эффективность удержания клиентов и потенциал для увеличения LTV (lifetime value)."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Возврат инвестиций в маркетинг"
-                            :value="roiValue"
-                            subtitle=""
-                            icon="pi-chart-line"
-                            :accentColor="PPT_ORANGE"
-                            description="Коэффициент возврата инвестиций (ROI). Показывает, во сколько раз выручка превышает вложения в маркетинг. Рассчитывается как (Прибыль / Инвестиции) × 100%."
-                        />
-                    </div>
-
-                    <div class="col-span-12">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                            <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-3">
-                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
-                                    <div class="flex items-center gap-1.5">
-                                        <div class="text-[12px] font-semibold text-slate-500">CAC</div>
-                                        <i
-                                            class="pi pi-question-circle text-[10px] text-slate-400 cursor-help"
-                                            v-tooltip.top="'Customer Acquisition Cost - стоимость привлечения одного нового клиента. Рассчитывается как: Маркетинговые расходы / Количество новых клиентов.'"
-                                        ></i>
-                                    </div>
-                                    <div class="mt-2 katex-box" v-html="cacKatex"></div>
-                                    <div class="mt-2 text-[12px] text-slate-600">
-                                        Значение: <span class="font-semibold text-slate-800">{{ cacValue }}</span>
-                                    </div>
-                                </div>
-                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
-                                    <div class="flex items-center gap-1.5">
-                                        <div class="text-[12px] font-semibold text-slate-500">ROI</div>
-                                        <i
-                                            class="pi pi-question-circle text-[10px] text-slate-400 cursor-help"
-                                            v-tooltip.top="'Return on Investment - возврат инвестиций. Рассчитывается как: (Прибыль / Инвестиции) × 100%. Показывает эффективность маркетинговых вложений.'"
-                                        ></i>
-                                    </div>
-                                    <div class="mt-2 katex-box" v-html="roiKatex"></div>
-                                    <div class="mt-2 text-[12px] text-slate-600">
-                                        Значение: <span class="font-semibold text-slate-800">{{ roiValue }}</span>
-                                    </div>
-                                </div>
-                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
-                                    <div class="text-[12px] font-semibold text-slate-500">Расходы на маркетинг</div>
-                                    <div class="mt-2 text-[16px] font-semibold text-slate-900">{{ report?.sections?.marketing_economics?.financial_performance?.marketing_expenses?.month }}</div>
-                                    <div class="text-[12px] text-slate-600">в месяц · {{ report?.sections?.marketing_economics?.financial_performance?.marketing_expenses?.year }} в год</div>
-                                </div>
-                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
-                                    <div class="text-[12px] font-semibold text-slate-500">Клиенты</div>
-                                    <div class="mt-2 text-[16px] font-semibold text-slate-900">{{ report?.sections?.marketing_economics?.financial_performance?.clients?.month }}</div>
-                                    <div class="text-[12px] text-slate-600">в месяц · {{ report?.sections?.marketing_economics?.financial_performance?.clients?.year }} в год</div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12 lg:col-span-7">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                            <div class="flex items-center gap-1.5 mb-3">
-                                <div class="text-[16px] font-semibold text-slate-800">Основные показатели</div>
-                                <i
-                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
-                                    v-tooltip.top="'Сравнение расходов, количества клиентов, CAC, выручки и прибыли в разрезе Месяц против Год. Показывает динамику ключевых финансовых метрик.'"
-                                ></i>
-                            </div>
-                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
-                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
-                                    <div class="col-span-6 px-3 py-2">Показатель</div>
-                                    <div class="col-span-3 px-3 py-2 text-center">Месяц</div>
-                                    <div class="col-span-3 px-3 py-2 text-center">Год</div>
-                                </div>
-                                <div class="divide-y divide-slate-200/70">
-                                    <div v-for="row in economicsPerformanceRows" :key="row.key" class="grid grid-cols-12 px-3 py-3">
-                                        <div class="col-span-6 text-[13px] text-slate-800">{{ row.label }}</div>
-                                        <div class="col-span-3 text-[13px] text-slate-800 text-center">{{ row.month }}</div>
-                                        <div class="col-span-3 text-[13px] text-slate-800 text-center">{{ row.year }}</div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="col-span-12 lg:col-span-5">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                            <div class="text-[16px] font-semibold text-slate-800 mb-3">Процесс повторения</div>
-                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
-                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
-                                    <div class="col-span-6 px-3 py-2">Этап</div>
-                                    <div class="col-span-3 px-3 py-2 text-center">Стоимость</div>
-                                    <div class="col-span-3 px-3 py-2">Эффективность</div>
-                                </div>
-                                <div class="divide-y divide-slate-200/70">
-                                    <div v-for="row in channelEfficiencyRows" :key="`econ-${row.key}`" class="grid grid-cols-12 px-3 py-3 items-center">
-                                        <div class="col-span-6 text-[13px] text-slate-800">{{ row.label }}</div>
-                                        <div class="col-span-3 text-[13px] text-slate-800 text-center">{{ row.cost }}</div>
-                                        <div class="col-span-3 text-[13px]" :class="row.statusClass">{{ row.status }}</div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.marketing_economics?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Проблемы и узкие места -->
-            <section class="space-y-3">
-                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.bottlenecks?.title }}</div>
-
-                <div class="grid grid-cols-12 gap-4">
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Проблемы на лендингах"
-                            :value="bottlenecksLandingIssuesValue"
-                            subtitle=""
-                            icon="pi-exclamation-triangle"
-                            :accentColor="PPT_BLUE"
-                            description="Процентное влияние проблем на лендингах (сайтах). Показывает, насколько сильно проблемы с сайтом мешают конверсии клиентов."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Медленные ответы менеджеров"
-                            :value="bottlenecksSlowResponsesValue"
-                            subtitle=""
-                            icon="pi-refresh"
-                            :accentColor="PPT_GREEN"
-                            description="Процентное влияние медленных ответов менеджеров на потери клиентов. Показывает важность скорости обработки лидов отделом продаж."
-                        />
-                    </div>
-                    <div class="col-span-12 md:col-span-4">
-                        <PptKpiCard
-                            title="Отказ на повторных касаниях"
-                            :value="bottlenecksRepeatRefusalValue"
-                            subtitle=""
-                            icon="pi-plus"
-                            :accentColor="PPT_ORANGE"
-                            description="Процентное влияние проблем с удержанием клиентов. Показывает, насколько сильно проблемы с ретеншном мешают повторным продажам."
-                        />
-                    </div>
-
-                    <div class="col-span-12">
-                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
-                            <div class="grid grid-cols-12 gap-4">
-                                <div class="col-span-12 lg:col-span-4">
-                                    <div class="rounded-2xl border border-slate-200/70 bg-white p-4 h-full">
-                                        <div class="flex items-center gap-2 mb-3">
-                                            <div class="h-8 w-8 rounded-xl flex items-center justify-center" :style="{ background: 'rgba(91,137,255,0.14)', color: PPT_BLUE }">
-                                                <i class="pi pi-cog"></i>
-                                            </div>
-                                            <div class="flex items-center gap-1.5">
-                                                <div class="text-[15px] font-semibold text-slate-800">Лендинг</div>
-                                                <i
-                                                    class="pi pi-question-circle text-[11px] text-slate-400 cursor-help"
-                                                    v-tooltip.top="'Конкретные списки недоработок на сайте/лендинге. Показывает проблемы, которые мешают конверсии посетителей в клиентов.'"
-                                                ></i>
-                                            </div>
-                                        </div>
-                                        <ul class="list-disc pl-5 space-y-2 text-[13px] text-slate-600">
-                                            <li v-for="t in bottlenecksDetails.landing" :key="t">{{ t }}</li>
-                                        </ul>
-                                    </div>
-                                </div>
-                                <div class="col-span-12 lg:col-span-4">
-                                    <div class="rounded-2xl border border-slate-200/70 bg-white p-4 h-full">
-                                        <div class="flex items-center gap-2 mb-3">
-                                            <div class="h-8 w-8 rounded-xl flex items-center justify-center" :style="{ background: 'rgba(255,142,79,0.16)', color: PPT_ORANGE }">
-                                                <i class="pi pi-clock"></i>
-                                            </div>
-                                            <div class="flex items-center gap-1.5">
-                                                <div class="text-[15px] font-semibold text-slate-800">Работа с лидами</div>
-                                                <i
-                                                    class="pi pi-question-circle text-[11px] text-slate-400 cursor-help"
-                                                    v-tooltip.top="'Конкретные списки недоработок в отделе продаж (Lead Management). Показывает проблемы в обработке лидов и работе с потенциальными клиентами.'"
-                                                ></i>
-                                            </div>
-                                        </div>
-                                        <ul class="list-disc pl-5 space-y-2 text-[13px] text-slate-600">
-                                            <li v-for="t in bottlenecksDetails.lead_management" :key="t">{{ t }}</li>
-                                        </ul>
-                                    </div>
-                                </div>
-                                <div class="col-span-12 lg:col-span-4">
-                                    <div class="rounded-2xl border border-slate-200/70 bg-white p-4 h-full">
-                                        <div class="flex items-center gap-2 mb-3">
-                                            <div class="h-8 w-8 rounded-xl flex items-center justify-center" :style="{ background: 'rgba(255,107,107,0.14)', color: '#FF6B6B' }">
-                                                <i class="pi pi-chart-pie"></i>
-                                            </div>
-                                            <div class="flex items-center gap-1.5">
-                                                <div class="text-[15px] font-semibold text-slate-800">Ретеншн</div>
-                                                <i
-                                                    class="pi pi-question-circle text-[11px] text-slate-400 cursor-help"
-                                                    v-tooltip.top="'Конкретные списки недоработок в удержании клиентов (Retention). Показывает проблемы, которые мешают повторным покупкам и долгосрочным отношениям с клиентами.'"
-                                                ></i>
-                                            </div>
-                                        </div>
-                                        <ul class="list-disc pl-5 space-y-2 text-[13px] text-slate-600">
-                                            <li v-for="t in bottlenecksDetails.retention" :key="t">{{ t }}</li>
-                                        </ul>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="col-span-12">
-                        <PptConclusionBox :text="report?.sections?.bottlenecks?.conclusion" />
-                    </div>
-                </div>
-            </section>
-
-            <!-- Slide: Рекомендации -->
-            <section class="space-y-3">
-                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-6">
-                    <div class="text-[13px] text-slate-500 mb-1">Маркетинг <span class="mx-1">›</span> Рекомендации</div>
-                    <div class="flex items-center justify-center gap-2">
-                        <div class="text-3xl font-semibold tracking-wide text-center text-slate-800">РЕКОМЕНДАЦИИ</div>
-                        <i
-                            class="pi pi-question-circle text-[14px] text-slate-400 cursor-help"
-                            v-tooltip.top="
-                                'Массив ключевых стратегий развития. Каждая содержит название направления (например, «Оптимизация сайта») и конкретное описание действий для реализации. Финальный прогноз эффективности при условии внедрения рекомендаций.'
-                            "
-                        ></i>
-                    </div>
-                    <div class="text-center text-slate-500 text-sm mt-1">итоги маркетингового анализа для интернет-продвижения</div>
-
-                    <div class="mt-6 grid grid-cols-12 gap-4">
-                        <div class="col-span-12 md:col-span-4">
-                            <PptKpiCard
-                                title="Стоимость клиента"
-                                :value="cacValue"
-                                subtitle=""
-                                icon="pi-wallet"
-                                :accentColor="PPT_BLUE"
-                                description="Стоимость привлечения одного платящего клиента (CAC). Рассчитывается как отношение маркетинговых расходов к количеству новых клиентов."
-                            />
-                        </div>
-                        <div class="col-span-12 md:col-span-4">
-                            <PptKpiCard
-                                title="Конверсия в повторные продажи"
-                                :value="repeatSalesConversionValue"
-                                subtitle=""
-                                icon="pi-refresh"
-                                :accentColor="PPT_GREEN"
-                                description="Доля клиентов, совершающих вторую и последующие покупки. Показывает эффективность удержания клиентов."
-                            />
-                        </div>
-                        <div class="col-span-12 md:col-span-4">
-                            <PptKpiCard
-                                title="Возврат инвестиций"
-                                :value="roiValue"
-                                subtitle=""
-                                icon="pi-chart-line"
-                                :accentColor="PPT_ORANGE"
-                                description="Коэффициент возврата инвестиций (ROI). Показывает, во сколько раз выручка превышает вложения в маркетинг."
-                            />
-                        </div>
-
-                        <div class="col-span-12 grid grid-cols-12 gap-4">
-                            <div v-for="(r, idx) in recommendationMessages" :key="r.key" class="col-span-12 md:col-span-6 xl:col-span-3">
-                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
-                                    <div class="flex items-start gap-3">
-                                        <div
-                                            class="h-10 w-10 rounded-xl flex items-center justify-center border border-slate-200/70"
-                                            :style="{
-                                                background: idx === 0 ? 'rgba(91,137,255,0.14)' : idx === 1 ? 'rgba(82,196,26,0.14)' : idx === 2 ? 'rgba(255,142,79,0.14)' : 'rgba(91,137,255,0.10)',
-                                                color: idx === 1 ? PPT_GREEN : idx === 2 ? PPT_ORANGE : PPT_BLUE
-                                            }"
-                                        >
-                                            <i class="pi" :class="idx === 0 ? 'pi-bullseye' : idx === 1 ? 'pi-comments' : idx === 2 ? 'pi-star' : 'pi-chart-line'"></i>
-                                        </div>
-                                        <div class="min-w-0">
-                                            <div class="text-[15px] font-semibold text-slate-800">{{ r.strategy }}</div>
-                                            <div class="mt-2 text-[13px] leading-snug text-slate-600">{{ r.action }}</div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-
-                        <div class="col-span-12">
-                            <PptConclusionBox :text="report?.sections?.recommendations?.conclusion" />
-                        </div>
-                    </div>
-                </div>
-            </section>
-
-            <!-- Источники -->
-            <section class="space-y-3">
-                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-6">
-                    <div class="text-[13px] text-slate-500 mb-1">Маркетинг <span class="mx-1">›</span> Источники</div>
-                    <div class="flex items-center justify-center gap-2">
-                        <div class="text-3xl font-semibold tracking-wide text-center text-slate-800">ИСТОЧНИКИ</div>
-                        <i
-                            class="pi pi-info-circle text-[14px] text-slate-400 cursor-help"
-                            v-tooltip.top="'Список источников данных, использованных при подготовке маркетингового анализа'"
-                        ></i>
-                    </div>
-                    <div class="text-center text-slate-500 text-sm mt-1">список источников данных для анализа</div>
-
-
-
-                    <div class="mt-6">
-                        <template v-if="report?.sources && Array.isArray(report.sources) && report.sources.length > 0">
-                            <div class="space-y-3">
-                                <div v-for="(source, index) in report.sources" :key="index" class="flex items-start gap-3 p-3 rounded-xl border border-slate-200/60 hover:bg-slate-50/50 transition-colors">
-                                    <div class="h-8 w-8 rounded-lg flex items-center justify-center border border-slate-200/70 bg-slate-50/50 flex-shrink-0">
-                                        <i class="pi pi-link text-slate-500 text-sm"></i>
-                                    </div>
-                                    <a
-                                        :href="source"
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        class="text-sm text-blue-600 hover:text-blue-800 hover:underline break-all flex-1"
-                                    >
-                                        {{ source }}
-                                    </a>
-                                </div>
-                            </div>
-                        </template>
-                        <div v-else class="text-center text-slate-400 text-sm py-8">
-                            <i class="pi pi-info-circle mr-2"></i>
-                            Источники не найдены
-                        </div>
-                    </div>
-                </div>
-            </section>
-
-            <!-- Кнопка создания стратегии -->
-            <section v-if="report && !embedded" class="space-y-3">
-                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-6">
-                    <div class="flex items-center justify-center">
-                        <Button
-                            label="Создать стратегию"
-                            icon="pi pi-magic"
-                            severity="success"
-                            size="large"
-                            @click="goToStrategy"
-                        />
-                    </div>
-                </div>
-            </section>
-        </div>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import katex from 'katex';
 import Button from 'primevue/button';
 import Dropdown from 'primevue/dropdown';
@@ -1137,7 +108,7 @@ async function loadAnalysisV2() {
         const data = await MarketingService.fetchAnalysisV2(requestData);
         // MarketingService.fetchAnalysisV2 уже извлекает data из обёртки {success, message, data}
         // Но на всякий случай проверяем, может быть еще одна обёртка
-        let extractedData = (data?.data || data) || null;
+        let extractedData = data?.data || data || null;
 
         // Убеждаемся, что sources сохраняются - проверяем все возможные места
         if (extractedData && !extractedData.sources) {
@@ -1244,9 +215,7 @@ const competitionBenchmarkValue = computed(() => competitionMetrics.value?.bench
 const competitionRankTitle = computed(() => (competitionHasNewMetrics.value ? 'Уровень конкуренции' : 'Место в видимости'));
 const competitionAdPressureTitle = computed(() => (competitionHasNewMetrics.value ? 'Давление в рекламе' : 'Доля конкурентов в контекстной рекламе'));
 const competitionRankDescription = computed(() =>
-    competitionHasNewMetrics.value
-        ? 'Общая оценка насыщенности рынка конкурентами. Помогает понять уровень борьбы за клиента.'
-        : 'Позиция бренда в поисковой выдаче и рекламных каналах относительно конкурентов. Чем ниже число, тем выше позиция.'
+    competitionHasNewMetrics.value ? 'Общая оценка насыщенности рынка конкурентами. Помогает понять уровень борьбы за клиента.' : 'Позиция бренда в поисковой выдаче и рекламных каналах относительно конкурентов. Чем ниже число, тем выше позиция.'
 );
 const competitionAdPressureDescription = computed(() =>
     competitionHasNewMetrics.value
@@ -1453,7 +422,7 @@ const barValuesPlugin = {
                         const unit = dataset.unit || '';
                         let label = value.toLocaleString();
                         if (typeof value === 'number' && !Number.isInteger(value) && value < 10) {
-                             label = value.toFixed(2);
+                            label = value.toFixed(2);
                         }
                         label += unit;
                         const isHorizontal = chart.options.indexAxis === 'y';
@@ -1792,11 +761,7 @@ const competitiveListRows = computed(() => {
                 key: competitor.name ? String(competitor.name) : `competitor_${index + 1}`,
                 label,
                 visibility: Number.isFinite(visibility) ? visibility : 0,
-                strengths: Array.isArray(competitor.key_strengths)
-                    ? competitor.key_strengths
-                    : Array.isArray(competitor.keyStrengths)
-                      ? competitor.keyStrengths
-                      : [],
+                strengths: Array.isArray(competitor.key_strengths) ? competitor.key_strengths : Array.isArray(competitor.keyStrengths) ? competitor.keyStrengths : [],
                 priceSegment: competitor.price_segment ?? competitor.priceSegment ?? '',
                 website: competitor.website ?? ''
             };
@@ -1981,14 +946,10 @@ function normalizeEntries(raw, preferredEntries = [], aliasOrder = [], aliasMap
 
     const hasPreferred = preferredEntries.some(({ key }) => raw[key] !== undefined);
     if (hasPreferred) {
-        return preferredEntries
-            .map(({ key, label }) => ({ label, value: raw[key] }))
-            .filter(({ value }) => value !== undefined && value !== null && value !== '');
+        return preferredEntries.map(({ key, label }) => ({ label, value: raw[key] })).filter(({ value }) => value !== undefined && value !== null && value !== '');
     }
 
-    const aliasEntries = aliasOrder
-        .filter((key) => raw[key] !== undefined)
-        .map((key) => ({ label: aliasMap[key] ?? key, value: raw[key] }));
+    const aliasEntries = aliasOrder.filter((key) => raw[key] !== undefined).map((key) => ({ label: aliasMap[key] ?? key, value: raw[key] }));
     if (aliasEntries.length > 0) return aliasEntries;
 
     return Object.entries(raw).map(([key, value]) => ({ label: normalizeLabel(key), value }));
@@ -2004,7 +965,7 @@ const QUERY_TYPE_ALIAS_ORDER = ['Коммерческие (купить, цен
 const QUERY_TYPE_ALIAS_MAP = {
     'Коммерческие (купить, цена)': 'Коммерческие (купить, цена)',
     'Информационные (отзывы)': 'Информационные (отзывы)',
-    'Брендовые': 'Брендовые',
+    Брендовые: 'Брендовые',
     'Гео-запросы': 'Гео-запросы'
 };
 
@@ -2019,10 +980,10 @@ const DECISION_FACTOR_KEYS = [
 const DECISION_FACTOR_ALIAS_ORDER = ['Цена / Рассрочка', 'Отзывы', 'Локация', 'Сервис', 'Бренд'];
 const DECISION_FACTOR_ALIAS_MAP = {
     'Цена / Рассрочка': 'Цена / Рассрочка',
-    'Отзывы': 'Отзывы',
-    'Локация': 'Локация',
-    'Сервис': 'Сервис',
-    'Бренд': 'Бренд'
+    Отзывы: 'Отзывы',
+    Локация: 'Локация',
+    Сервис: 'Сервис',
+    Бренд: 'Бренд'
 };
 
 const REFUSAL_REASON_KEYS = [
@@ -2312,9 +1273,7 @@ const channelShareEntries = computed(() => {
 
     const hasPreferred = CHANNEL_SHARE_KEYS.some(({ key }) => shares[key] !== undefined);
     if (hasPreferred) {
-        const preferred = CHANNEL_SHARE_KEYS
-            .map(({ key, label }) => ({ label, value: shares[key] }))
-            .filter(({ value }) => value !== undefined && value !== null && value !== '');
+        const preferred = CHANNEL_SHARE_KEYS.map(({ key, label }) => ({ label, value: shares[key] })).filter(({ value }) => value !== undefined && value !== null && value !== '');
         const preferredKeys = new Set(CHANNEL_SHARE_KEYS.map(({ key }) => key));
         const extras = Object.entries(shares)
             .filter(([key]) => !preferredKeys.has(key))
@@ -2330,18 +1289,7 @@ const channelEfficiencyBarData = computed(() => {
     const eff = report.value?.sections?.acquisition_channels?.channel_efficiency ?? {};
 
     // Цвета для разных каналов
-    const channelColors = [
-        PPT_BLUE,
-        PPT_ORANGE,
-        PPT_GREEN,
-        '#60A5FA',
-        '#A855F7',
-        '#EC4899',
-        '#F59E0B',
-        '#10B981',
-        '#3B82F6',
-        '#8B5CF6'
-    ];
+    const channelColors = [PPT_BLUE, PPT_ORANGE, PPT_GREEN, '#60A5FA', '#A855F7', '#EC4899', '#F59E0B', '#10B981', '#3B82F6', '#8B5CF6'];
 
     // Получаем все каналы из данных
     const items = Object.keys(eff)
@@ -2388,7 +1336,7 @@ const channelEfficiencyBarOptions = computed(() => {
                 ...base.scales.x,
                 grid: { color: 'rgba(148,163,184,0.15)', drawBorder: false },
                 ticks: {
-                    callback: function(value) {
+                    callback: function (value) {
                         return value.toLocaleString('ru-RU') + ' KZT';
                     }
                 }
@@ -2400,7 +1348,7 @@ const channelEfficiencyBarOptions = computed(() => {
             tooltip: {
                 ...base.plugins?.tooltip,
                 callbacks: {
-                    label: function(context) {
+                    label: function (context) {
                         return context.parsed.x.toLocaleString('ru-RU') + ' KZT';
                     }
                 }
@@ -2439,7 +1387,7 @@ const channelEfficiencyRows = computed(() => {
         .filter(Boolean)
         .sort((a, b) => {
             // Сортируем по статусу: Very High -> High -> Medium -> Local -> остальные
-            const statusOrder = { 'very high': 1, 'high': 2, 'medium': 3, 'local': 4 };
+            const statusOrder = { 'very high': 1, high: 2, medium: 3, local: 4 };
             const aStatus = String(a.status || '').toLowerCase();
             const bStatus = String(b.status || '').toLowerCase();
             const aOrder = statusOrder[aStatus] || 5;
@@ -2461,6 +1409,1001 @@ const economicsPerformanceRows = computed(() => {
 });
 </script>
 
+<template>
+    <div class="min-h-screen bg-indigo-50/30 p-4 md:p-6">
+        <Toast />
+
+        <div class="mx-auto max-w-[1920px] space-y-7">
+            <Message severity="warn" class="mb-4" :closable="false">
+                <strong>Внимание:</strong> Эта версия маркетингового анализа (API v2) устарела. Рекомендуется использовать <router-link to="/marketing-analysis/v3" class="font-bold underline text-primary">версию V3</router-link>.
+            </Message>
+            <!-- Header (hide in embedded) -->
+            <div v-if="!embedded" class="flex flex-col gap-3 md:flex-row md:items-end md:justify-between">
+                <div class="min-w-0">
+                    <div class="flex items-center gap-2 text-[13px] text-slate-500">
+                        <i class="pi pi-chart-line"></i>
+                        <span>Маркетинг</span>
+                        <i class="pi pi-angle-right text-[11px]"></i>
+                        <span class="font-medium text-slate-700">Маркетинговый анализ</span>
+                    </div>
+                    <h1 class="mt-1 text-2xl md:text-3xl font-semibold text-slate-900 truncate">
+                        {{ report?.report_title || 'Маркетинговый анализ' }}
+                    </h1>
+                </div>
+            </div>
+
+            <!-- Generate (API v2) (hide in embedded) -->
+            <div v-if="!embedded" class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-5 relative overflow-hidden">
+                <div
+                    class="absolute inset-0 pointer-events-none opacity-[0.10]"
+                    style="background: radial-gradient(900px 260px at 10% 0%, rgba(91, 137, 255, 0.3), transparent), radial-gradient(900px 260px at 90% 0%, rgba(255, 142, 79, 0.28), transparent)"
+                ></div>
+
+                <div class="relative flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
+                    <div>
+                        <div class="text-[16px] font-semibold text-slate-800">Параметры анализа (API v2)</div>
+                        <div class="text-[12px] text-slate-500 mt-0.5">Заполните поля и нажмите Generate — мок-данные не используются.</div>
+                    </div>
+                    <div class="flex items-center gap-2">
+                        <Button icon="pi pi-sparkles" label="Generate" :loading="loading" :disabled="loading" @click="loadAnalysisV2" />
+                        <Button severity="secondary" outlined icon="pi pi-trash" label="Reset" :disabled="loading" @click="resetDashboard" />
+                    </div>
+                </div>
+
+                <div class="relative mt-4 grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-6">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Ниша бизнеса</label>
+                        <InputText v-model="formData.businessNiche" class="w-full" placeholder="Например: стоматология, фитнес, недвижимость" />
+                    </div>
+                    <div class="col-span-12 md:col-span-6">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Продукт / услуга</label>
+                        <InputText v-model="formData.product" class="w-full" placeholder="Например: имплантация зубов, абонемент, аренда" />
+                    </div>
+
+                    <div class="col-span-12 md:col-span-6">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Регионы</label>
+                        <MultiSelect v-model="formData.region" :options="REGION_OPTIONS" class="w-full" placeholder="Выберите регионы" display="chip" />
+                    </div>
+                    <div class="col-span-12 md:col-span-6">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Уровень детализации</label>
+                        <Dropdown v-model="formData.detailLevel" :options="DETAIL_LEVEL_OPTIONS" class="w-full" placeholder="Выберите" />
+                    </div>
+
+                    <div class="col-span-12">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Тип анализа</label>
+                        <MultiSelect v-model="formData.analysisType" :options="ANALYSIS_TYPE_OPTIONS" class="w-full" placeholder="Выберите типы" display="chip" />
+                    </div>
+
+                    <div class="col-span-12 md:col-span-4">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">ЦА: гендер</label>
+                        <MultiSelect v-model="formData.targetAudience.genders" :options="GENDER_OPTIONS" class="w-full" placeholder="Выберите" display="chip" />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">ЦА: возраст</label>
+                        <MultiSelect v-model="formData.targetAudience.ageRanges" :options="AGE_RANGE_OPTIONS" class="w-full" placeholder="Выберите" display="chip" />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">ЦА: тип</label>
+                        <MultiSelect v-model="formData.targetAudience.types" :options="AUDIENCE_TYPE_OPTIONS" class="w-full" placeholder="Выберите" display="chip" />
+                    </div>
+
+                    <div class="col-span-12">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Цель на 6–12 месяцев</label>
+                        <Textarea v-model="formData.goal" class="w-full" autoResize rows="2" placeholder="Например: увеличить заявки, снизить CAC, выйти в новый регион" />
+                    </div>
+
+                    <div class="col-span-12 md:col-span-6">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Сильная сторона (опционально)</label>
+                        <InputText v-model="formData.strongSide" class="w-full" placeholder="Например: лучший сервис, гарантия, цена" />
+                    </div>
+                    <div class="col-span-12 md:col-span-6">
+                        <label class="block text-[12px] font-semibold text-slate-600 mb-1">Слабая сторона (опционально)</label>
+                        <InputText v-model="formData.weakSide" class="w-full" placeholder="Например: слабый сайт, мало отзывов, низкая скорость обработки" />
+                    </div>
+                </div>
+
+                <div v-if="error" class="relative mt-4">
+                    <Message severity="error" class="api-error" :closable="false">{{ error }}</Message>
+                </div>
+
+                <div v-if="loading" class="absolute inset-0 bg-white/65 backdrop-blur-[1px] flex items-center justify-center">
+                    <ProgressSpinner size="48" />
+                </div>
+            </div>
+
+            <!-- Embedded loading / error -->
+            <div v-if="embedded && !report && loading" class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-6 text-center">
+                <ProgressSpinner size="48" />
+                <div class="mt-3 text-[13px] text-slate-600">Загружаем v2 отчёт…</div>
+            </div>
+            <div v-if="embedded && error" class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                <Message severity="error" class="api-error" :closable="false">{{ error }}</Message>
+            </div>
+
+            <div v-if="!embedded && !report && !loading" class="rounded-2xl border border-dashed border-slate-300 bg-white/60 p-8 text-center text-slate-600">
+                <div class="text-[15px] font-semibold text-slate-800">Данные ещё не загружены</div>
+                <div class="mt-2 text-[13px]">Заполните параметры сверху и нажмите <span class="font-semibold">Generate</span>, чтобы получить отчёт из API v2.</div>
+            </div>
+
+            <!-- Slide: Обзор рынка -->
+            <section v-if="report" class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.market_overview?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Индекс онлайн-спроса"
+                            :value="marketDemandIndexValue"
+                            :subtitle="marketPotentialSubtitle"
+                            icon="pi-search"
+                            :accentColor="PPT_BLUE"
+                            description="Коэффициент востребованности в сети (отношение текущего спроса к базисному). Показывает, насколько активен спрос на ваш продукт/услугу в цифровых каналах."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Темп изменения спроса"
+                            :value="marketYoYGrowthValue"
+                            subtitle="рост за год"
+                            icon="pi-arrow-up-right"
+                            :accentColor="PPT_ORANGE"
+                            description="Процент роста спроса по сравнению с прошлым годом. Положительное значение означает рост интереса к продукту/услуге."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Коэффициент сезонности"
+                            :value="marketSeasonalityValue"
+                            :subtitle="`диапазон ${seasonalityRangeValue}`"
+                            icon="pi-calendar"
+                            :accentColor="PPT_GREEN"
+                            description="Индекс активности спроса в весенний период. Например, 1.15x означает рост на 15% выше среднего. Помогает планировать маркетинговые кампании с учетом сезонности."
+                        />
+                    </div>
+
+                    <div class="col-span-12 lg:col-span-8">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                            <div class="flex items-center justify-between gap-3 mb-3">
+                                <div class="flex items-center gap-1.5">
+                                    <div class="text-[16px] font-semibold text-slate-800">Динамика онлайн-спроса</div>
+                                    <i
+                                        class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                        v-tooltip.top="'Массив числовых значений интереса по конкретным месяцам. Показывает сезонные колебания спроса и помогает планировать рекламные кампании.'"
+                                    ></i>
+                                </div>
+                                <div class="text-[14px] font-semibold text-green-700">{{ marketYoYGrowthValue }}</div>
+                            </div>
+                            <div class="h-[260px]">
+                                <Chart type="line" :data="marketDynamicsLineData" :options="marketDynamicsLineOptions" :plugins="barPlugins" />
+                            </div>
+                            <!-- <div class="mt-4 pt-4 border-t border-slate-200/70">
+                                <div class="overflow-hidden rounded-xl border border-slate-200/70">
+                                    <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
+                                        <div class="col-span-8 px-3 py-2">Месяц</div>
+                                        <div class="col-span-4 px-3 py-2 text-right">Индекс</div>
+                                    </div>
+                                    <div class="divide-y divide-slate-200/70">
+                                        <div v-for="row in marketDynamicsTableRows" :key="row.label" class="grid grid-cols-12 px-3 py-2.5">
+                                            <div class="col-span-8 text-[13px] text-slate-800">{{ row.label }}</div>
+                                            <div class="col-span-4 text-[13px] text-slate-800 text-right">{{ row.value }}</div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div> -->
+                        </div>
+                    </div>
+
+                    <div class="col-span-12 lg:col-span-4">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-[315px] flex flex-col">
+                            <div class="flex items-center gap-1.5 mb-3">
+                                <div class="text-[16px] font-semibold text-slate-800">География онлайн-интереса за год</div>
+                                <i
+                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                    v-tooltip.top="'Список приоритетных регионов, где зафиксирован наибольший спрос. Помогает определить географию для фокусировки маркетинговых усилий.'"
+                                ></i>
+                            </div>
+                            <div v-if="geographyRows.length > 0" class="space-y-3 flex-1 flex flex-col min-h-0">
+                                <div class="flex-1 overflow-y-auto rounded-xl border border-slate-200/70" style="scrollbar-width: thin; scrollbar-color: rgb(203 213 225) rgb(241 245 249)">
+                                    <div class="divide-y divide-slate-200/70">
+                                        <div v-for="(row, idx) in geographyRows" :key="row.city" class="px-4 py-3">
+                                            <div class="flex items-center justify-between gap-3 mb-2">
+                                                <div class="flex items-center gap-2">
+                                                    <div class="h-2 w-2 rounded-full" :style="{ background: getGeographyColor(row.percentage, idx) }"></div>
+                                                    <div class="text-[14px] font-medium text-slate-800">{{ row.city }}</div>
+                                                </div>
+                                                <div class="text-[14px] font-semibold text-slate-800">{{ row.value }}</div>
+                                            </div>
+                                            <div class="h-2.5 rounded-full bg-slate-200/70 overflow-hidden">
+                                                <div
+                                                    class="h-full rounded-full transition-all duration-500"
+                                                    :style="{
+                                                        width: `${row.percentage}%`,
+                                                        background: getGeographyGradient(row.percentage, idx)
+                                                    }"
+                                                ></div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="flex items-center justify-center gap-3 text-[12px] text-slate-500 flex-shrink-0">
+                                    <span class="inline-flex items-center gap-2">
+                                        <span class="h-2.5 w-10 rounded-full" style="background: linear-gradient(90deg, #ff8e4f, #52c41a)"></span>
+                                        <span>Высокий → Низкий</span>
+                                    </span>
+                                </div>
+                            </div>
+                            <div v-else class="flex-1 flex items-center justify-center rounded-xl border border-dashed border-slate-300 bg-slate-50/70 px-4 py-6 text-center text-slate-500">
+                                <div class="text-sm">Нет данных</div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.market_overview?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Целевая аудитория -->
+            <section class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.target_audience?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Размер аудитории"
+                            :value="audienceTotalValue"
+                            subtitle="высокий онлайн-потенциал"
+                            icon="pi-users"
+                            :accentColor="PPT_BLUE"
+                            description="Оценочное количество потенциальных клиентов в выбранных регионах. Помогает оценить масштаб рынка и потенциал для роста."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Лидирующий сегмент"
+                            :value="audienceLeadingSegmentValue"
+                            subtitle="рост за год"
+                            icon="pi-user"
+                            :accentColor="PPT_ORANGE"
+                            description="Название самого активного или многочисленного сегмента. Показывает, на какую группу потребителей стоит фокусировать маркетинговый бюджет."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Доход"
+                            :value="audienceIncomeAboveAvgText"
+                            subtitle="доход выше среднего"
+                            icon="pi-wallet"
+                            :accentColor="PPT_GREEN"
+                            description="Процент аудитории с уровнем дохода «выше среднего». Показывает платёжеспособность целевой аудитории."
+                        />
+                    </div>
+
+                    <div class="col-span-12">
+                        <div class="grid grid-cols-12 gap-4">
+                            <div class="col-span-12 lg:col-span-6">
+                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                                    <div class="flex items-center gap-1.5 mb-2">
+                                        <div class="text-[16px] font-semibold text-slate-800">Возрастная структура</div>
+                                        <i
+                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                            v-tooltip.top="'Процентное распределение аудитории по возрастным категориям (от 18 до 55+). Помогает адаптировать рекламные сообщения под возрастные группы.'"
+                                        ></i>
+                                    </div>
+                                    <div class="h-[240px]">
+                                        <Chart type="bar" :data="ageBarData" :options="compactBarOptions" :plugins="barPlugins" />
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-span-12 lg:col-span-6">
+                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                                    <div class="flex items-center gap-1.5 mb-2">
+                                        <div class="text-[16px] font-semibold text-slate-800">Доход и платёжеспособность</div>
+                                        <i
+                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                            v-tooltip.top="'Распределение аудитории по уровню дохода. Показывает, какая доля аудитории имеет доход выше среднего и может позволить себе ваш продукт/услугу.'"
+                                        ></i>
+                                    </div>
+                                    <div class="h-[220px]">
+                                        <Chart type="bar" :data="incomeBarData" :options="compactBarOptions" :plugins="barPlugins" />
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div v-if="segmentRows.length > 0" class="col-span-12">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                            <div class="flex items-center gap-1.5 mb-2">
+                                <div class="text-[16px] font-semibold text-slate-800">Сегменты аудитории</div>
+                                <i
+                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                    v-tooltip.top="'Распределение аудитории по поведенческим сегментам. Помогает понять, какие группы клиентов доминируют и как их приоритизировать.'"
+                                ></i>
+                            </div>
+                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
+                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
+                                    <div class="col-span-7 px-3 py-2">Сегмент</div>
+                                    <div class="col-span-5 px-3 py-2 text-right">Доля</div>
+                                </div>
+                                <div class="divide-y divide-slate-200/70">
+                                    <div v-for="row in segmentRows" :key="row.name" class="grid grid-cols-12 px-3 py-2.5">
+                                        <div class="col-span-7 text-[13px] text-slate-800">{{ row.name }}</div>
+                                        <div class="col-span-5 text-[13px] text-slate-800 text-right">{{ row.shareLabel }}</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.target_audience?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Конкурентная среда -->
+            <section class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.competitive_environment?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Доля ключевого конкурента на рынке"
+                            :value="competitionMarketShareValue"
+                            :subtitle="competitionLeaderSubtitle"
+                            icon="pi-sitemap"
+                            :accentColor="PPT_BLUE"
+                            description="Оценочная доля онлайн-трафика, которую занимает текущий бизнес. Показывает вашу позицию на рынке относительно общего объема трафика в нише."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard :title="competitionRankTitle" :value="competitionRankValue" subtitle="" icon="pi-chart-bar" :accentColor="PPT_GREEN" :description="competitionRankDescription" />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard :title="competitionAdPressureTitle" :value="competitionCompetitorShareValue" :subtitle="competitionAdPressureSubtitle" icon="pi-wallet" :accentColor="PPT_ORANGE" :description="competitionAdPressureDescription" />
+                    </div>
+
+                    <div class="col-span-12 lg:col-span-7">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                            <div class="flex items-center justify-between gap-3 mb-2">
+                                <div class="flex items-center gap-1.5">
+                                    <div class="text-[16px] font-semibold text-slate-800">Digital-видимость: топ конкурентов</div>
+                                    <i
+                                        class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                        v-tooltip.top="'Сравнительный индекс видимости (баллы от 0 до 100) для вашего бизнеса и конкурентов. Показывает, насколько хорошо вы заметны в цифровых каналах по сравнению с конкурентами.'"
+                                    ></i>
+                                </div>
+                                <div class="text-[12px] text-slate-500">Бенчмарк</div>
+                            </div>
+                            <div class="h-[280px]">
+                                <Chart type="bar" :data="visibilityBarData" :options="visibilityBarOptions" :plugins="barPlugins" />
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-span-12 lg:col-span-5">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                            <div class="flex items-center gap-1.5 mb-3">
+                                <div class="text-[16px] font-semibold text-slate-800">Ключевые сильные стороны основных конкурентов</div>
+                                <i
+                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                    v-tooltip.top="'Список конкретных преимуществ для каждого игрока рынка (включая ваш бизнес). Помогает понять конкурентные преимущества и слабые места.'"
+                                ></i>
+                            </div>
+                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
+                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
+                                    <div class="col-span-5 px-3 py-2">Конкурент</div>
+                                    <div class="col-span-7 px-3 py-2">Бенчмарк (Астана)</div>
+                                </div>
+                                <div class="divide-y divide-slate-200/70">
+                                    <div v-for="row in competitionStrengthRows" :key="row.label" class="grid grid-cols-12 px-3 py-3">
+                                        <div class="col-span-5 text-[14px] text-slate-800">{{ row.label }}</div>
+                                        <div class="col-span-7 text-[13px] text-slate-600">
+                                            <span v-if="row.strengths?.length">{{ row.strengths.join(', ') }}</span>
+                                            <span v-else class="text-slate-400">—</span>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.competitive_environment?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Спрос и поведение -->
+            <section class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.demand_and_behavior?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Поиск в Google"
+                            :value="behaviorSearchGrowthValue"
+                            subtitle=""
+                            icon="pi-search"
+                            :accentColor="PPT_BLUE"
+                            description="Динамика роста поисковых запросов в нише. Показывает, растет ли интерес к продукту/услуге в поисковых системах."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Взаимодействия до покупки"
+                            :value="behaviorInteractionsValue"
+                            subtitle=""
+                            icon="pi-send"
+                            :accentColor="PPT_ORANGE"
+                            description="Среднее количество касаний (визитов, кликов), необходимых клиенту для принятия решения. Помогает понять длину пути клиента и необходимое количество контактов."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Вероятность повторного отказа"
+                            :value="behaviorRepeatRefusalValue"
+                            subtitle=""
+                            icon="pi-refresh"
+                            :accentColor="PPT_GREEN"
+                            description="Вероятность того, что клиент не вернется после первого опыта. Высокое значение указывает на проблемы с качеством сервиса или продукта."
+                        />
+                    </div>
+
+                    <div class="col-span-12 lg:col-span-5">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                            <div class="flex items-center gap-1.5 mb-2">
+                                <div class="text-[16px] font-semibold text-slate-800">Типы поисковых запросов</div>
+                                <i
+                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                    v-tooltip.top="'Структура запросов: каталожные, информационные, брендовые. Показывает, как пользователи ищут ваш продукт/услугу и какие типы контента им нужны.'"
+                                ></i>
+                            </div>
+                            <div class="h-[260px]">
+                                <Chart type="doughnut" :data="queryTypesDonutData" :options="queryTypesDonutOptions" :plugins="donutPlugins" />
+                            </div>
+                            <!-- Метрики под диаграммой -->
+                            <div v-if="queryTypesMetrics.length > 0" class="mt-4 pt-4 border-t border-slate-200/70">
+                                <div class="grid grid-cols-2 gap-3">
+                                    <div v-for="metric in queryTypesMetrics" :key="metric.label" class="flex items-center gap-2">
+                                        <div class="h-3 w-3 rounded-full" :style="{ background: metric.color }"></div>
+                                        <div class="flex-1 min-w-0">
+                                            <div class="text-[12px] text-slate-600 truncate">{{ metric.label }}</div>
+                                        </div>
+                                        <div class="text-[13px] font-semibold text-slate-800 whitespace-nowrap">{{ metric.value }}%</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-span-12 lg:col-span-7">
+                        <div class="grid grid-cols-12 gap-4">
+                            <div class="col-span-12">
+                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                                    <div class="flex items-center gap-1.5 mb-2">
+                                        <div class="text-[16px] font-semibold text-slate-800">Факторы принятия решения</div>
+                                        <i
+                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                            v-tooltip.top="'Что важнее всего для клиента при выборе: Цена, Отзывы, Сервис и т.д. Помогает понять приоритеты клиентов и адаптировать оффер.'"
+                                        ></i>
+                                    </div>
+                                    <div class="h-[220px]">
+                                        <Chart type="bar" :data="decisionFactorsBarData" :options="compactBarOptions" :plugins="barPlugins" />
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-span-12">
+                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                                    <div class="flex items-center gap-1.5 mb-2">
+                                        <div class="text-[16px] font-semibold text-slate-800">Причины отказов</div>
+                                        <i
+                                            class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                            v-tooltip.top="'Барьеры, которые мешают завершить покупку (например, «непонятный оффер», высокая цена, отсутствие отзывов). Помогает выявить и устранить препятствия на пути к конверсии.'"
+                                        ></i>
+                                    </div>
+                                    <div class="h-[200px]">
+                                        <Chart type="bar" :data="refusalReasonsBarData" :options="compactBarOptions" :plugins="barPlugins" />
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.demand_and_behavior?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Путь клиента -->
+            <section class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.customer_journey?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Конверсия лид → запись"
+                            :value="report?.sections?.customer_journey?.conversion_rates?.lead_to_booking"
+                            subtitle=""
+                            icon="pi-comments"
+                            :accentColor="PPT_BLUE"
+                            description="Процент перехода от лида к записи. Показывает эффективность работы отдела продаж на этапе конверсии лида в клиента."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Конверсия запись → оплата"
+                            :value="report?.sections?.customer_journey?.conversion_rates?.booking_to_payment"
+                            subtitle=""
+                            icon="pi-comment"
+                            :accentColor="PPT_ORANGE"
+                            description="Процент перехода от записи к оплате. Показывает, сколько клиентов, сделавших запись, завершают покупку."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Конверсия лид → оплата"
+                            :value="report?.sections?.customer_journey?.conversion_rates?.lead_to_payment_total"
+                            subtitle=""
+                            icon="pi-wallet"
+                            :accentColor="PPT_ORANGE"
+                            description="Общая конверсия от лида до оплаты. Показывает эффективность всей воронки продаж от первого контакта до завершения сделки."
+                        />
+                    </div>
+
+                    <div class="col-span-12">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                            <div class="flex items-center gap-1.5 mb-2">
+                                <div class="text-[16px] font-semibold text-slate-800">Воронка продаж</div>
+                                <i
+                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                    v-tooltip.top="'Абсолютные показатели воронки: сколько человек пришло с рекламы, сколько стали лидами, сколько купили. Визуализирует потери клиентов на каждом этапе.'"
+                                ></i>
+                            </div>
+                            <div class="h-[320px]">
+                                <Chart type="bar" :data="funnelBarData" :options="funnelBarOptions" :plugins="barPlugins" />
+                            </div>
+                        </div>
+                    </div>
+
+                    <div v-if="funnelBottleneckRows.length > 0" class="col-span-12">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                            <div class="flex items-center gap-1.5 mb-2">
+                                <div class="text-[16px] font-semibold text-slate-800">Узкие места воронки</div>
+                                <i class="pi pi-question-circle text-[12px] text-slate-400 cursor-help" v-tooltip.top="'Этапы, где теряется больше всего клиентов, и основные причины отказа.'"></i>
+                            </div>
+                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
+                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
+                                    <div class="col-span-4 px-3 py-2">Этап</div>
+                                    <div class="col-span-8 px-3 py-2">Причина</div>
+                                </div>
+                                <div class="divide-y divide-slate-200/70">
+                                    <div v-for="row in funnelBottleneckRows" :key="row.key" class="grid grid-cols-12 px-3 py-2.5">
+                                        <div class="col-span-4 text-[13px] text-slate-800">{{ row.stage }}</div>
+                                        <div class="col-span-8 text-[13px] text-slate-600">{{ row.reason }}</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.customer_journey?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Каналы привлечения -->
+            <section class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.acquisition_channels?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Доля поискового трафика"
+                            :value="channelsSearchShareValue"
+                            subtitle=""
+                            icon="pi-search"
+                            :accentColor="PPT_BLUE"
+                            description="Процент клиентов, приходящих из поисковых систем. Показывает важность SEO и контекстной рекламы для вашего бизнеса."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Средняя стоимость лида"
+                            :value="channelsLeadCostValue"
+                            subtitle=""
+                            icon="pi-chart-bar"
+                            :accentColor="PPT_GREEN"
+                            description="Средняя стоимость одного лида (CPL) в валюте региона. Помогает оценить эффективность инвестиций в маркетинг и сравнить каналы."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Потенциал каналов к росту"
+                            :value="channelsGrowthPotentialValue"
+                            subtitle=""
+                            icon="pi-arrow-up-right"
+                            :accentColor="PPT_ORANGE"
+                            description="Оценка возможности роста в различных каналах привлечения. Помогает определить, в какие каналы стоит инвестировать больше."
+                        />
+                    </div>
+
+                    <div class="col-span-12">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                            <div class="flex items-center gap-1.5 mb-2">
+                                <div class="text-[16px] font-semibold text-slate-800">Доли каналов</div>
+                                <i class="pi pi-question-circle text-[12px] text-slate-400 cursor-help" v-tooltip.top="'Распределение долей трафика по каналам. Помогает понять, какие каналы дают основной вклад в привлечение клиентов.'"></i>
+                            </div>
+                            <div class="h-[240px]">
+                                <Chart v-if="channelSharesBarData.labels.length > 0" type="bar" :data="channelSharesBarData" :options="channelSharesBarOptions" :plugins="barPlugins" />
+                                <div v-else class="h-full flex items-center justify-center text-slate-500 text-[13px]">Нет данных по долям каналов</div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.acquisition_channels?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Экономика маркетинга -->
+            <section class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.marketing_economics?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Стоимость клиента"
+                            :value="cacValue"
+                            subtitle=""
+                            icon="pi-wallet"
+                            :accentColor="PPT_BLUE"
+                            description="Стоимость привлечения одного платящего клиента (CAC). Рассчитывается как отношение маркетинговых расходов к количеству новых клиентов. Показывает эффективность маркетинговых инвестиций."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Конверсия в повторные продажи"
+                            :value="repeatSalesConversionValue"
+                            subtitle=""
+                            icon="pi-refresh"
+                            :accentColor="PPT_GREEN"
+                            description="Доля клиентов, совершающих вторую и последующие покупки. Показывает эффективность удержания клиентов и потенциал для увеличения LTV (lifetime value)."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Возврат инвестиций в маркетинг"
+                            :value="roiValue"
+                            subtitle=""
+                            icon="pi-chart-line"
+                            :accentColor="PPT_ORANGE"
+                            description="Коэффициент возврата инвестиций (ROI). Показывает, во сколько раз выручка превышает вложения в маркетинг. Рассчитывается как (Прибыль / Инвестиции) × 100%."
+                        />
+                    </div>
+
+                    <div class="col-span-12">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                            <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-3">
+                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
+                                    <div class="flex items-center gap-1.5">
+                                        <div class="text-[12px] font-semibold text-slate-500">CAC</div>
+                                        <i
+                                            class="pi pi-question-circle text-[10px] text-slate-400 cursor-help"
+                                            v-tooltip.top="'Customer Acquisition Cost - стоимость привлечения одного нового клиента. Рассчитывается как: Маркетинговые расходы / Количество новых клиентов.'"
+                                        ></i>
+                                    </div>
+                                    <div class="mt-2 katex-box" v-html="cacKatex"></div>
+                                    <div class="mt-2 text-[12px] text-slate-600">
+                                        Значение: <span class="font-semibold text-slate-800">{{ cacValue }}</span>
+                                    </div>
+                                </div>
+                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
+                                    <div class="flex items-center gap-1.5">
+                                        <div class="text-[12px] font-semibold text-slate-500">ROI</div>
+                                        <i
+                                            class="pi pi-question-circle text-[10px] text-slate-400 cursor-help"
+                                            v-tooltip.top="'Return on Investment - возврат инвестиций. Рассчитывается как: (Прибыль / Инвестиции) × 100%. Показывает эффективность маркетинговых вложений.'"
+                                        ></i>
+                                    </div>
+                                    <div class="mt-2 katex-box" v-html="roiKatex"></div>
+                                    <div class="mt-2 text-[12px] text-slate-600">
+                                        Значение: <span class="font-semibold text-slate-800">{{ roiValue }}</span>
+                                    </div>
+                                </div>
+                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
+                                    <div class="text-[12px] font-semibold text-slate-500">Расходы на маркетинг</div>
+                                    <div class="mt-2 text-[16px] font-semibold text-slate-900">{{ report?.sections?.marketing_economics?.financial_performance?.marketing_expenses?.month }}</div>
+                                    <div class="text-[12px] text-slate-600">в месяц · {{ report?.sections?.marketing_economics?.financial_performance?.marketing_expenses?.year }} в год</div>
+                                </div>
+                                <div class="rounded-xl border border-slate-200/70 bg-slate-50/70 p-3">
+                                    <div class="text-[12px] font-semibold text-slate-500">Клиенты</div>
+                                    <div class="mt-2 text-[16px] font-semibold text-slate-900">{{ report?.sections?.marketing_economics?.financial_performance?.clients?.month }}</div>
+                                    <div class="text-[12px] text-slate-600">в месяц · {{ report?.sections?.marketing_economics?.financial_performance?.clients?.year }} в год</div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12 lg:col-span-7">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                            <div class="flex items-center gap-1.5 mb-3">
+                                <div class="text-[16px] font-semibold text-slate-800">Основные показатели</div>
+                                <i
+                                    class="pi pi-question-circle text-[12px] text-slate-400 cursor-help"
+                                    v-tooltip.top="'Сравнение расходов, количества клиентов, CAC, выручки и прибыли в разрезе Месяц против Год. Показывает динамику ключевых финансовых метрик.'"
+                                ></i>
+                            </div>
+                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
+                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
+                                    <div class="col-span-6 px-3 py-2">Показатель</div>
+                                    <div class="col-span-3 px-3 py-2 text-center">Месяц</div>
+                                    <div class="col-span-3 px-3 py-2 text-center">Год</div>
+                                </div>
+                                <div class="divide-y divide-slate-200/70">
+                                    <div v-for="row in economicsPerformanceRows" :key="row.key" class="grid grid-cols-12 px-3 py-3">
+                                        <div class="col-span-6 text-[13px] text-slate-800">{{ row.label }}</div>
+                                        <div class="col-span-3 text-[13px] text-slate-800 text-center">{{ row.month }}</div>
+                                        <div class="col-span-3 text-[13px] text-slate-800 text-center">{{ row.year }}</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-span-12 lg:col-span-5">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                            <div class="text-[16px] font-semibold text-slate-800 mb-3">Процесс повторения</div>
+                            <div class="overflow-hidden rounded-xl border border-slate-200/70">
+                                <div class="grid grid-cols-12 bg-slate-50 text-[12px] font-semibold text-slate-600">
+                                    <div class="col-span-6 px-3 py-2">Этап</div>
+                                    <div class="col-span-3 px-3 py-2 text-center">Стоимость</div>
+                                    <div class="col-span-3 px-3 py-2">Эффективность</div>
+                                </div>
+                                <div class="divide-y divide-slate-200/70">
+                                    <div v-for="row in channelEfficiencyRows" :key="`econ-${row.key}`" class="grid grid-cols-12 px-3 py-3 items-center">
+                                        <div class="col-span-6 text-[13px] text-slate-800">{{ row.label }}</div>
+                                        <div class="col-span-3 text-[13px] text-slate-800 text-center">{{ row.cost }}</div>
+                                        <div class="col-span-3 text-[13px]" :class="row.statusClass">{{ row.status }}</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.marketing_economics?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Проблемы и узкие места -->
+            <section class="space-y-3">
+                <div class="text-2xl font-semibold text-slate-900">{{ report?.sections?.bottlenecks?.title }}</div>
+
+                <div class="grid grid-cols-12 gap-4">
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Проблемы на лендингах"
+                            :value="bottlenecksLandingIssuesValue"
+                            subtitle=""
+                            icon="pi-exclamation-triangle"
+                            :accentColor="PPT_BLUE"
+                            description="Процентное влияние проблем на лендингах (сайтах). Показывает, насколько сильно проблемы с сайтом мешают конверсии клиентов."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Медленные ответы менеджеров"
+                            :value="bottlenecksSlowResponsesValue"
+                            subtitle=""
+                            icon="pi-refresh"
+                            :accentColor="PPT_GREEN"
+                            description="Процентное влияние медленных ответов менеджеров на потери клиентов. Показывает важность скорости обработки лидов отделом продаж."
+                        />
+                    </div>
+                    <div class="col-span-12 md:col-span-4">
+                        <PptKpiCard
+                            title="Отказ на повторных касаниях"
+                            :value="bottlenecksRepeatRefusalValue"
+                            subtitle=""
+                            icon="pi-plus"
+                            :accentColor="PPT_ORANGE"
+                            description="Процентное влияние проблем с удержанием клиентов. Показывает, насколько сильно проблемы с ретеншном мешают повторным продажам."
+                        />
+                    </div>
+
+                    <div class="col-span-12">
+                        <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4">
+                            <div class="grid grid-cols-12 gap-4">
+                                <div class="col-span-12 lg:col-span-4">
+                                    <div class="rounded-2xl border border-slate-200/70 bg-white p-4 h-full">
+                                        <div class="flex items-center gap-2 mb-3">
+                                            <div class="h-8 w-8 rounded-xl flex items-center justify-center" :style="{ background: 'rgba(91,137,255,0.14)', color: PPT_BLUE }">
+                                                <i class="pi pi-cog"></i>
+                                            </div>
+                                            <div class="flex items-center gap-1.5">
+                                                <div class="text-[15px] font-semibold text-slate-800">Лендинг</div>
+                                                <i
+                                                    class="pi pi-question-circle text-[11px] text-slate-400 cursor-help"
+                                                    v-tooltip.top="'Конкретные списки недоработок на сайте/лендинге. Показывает проблемы, которые мешают конверсии посетителей в клиентов.'"
+                                                ></i>
+                                            </div>
+                                        </div>
+                                        <ul class="list-disc pl-5 space-y-2 text-[13px] text-slate-600">
+                                            <li v-for="t in bottlenecksDetails.landing" :key="t">{{ t }}</li>
+                                        </ul>
+                                    </div>
+                                </div>
+                                <div class="col-span-12 lg:col-span-4">
+                                    <div class="rounded-2xl border border-slate-200/70 bg-white p-4 h-full">
+                                        <div class="flex items-center gap-2 mb-3">
+                                            <div class="h-8 w-8 rounded-xl flex items-center justify-center" :style="{ background: 'rgba(255,142,79,0.16)', color: PPT_ORANGE }">
+                                                <i class="pi pi-clock"></i>
+                                            </div>
+                                            <div class="flex items-center gap-1.5">
+                                                <div class="text-[15px] font-semibold text-slate-800">Работа с лидами</div>
+                                                <i
+                                                    class="pi pi-question-circle text-[11px] text-slate-400 cursor-help"
+                                                    v-tooltip.top="'Конкретные списки недоработок в отделе продаж (Lead Management). Показывает проблемы в обработке лидов и работе с потенциальными клиентами.'"
+                                                ></i>
+                                            </div>
+                                        </div>
+                                        <ul class="list-disc pl-5 space-y-2 text-[13px] text-slate-600">
+                                            <li v-for="t in bottlenecksDetails.lead_management" :key="t">{{ t }}</li>
+                                        </ul>
+                                    </div>
+                                </div>
+                                <div class="col-span-12 lg:col-span-4">
+                                    <div class="rounded-2xl border border-slate-200/70 bg-white p-4 h-full">
+                                        <div class="flex items-center gap-2 mb-3">
+                                            <div class="h-8 w-8 rounded-xl flex items-center justify-center" :style="{ background: 'rgba(255,107,107,0.14)', color: '#FF6B6B' }">
+                                                <i class="pi pi-chart-pie"></i>
+                                            </div>
+                                            <div class="flex items-center gap-1.5">
+                                                <div class="text-[15px] font-semibold text-slate-800">Ретеншн</div>
+                                                <i
+                                                    class="pi pi-question-circle text-[11px] text-slate-400 cursor-help"
+                                                    v-tooltip.top="'Конкретные списки недоработок в удержании клиентов (Retention). Показывает проблемы, которые мешают повторным покупкам и долгосрочным отношениям с клиентами.'"
+                                                ></i>
+                                            </div>
+                                        </div>
+                                        <ul class="list-disc pl-5 space-y-2 text-[13px] text-slate-600">
+                                            <li v-for="t in bottlenecksDetails.retention" :key="t">{{ t }}</li>
+                                        </ul>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-span-12">
+                        <PptConclusionBox :text="report?.sections?.bottlenecks?.conclusion" />
+                    </div>
+                </div>
+            </section>
+
+            <!-- Slide: Рекомендации -->
+            <section class="space-y-3">
+                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-6">
+                    <div class="text-[13px] text-slate-500 mb-1">Маркетинг <span class="mx-1">›</span> Рекомендации</div>
+                    <div class="flex items-center justify-center gap-2">
+                        <div class="text-3xl font-semibold tracking-wide text-center text-slate-800">РЕКОМЕНДАЦИИ</div>
+                        <i
+                            class="pi pi-question-circle text-[14px] text-slate-400 cursor-help"
+                            v-tooltip.top="
+                                'Массив ключевых стратегий развития. Каждая содержит название направления (например, «Оптимизация сайта») и конкретное описание действий для реализации. Финальный прогноз эффективности при условии внедрения рекомендаций.'
+                            "
+                        ></i>
+                    </div>
+                    <div class="text-center text-slate-500 text-sm mt-1">итоги маркетингового анализа для интернет-продвижения</div>
+
+                    <div class="mt-6 grid grid-cols-12 gap-4">
+                        <div class="col-span-12 md:col-span-4">
+                            <PptKpiCard
+                                title="Стоимость клиента"
+                                :value="cacValue"
+                                subtitle=""
+                                icon="pi-wallet"
+                                :accentColor="PPT_BLUE"
+                                description="Стоимость привлечения одного платящего клиента (CAC). Рассчитывается как отношение маркетинговых расходов к количеству новых клиентов."
+                            />
+                        </div>
+                        <div class="col-span-12 md:col-span-4">
+                            <PptKpiCard
+                                title="Конверсия в повторные продажи"
+                                :value="repeatSalesConversionValue"
+                                subtitle=""
+                                icon="pi-refresh"
+                                :accentColor="PPT_GREEN"
+                                description="Доля клиентов, совершающих вторую и последующие покупки. Показывает эффективность удержания клиентов."
+                            />
+                        </div>
+                        <div class="col-span-12 md:col-span-4">
+                            <PptKpiCard
+                                title="Возврат инвестиций"
+                                :value="roiValue"
+                                subtitle=""
+                                icon="pi-chart-line"
+                                :accentColor="PPT_ORANGE"
+                                description="Коэффициент возврата инвестиций (ROI). Показывает, во сколько раз выручка превышает вложения в маркетинг."
+                            />
+                        </div>
+
+                        <div class="col-span-12 grid grid-cols-12 gap-4">
+                            <div v-for="(r, idx) in recommendationMessages" :key="r.key" class="col-span-12 md:col-span-6 xl:col-span-3">
+                                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 h-full">
+                                    <div class="flex items-start gap-3">
+                                        <div
+                                            class="h-10 w-10 rounded-xl flex items-center justify-center border border-slate-200/70"
+                                            :style="{
+                                                background: idx === 0 ? 'rgba(91,137,255,0.14)' : idx === 1 ? 'rgba(82,196,26,0.14)' : idx === 2 ? 'rgba(255,142,79,0.14)' : 'rgba(91,137,255,0.10)',
+                                                color: idx === 1 ? PPT_GREEN : idx === 2 ? PPT_ORANGE : PPT_BLUE
+                                            }"
+                                        >
+                                            <i class="pi" :class="idx === 0 ? 'pi-bullseye' : idx === 1 ? 'pi-comments' : idx === 2 ? 'pi-star' : 'pi-chart-line'"></i>
+                                        </div>
+                                        <div class="min-w-0">
+                                            <div class="text-[15px] font-semibold text-slate-800">{{ r.strategy }}</div>
+                                            <div class="mt-2 text-[13px] leading-snug text-slate-600">{{ r.action }}</div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="col-span-12">
+                            <PptConclusionBox :text="report?.sections?.recommendations?.conclusion" />
+                        </div>
+                    </div>
+                </div>
+            </section>
+
+            <!-- Источники -->
+            <section class="space-y-3">
+                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-6">
+                    <div class="text-[13px] text-slate-500 mb-1">Маркетинг <span class="mx-1">›</span> Источники</div>
+                    <div class="flex items-center justify-center gap-2">
+                        <div class="text-3xl font-semibold tracking-wide text-center text-slate-800">ИСТОЧНИКИ</div>
+                        <i class="pi pi-info-circle text-[14px] text-slate-400 cursor-help" v-tooltip.top="'Список источников данных, использованных при подготовке маркетингового анализа'"></i>
+                    </div>
+                    <div class="text-center text-slate-500 text-sm mt-1">список источников данных для анализа</div>
+
+                    <div class="mt-6">
+                        <template v-if="report?.sources && Array.isArray(report.sources) && report.sources.length > 0">
+                            <div class="space-y-3">
+                                <div v-for="(source, index) in report.sources" :key="index" class="flex items-start gap-3 p-3 rounded-xl border border-slate-200/60 hover:bg-slate-50/50 transition-colors">
+                                    <div class="h-8 w-8 rounded-lg flex items-center justify-center border border-slate-200/70 bg-slate-50/50 flex-shrink-0">
+                                        <i class="pi pi-link text-slate-500 text-sm"></i>
+                                    </div>
+                                    <a :href="source" target="_blank" rel="noopener noreferrer" class="text-sm text-blue-600 hover:text-blue-800 hover:underline break-all flex-1">
+                                        {{ source }}
+                                    </a>
+                                </div>
+                            </div>
+                        </template>
+                        <div v-else class="text-center text-slate-400 text-sm py-8">
+                            <i class="pi pi-info-circle mr-2"></i>
+                            Источники не найдены
+                        </div>
+                    </div>
+                </div>
+            </section>
+
+            <!-- Кнопка создания стратегии -->
+            <section v-if="report && !embedded" class="space-y-3">
+                <div class="rounded-2xl bg-white shadow-sm border border-slate-200/60 p-4 md:p-6">
+                    <div class="flex items-center justify-center">
+                        <Button label="Создать стратегию" icon="pi pi-magic" severity="success" size="large" @click="goToStrategy" />
+                    </div>
+                </div>
+            </section>
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .katex-box :deep(.katex) {
     font-size: 1.05rem;
diff --git a/src/views/pages/auth/Login.vue b/src/views/pages/auth/Login.vue
index a1f477e..181f77a 100644
--- a/src/views/pages/auth/Login.vue
+++ b/src/views/pages/auth/Login.vue
@@ -30,50 +30,50 @@ async function onSubmit() {
 
 <template>
     <FloatingConfigurator />
-    <div class="bg-surface-50 dark:bg-surface-950 flex items-center justify-center min-h-screen min-w-[100vw] overflow-hidden">
+    <div class="flex min-h-screen min-w-[100vw] items-center justify-center overflow-hidden bg-gradient-to-br from-primary-50 via-surface-0 to-purple-50 dark:from-surface-900 dark:via-surface-800 dark:to-surface-900">
         <div class="flex flex-col items-center justify-center">
-            <div style="border-radius: 56px; padding: 0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%)">
-                <div class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20" style="border-radius: 53px">
-                    <div class="text-center mb-8">
-                        <svg viewBox="0 0 54 40" fill="none" xmlns="http://www.w3.org/2000/svg" class="mb-8 w-16 shrink-0 mx-auto">
-                            <path
-                                fill-rule="evenodd"
-                                clip-rule="evenodd"
-                                d="M17.1637 19.2467C17.1566 19.4033 17.1529 19.561 17.1529 19.7194C17.1529 25.3503 21.7203 29.915 27.3546 29.915C32.9887 29.915 37.5561 25.3503 37.5561 19.7194C37.5561 19.5572 37.5524 19.3959 37.5449 19.2355C38.5617 19.0801 39.5759 18.9013 40.5867 18.6994L40.6926 18.6782C40.7191 19.0218 40.7326 19.369 40.7326 19.7194C40.7326 27.1036 34.743 33.0896 27.3546 33.0896C19.966 33.0896 13.9765 27.1036 13.9765 19.7194C13.9765 19.374 13.9896 19.0316 14.0154 18.6927L14.0486 18.6994C15.0837 18.9062 16.1223 19.0886 17.1637 19.2467ZM33.3284 11.4538C31.6493 10.2396 29.5855 9.52381 27.3546 9.52381C25.1195 9.52381 23.0524 10.2421 21.3717 11.4603C20.0078 11.3232 18.6475 11.1387 17.2933 10.907C19.7453 8.11308 23.3438 6.34921 27.3546 6.34921C31.36 6.34921 34.9543 8.10844 37.4061 10.896C36.0521 11.1292 34.692 11.3152 33.3284 11.4538ZM43.826 18.0518C43.881 18.6003 43.9091 19.1566 43.9091 19.7194C43.9091 28.8568 36.4973 36.2642 27.3546 36.2642C18.2117 36.2642 10.8 28.8568 10.8 19.7194C10.8 19.1615 10.8276 18.61 10.8816 18.0663L7.75383 17.4411C7.66775 18.1886 7.62354 18.9488 7.62354 19.7194C7.62354 30.6102 16.4574 39.4388 27.3546 39.4388C38.2517 39.4388 47.0855 30.6102 47.0855 19.7194C47.0855 18.9439 47.0407 18.1789 46.9536 17.4267L43.826 18.0518ZM44.2613 9.54743L40.9084 10.2176C37.9134 5.95821 32.9593 3.1746 27.3546 3.1746C21.7442 3.1746 16.7856 5.96385 13.7915 10.2305L10.4399 9.56057C13.892 3.83178 20.1756 0 27.3546 0C34.5281 0 40.8075 3.82591 44.2613 9.54743Z"
-                                fill="var(--primary-color)"
-                            />
-                            <mask id="mask0_1413_1551" style="mask-type: alpha" maskUnits="userSpaceOnUse" x="0" y="8" width="54" height="11">
-                                <path d="M27 18.3652C10.5114 19.1944 0 8.88892 0 8.88892C0 8.88892 16.5176 14.5866 27 14.5866C37.4824 14.5866 54 8.88892 54 8.88892C54 8.88892 43.4886 17.5361 27 18.3652Z" fill="var(--primary-color)" />
-                            </mask>
-                            <g mask="url(#mask0_1413_1551)">
-                                <path
-                                    d="M-4.673e-05 8.88887L3.73084 -1.91434L-8.00806 17.0473L-4.673e-05 8.88887ZM27 18.3652L26.4253 6.95109L27 18.3652ZM54 8.88887L61.2673 17.7127L50.2691 -1.91434L54 8.88887ZM-4.673e-05 8.88887C-8.00806 17.0473 -8.00469 17.0505 -8.00132 17.0538C-8.00018 17.055 -7.99675 17.0583 -7.9944 17.0607C-7.98963 17.0653 -7.98474 17.0701 -7.97966 17.075C-7.96949 17.0849 -7.95863 17.0955 -7.94707 17.1066C-7.92401 17.129 -7.89809 17.1539 -7.86944 17.1812C-7.8122 17.236 -7.74377 17.3005 -7.66436 17.3743C-7.50567 17.5218 -7.30269 17.7063 -7.05645 17.9221C-6.56467 18.3532 -5.89662 18.9125 -5.06089 19.5534C-3.39603 20.83 -1.02575 22.4605 1.98012 24.0457C7.97874 27.2091 16.7723 30.3226 27.5746 29.7793L26.4253 6.95109C20.7391 7.23699 16.0326 5.61231 12.6534 3.83024C10.9703 2.94267 9.68222 2.04866 8.86091 1.41888C8.45356 1.10653 8.17155 0.867278 8.0241 0.738027C7.95072 0.673671 7.91178 0.637576 7.90841 0.634492C7.90682 0.63298 7.91419 0.639805 7.93071 0.65557C7.93897 0.663455 7.94952 0.673589 7.96235 0.686039C7.96883 0.692262 7.97582 0.699075 7.98338 0.706471C7.98719 0.710167 7.99113 0.714014 7.99526 0.718014C7.99729 0.720008 8.00047 0.723119 8.00148 0.724116C8.00466 0.727265 8.00796 0.730446 -4.673e-05 8.88887ZM27.5746 29.7793C37.6904 29.2706 45.9416 26.3684 51.6602 23.6054C54.5296 22.2191 56.8064 20.8465 58.4186 19.7784C59.2265 19.2431 59.873 18.7805 60.3494 18.4257C60.5878 18.2482 60.7841 18.0971 60.9374 17.977C61.014 17.9169 61.0799 17.8645 61.1349 17.8203C61.1624 17.7981 61.1872 17.7781 61.2093 17.7602C61.2203 17.7512 61.2307 17.7427 61.2403 17.7348C61.2452 17.7308 61.2499 17.727 61.2544 17.7233C61.2566 17.7215 61.2598 17.7188 61.261 17.7179C61.2642 17.7153 61.2673 17.7127 54 8.88887C46.7326 0.0650536 46.7357 0.0625219 46.7387 0.0600241C46.7397 0.0592345 46.7427 0.0567658 46.7446 0.0551857C46.7485 0.0520238 46.7521 0.0489887 46.7557 0.0460799C46.7628 0.0402623 46.7694 0.0349487 46.7753 0.0301318C46.7871 0.0204986 46.7966 0.0128495 46.8037 0.00712562C46.818 -0.00431848 46.8228 -0.00808311 46.8184 -0.00463784C46.8096 0.00228345 46.764 0.0378652 46.6828 0.0983779C46.5199 0.219675 46.2165 0.439161 45.7812 0.727519C44.9072 1.30663 43.5257 2.14765 41.7061 3.02677C38.0469 4.79468 32.7981 6.63058 26.4253 6.95109L27.5746 29.7793ZM54 8.88887C50.2691 -1.91433 50.27 -1.91467 50.271 -1.91498C50.2712 -1.91506 50.272 -1.91535 50.2724 -1.9155C50.2733 -1.91581 50.274 -1.91602 50.2743 -1.91616C50.2752 -1.91643 50.275 -1.91636 50.2738 -1.91595C50.2714 -1.91515 50.2652 -1.91302 50.2552 -1.9096C50.2351 -1.90276 50.1999 -1.89078 50.1503 -1.874C50.0509 -1.84043 49.8938 -1.78773 49.6844 -1.71863C49.2652 -1.58031 48.6387 -1.377 47.8481 -1.13035C46.2609 -0.635237 44.0427 0.0249875 41.5325 0.6823C36.215 2.07471 30.6736 3.15796 27 3.15796V26.0151C33.8087 26.0151 41.7672 24.2495 47.3292 22.7931C50.2586 22.026 52.825 21.2618 54.6625 20.6886C55.5842 20.4011 56.33 20.1593 56.8551 19.986C57.1178 19.8993 57.3258 19.8296 57.4735 19.7797C57.5474 19.7548 57.6062 19.7348 57.6493 19.72C57.6709 19.7127 57.6885 19.7066 57.7021 19.7019C57.7089 19.6996 57.7147 19.6976 57.7195 19.696C57.7219 19.6952 57.7241 19.6944 57.726 19.6938C57.7269 19.6934 57.7281 19.693 57.7286 19.6929C57.7298 19.6924 57.7309 19.692 54 8.88887ZM27 3.15796C23.3263 3.15796 17.7849 2.07471 12.4674 0.6823C9.95717 0.0249875 7.73904 -0.635237 6.15184 -1.13035C5.36118 -1.377 4.73467 -1.58031 4.3155 -1.71863C4.10609 -1.78773 3.94899 -1.84043 3.84961 -1.874C3.79994 -1.89078 3.76474 -1.90276 3.74471 -1.9096C3.73469 -1.91302 3.72848 -1.91515 3.72613 -1.91595C3.72496 -1.91636 3.72476 -1.91643 3.72554 -1.91616C3.72593 -1.91602 3.72657 -1.91581 3.72745 -1.9155C3.72789 -1.91535 3.72874 -1.91506 3.72896 -1.91498C3.72987 -1.91467 3.73084 -1.91433 -4.673e-05 8.88887C-3.73093 19.692 -3.72983 19.6924 -3.72868 19.6929C-3.72821 19.693 -3.72698 19.6934 -3.72603 19.6938C-3.72415 19.6944 -3.72201 19.6952 -3.71961 19.696C-3.71482 19.6976 -3.70901 19.6996 -3.7022 19.7019C-3.68858 19.7066 -3.67095 19.7127 -3.6494 19.72C-3.60629 19.7348 -3.54745 19.7548 -3.47359 19.7797C-3.32589 19.8296 -3.11788 19.8993 -2.85516 19.986C-2.33008 20.1593 -1.58425 20.4011 -0.662589 20.6886C1.17485 21.2618 3.74125 22.026 6.67073 22.7931C12.2327 24.2495 20.1913 26.0151 27 26.0151V3.15796Z"
-                                    fill="var(--primary-color)"
-                                />
-                            </g>
-                        </svg>
-                        <div class="text-surface-900 dark:text-surface-0 text-3xl font-medium mb-4">Welcome to Konturai!</div>
-                        <span class="text-muted-color font-medium">Sign in to continue</span>
-                    </div>
-
-                    <div>
-                        <label for="email1" class="block text-surface-900 dark:text-surface-0 text-xl font-medium mb-2">Email</label>
-                        <InputText id="email1" type="text" placeholder="Email address" class="w-full md:w-[30rem] mb-8" v-model="email" />
-
-                        <label for="password1" class="block text-surface-900 dark:text-surface-0 font-medium text-xl mb-2">Password</label>
-                        <Password id="password1" v-model="password" placeholder="Password" :toggleMask="true" class="mb-4" fluid :feedback="false"></Password>
-
-                        <div class="flex items-center justify-between mt-2 mb-8 gap-8">
-                            <div class="flex items-center">
-                                <Checkbox v-model="checked" id="rememberme1" binary class="mr-2"></Checkbox>
-                                <label for="rememberme1">Remember me</label>
-                            </div>
-                            <span class="font-medium no-underline ml-2 text-right cursor-pointer text-primary">Forgot password?</span>
+            <div class="w-full max-w-md rounded-2xl bg-surface-0 p-8 shadow-xl ring-1 ring-surface-900/5 dark:bg-surface-800 dark:ring-surface-700">
+                <div class="mb-8 text-center">
+                    <div class="mb-6 flex justify-center">
+                        <div class="flex h-16 w-16 items-center justify-center rounded-full bg-gradient-to-br from-primary-500 to-purple-500">
+                            <i class="pi pi-lock text-2xl text-white" />
                         </div>
-                        <div v-if="errorMessage" class="text-red-500 text-sm mb-4">{{ errorMessage }}</div>
-                        <Button :loading="loading" label="Sign In" class="w-full" @click="onSubmit"></Button>
                     </div>
+                    <h1 class="mb-2 text-3xl font-bold tracking-tight text-surface-900 dark:text-surface-0">Маркетинговый анализ v4.0</h1>
+                    <p class="mt-2 text-sm text-surface-600 dark:text-surface-400">Войдите в систему для начала работы</p>
                 </div>
+
+                <form @submit.prevent="onSubmit" class="space-y-6">
+                    <div class="space-y-1">
+                        <label for="email1" class="flex items-center gap-2 text-sm font-medium text-surface-700 dark:text-surface-300">
+                            <i class="pi pi-envelope text-xs" />
+                            Email
+                        </label>
+                        <InputText id="email1" v-model="email" type="email" placeholder="example@mail.kz" class="w-full" :class="{ 'p-invalid': errorMessage }" />
+                    </div>
+
+                    <div class="space-y-1">
+                        <label for="password1" class="flex items-center gap-2 text-sm font-medium text-surface-700 dark:text-surface-300">
+                            <i class="pi pi-lock text-xs" />
+                            Пароль
+                        </label>
+                        <Password id="password1" v-model="password" placeholder="Введите пароль" :toggleMask="true" :feedback="false" class="w-full" inputClass="w-full" :class="{ 'p-invalid': errorMessage }" />
+                    </div>
+
+                    <div v-if="errorMessage" class="rounded-lg bg-red-50 px-4 py-3 text-sm text-red-700 dark:bg-red-900/30 dark:text-red-200">
+                        {{ errorMessage }}
+                    </div>
+
+                    <div class="flex items-center justify-between">
+                        <div class="flex items-center">
+                            <Checkbox v-model="checked" id="rememberme1" binary inputId="rememberme1" />
+                            <label for="rememberme1" class="ml-2 text-sm text-surface-600 dark:text-surface-400">Remember me</label>
+                        </div>
+                        <span class="cursor-pointer text-sm font-medium text-primary no-underline hover:text-primary-600 dark:text-primary-400"> Forgot password? </span>
+                    </div>
+
+                    <Button :loading="loading" label="Войти" icon="pi pi-sign-in" icon-pos="right" class="w-full" @click="onSubmit" />
+                </form>
             </div>
         </div>
     </div>
diff --git a/src/views/pages/marketing/MarketingAnalysesList.vue b/src/views/pages/marketing/MarketingAnalysesList.vue
index c6e8e7f..10b5e00 100644
--- a/src/views/pages/marketing/MarketingAnalysesList.vue
+++ b/src/views/pages/marketing/MarketingAnalysesList.vue
@@ -1,142 +1,5 @@
-<template>
-    <div class="marketing-analyses-list-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
-        <Toast />
-        <div class="max-w-[1400px] mx-auto">
-            <div class="card">
-                <div class="card-header mb-4">
-                    <div class="flex justify-content-between align-items-center">
-                        <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Мои анализы</h2>
-                        <Button label="Создать новый анализ" icon="pi pi-plus" severity="success" @click="goToCreateAnalysis" />
-                    </div>
-                </div>
-                <div class="card-content">
-                    <DataTable
-                        :value="analyses || []"
-                        :loading="loading"
-                        paginator
-                        :rows="10"
-                        :rowsPerPageOptions="[5, 10, 20, 50]"
-                        sortMode="single"
-                        removableSort
-                        :sortField="'createdAt'"
-                        :sortOrder="-1"
-                        filterDisplay="menu"
-                        :globalFilterFields="['product', 'location', 'region', 'clientType', 'status', 'analysisType', 'businessNiche']"
-                        v-model:filters="filters"
-                        :filters="filters"
-                        dataKey="analysisId"
-                    >
-                        <template #header>
-                            <div class="flex justify-content-between align-items-center flex-wrap gap-2">
-                                <span class="p-input-icon-left">
-                                    <i class="pi pi-search" />
-                                    <InputText v-model="filters.global.value" placeholder="Поиск анализов..." />
-                                </span>
-                                <Button label="Обновить" icon="pi pi-refresh" severity="secondary" @click="loadAnalyses" :loading="loading" />
-                            </div>
-                        </template>
-
-                        <Column field="product" header="Продукт" :sortable="true" style="min-width: 200px">
-                            <template #body="slotProps">
-                                <span class="font-semibold">{{ slotProps.data.product || '—' }}</span>
-                            </template>
-                        </Column>
-
-                        <Column field="location" header="Локация" :sortable="true" style="min-width: 150px">
-                            <template #body="slotProps">
-                                <span>{{ slotProps.data.location || '—' }}</span>
-                            </template>
-                        </Column>
-
-                        <Column field="clientType" header="Тип клиента" :sortable="true" style="min-width: 150px">
-                            <template #body="slotProps">
-                                <Tag v-if="slotProps.data.clientType && slotProps.data.clientType !== '—'" :value="slotProps.data.clientType" severity="info" />
-                                <span v-else class="text-surface-400">—</span>
-                            </template>
-                        </Column>
-
-                        <Column field="analysisType" header="Тип анализа" :sortable="true" style="min-width: 180px">
-                            <template #body="slotProps">
-                                <div v-if="slotProps.data.analysisType" class="flex flex-wrap gap-1">
-                                    <Tag v-for="(type, index) in Array.isArray(slotProps.data.analysisType) ? slotProps.data.analysisType : [slotProps.data.analysisType]" :key="index" :value="getAnalysisTypeLabel(type)" severity="secondary" />
-                                </div>
-                                <span v-else class="text-surface-400">—</span>
-                            </template>
-                        </Column>
-
-                        <Column field="status" header="Статус" :sortable="true" style="min-width: 120px">
-                            <template #body="slotProps">
-                                <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
-                            </template>
-                            <template #filter="{ filterModel, filterCallback }">
-                                <Dropdown v-if="filterModel" v-model="filterModel.value" :options="statusOptions" optionLabel="label" optionValue="value" placeholder="Все статусы" class="p-column-filter" @change="filterCallback && filterCallback()">
-                                    <template #option="slotProps">
-                                        <Tag :value="slotProps.option.label" :severity="slotProps.option.severity" />
-                                    </template>
-                                </Dropdown>
-                            </template>
-                        </Column>
-
-                        <Column field="createdAt" header="Создан" :sortable="true" style="min-width: 180px">
-                            <template #body="slotProps">
-                                <span>{{ formatDateTime(slotProps.data.createdAt) }}</span>
-                            </template>
-                        </Column>
-
-                        <Column field="completedAt" header="Завершен" :sortable="true" style="min-width: 180px">
-                            <template #body="slotProps">
-                                <span v-if="slotProps.data.completedAt">{{ formatDateTime(slotProps.data.completedAt) }}</span>
-                                <span v-else class="text-surface-400">—</span>
-                            </template>
-                        </Column>
-
-                        <Column header="Действия" style="min-width: 250px">
-                            <template #body="slotProps">
-                                <div class="flex gap-2 flex-wrap">
-                                    <Button icon="pi pi-eye" severity="info" size="small" v-tooltip.top="'Просмотр деталей'" @click="viewAnalysis(slotProps.data.analysisId)" :disabled="slotProps.data.status !== 'completed'" />
-                                    <Button icon="pi pi-history" severity="secondary" size="small" v-tooltip.top="'История статусов'" @click="viewHistory(slotProps.data.analysisId)" />
-                                    <Button icon="pi pi-download" severity="success" size="small" v-tooltip.top="'Скачать PDF'" @click="downloadPdf(slotProps.data.analysisId)" :disabled="slotProps.data.status !== 'completed'" />
-                                    <Button icon="pi pi-magic" severity="warning" size="small" v-tooltip.top="'Создать стратегию'" @click="createStrategy(slotProps.data.analysisId)" :disabled="slotProps.data.status !== 'completed'" />
-                                </div>
-                            </template>
-                        </Column>
-                    </DataTable>
-                </div>
-            </div>
-        </div>
-
-        <!-- Диалог истории статусов -->
-        <Dialog v-model:visible="historyDialogVisible" :header="'История статусов анализа'" :style="{ width: '600px' }" :modal="true">
-            <div v-if="historyLoading" class="text-center py-4">
-                <ProgressSpinner />
-            </div>
-            <div v-else-if="statusHistory && statusHistory.length > 0" class="status-history">
-                <Timeline :value="statusHistory" align="left" class="w-full">
-                    <template #marker="slotProps">
-                        <span class="flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1" :class="getStatusColorClass(slotProps.item.status)">
-                            <i :class="getStatusIcon(slotProps.item.status)"></i>
-                        </span>
-                    </template>
-                    <template #content="slotProps">
-                        <div class="flex flex-column">
-                            <div class="flex align-items-center gap-2 mb-2">
-                                <Tag :value="getStatusLabel(slotProps.item.status)" :severity="getStatusSeverity(slotProps.item.status)" />
-                                <span class="text-sm text-surface-500 dark:text-surface-400">{{ formatDateTime(slotProps.item.timestamp) }}</span>
-                            </div>
-                            <p class="text-sm text-surface-700 dark:text-surface-300 m-0">{{ slotProps.item.message }}</p>
-                        </div>
-                    </template>
-                </Timeline>
-            </div>
-            <div v-else class="text-center py-4 text-surface-500">История статусов недоступна</div>
-            <template #footer>
-                <Button label="Закрыть" icon="pi pi-times" @click="historyDialogVisible = false" severity="secondary" />
-            </template>
-        </Dialog>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import MarketingService from '@/service/MarketingService';
 import { FilterMatchMode } from '@primevue/core/api';
 import Button from 'primevue/button';
@@ -389,6 +252,144 @@ onMounted(() => {
 });
 </script>
 
+<template>
+    <div class="marketing-analyses-list-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
+        <Toast />
+        <div class="max-w-[1400px] mx-auto">
+            <div class="card">
+                <div class="card-header mb-4">
+                    <div class="flex justify-content-between align-items-center">
+                        <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Мои анализы</h2>
+                        <Button label="Создать новый анализ" icon="pi pi-plus" severity="success" @click="goToCreateAnalysis" />
+                    </div>
+                </div>
+                <div class="card-content">
+                    <DataTable
+                        :value="analyses || []"
+                        :loading="loading"
+                        paginator
+                        :rows="10"
+                        :rowsPerPageOptions="[5, 10, 20, 50]"
+                        sortMode="single"
+                        removableSort
+                        :sortField="'createdAt'"
+                        :sortOrder="-1"
+                        filterDisplay="menu"
+                        :globalFilterFields="['product', 'location', 'region', 'clientType', 'status', 'analysisType', 'businessNiche']"
+                        v-model:filters="filters"
+                        :filters="filters"
+                        dataKey="analysisId"
+                    >
+                        <template #header>
+                            <div class="flex justify-content-between align-items-center flex-wrap gap-2">
+                                <span class="p-input-icon-left">
+                                    <i class="pi pi-search" />
+                                    <InputText v-model="filters.global.value" placeholder="Поиск анализов..." />
+                                </span>
+                                <Button label="Обновить" icon="pi pi-refresh" severity="secondary" @click="loadAnalyses" :loading="loading" />
+                            </div>
+                        </template>
+
+                        <Column field="product" header="Продукт" :sortable="true" style="min-width: 200px">
+                            <template #body="slotProps">
+                                <span class="font-semibold">{{ slotProps.data.product || '—' }}</span>
+                            </template>
+                        </Column>
+
+                        <Column field="location" header="Локация" :sortable="true" style="min-width: 150px">
+                            <template #body="slotProps">
+                                <span>{{ slotProps.data.location || '—' }}</span>
+                            </template>
+                        </Column>
+
+                        <Column field="clientType" header="Тип клиента" :sortable="true" style="min-width: 150px">
+                            <template #body="slotProps">
+                                <Tag v-if="slotProps.data.clientType && slotProps.data.clientType !== '—'" :value="slotProps.data.clientType" severity="info" />
+                                <span v-else class="text-surface-400">—</span>
+                            </template>
+                        </Column>
+
+                        <Column field="analysisType" header="Тип анализа" :sortable="true" style="min-width: 180px">
+                            <template #body="slotProps">
+                                <div v-if="slotProps.data.analysisType" class="flex flex-wrap gap-1">
+                                    <Tag v-for="(type, index) in Array.isArray(slotProps.data.analysisType) ? slotProps.data.analysisType : [slotProps.data.analysisType]" :key="index" :value="getAnalysisTypeLabel(type)" severity="secondary" />
+                                </div>
+                                <span v-else class="text-surface-400">—</span>
+                            </template>
+                        </Column>
+
+                        <Column field="status" header="Статус" :sortable="true" style="min-width: 120px">
+                            <template #body="slotProps">
+                                <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
+                            </template>
+                            <template #filter="{ filterModel, filterCallback }">
+                                <Dropdown v-if="filterModel" v-model="filterModel.value" :options="statusOptions" optionLabel="label" optionValue="value" placeholder="Все статусы" class="p-column-filter" @change="filterCallback && filterCallback()">
+                                    <template #option="slotProps">
+                                        <Tag :value="slotProps.option.label" :severity="slotProps.option.severity" />
+                                    </template>
+                                </Dropdown>
+                            </template>
+                        </Column>
+
+                        <Column field="createdAt" header="Создан" :sortable="true" style="min-width: 180px">
+                            <template #body="slotProps">
+                                <span>{{ formatDateTime(slotProps.data.createdAt) }}</span>
+                            </template>
+                        </Column>
+
+                        <Column field="completedAt" header="Завершен" :sortable="true" style="min-width: 180px">
+                            <template #body="slotProps">
+                                <span v-if="slotProps.data.completedAt">{{ formatDateTime(slotProps.data.completedAt) }}</span>
+                                <span v-else class="text-surface-400">—</span>
+                            </template>
+                        </Column>
+
+                        <Column header="Действия" style="min-width: 250px">
+                            <template #body="slotProps">
+                                <div class="flex gap-2 flex-wrap">
+                                    <Button icon="pi pi-eye" severity="info" size="small" v-tooltip.top="'Просмотр деталей'" @click="viewAnalysis(slotProps.data.analysisId)" :disabled="slotProps.data.status !== 'completed'" />
+                                    <Button icon="pi pi-history" severity="secondary" size="small" v-tooltip.top="'История статусов'" @click="viewHistory(slotProps.data.analysisId)" />
+                                    <Button icon="pi pi-download" severity="success" size="small" v-tooltip.top="'Скачать PDF'" @click="downloadPdf(slotProps.data.analysisId)" :disabled="slotProps.data.status !== 'completed'" />
+                                    <Button icon="pi pi-magic" severity="warning" size="small" v-tooltip.top="'Создать стратегию'" @click="createStrategy(slotProps.data.analysisId)" :disabled="slotProps.data.status !== 'completed'" />
+                                </div>
+                            </template>
+                        </Column>
+                    </DataTable>
+                </div>
+            </div>
+        </div>
+
+        <!-- Диалог истории статусов -->
+        <Dialog v-model:visible="historyDialogVisible" :header="'История статусов анализа'" :style="{ width: '600px' }" :modal="true">
+            <div v-if="historyLoading" class="text-center py-4">
+                <ProgressSpinner />
+            </div>
+            <div v-else-if="statusHistory && statusHistory.length > 0" class="status-history">
+                <Timeline :value="statusHistory" align="left" class="w-full">
+                    <template #marker="slotProps">
+                        <span class="flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1" :class="getStatusColorClass(slotProps.item.status)">
+                            <i :class="getStatusIcon(slotProps.item.status)"></i>
+                        </span>
+                    </template>
+                    <template #content="slotProps">
+                        <div class="flex flex-column">
+                            <div class="flex align-items-center gap-2 mb-2">
+                                <Tag :value="getStatusLabel(slotProps.item.status)" :severity="getStatusSeverity(slotProps.item.status)" />
+                                <span class="text-sm text-surface-500 dark:text-surface-400">{{ formatDateTime(slotProps.item.timestamp) }}</span>
+                            </div>
+                            <p class="text-sm text-surface-700 dark:text-surface-300 m-0">{{ slotProps.item.message }}</p>
+                        </div>
+                    </template>
+                </Timeline>
+            </div>
+            <div v-else class="text-center py-4 text-surface-500">История статусов недоступна</div>
+            <template #footer>
+                <Button label="Закрыть" icon="pi pi-times" @click="historyDialogVisible = false" severity="secondary" />
+            </template>
+        </Dialog>
+    </div>
+</template>
+
 <style scoped>
 .marketing-analyses-list-page {
     font-family: var(--font-family);
diff --git a/src/views/pages/marketing/MarketingAnalysis.vue b/src/views/pages/marketing/MarketingAnalysis.vue
index a664e1b..95070e2 100644
--- a/src/views/pages/marketing/MarketingAnalysis.vue
+++ b/src/views/pages/marketing/MarketingAnalysis.vue
@@ -1,969 +1,5 @@
-<template>
-    <div class="marketing-analysis-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
-        <Toast />
-        <div class="max-w-[1200px] mx-auto">
-            <!-- Форма запуска анализа -->
-            <div v-if="!analysisId" class="card">
-                <div class="card-header mb-4">
-                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Запуск анализа</h2>
-                </div>
-                <div class="card-content">
-                    <form @submit.prevent="handleSubmit" class="space-y-4 max-w-2xl">
-                        <div class="field">
-                            <label for="businessNiche" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Ниша бизнеса * </label>
-                            <InputText id="businessNiche" v-model="formData.businessNiche" placeholder="Например: E-commerce платформы" class="w-full" :class="{ 'p-invalid': errors.businessNiche }" />
-                            <small v-if="errors.businessNiche" class="p-error">{{ errors.businessNiche }}</small>
-                        </div>
-
-                        <div class="field">
-                            <label for="product" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Что вы продаете? * </label>
-                            <InputText id="product" v-model="formData.product" placeholder="Введите название продукта или услуги" class="w-full" :class="{ 'p-invalid': errors.product }" />
-                            <small v-if="errors.product" class="p-error">{{ errors.product }}</small>
-                        </div>
-
-                        <div class="field">
-                            <label class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Целевая аудитория * </label>
-
-                            <!-- Гендер -->
-                            <div class="mb-3">
-                                <label class="block text-sm font-medium mb-2 text-surface-600 dark:text-surface-400">Гендер:</label>
-                                <div class="flex gap-4 flex-wrap">
-                                    <div v-for="gender in VALID_GENDERS" :key="gender" class="flex align-items-center">
-                                        <Checkbox :inputId="`gender-${gender}`" :value="gender" v-model="formData.targetAudience.genders" />
-                                        <label :for="`gender-${gender}`" class="ml-2 cursor-pointer">{{ gender }}</label>
-                                    </div>
-                                </div>
-                            </div>
-
-                            <!-- Возраст -->
-                            <div class="mb-3">
-                                <label class="block text-sm font-medium mb-2 text-surface-600 dark:text-surface-400">Возраст:</label>
-                                <div class="flex gap-4 flex-wrap">
-                                    <div v-for="age in VALID_AGE_RANGES" :key="age" class="flex align-items-center">
-                                        <Checkbox :inputId="`age-${age}`" :value="age" v-model="formData.targetAudience.ageRanges" />
-                                        <label :for="`age-${age}`" class="ml-2 cursor-pointer">{{ age }}</label>
-                                    </div>
-                                </div>
-                            </div>
-
-                            <!-- Тип -->
-                            <div class="mb-3">
-                                <label class="block text-sm font-medium mb-2 text-surface-600 dark:text-surface-400">Тип:</label>
-                                <div class="flex gap-4 flex-wrap">
-                                    <div v-for="type in VALID_AUDIENCE_TYPES" :key="type" class="flex align-items-center">
-                                        <Checkbox :inputId="`type-${type}`" :value="type" v-model="formData.targetAudience.types" />
-                                        <label :for="`type-${type}`" class="ml-2 cursor-pointer">{{ type }}</label>
-                                    </div>
-                                </div>
-                            </div>
-
-                            <!-- Отображение выбранных значений -->
-                            <div v-if="formData.targetAudience.genders.length > 0 || formData.targetAudience.ageRanges.length > 0 || formData.targetAudience.types.length > 0" class="mt-2 p-2 border-round bg-surface-100 dark:bg-surface-800">
-                                <small class="text-surface-600 dark:text-surface-400">
-                                    <strong>Выбрано:</strong>
-                                    <span v-if="formData.targetAudience.genders.length > 0"> Гендер: {{ formData.targetAudience.genders.join(', ') }}</span>
-                                    <span v-if="formData.targetAudience.ageRanges.length > 0"> Возраст: {{ formData.targetAudience.ageRanges.join(', ') }}</span>
-                                    <span v-if="formData.targetAudience.types.length > 0"> Тип: {{ formData.targetAudience.types.join(', ') }}</span>
-                                </small>
-                            </div>
-
-                            <small v-if="errors.targetAudience" class="p-error">{{ errors.targetAudience }}</small>
-                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите хотя бы одну опцию для целевой аудитории</small>
-                        </div>
-
-                        <div class="field">
-                            <label for="region" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Регион (город Казахстана) * </label>
-                            <MultiSelect id="region" v-model="formData.region" :options="VALID_REGIONS" placeholder="Выберите регионы" class="w-full" display="chip" :class="{ 'p-invalid': errors.region }" />
-                            <small v-if="errors.region" class="p-error">{{ errors.region }}</small>
-                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите один или несколько регионов</small>
-                        </div>
-
-                        <div class="field">
-                            <label for="goal" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Цель на 6-12 месяцев * </label>
-                            <Textarea id="goal" v-model="formData.goal" placeholder="Опишите вашу цель на ближайшие 6-12 месяцев" rows="3" class="w-full" :class="{ 'p-invalid': errors.goal }" />
-                            <small v-if="errors.goal" class="p-error">{{ errors.goal }}</small>
-                        </div>
-
-                        <div class="field">
-                            <label class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Уровень детализации анализа * </label>
-                            <div class="flex gap-4">
-                                <div v-for="level in DETAIL_LEVELS" :key="level" class="flex align-items-center">
-                                    <RadioButton :inputId="`detailLevel-${level}`" v-model="formData.detailLevel" :value="level" :class="{ 'p-invalid': errors.detailLevel }" />
-                                    <label :for="`detailLevel-${level}`" class="ml-2 cursor-pointer">
-                                        {{ level === 'КРАТКО' ? 'Кратко' : level === 'СТАНДАРТНО' ? 'Стандартно' : 'Подробно' }}
-                                    </label>
-                                </div>
-                            </div>
-                            <small v-if="errors.detailLevel" class="p-error">{{ errors.detailLevel }}</small>
-                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите уровень детализации анализа</small>
-                        </div>
-
-                        <div class="field">
-                            <label for="strongSide" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Сильная сторона бизнеса </label>
-                            <Textarea id="strongSide" v-model="formData.strongSide" placeholder="Опишите сильные стороны вашего бизнеса (опционально)" rows="2" class="w-full" :class="{ 'p-invalid': errors.strongSide }" />
-                            <small v-if="errors.strongSide" class="p-error">{{ errors.strongSide }}</small>
-                        </div>
-
-                        <div class="field">
-                            <label for="weakSide" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Слабая сторона бизнеса </label>
-                            <Textarea id="weakSide" v-model="formData.weakSide" placeholder="Опишите слабые стороны вашего бизнеса (опционально)" rows="2" class="w-full" :class="{ 'p-invalid': errors.weakSide }" />
-                            <small v-if="errors.weakSide" class="p-error">{{ errors.weakSide }}</small>
-                        </div>
-
-                        <!-- <div class="field">
-                            <label for="marketingBudget" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Бюджет на маркетинг </label>
-                            <InputNumber id="marketingBudget" v-model="formData.marketingBudget" :min="0" placeholder="Введите бюджет в тенге" class="w-full" :class="{ 'p-invalid': errors.marketingBudget }" />
-                            <small v-if="errors.marketingBudget" class="p-error">{{ errors.marketingBudget }}</small>
-                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Укажите ваш бюджет на маркетинг (опционально)</small>
-                        </div> -->
-
-                        <div class="field">
-                            <label for="analysisType" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Тип анализа * </label>
-                            <MultiSelect id="analysisType" v-model="formData.analysisType" :options="VALID_ANALYSIS_TYPES" placeholder="Выберите типы анализа" class="w-full" display="chip" :class="{ 'p-invalid': errors.analysisType }">
-                                <template #value="slotProps">
-                                    <div v-if="slotProps.value && slotProps.value.length > 0" class="flex flex-wrap gap-2">
-                                        <Tag v-for="type in slotProps.value" :key="type" :value="getAnalysisTypeLabel(type)" severity="info" />
-                                    </div>
-                                    <span v-else class="text-surface-400">{{ slotProps.placeholder }}</span>
-                                </template>
-                                <template #option="slotProps">
-                                    <div class="flex align-items-center">
-                                        <span>{{ getAnalysisTypeLabel(slotProps.option) }}</span>
-                                    </div>
-                                </template>
-                            </MultiSelect>
-                            <small v-if="errors.analysisType" class="p-error">{{ errors.analysisType }}</small>
-                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите один или несколько типов анализа. При выборе нескольких типов будут созданы отдельные анализы для каждого типа.</small>
-                        </div>
-
-                        <Button type="submit" label="Начать анализ" icon="pi pi-send" class="w-full p-button-primary" :loading="submitting" />
-
-                        <p class="text-sm text-surface-500 dark:text-surface-400 mt-3 text-center">На основе ваших ответов будет создан подробный и полезный маркетинговый отчет</p>
-                    </form>
-                </div>
-            </div>
-
-            <!-- Единая страница: v2 dashboard сверху + старый анализ ниже -->
-            <div v-else class="space-y-4">
-                <!-- v2 Dashboard (показываем первым) -->
-                <div v-if="v2Loading || v2ReportNormalized" class="card">
-                    <div class="card-content">
-                        <MarketingAnalysisPptDashboard embedded :report="v2ReportNormalized" :loading="v2Loading" :error="v2Error" />
-                    </div>
-                </div>
-
-                <!-- Статус обработки (старый анализ) -->
-                <div v-if="status === 'processing' || status === 'queued'" class="space-y-4">
-                    <!-- Заголовок с кнопкой -->
-                    <div class="card">
-                        <div class="card-header mb-4">
-                            <div class="flex flex-wrap justify-content-between align-items-center gap-3">
-                                <div class="flex-1 min-w-0">
-                                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Анализ выполняется</h2>
-                                </div>
-                                <div class="flex gap-2 align-items-center flex-shrink-0">
-                                    <Button :label="isAnalysisOpen ? 'Скрыть анализ' : 'Показать анализ'" :icon="isAnalysisOpen ? 'pi pi-chevron-up' : 'pi pi-chevron-down'" severity="secondary" outlined @click="isAnalysisOpen = !isAnalysisOpen" />
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div v-show="isAnalysisOpen" class="card">
-                        <div class="card-content">
-                            <div class="text-center py-6">
-                                <ProgressSpinner size="50" />
-                                <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Анализ обрабатывается...</p>
-                                <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Это может занять 5-10 минут. Пожалуйста, подождите.</p>
-                                <p v-if="estimatedCompletionTime" class="mt-2 text-sm text-surface-500 dark:text-surface-400">Ожидаемое время завершения: {{ formatDateTime(estimatedCompletionTime) }}</p>
-                                <Button label="Отменить" icon="pi pi-times" severity="secondary" class="mt-4" @click="resetAnalysis" />
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Ошибка -->
-                <div v-else-if="status === 'failed'" class="card">
-                    <div class="card-header mb-4">
-                        <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Ошибка анализа</h2>
-                    </div>
-                    <div class="card-content">
-                        <div class="text-center py-6">
-                            <i class="pi pi-exclamation-triangle text-6xl text-red-500 mb-3"></i>
-                            <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Анализ завершился с ошибкой</p>
-                            <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Попробуйте запустить анализ снова или обратитесь в поддержку.</p>
-                            <Button label="Попробовать снова" icon="pi pi-refresh" class="mt-4" @click="resetAnalysis" />
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Результаты анализа -->
-                <div v-else-if="status === 'completed' && report" class="space-y-4">
-                    <!-- Заголовок с кнопкой скачивания -->
-                    <div class="card">
-                        <div class="card-header mb-4">
-                            <div class="flex flex-wrap justify-content-between align-items-center gap-3">
-                                <div class="flex-1 min-w-0">
-                                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Результаты анализа</h2>
-                                    <div v-if="currentAnalysisType" class="mt-2">
-                                        <Tag :value="getAnalysisTypeLabel(currentAnalysisType)" severity="info" />
-                                    </div>
-                                </div>
-                                <div class="flex gap-2 align-items-center flex-shrink-0">
-                                    <Button :label="isAnalysisOpen ? 'Скрыть анализ' : 'Показать анализ'" :icon="isAnalysisOpen ? 'pi pi-chevron-up' : 'pi pi-chevron-down'" severity="secondary" outlined @click="isAnalysisOpen = !isAnalysisOpen" />
-                                    <Button label="Скачать PDF" icon="pi pi-download" @click="handleDownloadPdf" :loading="downloadingPdf" />
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <div v-show="isAnalysisOpen" class="space-y-4">
-                        <!-- Краткое резюме (Summary) -->
-                        <div v-if="report.summary" class="card">
-                            <div class="card-header mb-4">
-                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-file-edit mr-2"></i>Краткое резюме</h3>
-                            </div>
-                            <div class="card-content">
-                                <div class="markdown-content" v-html="renderMarkdown(report.summary)"></div>
-                            </div>
-                        </div>
-
-                        <!-- Динамическое содержимое отчета (в одном контейнере) -->
-                        <div v-if="parsedContent.length" class="card">
-                            <div class="card-content">
-                                <div class="space-y-6">
-                                    <div v-for="(segment, index) in displayContent" :key="index">
-                                        <!-- Two-column pair: paragraph text + adjacent json-chart/table -->
-                                        <div v-if="segment.type === 'paired'" class="report-pair">
-                                            <!-- IMPORTANT: preserve original markdown order in DOM -->
-                                            <template v-if="segment.order === 'text-media'">
-                                                <div class="report-pair__text">
-                                                    <div class="report-pair__textStack">
-                                                        <div v-for="(t, tIdx) in segment.texts || []" :key="tIdx" class="markdown-content" v-html="t.html"></div>
-                                                    </div>
-                                                </div>
-
-                                                <div class="report-pair__media">
-                                                    <div v-if="segment.media.type === 'chart'">
-                                                        <div class="report-pair__mediaChart">
-                                                            <div class="chart-container report-pair__chart-container">
-                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
-                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
-                                                            </div>
-                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
-                                                        </div>
-                                                        <div v-if="segment.media.key === 'channelsPotential' && segment.media.channels?.length" class="mt-4 space-y-2">
-                                                            <div v-for="channel in segment.media.channels" :key="channel.name" class="p-3 border-round bg-surface-50 dark:bg-surface-800">
-                                                                <div class="flex justify-content-between align-items-center mb-2">
-                                                                    <span class="font-semibold text-surface-900 dark:text-surface-0">{{ channel.name }}</span>
-                                                                    <Tag :value="`Потенциал: ${channel.potential}`" :severity="channel.potential >= 80 ? 'success' : channel.potential >= 60 ? 'warning' : 'info'" />
-                                                                </div>
-                                                                <p class="text-sm text-surface-600 dark:text-surface-400">{{ channel.justification }}</p>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div v-else-if="segment.media.type === 'marketShareChart'">
-                                                        <div class="report-pair__mediaChart">
-                                                            <div class="chart-container report-pair__chart-container">
-                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
-                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
-                                                            </div>
-                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div v-else-if="segment.media.type === 'comparisonTable'">
-                                                        <div class="mb-4">
-                                                            <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-table mr-2"></i>Сравнительная таблица</h3>
-                                                        </div>
-                                                        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-                                                            <table class="comparison-table w-full border-collapse">
-                                                                <thead>
-                                                                    <tr>
-                                                                        <th class="comparison-table-th">Характеристика</th>
-                                                                        <th class="comparison-table-th text-center">Мы</th>
-                                                                        <th class="comparison-table-th text-center">Конкурент A</th>
-                                                                        <th class="comparison-table-th text-center">Конкурент B</th>
-                                                                    </tr>
-                                                                </thead>
-                                                                <tbody>
-                                                                    <tr v-for="(row, idx) in segment.media.data" :key="idx" class="comparison-table-tr">
-                                                                        <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
-                                                                        <td class="comparison-table-td text-center">
-                                                                            <Tag :value="row.us" severity="info" />
-                                                                        </td>
-                                                                        <td class="comparison-table-td text-center">
-                                                                            <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
-                                                                        </td>
-                                                                        <td class="comparison-table-td text-center">
-                                                                            <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
-                                                                        </td>
-                                                                    </tr>
-                                                                </tbody>
-                                                            </table>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </template>
-
-                                            <template v-else>
-                                                <div class="report-pair__media">
-                                                    <div v-if="segment.media.type === 'chart'">
-                                                        <div class="report-pair__mediaChart">
-                                                            <div class="chart-container report-pair__chart-container">
-                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
-                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
-                                                            </div>
-                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
-                                                        </div>
-                                                        <div v-if="segment.media.key === 'channelsPotential' && segment.media.channels?.length" class="mt-4 space-y-2">
-                                                            <div v-for="channel in segment.media.channels" :key="channel.name" class="p-3 border-round bg-surface-50 dark:bg-surface-800">
-                                                                <div class="flex justify-content-between align-items-center mb-2">
-                                                                    <span class="font-semibold text-surface-900 dark:text-surface-0">{{ channel.name }}</span>
-                                                                    <Tag :value="`Потенциал: ${channel.potential}`" :severity="channel.potential >= 80 ? 'success' : channel.potential >= 60 ? 'warning' : 'info'" />
-                                                                </div>
-                                                                <p class="text-sm text-surface-600 dark:text-surface-400">{{ channel.justification }}</p>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div v-else-if="segment.media.type === 'marketShareChart'">
-                                                        <div class="report-pair__mediaChart">
-                                                            <div class="chart-container report-pair__chart-container">
-                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
-                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
-                                                            </div>
-                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
-                                                        </div>
-                                                    </div>
-
-                                                    <div v-else-if="segment.media.type === 'comparisonTable'">
-                                                        <div class="mb-4">
-                                                            <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-table mr-2"></i>Сравнительная таблица</h3>
-                                                        </div>
-                                                        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-                                                            <table class="comparison-table w-full border-collapse">
-                                                                <thead>
-                                                                    <tr>
-                                                                        <th class="comparison-table-th">Характеристика</th>
-                                                                        <th class="comparison-table-th text-center">Мы</th>
-                                                                        <th class="comparison-table-th text-center">Конкурент A</th>
-                                                                        <th class="comparison-table-th text-center">Конкурент B</th>
-                                                                    </tr>
-                                                                </thead>
-                                                                <tbody>
-                                                                    <tr v-for="(row, idx) in segment.media.data" :key="idx" class="comparison-table-tr">
-                                                                        <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
-                                                                        <td class="comparison-table-td text-center">
-                                                                            <Tag :value="row.us" severity="info" />
-                                                                        </td>
-                                                                        <td class="comparison-table-td text-center">
-                                                                            <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
-                                                                        </td>
-                                                                        <td class="comparison-table-td text-center">
-                                                                            <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
-                                                                        </td>
-                                                                    </tr>
-                                                                </tbody>
-                                                            </table>
-                                                        </div>
-                                                    </div>
-                                                </div>
-
-                                                <div class="report-pair__text">
-                                                    <div class="report-pair__textStack">
-                                                        <div v-for="(t, tIdx) in segment.texts || []" :key="tIdx" class="markdown-content" v-html="t.html"></div>
-                                                    </div>
-                                                </div>
-                                            </template>
-                                        </div>
-
-                                        <div v-else-if="segment.type === 'markdown'">
-                                            <div class="markdown-content" v-html="segment.html"></div>
-                                        </div>
-
-                                        <div v-else-if="segment.type === 'chart'">
-                                            <div class="chart-container" :style="segment.chartHeight">
-                                                <Chart v-if="hasRenderableChartData(segment.data)" :type="segment.chartType" :data="segment.data" :options="segment.options" />
-                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
-                                            </div>
-                                            <div v-if="segment.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.title }}</div>
-                                            <div v-if="segment.key === 'channelsPotential' && segment.channels?.length" class="mt-4 space-y-2">
-                                                <div v-for="channel in segment.channels" :key="channel.name" class="p-3 border-round bg-surface-50 dark:bg-surface-800">
-                                                    <div class="flex justify-content-between align-items-center mb-2">
-                                                        <span class="font-semibold text-surface-900 dark:text-surface-0">{{ channel.name }}</span>
-                                                        <Tag :value="`Потенциал: ${channel.potential}`" :severity="channel.potential >= 80 ? 'success' : channel.potential >= 60 ? 'warning' : 'info'" />
-                                                    </div>
-                                                    <p class="text-sm text-surface-600 dark:text-surface-400">{{ channel.justification }}</p>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <div v-else-if="segment.type === 'audienceSegmentation'">
-                                            <div class="mb-4">
-                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-users mr-2"></i>Сегментация целевой аудитории</h3>
-                                            </div>
-                                            <div class="grid">
-                                                <div v-if="segment.ageGroupsChartData" class="col-12 md:col-6 mb-4">
-                                                    <div class="flex align-items-center mb-3">
-                                                        <i class="pi pi-calendar text-primary-500 mr-2"></i>
-                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">По возрасту</h4>
-                                                    </div>
-                                                    <div class="chart-container" style="height: 300px">
-                                                        <Chart type="pie" :data="segment.ageGroupsChartData" :options="pieChartOptions" />
-                                                    </div>
-                                                </div>
-                                                <div v-if="segment.gendersChartData" class="col-12 md:col-6 mb-4">
-                                                    <div class="flex align-items-center mb-3">
-                                                        <i class="pi pi-user text-primary-500 mr-2"></i>
-                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">По полу</h4>
-                                                    </div>
-                                                    <div class="chart-container" style="height: 300px">
-                                                        <Chart type="pie" :data="segment.gendersChartData" :options="pieChartOptions" />
-                                                    </div>
-                                                </div>
-                                            </div>
-
-                                            <!-- Segments Channel Matrix (Heatmap) -->
-                                            <SegmentsChannelMatrixHeatmap v-if="segment.segmentsChannelMatrix" :matrix="segment.segmentsChannelMatrix" />
-
-                                            <!-- Key Takeaways -->
-                                            <div v-if="segment.keyTakeaways && segment.keyTakeaways.length > 0" class="mt-6">
-                                                <div class="flex align-items-center mb-3">
-                                                    <i class="pi pi-lightbulb text-primary-500 mr-2"></i>
-                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Ключевые выводы</h4>
-                                                </div>
-                                                <div class="p-4 border-round bg-primary-50 dark:bg-primary-900 border-1 border-primary-200 dark:border-primary-700">
-                                                    <ul class="list-none p-0 m-0">
-                                                        <li v-for="(takeaway, idx) in segment.keyTakeaways" :key="idx" class="flex align-items-start mb-3">
-                                                            <i class="pi pi-check-circle text-primary-500 mr-2 mt-1 flex-shrink-0"></i>
-                                                            <span class="text-surface-700 dark:text-surface-300">{{ takeaway }}</span>
-                                                        </li>
-                                                    </ul>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <div v-else-if="segment.type === 'segmentsChannelMatrix'">
-                                            <HeatmapTable :matrix="segment.matrix" :title="segment.title || 'Матрица каналов по сегментам'" />
-                                        </div>
-
-                                        <!-- New Competitive Environment Component -->
-                                        <div v-else-if="segment.type === 'competitiveEnvironment'">
-                                            <div class="mb-6">
-                                                <h3 class="text-2xl font-semibold text-surface-900 dark:text-surface-0 mb-4">
-                                                    <i class="pi pi-chart-line mr-2 text-primary-500"></i>{{ segment.title || 'Конкурентная среда' }}
-                                                </h3>
-
-                                                <!-- Metrics KPI Cards -->
-                                                <div v-if="segment.metrics" class="grid mb-6">
-                                                    <div class="col-12 md:col-3 mb-3">
-                                                        <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full">
-                                                            <div class="flex align-items-center mb-2">
-                                                                <i class="pi pi-sitemap text-primary-500 mr-2 text-xl"></i>
-                                                                <span class="text-sm font-medium text-surface-600 dark:text-surface-400">Доля лидера</span>
-                                                            </div>
-                                                            <div class="text-2xl font-bold text-surface-900 dark:text-surface-0">
-                                                                {{ segment.metrics.leader_market_share || '—' }}
-                                                            </div>
-                                                            <div v-if="segment.metrics.market_leader_name" class="text-xs text-surface-500 dark:text-surface-400 mt-1">
-                                                                {{ segment.metrics.market_leader_name }}
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <div class="col-12 md:col-3 mb-3">
-                                                        <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full">
-                                                            <div class="flex align-items-center mb-2">
-                                                                <i class="pi pi-chart-bar text-green-500 mr-2 text-xl"></i>
-                                                                <span class="text-sm font-medium text-surface-600 dark:text-surface-400">Уровень конкуренции</span>
-                                                            </div>
-                                                            <div class="text-2xl font-bold text-surface-900 dark:text-surface-0">
-                                                                {{ segment.metrics.competition_level || '—' }}
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <div class="col-12 md:col-3 mb-3">
-                                                        <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full">
-                                                            <div class="flex align-items-center mb-2">
-                                                                <i class="pi pi-wallet text-orange-500 mr-2 text-xl"></i>
-                                                                <span class="text-sm font-medium text-surface-600 dark:text-surface-400">Давление рекламы</span>
-                                                            </div>
-                                                            <div class="text-2xl font-bold text-surface-900 dark:text-surface-0">
-                                                                {{ segment.metrics.ad_pressure || '—' }}
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-
-                                                <!-- Visibility Chart -->
-                                                <div v-if="segment.visibilityChart" class="mb-6">
-                                                    <div class="flex align-items-center mb-3">
-                                                        <i class="pi pi-chart-bar text-primary-500 mr-2"></i>
-                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ segment.visibilityChart.title }}</h4>
-                                                    </div>
-                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700">
-                                                        <div class="chart-container" :style="segment.visibilityChart.chartHeight">
-                                                            <Chart 
-                                                                v-if="hasRenderableChartData(segment.visibilityChart.data)" 
-                                                                :type="segment.visibilityChart.chartType" 
-                                                                :data="segment.visibilityChart.data" 
-                                                                :options="segment.visibilityChart.options"
-                                                                @chart:click="onChartClick"
-                                                                @chart:hover="onChartHover"
-                                                                ref="visibilityChartRef"
-                                                            />
-                                                            <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">
-                                                                Нет данных для отображения
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-
-                                                <!-- Competitors Table -->
-                                                <div v-if="segment.competitors && segment.competitors.length > 0" class="mb-6">
-                                                    <div class="flex align-items-center mb-3">
-                                                        <i class="pi pi-table text-primary-500 mr-2"></i>
-                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Таблица конкурентов</h4>
-                                                    </div>
-                                                    <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-                                                        <table class="competitive-environment-table w-full border-collapse">
-                                                            <thead>
-                                                                <tr>
-                                                                    <th class="competitive-env-th">Название</th>
-                                                                    <th class="competitive-env-th">Сайт</th>
-                                                                    <th class="competitive-env-th text-center">Видимость</th>
-                                                                    <th class="competitive-env-th">Ключевые преимущества</th>
-                                                                    <th class="competitive-env-th text-center">Ценовой сегмент</th>
-                                                                </tr>
-                                                            </thead>
-                                                            <tbody>
-                                                                <tr 
-                                                                    v-for="(competitor, idx) in segment.competitors" 
-                                                                    :key="competitor.name || idx"
-                                                                    :class="['competitive-env-tr', { 'competitive-env-tr-highlighted': highlightedRowIndex === idx }]"
-                                                                    @mouseenter="highlightRow(idx)"
-                                                                    @mouseleave="highlightRow(null)"
-                                                                    @click="handleRowClick(competitor)"
-                                                                >
-                                                                    <td class="competitive-env-td font-semibold">
-                                                                        <i class="pi pi-building text-primary-500 mr-2"></i>{{ competitor.name }}
-                                                                    </td>
-                                                                    <td class="competitive-env-td">
-                                                                        <a 
-                                                                            v-if="competitor.website" 
-                                                                            :href="getFullUrl(competitor.website)" 
-                                                                            target="_blank" 
-                                                                            rel="noopener noreferrer"
-                                                                            class="text-primary-500 hover:text-primary-700 dark:hover:text-primary-400 flex align-items-center"
-                                                                            @click.stop
-                                                                        >
-                                                                            <i class="pi pi-external-link mr-1"></i>
-                                                                            <span class="text-sm">{{ formatWebsite(competitor.website) }}</span>
-                                                                        </a>
-                                                                        <span v-else class="text-surface-400">—</span>
-                                                                    </td>
-                                                                    <td class="competitive-env-td text-center">
-                                                                        <div class="flex align-items-center justify-content-center">
-                                                                            <span 
-                                                                                class="competitive-env-score-badge"
-                                                                                :class="getScoreClass(competitor.visibility_score)"
-                                                                            >
-                                                                                {{ competitor.visibility_score || 0 }}%
-                                                                            </span>
-                                                                        </div>
-                                                                    </td>
-                                                                    <td class="competitive-env-td">
-                                                                        <div v-if="competitor.key_strengths && competitor.key_strengths.length > 0" class="flex flex-wrap gap-1">
-                                                                            <Tag 
-                                                                                v-for="(strength, sIdx) in competitor.key_strengths" 
-                                                                                :key="sIdx"
-                                                                                :value="strength"
-                                                                                severity="success"
-                                                                                class="text-xs"
-                                                                            />
-                                                                        </div>
-                                                                        <span v-else class="text-surface-400">—</span>
-                                                                    </td>
-                                                                    <td class="competitive-env-td text-center">
-                                                                        <Tag 
-                                                                            v-if="competitor.price_segment"
-                                                                            :value="competitor.price_segment"
-                                                                            :severity="getPriceSegmentSeverity(competitor.price_segment)"
-                                                                        />
-                                                                        <span v-else class="text-surface-400">—</span>
-                                                                    </td>
-                                                                </tr>
-                                                            </tbody>
-                                                        </table>
-                                                    </div>
-                                                </div>
-
-                                                <!-- Conclusion -->
-                                                <div v-if="segment.conclusion" class="mt-6">
-                                                    <div class="p-4 border-round bg-primary-50 dark:bg-primary-900 border-1 border-primary-200 dark:border-primary-700">
-                                                        <div class="flex align-items-start">
-                                                            <i class="pi pi-info-circle text-primary-500 mr-2 mt-1 flex-shrink-0"></i>
-                                                            <div>
-                                                                <h4 class="text-lg font-semibold text-primary-700 dark:text-primary-300 mb-2">Заключение</h4>
-                                                                <p class="text-surface-700 dark:text-surface-300 m-0">{{ segment.conclusion }}</p>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <div v-else-if="segment.type === 'competitors'">
-                                            <div class="mb-4">
-                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-chart-line mr-2"></i>Анализ конкурентов</h3>
-                                            </div>
-                                            <!-- Market Share Chart (if included in competitors segment) -->
-                                            <div v-if="segment.marketShareChart" class="mb-6">
-                                                <div class="flex align-items-center mb-3">
-                                                    <i class="pi pi-chart-pie text-primary-500 mr-2"></i>
-                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ segment.marketShareChart.title }}</h4>
-                                                </div>
-                                                <div class="chart-container" :style="segment.marketShareChart.chartHeight">
-                                                    <Chart v-if="hasRenderableChartData(segment.marketShareChart.data)" :type="segment.marketShareChart.chartType" :data="segment.marketShareChart.data" :options="segment.marketShareChart.options" />
-                                                    <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
-                                                </div>
-                                            </div>
-
-                                            <!-- Comparison Table (if included in competitors segment) -->
-                                            <div v-if="segment.comparisonTable" class="mb-6">
-                                                <div class="flex align-items-center mb-3">
-                                                    <i class="pi pi-table text-primary-500 mr-2"></i>
-                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Сравнительная таблица</h4>
-                                                </div>
-                                                <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-                                                    <table class="comparison-table w-full border-collapse">
-                                                        <thead>
-                                                            <tr>
-                                                                <th class="comparison-table-th">Характеристика</th>
-                                                                <th class="comparison-table-th text-center">Мы</th>
-                                                                <th class="comparison-table-th text-center">Конкурент A</th>
-                                                                <th class="comparison-table-th text-center">Конкурент B</th>
-                                                            </tr>
-                                                        </thead>
-                                                        <tbody>
-                                                            <tr v-for="(row, idx) in segment.comparisonTable.data" :key="idx" class="comparison-table-tr">
-                                                                <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
-                                                                <td class="comparison-table-td text-center">
-                                                                    <Tag :value="row.us" severity="info" />
-                                                                </td>
-                                                                <td class="comparison-table-td text-center">
-                                                                    <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
-                                                                </td>
-                                                                <td class="comparison-table-td text-center">
-                                                                    <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
-                                                                </td>
-                                                            </tr>
-                                                        </tbody>
-                                                    </table>
-                                                </div>
-                                            </div>
-                                            <div class="grid">
-                                                <div v-for="competitor in segment.competitors" :key="competitor.name" class="col-12 md:col-6 lg:col-4 mb-4">
-                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full flex flex-column">
-                                                        <h4 class="text-lg font-semibold mb-3 text-surface-900 dark:text-surface-0 flex align-items-center"><i class="pi pi-building text-primary-500 mr-2"></i>{{ competitor.name }}</h4>
-                                                        <div class="space-y-2 mb-3 flex-grow-1">
-                                                            <div class="flex justify-content-between align-items-center">
-                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-eye mr-1"></i>Охват: </span>
-                                                                <span class="font-semibold text-surface-900 dark:text-surface-0">{{ competitor.reach?.toLocaleString() || 0 }}</span>
-                                                            </div>
-                                                            <div v-if="competitor.followers" class="flex justify-content-between align-items-center">
-                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-users mr-1"></i>Подписчики: </span>
-                                                                <span class="font-semibold text-surface-900 dark:text-surface-0">{{ competitor.followers?.toLocaleString() || 0 }}</span>
-                                                            </div>
-                                                            <div class="flex justify-content-between align-items-center">
-                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-chart-bar mr-1"></i>Активность: </span>
-                                                                <span class="font-semibold text-surface-900 dark:text-surface-0">{{ competitor.activity }}%</span>
-                                                            </div>
-                                                            <div v-if="competitor.priceStrategy" class="flex justify-content-between align-items-center">
-                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-tag mr-1"></i>Ценовая стратегия: </span>
-                                                                <Tag
-                                                                    :value="competitor.priceStrategy"
-                                                                    :severity="competitor.priceStrategy === 'Высокая' || competitor.priceStrategy === 'Премиум' ? 'danger' : competitor.priceStrategy === 'Низкая' ? 'success' : 'warning'"
-                                                                />
-                                                            </div>
-                                                        </div>
-                                                        <div v-if="competitor.strengths?.length" class="mb-3">
-                                                            <p class="text-sm font-semibold mb-2 text-green-600 dark:text-green-400 flex align-items-center"><i class="pi pi-arrow-up mr-1"></i>Сильные стороны:</p>
-                                                            <ul class="list-none p-0 m-0">
-                                                                <li v-for="(strength, idx) in competitor.strengths" :key="idx" class="text-sm text-surface-700 dark:text-surface-300 mb-1 flex align-items-start">
-                                                                    <i class="pi pi-check-circle text-green-500 mr-2 mt-1 flex-shrink-0"></i>
-                                                                    <span>{{ strength }}</span>
-                                                                </li>
-                                                            </ul>
-                                                        </div>
-                                                        <div v-if="competitor.weaknesses?.length">
-                                                            <p class="text-sm font-semibold mb-2 text-red-600 dark:text-red-400 flex align-items-center"><i class="pi pi-arrow-down mr-1"></i>Слабые стороны:</p>
-                                                            <ul class="list-none p-0 m-0">
-                                                                <li v-for="(weakness, idx) in competitor.weaknesses" :key="idx" class="text-sm text-surface-700 dark:text-surface-300 mb-1 flex align-items-start">
-                                                                    <i class="pi pi-times-circle text-red-500 mr-2 mt-1 flex-shrink-0"></i>
-                                                                    <span>{{ weakness }}</span>
-                                                                </li>
-                                                            </ul>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-
-                                            <!-- Competitors Heatmap -->
-                                            <div v-if="segment.competitorsHeatmap" class="mt-6">
-                                                <div class="flex align-items-center mb-3">
-                                                    <i class="pi pi-map text-primary-500 mr-2"></i>
-                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Тепловая карта каналов конкурентов</h4>
-                                                </div>
-                                                <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-                                                    <table class="competitors-heatmap-table w-full border-collapse">
-                                                        <thead>
-                                                            <tr>
-                                                                <th class="competitors-heatmap-th">Конкурент</th>
-                                                                <th v-for="channel in segment.competitorsHeatmap.channels" :key="channel" class="competitors-heatmap-th text-center">
-                                                                    {{ channel }}
-                                                                </th>
-                                                            </tr>
-                                                        </thead>
-                                                        <tbody>
-                                                            <tr v-for="(compData, idx) in segment.competitorsHeatmap.data" :key="idx" class="competitors-heatmap-tr">
-                                                                <td class="competitors-heatmap-td font-semibold">{{ compData.name }}</td>
-                                                                <td v-for="channel in segment.competitorsHeatmap.channels" :key="channel" class="competitors-heatmap-td text-center">
-                                                                    <span class="competitors-heatmap-badge" :style="{ backgroundColor: getHeatmapColor(compData.channelsHeatmap[channel] || 0) }">
-                                                                        {{ compData.channelsHeatmap[channel] || 0 }}
-                                                                    </span>
-                                                                </td>
-                                                            </tr>
-                                                        </tbody>
-                                                    </table>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Market Share Chart -->
-                                        <div v-else-if="segment.type === 'marketShareChart'">
-                                            <div class="mb-4" v-if="segment.title">
-                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-chart-pie mr-2"></i>{{ segment.title }}</h3>
-                                            </div>
-                                            <div class="chart-container" :style="segment.chartHeight">
-                                                <Chart v-if="hasRenderableChartData(segment.data)" :type="segment.chartType" :data="segment.data" :options="segment.options" />
-                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Comparison Table -->
-                                        <div v-else-if="segment.type === 'comparisonTable'">
-                                            <div class="mb-4">
-                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-table mr-2"></i>Сравнительная таблица</h3>
-                                            </div>
-                                            <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
-                                                <table class="comparison-table w-full border-collapse">
-                                                    <thead>
-                                                        <tr>
-                                                            <th class="comparison-table-th">Характеристика</th>
-                                                            <th class="comparison-table-th text-center">Мы</th>
-                                                            <th class="comparison-table-th text-center">Конкурент A</th>
-                                                            <th class="comparison-table-th text-center">Конкурент B</th>
-                                                        </tr>
-                                                    </thead>
-                                                    <tbody>
-                                                        <tr v-for="(row, idx) in segment.data" :key="idx" class="comparison-table-tr">
-                                                            <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
-                                                            <td class="comparison-table-td text-center">
-                                                                <Tag :value="row.us" severity="info" />
-                                                            </td>
-                                                            <td class="comparison-table-td text-center">
-                                                                <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
-                                                            </td>
-                                                            <td class="comparison-table-td text-center">
-                                                                <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
-                                                            </td>
-                                                        </tr>
-                                                    </tbody>
-                                                </table>
-                                            </div>
-                                        </div>
-
-                                        <!-- SWOT Competitors -->
-                                        <div v-else-if="segment.type === 'swotCompetitors'">
-                                            <div class="mb-4">
-                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-sitemap mr-2"></i>SWOT-анализ конкурентов</h3>
-                                            </div>
-                                            <div class="grid">
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-green-50 dark:bg-green-900 border-1 border-green-200 dark:border-green-700 h-full">
-                                                        <h4 class="text-lg font-semibold mb-3 text-green-700 dark:text-green-300 flex align-items-center"><i class="pi pi-arrow-up mr-2"></i>Сильные стороны</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(strength, idx) in segment.data.strengths" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2 flex align-items-start">
-                                                                <i class="pi pi-check-circle text-green-500 mr-2 mt-1 flex-shrink-0"></i>
-                                                                <span>{{ strength }}</span>
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-red-50 dark:bg-red-900 border-1 border-red-200 dark:border-red-700 h-full">
-                                                        <h4 class="text-lg font-semibold mb-3 text-red-700 dark:text-red-300 flex align-items-center"><i class="pi pi-arrow-down mr-2"></i>Слабые стороны</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(weakness, idx) in segment.data.weaknesses" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2 flex align-items-start">
-                                                                <i class="pi pi-times-circle text-red-500 mr-2 mt-1 flex-shrink-0"></i>
-                                                                <span>{{ weakness }}</span>
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <!-- Market -->
-                                        <div v-else-if="segment.type === 'market'">
-                                            <div class="mb-4">
-                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-globe mr-2"></i>Анализ рынка</h3>
-                                            </div>
-                                            <div class="grid mb-4">
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700">
-                                                        <div class="flex align-items-center mb-2">
-                                                            <i class="pi pi-chart-bar text-primary-500 mr-2"></i>
-                                                            <h4 class="text-sm font-semibold text-surface-600 dark:text-surface-400 m-0">Размер рынка</h4>
-                                                        </div>
-                                                        <p class="text-lg font-bold text-surface-900 dark:text-surface-0 mt-2">{{ segment.data.size || 'Не указано' }}</p>
-                                                    </div>
-                                                </div>
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700">
-                                                        <div class="flex align-items-center mb-2">
-                                                            <i class="pi pi-arrow-up-right text-primary-500 mr-2"></i>
-                                                            <h4 class="text-sm font-semibold text-surface-600 dark:text-surface-400 m-0">Темп роста</h4>
-                                                        </div>
-                                                        <p class="text-lg font-bold text-surface-900 dark:text-surface-0 mt-2">{{ segment.data.growthRate || 'Не указано' }}</p>
-                                                    </div>
-                                                </div>
-                                            </div>
-
-                                            <div v-if="segment.data.trends && segment.data.trends.length > 0" class="mb-4">
-                                                <div class="flex align-items-center mb-3">
-                                                    <i class="pi pi-trending-up text-primary-500 mr-2"></i>
-                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Тренды</h4>
-                                                </div>
-                                                <div class="p-4 border-round bg-blue-50 dark:bg-blue-900 border-1 border-blue-200 dark:border-blue-700">
-                                                    <ul class="list-none p-0 m-0">
-                                                        <li v-for="(trend, idx) in segment.data.trends" :key="idx" class="flex align-items-start mb-2">
-                                                            <i class="pi pi-arrow-up-right text-blue-500 mr-2 mt-1 flex-shrink-0"></i>
-                                                            <span class="text-surface-700 dark:text-surface-300">{{ trend }}</span>
-                                                        </li>
-                                                    </ul>
-                                                </div>
-                                            </div>
-
-                                            <div class="grid">
-                                                <div v-if="segment.data.opportunities && segment.data.opportunities.length > 0" class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-blue-50 dark:bg-blue-900 border-1 border-blue-200 dark:border-blue-700">
-                                                        <h4 class="text-lg font-semibold mb-3 text-blue-700 dark:text-blue-300">Возможности</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(opportunity, idx) in segment.data.opportunities" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
-                                                                <i class="pi pi-arrow-up-circle text-blue-500 mr-2"></i>{{ opportunity }}
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                                <div v-if="segment.data.threats && segment.data.threats.length > 0" class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-orange-50 dark:bg-orange-900 border-1 border-orange-200 dark:border-orange-700">
-                                                        <h4 class="text-lg font-semibold mb-3 text-orange-700 dark:text-orange-300">Угрозы</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(threat, idx) in segment.data.threats" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
-                                                                <i class="pi pi-exclamation-triangle text-orange-500 mr-2"></i>{{ threat }}
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-
-                                        <div v-else-if="segment.type === 'swot'">
-                                            <div class="mb-4">
-                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">SWOT-анализ</h3>
-                                            </div>
-                                            <div class="grid">
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-green-50 dark:bg-green-900 border-1 border-green-200 dark:border-green-700">
-                                                        <h4 class="text-lg font-semibold mb-3 text-green-700 dark:text-green-300">Сильные стороны</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(strength, idx) in segment.data.strengths" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2"><i class="pi pi-check-circle text-green-500 mr-2"></i>{{ strength }}</li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-red-50 dark:bg-red-900 border-1 border-red-200 dark:border-red-700">
-                                                        <h4 class="text-lg font-semibold mb-3 text-red-700 dark:text-red-300">Слабые стороны</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(weakness, idx) in segment.data.weaknesses" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2"><i class="pi pi-times-circle text-red-500 mr-2"></i>{{ weakness }}</li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-blue-50 dark:bg-blue-900 border-1 border-blue-200 dark:border-blue-700">
-                                                        <h4 class="text-lg font-semibold mb-3 text-blue-700 dark:text-blue-300">Возможности</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(opportunity, idx) in segment.data.opportunities" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
-                                                                <i class="pi pi-arrow-up-circle text-blue-500 mr-2"></i>{{ opportunity }}
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                                <div class="col-12 md:col-6 mb-3">
-                                                    <div class="p-4 border-round bg-orange-50 dark:bg-orange-900 border-1 border-orange-200 dark:border-orange-700">
-                                                        <h4 class="text-lg font-semibold mb-3 text-orange-700 dark:text-orange-300">Угрозы</h4>
-                                                        <ul class="list-none p-0 m-0">
-                                                            <li v-for="(threat, idx) in segment.data.threats" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
-                                                                <i class="pi pi-exclamation-triangle text-orange-500 mr-2"></i>{{ threat }}
-                                                            </li>
-                                                        </ul>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <!-- Fallback for unrecognized segment types - don't display raw JSON -->
-                                        <div v-else-if="segment && segment.type">
-                                            <p class="text-surface-600 dark:text-surface-400">Неизвестный тип сегмента: {{ segment.type }}</p>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- Рекомендации -->
-                        <div v-if="report.recommendations?.length" class="card">
-                            <div class="card-header mb-4">
-                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Рекомендации</h3>
-                            </div>
-                            <div class="card-content">
-                                <ul class="list-none p-0 m-0">
-                                    <li v-for="(recommendation, index) in report.recommendations" :key="index" class="flex align-items-start mb-3">
-                                        <i class="pi pi-check-circle text-green-500 mr-2 mt-1"></i>
-                                        <span class="text-surface-700 dark:text-surface-300">{{ recommendation }}</span>
-                                    </li>
-                                </ul>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Кнопки действий (всегда видны, когда есть анализ) -->
-                <div v-if="(status === 'completed' && report) || v2ReportNormalized" class="card">
-                    <div class="card-content text-center">
-                        <div class="flex gap-3 justify-content-center flex-wrap">
-                            <Button label="Создать стратегию на основе анализа" icon="pi pi-magic" severity="success" @click="goToStrategy" />
-                            <Button label="Создать новый анализ" icon="pi pi-plus" severity="secondary" @click="resetAnalysis" />
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import SegmentsChannelMatrixHeatmap from '@/components/marketing/SegmentsChannelMatrixHeatmap.vue';
 import MarketingService from '@/service/MarketingService';
 import MarketingAnalysisPptDashboard from '@/views/pages/MarketingAnalysis.vue';
@@ -1121,8 +157,8 @@ const drawBarValues = (chart) => {
                 if (value !== null && value !== undefined && value != 0) {
                     let label = value.toLocaleString();
                     // Если это проценты, добавляем знак %
-                    if ((dataset.unit === '%') || (typeof dataset.data[index] === 'string' && String(dataset.data[index]).includes('%'))) {
-                         label = String(value).replace('%', '') + '%';
+                    if (dataset.unit === '%' || (typeof dataset.data[index] === 'string' && String(dataset.data[index]).includes('%'))) {
+                        label = String(value).replace('%', '') + '%';
                     }
 
                     const isHorizontal = meta.indexAxis === 'y';
@@ -1255,8 +291,8 @@ const getMarketingColors = (count, offset = 0) => {
 
 const parsePercentageData = (obj) => {
     if (!obj || typeof obj !== 'object') return { labels: [], values: [] };
-    const labels = Object.keys(obj).map(k => k.replace(/_/g, ' '));
-    const values = Object.values(obj).map(v => {
+    const labels = Object.keys(obj).map((k) => k.replace(/_/g, ' '));
+    const values = Object.values(obj).map((v) => {
         if (typeof v === 'string') return parseFloat(v.replace('%', ''));
         return v;
     });
@@ -1958,7 +994,6 @@ const pushMarkdownTokens = (segments, markdownChunk) => {
     }
 };
 
-
 const buildSeasonalityChartData = (seasonality) => {
     if (!seasonality || typeof seasonality !== 'object') return null;
 
@@ -2193,7 +1228,7 @@ const processCompetitiveEnvironmentData = (competitiveEnv) => {
                               beginAtZero: true,
                               max: 100,
                               ticks: {
-                                  callback: function(value) {
+                                  callback: function (value) {
                                       return value + '%';
                                   },
                                   font: { size: 12 }
@@ -2271,14 +1306,15 @@ const buildChannelsChartData = (acquisitionChannels) => {
     if (!shares || typeof shares !== 'object') return null;
 
     // Превращаем ключи "instagram_target" в "Instagram Target"
-    const labels = Object.keys(shares).map(key =>
-        key.split('_').map(w => w.charAt(0).toUpperCase() + w.slice(1)).join(' ')
+    const labels = Object.keys(shares).map((key) =>
+        key
+            .split('_')
+            .map((w) => w.charAt(0).toUpperCase() + w.slice(1))
+            .join(' ')
     );
 
     // Чистим значения от знака % для графика
-    const values = Object.values(shares).map(val =>
-        (typeof val === 'string') ? parseFloat(val.replace('%', '')) : val
-    );
+    const values = Object.values(shares).map((val) => (typeof val === 'string' ? parseFloat(val.replace('%', '')) : val));
 
     return {
         labels: labels,
@@ -2376,13 +1412,15 @@ const mapChartsDataToSegments = (chartsData) => {
                 chartType: 'bar',
                 data: {
                     labels,
-                    datasets: [{
-                        data: values,
-                        backgroundColor: '#fb923c', // Оранжевый
-                        borderRadius: 8,
-                        barPercentage: 0.7,
-                        unit: '%'
-                    }]
+                    datasets: [
+                        {
+                            data: values,
+                            backgroundColor: '#fb923c', // Оранжевый
+                            borderRadius: 8,
+                            barPercentage: 0.7,
+                            unit: '%'
+                        }
+                    ]
                 },
                 options: photoStyleBarOptions, // <-- Стиль как на фото (цифры внутри)
                 chartHeight: 'height: 300px'
@@ -2400,13 +1438,15 @@ const mapChartsDataToSegments = (chartsData) => {
                 chartType: 'bar',
                 data: {
                     labels,
-                    datasets: [{
-                        data: values,
-                        backgroundColor: '#818cf8', // Сиреневый
-                        borderRadius: 8,
-                        barPercentage: 0.7,
-                        unit: '%'
-                    }]
+                    datasets: [
+                        {
+                            data: values,
+                            backgroundColor: '#818cf8', // Сиреневый
+                            borderRadius: 8,
+                            barPercentage: 0.7,
+                            unit: '%'
+                        }
+                    ]
                 },
                 options: photoStyleBarOptions,
                 chartHeight: 'height: 300px'
@@ -2428,14 +1468,16 @@ const mapChartsDataToSegments = (chartsData) => {
                 chartType: 'bar',
                 data: {
                     labels,
-                    datasets: [{
-                        data: values,
-                        // !!! ЦВЕТ КАК НА ФОТО (СИНИЙ) !!!
-                        backgroundColor: '#60a5fa',
-                        borderRadius: 8, // Скругление
-                        barPercentage: 0.65,
-                        unit: '%'
-                    }]
+                    datasets: [
+                        {
+                            data: values,
+                            // !!! ЦВЕТ КАК НА ФОТО (СИНИЙ) !!!
+                            backgroundColor: '#60a5fa',
+                            borderRadius: 8, // Скругление
+                            barPercentage: 0.65,
+                            unit: '%'
+                        }
+                    ]
                 },
                 options: photoStyleBarOptions, // Белые цифры внутри
                 chartHeight: 'height: 300px'
@@ -2445,7 +1487,8 @@ const mapChartsDataToSegments = (chartsData) => {
         // Доход (Фото 5 - Мятный цвет)
         const incomeData = audienceSection.income_by_age || audienceSection.incomeByAge;
         if (incomeData || audienceSection.metrics?.above_average_income_share) {
-            let labels = [], values = [];
+            let labels = [],
+                values = [];
             if (incomeData) {
                 const parsed = parsePercentageData(incomeData);
                 labels = parsed.labels;
@@ -2462,13 +1505,15 @@ const mapChartsDataToSegments = (chartsData) => {
                 chartType: 'bar',
                 data: {
                     labels,
-                    datasets: [{
-                        data: values,
-                        backgroundColor: '#34d399', // Мятный
-                        borderRadius: 8,
-                        barPercentage: 0.65,
-                        unit: '%'
-                    }]
+                    datasets: [
+                        {
+                            data: values,
+                            backgroundColor: '#34d399', // Мятный
+                            borderRadius: 8,
+                            barPercentage: 0.65,
+                            unit: '%'
+                        }
+                    ]
                 },
                 options: photoStyleBarOptions,
                 chartHeight: 'height: 300px'
@@ -2483,9 +1528,9 @@ const mapChartsDataToSegments = (chartsData) => {
         if (channelShares) {
             const { labels, values } = parsePercentageData(channelShares);
             // Убираем нули
-            const filteredIndices = values.map((v, i) => v > 0 ? i : -1).filter(i => i !== -1);
-            const finalLabels = filteredIndices.map(i => labels[i]);
-            const finalValues = filteredIndices.map(i => values[i]);
+            const filteredIndices = values.map((v, i) => (v > 0 ? i : -1)).filter((i) => i !== -1);
+            const finalLabels = filteredIndices.map((i) => labels[i]);
+            const finalValues = filteredIndices.map((i) => values[i]);
 
             if (finalValues.length > 0) {
                 segments.push({
@@ -2495,13 +1540,15 @@ const mapChartsDataToSegments = (chartsData) => {
                     chartType: 'bar',
                     data: {
                         labels: finalLabels,
-                        datasets: [{
-                            data: finalValues,
-                            backgroundColor: getMarketingColors(finalValues.length), // Разноцветные
-                            borderRadius: 8,
-                            barPercentage: 0.6,
-                            unit: '%'
-                        }]
+                        datasets: [
+                            {
+                                data: finalValues,
+                                backgroundColor: getMarketingColors(finalValues.length), // Разноцветные
+                                borderRadius: 8,
+                                barPercentage: 0.6,
+                                unit: '%'
+                            }
+                        ]
                     },
                     options: photoStyleBarOptions,
                     chartHeight: 'height: 300px'
@@ -2522,14 +1569,16 @@ const mapChartsDataToSegments = (chartsData) => {
                 chartType: 'line',
                 data: {
                     labels: Object.keys(seasonalData),
-                    datasets: [{
-                        label: 'Индекс',
-                        data: Object.values(seasonalData),
-                        borderColor: '#6366f1',
-                        backgroundColor: 'rgba(99, 102, 241, 0.2)',
-                        fill: true,
-                        tension: 0.4
-                    }]
+                    datasets: [
+                        {
+                            label: 'Индекс',
+                            data: Object.values(seasonalData),
+                            borderColor: '#6366f1',
+                            backgroundColor: 'rgba(99, 102, 241, 0.2)',
+                            fill: true,
+                            tension: 0.4
+                        }
+                    ]
                 },
                 options: seasonalityChartOptions,
                 chartHeight: 'height: 350px'
@@ -2540,14 +1589,16 @@ const mapChartsDataToSegments = (chartsData) => {
     // --- LEGACY (Старый код, просто чтобы не ломалось, если придет старый JSON) ---
     if (Array.isArray(chartsData)) {
         if (chartsData.length > 0 && chartsData[0]?.name) {
-            const reachData = chartsData.map(c => c.reach || 0);
-            return [{
-                type: 'chart',
-                title: 'Охват конкурентов',
-                chartType: 'bar',
-                data: { labels: chartsData.map(c => c.name), datasets: [{ data: reachData, backgroundColor: '#60a5fa' }] },
-                options: photoStyleBarOptions
-            }];
+            const reachData = chartsData.map((c) => c.reach || 0);
+            return [
+                {
+                    type: 'chart',
+                    title: 'Охват конкурентов',
+                    chartType: 'bar',
+                    data: { labels: chartsData.map((c) => c.name), datasets: [{ data: reachData, backgroundColor: '#60a5fa' }] },
+                    options: photoStyleBarOptions
+                }
+            ];
         }
         return [];
     }
@@ -3876,6 +2927,954 @@ onBeforeUnmount(() => {
 });
 </script>
 
+<template>
+    <div class="marketing-analysis-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
+        <Toast />
+        <div class="max-w-[1200px] mx-auto">
+            <Message severity="warn" class="mb-4" :closable="false">
+                <strong>Внимание:</strong> Эта версия маркетингового анализа (V1/V2) устарела. Рекомендуется использовать <router-link to="/marketing-analysis/v3" class="font-bold underline text-primary">версию V3</router-link> для получения более
+                точных и современных данных.
+            </Message>
+            <!-- Форма запуска анализа -->
+            <div v-if="!analysisId" class="card">
+                <div class="card-header mb-4">
+                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Запуск анализа</h2>
+                </div>
+                <div class="card-content">
+                    <form @submit.prevent="handleSubmit" class="space-y-4 max-w-2xl">
+                        <div class="field">
+                            <label for="businessNiche" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Ниша бизнеса * </label>
+                            <InputText id="businessNiche" v-model="formData.businessNiche" placeholder="Например: E-commerce платформы" class="w-full" :class="{ 'p-invalid': errors.businessNiche }" />
+                            <small v-if="errors.businessNiche" class="p-error">{{ errors.businessNiche }}</small>
+                        </div>
+
+                        <div class="field">
+                            <label for="product" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Что вы продаете? * </label>
+                            <InputText id="product" v-model="formData.product" placeholder="Введите название продукта или услуги" class="w-full" :class="{ 'p-invalid': errors.product }" />
+                            <small v-if="errors.product" class="p-error">{{ errors.product }}</small>
+                        </div>
+
+                        <div class="field">
+                            <label class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Целевая аудитория * </label>
+
+                            <!-- Гендер -->
+                            <div class="mb-3">
+                                <label class="block text-sm font-medium mb-2 text-surface-600 dark:text-surface-400">Гендер:</label>
+                                <div class="flex gap-4 flex-wrap">
+                                    <div v-for="gender in VALID_GENDERS" :key="gender" class="flex align-items-center">
+                                        <Checkbox :inputId="`gender-${gender}`" :value="gender" v-model="formData.targetAudience.genders" />
+                                        <label :for="`gender-${gender}`" class="ml-2 cursor-pointer">{{ gender }}</label>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Возраст -->
+                            <div class="mb-3">
+                                <label class="block text-sm font-medium mb-2 text-surface-600 dark:text-surface-400">Возраст:</label>
+                                <div class="flex gap-4 flex-wrap">
+                                    <div v-for="age in VALID_AGE_RANGES" :key="age" class="flex align-items-center">
+                                        <Checkbox :inputId="`age-${age}`" :value="age" v-model="formData.targetAudience.ageRanges" />
+                                        <label :for="`age-${age}`" class="ml-2 cursor-pointer">{{ age }}</label>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Тип -->
+                            <div class="mb-3">
+                                <label class="block text-sm font-medium mb-2 text-surface-600 dark:text-surface-400">Тип:</label>
+                                <div class="flex gap-4 flex-wrap">
+                                    <div v-for="type in VALID_AUDIENCE_TYPES" :key="type" class="flex align-items-center">
+                                        <Checkbox :inputId="`type-${type}`" :value="type" v-model="formData.targetAudience.types" />
+                                        <label :for="`type-${type}`" class="ml-2 cursor-pointer">{{ type }}</label>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Отображение выбранных значений -->
+                            <div v-if="formData.targetAudience.genders.length > 0 || formData.targetAudience.ageRanges.length > 0 || formData.targetAudience.types.length > 0" class="mt-2 p-2 border-round bg-surface-100 dark:bg-surface-800">
+                                <small class="text-surface-600 dark:text-surface-400">
+                                    <strong>Выбрано:</strong>
+                                    <span v-if="formData.targetAudience.genders.length > 0"> Гендер: {{ formData.targetAudience.genders.join(', ') }}</span>
+                                    <span v-if="formData.targetAudience.ageRanges.length > 0"> Возраст: {{ formData.targetAudience.ageRanges.join(', ') }}</span>
+                                    <span v-if="formData.targetAudience.types.length > 0"> Тип: {{ formData.targetAudience.types.join(', ') }}</span>
+                                </small>
+                            </div>
+
+                            <small v-if="errors.targetAudience" class="p-error">{{ errors.targetAudience }}</small>
+                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите хотя бы одну опцию для целевой аудитории</small>
+                        </div>
+
+                        <div class="field">
+                            <label for="region" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Регион (город Казахстана) * </label>
+                            <MultiSelect id="region" v-model="formData.region" :options="VALID_REGIONS" placeholder="Выберите регионы" class="w-full" display="chip" :class="{ 'p-invalid': errors.region }" />
+                            <small v-if="errors.region" class="p-error">{{ errors.region }}</small>
+                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите один или несколько регионов</small>
+                        </div>
+
+                        <div class="field">
+                            <label for="goal" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Цель на 6-12 месяцев * </label>
+                            <Textarea id="goal" v-model="formData.goal" placeholder="Опишите вашу цель на ближайшие 6-12 месяцев" rows="3" class="w-full" :class="{ 'p-invalid': errors.goal }" />
+                            <small v-if="errors.goal" class="p-error">{{ errors.goal }}</small>
+                        </div>
+
+                        <div class="field">
+                            <label class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Уровень детализации анализа * </label>
+                            <div class="flex gap-4">
+                                <div v-for="level in DETAIL_LEVELS" :key="level" class="flex align-items-center">
+                                    <RadioButton :inputId="`detailLevel-${level}`" v-model="formData.detailLevel" :value="level" :class="{ 'p-invalid': errors.detailLevel }" />
+                                    <label :for="`detailLevel-${level}`" class="ml-2 cursor-pointer">
+                                        {{ level === 'КРАТКО' ? 'Кратко' : level === 'СТАНДАРТНО' ? 'Стандартно' : 'Подробно' }}
+                                    </label>
+                                </div>
+                            </div>
+                            <small v-if="errors.detailLevel" class="p-error">{{ errors.detailLevel }}</small>
+                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите уровень детализации анализа</small>
+                        </div>
+
+                        <div class="field">
+                            <label for="strongSide" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Сильная сторона бизнеса </label>
+                            <Textarea id="strongSide" v-model="formData.strongSide" placeholder="Опишите сильные стороны вашего бизнеса (опционально)" rows="2" class="w-full" :class="{ 'p-invalid': errors.strongSide }" />
+                            <small v-if="errors.strongSide" class="p-error">{{ errors.strongSide }}</small>
+                        </div>
+
+                        <div class="field">
+                            <label for="weakSide" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Слабая сторона бизнеса </label>
+                            <Textarea id="weakSide" v-model="formData.weakSide" placeholder="Опишите слабые стороны вашего бизнеса (опционально)" rows="2" class="w-full" :class="{ 'p-invalid': errors.weakSide }" />
+                            <small v-if="errors.weakSide" class="p-error">{{ errors.weakSide }}</small>
+                        </div>
+
+                        <!-- <div class="field">
+                            <label for="marketingBudget" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Бюджет на маркетинг </label>
+                            <InputNumber id="marketingBudget" v-model="formData.marketingBudget" :min="0" placeholder="Введите бюджет в тенге" class="w-full" :class="{ 'p-invalid': errors.marketingBudget }" />
+                            <small v-if="errors.marketingBudget" class="p-error">{{ errors.marketingBudget }}</small>
+                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Укажите ваш бюджет на маркетинг (опционально)</small>
+                        </div> -->
+
+                        <div class="field">
+                            <label for="analysisType" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Тип анализа * </label>
+                            <MultiSelect id="analysisType" v-model="formData.analysisType" :options="VALID_ANALYSIS_TYPES" placeholder="Выберите типы анализа" class="w-full" display="chip" :class="{ 'p-invalid': errors.analysisType }">
+                                <template #value="slotProps">
+                                    <div v-if="slotProps.value && slotProps.value.length > 0" class="flex flex-wrap gap-2">
+                                        <Tag v-for="type in slotProps.value" :key="type" :value="getAnalysisTypeLabel(type)" severity="info" />
+                                    </div>
+                                    <span v-else class="text-surface-400">{{ slotProps.placeholder }}</span>
+                                </template>
+                                <template #option="slotProps">
+                                    <div class="flex align-items-center">
+                                        <span>{{ getAnalysisTypeLabel(slotProps.option) }}</span>
+                                    </div>
+                                </template>
+                            </MultiSelect>
+                            <small v-if="errors.analysisType" class="p-error">{{ errors.analysisType }}</small>
+                            <small class="text-surface-500 dark:text-surface-400 mt-1 block">Выберите один или несколько типов анализа. При выборе нескольких типов будут созданы отдельные анализы для каждого типа.</small>
+                        </div>
+
+                        <Button type="submit" label="Начать анализ" icon="pi pi-send" class="w-full p-button-primary" :loading="submitting" />
+
+                        <p class="text-sm text-surface-500 dark:text-surface-400 mt-3 text-center">На основе ваших ответов будет создан подробный и полезный маркетинговый отчет</p>
+                    </form>
+                </div>
+            </div>
+
+            <!-- Единая страница: v2 dashboard сверху + старый анализ ниже -->
+            <div v-else class="space-y-4">
+                <!-- v2 Dashboard (показываем первым) -->
+                <div v-if="v2Loading || v2ReportNormalized" class="card">
+                    <div class="card-content">
+                        <MarketingAnalysisPptDashboard embedded :report="v2ReportNormalized" :loading="v2Loading" :error="v2Error" />
+                    </div>
+                </div>
+
+                <!-- Статус обработки (старый анализ) -->
+                <div v-if="status === 'processing' || status === 'queued'" class="space-y-4">
+                    <!-- Заголовок с кнопкой -->
+                    <div class="card">
+                        <div class="card-header mb-4">
+                            <div class="flex flex-wrap justify-content-between align-items-center gap-3">
+                                <div class="flex-1 min-w-0">
+                                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Анализ выполняется</h2>
+                                </div>
+                                <div class="flex gap-2 align-items-center flex-shrink-0">
+                                    <Button :label="isAnalysisOpen ? 'Скрыть анализ' : 'Показать анализ'" :icon="isAnalysisOpen ? 'pi pi-chevron-up' : 'pi pi-chevron-down'" severity="secondary" outlined @click="isAnalysisOpen = !isAnalysisOpen" />
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div v-show="isAnalysisOpen" class="card">
+                        <div class="card-content">
+                            <div class="text-center py-6">
+                                <ProgressSpinner size="50" />
+                                <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Анализ обрабатывается...</p>
+                                <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Это может занять 5-10 минут. Пожалуйста, подождите.</p>
+                                <p v-if="estimatedCompletionTime" class="mt-2 text-sm text-surface-500 dark:text-surface-400">Ожидаемое время завершения: {{ formatDateTime(estimatedCompletionTime) }}</p>
+                                <Button label="Отменить" icon="pi pi-times" severity="secondary" class="mt-4" @click="resetAnalysis" />
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Ошибка -->
+                <div v-else-if="status === 'failed'" class="card">
+                    <div class="card-header mb-4">
+                        <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Ошибка анализа</h2>
+                    </div>
+                    <div class="card-content">
+                        <div class="text-center py-6">
+                            <i class="pi pi-exclamation-triangle text-6xl text-red-500 mb-3"></i>
+                            <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Анализ завершился с ошибкой</p>
+                            <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Попробуйте запустить анализ снова или обратитесь в поддержку.</p>
+                            <Button label="Попробовать снова" icon="pi pi-refresh" class="mt-4" @click="resetAnalysis" />
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Результаты анализа -->
+                <div v-else-if="status === 'completed' && report" class="space-y-4">
+                    <!-- Заголовок с кнопкой скачивания -->
+                    <div class="card">
+                        <div class="card-header mb-4">
+                            <div class="flex flex-wrap justify-content-between align-items-center gap-3">
+                                <div class="flex-1 min-w-0">
+                                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Результаты анализа</h2>
+                                    <div v-if="currentAnalysisType" class="mt-2">
+                                        <Tag :value="getAnalysisTypeLabel(currentAnalysisType)" severity="info" />
+                                    </div>
+                                </div>
+                                <div class="flex gap-2 align-items-center flex-shrink-0">
+                                    <Button :label="isAnalysisOpen ? 'Скрыть анализ' : 'Показать анализ'" :icon="isAnalysisOpen ? 'pi pi-chevron-up' : 'pi pi-chevron-down'" severity="secondary" outlined @click="isAnalysisOpen = !isAnalysisOpen" />
+                                    <Button label="Скачать PDF" icon="pi pi-download" @click="handleDownloadPdf" :loading="downloadingPdf" />
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div v-show="isAnalysisOpen" class="space-y-4">
+                        <!-- Краткое резюме (Summary) -->
+                        <div v-if="report.summary" class="card">
+                            <div class="card-header mb-4">
+                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-file-edit mr-2"></i>Краткое резюме</h3>
+                            </div>
+                            <div class="card-content">
+                                <div class="markdown-content" v-html="renderMarkdown(report.summary)"></div>
+                            </div>
+                        </div>
+
+                        <!-- Динамическое содержимое отчета (в одном контейнере) -->
+                        <div v-if="parsedContent.length" class="card">
+                            <div class="card-content">
+                                <div class="space-y-6">
+                                    <div v-for="(segment, index) in displayContent" :key="index">
+                                        <!-- Two-column pair: paragraph text + adjacent json-chart/table -->
+                                        <div v-if="segment.type === 'paired'" class="report-pair">
+                                            <!-- IMPORTANT: preserve original markdown order in DOM -->
+                                            <template v-if="segment.order === 'text-media'">
+                                                <div class="report-pair__text">
+                                                    <div class="report-pair__textStack">
+                                                        <div v-for="(t, tIdx) in segment.texts || []" :key="tIdx" class="markdown-content" v-html="t.html"></div>
+                                                    </div>
+                                                </div>
+
+                                                <div class="report-pair__media">
+                                                    <div v-if="segment.media.type === 'chart'">
+                                                        <div class="report-pair__mediaChart">
+                                                            <div class="chart-container report-pair__chart-container">
+                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
+                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                                            </div>
+                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
+                                                        </div>
+                                                        <div v-if="segment.media.key === 'channelsPotential' && segment.media.channels?.length" class="mt-4 space-y-2">
+                                                            <div v-for="channel in segment.media.channels" :key="channel.name" class="p-3 border-round bg-surface-50 dark:bg-surface-800">
+                                                                <div class="flex justify-content-between align-items-center mb-2">
+                                                                    <span class="font-semibold text-surface-900 dark:text-surface-0">{{ channel.name }}</span>
+                                                                    <Tag :value="`Потенциал: ${channel.potential}`" :severity="channel.potential >= 80 ? 'success' : channel.potential >= 60 ? 'warning' : 'info'" />
+                                                                </div>
+                                                                <p class="text-sm text-surface-600 dark:text-surface-400">{{ channel.justification }}</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div v-else-if="segment.media.type === 'marketShareChart'">
+                                                        <div class="report-pair__mediaChart">
+                                                            <div class="chart-container report-pair__chart-container">
+                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
+                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                                            </div>
+                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div v-else-if="segment.media.type === 'comparisonTable'">
+                                                        <div class="mb-4">
+                                                            <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-table mr-2"></i>Сравнительная таблица</h3>
+                                                        </div>
+                                                        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+                                                            <table class="comparison-table w-full border-collapse">
+                                                                <thead>
+                                                                    <tr>
+                                                                        <th class="comparison-table-th">Характеристика</th>
+                                                                        <th class="comparison-table-th text-center">Мы</th>
+                                                                        <th class="comparison-table-th text-center">Конкурент A</th>
+                                                                        <th class="comparison-table-th text-center">Конкурент B</th>
+                                                                    </tr>
+                                                                </thead>
+                                                                <tbody>
+                                                                    <tr v-for="(row, idx) in segment.media.data" :key="idx" class="comparison-table-tr">
+                                                                        <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
+                                                                        <td class="comparison-table-td text-center">
+                                                                            <Tag :value="row.us" severity="info" />
+                                                                        </td>
+                                                                        <td class="comparison-table-td text-center">
+                                                                            <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
+                                                                        </td>
+                                                                        <td class="comparison-table-td text-center">
+                                                                            <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </template>
+
+                                            <template v-else>
+                                                <div class="report-pair__media">
+                                                    <div v-if="segment.media.type === 'chart'">
+                                                        <div class="report-pair__mediaChart">
+                                                            <div class="chart-container report-pair__chart-container">
+                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
+                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                                            </div>
+                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
+                                                        </div>
+                                                        <div v-if="segment.media.key === 'channelsPotential' && segment.media.channels?.length" class="mt-4 space-y-2">
+                                                            <div v-for="channel in segment.media.channels" :key="channel.name" class="p-3 border-round bg-surface-50 dark:bg-surface-800">
+                                                                <div class="flex justify-content-between align-items-center mb-2">
+                                                                    <span class="font-semibold text-surface-900 dark:text-surface-0">{{ channel.name }}</span>
+                                                                    <Tag :value="`Потенциал: ${channel.potential}`" :severity="channel.potential >= 80 ? 'success' : channel.potential >= 60 ? 'warning' : 'info'" />
+                                                                </div>
+                                                                <p class="text-sm text-surface-600 dark:text-surface-400">{{ channel.justification }}</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div v-else-if="segment.media.type === 'marketShareChart'">
+                                                        <div class="report-pair__mediaChart">
+                                                            <div class="chart-container report-pair__chart-container">
+                                                                <Chart v-if="hasRenderableChartData(segment.media.data)" :type="segment.media.chartType" :data="segment.media.data" :options="toCompactChartOptions(segment.media.options)" />
+                                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                                            </div>
+                                                            <div v-if="segment.media.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.media.title }}</div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div v-else-if="segment.media.type === 'comparisonTable'">
+                                                        <div class="mb-4">
+                                                            <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-table mr-2"></i>Сравнительная таблица</h3>
+                                                        </div>
+                                                        <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+                                                            <table class="comparison-table w-full border-collapse">
+                                                                <thead>
+                                                                    <tr>
+                                                                        <th class="comparison-table-th">Характеристика</th>
+                                                                        <th class="comparison-table-th text-center">Мы</th>
+                                                                        <th class="comparison-table-th text-center">Конкурент A</th>
+                                                                        <th class="comparison-table-th text-center">Конкурент B</th>
+                                                                    </tr>
+                                                                </thead>
+                                                                <tbody>
+                                                                    <tr v-for="(row, idx) in segment.media.data" :key="idx" class="comparison-table-tr">
+                                                                        <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
+                                                                        <td class="comparison-table-td text-center">
+                                                                            <Tag :value="row.us" severity="info" />
+                                                                        </td>
+                                                                        <td class="comparison-table-td text-center">
+                                                                            <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
+                                                                        </td>
+                                                                        <td class="comparison-table-td text-center">
+                                                                            <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
+                                                                        </td>
+                                                                    </tr>
+                                                                </tbody>
+                                                            </table>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                                <div class="report-pair__text">
+                                                    <div class="report-pair__textStack">
+                                                        <div v-for="(t, tIdx) in segment.texts || []" :key="tIdx" class="markdown-content" v-html="t.html"></div>
+                                                    </div>
+                                                </div>
+                                            </template>
+                                        </div>
+
+                                        <div v-else-if="segment.type === 'markdown'">
+                                            <div class="markdown-content" v-html="segment.html"></div>
+                                        </div>
+
+                                        <div v-else-if="segment.type === 'chart'">
+                                            <div class="chart-container" :style="segment.chartHeight">
+                                                <Chart v-if="hasRenderableChartData(segment.data)" :type="segment.chartType" :data="segment.data" :options="segment.options" />
+                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                            </div>
+                                            <div v-if="segment.title" class="chart-caption text-surface-700 dark:text-surface-300">{{ segment.title }}</div>
+                                            <div v-if="segment.key === 'channelsPotential' && segment.channels?.length" class="mt-4 space-y-2">
+                                                <div v-for="channel in segment.channels" :key="channel.name" class="p-3 border-round bg-surface-50 dark:bg-surface-800">
+                                                    <div class="flex justify-content-between align-items-center mb-2">
+                                                        <span class="font-semibold text-surface-900 dark:text-surface-0">{{ channel.name }}</span>
+                                                        <Tag :value="`Потенциал: ${channel.potential}`" :severity="channel.potential >= 80 ? 'success' : channel.potential >= 60 ? 'warning' : 'info'" />
+                                                    </div>
+                                                    <p class="text-sm text-surface-600 dark:text-surface-400">{{ channel.justification }}</p>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div v-else-if="segment.type === 'audienceSegmentation'">
+                                            <div class="mb-4">
+                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-users mr-2"></i>Сегментация целевой аудитории</h3>
+                                            </div>
+                                            <div class="grid">
+                                                <div v-if="segment.ageGroupsChartData" class="col-12 md:col-6 mb-4">
+                                                    <div class="flex align-items-center mb-3">
+                                                        <i class="pi pi-calendar text-primary-500 mr-2"></i>
+                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">По возрасту</h4>
+                                                    </div>
+                                                    <div class="chart-container" style="height: 300px">
+                                                        <Chart type="pie" :data="segment.ageGroupsChartData" :options="pieChartOptions" />
+                                                    </div>
+                                                </div>
+                                                <div v-if="segment.gendersChartData" class="col-12 md:col-6 mb-4">
+                                                    <div class="flex align-items-center mb-3">
+                                                        <i class="pi pi-user text-primary-500 mr-2"></i>
+                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">По полу</h4>
+                                                    </div>
+                                                    <div class="chart-container" style="height: 300px">
+                                                        <Chart type="pie" :data="segment.gendersChartData" :options="pieChartOptions" />
+                                                    </div>
+                                                </div>
+                                            </div>
+
+                                            <!-- Segments Channel Matrix (Heatmap) -->
+                                            <SegmentsChannelMatrixHeatmap v-if="segment.segmentsChannelMatrix" :matrix="segment.segmentsChannelMatrix" />
+
+                                            <!-- Key Takeaways -->
+                                            <div v-if="segment.keyTakeaways && segment.keyTakeaways.length > 0" class="mt-6">
+                                                <div class="flex align-items-center mb-3">
+                                                    <i class="pi pi-lightbulb text-primary-500 mr-2"></i>
+                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Ключевые выводы</h4>
+                                                </div>
+                                                <div class="p-4 border-round bg-primary-50 dark:bg-primary-900 border-1 border-primary-200 dark:border-primary-700">
+                                                    <ul class="list-none p-0 m-0">
+                                                        <li v-for="(takeaway, idx) in segment.keyTakeaways" :key="idx" class="flex align-items-start mb-3">
+                                                            <i class="pi pi-check-circle text-primary-500 mr-2 mt-1 flex-shrink-0"></i>
+                                                            <span class="text-surface-700 dark:text-surface-300">{{ takeaway }}</span>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div v-else-if="segment.type === 'segmentsChannelMatrix'">
+                                            <HeatmapTable :matrix="segment.matrix" :title="segment.title || 'Матрица каналов по сегментам'" />
+                                        </div>
+
+                                        <!-- New Competitive Environment Component -->
+                                        <div v-else-if="segment.type === 'competitiveEnvironment'">
+                                            <div class="mb-6">
+                                                <h3 class="text-2xl font-semibold text-surface-900 dark:text-surface-0 mb-4"><i class="pi pi-chart-line mr-2 text-primary-500"></i>{{ segment.title || 'Конкурентная среда' }}</h3>
+
+                                                <!-- Metrics KPI Cards -->
+                                                <div v-if="segment.metrics" class="grid mb-6">
+                                                    <div class="col-12 md:col-3 mb-3">
+                                                        <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full">
+                                                            <div class="flex align-items-center mb-2">
+                                                                <i class="pi pi-sitemap text-primary-500 mr-2 text-xl"></i>
+                                                                <span class="text-sm font-medium text-surface-600 dark:text-surface-400">Доля лидера</span>
+                                                            </div>
+                                                            <div class="text-2xl font-bold text-surface-900 dark:text-surface-0">
+                                                                {{ segment.metrics.leader_market_share || '—' }}
+                                                            </div>
+                                                            <div v-if="segment.metrics.market_leader_name" class="text-xs text-surface-500 dark:text-surface-400 mt-1">
+                                                                {{ segment.metrics.market_leader_name }}
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                    <div class="col-12 md:col-3 mb-3">
+                                                        <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full">
+                                                            <div class="flex align-items-center mb-2">
+                                                                <i class="pi pi-chart-bar text-green-500 mr-2 text-xl"></i>
+                                                                <span class="text-sm font-medium text-surface-600 dark:text-surface-400">Уровень конкуренции</span>
+                                                            </div>
+                                                            <div class="text-2xl font-bold text-surface-900 dark:text-surface-0">
+                                                                {{ segment.metrics.competition_level || '—' }}
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                    <div class="col-12 md:col-3 mb-3">
+                                                        <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full">
+                                                            <div class="flex align-items-center mb-2">
+                                                                <i class="pi pi-wallet text-orange-500 mr-2 text-xl"></i>
+                                                                <span class="text-sm font-medium text-surface-600 dark:text-surface-400">Давление рекламы</span>
+                                                            </div>
+                                                            <div class="text-2xl font-bold text-surface-900 dark:text-surface-0">
+                                                                {{ segment.metrics.ad_pressure || '—' }}
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                                <!-- Visibility Chart -->
+                                                <div v-if="segment.visibilityChart" class="mb-6">
+                                                    <div class="flex align-items-center mb-3">
+                                                        <i class="pi pi-chart-bar text-primary-500 mr-2"></i>
+                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ segment.visibilityChart.title }}</h4>
+                                                    </div>
+                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700">
+                                                        <div class="chart-container" :style="segment.visibilityChart.chartHeight">
+                                                            <Chart
+                                                                v-if="hasRenderableChartData(segment.visibilityChart.data)"
+                                                                :type="segment.visibilityChart.chartType"
+                                                                :data="segment.visibilityChart.data"
+                                                                :options="segment.visibilityChart.options"
+                                                                @chart:click="onChartClick"
+                                                                @chart:hover="onChartHover"
+                                                                ref="visibilityChartRef"
+                                                            />
+                                                            <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                                <!-- Competitors Table -->
+                                                <div v-if="segment.competitors && segment.competitors.length > 0" class="mb-6">
+                                                    <div class="flex align-items-center mb-3">
+                                                        <i class="pi pi-table text-primary-500 mr-2"></i>
+                                                        <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Таблица конкурентов</h4>
+                                                    </div>
+                                                    <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+                                                        <table class="competitive-environment-table w-full border-collapse">
+                                                            <thead>
+                                                                <tr>
+                                                                    <th class="competitive-env-th">Название</th>
+                                                                    <th class="competitive-env-th">Сайт</th>
+                                                                    <th class="competitive-env-th text-center">Видимость</th>
+                                                                    <th class="competitive-env-th">Ключевые преимущества</th>
+                                                                    <th class="competitive-env-th text-center">Ценовой сегмент</th>
+                                                                </tr>
+                                                            </thead>
+                                                            <tbody>
+                                                                <tr
+                                                                    v-for="(competitor, idx) in segment.competitors"
+                                                                    :key="competitor.name || idx"
+                                                                    :class="['competitive-env-tr', { 'competitive-env-tr-highlighted': highlightedRowIndex === idx }]"
+                                                                    @mouseenter="highlightRow(idx)"
+                                                                    @mouseleave="highlightRow(null)"
+                                                                    @click="handleRowClick(competitor)"
+                                                                >
+                                                                    <td class="competitive-env-td font-semibold"><i class="pi pi-building text-primary-500 mr-2"></i>{{ competitor.name }}</td>
+                                                                    <td class="competitive-env-td">
+                                                                        <a
+                                                                            v-if="competitor.website"
+                                                                            :href="getFullUrl(competitor.website)"
+                                                                            target="_blank"
+                                                                            rel="noopener noreferrer"
+                                                                            class="text-primary-500 hover:text-primary-700 dark:hover:text-primary-400 flex align-items-center"
+                                                                            @click.stop
+                                                                        >
+                                                                            <i class="pi pi-external-link mr-1"></i>
+                                                                            <span class="text-sm">{{ formatWebsite(competitor.website) }}</span>
+                                                                        </a>
+                                                                        <span v-else class="text-surface-400">—</span>
+                                                                    </td>
+                                                                    <td class="competitive-env-td text-center">
+                                                                        <div class="flex align-items-center justify-content-center">
+                                                                            <span class="competitive-env-score-badge" :class="getScoreClass(competitor.visibility_score)"> {{ competitor.visibility_score || 0 }}% </span>
+                                                                        </div>
+                                                                    </td>
+                                                                    <td class="competitive-env-td">
+                                                                        <div v-if="competitor.key_strengths && competitor.key_strengths.length > 0" class="flex flex-wrap gap-1">
+                                                                            <Tag v-for="(strength, sIdx) in competitor.key_strengths" :key="sIdx" :value="strength" severity="success" class="text-xs" />
+                                                                        </div>
+                                                                        <span v-else class="text-surface-400">—</span>
+                                                                    </td>
+                                                                    <td class="competitive-env-td text-center">
+                                                                        <Tag v-if="competitor.price_segment" :value="competitor.price_segment" :severity="getPriceSegmentSeverity(competitor.price_segment)" />
+                                                                        <span v-else class="text-surface-400">—</span>
+                                                                    </td>
+                                                                </tr>
+                                                            </tbody>
+                                                        </table>
+                                                    </div>
+                                                </div>
+
+                                                <!-- Conclusion -->
+                                                <div v-if="segment.conclusion" class="mt-6">
+                                                    <div class="p-4 border-round bg-primary-50 dark:bg-primary-900 border-1 border-primary-200 dark:border-primary-700">
+                                                        <div class="flex align-items-start">
+                                                            <i class="pi pi-info-circle text-primary-500 mr-2 mt-1 flex-shrink-0"></i>
+                                                            <div>
+                                                                <h4 class="text-lg font-semibold text-primary-700 dark:text-primary-300 mb-2">Заключение</h4>
+                                                                <p class="text-surface-700 dark:text-surface-300 m-0">{{ segment.conclusion }}</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div v-else-if="segment.type === 'competitors'">
+                                            <div class="mb-4">
+                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-chart-line mr-2"></i>Анализ конкурентов</h3>
+                                            </div>
+                                            <!-- Market Share Chart (if included in competitors segment) -->
+                                            <div v-if="segment.marketShareChart" class="mb-6">
+                                                <div class="flex align-items-center mb-3">
+                                                    <i class="pi pi-chart-pie text-primary-500 mr-2"></i>
+                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">{{ segment.marketShareChart.title }}</h4>
+                                                </div>
+                                                <div class="chart-container" :style="segment.marketShareChart.chartHeight">
+                                                    <Chart v-if="hasRenderableChartData(segment.marketShareChart.data)" :type="segment.marketShareChart.chartType" :data="segment.marketShareChart.data" :options="segment.marketShareChart.options" />
+                                                    <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                                </div>
+                                            </div>
+
+                                            <!-- Comparison Table (if included in competitors segment) -->
+                                            <div v-if="segment.comparisonTable" class="mb-6">
+                                                <div class="flex align-items-center mb-3">
+                                                    <i class="pi pi-table text-primary-500 mr-2"></i>
+                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Сравнительная таблица</h4>
+                                                </div>
+                                                <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+                                                    <table class="comparison-table w-full border-collapse">
+                                                        <thead>
+                                                            <tr>
+                                                                <th class="comparison-table-th">Характеристика</th>
+                                                                <th class="comparison-table-th text-center">Мы</th>
+                                                                <th class="comparison-table-th text-center">Конкурент A</th>
+                                                                <th class="comparison-table-th text-center">Конкурент B</th>
+                                                            </tr>
+                                                        </thead>
+                                                        <tbody>
+                                                            <tr v-for="(row, idx) in segment.comparisonTable.data" :key="idx" class="comparison-table-tr">
+                                                                <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
+                                                                <td class="comparison-table-td text-center">
+                                                                    <Tag :value="row.us" severity="info" />
+                                                                </td>
+                                                                <td class="comparison-table-td text-center">
+                                                                    <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
+                                                                </td>
+                                                                <td class="comparison-table-td text-center">
+                                                                    <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
+                                                                </td>
+                                                            </tr>
+                                                        </tbody>
+                                                    </table>
+                                                </div>
+                                            </div>
+                                            <div class="grid">
+                                                <div v-for="competitor in segment.competitors" :key="competitor.name" class="col-12 md:col-6 lg:col-4 mb-4">
+                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 h-full flex flex-column">
+                                                        <h4 class="text-lg font-semibold mb-3 text-surface-900 dark:text-surface-0 flex align-items-center"><i class="pi pi-building text-primary-500 mr-2"></i>{{ competitor.name }}</h4>
+                                                        <div class="space-y-2 mb-3 flex-grow-1">
+                                                            <div class="flex justify-content-between align-items-center">
+                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-eye mr-1"></i>Охват: </span>
+                                                                <span class="font-semibold text-surface-900 dark:text-surface-0">{{ competitor.reach?.toLocaleString() || 0 }}</span>
+                                                            </div>
+                                                            <div v-if="competitor.followers" class="flex justify-content-between align-items-center">
+                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-users mr-1"></i>Подписчики: </span>
+                                                                <span class="font-semibold text-surface-900 dark:text-surface-0">{{ competitor.followers?.toLocaleString() || 0 }}</span>
+                                                            </div>
+                                                            <div class="flex justify-content-between align-items-center">
+                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-chart-bar mr-1"></i>Активность: </span>
+                                                                <span class="font-semibold text-surface-900 dark:text-surface-0">{{ competitor.activity }}%</span>
+                                                            </div>
+                                                            <div v-if="competitor.priceStrategy" class="flex justify-content-between align-items-center">
+                                                                <span class="text-surface-600 dark:text-surface-400 flex align-items-center"> <i class="pi pi-tag mr-1"></i>Ценовая стратегия: </span>
+                                                                <Tag
+                                                                    :value="competitor.priceStrategy"
+                                                                    :severity="competitor.priceStrategy === 'Высокая' || competitor.priceStrategy === 'Премиум' ? 'danger' : competitor.priceStrategy === 'Низкая' ? 'success' : 'warning'"
+                                                                />
+                                                            </div>
+                                                        </div>
+                                                        <div v-if="competitor.strengths?.length" class="mb-3">
+                                                            <p class="text-sm font-semibold mb-2 text-green-600 dark:text-green-400 flex align-items-center"><i class="pi pi-arrow-up mr-1"></i>Сильные стороны:</p>
+                                                            <ul class="list-none p-0 m-0">
+                                                                <li v-for="(strength, idx) in competitor.strengths" :key="idx" class="text-sm text-surface-700 dark:text-surface-300 mb-1 flex align-items-start">
+                                                                    <i class="pi pi-check-circle text-green-500 mr-2 mt-1 flex-shrink-0"></i>
+                                                                    <span>{{ strength }}</span>
+                                                                </li>
+                                                            </ul>
+                                                        </div>
+                                                        <div v-if="competitor.weaknesses?.length">
+                                                            <p class="text-sm font-semibold mb-2 text-red-600 dark:text-red-400 flex align-items-center"><i class="pi pi-arrow-down mr-1"></i>Слабые стороны:</p>
+                                                            <ul class="list-none p-0 m-0">
+                                                                <li v-for="(weakness, idx) in competitor.weaknesses" :key="idx" class="text-sm text-surface-700 dark:text-surface-300 mb-1 flex align-items-start">
+                                                                    <i class="pi pi-times-circle text-red-500 mr-2 mt-1 flex-shrink-0"></i>
+                                                                    <span>{{ weakness }}</span>
+                                                                </li>
+                                                            </ul>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+
+                                            <!-- Competitors Heatmap -->
+                                            <div v-if="segment.competitorsHeatmap" class="mt-6">
+                                                <div class="flex align-items-center mb-3">
+                                                    <i class="pi pi-map text-primary-500 mr-2"></i>
+                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Тепловая карта каналов конкурентов</h4>
+                                                </div>
+                                                <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+                                                    <table class="competitors-heatmap-table w-full border-collapse">
+                                                        <thead>
+                                                            <tr>
+                                                                <th class="competitors-heatmap-th">Конкурент</th>
+                                                                <th v-for="channel in segment.competitorsHeatmap.channels" :key="channel" class="competitors-heatmap-th text-center">
+                                                                    {{ channel }}
+                                                                </th>
+                                                            </tr>
+                                                        </thead>
+                                                        <tbody>
+                                                            <tr v-for="(compData, idx) in segment.competitorsHeatmap.data" :key="idx" class="competitors-heatmap-tr">
+                                                                <td class="competitors-heatmap-td font-semibold">{{ compData.name }}</td>
+                                                                <td v-for="channel in segment.competitorsHeatmap.channels" :key="channel" class="competitors-heatmap-td text-center">
+                                                                    <span class="competitors-heatmap-badge" :style="{ backgroundColor: getHeatmapColor(compData.channelsHeatmap[channel] || 0) }">
+                                                                        {{ compData.channelsHeatmap[channel] || 0 }}
+                                                                    </span>
+                                                                </td>
+                                                            </tr>
+                                                        </tbody>
+                                                    </table>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Market Share Chart -->
+                                        <div v-else-if="segment.type === 'marketShareChart'">
+                                            <div class="mb-4" v-if="segment.title">
+                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-chart-pie mr-2"></i>{{ segment.title }}</h3>
+                                            </div>
+                                            <div class="chart-container" :style="segment.chartHeight">
+                                                <Chart v-if="hasRenderableChartData(segment.data)" :type="segment.chartType" :data="segment.data" :options="segment.options" />
+                                                <div v-else class="p-3 border-round text-center text-surface-500 dark:text-surface-400">Нет данных для отображения</div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Comparison Table -->
+                                        <div v-else-if="segment.type === 'comparisonTable'">
+                                            <div class="mb-4">
+                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-table mr-2"></i>Сравнительная таблица</h3>
+                                            </div>
+                                            <div class="overflow-x-auto border-round" style="border: 1px solid var(--surface-border)">
+                                                <table class="comparison-table w-full border-collapse">
+                                                    <thead>
+                                                        <tr>
+                                                            <th class="comparison-table-th">Характеристика</th>
+                                                            <th class="comparison-table-th text-center">Мы</th>
+                                                            <th class="comparison-table-th text-center">Конкурент A</th>
+                                                            <th class="comparison-table-th text-center">Конкурент B</th>
+                                                        </tr>
+                                                    </thead>
+                                                    <tbody>
+                                                        <tr v-for="(row, idx) in segment.data" :key="idx" class="comparison-table-tr">
+                                                            <td class="comparison-table-td font-semibold">{{ row.feature }}</td>
+                                                            <td class="comparison-table-td text-center">
+                                                                <Tag :value="row.us" severity="info" />
+                                                            </td>
+                                                            <td class="comparison-table-td text-center">
+                                                                <Tag :value="row.compA" :severity="row.compA === 'Высокая' || row.compA === 'Премиум' ? 'danger' : row.compA === 'Низкая' ? 'success' : 'warning'" />
+                                                            </td>
+                                                            <td class="comparison-table-td text-center">
+                                                                <Tag :value="row.compB" :severity="row.compB === 'Высокая' || row.compB === 'Премиум' ? 'danger' : row.compB === 'Низкая' ? 'success' : 'warning'" />
+                                                            </td>
+                                                        </tr>
+                                                    </tbody>
+                                                </table>
+                                            </div>
+                                        </div>
+
+                                        <!-- SWOT Competitors -->
+                                        <div v-else-if="segment.type === 'swotCompetitors'">
+                                            <div class="mb-4">
+                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-sitemap mr-2"></i>SWOT-анализ конкурентов</h3>
+                                            </div>
+                                            <div class="grid">
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-green-50 dark:bg-green-900 border-1 border-green-200 dark:border-green-700 h-full">
+                                                        <h4 class="text-lg font-semibold mb-3 text-green-700 dark:text-green-300 flex align-items-center"><i class="pi pi-arrow-up mr-2"></i>Сильные стороны</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(strength, idx) in segment.data.strengths" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2 flex align-items-start">
+                                                                <i class="pi pi-check-circle text-green-500 mr-2 mt-1 flex-shrink-0"></i>
+                                                                <span>{{ strength }}</span>
+                                                            </li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-red-50 dark:bg-red-900 border-1 border-red-200 dark:border-red-700 h-full">
+                                                        <h4 class="text-lg font-semibold mb-3 text-red-700 dark:text-red-300 flex align-items-center"><i class="pi pi-arrow-down mr-2"></i>Слабые стороны</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(weakness, idx) in segment.data.weaknesses" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2 flex align-items-start">
+                                                                <i class="pi pi-times-circle text-red-500 mr-2 mt-1 flex-shrink-0"></i>
+                                                                <span>{{ weakness }}</span>
+                                                            </li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <!-- Market -->
+                                        <div v-else-if="segment.type === 'market'">
+                                            <div class="mb-4">
+                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0"><i class="pi pi-globe mr-2"></i>Анализ рынка</h3>
+                                            </div>
+                                            <div class="grid mb-4">
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700">
+                                                        <div class="flex align-items-center mb-2">
+                                                            <i class="pi pi-chart-bar text-primary-500 mr-2"></i>
+                                                            <h4 class="text-sm font-semibold text-surface-600 dark:text-surface-400 m-0">Размер рынка</h4>
+                                                        </div>
+                                                        <p class="text-lg font-bold text-surface-900 dark:text-surface-0 mt-2">{{ segment.data.size || 'Не указано' }}</p>
+                                                    </div>
+                                                </div>
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700">
+                                                        <div class="flex align-items-center mb-2">
+                                                            <i class="pi pi-arrow-up-right text-primary-500 mr-2"></i>
+                                                            <h4 class="text-sm font-semibold text-surface-600 dark:text-surface-400 m-0">Темп роста</h4>
+                                                        </div>
+                                                        <p class="text-lg font-bold text-surface-900 dark:text-surface-0 mt-2">{{ segment.data.growthRate || 'Не указано' }}</p>
+                                                    </div>
+                                                </div>
+                                            </div>
+
+                                            <div v-if="segment.data.trends && segment.data.trends.length > 0" class="mb-4">
+                                                <div class="flex align-items-center mb-3">
+                                                    <i class="pi pi-trending-up text-primary-500 mr-2"></i>
+                                                    <h4 class="text-lg font-semibold text-surface-700 dark:text-surface-300 m-0">Тренды</h4>
+                                                </div>
+                                                <div class="p-4 border-round bg-blue-50 dark:bg-blue-900 border-1 border-blue-200 dark:border-blue-700">
+                                                    <ul class="list-none p-0 m-0">
+                                                        <li v-for="(trend, idx) in segment.data.trends" :key="idx" class="flex align-items-start mb-2">
+                                                            <i class="pi pi-arrow-up-right text-blue-500 mr-2 mt-1 flex-shrink-0"></i>
+                                                            <span class="text-surface-700 dark:text-surface-300">{{ trend }}</span>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+
+                                            <div class="grid">
+                                                <div v-if="segment.data.opportunities && segment.data.opportunities.length > 0" class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-blue-50 dark:bg-blue-900 border-1 border-blue-200 dark:border-blue-700">
+                                                        <h4 class="text-lg font-semibold mb-3 text-blue-700 dark:text-blue-300">Возможности</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(opportunity, idx) in segment.data.opportunities" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
+                                                                <i class="pi pi-arrow-up-circle text-blue-500 mr-2"></i>{{ opportunity }}
+                                                            </li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                                <div v-if="segment.data.threats && segment.data.threats.length > 0" class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-orange-50 dark:bg-orange-900 border-1 border-orange-200 dark:border-orange-700">
+                                                        <h4 class="text-lg font-semibold mb-3 text-orange-700 dark:text-orange-300">Угрозы</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(threat, idx) in segment.data.threats" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
+                                                                <i class="pi pi-exclamation-triangle text-orange-500 mr-2"></i>{{ threat }}
+                                                            </li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div v-else-if="segment.type === 'swot'">
+                                            <div class="mb-4">
+                                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">SWOT-анализ</h3>
+                                            </div>
+                                            <div class="grid">
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-green-50 dark:bg-green-900 border-1 border-green-200 dark:border-green-700">
+                                                        <h4 class="text-lg font-semibold mb-3 text-green-700 dark:text-green-300">Сильные стороны</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(strength, idx) in segment.data.strengths" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2"><i class="pi pi-check-circle text-green-500 mr-2"></i>{{ strength }}</li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-red-50 dark:bg-red-900 border-1 border-red-200 dark:border-red-700">
+                                                        <h4 class="text-lg font-semibold mb-3 text-red-700 dark:text-red-300">Слабые стороны</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(weakness, idx) in segment.data.weaknesses" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2"><i class="pi pi-times-circle text-red-500 mr-2"></i>{{ weakness }}</li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-blue-50 dark:bg-blue-900 border-1 border-blue-200 dark:border-blue-700">
+                                                        <h4 class="text-lg font-semibold mb-3 text-blue-700 dark:text-blue-300">Возможности</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(opportunity, idx) in segment.data.opportunities" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
+                                                                <i class="pi pi-arrow-up-circle text-blue-500 mr-2"></i>{{ opportunity }}
+                                                            </li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                                <div class="col-12 md:col-6 mb-3">
+                                                    <div class="p-4 border-round bg-orange-50 dark:bg-orange-900 border-1 border-orange-200 dark:border-orange-700">
+                                                        <h4 class="text-lg font-semibold mb-3 text-orange-700 dark:text-orange-300">Угрозы</h4>
+                                                        <ul class="list-none p-0 m-0">
+                                                            <li v-for="(threat, idx) in segment.data.threats" :key="idx" class="text-surface-700 dark:text-surface-300 mb-2">
+                                                                <i class="pi pi-exclamation-triangle text-orange-500 mr-2"></i>{{ threat }}
+                                                            </li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <!-- Fallback for unrecognized segment types - don't display raw JSON -->
+                                        <div v-else-if="segment && segment.type">
+                                            <p class="text-surface-600 dark:text-surface-400">Неизвестный тип сегмента: {{ segment.type }}</p>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Рекомендации -->
+                        <div v-if="report.recommendations?.length" class="card">
+                            <div class="card-header mb-4">
+                                <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Рекомендации</h3>
+                            </div>
+                            <div class="card-content">
+                                <ul class="list-none p-0 m-0">
+                                    <li v-for="(recommendation, index) in report.recommendations" :key="index" class="flex align-items-start mb-3">
+                                        <i class="pi pi-check-circle text-green-500 mr-2 mt-1"></i>
+                                        <span class="text-surface-700 dark:text-surface-300">{{ recommendation }}</span>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Кнопки действий (всегда видны, когда есть анализ) -->
+                <div v-if="(status === 'completed' && report) || v2ReportNormalized" class="card">
+                    <div class="card-content text-center">
+                        <div class="flex gap-3 justify-content-center flex-wrap">
+                            <Button label="Создать стратегию на основе анализа" icon="pi pi-magic" severity="success" @click="goToStrategy" />
+                            <Button label="Создать новый анализ" icon="pi pi-plus" severity="secondary" @click="resetAnalysis" />
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .v2-glow :deep(canvas) {
     filter: drop-shadow(0 0 14px rgba(59, 130, 246, 0.22));
diff --git a/src/views/pages/marketing/MarketingAnalysisV3.vue b/src/views/pages/marketing/MarketingAnalysisV3.vue
new file mode 100644
index 0000000..581402d
--- /dev/null
+++ b/src/views/pages/marketing/MarketingAnalysisV3.vue
@@ -0,0 +1,885 @@
+<script setup>
+import MarketingV3Service from '@/service/MarketingV3Service';
+import { useToast } from 'primevue/usetoast';
+import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+const route = useRoute();
+const router = useRouter();
+const toast = useToast();
+
+const analysisId = computed(() => route.params.id);
+const loading = ref(true);
+const status = ref('IDLE');
+const resultData = ref(null);
+const errorMessage = ref('');
+const expandedRows = ref([]);
+
+// ─── Loader ───────────────────────────────────────────────────────────────────
+const LOADER_MESSAGES = ['Собираем данные конкурентов...', 'Анализируем отзывы и рейтинги...', 'Считаем ER и частоту публикаций...', 'Строим карту контент-стратегий...', 'Генерируем выводы и приоритеты...'];
+const loaderMessage = ref(LOADER_MESSAGES[0]);
+const loaderDot = ref(1);
+let pollInterval = null;
+let loaderTick = 0;
+
+// ─── Status helpers ───────────────────────────────────────────────────────────
+const statusLabel = computed(() => {
+    const map = { COMPLETED: 'ГОТОВ', PROCESSING: 'В ОБРАБОТКЕ', QUEUED: 'В ОЧЕРЕДИ', FAILED: 'ОШИБКА' };
+    return map[status.value] || '—';
+});
+const statusClass = computed(() => {
+    const map = {
+        COMPLETED: 'text-emerald-600 dark:text-emerald-400',
+        PROCESSING: 'text-amber-600 dark:text-amber-400',
+        QUEUED: 'text-blue-600 dark:text-blue-400',
+        FAILED: 'text-red-600 dark:text-red-400'
+    };
+    return map[status.value] || 'text-surface-500';
+});
+
+// ─── Data aliases ─────────────────────────────────────────────────────────────
+const exec = computed(() => resultData.value?.['0_executive_summary'] || {});
+const landscape1 = computed(() => resultData.value?.['1_market_landscape'] || {});
+const geo2 = computed(() => resultData.value?.['2_geo_structure'] || {});
+const competitors = computed(() => resultData.value?.['3_competitor_map'] || []);
+const content4 = computed(() => resultData.value?.['4_content_profile'] || {});
+const cii = computed(() => resultData.value?.['5_competition_intensity'] || {});
+const rep6 = computed(() => resultData.value?.['6_reputation_analysis'] || {});
+const beh7 = computed(() => resultData.value?.['7_behavioral_pattern'] || {});
+const demand8 = computed(() => resultData.value?.['8_search_demand'] || {});
+const pos9 = computed(() => resultData.value?.['9_user_positioning'] || {});
+const conclusions10 = computed(() => resultData.value?.['10_structured_conclusions'] || []);
+const rationale11 = computed(() => resultData.value?.['11_smm_strategy_rationale'] || '');
+
+// ─── Section 2: Geo table ─────────────────────────────────────────────────────
+const geoSort = ref({ field: 'activePlayers', order: -1 });
+const geoTable = computed(() => {
+    return geo2.value?.cityComparison || [];
+});
+const onGeoSort = (e) => {
+    geoSort.value = { field: e.sortField, order: e.sortOrder };
+};
+
+// ─── Section 3: Row expand ────────────────────────────────────────────────────
+const onRowExpand = (e) => {
+    expandedRows.value = [e.data];
+};
+const onRowCollapse = () => {
+    expandedRows.value = [];
+};
+
+// ─── Section 5: CII ───────────────────────────────────────────────────────────
+const ciiFactors = computed(() => {
+    const d = cii.value;
+    return d.contributingFactors || [];
+});
+
+// ─── Section 1: City heatmap ──────────────────────────────────────────────────
+const cityHeatmap = computed(() => {
+    const map = landscape1.value?.cityDistribution || {};
+    const entries = Object.entries(map);
+    if (!entries.length) return [];
+
+    const max = Math.max(...entries.map(([, v]) => v), 1);
+    return entries
+        .map(([city, count]) => ({
+            city,
+            count,
+            pct: Math.round((count / max) * 100)
+        }))
+        .sort((a, b) => b.count - a.count)
+        .slice(0, 8);
+});
+const reviewBoxplot = computed(() => landscape1.value?.reviewDistribution || null);
+
+// ─── Section 9: Radar axes ────────────────────────────────────────────────────
+const radarAxes = computed(() => {
+    const p = pos9.value;
+    const user = p.userMetrics || p.radarChart || {};
+    const market = p.marketMetrics || { activity: 50, engagement: 50, video: 50, reputation: 50, frequency: 50 };
+    const axes = ['activity', 'engagement', 'video', 'reputation', 'frequency'];
+    const labels = { activity: 'Активность', engagement: 'Вовлечённость', video: 'Видео', reputation: 'Репутация', frequency: 'Частота' };
+    return axes.map((k) => ({
+        label: labels[k],
+        user: user[k] ?? 0,
+        market: market[k] ?? 0
+    }));
+});
+
+// ─── Chart Data ───────────────────────────────────────────────────────────────
+const PALETTE = ['#4F46E5', '#7C3AED', '#EC4899', '#F97316', '#22C55E', '#06B6D4', '#EAB308'];
+
+const platformChartData = computed(() => {
+    const pl = landscape1.value?.activePlayersByPlatform || {};
+    const entries = Object.entries(pl);
+    return {
+        labels: entries.map(([k]) => k),
+        datasets: [{ data: entries.map(([, v]) => v), backgroundColor: entries.map((_, i) => PALETTE[i % PALETTE.length]) }]
+    };
+});
+const demandChartData = computed(() => {
+    const s = demand8.value?.seasonality || landscape1.value?.demandDynamics || landscape1.value?.demandTrend || [];
+    return {
+        labels: s.map((p) => p.period ?? p.month),
+        datasets: [{ label: 'Спрос', data: s.map((p) => p.value), borderColor: '#4F46E5', backgroundColor: 'rgba(79,70,229,0.08)', tension: 0.4, fill: true }]
+    };
+});
+const contentDistribution = computed(() => {
+    const d = content4.value;
+    if (d?.demoContentPercent == null && !d?.distribution) return null;
+    return {
+        Демо: d.demoContentPercent ?? d.distribution?.['Демо/Процесс'] ?? 0,
+        Экспертный: d.expertContentPercent ?? d.distribution?.['Экспертный'] ?? 0,
+        Продающий: d.salesContentPercent ?? d.distribution?.['Промо/Акции'] ?? 0,
+        Отзывы: d.reviewsContentPercent ?? d.distribution?.['Отзывы'] ?? 0,
+        Вовлекающий: d.engagementContentPercent ?? d.distribution?.['Вовлечение'] ?? 0
+    };
+});
+const contentChartData = computed(() => {
+    const d = contentDistribution.value || {};
+    const entries = Object.entries(d).filter(([, v]) => v > 0);
+    return {
+        labels: entries.map(([k]) => k),
+        datasets: [{ data: entries.map(([, v]) => v), backgroundColor: PALETTE }]
+    };
+});
+const starChartData = computed(() => {
+    const d = rep6.value?.starDistribution || {};
+    return {
+        labels: ['1★', '2★', '3★', '4★', '5★'],
+        datasets: [
+            {
+                label: 'Отзывов (%)',
+                data: [d['1'] ?? 0, d['2'] ?? 0, d['3'] ?? 0, d['4'] ?? 0, d['5'] ?? 0],
+                backgroundColor: ['#EF4444', '#F97316', '#EAB308', '#84CC16', '#22C55E']
+            }
+        ]
+    };
+});
+const ctaChartData = computed(() => {
+    const d = {
+        'Промо и скидки': beh7.value?.promoUsagePercent ?? 0,
+        'Прямое бронирование': beh7.value?.directBookingPercent ?? 0,
+        'Открытые цены': beh7.value?.priceVisibilityPercent ?? 0
+    };
+    const entries = Object.entries(d);
+    return {
+        labels: entries.map(([k]) => k),
+        datasets: [{ label: 'Поведение', data: entries.map(([, v]) => v), backgroundColor: PALETTE.map((c) => c + 'CC') }]
+    };
+});
+const seasonChartData = computed(() => {
+    const s = demand8.value?.seasonality || landscape1.value?.demandDynamics || [];
+    const peaks = demand8.value?.peakPeriods || [];
+    return {
+        labels: s.map((p) => p.period ?? p.month),
+        datasets: [
+            {
+                label: 'Спрос',
+                data: s.map((p) => p.value),
+                borderColor: '#4F46E5',
+                backgroundColor: 'rgba(79,70,229,0.12)',
+                tension: 0.4,
+                fill: true,
+                pointRadius: s.map((p) => (peaks.includes(p.period ?? p.month) ? 7 : 3)),
+                pointBackgroundColor: s.map((p) => (peaks.includes(p.period ?? p.month) ? '#EC4899' : '#4F46E5'))
+            }
+        ]
+    };
+});
+const radarChartData = computed(() => {
+    const a = radarAxes.value;
+    const isBenchmark = pos9.value?.mode === 'BENCHMARK';
+    const datasets = [{ label: 'Рынок (Ориентир)', data: a.map((x) => x.market), backgroundColor: 'rgba(234,179,8,0.2)', borderColor: '#EAB308', pointBackgroundColor: '#EAB308' }];
+    if (!isBenchmark) {
+        datasets.push({ label: 'Ваша позиция', data: a.map((x) => x.user), backgroundColor: 'rgba(79,70,229,0.2)', borderColor: '#4F46E5', pointBackgroundColor: '#4F46E5' });
+    }
+    return {
+        labels: a.map((x) => x.label),
+        datasets
+    };
+});
+
+// ─── Chart Options ────────────────────────────────────────────────────────────
+const tb = { mode: 'index', intersect: false }; // tooltip base
+const basePlugin = { legend: { labels: { color: '#6B7280', font: { size: 11 } } }, tooltip: tb };
+const doughnutOptions = { responsive: true, maintainAspectRatio: false, plugins: { ...basePlugin, legend: { position: 'right', labels: { color: '#6B7280', font: { size: 11 } } } } };
+const lineOptions = { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false }, tooltip: tb }, scales: { y: { beginAtZero: true, ticks: { color: '#9CA3AF' } }, x: { ticks: { color: '#9CA3AF' } } } };
+const pieOptions = { responsive: true, maintainAspectRatio: false, plugins: { ...basePlugin, legend: { position: 'right', labels: { color: '#6B7280', font: { size: 11 } } } } };
+const barOptions = { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false }, tooltip: tb }, scales: { y: { beginAtZero: true, ticks: { color: '#9CA3AF' } }, x: { ticks: { color: '#9CA3AF' } } } };
+const hbarOptions = { indexAxis: 'y', responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false }, tooltip: tb }, scales: { x: { beginAtZero: true, ticks: { color: '#9CA3AF' } }, y: { ticks: { color: '#9CA3AF' } } } };
+const areaOptions = { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false }, tooltip: tb }, scales: { y: { beginAtZero: true, ticks: { color: '#9CA3AF' } }, x: { ticks: { color: '#9CA3AF', maxRotation: 45 } } } };
+const radarOptions = {
+    responsive: true,
+    maintainAspectRatio: false,
+    plugins: basePlugin,
+    scales: {
+        r: { min: 0, max: 100, ticks: { stepSize: 20, color: '#9CA3AF', backdropColor: 'transparent' }, pointLabels: { color: '#6B7280', font: { size: 11 } }, grid: { color: 'rgba(107,114,128,0.2)' }, angleLines: { color: 'rgba(107,114,128,0.2)' } }
+    }
+};
+
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+const fmtNum = (n) => (n != null ? Number(n).toLocaleString('ru-RU') : '—');
+const fmtPct = (n) => (n != null ? parseFloat(n).toFixed(2) + '%' : '—');
+const erClass = (er) => {
+    const v = parseFloat(er);
+    if (v >= 6) return 'text-emerald-600 dark:text-emerald-400 font-semibold';
+    if (v >= 3) return 'text-amber-600 dark:text-amber-400 font-semibold';
+    return 'text-rose-600 dark:text-rose-400 font-semibold';
+};
+const heatColor = (pct) => {
+    if (pct >= 75) return '#4F46E5';
+    if (pct >= 50) return '#7C3AED';
+    if (pct >= 25) return '#A78BFA';
+    return '#C4B5FD';
+};
+
+const MOCK_RESULT = {
+    '0_executive_summary': {
+        businessStage: 'Рост',
+        geography: 'Алматы, Астана',
+        activeCompetitors: 24,
+        competitionLevel: 'Высокий',
+        averageNicheEr: 4.8,
+        averageRating: 4.3,
+        demandTrend: '▲ +12% за квартал',
+        keyFigures: [
+            'Рынок фитнес-услуг Алматы насчитывает 24 активных игрока в Instagram.',
+            'Средний ER по нише — 4.8%, что выше общего бенчмарка (3.2%).',
+            'Пик спроса приходится на январь и сентябрь (смена сезонов).',
+            'Лидер рынка — @championfitness.kz с 48 000 подписчиков и ER 7.2%.'
+        ]
+    },
+    '1_market_landscape': {
+        activePlayersByPlatform: { Instagram: 18, '2GIS': 14, YouTube: 6, TikTok: 9 },
+        cityDistribution: { Алматы: 18, Астана: 12, Шымкент: 7, Қарағанды: 4, Актобе: 3 },
+        nicheReputationLevel: 4.2
+    },
+    '2_geo_structure': {
+        cityComparison: [
+            { city: 'Алматы', activePlayers: 18, avgEr: 5.1, avgRating: 4.4, avgPostsPerMonth: 14 },
+            { city: 'Астана', activePlayers: 12, avgEr: 4.3, avgRating: 4.2, avgPostsPerMonth: 11 },
+            { city: 'Шымкент', activePlayers: 7, avgEr: 3.8, avgRating: 4.0, avgPostsPerMonth: 9 },
+            { city: 'Қарағанды', activePlayers: 4, avgEr: 3.2, avgRating: 3.9, avgPostsPerMonth: 7 },
+            { city: 'Актобе', activePlayers: 3, avgEr: 2.9, avgRating: 3.7, avgPostsPerMonth: 5 }
+        ],
+        densityIndex: 78.5
+    },
+    '3_competitor_map': [
+        {
+            name: 'ChampionFitness',
+            platform: 'Instagram',
+            followers: 48000,
+            postsPerMonth: 22,
+            er: 7.2,
+            rating: 4.7,
+            reviews: 892,
+            strengths: ['Высокий ER', 'Регулярный постинг', 'Профессиональный визуал'],
+            weaknesses: ['Слабый 2GIS', 'Нет YouTube']
+        },
+        { name: 'FitLife Almaty', platform: 'Instagram', followers: 31000, postsPerMonth: 15, er: 5.4, rating: 4.5, reviews: 541, strengths: ['Активные stories', 'Коллаборации'], weaknesses: ['Низкий охват Reels', 'Редкие публикации'] },
+        { name: 'PowerGym KZ', platform: 'Instagram', followers: 22000, postsPerMonth: 18, er: 4.1, rating: 4.2, reviews: 310, strengths: ['Акции и скидки', 'Широкий ассортимент'], weaknesses: ['Слабый визуал', 'Нет Reels'] },
+        { name: 'SportLife', platform: 'TikTok', followers: 19000, postsPerMonth: 30, er: 6.8, rating: 4.0, reviews: 280, strengths: ['Вирусный TikTok', 'Молодая аудитория'], weaknesses: ['Нет в 2GIS', 'Слабый Instagram'] },
+        { name: 'Olymp Club', platform: 'Instagram', followers: 15000, postsPerMonth: 10, er: 3.2, rating: 4.3, reviews: 420, strengths: ['Хорошие отзывы', 'Лояльная ЦА'], weaknesses: ['Редкий постинг', 'Нет видео'] }
+    ],
+    '4_content_profile': {
+        demoContentPercent: 28.0,
+        expertContentPercent: 22.0,
+        salesContentPercent: 20.0,
+        reviewsContentPercent: 18.0,
+        engagementContentPercent: 12.0,
+        videoShare: 38.0,
+        avgTextLengthCharacters: 284,
+        ctaUsagePercent: 33.3
+    },
+    '5_competition_intensity': {
+        ciiIndex: 72,
+        intensityLabel: 'Высокая интенсивность среды',
+        contributingFactors: ['Плотность конкурентов: высокая', 'Частота публикаций: 14 п/мес', 'Средний рейтинг рынка: 4.4 ★']
+    },
+    '6_reputation_analysis': {
+        avgNicheRating: 4.3,
+        medianReviews: 2443,
+        starDistribution: { 1: 4.3, 2: 6.2, 3: 15.0, 4: 52.0, 5: 22.5 },
+        highTrustBusinessShare: 0.88,
+        avgOwnerResponseTimeHours: 12
+    },
+    '7_behavioral_pattern': {
+        promoUsagePercent: 35.0,
+        directBookingPercent: 28.0,
+        priceVisibilityPercent: 15.0,
+        avgCycleDays: 2,
+        commonCta: ['Запишись на пробный', 'Напиши в Direct', 'Узнай цену', 'Смотри акцию']
+    },
+    '8_search_demand': {
+        avgMonthlySearches: 15400,
+        seasonality: [
+            { period: 'Январь', value: 92 },
+            { period: 'Февраль', value: 78 },
+            { period: 'Март', value: 81 },
+            { period: 'Апрель', value: 74 },
+            { period: 'Май', value: 68 },
+            { period: 'Июнь', value: 59 },
+            { period: 'Июль', value: 55 },
+            { period: 'Август', value: 63 },
+            { period: 'Сентябрь', value: 89 },
+            { period: 'Октябрь', value: 85 },
+            { period: 'Ноябрь', value: 77 },
+            { period: 'Декабрь', value: 70 }
+        ],
+        peakPeriods: ['Январь', 'Сентябрь', 'Октябрь'],
+        relatedQueries: ['фитнес алматы', 'тренажёрный зал цена', 'записаться в зал', 'фитнес клуб рядом', 'персональный тренер', 'групповые тренировки']
+    },
+    '9_user_positioning': {
+        mode: 'COMPARISON',
+        marketMetrics: { activity: 7, engagement: 6, video: 5, reputation: 8, frequency: 7 },
+        userMetrics: { activity: 4, engagement: 3, video: 2, reputation: 6, frequency: 3 },
+        strategicFocus: ['Увеличить частоту публикаций', 'Добавить больше видео контента', 'Работать над повышением вовлеченности']
+    },
+    '10_structured_conclusions': [
+        'Рынок фитнес-услуг в Алматы высококонкурентный — 18 активных игроков в Instagram.',
+        'Средний ER 5.1% указывает на хорошую вовлечённость аудитории у топ-игроков.',
+        'Лидер рынка публикует 22 поста/мес — в 2.5x больше среднего по рынку.',
+        'Пиковый спрос в январе и сентябре — необходимо усиливать контент в эти периоды.',
+        'Слабое место конкурентов — YouTube и TikTok: только 25% имеют активное присутствие.',
+        'CII = 72 (высокий) — входной порог на рынок требует качественного контента и репутации.'
+    ],
+    '11_smm_strategy_rationale':
+        'На основе анализа рекомендуется фокус на Instagram + 2GIS как основные каналы. Контент-стратегия должна включать не менее 14 публикаций в месяц с упором на видео (Reels) и экспертный контент. Это позволит конкурировать с лидером по ER при меньшем бюджете.\n\nScore Model приоритет: Репутация (2GIS-отзывы) → Engagement Rate → Частота постинга → CTA-конверсия.'
+};
+
+// ─── API ──────────────────────────────────────────────────────────────────────
+const fetchAnalysis = async () => {
+    // ── PREVIEW MODE: ?preview=1 — загружает mock без API ──────────────────────
+    if (route.query.preview === '1') {
+        status.value = 'COMPLETED';
+        resultData.value = MOCK_RESULT;
+        loading.value = false;
+        return;
+    }
+    if (!analysisId.value) return;
+    try {
+        loading.value = true;
+        const doc = await MarketingV3Service.getAnalysisV3ById(analysisId.value);
+        status.value = doc.status || 'IDLE';
+        resultData.value = doc.resultData || null;
+        if (doc.status === 'FAILED' && doc.errorMessage) errorMessage.value = doc.errorMessage;
+        loaderTick++;
+        loaderMessage.value = LOADER_MESSAGES[loaderTick % LOADER_MESSAGES.length];
+        loaderDot.value = (loaderDot.value % 5) + 1;
+    } catch (err) {
+        status.value = 'FAILED';
+        errorMessage.value = err.message || 'Не удалось загрузить анализ.';
+    } finally {
+        loading.value = false;
+    }
+};
+
+const startPolling = () => {
+    if (pollInterval) return;
+    pollInterval = setInterval(() => {
+        if (status.value === 'COMPLETED' || status.value === 'FAILED') {
+            stopPolling();
+            return;
+        }
+        fetchAnalysis();
+    }, 5000);
+};
+const stopPolling = () => {
+    if (pollInterval) {
+        clearInterval(pollInterval);
+        pollInterval = null;
+    }
+};
+
+const generateStrategy = () => {
+    router.push({
+        name: 'marketing-v3-strategy',
+        query: { analysisId: analysisId.value }
+    });
+};
+
+onMounted(() => {
+    fetchAnalysis();
+    startPolling();
+});
+onUnmounted(() => stopPolling());
+</script>
+
+<script>
+import MetricCard from '@/components/marketing/MetricCard.vue';
+import BoxplotPlaceholder from '@/components/marketing/analysis/BoxplotPlaceholder.vue';
+import ChartPlaceholder from '@/components/marketing/analysis/ChartPlaceholder.vue';
+import ExecCard from '@/components/marketing/analysis/ExecCard.vue';
+import GaugeChart from '@/components/marketing/analysis/GaugeChart.vue';
+import ScatterPlotSvg from '@/components/marketing/analysis/ScatterPlotSvg.vue';
+import SectionBlock from '@/components/marketing/analysis/SectionBlock.vue';
+
+export default {
+    components: {
+        MetricCard,
+        SectionBlock,
+        ExecCard,
+        ChartPlaceholder,
+        BoxplotPlaceholder,
+        ScatterPlotSvg,
+        GaugeChart
+    }
+};
+</script>
+
+<template>
+    <div class="marketing-analysis-v3-page bg-surface-50 dark:bg-surface-900 min-h-screen p-4 md:p-6">
+        <Toast />
+        <div class="max-w-7xl mx-auto space-y-6">
+            <!-- ======================================================= -->
+            <!-- HEADER: статус + навигация                              -->
+            <!-- ======================================================= -->
+            <div class="card">
+                <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3">
+                    <div>
+                        <div class="flex items-center gap-2 mb-1">
+                            <span class="text-xs font-bold tracking-widest uppercase text-primary-500">МАРКЕТИНГОВЫЙ АНАЛИЗ</span>
+                            <span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-semibold bg-primary-100 text-primary-700 dark:bg-primary-900/40 dark:text-primary-300">v4.0 Data-Driven</span>
+                        </div>
+                        <h1 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Конкурентный разбор рынка</h1>
+                        <p class="text-sm text-surface-500 dark:text-surface-400 mt-0.5">
+                            Статус:
+                            <span :class="statusClass" class="font-semibold ml-1">{{ statusLabel }}</span>
+                        </p>
+                    </div>
+                    <div class="flex items-center gap-2">
+                        <Button label="Назад к анализам" icon="pi pi-arrow-left" severity="secondary" outlined size="small" @click="$router.push('/marketing-analysis/v3')" />
+                        <Button v-if="status === 'COMPLETED'" label="SMM-Стратегия" icon="pi pi-chart-line" icon-pos="right" size="small" @click="generateStrategy" />
+                    </div>
+                </div>
+            </div>
+
+            <!-- ======================================================= -->
+            <!-- LOADING STATE                                           -->
+            <!-- ======================================================= -->
+            <div v-if="loading || status === 'QUEUED' || status === 'PROCESSING'" class="card">
+                <div class="text-center py-20">
+                    <ProgressSpinner style="width: 72px; height: 72px" />
+                    <p class="mt-5 text-lg font-semibold text-surface-900 dark:text-surface-0">{{ loaderMessage }}</p>
+                    <p class="mt-2 text-sm text-surface-500 dark:text-surface-400 max-w-md mx-auto">Это может занять 1–3 минуты. Вкладку можно оставить открытой — данные обновятся автоматически.</p>
+                    <div class="mt-6 flex justify-center gap-2">
+                        <span v-for="i in 5" :key="i" :class="['inline-block w-2 h-2 rounded-full transition-all duration-500', loaderDot === i ? 'bg-primary-500 scale-125' : 'bg-surface-300 dark:bg-surface-600']" />
+                    </div>
+                </div>
+            </div>
+
+            <!-- ======================================================= -->
+            <!-- ERROR STATE                                             -->
+            <!-- ======================================================= -->
+            <div v-else-if="status === 'FAILED'" class="card">
+                <div class="text-center py-20">
+                    <i class="pi pi-exclamation-circle text-6xl text-red-500 mb-4" />
+                    <p class="text-lg font-semibold text-surface-900 dark:text-surface-0 mb-2">Ошибка генерации анализа</p>
+                    <p class="text-sm text-surface-500 dark:text-surface-400 max-w-sm mx-auto mb-6">
+                        {{ errorMessage || 'Попробуйте повторить анализ или обратитесь в поддержку.' }}
+                    </p>
+                    <Button label="Запустить повторно" icon="pi pi-refresh" @click="$router.push('/marketing-analysis/v3')" />
+                </div>
+            </div>
+
+            <!-- ======================================================= -->
+            <!-- DASHBOARD (COMPLETED)                                   -->
+            <!-- ======================================================= -->
+            <template v-else-if="status === 'COMPLETED' && resultData">
+                <SectionBlock id="s0" title="1. Краткий обзор" subtitle="Ключевые метрики рынка">
+                    <div class="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-4">
+                        <ExecCard label="Стадия бизнеса" :value="exec.businessStage || '—'" icon="pi pi-briefcase" color="indigo" />
+                        <ExecCard label="География" :value="exec.geography || '—'" icon="pi pi-map-marker" color="blue" />
+                        <ExecCard label="Конкурентов" :value="String(exec.activeCompetitors ?? '—')" icon="pi pi-users" color="violet" :trend="exec.activeCompetitors > 10 ? 'up' : 'neutral'" />
+                        <ExecCard label="Уровень конкурен." :value="exec.competitionLevel || '—'" icon="pi pi-bolt" color="amber" />
+                        <ExecCard label="Средний ER" :value="fmtPct(exec.averageNicheEr)" icon="pi pi-percentage" color="emerald" :trend="parseFloat(exec.averageNicheEr) >= 5 ? 'up' : 'down'" />
+                        <ExecCard label="Рейтинг ★" :value="exec.averageRating ? exec.averageRating.toFixed(1) : '—'" icon="pi pi-star-fill" color="orange" :trend="exec.averageRating >= 4 ? 'up' : 'down'" />
+                    </div>
+                    <!-- Key figures -->
+                    <div v-if="exec.keyFigures?.length" class="mt-4 grid grid-cols-1 sm:grid-cols-2 gap-2">
+                        <div v-for="(item, idx) in exec.keyFigures" :key="idx" class="flex items-start gap-2 text-sm text-surface-700 dark:text-surface-300 bg-surface-100 dark:bg-surface-800 rounded-lg px-3 py-2">
+                            <i class="pi pi-check-circle text-primary-500 mt-0.5 shrink-0" />
+                            <span>{{ item }}</span>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 1. Рыночный ландшафт === -->
+                <SectionBlock id="s1" title="2. Рыночный ландшафт" subtitle="Структура платформ, спрос, динамика">
+                    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+                        <!-- Donut: платформы -->
+                        <div class="flex flex-col">
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Распределение по платформам</h3>
+                            <div class="flex-1 flex items-center justify-center h-60">
+                                <Chart v-if="platformChartData.labels.length" type="doughnut" :data="platformChartData" :options="doughnutOptions" class="max-h-60" />
+                                <ChartPlaceholder v-else text="Нет данных по платформам" />
+                            </div>
+                        </div>
+                        <!-- Line: спрос 12 мес -->
+                        <div class="flex flex-col">
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Тренд спроса (12 месяцев)</h3>
+                            <div class="flex-1 h-60">
+                                <Chart v-if="demandChartData.labels.length" type="line" :data="demandChartData" :options="lineOptions" class="h-60" />
+                                <ChartPlaceholder v-else text="Нет данных по сезонности" />
+                            </div>
+                        </div>
+                        <!-- Heatmap города -->
+                        <div>
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Распределение по городам</h3>
+                            <div class="space-y-2">
+                                <div v-for="(item, idx) in cityHeatmap" :key="idx" class="flex items-center gap-3">
+                                    <span class="w-28 text-xs text-surface-600 dark:text-surface-400 truncate">{{ item.city }}</span>
+                                    <div class="flex-1 bg-surface-200 dark:bg-surface-700 rounded-full h-3 overflow-hidden">
+                                        <div class="h-3 rounded-full transition-all duration-700" :style="{ width: (item.pct || 0) + '%', background: heatColor(item.pct || 0) }" />
+                                    </div>
+                                    <span class="text-xs font-semibold text-surface-700 dark:text-surface-300 w-8 text-right">{{ item.count || 0 }}</span>
+                                </div>
+                                <ChartPlaceholder v-if="!cityHeatmap?.length" text="Нет данных по городам" />
+                            </div>
+                        </div>
+                        <!-- Metric: niche reputation -->
+                        <div v-if="landscape1.nicheReputationLevel" class="flex flex-col justify-center">
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Уровень репутации ниши</h3>
+                            <div class="rounded-xl border border-surface-200 dark:border-surface-700 p-6 flex items-center justify-between bg-emerald-50 dark:bg-emerald-900/20">
+                                <div>
+                                    <p class="text-3xl font-bold text-emerald-600 dark:text-emerald-400">{{ landscape1.nicheReputationLevel }} ★</p>
+                                    <p class="text-xs text-emerald-700 dark:text-emerald-300 mt-1">в среднем по рынку</p>
+                                </div>
+                                <i class="pi pi-star-fill text-4xl text-amber-400" />
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 2. Географическая структура === -->
+                <SectionBlock id="s2" title="3. Географическая структура конкуренции" subtitle="Активность игроков по городам">
+                    <div class="grid grid-cols-1 xl:grid-cols-3 gap-6">
+                        <div class="xl:col-span-2">
+                            <DataTable :value="geoTable" :sortField="geoSort.field" :sortOrder="geoSort.order" @sort="onGeoSort" class="p-datatable-sm text-sm" responsiveLayout="scroll">
+                                <Column field="city" header="Город" sortable />
+                                <Column field="activePlayers" header="Игроков" sortable />
+                                <Column field="avgEr" header="Ср. ER" sortable>
+                                    <template #body="{ data }">
+                                        <span :class="erClass(data.avgEr)">{{ fmtPct(data.avgEr) }}</span>
+                                    </template>
+                                </Column>
+                                <Column field="avgRating" header="Рейтинг" sortable>
+                                    <template #body="{ data }">
+                                        <span class="flex items-center gap-1">
+                                            <i class="pi pi-star-fill text-amber-400 text-xs" />
+                                            {{ data.avgRating?.toFixed(1) || '—' }}
+                                        </span>
+                                    </template>
+                                </Column>
+                                <Column field="avgPostsPerMonth" header="Постов/мес" sortable />
+                            </DataTable>
+                        </div>
+                        <div>
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Индекс плотности</h3>
+                            <div class="flex flex-col items-center mt-6">
+                                <GaugeChart :value="geo2.densityIndex ?? 0" />
+                                <p class="text-sm text-surface-500 mt-2 text-center w-48">Индекс перегретости конкурентной среды</p>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 3. Конкурентная карта === -->
+                <SectionBlock id="s3" title="4. Конкурентная карта" subtitle="Топ-игроки ниши: масштаб, активность, репутация">
+                    <DataTable
+                        :value="competitors"
+                        dataKey="name"
+                        :paginator="competitors.length > 10"
+                        :rows="10"
+                        responsiveLayout="scroll"
+                        class="p-datatable-sm text-sm"
+                        :expandedRows="expandedRows"
+                        @rowExpand="onRowExpand"
+                        @rowCollapse="onRowCollapse"
+                    >
+                        <Column expander style="width: 3rem" />
+                        <Column field="name" header="Бренд / Аккаунт" sortable>
+                            <template #body="{ data }">
+                                <span class="font-semibold text-surface-900 dark:text-surface-0">{{ data.name }}</span>
+                            </template>
+                        </Column>
+                        <Column field="platform" header="Платформа" sortable />
+                        <Column field="followers" header="Подписчики" sortable>
+                            <template #body="{ data }">{{ fmtNum(data.followers) }}</template>
+                        </Column>
+                        <Column field="postsPerMonth" header="Постов/мес" sortable />
+                        <Column field="er" header="ER" sortable>
+                            <template #body="{ data }">
+                                <span :class="erClass(data.er)" class="font-semibold">{{ fmtPct(data.er) }}</span>
+                            </template>
+                        </Column>
+                        <Column field="rating" header="★ Рейтинг" sortable>
+                            <template #body="{ data }">
+                                <span class="flex items-center gap-1">
+                                    <i class="pi pi-star-fill text-amber-400 text-xs" />
+                                    {{ data.rating?.toFixed(1) || '—' }}
+                                </span>
+                            </template>
+                        </Column>
+                        <Column field="reviews" header="Отзывов" sortable>
+                            <template #body="{ data }">{{ fmtNum(data.reviews) }}</template>
+                        </Column>
+                        <template #expansion="slotProps">
+                            <div class="px-4 py-3 grid grid-cols-1 md:grid-cols-2 gap-4 text-xs bg-surface-50 dark:bg-surface-800">
+                                <div>
+                                    <p class="font-semibold text-emerald-600 dark:text-emerald-400 mb-2">✓ Сильные стороны</p>
+                                    <ul class="space-y-1 text-surface-700 dark:text-surface-300">
+                                        <li v-for="(s, i) in slotProps.data.strengths || []" :key="i" class="flex gap-2"><span class="mt-1 h-1.5 w-1.5 rounded-full bg-emerald-500 shrink-0" />{{ s }}</li>
+                                        <li v-if="!slotProps.data.strengths?.length" class="italic text-surface-400">Нет данных</li>
+                                    </ul>
+                                </div>
+                                <div>
+                                    <p class="font-semibold text-rose-600 dark:text-rose-400 mb-2">✗ Слабые стороны</p>
+                                    <ul class="space-y-1 text-surface-700 dark:text-surface-300">
+                                        <li v-for="(w, i) in slotProps.data.weaknesses || []" :key="i" class="flex gap-2"><span class="mt-1 h-1.5 w-1.5 rounded-full bg-rose-500 shrink-0" />{{ w }}</li>
+                                        <li v-if="!slotProps.data.weaknesses?.length" class="italic text-surface-400">Нет данных</li>
+                                    </ul>
+                                </div>
+                            </div>
+                        </template>
+                    </DataTable>
+                    <!-- Scatter Plot placeholder -->
+                    <div class="mt-6">
+                        <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Scatter Plot: Активность vs Вовлечённость</h3>
+                        <ScatterPlotSvg :competitors="competitors" />
+                    </div>
+                </SectionBlock>
+
+                <!-- === 4. Контент-профиль === -->
+                <SectionBlock id="s4" title="5. Контент-профиль рынка" subtitle="AI-классификация контента конкурентов">
+                    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+                        <div>
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Типы контента</h3>
+                            <div class="h-64">
+                                <Chart v-if="contentChartData.labels.length" type="pie" :data="contentChartData" :options="pieOptions" class="max-h-64" />
+                                <ChartPlaceholder v-else text="Нет данных по контенту" />
+                            </div>
+                        </div>
+                        <div class="space-y-4">
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 uppercase tracking-wider">Ключевые показатели</h3>
+                            <div class="grid grid-cols-1 sm:grid-cols-3 gap-3">
+                                <div class="rounded-xl border border-surface-200 dark:border-surface-700 p-4 text-center">
+                                    <p class="text-xs text-surface-500 dark:text-surface-400 mb-1">Доля видео</p>
+                                    <p class="text-2xl font-bold text-primary-600 dark:text-primary-400">{{ fmtPct(content4.videoShare) }}</p>
+                                </div>
+                                <div class="rounded-xl border border-surface-200 dark:border-surface-700 p-4 text-center">
+                                    <p class="text-xs text-surface-500 dark:text-surface-400 mb-1">Ср. длина текста</p>
+                                    <p class="text-2xl font-bold text-violet-600 dark:text-violet-400">{{ fmtNum(content4.avgTextLengthCharacters) }}</p>
+                                    <p class="text-xs text-surface-400">симв.</p>
+                                </div>
+                                <div class="rounded-xl border border-surface-200 dark:border-surface-700 p-4 text-center">
+                                    <p class="text-xs text-surface-500 dark:text-surface-400 mb-1">Наличие CTA</p>
+                                    <p class="text-2xl font-bold text-emerald-600 dark:text-emerald-400">{{ fmtPct(content4.ctaUsagePercent) }}</p>
+                                </div>
+                            </div>
+                            <!-- Content type bars -->
+                            <div v-if="contentDistribution" class="space-y-2 mt-2">
+                                <div v-for="(val, key) in contentDistribution" :key="key" class="flex items-center gap-3">
+                                    <span class="text-xs w-24 text-surface-600 dark:text-surface-400 capitalize">{{ key }}</span>
+                                    <div class="flex-1 h-2 bg-surface-200 dark:bg-surface-700 rounded-full overflow-hidden">
+                                        <div class="h-2 rounded-full bg-gradient-to-r from-violet-400 to-primary-500" :style="{ width: val + '%' }" />
+                                    </div>
+                                    <span class="text-xs font-semibold w-10 text-right text-surface-700 dark:text-surface-300">{{ val }}%</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 5. Индекс интенсивности конкуренции === -->
+                <SectionBlock id="s5" title="6. Индекс интенсивности конкуренции" subtitle="CII: комплексная оценка давления конкурентной среды">
+                    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 items-center">
+                        <div class="flex flex-col items-center justify-center">
+                            <GaugeChart :value="cii.ciiIndex ?? 0" :label="cii.intensityLabel" />
+                        </div>
+                        <div class="grid grid-cols-1 gap-3 content-center">
+                            <div v-for="factor in ciiFactors" :key="factor" class="rounded-xl border border-surface-200 dark:border-surface-700 px-4 py-3 flex items-center gap-3 bg-surface-50 dark:bg-surface-800">
+                                <i class="pi pi-info-circle text-primary-500 shrink-0" />
+                                <p class="text-sm font-medium text-surface-800 dark:text-surface-200">{{ factor }}</p>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 6. Репутационный анализ === -->
+                <SectionBlock id="s6" title="7. Репутационный анализ" subtitle="Local Trust Layer: распределение оценок и рейтинговые паттерны">
+                    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+                        <div>
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Распределение звёзд (1–5)</h3>
+                            <div class="h-56">
+                                <Chart v-if="starChartData.labels.length" type="bar" :data="starChartData" :options="barOptions" class="h-56" />
+                                <ChartPlaceholder v-else text="Нет данных по рейтингам" />
+                            </div>
+                        </div>
+                        <div class="space-y-4">
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 uppercase tracking-wider">Ключевые метрики</h3>
+                            <div class="grid grid-cols-2 gap-3">
+                                <div class="rounded-xl bg-emerald-50 dark:bg-emerald-900/20 border border-emerald-200 dark:border-emerald-800 p-4">
+                                    <p class="text-xs text-emerald-600 dark:text-emerald-400 mb-1">Средний рейтинг</p>
+                                    <p class="text-2xl font-bold text-emerald-700 dark:text-emerald-300">{{ rep6.avgNicheRating?.toFixed(1) || '—' }}</p>
+                                </div>
+                                <div class="rounded-xl bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 p-4">
+                                    <p class="text-xs text-blue-600 dark:text-blue-400 mb-1">Медиана отзывов</p>
+                                    <p class="text-2xl font-bold text-blue-700 dark:text-blue-300">{{ fmtNum(rep6.medianReviews) }}</p>
+                                </div>
+                                <div class="rounded-xl bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 p-4">
+                                    <p class="text-xs text-amber-600 dark:text-amber-400 mb-1">Ср. время ответа</p>
+                                    <p class="text-2xl font-bold text-amber-700 dark:text-amber-300 capitalize">{{ rep6.avgOwnerResponseTimeHours ? rep6.avgOwnerResponseTimeHours + ' ч.' : '—' }}</p>
+                                </div>
+                                <div class="rounded-xl bg-violet-50 dark:bg-violet-900/20 border border-violet-200 dark:border-violet-800 p-4">
+                                    <p class="text-xs text-violet-600 dark:text-violet-400 mb-1">Доверие рынка (High Trust)</p>
+                                    <p class="text-2xl font-bold text-violet-700 dark:text-violet-300">{{ rep6.highTrustBusinessShare ? fmtPct(rep6.highTrustBusinessShare * 100) : '—' }}</p>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 7. Поведенческий паттерн === -->
+                <SectionBlock id="s7" title="8. Поведенческий паттерн рынка" subtitle="CTA-распределение и ритм публикаций">
+                    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+                        <div>
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 mb-3 uppercase tracking-wider">Распределение CTA</h3>
+                            <div class="h-56">
+                                <Chart v-if="ctaChartData.labels.length" type="bar" :data="ctaChartData" :options="hbarOptions" class="h-56" />
+                                <ChartPlaceholder v-else text="Нет данных по CTA" />
+                            </div>
+                        </div>
+                        <div class="space-y-4">
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 uppercase tracking-wider">Цикл публикаций</h3>
+                            <div class="rounded-xl border-2 border-primary-200 dark:border-primary-800 bg-primary-50 dark:bg-primary-900/20 p-5 text-center">
+                                <p class="text-xs text-primary-600 dark:text-primary-400 mb-1 uppercase tracking-wider">Средний цикл сделки</p>
+                                <p class="text-4xl font-black text-primary-700 dark:text-primary-300 capitalize">{{ beh7.avgCycleDays || '—' }}</p>
+                                <p class="text-xs text-primary-500 dark:text-primary-400 mt-1">дней</p>
+                            </div>
+                            <div v-if="(beh7.topCta || beh7.commonCta)?.length" class="space-y-2">
+                                <p class="text-xs text-surface-500 dark:text-surface-400 font-medium uppercase tracking-wider">Топ CTA-призывы</p>
+                                <div class="flex flex-wrap gap-2">
+                                    <span v-for="cta in beh7.topCta || beh7.commonCta" :key="cta" class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-surface-200 dark:bg-surface-700 text-surface-700 dark:text-surface-300">
+                                        {{ cta }}
+                                    </span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 8. Поисковый спрос и сезонность === -->
+                <SectionBlock id="s8" title="9. Поисковый спрос и сезонность" subtitle="Помесячный тренд + связанные запросы">
+                    <div>
+                        <div class="h-72">
+                            <Chart v-if="seasonChartData.labels.length" type="line" :data="seasonChartData" :options="areaOptions" class="h-72" />
+                            <ChartPlaceholder v-else text="Нет данных по сезонности" />
+                        </div>
+                        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-6">
+                            <div v-if="demand8.avgMonthlySearches" class="flex items-center gap-4 rounded-xl border border-surface-200 dark:border-surface-700 p-4">
+                                <div class="h-12 w-12 rounded-full bg-primary-100 dark:bg-primary-900/40 flex items-center justify-center shrink-0">
+                                    <i class="pi pi-search text-primary-600 dark:text-primary-400 text-xl" />
+                                </div>
+                                <div>
+                                    <p class="text-xs font-semibold text-surface-500 dark:text-surface-400 mb-0.5 uppercase tracking-wider">Частота запросов</p>
+                                    <p class="text-2xl font-bold text-surface-900 dark:text-surface-0">{{ fmtNum(demand8.avgMonthlySearches) }} <span class="text-sm font-normal text-surface-500 lowercase">в месяц</span></p>
+                                </div>
+                            </div>
+                            <div v-if="demand8.relatedQueries?.length" class="flex flex-col justify-center">
+                                <p class="text-xs text-surface-500 dark:text-surface-400 font-medium uppercase tracking-wider mb-2">Связанные поисковые запросы</p>
+                                <div class="flex flex-wrap gap-2">
+                                    <span
+                                        v-for="q in demand8.relatedQueries"
+                                        :key="q"
+                                        class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-surface-100 dark:bg-surface-800 text-surface-700 dark:text-surface-300 border border-surface-200 dark:border-surface-700"
+                                    >
+                                        {{ q }}
+                                    </span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 9. Позиционирование пользователя === -->
+                <SectionBlock id="s9" title="10. Позиционирование" subtitle="Вы vs Рынок: Radar-анализ по 5 осям">
+                    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 items-center">
+                        <div class="h-80">
+                            <Chart v-if="radarChartData.labels.length" type="radar" :data="radarChartData" :options="radarOptions" class="h-80" />
+                            <ChartPlaceholder v-else text="Нет данных для радар-чарта" />
+                        </div>
+                        <div class="space-y-4">
+                            <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-300 uppercase tracking-wider">{{ pos9.mode === 'BENCHMARK' ? 'Целевые ориентиры (Benchmark рынка)' : 'Конкурентный анализ: Ваша позиция' }}</h3>
+                            <div v-for="(axis, idx) in radarAxes" :key="axis.label" class="flex items-center gap-3">
+                                <span class="text-xs w-28 text-surface-600 dark:text-surface-400" v-tooltip.top="axis.label">{{ axis.label }}</span>
+                                <div class="flex-1 space-y-1">
+                                    <div v-if="pos9.mode !== 'BENCHMARK'" class="flex items-center gap-2">
+                                        <span class="text-xs text-primary-600 dark:text-primary-400 w-6">Вы</span>
+                                        <div class="flex-1 h-2 bg-surface-200 dark:bg-surface-700 rounded-full overflow-hidden">
+                                            <div class="h-2 rounded-full bg-primary-500" :style="{ width: axis.user + '%' }" />
+                                        </div>
+                                        <span class="text-xs font-semibold text-surface-700 dark:text-surface-300">{{ axis.user }}</span>
+                                    </div>
+                                    <div class="flex items-center gap-2">
+                                        <span class="text-xs text-amber-500 dark:text-amber-400 w-6">Рын.</span>
+                                        <div class="flex-1 h-2 bg-surface-200 dark:bg-surface-700 rounded-full overflow-hidden">
+                                            <div class="h-2 rounded-full bg-amber-400" :style="{ width: axis.market + '%' }" />
+                                        </div>
+                                        <span class="text-xs font-semibold text-surface-700 dark:text-surface-300">{{ axis.market }}</span>
+                                    </div>
+                                </div>
+                            </div>
+                            <div v-if="pos9.strategicFocus?.length" class="mt-4 pt-4 border-t border-surface-200 dark:border-surface-700">
+                                <h4 class="text-xs font-semibold text-surface-700 dark:text-surface-300 uppercase tracking-wider mb-2">На чём сфокусироваться</h4>
+                                <ul class="space-y-2">
+                                    <li v-for="(focus, i) in pos9.strategicFocus" :key="i" class="flex items-start gap-2 text-sm text-surface-800 dark:text-surface-200">
+                                        <i class="pi pi-angle-right text-primary-500 mt-1 shrink-0" />
+                                        <span>{{ focus }}</span>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 10. Структурированные выводы === -->
+                <SectionBlock id="s10" title="11. Структурированные выводы" subtitle="Факты без воды — что это значит для вашего бизнеса">
+                    <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
+                        <div v-for="(item, idx) in conclusions10" :key="idx" class="flex items-start gap-3 rounded-xl border border-surface-200 dark:border-surface-700 bg-surface-50 dark:bg-surface-800 px-4 py-3">
+                            <span class="flex-shrink-0 inline-flex items-center justify-center h-6 w-6 rounded-full bg-primary-100 dark:bg-primary-900/40 text-primary-600 dark:text-primary-300 text-xs font-bold mt-0.5">{{ idx + 1 }}</span>
+                            <p class="text-sm text-surface-800 dark:text-surface-200 leading-relaxed">{{ item }}</p>
+                        </div>
+                        <p v-if="!conclusions10.length" class="text-sm text-surface-400 italic col-span-2">Данные отсутствуют</p>
+                    </div>
+                </SectionBlock>
+
+                <!-- === 11. Обоснование канала === -->
+                <SectionBlock id="s11" title="12. Обоснование выбора канала" subtitle="Переход от аналитики к SMM-стратегии">
+                    <div class="rounded-2xl border-2 border-primary-300 dark:border-primary-700 bg-gradient-to-br from-primary-50 via-white to-violet-50 dark:from-primary-900/30 dark:via-surface-800 dark:to-violet-900/20 p-6 md:p-8">
+                        <div class="flex items-start gap-4">
+                            <div class="flex-shrink-0 h-12 w-12 rounded-xl bg-primary-500 flex items-center justify-center">
+                                <i class="pi pi-lightbulb text-white text-xl" />
+                            </div>
+                            <div class="flex-1">
+                                <h3 class="text-lg font-bold text-surface-900 dark:text-surface-0 mb-3">Логика SMM-стратегии</h3>
+                                <p class="text-sm text-surface-700 dark:text-surface-300 leading-relaxed whitespace-pre-line">{{ rationale11 || 'Данные не загружены' }}</p>
+                                <div class="mt-6 pt-5 border-t border-primary-200 dark:border-primary-700">
+                                    <Button label="Сгенерировать SMM-Стратегию (Scoring Model)" icon="pi pi-chart-line" icon-pos="right" class="w-full sm:w-auto" @click="generateStrategy" />
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </SectionBlock>
+            </template>
+            <!-- end COMPLETED -->
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.marketing-analysis-v3-page {
+    font-family: var(--font-family);
+}
+</style>
diff --git a/src/views/pages/marketing/MarketingAnalysisV3List.vue b/src/views/pages/marketing/MarketingAnalysisV3List.vue
new file mode 100644
index 0000000..33dd202
--- /dev/null
+++ b/src/views/pages/marketing/MarketingAnalysisV3List.vue
@@ -0,0 +1,271 @@
+<script setup>
+import MarketingV3Service from '@/service/MarketingV3Service';
+import { useConfirm } from 'primevue/useconfirm';
+import { useToast } from 'primevue/usetoast';
+import { computed, onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+const toast = useToast();
+const confirm = useConfirm();
+
+const analyses = ref([]);
+const loading = ref(false);
+const searchQuery = ref('');
+const filterStatus = ref('');
+const currentPage = ref(1);
+const pageSize = 10;
+
+const STATUS_FILTERS = [
+    { label: 'Все', value: '' },
+    { label: 'Завершён', value: 'COMPLETED' },
+    { label: 'В работе', value: 'PROCESSING' },
+    { label: 'В очереди', value: 'QUEUED' },
+    { label: 'Ошибка', value: 'FAILED' }
+];
+
+// ─── Load ─────────────────────────────────────────────────────────────────────
+const load = async () => {
+    loading.value = true;
+    try {
+        const data = await MarketingV3Service.getUserAnalyses();
+        analyses.value = Array.isArray(data) ? data.sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt)) : [];
+    } catch (err) {
+        toast.add({ severity: 'error', summary: 'Ошибка', detail: err.message || 'Не удалось загрузить анализы', life: 5000 });
+    } finally {
+        loading.value = false;
+    }
+};
+
+// ─── Filtered & paginated ─────────────────────────────────────────────────────
+const filtered = computed(() => {
+    let list = analyses.value;
+    if (filterStatus.value) list = list.filter((a) => a.status === filterStatus.value);
+    if (searchQuery.value.trim()) {
+        const q = searchQuery.value.trim().toLowerCase();
+        list = list.filter((a) => {
+            const niche = (a.requestData?.businessNiche || a.businessNiche || '').toLowerCase();
+            const city = cityLabel(a).toLowerCase();
+            return niche.includes(q) || city.includes(q);
+        });
+    }
+    return list;
+});
+const paginated = computed(() => {
+    const start = (currentPage.value - 1) * pageSize;
+    return filtered.value.slice(start, start + pageSize);
+});
+
+const countByStatus = (s) => analyses.value.filter((a) => a.status === s).length;
+
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+const cityLabel = (item) => {
+    const rd = item.requestData || item;
+    if (rd.mainCity) return rd.mainCity;
+    if (rd.presenceCities?.length) return rd.presenceCities.join(', ');
+    if (rd.promotionCities?.length) return rd.promotionCities.join(', ');
+
+    // Fallback if none of the above are set but it's a V3 analysis
+    if (rd.geoScope === 'FULL_COUNTRY') return 'Вся страна';
+    if (rd.geoScope === 'ONLINE') return 'Онлайн';
+
+    return 'География не указана';
+};
+
+const formatDate = (dt) => (dt ? new Date(dt).toLocaleString('ru-RU', { day: '2-digit', month: 'short', year: 'numeric', hour: '2-digit', minute: '2-digit' }) : '—');
+
+const statusLabel = (s) => ({ COMPLETED: 'Завершён', PROCESSING: 'В работе', QUEUED: 'В очереди', FAILED: 'Ошибка' })[s] || s;
+
+const statusIcon = (s) =>
+    ({
+        COMPLETED: 'pi pi-check-circle text-emerald-500',
+        PROCESSING: 'pi pi-spin pi-spinner text-blue-500',
+        QUEUED: 'pi pi-clock text-amber-500',
+        FAILED: 'pi pi-times-circle text-red-500'
+    })[s] || 'pi pi-circle text-surface-400';
+
+const statusBg = (s) =>
+    ({
+        COMPLETED: 'bg-emerald-50 dark:bg-emerald-900/20',
+        PROCESSING: 'bg-blue-50 dark:bg-blue-900/20',
+        QUEUED: 'bg-amber-50 dark:bg-amber-900/20',
+        FAILED: 'bg-red-50 dark:bg-red-900/20'
+    })[s] || 'bg-surface-100 dark:bg-surface-800';
+
+const statusTagClass = (s) =>
+    ({
+        COMPLETED: 'bg-emerald-100 text-emerald-700 dark:bg-emerald-900/40 dark:text-emerald-300',
+        PROCESSING: 'bg-blue-100 text-blue-700 dark:bg-blue-900/40 dark:text-blue-300',
+        QUEUED: 'bg-amber-100 text-amber-700 dark:bg-amber-900/40 dark:text-amber-300',
+        FAILED: 'bg-red-100 text-red-700 dark:bg-red-900/40 dark:text-red-300'
+    })[s] || 'bg-surface-200 text-surface-600 dark:bg-surface-700 dark:text-surface-300';
+
+// ─── Actions ──────────────────────────────────────────────────────────────────
+const openAnalysis = (item) => {
+    if (item.status === 'COMPLETED') {
+        router.push(`/marketing-analysis/v3/${item.id}`);
+    } else if (item.status === 'PROCESSING' || item.status === 'QUEUED') {
+        router.push(`/marketing-analysis/v3/${item.id}`);
+    }
+};
+
+const retry = (item) => {
+    router.push('/marketing-analysis/v3/new');
+};
+
+const confirmDelete = (item) => {
+    confirm.require({
+        message: `Удалить анализ "${item.requestData?.businessNiche || 'без названия'}"?`,
+        header: 'Подтверждение удаления',
+        icon: 'pi pi-exclamation-triangle',
+        acceptLabel: 'Удалить',
+        rejectLabel: 'Отмена',
+        acceptClass: 'p-button-danger',
+        accept: () => {
+            // TODO: добавить DELETE /api/v3/marketing-analysis/{id} когда появится в API
+            analyses.value = analyses.value.filter((a) => a.id !== item.id);
+            toast.add({ severity: 'success', summary: 'Удалено', detail: 'Анализ удалён', life: 3000 });
+        }
+    });
+};
+
+onMounted(load);
+</script>
+
+<template>
+    <div class="bg-surface-50 dark:bg-surface-900 min-h-screen p-4 md:p-6">
+        <Toast />
+
+        <!-- ─── Header ─────────────────────────────────────────────────────── -->
+        <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3 mb-6">
+            <div>
+                <div class="flex items-center gap-2 mb-1">
+                    <span class="text-xs font-bold tracking-widest uppercase text-primary-500">МАРКЕТИНГОВЫЙ АНАЛИЗ v4.0</span>
+                </div>
+                <h1 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Мои анализы</h1>
+                <p class="text-sm text-surface-500 dark:text-surface-400 mt-0.5">Data-Driven + SMM Execution Ready</p>
+            </div>
+            <Button label="Создать новый анализ" icon="pi pi-plus" @click="$router.push('/marketing-analysis/v3/new')" class="shrink-0" />
+        </div>
+
+        <!-- ─── Search + Filter bar ───────────────────────────────────────── -->
+        <div class="card mb-4">
+            <div class="flex flex-col sm:flex-row gap-3 items-start sm:items-center justify-between">
+                <span class="p-input-icon-left flex-1 max-w-xs">
+                    <i class="pi pi-search" />
+                    <InputText v-model="searchQuery" placeholder="Поиск по нише, городу..." class="w-full text-sm" />
+                </span>
+                <div class="flex items-center gap-2 flex-wrap">
+                    <button
+                        v-for="f in STATUS_FILTERS"
+                        :key="f.value"
+                        @click="filterStatus = f.value"
+                        :class="[
+                            'px-3 py-1.5 rounded-full text-xs font-semibold transition-all',
+                            filterStatus === f.value ? 'bg-primary-500 text-white shadow-sm' : 'bg-surface-200 dark:bg-surface-700 text-surface-600 dark:text-surface-300 hover:bg-surface-300 dark:hover:bg-surface-600'
+                        ]"
+                    >
+                        {{ f.label }}
+                        <span v-if="f.value" class="ml-1 opacity-75">({{ countByStatus(f.value) }})</span>
+                    </button>
+                    <Button icon="pi pi-refresh" severity="secondary" text rounded size="small" :loading="loading" @click="load" v-tooltip.top="'Обновить'" />
+                </div>
+            </div>
+        </div>
+
+        <!-- ─── Loading skeleton ──────────────────────────────────────────── -->
+        <div v-if="loading" class="space-y-3">
+            <div v-for="i in 4" :key="i" class="card animate-pulse">
+                <div class="h-4 bg-surface-200 dark:bg-surface-700 rounded w-1/3 mb-3" />
+                <div class="h-3 bg-surface-200 dark:bg-surface-700 rounded w-2/3" />
+            </div>
+        </div>
+
+        <!-- ─── Empty state ───────────────────────────────────────────────── -->
+        <div v-else-if="!filtered.length" class="card text-center py-20">
+            <div class="inline-flex items-center justify-center w-20 h-20 rounded-2xl bg-primary-50 dark:bg-primary-900/30 mb-5">
+                <i class="pi pi-chart-line text-4xl text-primary-500" />
+            </div>
+            <h2 class="text-xl font-bold text-surface-900 dark:text-surface-0 mb-2">
+                {{ filterStatus ? 'Нет анализов с таким статусом' : 'Анализов пока нет' }}
+            </h2>
+            <p class="text-sm text-surface-500 dark:text-surface-400 max-w-sm mx-auto mb-6">Запустите первый маркетинговый анализ — ИИ соберёт данные по конкурентам и даст конкретные рекомендации.</p>
+            <Button label="Создать первый анализ" icon="pi pi-plus" @click="$router.push('/marketing-analysis/v3/new')" />
+        </div>
+
+        <!-- ─── Analysis Cards Grid ───────────────────────────────────────── -->
+        <div v-else class="space-y-3">
+            <TransitionGroup name="list-fade" tag="div" class="space-y-3">
+                <div v-for="item in paginated" :key="item.id" class="card cursor-pointer hover:-translate-y-0.5 hover:shadow-md transition-all duration-200 border border-surface-200 dark:border-surface-700" @click="openAnalysis(item)">
+                    <div class="flex flex-col sm:flex-row sm:items-center gap-4">
+                        <!-- Status badge -->
+                        <div class="shrink-0">
+                            <div :class="['w-12 h-12 rounded-xl flex items-center justify-center', statusBg(item.status)]">
+                                <i :class="['text-xl', statusIcon(item.status)]" />
+                            </div>
+                        </div>
+
+                        <!-- Main info -->
+                        <div class="flex-1 min-w-0">
+                            <div class="flex flex-wrap items-center gap-2 mb-1">
+                                <h3 class="text-sm font-bold text-surface-900 dark:text-surface-0 truncate">
+                                    {{ item.requestData?.businessNiche || item.businessNiche || 'Анализ #' + item.id?.slice(-6) }}
+                                </h3>
+                                <span :class="['inline-flex items-center px-2 py-0.5 rounded-full text-xs font-semibold', statusTagClass(item.status)]">
+                                    {{ statusLabel(item.status) }}
+                                </span>
+                            </div>
+                            <div class="flex flex-wrap gap-x-4 gap-y-1 text-xs text-surface-500 dark:text-surface-400">
+                                <span v-if="item.requestData?.productName || item.productName"> <i class="pi pi-tag mr-1" />{{ item.requestData?.productName || item.productName }} </span>
+                                <span v-if="cityLabel(item)"> <i class="pi pi-map-marker mr-1" />{{ cityLabel(item) }} </span>
+                                <span v-if="item.requestData?.analysisType?.length"> <i class="pi pi-list mr-1" />{{ (item.requestData.analysisType || []).join(', ') }} </span>
+                                <span> <i class="pi pi-calendar mr-1" />{{ formatDate(item.createdAt) }} </span>
+                                <span v-if="item.completedAt && item.status === 'COMPLETED'"> <i class="pi pi-check-circle mr-1 text-emerald-500" />{{ formatDate(item.completedAt) }} </span>
+                            </div>
+                        </div>
+
+                        <!-- Actions -->
+                        <div class="flex items-center gap-1 shrink-0" @click.stop>
+                            <Button v-if="item.status === 'COMPLETED'" icon="pi pi-eye" v-tooltip.top="'Открыть дашборд'" severity="info" text rounded size="small" @click="openAnalysis(item)" />
+                            <Button v-if="item.status === 'COMPLETED'" icon="pi pi-chart-bar" v-tooltip.top="'Предпросмотр (mock)'" severity="secondary" text rounded size="small" @click="$router.push(`/marketing-analysis/v3/${item.id}?preview=1`)" />
+                            <Button v-if="item.status === 'FAILED' || item.status === 'COMPLETED'" icon="pi pi-refresh" v-tooltip.top="'Повторить анализ'" severity="secondary" text rounded size="small" @click="retry(item)" />
+                            <Button icon="pi pi-trash" v-tooltip.top="'Удалить'" severity="danger" text rounded size="small" @click="confirmDelete(item)" />
+                        </div>
+                    </div>
+
+                    <!-- Progress bar for PROCESSING -->
+                    <div v-if="item.status === 'PROCESSING' || item.status === 'QUEUED'" class="mt-3">
+                        <div class="flex justify-between text-xs text-surface-500 dark:text-surface-400 mb-1">
+                            <span>{{ item.status === 'QUEUED' ? 'В очереди...' : 'Анализ выполняется...' }}</span>
+                            <span>{{ item.status === 'QUEUED' ? '0%' : '~50%' }}</span>
+                        </div>
+                        <div class="h-1.5 bg-surface-200 dark:bg-surface-700 rounded-full overflow-hidden">
+                            <div class="h-1.5 rounded-full bg-gradient-to-r from-primary-400 to-primary-600 animate-pulse" :style="{ width: item.status === 'QUEUED' ? '10%' : '55%' }" />
+                        </div>
+                    </div>
+                </div>
+            </TransitionGroup>
+
+            <!-- Pagination -->
+            <div v-if="filtered.length > pageSize" class="flex items-center justify-between pt-2">
+                <p class="text-xs text-surface-500 dark:text-surface-400">Показано {{ (currentPage - 1) * pageSize + 1 }}–{{ Math.min(currentPage * pageSize, filtered.length) }} из {{ filtered.length }}</p>
+                <Paginator :rows="pageSize" :totalRecords="filtered.length" :first="(currentPage - 1) * pageSize" @page="currentPage = $event.page + 1" template="PrevPageLink PageLinks NextPageLink" />
+            </div>
+        </div>
+
+        <!-- ─── Delete Confirm Dialog ─────────────────────────────────────── -->
+        <ConfirmDialog />
+    </div>
+</template>
+
+<style scoped>
+.list-fade-enter-active,
+.list-fade-leave-active {
+    transition: all 0.25s ease;
+}
+.list-fade-enter-from,
+.list-fade-leave-to {
+    opacity: 0;
+    transform: translateY(-8px);
+}
+</style>
diff --git a/src/views/pages/marketing/MarketingCredentials.vue b/src/views/pages/marketing/MarketingCredentials.vue
index b8dc90f..4d2d788 100644
--- a/src/views/pages/marketing/MarketingCredentials.vue
+++ b/src/views/pages/marketing/MarketingCredentials.vue
@@ -1,128 +1,5 @@
-<template>
-    <div class="marketing-credentials-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
-        <Toast />
-        <div class="max-w-[1200px] mx-auto">
-            <div class="card mb-4">
-                <div class="card-header mb-4">
-                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Управление credentials социальных сетей</h2>
-                    <p class="text-sm text-surface-500 dark:text-surface-400 mt-2">Настройте access tokens для платформ, на которых вы хотите автоматически публиковать контент</p>
-                </div>
-                <div class="card-content">
-                    <form @submit.prevent="handleSaveCredentials" class="space-y-4">
-                        <div class="grid">
-                            <div class="col-12 md:col-4">
-                                <div class="field">
-                                    <label for="platform" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Платформа <span class="text-red-500">*</span> </label>
-                                    <Dropdown id="platform" v-model="formData.platform" :options="platformOptions" placeholder="Выберите платформу" class="w-full" :class="{ 'p-invalid': errors.platform }" />
-                                    <small v-if="errors.platform" class="p-error">{{ errors.platform }}</small>
-                                </div>
-                            </div>
-                            <!-- Поля для простых платформ (Facebook, LinkedIn, etc.) -->
-                            <template v-if="formData.platform && formData.platform !== 'telegram'">
-                                <div class="col-12 md:col-6">
-                                    <div class="field">
-                                        <label for="credentials" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Access Token <span class="text-red-500">*</span> </label>
-                                        <InputText id="credentials" v-model="formData.credentials" type="password" placeholder="Введите access token" class="w-full" :class="{ 'p-invalid': errors.credentials }" />
-                                        <small v-if="errors.credentials" class="p-error">{{ errors.credentials }}</small>
-                                        <small class="text-surface-500 dark:text-surface-400 mt-1 block"> Токен будет зашифрован перед сохранением </small>
-                                    </div>
-                                </div>
-                            </template>
-
-                            <!-- Поля для Telegram -->
-                            <template v-if="formData.platform === 'telegram'">
-                                <div class="col-12 md:col-3">
-                                    <div class="field">
-                                        <label for="botToken" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Bot Token <span class="text-red-500">*</span> </label>
-                                        <InputText id="botToken" v-model="formData.botToken" type="password" placeholder="Введите bot token от @BotFather" class="w-full" :class="{ 'p-invalid': errors.botToken }" />
-                                        <small v-if="errors.botToken" class="p-error">{{ errors.botToken }}</small>
-                                        <small class="text-surface-500 dark:text-surface-400 mt-1 block"> Токен бота, полученный от @BotFather </small>
-                                    </div>
-                                </div>
-                                <div class="col-12 md:col-3">
-                                    <div class="field">
-                                        <label for="chatId" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Chat ID <span class="text-red-500">*</span> </label>
-                                        <InputText id="chatId" v-model="formData.chatId" type="text" placeholder="Введите chat ID (например: -1001234567890)" class="w-full" :class="{ 'p-invalid': errors.chatId }" />
-                                        <small v-if="errors.chatId" class="p-error">{{ errors.chatId }}</small>
-                                        <small class="text-surface-500 dark:text-surface-400 mt-1 block"> ID чата/канала (может быть отрицательным для групп и каналов) </small>
-                                    </div>
-                                </div>
-                            </template>
-
-                            <div class="col-12 md:col-2">
-                                <div class="field">
-                                    <label class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300">&nbsp;</label>
-                                    <Button type="submit" label="Сохранить" icon="pi pi-save" class="w-full" :loading="saving" />
-                                </div>
-                            </div>
-                        </div>
-                    </form>
-                </div>
-            </div>
-
-            <div class="card">
-                <div class="card-header mb-4">
-                    <div class="flex justify-content-between align-items-center">
-                        <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Настроенные платформы</h3>
-                        <Button label="Обновить" icon="pi pi-refresh" severity="secondary" @click="loadCredentials" :loading="loading" />
-                    </div>
-                </div>
-                <div class="card-content">
-                    <DataTable :value="credentials" :loading="loading" paginator :rows="10" :rowsPerPageOptions="[5, 10, 20]" dataKey="platform" :emptyMessage="'Нет настроенных платформ'">
-                        <Column field="platform" header="Платформа" :sortable="true" style="min-width: 150px">
-                            <template #body="slotProps">
-                                <Tag :value="slotProps.data.platform" severity="info" />
-                            </template>
-                        </Column>
-
-                        <Column field="hasCredentials" header="Статус" :sortable="true" style="min-width: 120px">
-                            <template #body="slotProps">
-                                <Tag :value="slotProps.data.hasCredentials ? 'Настроено' : 'Не настроено'" :severity="slotProps.data.hasCredentials ? 'success' : 'warning'" />
-                            </template>
-                        </Column>
-
-                        <Column field="createdAt" header="Создано" :sortable="true" style="min-width: 180px">
-                            <template #body="slotProps">
-                                <span v-if="slotProps.data.createdAt">{{ formatDateTime(slotProps.data.createdAt) }}</span>
-                                <span v-else class="text-surface-400">—</span>
-                            </template>
-                        </Column>
-
-                        <Column field="updatedAt" header="Обновлено" :sortable="true" style="min-width: 180px">
-                            <template #body="slotProps">
-                                <span v-if="slotProps.data.updatedAt">{{ formatDateTime(slotProps.data.updatedAt) }}</span>
-                                <span v-else class="text-surface-400">—</span>
-                            </template>
-                        </Column>
-
-                        <Column header="Действия" style="min-width: 150px">
-                            <template #body="slotProps">
-                                <Button icon="pi pi-trash" severity="danger" size="small" v-tooltip.top="'Удалить credentials'" @click="confirmDelete(slotProps.data.platform)" :disabled="!slotProps.data.hasCredentials" />
-                            </template>
-                        </Column>
-                    </DataTable>
-                </div>
-            </div>
-        </div>
-
-        <!-- Диалог подтверждения удаления -->
-        <Dialog v-model:visible="deleteDialogVisible" :header="'Подтверждение удаления'" :style="{ width: '450px' }" :modal="true">
-            <div class="confirmation-content">
-                <i class="pi pi-exclamation-triangle mr-3" style="font-size: 2rem" />
-                <span
-                    >Вы уверены, что хотите удалить credentials для платформы <b>{{ platformToDelete }}</b
-                    >?</span
-                >
-            </div>
-            <template #footer>
-                <Button label="Отмена" icon="pi pi-times" @click="deleteDialogVisible = false" severity="secondary" />
-                <Button label="Удалить" icon="pi pi-check" @click="handleDeleteCredentials" severity="danger" :loading="deleting" />
-            </template>
-        </Dialog>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import MarketingService from '@/service/MarketingService';
 import Button from 'primevue/button';
 import Column from 'primevue/column';
@@ -372,6 +249,130 @@ onMounted(() => {
 });
 </script>
 
+<template>
+    <div class="marketing-credentials-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
+        <Toast />
+        <div class="max-w-[1200px] mx-auto">
+            <div class="card mb-4">
+                <div class="card-header mb-4">
+                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Управление credentials социальных сетей</h2>
+                    <p class="text-sm text-surface-500 dark:text-surface-400 mt-2">Настройте access tokens для платформ, на которых вы хотите автоматически публиковать контент</p>
+                </div>
+                <div class="card-content">
+                    <form @submit.prevent="handleSaveCredentials" class="space-y-4">
+                        <div class="grid">
+                            <div class="col-12 md:col-4">
+                                <div class="field">
+                                    <label for="platform" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Платформа <span class="text-red-500">*</span> </label>
+                                    <Dropdown id="platform" v-model="formData.platform" :options="platformOptions" placeholder="Выберите платформу" class="w-full" :class="{ 'p-invalid': errors.platform }" />
+                                    <small v-if="errors.platform" class="p-error">{{ errors.platform }}</small>
+                                </div>
+                            </div>
+                            <!-- Поля для простых платформ (Facebook, LinkedIn, etc.) -->
+                            <template v-if="formData.platform && formData.platform !== 'telegram'">
+                                <div class="col-12 md:col-6">
+                                    <div class="field">
+                                        <label for="credentials" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Access Token <span class="text-red-500">*</span> </label>
+                                        <InputText id="credentials" v-model="formData.credentials" type="password" placeholder="Введите access token" class="w-full" :class="{ 'p-invalid': errors.credentials }" />
+                                        <small v-if="errors.credentials" class="p-error">{{ errors.credentials }}</small>
+                                        <small class="text-surface-500 dark:text-surface-400 mt-1 block"> Токен будет зашифрован перед сохранением </small>
+                                    </div>
+                                </div>
+                            </template>
+
+                            <!-- Поля для Telegram -->
+                            <template v-if="formData.platform === 'telegram'">
+                                <div class="col-12 md:col-3">
+                                    <div class="field">
+                                        <label for="botToken" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Bot Token <span class="text-red-500">*</span> </label>
+                                        <InputText id="botToken" v-model="formData.botToken" type="password" placeholder="Введите bot token от @BotFather" class="w-full" :class="{ 'p-invalid': errors.botToken }" />
+                                        <small v-if="errors.botToken" class="p-error">{{ errors.botToken }}</small>
+                                        <small class="text-surface-500 dark:text-surface-400 mt-1 block"> Токен бота, полученный от @BotFather </small>
+                                    </div>
+                                </div>
+                                <div class="col-12 md:col-3">
+                                    <div class="field">
+                                        <label for="chatId" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Chat ID <span class="text-red-500">*</span> </label>
+                                        <InputText id="chatId" v-model="formData.chatId" type="text" placeholder="Введите chat ID (например: -1001234567890)" class="w-full" :class="{ 'p-invalid': errors.chatId }" />
+                                        <small v-if="errors.chatId" class="p-error">{{ errors.chatId }}</small>
+                                        <small class="text-surface-500 dark:text-surface-400 mt-1 block"> ID чата/канала (может быть отрицательным для групп и каналов) </small>
+                                    </div>
+                                </div>
+                            </template>
+
+                            <div class="col-12 md:col-2">
+                                <div class="field">
+                                    <label class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300">&nbsp;</label>
+                                    <Button type="submit" label="Сохранить" icon="pi pi-save" class="w-full" :loading="saving" />
+                                </div>
+                            </div>
+                        </div>
+                    </form>
+                </div>
+            </div>
+
+            <div class="card">
+                <div class="card-header mb-4">
+                    <div class="flex justify-content-between align-items-center">
+                        <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Настроенные платформы</h3>
+                        <Button label="Обновить" icon="pi pi-refresh" severity="secondary" @click="loadCredentials" :loading="loading" />
+                    </div>
+                </div>
+                <div class="card-content">
+                    <DataTable :value="credentials" :loading="loading" paginator :rows="10" :rowsPerPageOptions="[5, 10, 20]" dataKey="platform" :emptyMessage="'Нет настроенных платформ'">
+                        <Column field="platform" header="Платформа" :sortable="true" style="min-width: 150px">
+                            <template #body="slotProps">
+                                <Tag :value="slotProps.data.platform" severity="info" />
+                            </template>
+                        </Column>
+
+                        <Column field="hasCredentials" header="Статус" :sortable="true" style="min-width: 120px">
+                            <template #body="slotProps">
+                                <Tag :value="slotProps.data.hasCredentials ? 'Настроено' : 'Не настроено'" :severity="slotProps.data.hasCredentials ? 'success' : 'warning'" />
+                            </template>
+                        </Column>
+
+                        <Column field="createdAt" header="Создано" :sortable="true" style="min-width: 180px">
+                            <template #body="slotProps">
+                                <span v-if="slotProps.data.createdAt">{{ formatDateTime(slotProps.data.createdAt) }}</span>
+                                <span v-else class="text-surface-400">—</span>
+                            </template>
+                        </Column>
+
+                        <Column field="updatedAt" header="Обновлено" :sortable="true" style="min-width: 180px">
+                            <template #body="slotProps">
+                                <span v-if="slotProps.data.updatedAt">{{ formatDateTime(slotProps.data.updatedAt) }}</span>
+                                <span v-else class="text-surface-400">—</span>
+                            </template>
+                        </Column>
+
+                        <Column header="Действия" style="min-width: 150px">
+                            <template #body="slotProps">
+                                <Button icon="pi pi-trash" severity="danger" size="small" v-tooltip.top="'Удалить credentials'" @click="confirmDelete(slotProps.data.platform)" :disabled="!slotProps.data.hasCredentials" />
+                            </template>
+                        </Column>
+                    </DataTable>
+                </div>
+            </div>
+        </div>
+
+        <!-- Диалог подтверждения удаления -->
+        <Dialog v-model:visible="deleteDialogVisible" :header="'Подтверждение удаления'" :style="{ width: '450px' }" :modal="true">
+            <div class="confirmation-content">
+                <i class="pi pi-exclamation-triangle mr-3" style="font-size: 2rem" />
+                <span
+                    >Вы уверены, что хотите удалить credentials для платформы <b>{{ platformToDelete }}</b
+                    >?</span
+                >
+            </div>
+            <template #footer>
+                <Button label="Отмена" icon="pi pi-times" @click="deleteDialogVisible = false" severity="secondary" />
+                <Button label="Удалить" icon="pi pi-check" @click="handleDeleteCredentials" severity="danger" :loading="deleting" />
+            </template>
+        </Dialog>
+    </div>
+</template>
+
 <style scoped>
 .marketing-credentials-page {
     font-family: var(--font-family);
diff --git a/src/views/pages/marketing/MarketingMain.vue b/src/views/pages/marketing/MarketingMain.vue
index 3dbe2f0..d7c4a88 100644
--- a/src/views/pages/marketing/MarketingMain.vue
+++ b/src/views/pages/marketing/MarketingMain.vue
@@ -1,41 +1,5 @@
-<template>
-    <div class="marketing-main-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
-        <div class="max-w-[1920px] mx-auto">
-            <div class="flex justify-center">
-                <!-- Navigation Menu -->
-                <div class="w-full max-w-md">
-                    <div class="card h-full">
-                        <div class="card-header mb-4">
-                            <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Маркетинг</h2>
-                        </div>
-                        <div class="card-content space-y-3">
-                            <div
-                                v-for="item in menuItems"
-                                :key="item.id"
-                                class="menu-item p-4 rounded-lg cursor-pointer transition-colors"
-                                :class="{
-                                    'bg-primary-50 dark:bg-primary-900': activeMenu === item.id,
-                                    'hover:bg-surface-100 dark:hover:bg-surface-800': activeMenu !== item.id
-                                }"
-                                @click="navigateTo(item.route)"
-                            >
-                                <div class="flex items-center justify-between">
-                                    <div class="flex items-center gap-3">
-                                        <i :class="[item.icon, item.iconColor, 'text-xl']"></i>
-                                        <span class="font-medium text-surface-900 dark:text-surface-0">{{ item.label }}</span>
-                                    </div>
-                                    <div class="w-2 h-2 rounded-full bg-surface-400"></div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
@@ -44,6 +8,13 @@ const router = useRouter();
 // Menu items
 const activeMenu = ref('main');
 const menuItems = [
+    {
+        id: 'analysis-v3',
+        label: 'Маркетинговый анализ v4.0 (новый)',
+        icon: 'pi pi-sparkles',
+        iconColor: 'text-primary-500',
+        route: '/marketing-analysis/v3'
+    },
     {
         id: 'analysis',
         label: 'Маркетинговый анализ',
@@ -101,6 +72,43 @@ const navigateTo = (route) => {
 };
 </script>
 
+<template>
+    <div class="marketing-main-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
+        <div class="max-w-[1920px] mx-auto">
+            <div class="flex justify-center">
+                <!-- Navigation Menu -->
+                <div class="w-full max-w-md">
+                    <div class="card h-full">
+                        <div class="card-header mb-4">
+                            <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Маркетинг</h2>
+                        </div>
+                        <div class="card-content space-y-3">
+                            <div
+                                v-for="item in menuItems"
+                                :key="item.id"
+                                class="menu-item p-4 rounded-lg cursor-pointer transition-colors"
+                                :class="{
+                                    'bg-primary-50 dark:bg-primary-900': activeMenu === item.id,
+                                    'hover:bg-surface-100 dark:hover:bg-surface-800': activeMenu !== item.id
+                                }"
+                                @click="navigateTo(item.route)"
+                            >
+                                <div class="flex items-center justify-between">
+                                    <div class="flex items-center gap-3">
+                                        <i :class="[item.icon, item.iconColor, 'text-xl']"></i>
+                                        <span class="font-medium text-surface-900 dark:text-surface-0">{{ item.label }}</span>
+                                    </div>
+                                    <div class="w-2 h-2 rounded-full bg-surface-400"></div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .marketing-main-page {
     font-family: var(--font-family);
@@ -127,5 +135,14 @@ const navigateTo = (route) => {
 
 .menu-item {
     transition: all 0.2s ease;
+    border: 1px solid transparent;
+}
+
+.menu-item:hover {
+    border-color: var(--primary-color);
+    transform: translateY(-2px);
+    box-shadow:
+        0 4px 6px -1px rgba(0, 0, 0, 0.1),
+        0 2px 4px -1px rgba(0, 0, 0, 0.06);
 }
 </style>
diff --git a/src/views/pages/marketing/MarketingPromotion.vue b/src/views/pages/marketing/MarketingPromotion.vue
index 3c5102e..593deb6 100644
--- a/src/views/pages/marketing/MarketingPromotion.vue
+++ b/src/views/pages/marketing/MarketingPromotion.vue
@@ -1,348 +1,5 @@
-<template>
-    <div class="marketing-promotion-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
-        <Toast />
-        <div class="w-full mx-auto px-4">
-            <!-- Форма запуска генерации стратегии -->
-            <div v-if="!strategyId && !strategyData" class="card">
-                <div class="card-header mb-4">
-                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Генерация стратегии продвижения</h2>
-                    <p class="text-sm text-surface-500 dark:text-surface-400 mt-2">Создайте детальную стратегию продвижения на основе завершенного маркетингового анализа</p>
-                </div>
-                <div class="card-content">
-                    <form @submit.prevent="handleGenerateStrategy" class="space-y-4 max-w-2xl">
-                        <div class="field">
-                            <label for="analysisId" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> ID анализа <span class="text-red-500">*</span> </label>
-                            <InputText id="analysisId" v-model="formData.analysisId" placeholder="Введите ID завершенного анализа" class="w-full" :class="{ 'p-invalid': errors.analysisId }" />
-                            <small v-if="errors.analysisId" class="p-error">{{ errors.analysisId }}</small>
-                            <small class="text-surface-500 dark:text-surface-400"> ID можно получить из завершенного маркетингового анализа </small>
-                        </div>
-
-                        <div class="field">
-                            <label for="durationWeeks" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Длительность стратегии (недели) </label>
-                            <InputNumber id="durationWeeks" v-model="formData.durationWeeks" :min="1" :max="12" placeholder="4" class="w-full" :class="{ 'p-invalid': errors.durationWeeks }" />
-                            <small v-if="errors.durationWeeks" class="p-error">{{ errors.durationWeeks }}</small>
-                            <small class="text-surface-500 dark:text-surface-400">От 1 до 12 недель (по умолчанию: 4)</small>
-                        </div>
-
-                        <div class="field">
-                            <label for="priorityPlatforms" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Приоритетные платформы </label>
-                            <MultiSelect id="priorityPlatforms" v-model="formData.priorityPlatforms" :options="platformOptions" placeholder="Выберите платформы (необязательно)" class="w-full" display="chip" />
-                            <small class="text-surface-500 dark:text-surface-400"> Если не указано, будут использованы все популярные платформы </small>
-                        </div>
-
-                        <Button type="submit" label="Сгенерировать стратегию" icon="pi pi-magic" class="w-full p-button-primary" :loading="generating" />
-
-                        <p class="text-sm text-surface-500 dark:text-surface-400 mt-3 text-center">Генерация стратегии занимает примерно 3-5 минут</p>
-                    </form>
-                </div>
-            </div>
-
-            <!-- Статус обработки -->
-            <div v-else-if="status === 'processing' || status === 'queued'" class="card">
-                <div class="card-header mb-4">
-                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Генерация стратегии</h2>
-                </div>
-                <div class="card-content">
-                    <div class="text-center py-6">
-                        <ProgressSpinner size="50" />
-                        <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Стратегия генерируется...</p>
-                        <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Это может занять 3-5 минут. Пожалуйста, подождите.</p>
-                        <Button label="Отменить ожидание" icon="pi pi-times" severity="secondary" class="mt-4" @click="resetStrategy" />
-                    </div>
-                </div>
-            </div>
-
-            <!-- Ошибка -->
-            <div v-else-if="status === 'failed'" class="card">
-                <div class="card-header mb-4">
-                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Ошибка генерации</h2>
-                </div>
-                <div class="card-content">
-                    <div class="text-center py-6">
-                        <i class="pi pi-exclamation-triangle text-6xl text-red-500 mb-3"></i>
-                        <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Генерация стратегии завершилась с ошибкой</p>
-                        <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Попробуйте запустить генерацию снова или обратитесь в поддержку.</p>
-                        <Button label="Попробовать снова" icon="pi pi-refresh" class="mt-4" @click="resetStrategy" />
-                    </div>
-                </div>
-            </div>
-
-            <!-- Результаты стратегии -->
-            <div v-else-if="status === 'completed' && strategyData?.strategy" class="space-y-4">
-                <!-- Заголовок -->
-                <div class="card">
-                    <div class="card-header mb-4">
-                        <div class="flex justify-content-between align-items-center">
-                            <div>
-                                <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Стратегия продвижения</h2>
-                                <p class="text-sm text-surface-500 dark:text-surface-400 mt-1">Длительность: {{ strategyData.durationWeeks }} {{ pluralize(strategyData.durationWeeks, 'неделя', 'недели', 'недель') }}</p>
-                            </div>
-                            <div class="flex gap-2">
-                                <Button label="Запустить стратегию" icon="pi pi-play" severity="success" @click="handleStartStrategy" :loading="startingStrategy" :disabled="startingStrategy" />
-                                <Button label="Создать новую стратегию" icon="pi pi-plus" severity="secondary" @click="resetStrategy" />
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Недельный план -->
-                <div v-if="strategyData.strategy.weeklyPlans && strategyData.strategy.weeklyPlans.length > 0" class="card">
-                    <div class="card-header mb-4">
-                        <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Недельный план</h3>
-                    </div>
-                    <div class="card-content">
-                        <div class="weekly-plans-container">
-                            <div v-for="plan in strategyData.strategy.weeklyPlans" :key="plan.weekNumber" class="weekly-plan-item">
-                                <div class="week-plan-card p-3 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 square-card">
-                                    <div class="flex align-items-center justify-content-between mb-2">
-                                        <Tag :value="`Неделя ${plan.weekNumber}`" severity="info" />
-                                    </div>
-
-                                    <div v-if="plan.mainThemes && plan.mainThemes.length > 0" class="mb-2">
-                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Основные темы:</p>
-                                        <ul class="list-none p-0 m-0">
-                                            <li v-for="(theme, idx) in plan.mainThemes" :key="idx" class="flex align-items-start mb-1">
-                                                <i class="pi pi-circle-fill text-primary-500 text-xs mr-1 mt-1"></i>
-                                                <span class="text-surface-700 dark:text-surface-300 text-xs line-height-2">{{ theme }}</span>
-                                            </li>
-                                        </ul>
-                                    </div>
-
-                                    <div v-if="plan.contentRecommendations" class="mb-2">
-                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Рекомендации:</p>
-                                        <p class="text-surface-700 dark:text-surface-300 text-xs whitespace-pre-line line-height-2">
-                                            {{ plan.contentRecommendations }}
-                                        </p>
-                                    </div>
-
-                                    <div v-if="plan.priorityPlatforms && plan.priorityPlatforms.length > 0">
-                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Платформы:</p>
-                                        <div class="flex flex-wrap gap-1">
-                                            <Tag v-for="platform in plan.priorityPlatforms" :key="platform" :value="platform" severity="secondary" class="text-xs" />
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Календарь постов -->
-                <div v-if="strategyData.strategy.postCalendar && strategyData.strategy.postCalendar.length > 0" class="card">
-                    <div class="card-header mb-4">
-                        <div class="flex justify-content-between align-items-center">
-                            <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Календарь постов</h3>
-                            <div class="flex gap-2">
-                                <Button label="Экспорт CSV" icon="pi pi-download" severity="secondary" size="small" @click="exportToCsv" />
-                                <Button label="Группировать по датам" icon="pi pi-calendar" severity="secondary" size="small" @click="toggleGroupByDate" />
-                            </div>
-                        </div>
-                    </div>
-                    <div class="card-content">
-                        <!-- Группировка по датам -->
-                        <div v-if="groupByDate">
-                            <div v-for="(posts, date) in postsByDate" :key="date" class="date-group mb-4 pb-4 border-bottom-1 border-surface-200 dark:border-surface-700">
-                                <h4 class="text-lg font-semibold text-surface-900 dark:text-surface-0 mb-3">
-                                    {{ formatDate(date) }}
-                                </h4>
-                                <div class="posts-container">
-                                    <div v-for="(post, idx) in posts" :key="idx" class="post-item">
-                                        <div class="post-card p-3 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 square-card">
-                                            <div class="flex align-items-center justify-content-between mb-2">
-                                                <div class="flex gap-1 flex-wrap">
-                                                    <Tag :value="post.platform" severity="info" class="text-xs" />
-                                                    <Tag :value="post.contentType" severity="secondary" class="text-xs" />
-                                                    <Tag v-if="post.taskId" :value="`Задача: ${post.taskId.substring(0, 8)}...`" severity="success" class="text-xs" />
-                                                </div>
-                                                <span class="text-xs text-surface-500 dark:text-surface-400">{{ post.publishTime }}</span>
-                                            </div>
-                                            <div class="mb-2">
-                                                <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Тема:</p>
-                                                <p class="text-xs font-semibold text-surface-900 dark:text-surface-0 line-height-2">{{ post.theme }}</p>
-                                            </div>
-                                            <!-- Изображение поста -->
-                                            <div v-if="hasImage(post) && !hasImageError(`${date}-${idx}`)" class="mb-2 post-media" style="position: relative">
-                                                <img :src="getImageUrl(post)" :alt="post.theme" class="post-image-small" loading="lazy" @error="handleImageError(`${date}-${idx}`)" />
-                                                <Button
-                                                    icon="pi pi-refresh"
-                                                    size="small"
-                                                    severity="secondary"
-                                                    class="regenerate-image-btn"
-                                                    :loading="isImageRegenerating(getPostIndex(post))"
-                                                    :disabled="isImageRegenerating(getPostIndex(post))"
-                                                    v-tooltip.top="'Регенерировать изображение'"
-                                                    @click="handleRegenerateImage(post, getPostIndex(post))"
-                                                />
-                                            </div>
-                                            <div v-else-if="hasImage(post) && hasImageError(`${date}-${idx}`)" class="mb-2 no-image-placeholder-small post-media" style="position: relative">
-                                                <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
-                                                <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение недоступно</p>
-                                                <Button
-                                                    icon="pi pi-refresh"
-                                                    size="small"
-                                                    severity="secondary"
-                                                    class="regenerate-image-btn"
-                                                    :loading="isImageRegenerating(getPostIndex(post))"
-                                                    :disabled="isImageRegenerating(getPostIndex(post))"
-                                                    v-tooltip.top="'Регенерировать изображение'"
-                                                    @click="handleRegenerateImage(post, getPostIndex(post))"
-                                                />
-                                            </div>
-                                            <div v-else class="mb-2 no-image-placeholder-small post-media" style="position: relative">
-                                                <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
-                                                <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение не сгенерировано</p>
-                                                <Button
-                                                    icon="pi pi-refresh"
-                                                    size="small"
-                                                    severity="secondary"
-                                                    class="regenerate-image-btn"
-                                                    :loading="isImageRegenerating(getPostIndex(post))"
-                                                    :disabled="isImageRegenerating(getPostIndex(post))"
-                                                    v-tooltip.top="'Регенерировать изображение'"
-                                                    @click="handleRegenerateImage(post, getPostIndex(post))"
-                                                />
-                                            </div>
-                                            <div class="mb-2">
-                                                <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Текст поста:</p>
-                                                <p class="text-xs text-surface-700 dark:text-surface-300 whitespace-pre-line line-height-2">{{ post.postText }}</p>
-                                            </div>
-                                            <div v-if="post.hashtags && post.hashtags.length > 0" class="mb-2">
-                                                <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Хештеги:</p>
-                                                <div class="flex flex-wrap gap-1">
-                                                    <span v-for="(tag, tagIdx) in post.hashtags" :key="tagIdx" class="text-xs px-1 py-0 border-round bg-primary-50 dark:bg-primary-900 text-primary-700 dark:text-primary-300">
-                                                        {{ tag }}
-                                                    </span>
-                                                </div>
-                                            </div>
-                                            <div class="flex gap-1 mt-auto">
-                                                <Button label="Копировать" icon="pi pi-copy" size="small" severity="secondary" class="flex-1 text-xs" @click="handleCopyPost(post)" />
-                                                <Button
-                                                    label="Опубликовать"
-                                                    icon="pi pi-send"
-                                                    size="small"
-                                                    severity="success"
-                                                    class="flex-1 text-xs"
-                                                    :loading="post.taskId ? isTaskExecuting(post.taskId) : false"
-                                                    :disabled="!post.taskId || isTaskExecuting(post.taskId)"
-                                                    @click="handlePublishPost(post)"
-                                                />
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- Список всех постов -->
-                        <div v-else class="posts-container">
-                            <div v-for="(post, idx) in strategyData.strategy.postCalendar" :key="idx" class="post-item">
-                                <div class="post-card p-3 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 square-card">
-                                    <div class="flex align-items-center justify-content-between mb-2">
-                                        <div class="flex gap-1 flex-wrap">
-                                            <Tag :value="post.platform" severity="info" class="text-xs" />
-                                            <Tag :value="post.contentType" severity="secondary" class="text-xs" />
-                                            <Tag v-if="post.taskId" :value="`Задача: ${post.taskId.substring(0, 8)}...`" severity="success" class="text-xs" />
-                                        </div>
-                                        <span class="text-xs text-surface-500 dark:text-surface-400">{{ post.publishTime }}</span>
-                                    </div>
-                                    <div class="mb-2">
-                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Тема:</p>
-                                        <p class="text-xs font-semibold text-surface-900 dark:text-surface-0 line-height-2">{{ post.theme }}</p>
-                                    </div>
-                                    <!-- Изображение поста -->
-                                    <div v-if="hasImage(post) && !hasImageError(idx)" class="mb-2 post-media" style="position: relative">
-                                        <img :src="getImageUrl(post)" :alt="post.theme" class="post-image-small" loading="lazy" @error="handleImageError(idx)" />
-                                        <Button
-                                            icon="pi pi-refresh"
-                                            size="small"
-                                            severity="secondary"
-                                            class="regenerate-image-btn"
-                                            :loading="isImageRegenerating(idx)"
-                                            :disabled="isImageRegenerating(idx)"
-                                            v-tooltip.top="'Регенерировать изображение'"
-                                            @click="handleRegenerateImage(post, idx)"
-                                        />
-                                    </div>
-                                    <div v-else-if="hasImage(post) && hasImageError(idx)" class="mb-2 no-image-placeholder-small post-media" style="position: relative">
-                                        <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
-                                        <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение недоступно</p>
-                                        <Button
-                                            icon="pi pi-refresh"
-                                            size="small"
-                                            severity="secondary"
-                                            class="regenerate-image-btn"
-                                            :loading="isImageRegenerating(idx)"
-                                            :disabled="isImageRegenerating(idx)"
-                                            v-tooltip.top="'Регенерировать изображение'"
-                                            @click="handleRegenerateImage(post, idx)"
-                                        />
-                                    </div>
-                                    <div v-else class="mb-2 no-image-placeholder-small post-media" style="position: relative">
-                                        <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
-                                        <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение не сгенерировано</p>
-                                        <Button
-                                            icon="pi pi-refresh"
-                                            size="small"
-                                            severity="secondary"
-                                            class="regenerate-image-btn"
-                                            :loading="isImageRegenerating(idx)"
-                                            :disabled="isImageRegenerating(idx)"
-                                            v-tooltip.top="'Регенерировать изображение'"
-                                            @click="handleRegenerateImage(post, idx)"
-                                        />
-                                    </div>
-                                    <div class="mb-2">
-                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Текст поста:</p>
-                                        <p class="text-xs text-surface-700 dark:text-surface-300 whitespace-pre-line line-height-2">{{ post.postText }}</p>
-                                    </div>
-                                    <div v-if="post.hashtags && post.hashtags.length > 0" class="mb-2">
-                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Хештеги:</p>
-                                        <div class="flex flex-wrap gap-1">
-                                            <span v-for="(tag, tagIdx) in post.hashtags" :key="tagIdx" class="text-xs px-1 py-0 border-round bg-primary-50 dark:bg-primary-900 text-primary-700 dark:text-primary-300">
-                                                {{ tag }}
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="flex gap-1 mt-auto">
-                                        <Button label="Копировать" icon="pi pi-copy" size="small" severity="secondary" class="flex-1 text-xs" @click="handleCopyPost(post)" />
-                                        <Button
-                                            v-if="post.taskId"
-                                            label="Опубликовать"
-                                            icon="pi pi-send"
-                                            size="small"
-                                            severity="success"
-                                            class="flex-1 text-xs"
-                                            :loading="isTaskExecuting(post.taskId)"
-                                            :disabled="isTaskExecuting(post.taskId)"
-                                            @click="handlePublishPost(post)"
-                                        />
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- Диалог для настройки credentials -->
-        <Dialog v-model:visible="credentialsDialogVisible" :header="'Настройка credentials'" :style="{ width: '600px' }" :modal="true">
-            <div class="credentials-dialog-content">
-                <p class="text-surface-700 dark:text-surface-300 mb-4">Для запуска стратегии необходимо настроить credentials для следующих платформ:</p>
-                <div class="mb-4">
-                    <Tag v-for="platform in missingPlatforms" :key="platform" :value="platform" severity="warning" class="mr-2 mb-2" />
-                </div>
-                <p class="text-surface-600 dark:text-surface-400 text-sm">Перейдите на страницу управления credentials для настройки необходимых платформ.</p>
-            </div>
-            <template #footer>
-                <Button label="Отмена" icon="pi pi-times" @click="credentialsDialogVisible = false" severity="secondary" />
-                <Button label="Настроить credentials" icon="pi pi-cog" @click="goToCredentials" severity="info" />
-            </template>
-        </Dialog>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import MarketingService from '@/service/MarketingService';
 import Button from 'primevue/button';
 import Dialog from 'primevue/dialog';
@@ -1024,6 +681,350 @@ onBeforeUnmount(() => {
 });
 </script>
 
+<template>
+    <div class="marketing-promotion-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
+        <Toast />
+        <div class="w-full mx-auto px-4">
+            <!-- Форма запуска генерации стратегии -->
+            <div v-if="!strategyId && !strategyData" class="card">
+                <div class="card-header mb-4">
+                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Генерация стратегии продвижения</h2>
+                    <p class="text-sm text-surface-500 dark:text-surface-400 mt-2">Создайте детальную стратегию продвижения на основе завершенного маркетингового анализа</p>
+                </div>
+                <div class="card-content">
+                    <form @submit.prevent="handleGenerateStrategy" class="space-y-4 max-w-2xl">
+                        <div class="field">
+                            <label for="analysisId" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> ID анализа <span class="text-red-500">*</span> </label>
+                            <InputText id="analysisId" v-model="formData.analysisId" placeholder="Введите ID завершенного анализа" class="w-full" :class="{ 'p-invalid': errors.analysisId }" />
+                            <small v-if="errors.analysisId" class="p-error">{{ errors.analysisId }}</small>
+                            <small class="text-surface-500 dark:text-surface-400"> ID можно получить из завершенного маркетингового анализа </small>
+                        </div>
+
+                        <div class="field">
+                            <label for="durationWeeks" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Длительность стратегии (недели) </label>
+                            <InputNumber id="durationWeeks" v-model="formData.durationWeeks" :min="1" :max="12" placeholder="4" class="w-full" :class="{ 'p-invalid': errors.durationWeeks }" />
+                            <small v-if="errors.durationWeeks" class="p-error">{{ errors.durationWeeks }}</small>
+                            <small class="text-surface-500 dark:text-surface-400">От 1 до 12 недель (по умолчанию: 4)</small>
+                        </div>
+
+                        <div class="field">
+                            <label for="priorityPlatforms" class="block text-sm font-medium mb-2 text-surface-700 dark:text-surface-300"> Приоритетные платформы </label>
+                            <MultiSelect id="priorityPlatforms" v-model="formData.priorityPlatforms" :options="platformOptions" placeholder="Выберите платформы (необязательно)" class="w-full" display="chip" />
+                            <small class="text-surface-500 dark:text-surface-400"> Если не указано, будут использованы все популярные платформы </small>
+                        </div>
+
+                        <Button type="submit" label="Сгенерировать стратегию" icon="pi pi-magic" class="w-full p-button-primary" :loading="generating" />
+
+                        <p class="text-sm text-surface-500 dark:text-surface-400 mt-3 text-center">Генерация стратегии занимает примерно 3-5 минут</p>
+                    </form>
+                </div>
+            </div>
+
+            <!-- Статус обработки -->
+            <div v-else-if="status === 'processing' || status === 'queued'" class="card">
+                <div class="card-header mb-4">
+                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Генерация стратегии</h2>
+                </div>
+                <div class="card-content">
+                    <div class="text-center py-6">
+                        <ProgressSpinner size="50" />
+                        <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Стратегия генерируется...</p>
+                        <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Это может занять 3-5 минут. Пожалуйста, подождите.</p>
+                        <Button label="Отменить ожидание" icon="pi pi-times" severity="secondary" class="mt-4" @click="resetStrategy" />
+                    </div>
+                </div>
+            </div>
+
+            <!-- Ошибка -->
+            <div v-else-if="status === 'failed'" class="card">
+                <div class="card-header mb-4">
+                    <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Ошибка генерации</h2>
+                </div>
+                <div class="card-content">
+                    <div class="text-center py-6">
+                        <i class="pi pi-exclamation-triangle text-6xl text-red-500 mb-3"></i>
+                        <p class="mt-4 text-lg text-surface-700 dark:text-surface-300">Генерация стратегии завершилась с ошибкой</p>
+                        <p class="mt-2 text-sm text-surface-500 dark:text-surface-400">Попробуйте запустить генерацию снова или обратитесь в поддержку.</p>
+                        <Button label="Попробовать снова" icon="pi pi-refresh" class="mt-4" @click="resetStrategy" />
+                    </div>
+                </div>
+            </div>
+
+            <!-- Результаты стратегии -->
+            <div v-else-if="status === 'completed' && strategyData?.strategy" class="space-y-4">
+                <!-- Заголовок -->
+                <div class="card">
+                    <div class="card-header mb-4">
+                        <div class="flex justify-content-between align-items-center">
+                            <div>
+                                <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Стратегия продвижения</h2>
+                                <p class="text-sm text-surface-500 dark:text-surface-400 mt-1">Длительность: {{ strategyData.durationWeeks }} {{ pluralize(strategyData.durationWeeks, 'неделя', 'недели', 'недель') }}</p>
+                            </div>
+                            <div class="flex gap-2">
+                                <Button label="Запустить стратегию" icon="pi pi-play" severity="success" @click="handleStartStrategy" :loading="startingStrategy" :disabled="startingStrategy" />
+                                <Button label="Создать новую стратегию" icon="pi pi-plus" severity="secondary" @click="resetStrategy" />
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Недельный план -->
+                <div v-if="strategyData.strategy.weeklyPlans && strategyData.strategy.weeklyPlans.length > 0" class="card">
+                    <div class="card-header mb-4">
+                        <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Недельный план</h3>
+                    </div>
+                    <div class="card-content">
+                        <div class="weekly-plans-container">
+                            <div v-for="plan in strategyData.strategy.weeklyPlans" :key="plan.weekNumber" class="weekly-plan-item">
+                                <div class="week-plan-card p-3 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 square-card">
+                                    <div class="flex align-items-center justify-content-between mb-2">
+                                        <Tag :value="`Неделя ${plan.weekNumber}`" severity="info" />
+                                    </div>
+
+                                    <div v-if="plan.mainThemes && plan.mainThemes.length > 0" class="mb-2">
+                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Основные темы:</p>
+                                        <ul class="list-none p-0 m-0">
+                                            <li v-for="(theme, idx) in plan.mainThemes" :key="idx" class="flex align-items-start mb-1">
+                                                <i class="pi pi-circle-fill text-primary-500 text-xs mr-1 mt-1"></i>
+                                                <span class="text-surface-700 dark:text-surface-300 text-xs line-height-2">{{ theme }}</span>
+                                            </li>
+                                        </ul>
+                                    </div>
+
+                                    <div v-if="plan.contentRecommendations" class="mb-2">
+                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Рекомендации:</p>
+                                        <p class="text-surface-700 dark:text-surface-300 text-xs whitespace-pre-line line-height-2">
+                                            {{ plan.contentRecommendations }}
+                                        </p>
+                                    </div>
+
+                                    <div v-if="plan.priorityPlatforms && plan.priorityPlatforms.length > 0">
+                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Платформы:</p>
+                                        <div class="flex flex-wrap gap-1">
+                                            <Tag v-for="platform in plan.priorityPlatforms" :key="platform" :value="platform" severity="secondary" class="text-xs" />
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Календарь постов -->
+                <div v-if="strategyData.strategy.postCalendar && strategyData.strategy.postCalendar.length > 0" class="card">
+                    <div class="card-header mb-4">
+                        <div class="flex justify-content-between align-items-center">
+                            <h3 class="text-xl font-semibold text-surface-900 dark:text-surface-0">Календарь постов</h3>
+                            <div class="flex gap-2">
+                                <Button label="Экспорт CSV" icon="pi pi-download" severity="secondary" size="small" @click="exportToCsv" />
+                                <Button label="Группировать по датам" icon="pi pi-calendar" severity="secondary" size="small" @click="toggleGroupByDate" />
+                            </div>
+                        </div>
+                    </div>
+                    <div class="card-content">
+                        <!-- Группировка по датам -->
+                        <div v-if="groupByDate">
+                            <div v-for="(posts, date) in postsByDate" :key="date" class="date-group mb-4 pb-4 border-bottom-1 border-surface-200 dark:border-surface-700">
+                                <h4 class="text-lg font-semibold text-surface-900 dark:text-surface-0 mb-3">
+                                    {{ formatDate(date) }}
+                                </h4>
+                                <div class="posts-container">
+                                    <div v-for="(post, idx) in posts" :key="idx" class="post-item">
+                                        <div class="post-card p-3 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 square-card">
+                                            <div class="flex align-items-center justify-content-between mb-2">
+                                                <div class="flex gap-1 flex-wrap">
+                                                    <Tag :value="post.platform" severity="info" class="text-xs" />
+                                                    <Tag :value="post.contentType" severity="secondary" class="text-xs" />
+                                                    <Tag v-if="post.taskId" :value="`Задача: ${post.taskId.substring(0, 8)}...`" severity="success" class="text-xs" />
+                                                </div>
+                                                <span class="text-xs text-surface-500 dark:text-surface-400">{{ post.publishTime }}</span>
+                                            </div>
+                                            <div class="mb-2">
+                                                <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Тема:</p>
+                                                <p class="text-xs font-semibold text-surface-900 dark:text-surface-0 line-height-2">{{ post.theme }}</p>
+                                            </div>
+                                            <!-- Изображение поста -->
+                                            <div v-if="hasImage(post) && !hasImageError(`${date}-${idx}`)" class="mb-2 post-media" style="position: relative">
+                                                <img :src="getImageUrl(post)" :alt="post.theme" class="post-image-small" loading="lazy" @error="handleImageError(`${date}-${idx}`)" />
+                                                <Button
+                                                    icon="pi pi-refresh"
+                                                    size="small"
+                                                    severity="secondary"
+                                                    class="regenerate-image-btn"
+                                                    :loading="isImageRegenerating(getPostIndex(post))"
+                                                    :disabled="isImageRegenerating(getPostIndex(post))"
+                                                    v-tooltip.top="'Регенерировать изображение'"
+                                                    @click="handleRegenerateImage(post, getPostIndex(post))"
+                                                />
+                                            </div>
+                                            <div v-else-if="hasImage(post) && hasImageError(`${date}-${idx}`)" class="mb-2 no-image-placeholder-small post-media" style="position: relative">
+                                                <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
+                                                <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение недоступно</p>
+                                                <Button
+                                                    icon="pi pi-refresh"
+                                                    size="small"
+                                                    severity="secondary"
+                                                    class="regenerate-image-btn"
+                                                    :loading="isImageRegenerating(getPostIndex(post))"
+                                                    :disabled="isImageRegenerating(getPostIndex(post))"
+                                                    v-tooltip.top="'Регенерировать изображение'"
+                                                    @click="handleRegenerateImage(post, getPostIndex(post))"
+                                                />
+                                            </div>
+                                            <div v-else class="mb-2 no-image-placeholder-small post-media" style="position: relative">
+                                                <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
+                                                <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение не сгенерировано</p>
+                                                <Button
+                                                    icon="pi pi-refresh"
+                                                    size="small"
+                                                    severity="secondary"
+                                                    class="regenerate-image-btn"
+                                                    :loading="isImageRegenerating(getPostIndex(post))"
+                                                    :disabled="isImageRegenerating(getPostIndex(post))"
+                                                    v-tooltip.top="'Регенерировать изображение'"
+                                                    @click="handleRegenerateImage(post, getPostIndex(post))"
+                                                />
+                                            </div>
+                                            <div class="mb-2">
+                                                <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Текст поста:</p>
+                                                <p class="text-xs text-surface-700 dark:text-surface-300 whitespace-pre-line line-height-2">{{ post.postText }}</p>
+                                            </div>
+                                            <div v-if="post.hashtags && post.hashtags.length > 0" class="mb-2">
+                                                <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Хештеги:</p>
+                                                <div class="flex flex-wrap gap-1">
+                                                    <span v-for="(tag, tagIdx) in post.hashtags" :key="tagIdx" class="text-xs px-1 py-0 border-round bg-primary-50 dark:bg-primary-900 text-primary-700 dark:text-primary-300">
+                                                        {{ tag }}
+                                                    </span>
+                                                </div>
+                                            </div>
+                                            <div class="flex gap-1 mt-auto">
+                                                <Button label="Копировать" icon="pi pi-copy" size="small" severity="secondary" class="flex-1 text-xs" @click="handleCopyPost(post)" />
+                                                <Button
+                                                    label="Опубликовать"
+                                                    icon="pi pi-send"
+                                                    size="small"
+                                                    severity="success"
+                                                    class="flex-1 text-xs"
+                                                    :loading="post.taskId ? isTaskExecuting(post.taskId) : false"
+                                                    :disabled="!post.taskId || isTaskExecuting(post.taskId)"
+                                                    @click="handlePublishPost(post)"
+                                                />
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Список всех постов -->
+                        <div v-else class="posts-container">
+                            <div v-for="(post, idx) in strategyData.strategy.postCalendar" :key="idx" class="post-item">
+                                <div class="post-card p-3 border-round bg-surface-0 dark:bg-surface-800 border-1 border-surface-200 dark:border-surface-700 square-card">
+                                    <div class="flex align-items-center justify-content-between mb-2">
+                                        <div class="flex gap-1 flex-wrap">
+                                            <Tag :value="post.platform" severity="info" class="text-xs" />
+                                            <Tag :value="post.contentType" severity="secondary" class="text-xs" />
+                                            <Tag v-if="post.taskId" :value="`Задача: ${post.taskId.substring(0, 8)}...`" severity="success" class="text-xs" />
+                                        </div>
+                                        <span class="text-xs text-surface-500 dark:text-surface-400">{{ post.publishTime }}</span>
+                                    </div>
+                                    <div class="mb-2">
+                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Тема:</p>
+                                        <p class="text-xs font-semibold text-surface-900 dark:text-surface-0 line-height-2">{{ post.theme }}</p>
+                                    </div>
+                                    <!-- Изображение поста -->
+                                    <div v-if="hasImage(post) && !hasImageError(idx)" class="mb-2 post-media" style="position: relative">
+                                        <img :src="getImageUrl(post)" :alt="post.theme" class="post-image-small" loading="lazy" @error="handleImageError(idx)" />
+                                        <Button
+                                            icon="pi pi-refresh"
+                                            size="small"
+                                            severity="secondary"
+                                            class="regenerate-image-btn"
+                                            :loading="isImageRegenerating(idx)"
+                                            :disabled="isImageRegenerating(idx)"
+                                            v-tooltip.top="'Регенерировать изображение'"
+                                            @click="handleRegenerateImage(post, idx)"
+                                        />
+                                    </div>
+                                    <div v-else-if="hasImage(post) && hasImageError(idx)" class="mb-2 no-image-placeholder-small post-media" style="position: relative">
+                                        <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
+                                        <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение недоступно</p>
+                                        <Button
+                                            icon="pi pi-refresh"
+                                            size="small"
+                                            severity="secondary"
+                                            class="regenerate-image-btn"
+                                            :loading="isImageRegenerating(idx)"
+                                            :disabled="isImageRegenerating(idx)"
+                                            v-tooltip.top="'Регенерировать изображение'"
+                                            @click="handleRegenerateImage(post, idx)"
+                                        />
+                                    </div>
+                                    <div v-else class="mb-2 no-image-placeholder-small post-media" style="position: relative">
+                                        <i class="pi pi-image text-2xl text-surface-400 dark:text-surface-600"></i>
+                                        <p class="text-xs text-surface-500 dark:text-surface-400 mt-1">Изображение не сгенерировано</p>
+                                        <Button
+                                            icon="pi pi-refresh"
+                                            size="small"
+                                            severity="secondary"
+                                            class="regenerate-image-btn"
+                                            :loading="isImageRegenerating(idx)"
+                                            :disabled="isImageRegenerating(idx)"
+                                            v-tooltip.top="'Регенерировать изображение'"
+                                            @click="handleRegenerateImage(post, idx)"
+                                        />
+                                    </div>
+                                    <div class="mb-2">
+                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Текст поста:</p>
+                                        <p class="text-xs text-surface-700 dark:text-surface-300 whitespace-pre-line line-height-2">{{ post.postText }}</p>
+                                    </div>
+                                    <div v-if="post.hashtags && post.hashtags.length > 0" class="mb-2">
+                                        <p class="text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Хештеги:</p>
+                                        <div class="flex flex-wrap gap-1">
+                                            <span v-for="(tag, tagIdx) in post.hashtags" :key="tagIdx" class="text-xs px-1 py-0 border-round bg-primary-50 dark:bg-primary-900 text-primary-700 dark:text-primary-300">
+                                                {{ tag }}
+                                            </span>
+                                        </div>
+                                    </div>
+                                    <div class="flex gap-1 mt-auto">
+                                        <Button label="Копировать" icon="pi pi-copy" size="small" severity="secondary" class="flex-1 text-xs" @click="handleCopyPost(post)" />
+                                        <Button
+                                            v-if="post.taskId"
+                                            label="Опубликовать"
+                                            icon="pi pi-send"
+                                            size="small"
+                                            severity="success"
+                                            class="flex-1 text-xs"
+                                            :loading="isTaskExecuting(post.taskId)"
+                                            :disabled="isTaskExecuting(post.taskId)"
+                                            @click="handlePublishPost(post)"
+                                        />
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Диалог для настройки credentials -->
+        <Dialog v-model:visible="credentialsDialogVisible" :header="'Настройка credentials'" :style="{ width: '600px' }" :modal="true">
+            <div class="credentials-dialog-content">
+                <p class="text-surface-700 dark:text-surface-300 mb-4">Для запуска стратегии необходимо настроить credentials для следующих платформ:</p>
+                <div class="mb-4">
+                    <Tag v-for="platform in missingPlatforms" :key="platform" :value="platform" severity="warning" class="mr-2 mb-2" />
+                </div>
+                <p class="text-surface-600 dark:text-surface-400 text-sm">Перейдите на страницу управления credentials для настройки необходимых платформ.</p>
+            </div>
+            <template #footer>
+                <Button label="Отмена" icon="pi pi-times" @click="credentialsDialogVisible = false" severity="secondary" />
+                <Button label="Настроить credentials" icon="pi pi-cog" @click="goToCredentials" severity="info" />
+            </template>
+        </Dialog>
+    </div>
+</template>
+
 <style scoped>
 .marketing-promotion-page {
     font-family: var(--font-family);
diff --git a/src/views/pages/marketing/MarketingResults.vue b/src/views/pages/marketing/MarketingResults.vue
index 4064980..a2dfd3a 100644
--- a/src/views/pages/marketing/MarketingResults.vue
+++ b/src/views/pages/marketing/MarketingResults.vue
@@ -1,3 +1,47 @@
+<script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
+import Chart from 'primevue/chart';
+import { ref } from 'vue';
+
+// Chart data
+const chartData = ref({
+    labels: ['Неделя 1', 'Неделя 2', 'Неделя 3', 'Неделя 4', 'Неделя 5', 'Неделя 6'],
+    datasets: [
+        {
+            label: 'Охват',
+            data: [5000, 8000, 10000, 12000, 13000, 15000],
+            borderColor: '#3B82F6',
+            backgroundColor: 'rgba(59, 130, 246, 0.1)',
+            tension: 0.4,
+            fill: true
+        }
+    ]
+});
+
+const chartOptions = {
+    responsive: true,
+    maintainAspectRatio: false,
+    plugins: {
+        legend: {
+            display: false
+        }
+    },
+    scales: {
+        y: {
+            beginAtZero: true,
+            grid: {
+                color: 'rgba(0, 0, 0, 0.05)'
+            }
+        },
+        x: {
+            grid: {
+                display: false
+            }
+        }
+    }
+};
+</script>
+
 <template>
     <div class="marketing-results-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
         <div class="max-w-[1200px] mx-auto">
@@ -63,49 +107,6 @@
     </div>
 </template>
 
-<script setup>
-import Chart from 'primevue/chart';
-import { ref } from 'vue';
-
-// Chart data
-const chartData = ref({
-    labels: ['Неделя 1', 'Неделя 2', 'Неделя 3', 'Неделя 4', 'Неделя 5', 'Неделя 6'],
-    datasets: [
-        {
-            label: 'Охват',
-            data: [5000, 8000, 10000, 12000, 13000, 15000],
-            borderColor: '#3B82F6',
-            backgroundColor: 'rgba(59, 130, 246, 0.1)',
-            tension: 0.4,
-            fill: true
-        }
-    ]
-});
-
-const chartOptions = {
-    responsive: true,
-    maintainAspectRatio: false,
-    plugins: {
-        legend: {
-            display: false
-        }
-    },
-    scales: {
-        y: {
-            beginAtZero: true,
-            grid: {
-                color: 'rgba(0, 0, 0, 0.05)'
-            }
-        },
-        x: {
-            grid: {
-                display: false
-            }
-        }
-    }
-};
-</script>
-
 <style scoped>
 .marketing-results-page {
     font-family: var(--font-family);
diff --git a/src/views/pages/marketing/MarketingStrategiesList.vue b/src/views/pages/marketing/MarketingStrategiesList.vue
index f2cdf54..99be5cd 100644
--- a/src/views/pages/marketing/MarketingStrategiesList.vue
+++ b/src/views/pages/marketing/MarketingStrategiesList.vue
@@ -1,150 +1,5 @@
-<template>
-    <div class="marketing-strategies-list-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
-        <Toast />
-        <div class="max-w-[1400px] mx-auto">
-            <div class="card">
-                <div class="card-header mb-4">
-                    <div class="flex justify-content-between align-items-center">
-                        <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Мои стратегии</h2>
-                        <Button label="Создать новую стратегию" icon="pi pi-plus" severity="success" @click="goToCreateStrategy" />
-                    </div>
-                </div>
-                <div class="card-content">
-                    <DataTable
-                        :value="strategies"
-                        :loading="loading"
-                        paginator
-                        :rows="10"
-                        :rowsPerPageOptions="[5, 10, 20, 50]"
-                        sortMode="multiple"
-                        removableSort
-                        v-model:multiSortMeta="multiSortMeta"
-                        filterDisplay="row"
-                        :globalFilterFields="['analysisId', 'status']"
-                        v-model:filters="filters"
-                        :filters="filters"
-                        dataKey="strategyId"
-                    >
-                        <template #header>
-                            <div class="flex justify-content-between align-items-center flex-wrap gap-2">
-                                <span class="p-input-icon-left">
-                                    <i class="pi pi-search" />
-                                    <InputText v-model="filters['global'].value" placeholder="Поиск стратегий..." />
-                                </span>
-                                <Button label="Обновить" icon="pi pi-refresh" severity="secondary" @click="loadStrategies" :loading="loading" />
-                            </div>
-                        </template>
-
-                        <Column field="analysisId" header="ID анализа" :sortable="true" style="min-width: 200px" :showFilterMenu="false">
-                            <template #body="slotProps">
-                                <span class="font-mono text-sm">{{ slotProps.data.analysisId }}</span>
-                            </template>
-                            <template #filter>
-                                <span></span>
-                            </template>
-                        </Column>
-
-                        <Column field="status" header="Статус" :sortable="true" style="min-width: 120px" :showFilterMenu="false">
-                            <template #body="slotProps">
-                                <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
-                            </template>
-                            <template #filter="{ filterModel, filterCallback }">
-                                <Dropdown v-if="filterModel" v-model="filterModel.value" :options="statusOptions" optionLabel="label" optionValue="value" placeholder="Все статусы" class="p-column-filter" @change="filterCallback()">
-                                    <template #option="slotProps">
-                                        <Tag :value="slotProps.option.label" :severity="slotProps.option.severity" />
-                                    </template>
-                                </Dropdown>
-                            </template>
-                        </Column>
-
-                        <Column field="durationWeeks" header="Длительность" :sortable="true" style="min-width: 120px" :showFilterMenu="false">
-                            <template #body="slotProps">
-                                <span>{{ slotProps.data.durationWeeks }} {{ pluralize(slotProps.data.durationWeeks, 'неделя', 'недели', 'недель') }}</span>
-                            </template>
-                            <template #filter>
-                                <span></span>
-                            </template>
-                        </Column>
-
-                        <Column field="priorityPlatforms" header="Платформы" style="min-width: 200px" :showFilterMenu="false">
-                            <template #body="slotProps">
-                                <div v-if="slotProps.data.priorityPlatforms && slotProps.data.priorityPlatforms.length > 0" class="flex flex-wrap gap-1">
-                                    <Tag v-for="platform in slotProps.data.priorityPlatforms" :key="platform" :value="platform" severity="secondary" />
-                                </div>
-                                <span v-else class="text-surface-400">—</span>
-                            </template>
-                            <template #filter>
-                                <span></span>
-                            </template>
-                        </Column>
-
-                        <Column field="createdAt" header="Создана" :sortable="true" style="min-width: 180px" :showFilterMenu="false">
-                            <template #body="slotProps">
-                                <span>{{ formatDateTime(slotProps.data.createdAt) }}</span>
-                            </template>
-                            <template #filter>
-                                <span></span>
-                            </template>
-                        </Column>
-
-                        <Column field="completedAt" header="Завершена" :sortable="true" style="min-width: 180px" :showFilterMenu="false">
-                            <template #body="slotProps">
-                                <span v-if="slotProps.data.completedAt">{{ formatDateTime(slotProps.data.completedAt) }}</span>
-                                <span v-else class="text-surface-400">—</span>
-                            </template>
-                            <template #filter>
-                                <span></span>
-                            </template>
-                        </Column>
-
-                        <Column header="Действия" style="min-width: 200px" :showFilterMenu="false" :exportable="false">
-                            <template #body="slotProps">
-                                <div class="flex gap-2 flex-wrap">
-                                    <Button icon="pi pi-eye" severity="info" size="small" v-tooltip.top="'Просмотр деталей'" @click="viewStrategy(slotProps.data.strategyId)" :disabled="slotProps.data.status !== 'completed'" />
-                                    <Button icon="pi pi-history" severity="secondary" size="small" v-tooltip.top="'История статусов'" @click="viewHistory(slotProps.data.strategyId)" />
-                                </div>
-                            </template>
-                            <template #filter>
-                                <span></span>
-                            </template>
-                        </Column>
-                    </DataTable>
-                </div>
-            </div>
-        </div>
-
-        <!-- Диалог истории статусов -->
-        <Dialog v-model:visible="historyDialogVisible" :header="'История статусов стратегии'" :style="{ width: '600px' }" :modal="true">
-            <div v-if="historyLoading" class="text-center py-4">
-                <ProgressSpinner />
-            </div>
-            <div v-else-if="statusHistory && statusHistory.length > 0" class="status-history">
-                <Timeline :value="statusHistory" align="left" class="w-full">
-                    <template #marker="slotProps">
-                        <span class="flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1" :class="getStatusColorClass(slotProps.item.status)">
-                            <i :class="getStatusIcon(slotProps.item.status)"></i>
-                        </span>
-                    </template>
-                    <template #content="slotProps">
-                        <div class="flex flex-column">
-                            <div class="flex align-items-center gap-2 mb-2">
-                                <Tag :value="getStatusLabel(slotProps.item.status)" :severity="getStatusSeverity(slotProps.item.status)" />
-                                <span class="text-sm text-surface-500 dark:text-surface-400">{{ formatDateTime(slotProps.item.timestamp) }}</span>
-                            </div>
-                            <p class="text-sm text-surface-700 dark:text-surface-300 m-0">{{ slotProps.item.message }}</p>
-                        </div>
-                    </template>
-                </Timeline>
-            </div>
-            <div v-else class="text-center py-4 text-surface-500">История статусов недоступна</div>
-            <template #footer>
-                <Button label="Закрыть" icon="pi pi-times" @click="historyDialogVisible = false" severity="secondary" />
-            </template>
-        </Dialog>
-    </div>
-</template>
-
 <script setup>
+/** @deprecated Внимание: старая версия (V1/V2). Используйте V3. */
 import MarketingService from '@/service/MarketingService';
 import { FilterMatchMode } from '@primevue/core/api';
 import Button from 'primevue/button';
@@ -319,6 +174,152 @@ onMounted(() => {
 });
 </script>
 
+<template>
+    <div class="marketing-strategies-list-page bg-surface-50 dark:bg-surface-900 min-h-screen p-6">
+        <Toast />
+        <div class="max-w-[1400px] mx-auto">
+            <div class="card">
+                <div class="card-header mb-4">
+                    <div class="flex justify-content-between align-items-center">
+                        <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-0">Мои стратегии</h2>
+                        <Button label="Создать новую стратегию" icon="pi pi-plus" severity="success" @click="goToCreateStrategy" />
+                    </div>
+                </div>
+                <div class="card-content">
+                    <DataTable
+                        :value="strategies"
+                        :loading="loading"
+                        paginator
+                        :rows="10"
+                        :rowsPerPageOptions="[5, 10, 20, 50]"
+                        sortMode="multiple"
+                        removableSort
+                        v-model:multiSortMeta="multiSortMeta"
+                        filterDisplay="row"
+                        :globalFilterFields="['analysisId', 'status']"
+                        v-model:filters="filters"
+                        :filters="filters"
+                        dataKey="strategyId"
+                    >
+                        <template #header>
+                            <div class="flex justify-content-between align-items-center flex-wrap gap-2">
+                                <span class="p-input-icon-left">
+                                    <i class="pi pi-search" />
+                                    <InputText v-model="filters['global'].value" placeholder="Поиск стратегий..." />
+                                </span>
+                                <Button label="Обновить" icon="pi pi-refresh" severity="secondary" @click="loadStrategies" :loading="loading" />
+                            </div>
+                        </template>
+
+                        <Column field="analysisId" header="ID анализа" :sortable="true" style="min-width: 200px" :showFilterMenu="false">
+                            <template #body="slotProps">
+                                <span class="font-mono text-sm">{{ slotProps.data.analysisId }}</span>
+                            </template>
+                            <template #filter>
+                                <span></span>
+                            </template>
+                        </Column>
+
+                        <Column field="status" header="Статус" :sortable="true" style="min-width: 120px" :showFilterMenu="false">
+                            <template #body="slotProps">
+                                <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
+                            </template>
+                            <template #filter="{ filterModel, filterCallback }">
+                                <Dropdown v-if="filterModel" v-model="filterModel.value" :options="statusOptions" optionLabel="label" optionValue="value" placeholder="Все статусы" class="p-column-filter" @change="filterCallback()">
+                                    <template #option="slotProps">
+                                        <Tag :value="slotProps.option.label" :severity="slotProps.option.severity" />
+                                    </template>
+                                </Dropdown>
+                            </template>
+                        </Column>
+
+                        <Column field="durationWeeks" header="Длительность" :sortable="true" style="min-width: 120px" :showFilterMenu="false">
+                            <template #body="slotProps">
+                                <span>{{ slotProps.data.durationWeeks }} {{ pluralize(slotProps.data.durationWeeks, 'неделя', 'недели', 'недель') }}</span>
+                            </template>
+                            <template #filter>
+                                <span></span>
+                            </template>
+                        </Column>
+
+                        <Column field="priorityPlatforms" header="Платформы" style="min-width: 200px" :showFilterMenu="false">
+                            <template #body="slotProps">
+                                <div v-if="slotProps.data.priorityPlatforms && slotProps.data.priorityPlatforms.length > 0" class="flex flex-wrap gap-1">
+                                    <Tag v-for="platform in slotProps.data.priorityPlatforms" :key="platform" :value="platform" severity="secondary" />
+                                </div>
+                                <span v-else class="text-surface-400">—</span>
+                            </template>
+                            <template #filter>
+                                <span></span>
+                            </template>
+                        </Column>
+
+                        <Column field="createdAt" header="Создана" :sortable="true" style="min-width: 180px" :showFilterMenu="false">
+                            <template #body="slotProps">
+                                <span>{{ formatDateTime(slotProps.data.createdAt) }}</span>
+                            </template>
+                            <template #filter>
+                                <span></span>
+                            </template>
+                        </Column>
+
+                        <Column field="completedAt" header="Завершена" :sortable="true" style="min-width: 180px" :showFilterMenu="false">
+                            <template #body="slotProps">
+                                <span v-if="slotProps.data.completedAt">{{ formatDateTime(slotProps.data.completedAt) }}</span>
+                                <span v-else class="text-surface-400">—</span>
+                            </template>
+                            <template #filter>
+                                <span></span>
+                            </template>
+                        </Column>
+
+                        <Column header="Действия" style="min-width: 200px" :showFilterMenu="false" :exportable="false">
+                            <template #body="slotProps">
+                                <div class="flex gap-2 flex-wrap">
+                                    <Button icon="pi pi-eye" severity="info" size="small" v-tooltip.top="'Просмотр деталей'" @click="viewStrategy(slotProps.data.strategyId)" :disabled="slotProps.data.status !== 'completed'" />
+                                    <Button icon="pi pi-history" severity="secondary" size="small" v-tooltip.top="'История статусов'" @click="viewHistory(slotProps.data.strategyId)" />
+                                </div>
+                            </template>
+                            <template #filter>
+                                <span></span>
+                            </template>
+                        </Column>
+                    </DataTable>
+                </div>
+            </div>
+        </div>
+
+        <!-- Диалог истории статусов -->
+        <Dialog v-model:visible="historyDialogVisible" :header="'История статусов стратегии'" :style="{ width: '600px' }" :modal="true">
+            <div v-if="historyLoading" class="text-center py-4">
+                <ProgressSpinner />
+            </div>
+            <div v-else-if="statusHistory && statusHistory.length > 0" class="status-history">
+                <Timeline :value="statusHistory" align="left" class="w-full">
+                    <template #marker="slotProps">
+                        <span class="flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1" :class="getStatusColorClass(slotProps.item.status)">
+                            <i :class="getStatusIcon(slotProps.item.status)"></i>
+                        </span>
+                    </template>
+                    <template #content="slotProps">
+                        <div class="flex flex-column">
+                            <div class="flex align-items-center gap-2 mb-2">
+                                <Tag :value="getStatusLabel(slotProps.item.status)" :severity="getStatusSeverity(slotProps.item.status)" />
+                                <span class="text-sm text-surface-500 dark:text-surface-400">{{ formatDateTime(slotProps.item.timestamp) }}</span>
+                            </div>
+                            <p class="text-sm text-surface-700 dark:text-surface-300 m-0">{{ slotProps.item.message }}</p>
+                        </div>
+                    </template>
+                </Timeline>
+            </div>
+            <div v-else class="text-center py-4 text-surface-500">История статусов недоступна</div>
+            <template #footer>
+                <Button label="Закрыть" icon="pi pi-times" @click="historyDialogVisible = false" severity="secondary" />
+            </template>
+        </Dialog>
+    </div>
+</template>
+
 <style scoped>
 .marketing-strategies-list-page {
     font-family: var(--font-family);
diff --git a/src/views/pages/marketing/MarketingStrategyV3.vue b/src/views/pages/marketing/MarketingStrategyV3.vue
new file mode 100644
index 0000000..c69ac1e
--- /dev/null
+++ b/src/views/pages/marketing/MarketingStrategyV3.vue
@@ -0,0 +1,680 @@
+<script setup>
+import { API_CONFIG } from '@/config/api';
+import MarketingV3Service from '@/service/MarketingV3Service';
+import Button from 'primevue/button';
+import Dialog from 'primevue/dialog';
+import Divider from 'primevue/divider';
+import Slider from 'primevue/slider';
+import Tag from 'primevue/tag';
+import { useToast } from 'primevue/usetoast';
+import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+const route = useRoute();
+const router = useRouter();
+const toast = useToast();
+
+const analysisId = computed(() => route.query.analysisId || '');
+const strategyId = ref(null);
+
+// Statuses: PREVIEW, QUEUED, PROCESSING, FAILED, COMPLETED
+const status = ref('PREVIEW');
+
+// Preview Phase Data
+const previewLoading = ref(true);
+const previewData = ref(null);
+
+// Form Data
+const formData = ref({
+    durationWeeks: 4,
+    priorityPlatforms: ['Instagram']
+});
+
+const platformOptions = [
+    { label: 'Instagram', value: 'Instagram' },
+    { label: 'TikTok', value: 'TikTok' },
+    { label: 'YouTube Shorts', value: 'YouTube' },
+    { label: 'LinkedIn', value: 'LinkedIn' },
+    { label: 'VK', value: 'VK' },
+    { label: 'Telegram', value: 'Telegram' }
+];
+
+// Logo Upload Logic
+const fileInput = ref(null);
+const logoFile = ref(null);
+const logoPreviewUrl = ref(null);
+const isDragging = ref(false);
+
+const triggerFileInput = () => fileInput.value?.click();
+
+const handleFileSelect = (event) => {
+    const file = event.target.files[0];
+    if (file) processLogo(file);
+};
+
+const handleDrop = (event) => {
+    isDragging.value = false;
+    const file = event.dataTransfer.files[0];
+    if (file) processLogo(file);
+};
+
+const processLogo = (file) => {
+    if (!['image/png', 'image/jpeg', 'image/jpg'].includes(file.type)) {
+        toast.add({ severity: 'error', summary: 'Формат', detail: 'Доступны только PNG и JPG', life: 3000 });
+        return;
+    }
+    if (file.size > 5 * 1024 * 1024) {
+        toast.add({ severity: 'error', summary: 'Размер', detail: 'Файл слишком тяжелый (макс 5МБ)', life: 3000 });
+        return;
+    }
+    logoFile.value = file;
+    logoPreviewUrl.value = URL.createObjectURL(file);
+};
+
+const removeLogo = () => {
+    if (logoPreviewUrl.value) URL.revokeObjectURL(logoPreviewUrl.value);
+    logoFile.value = null;
+    logoPreviewUrl.value = null;
+    if (fileInput.value) fileInput.value.value = '';
+};
+
+// Generation Logic
+const generateLoading = ref(false);
+const progressPercent = ref(0);
+const loadingMessageIndex = ref(0);
+const loadingMessages = [
+    'Анализируем контекст ниши...',
+    'Пишем продающие сценарии...',
+    'Рендерим видео-ролики Veo...',
+    'Генерируем креативы Imagen 3...',
+    'Накладываем логотип на активы...',
+    'Собираем контент-план...',
+    'Финальная проверка качества...'
+];
+const currentLoadingMessage = computed(() => loadingMessages[loadingMessageIndex.value]);
+
+let pollInterval = null;
+let messageInterval = null;
+const strategyData = ref(null);
+const activeWeeks = ref([1]);
+
+const toggleWeek = (week) => {
+    if (activeWeeks.value.includes(week)) {
+        activeWeeks.value = activeWeeks.value.filter((w) => w !== week);
+    } else {
+        activeWeeks.value.push(week);
+    }
+};
+
+const startGeneration = async () => {
+    if (!analysisId.value) return;
+
+    try {
+        generateLoading.value = true;
+        const data = new FormData();
+
+        const requestPayload = {
+            durationWeeks: formData.value.durationWeeks,
+            priorityPlatforms: formData.value.priorityPlatforms
+        };
+
+        // КАТЕГОРИЧЕСКИ ВАЖНО для Backend (Multipart RequestPart):
+        data.append('request', new Blob([JSON.stringify(requestPayload)], { type: 'application/json' }), 'request.json');
+
+        if (logoFile.value) {
+            data.append('logo', logoFile.value);
+        }
+
+        const result = await MarketingV3Service.generateStrategy(analysisId.value, data);
+
+        if (result && result.strategyId) {
+            strategyId.value = result.strategyId;
+            status.value = 'QUEUED';
+            startPolling();
+        }
+    } catch (error) {
+        toast.add({ severity: 'error', summary: 'Ошибка', detail: error.message || 'Не удалось запустить генерацию', life: 5000 });
+    } finally {
+        generateLoading.value = false;
+    }
+};
+
+const startPolling = () => {
+    progressPercent.value = 5;
+
+    messageInterval = setInterval(() => {
+        loadingMessageIndex.value = (loadingMessageIndex.value + 1) % loadingMessages.length;
+        if (progressPercent.value < 90) progressPercent.value += Math.floor(Math.random() * 8) + 1;
+    }, 4500);
+
+    pollInterval = setInterval(async () => {
+        try {
+            const data = await MarketingV3Service.getStrategyStatus(strategyId.value);
+
+            if (data.status === 'completed') {
+                progressPercent.value = 100;
+                strategyData.value = data;
+                setTimeout(() => {
+                    status.value = 'COMPLETED';
+                    stopPolling();
+                    toast.add({ severity: 'success', summary: 'Готово', detail: 'Ваша стратегия готова к внедрению!', life: 4000 });
+                }, 1000);
+            } else if (data.status === 'failed') {
+                status.value = 'FAILED';
+                stopPolling();
+            } else {
+                status.value = data.status.toUpperCase() === 'PROCESSING' ? 'PROCESSING' : 'QUEUED';
+            }
+        } catch (e) {
+            console.error('Polling error', e);
+        }
+    }, 5000);
+};
+
+const stopPolling = () => {
+    if (pollInterval) clearInterval(pollInterval);
+    if (messageInterval) clearInterval(messageInterval);
+};
+
+// Helpers
+const getPlatformIcon = (platform) => {
+    const p = platform?.toLowerCase() || '';
+    if (p.includes('insta')) return 'pi pi-instagram';
+    if (p.includes('tik')) return 'pi pi-tiktok';
+    if (p.includes('you')) return 'pi pi-youtube';
+    if (p.includes('tg') || p.includes('tele')) return 'pi pi-telegram';
+    if (p.includes('link')) return 'pi pi-linkedin';
+    if (p.includes('vk')) return 'pi pi-vk';
+    return 'pi pi-share-alt';
+};
+
+const formatDate = (dateStr) => {
+    if (!dateStr) return '';
+    return new Date(dateStr).toLocaleDateString('ru-RU', { day: 'numeric', month: 'long' });
+};
+
+const copyText = (text, hashtags) => {
+    let fullText = text || '';
+    if (hashtags?.length) fullText += '\n\n' + hashtags.map((t) => `#${t}`).join(' ');
+    navigator.clipboard.writeText(fullText).then(() => {
+        toast.add({ severity: 'success', summary: 'Копирование', detail: 'Текст в буфере обмена', life: 2000 });
+    });
+};
+
+const getMediaUrl = (filename) => {
+    if (!filename) return null;
+    return `${API_CONFIG.BASE_URL}/api/marketing/v3/media/${filename}`;
+};
+
+// Media Preview Dialog
+const mediaDialog = ref(false);
+const activeMedia = ref(null);
+const previewMedia = (post) => {
+    activeMedia.value = post;
+    mediaDialog.value = true;
+};
+
+// Lifecycle
+const init = async () => {
+    if (!analysisId.value) {
+        router.push('/marketing-analysis/v3');
+        return;
+    }
+    try {
+        previewLoading.value = true;
+        const res = await MarketingV3Service.getStrategyPreview(analysisId.value);
+        previewData.value = res;
+        if (res.recommendedPlatforms?.length) {
+            formData.value.priorityPlatforms = res.recommendedPlatforms.filter((p) => platformOptions.some((o) => o.value === p));
+        }
+    } catch (err) {
+        toast.add({ severity: 'error', summary: 'Ошибка', detail: 'Не удалось загрузить рекомендации', life: 5000 });
+    } finally {
+        previewLoading.value = false;
+    }
+};
+
+onMounted(init);
+onUnmounted(stopPolling);
+</script>
+
+<template>
+    <div class="marketing-strategy-v3-page bg-slate-50 dark:bg-slate-950 min-h-screen p-4 md:p-8">
+        <Toast />
+
+        <div class="max-w-5xl mx-auto">
+            <!-- 1. HEADER -->
+            <div class="flex flex-col md:flex-row md:items-center justify-between mb-10 gap-4">
+                <div>
+                    <div class="flex items-center gap-2 mb-2">
+                        <span class="px-2 py-1 rounded-md bg-emerald-100 dark:bg-emerald-900/30 text-emerald-600 dark:text-emerald-400 text-[10px] font-bold tracking-wider uppercase">Content Factory V3</span>
+                    </div>
+                    <h1 class="text-3xl font-extrabold text-slate-900 dark:text-white tracking-tight">Генерация стратегии</h1>
+                    <p class="text-slate-500 dark:text-slate-400 mt-1">Создание визуального и текстового контента на основе вашего анализа</p>
+                </div>
+                <Button label="К анализу" icon="pi pi-arrow-left" severity="secondary" text class="rounded-xl hover:bg-white dark:hover:bg-slate-900 shadow-sm border border-slate-200 dark:border-slate-800" @click="goBack" />
+            </div>
+
+            <!-- 2. STAGE: PREVIEW & SETUP -->
+            <div v-if="status === 'PREVIEW'" class="space-y-8 animate-in fade-in duration-700">
+                <!-- Recommendation Card -->
+                <div class="relative overflow-hidden group">
+                    <div v-if="previewLoading" class="card p-8 animate-pulse bg-emerald-50/50 dark:bg-emerald-900/10 border-emerald-100 dark:border-emerald-900/20">
+                        <div class="flex items-start gap-4">
+                            <div class="w-12 h-12 rounded-2xl bg-emerald-100 dark:bg-emerald-900/40"></div>
+                            <div class="flex-1 space-y-4">
+                                <div class="h-6 bg-emerald-100 dark:bg-emerald-900/40 rounded w-1/4"></div>
+                                <div class="h-4 bg-emerald-50 dark:bg-emerald-900/20 rounded w-full"></div>
+                                <div class="h-4 bg-emerald-50 dark:bg-emerald-900/20 rounded w-2/3"></div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div v-else-if="previewData" class="card relative p-8 bg-gradient-to-br from-emerald-500 to-emerald-600 dark:from-emerald-600 dark:to-emerald-800 border-none shadow-2xl shadow-emerald-200 dark:shadow-none overflow-hidden">
+                        <!-- Abstract Background elements -->
+                        <div class="absolute top-0 right-0 -mt-10 -mr-10 w-64 h-64 bg-white/10 blur-3xl rounded-full"></div>
+                        <div class="absolute bottom-0 left-0 -mb-10 -ml-10 w-48 h-48 bg-black/5 blur-2xl rounded-full"></div>
+
+                        <div class="flex flex-col md:flex-row items-start md:items-center gap-6 relative z-10 text-white">
+                            <div class="p-4 bg-white/20 backdrop-blur-md rounded-2xl border border-white/30 shadow-inner">
+                                <i class="pi pi-sparkles text-3xl animate-pulse" />
+                            </div>
+                            <div class="flex-1">
+                                <h3 class="text-xl font-black mb-2 flex items-center gap-2">
+                                    {{ previewData.modelTitle || 'Оптимальная стратегия' }}
+                                    <i class="pi pi-info-circle text-xs opacity-60" />
+                                </h3>
+                                <p class="text-emerald-50/90 leading-relaxed font-medium">
+                                    {{ previewData.description }}
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Form Section -->
+                <div class="grid grid-cols-1 lg:grid-cols-12 gap-8 items-start">
+                    <!-- Left: Duration & Platforms -->
+                    <div class="lg:col-span-8 space-y-8">
+                        <div class="card p-6 md:p-8 bg-white dark:bg-slate-900 border-slate-200/60 dark:border-slate-800 shadow-sm">
+                            <h3 class="text-lg font-bold mb-8 flex items-center gap-2">
+                                <span class="w-1.5 h-6 bg-emerald-500 rounded-full"></span>
+                                Настройки кампании
+                            </h3>
+
+                            <div class="space-y-10">
+                                <!-- Duration -->
+                                <div>
+                                    <div class="flex justify-between items-center mb-6">
+                                        <label class="text-sm font-bold text-slate-700 dark:text-slate-300">Длительность в неделях</label>
+                                        <span class="px-3 py-1 bg-emerald-50 dark:bg-emerald-900/30 text-emerald-600 dark:text-emerald-400 rounded-lg text-lg font-black">{{ formData.durationWeeks }}</span>
+                                    </div>
+                                    <div class="px-1">
+                                        <Slider v-model="formData.durationWeeks" :min="1" :max="12" :step="1" class="custom-slider" />
+                                    </div>
+                                    <div class="flex justify-between mt-4 text-[10px] font-bold text-slate-400 uppercase tracking-widest px-1">
+                                        <span>1 неделя</span>
+                                        <span>4 недели</span>
+                                        <span>12 недель</span>
+                                    </div>
+                                </div>
+
+                                <Divider class="opacity-40" />
+
+                                <!-- Platforms -->
+                                <div>
+                                    <label class="block text-sm font-bold text-slate-700 dark:text-slate-300 mb-6">Каналы продвижения</label>
+                                    <div class="grid grid-cols-2 sm:grid-cols-3 gap-3">
+                                        <div v-for="platform in platformOptions" :key="platform.value" class="relative">
+                                            <input type="checkbox" :id="platform.value" v-model="formData.priorityPlatforms" :value="platform.value" class="peer hidden" />
+                                            <label
+                                                :for="platform.value"
+                                                class="flex items-center gap-3 p-4 rounded-2xl border-2 border-slate-100 dark:border-slate-800 bg-white dark:bg-slate-900 cursor-pointer transition-all peer-checked:border-emerald-500 peer-checked:bg-emerald-50/30 dark:peer-checked:bg-emerald-500/10 hover:border-emerald-200 dark:hover:border-emerald-800"
+                                            >
+                                                <div
+                                                    class="w-6 h-6 rounded-full border-2 flex items-center justify-center transition-colors"
+                                                    :class="formData.priorityPlatforms.includes(platform.value) ? 'bg-emerald-500 border-emerald-500 text-white' : 'border-slate-200 dark:border-slate-700'"
+                                                >
+                                                    <i class="pi pi-check text-[10px] font-bold" v-if="formData.priorityPlatforms.includes(platform.value)" />
+                                                </div>
+                                                <span class="text-sm font-bold text-slate-600 dark:text-slate-400 peer-checked:text-emerald-700 dark:peer-checked:text-emerald-400">
+                                                    {{ platform.label }}
+                                                </span>
+                                            </label>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Right: Brand & Submit -->
+                    <div class="lg:col-span-4 space-y-8">
+                        <!-- Logo Upload -->
+                        <div class="card p-6 bg-white dark:bg-slate-900 border-slate-200/60 dark:border-slate-800 shadow-sm">
+                            <h3 class="text-sm font-bold mb-4 text-slate-400 uppercase tracking-wider">Интеграция бренда</h3>
+
+                            <div
+                                class="relative border-2 border-dashed rounded-2xl p-6 text-center transition-all bg-slate-50/50 dark:bg-slate-800/20"
+                                :class="[isDragging ? 'border-emerald-500 bg-emerald-50/50' : 'border-slate-200 dark:border-slate-700', logoPreviewUrl ? 'p-2' : 'hover:border-emerald-300']"
+                                @dragover.prevent="isDragging = true"
+                                @dragleave.prevent="isDragging = false"
+                                @drop.prevent="handleDrop"
+                            >
+                                <input type="file" id="logoUpload" accept="image/*" class="hidden" @change="handleFileSelect" ref="fileInput" />
+
+                                <div v-if="logoPreviewUrl" class="relative group aspect-square rounded-xl overflow-hidden shadow-inner bg-white dark:bg-slate-900">
+                                    <img :src="logoPreviewUrl" alt="Logo preview" class="w-full h-full object-contain p-4" />
+                                    <div class="absolute inset-0 bg-black/40 opacity-0 group-hover:opacity-100 flex items-center justify-center transition-opacity">
+                                        <Button icon="pi pi-trash" rounded severity="danger" class="w-12 h-12" @click="removeLogo" />
+                                    </div>
+                                </div>
+
+                                <div v-else class="py-4 cursor-pointer" @click="triggerFileInput">
+                                    <div class="w-12 h-12 bg-white dark:bg-slate-900 rounded-xl shadow-sm border border-slate-200 dark:border-slate-700 flex items-center justify-center mx-auto mb-4 text-emerald-500">
+                                        <i class="pi pi-upload text-xl" />
+                                    </div>
+                                    <h4 class="text-slate-900 dark:text-white font-bold text-sm mb-1">Логотип бренда</h4>
+                                    <p class="text-slate-400 text-[10px] font-medium leading-relaxed">
+                                        Кликните или перетащите <br />
+                                        PNG, JPG до 5MB
+                                    </p>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- General Submit -->
+                        <button
+                            @click="startGeneration"
+                            class="w-full py-5 px-6 rounded-2xl bg-emerald-500 hover:bg-emerald-600 active:scale-[0.98] disabled:bg-slate-200 dark:disabled:bg-slate-800 disabled:text-slate-400 text-white font-black text-lg shadow-xl shadow-emerald-500/20 transition-all flex items-center justify-center gap-3 overflow-hidden group relative"
+                            :disabled="!formData.priorityPlatforms.length || generateLoading"
+                        >
+                            <span v-if="!generateLoading" class="flex items-center gap-3"> ⚡ <span class="tracking-tight">Запустить Фабрику</span> </span>
+                            <div v-else class="flex items-center gap-3">
+                                <i class="pi pi-spin pi-spinner text-xl" />
+                                <span>Подготовка...</span>
+                            </div>
+                            <!-- Subtle shine effect on hover -->
+                            <div class="absolute top-0 -left-full w-full h-full bg-gradient-to-r from-transparent via-white/20 to-transparent group-hover:left-[200%] transition-all duration-1000 ease-in-out"></div>
+                        </button>
+                    </div>
+                </div>
+            </div>
+
+            <!-- 3. STAGE: POLLING SCREEN -->
+            <div v-else-if="status === 'QUEUED' || status === 'PROCESSING'" class="card p-12 md:p-24 text-center bg-white dark:bg-slate-900 border-none shadow-xl animate-in zoom-in duration-500">
+                <div class="max-w-md mx-auto">
+                    <!-- Progress Circle -->
+                    <div class="relative w-32 h-32 mx-auto mb-12">
+                        <svg class="w-full h-full transform -rotate-90">
+                            <circle cx="64" cy="64" r="58" stroke="currentColor" stroke-width="8" fill="transparent" class="text-slate-100 dark:text-slate-800" />
+                            <circle
+                                cx="64"
+                                cy="64"
+                                r="58"
+                                stroke="currentColor"
+                                stroke-width="8"
+                                fill="transparent"
+                                stroke-dasharray="364.4"
+                                :stroke-dashoffset="364.4 - (364.4 * progressPercent) / 100"
+                                class="text-emerald-500 transition-all duration-1000 ease-out"
+                            />
+                        </svg>
+                        <div class="absolute inset-0 flex items-center justify-center">
+                            <i class="pi pi-bolt text-4xl text-emerald-500 animate-pulse" />
+                        </div>
+                    </div>
+
+                    <h2 class="text-2xl font-black text-slate-900 dark:text-white mb-4">
+                        {{ status === 'QUEUED' ? 'Запуск производства...' : 'Фабрика в работе' }}
+                    </h2>
+
+                    <div class="h-12 flex items-center justify-center mb-8">
+                        <Transition name="slide-up" mode="out-in">
+                            <p :key="loadingMessageIndex" class="text-slate-500 dark:text-slate-400 font-bold">
+                                {{ currentLoadingMessage }}
+                            </p>
+                        </Transition>
+                    </div>
+
+                    <div class="bg-slate-100 dark:bg-slate-800 rounded-full h-1.5 overflow-hidden">
+                        <div class="bg-emerald-500 h-full transition-all duration-1000" :style="{ width: `${progressPercent}%` }"></div>
+                    </div>
+                    <div class="mt-4 flex justify-between text-[10px] font-black text-slate-400 uppercase tracking-widest">
+                        <span>Процесс</span>
+                        <span class="text-emerald-500">{{ progressPercent }}%</span>
+                    </div>
+                </div>
+            </div>
+
+            <!-- 4. STAGE: COMPLETED (Result Display) -->
+            <div v-else-if="status === 'COMPLETED' && strategyData" class="space-y-10 animate-in fade-in slide-in-from-bottom-5 duration-1000">
+                <!-- Strategy Rationale Banner -->
+                <div class="card p-8 md:p-12 bg-slate-900 dark:bg-black text-white relative overflow-hidden group">
+                    <div class="absolute top-0 right-0 w-96 h-96 bg-emerald-500/20 blur-3xl rounded-full -mr-48 -mt-48 group-hover:bg-emerald-500/30 transition-colors duration-1000"></div>
+
+                    <div class="relative z-10 flex flex-col md:flex-row gap-10 items-start">
+                        <div class="flex-1">
+                            <div class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-emerald-500/20 text-emerald-400 text-[10px] font-black uppercase tracking-wider border border-emerald-500/30 mb-6">
+                                <span class="relative flex h-2 w-2">
+                                    <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75"></span>
+                                    <span class="relative inline-flex rounded-full h-2 w-2 bg-emerald-500"></span>
+                                </span>
+                                Готовый результат
+                            </div>
+                            <h2 class="text-3xl font-black mb-6 tracking-tight">Стратегическое обоснование</h2>
+                            <p class="text-slate-400 leading-relaxed text-lg font-medium whitespace-pre-line">
+                                {{ strategyData.strategyData?.rationale }}
+                            </p>
+                        </div>
+                        <div class="w-full md:w-64 space-y-4">
+                            <div class="p-5 rounded-2xl bg-white/5 border border-white/10 backdrop-blur-sm">
+                                <p class="text-slate-500 text-[10px] font-black uppercase mb-2">Выбранная модель</p>
+                                <p class="font-bold text-emerald-400">{{ strategyData.strategyData?.selectedModel || 'Адаптивная' }}</p>
+                            </div>
+                            <div class="p-5 rounded-2xl bg-white/5 border border-white/10 backdrop-blur-sm">
+                                <p class="text-slate-500 text-[10px] font-black uppercase mb-2">Срок реализации</p>
+                                <p class="font-bold text-slate-200">{{ strategyData.strategyData?.durationWeeks }} недель</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Weekly Sprints -->
+                <div v-if="strategyData.weeklyPlans?.length">
+                    <h3 class="text-xl font-black text-slate-900 dark:text-white mb-6 px-2 flex items-center gap-3">
+                        <i class="pi pi-calendar text-emerald-500" />
+                        План реализации (Спринты)
+                    </h3>
+
+                    <div class="space-y-4">
+                        <div v-for="plan in strategyData.weeklyPlans" :key="plan.weekNumber" class="card overflow-hidden bg-white dark:bg-slate-900 border-slate-200/60 dark:border-slate-800 shadow-sm">
+                            <div class="flex items-center justify-between p-6 cursor-pointer hover:bg-slate-50 dark:hover:bg-slate-800/50 transition-colors" @click="toggleWeek(plan.weekNumber)">
+                                <div class="flex items-center gap-4">
+                                    <div class="w-10 h-10 rounded-xl bg-slate-900 dark:bg-emerald-500 text-white flex items-center justify-center font-black text-sm shadow-lg">
+                                        {{ plan.weekNumber }}
+                                    </div>
+                                    <div>
+                                        <h4 class="font-black text-slate-900 dark:text-white">Неделя {{ plan.weekNumber }}</h4>
+                                        <div class="flex gap-2 mt-1">
+                                            <span v-for="theme in plan.mainThemes?.slice(0, 2)" :key="theme" class="text-[10px] font-bold text-emerald-600 dark:text-emerald-400 uppercase tracking-tighter"> #{{ theme }} </span>
+                                        </div>
+                                    </div>
+                                </div>
+                                <i class="pi" :class="activeWeeks.includes(plan.weekNumber) ? 'pi-chevron-up' : 'pi-chevron-down'" />
+                            </div>
+
+                            <Transition name="expand">
+                                <div v-if="activeWeeks.includes(plan.weekNumber)" class="p-6 pt-0 border-t border-slate-100 dark:border-slate-800/60 bg-slate-50/30 dark:bg-slate-900/40">
+                                    <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mt-6">
+                                        <div>
+                                            <p class="text-[10px] font-black text-slate-400 uppercase tracking-widest mb-3">Темы недели</p>
+                                            <div class="flex flex-wrap gap-2">
+                                                <Tag
+                                                    v-for="theme in plan.mainThemes"
+                                                    :key="theme"
+                                                    :value="theme"
+                                                    class="bg-white dark:bg-slate-800 text-slate-700 dark:text-slate-300 font-bold border border-slate-200 dark:border-slate-700 rounded-lg px-3 py-1.5"
+                                                />
+                                            </div>
+                                        </div>
+                                        <div>
+                                            <p class="text-[10px] font-black text-slate-400 uppercase tracking-widest mb-3">Инструкция по реализации</p>
+                                            <div class="p-4 rounded-xl bg-emerald-50/50 dark:bg-emerald-950/20 border-l-4 border-emerald-500 text-slate-700 dark:text-slate-400 text-sm leading-relaxed whitespace-pre-line font-medium">
+                                                {{ plan.contentRecommendations }}
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </Transition>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Content Calendar -->
+                <div v-if="strategyData.postCalendar?.length">
+                    <div class="flex items-center justify-between mb-8 px-2">
+                        <h3 class="text-xl font-black text-slate-900 dark:text-white flex items-center gap-3">
+                            <i class="pi pi-images text-emerald-500" />
+                            Медиа-активы и посты
+                        </h3>
+                        <Button label="Скачать календарь" icon="pi pi-download" size="small" severity="secondary" rounded text class="font-bold" />
+                    </div>
+
+                    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+                        <div
+                            v-for="(post, idx) in strategyData.postCalendar"
+                            :key="idx"
+                            class="card p-0 overflow-hidden bg-white dark:bg-slate-900 border-none shadow-xl shadow-slate-200/50 dark:shadow-none hover:-translate-y-2 transition-transform duration-500 group"
+                        >
+                            <!-- Media Header -->
+                            <div class="aspect-square relative bg-slate-100 dark:bg-slate-800 flex items-center justify-center overflow-hidden">
+                                <template v-if="post.contentType === 'video' || post.contentType === 'reels'">
+                                    <video v-if="getMediaUrl(post.mediaFilename)" :src="getMediaUrl(post.mediaFilename)" autoplay loop muted playsinline class="w-full h-full object-cover group-hover:scale-110 transition-transform duration-700" />
+                                    <div v-else class="text-center p-8 opacity-40">
+                                        <i class="pi pi-video text-5xl mb-2" />
+                                        <p class="text-[10px] font-bold uppercase">Видео в обработке</p>
+                                    </div>
+                                    <div class="absolute top-4 right-4 px-2 py-1 bg-black/60 rounded backdrop-blur-md text-[8px] font-black text-white uppercase tracking-tighter">Video Asset</div>
+                                </template>
+                                <template v-else>
+                                    <img v-if="getMediaUrl(post.mediaFilename)" :src="getMediaUrl(post.mediaFilename)" class="w-full h-full object-cover group-hover:scale-110 transition-transform duration-700" />
+                                    <div v-else class="text-center p-8 opacity-40">
+                                        <i class="pi pi-image text-5xl mb-2" />
+                                        <p class="text-[10px] font-bold uppercase tracking-widest">Генерация визуала...</p>
+                                    </div>
+                                </template>
+
+                                <div class="absolute inset-0 bg-emerald-500/10 opacity-0 group-hover:opacity-100 transition-opacity"></div>
+                                <div class="absolute top-4 left-4 flex gap-2">
+                                    <div class="p-2 rounded-xl bg-white/90 dark:bg-slate-900/90 backdrop-blur-md shadow-lg">
+                                        <i :class="getPlatformIcon(post.platform)" class="text-lg text-emerald-500" />
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Content Details -->
+                            <div class="p-6">
+                                <div class="flex justify-between items-start mb-4">
+                                    <div>
+                                        <p class="text-[10px] font-black text-slate-400 uppercase tracking-widest mb-1">{{ formatDate(post.publishDate) }}</p>
+                                        <h4 class="font-black text-slate-900 dark:text-white line-clamp-1 h-5">{{ post.theme }}</h4>
+                                    </div>
+                                    <span class="text-[10px] font-black px-2 py-1 bg-slate-100 dark:bg-slate-800 rounded-lg text-slate-500 uppercase">{{ post.publishTime }}</span>
+                                </div>
+
+                                <div class="p-4 rounded-xl bg-slate-50 dark:bg-slate-800/40 border border-slate-100 dark:border-slate-800 mb-6 group-hover:bg-emerald-50/30 dark:group-hover:bg-emerald-900/10 transition-colors">
+                                    <p class="text-xs text-slate-600 dark:text-slate-400 line-clamp-3 font-medium leading-relaxed">{{ post.postText }}</p>
+                                </div>
+
+                                <div class="flex items-center gap-2">
+                                    <Button icon="pi pi-copy" label="Копировать" class="flex-1 text-[10px] font-black uppercase tracking-wider rounded-xl py-3" outlined severity="secondary" @click="copyText(post.postText, post.hashtags)" />
+                                    <Button icon="pi pi-expand" class="w-12 h-12 rounded-xl" text severity="secondary" v-if="getMediaUrl(post.mediaFilename)" @click="previewMedia(post)" />
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <!-- Actions Footer -->
+                <div class="flex flex-col md:flex-row gap-4 pt-10 border-t border-slate-200 dark:border-slate-800">
+                    <Button label="Сохранить как PDF" icon="pi pi-file-pdf" severity="secondary" outlined class="flex-1 rounded-2xl font-black py-4" />
+                    <Button label="Новая генерация" icon="pi pi-refresh" severity="secondary" class="flex-1 rounded-2xl font-black py-4" @click="status = 'PREVIEW'" />
+                </div>
+            </div>
+
+            <!-- Stage: FAILED -->
+            <div v-else-if="status === 'FAILED'" class="card p-12 text-center bg-white dark:bg-slate-900 border-none shadow-xl">
+                <div class="w-20 h-20 bg-red-100 dark:bg-red-900/30 rounded-full flex items-center justify-center mx-auto mb-6 text-red-500">
+                    <i class="pi pi-exclamation-triangle text-3xl" />
+                </div>
+                <h2 class="text-2xl font-black mb-2">Генерация прервана</h2>
+                <p class="text-slate-500 mb-8 max-w-sm mx-auto">Что-то пошло не так при работе искусственного интеллекта. Пожалуйста, попробуйте еще раз.</p>
+                <div class="flex justify-center gap-4">
+                    <Button label="Назад к настройкам" severity="secondary" text class="font-bold" @click="status = 'PREVIEW'" />
+                    <Button label="Повторить попытку" icon="pi pi-refresh" severity="danger" class="font-bold rounded-xl" @click="startGeneration" />
+                </div>
+            </div>
+
+            <!-- Media Modal -->
+            <Dialog v-model:visible="mediaDialog" :modal="true" :showHeader="false" :dismissableMask="true" contentClass="p-0 bg-transparent shadow-none" class="w-full max-w-4xl m-4 border-none">
+                <div class="relative rounded-3xl overflow-hidden bg-black/95 flex flex-col items-center justify-center p-2 group">
+                    <Button icon="pi pi-times" rounded text class="absolute top-6 right-6 text-white/50 hover:text-white z-50 bg-white/10 hover:bg-white/20 backdrop-blur-md" @click="mediaDialog = false" />
+
+                    <template v-if="activeMedia">
+                        <video v-if="activeMedia.contentType === 'video' || activeMedia.contentType === 'reels'" :src="getMediaUrl(activeMedia.mediaFilename)" autoplay controls class="max-h-[90vh] w-auto max-w-full rounded-2xl overflow-hidden" />
+                        <img v-else :src="getMediaUrl(activeMedia.mediaFilename)" alt="Full preview" class="max-h-[90vh] w-auto max-w-full rounded-2xl object-contain" />
+
+                        <!-- Overlay Info in Modal -->
+                        <div class="absolute bottom-6 left-6 right-6 p-6 rounded-2xl bg-black/60 backdrop-blur-xl border border-white/10 text-white opacity-0 group-hover:opacity-100 transition-opacity duration-300">
+                            <div class="flex items-center gap-2 mb-2">
+                                <i :class="getPlatformIcon(activeMedia.platform)" class="text-emerald-400" />
+                                <span class="text-[10px] font-black uppercase tracking-widest text-emerald-400">{{ activeMedia.platform }}</span>
+                            </div>
+                            <h4 class="text-lg font-black mb-3">{{ activeMedia.theme }}</h4>
+                            <p class="text-sm text-slate-400 font-medium leading-relaxed">{{ activeMedia.postText }}</p>
+                        </div>
+                    </template>
+                </div>
+            </Dialog>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.custom-slider :deep(.p-slider-handle) {
+    background-color: #10b981;
+    border-color: #10b981;
+    width: 20px;
+    height: 20px;
+}
+.custom-slider :deep(.p-slider-range) {
+    background-color: #10b981;
+}
+
+/* Animations */
+.slide-up-enter-active,
+.slide-up-leave-active {
+    transition: all 0.5s ease;
+}
+.slide-up-enter-from {
+    opacity: 0;
+    transform: translateY(20px);
+}
+.slide-up-leave-to {
+    opacity: 0;
+    transform: translateY(-20px);
+}
+
+.expand-enter-active,
+.expand-leave-active {
+    transition: all 0.3s ease-in-out;
+    max-height: 500px;
+    overflow: hidden;
+}
+.expand-enter-from,
+.expand-leave-to {
+    max-height: 0;
+    opacity: 0;
+}
+</style>
diff --git a/src/views/reports/ReportGenerator.vue b/src/views/reports/ReportGenerator.vue
index 8da5948..e7c3063 100644
--- a/src/views/reports/ReportGenerator.vue
+++ b/src/views/reports/ReportGenerator.vue
@@ -1,115 +1,3 @@
-<template>
-    <div class="grid">
-        <div class="col-12">
-            <div class="card">
-                <h5>Генерация отчёта</h5>
-                <p>Заполните форму для создания нового отчёта на основе собранных данных.</p>
-            </div>
-        </div>
-
-        <div class="col-12 lg:col-8">
-            <div class="card">
-                <form @submit.prevent="handleGenerate" class="p-fluid">
-                    <div class="grid">
-                        <div class="col-12">
-                            <div class="field">
-                                <label for="query">Тема исследования *</label>
-                                <InputText id="query" v-model="formData.query" :class="{ 'p-invalid': errors.query }" placeholder="Введите тему для исследования" size="large" />
-                                <small v-if="errors.query" class="p-error">{{ errors.query }}</small>
-                            </div>
-                        </div>
-
-                        <div class="col-12 md:col-6">
-                            <div class="field">
-                                <label for="lang">Язык отчёта</label>
-                                <Dropdown id="lang" v-model="formData.lang" :options="langOptions" optionLabel="label" optionValue="value" placeholder="Выберите язык" />
-                            </div>
-                        </div>
-
-                        <div class="col-12 md:col-6">
-                            <div class="field">
-                                <label for="report_type">Тип отчёта</label>
-                                <Dropdown id="report_type" v-model="formData.report_type" :options="reportTypeOptions" optionLabel="label" optionValue="value" placeholder="Выберите тип" />
-                            </div>
-                        </div>
-
-                        <div class="col-12 md:col-6">
-                            <div class="field">
-                                <label for="depth">Глубина исследования</label>
-                                <Slider id="depth" v-model.number="formData.depth" :min="1" :max="5" :step="1" :disabled="false" />
-                                <small class="text-600">Текущее значение: {{ formData.depth }}</small>
-                            </div>
-                        </div>
-
-                        <div class="col-12 md:col-6">
-                            <div class="field">
-                                <label for="breadth">Широта исследования</label>
-                                <Slider id="breadth" v-model.number="formData.breadth" :min="2" :max="10" :step="1" :disabled="false" />
-                                <small class="text-600">Текущее значение: {{ formData.breadth }}</small>
-                            </div>
-                        </div>
-
-                        <div class="col-12">
-                            <div class="flex gap-2">
-                                <Button type="submit" label="Сгенерировать отчёт" icon="pi pi-file-pdf" :loading="loading" :disabled="loading" size="large" />
-                                <Button type="button" label="Очистить форму" icon="pi pi-refresh" severity="secondary" @click="resetForm" :disabled="loading" />
-                            </div>
-                        </div>
-                    </div>
-                </form>
-            </div>
-        </div>
-
-        <div class="col-12 lg:col-4">
-            <div class="card">
-                <h6>Информация о генерации</h6>
-                <div class="flex flex-column gap-3">
-                    <div class="flex align-items-center gap-2">
-                        <i class="pi pi-info-circle text-blue-500"></i>
-                        <span class="text-sm">Отчёт будет создан с помощью AI-исследования</span>
-                    </div>
-                    <div class="flex align-items-center gap-2">
-                        <i class="pi pi-clock text-orange-500"></i>
-                        <span class="text-sm">Время генерации: до 5 минут</span>
-                    </div>
-                    <div class="flex align-items-center gap-2">
-                        <i class="pi pi-download text-green-500"></i>
-                        <span class="text-sm">PDF-файл будет автоматически скачан</span>
-                    </div>
-                </div>
-            </div>
-
-            <div class="card mt-3">
-                <h6>Параметры исследования</h6>
-                <div class="flex flex-column gap-2">
-                    <div class="flex align-items-center gap-2">
-                        <i class="pi pi-search text-purple-500"></i>
-                        <span class="text-sm">Глубина: детальность анализа</span>
-                    </div>
-                    <div class="flex align-items-center gap-2">
-                        <i class="pi pi-globe text-cyan-500"></i>
-                        <span class="text-sm">Широта: количество источников</span>
-                    </div>
-                </div>
-            </div>
-
-            <div class="card mt-3">
-                <h6>Типы отчётов</h6>
-                <div class="flex flex-column gap-2">
-                    <div class="flex align-items-center gap-2">
-                        <i class="pi pi-file-pdf text-red-500"></i>
-                        <span class="text-sm">Отчёт - полное исследование</span>
-                    </div>
-                    <div class="flex align-items-center gap-2">
-                        <i class="pi pi-question-circle text-blue-500"></i>
-                        <span class="text-sm">Ответ - краткий ответ на вопрос</span>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
 <script setup>
 import ReportService from '@/service/ReportService.js';
 import { useToast } from 'primevue/usetoast';
@@ -228,6 +116,118 @@ onMounted(() => {
 });
 </script>
 
+<template>
+    <div class="grid">
+        <div class="col-12">
+            <div class="card">
+                <h5>Генерация отчёта</h5>
+                <p>Заполните форму для создания нового отчёта на основе собранных данных.</p>
+            </div>
+        </div>
+
+        <div class="col-12 lg:col-8">
+            <div class="card">
+                <form @submit.prevent="handleGenerate" class="p-fluid">
+                    <div class="grid">
+                        <div class="col-12">
+                            <div class="field">
+                                <label for="query">Тема исследования *</label>
+                                <InputText id="query" v-model="formData.query" :class="{ 'p-invalid': errors.query }" placeholder="Введите тему для исследования" size="large" />
+                                <small v-if="errors.query" class="p-error">{{ errors.query }}</small>
+                            </div>
+                        </div>
+
+                        <div class="col-12 md:col-6">
+                            <div class="field">
+                                <label for="lang">Язык отчёта</label>
+                                <Dropdown id="lang" v-model="formData.lang" :options="langOptions" optionLabel="label" optionValue="value" placeholder="Выберите язык" />
+                            </div>
+                        </div>
+
+                        <div class="col-12 md:col-6">
+                            <div class="field">
+                                <label for="report_type">Тип отчёта</label>
+                                <Dropdown id="report_type" v-model="formData.report_type" :options="reportTypeOptions" optionLabel="label" optionValue="value" placeholder="Выберите тип" />
+                            </div>
+                        </div>
+
+                        <div class="col-12 md:col-6">
+                            <div class="field">
+                                <label for="depth">Глубина исследования</label>
+                                <Slider id="depth" v-model.number="formData.depth" :min="1" :max="5" :step="1" :disabled="false" />
+                                <small class="text-600">Текущее значение: {{ formData.depth }}</small>
+                            </div>
+                        </div>
+
+                        <div class="col-12 md:col-6">
+                            <div class="field">
+                                <label for="breadth">Широта исследования</label>
+                                <Slider id="breadth" v-model.number="formData.breadth" :min="2" :max="10" :step="1" :disabled="false" />
+                                <small class="text-600">Текущее значение: {{ formData.breadth }}</small>
+                            </div>
+                        </div>
+
+                        <div class="col-12">
+                            <div class="flex gap-2">
+                                <Button type="submit" label="Сгенерировать отчёт" icon="pi pi-file-pdf" :loading="loading" :disabled="loading" size="large" />
+                                <Button type="button" label="Очистить форму" icon="pi pi-refresh" severity="secondary" @click="resetForm" :disabled="loading" />
+                            </div>
+                        </div>
+                    </div>
+                </form>
+            </div>
+        </div>
+
+        <div class="col-12 lg:col-4">
+            <div class="card">
+                <h6>Информация о генерации</h6>
+                <div class="flex flex-column gap-3">
+                    <div class="flex align-items-center gap-2">
+                        <i class="pi pi-info-circle text-blue-500"></i>
+                        <span class="text-sm">Отчёт будет создан с помощью AI-исследования</span>
+                    </div>
+                    <div class="flex align-items-center gap-2">
+                        <i class="pi pi-clock text-orange-500"></i>
+                        <span class="text-sm">Время генерации: до 5 минут</span>
+                    </div>
+                    <div class="flex align-items-center gap-2">
+                        <i class="pi pi-download text-green-500"></i>
+                        <span class="text-sm">PDF-файл будет автоматически скачан</span>
+                    </div>
+                </div>
+            </div>
+
+            <div class="card mt-3">
+                <h6>Параметры исследования</h6>
+                <div class="flex flex-column gap-2">
+                    <div class="flex align-items-center gap-2">
+                        <i class="pi pi-search text-purple-500"></i>
+                        <span class="text-sm">Глубина: детальность анализа</span>
+                    </div>
+                    <div class="flex align-items-center gap-2">
+                        <i class="pi pi-globe text-cyan-500"></i>
+                        <span class="text-sm">Широта: количество источников</span>
+                    </div>
+                </div>
+            </div>
+
+            <div class="card mt-3">
+                <h6>Типы отчётов</h6>
+                <div class="flex flex-column gap-2">
+                    <div class="flex align-items-center gap-2">
+                        <i class="pi pi-file-pdf text-red-500"></i>
+                        <span class="text-sm">Отчёт - полное исследование</span>
+                    </div>
+                    <div class="flex align-items-center gap-2">
+                        <i class="pi pi-question-circle text-blue-500"></i>
+                        <span class="text-sm">Ответ - краткий ответ на вопрос</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .p-fluid .field {
     margin-bottom: 1rem;
diff --git a/src/views/reports/ReportHistory.vue b/src/views/reports/ReportHistory.vue
index 6de9f21..aaf7778 100644
--- a/src/views/reports/ReportHistory.vue
+++ b/src/views/reports/ReportHistory.vue
@@ -1,221 +1,3 @@
-<template>
-    <div class="grid">
-        <div class="col-12">
-            <div class="card">
-                <div class="flex justify-content-between align-items-center">
-                    <div>
-                        <h5>История отчётов</h5>
-                        <p>Просмотр и скачивание ранее созданных отчётов</p>
-                    </div>
-                    <div class="flex gap-2">
-                        <Button icon="pi pi-refresh" @click="loadReports" :loading="loading" severity="secondary" text v-tooltip.top="'Обновить список'" />
-                        <Button label="Создать отчёт" icon="pi pi-plus" @click="goToGenerator" severity="success" />
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- Фильтры -->
-        <div class="col-12">
-            <div class="card">
-                <h6>Фильтры</h6>
-                <div class="grid">
-                    <div class="col-12 md:col-3">
-                        <div class="field">
-                            <label for="search">Поиск</label>
-                            <InputText id="search" v-model="filters.search" placeholder="Поиск по заголовку, автору или компании" @input="onSearch" />
-                        </div>
-                    </div>
-                    <div class="col-12 md:col-2">
-                        <div class="field">
-                            <label for="format">Формат</label>
-                            <Dropdown id="format" v-model="filters.format" :options="formatOptions" optionLabel="label" optionValue="value" placeholder="Все форматы" @change="applyFilters" />
-                        </div>
-                    </div>
-                    <div class="col-12 md:col-2">
-                        <div class="field">
-                            <label for="dateFrom">Дата с</label>
-                            <Calendar id="dateFrom" v-model="filters.dateFrom" dateFormat="dd.mm.yy" placeholder="Выберите дату" @date-select="applyFilters" />
-                        </div>
-                    </div>
-                    <div class="col-12 md:col-2">
-                        <div class="field">
-                            <label for="dateTo">Дата по</label>
-                            <Calendar id="dateTo" v-model="filters.dateTo" dateFormat="dd.mm.yy" placeholder="Выберите дату" @date-select="applyFilters" />
-                        </div>
-                    </div>
-                    <div class="col-12 md:col-3">
-                        <div class="field">
-                            <label>&nbsp;</label>
-                            <div class="flex gap-2">
-                                <Button label="Применить" icon="pi pi-filter" @click="applyFilters" severity="info" />
-                                <Button label="Сбросить" icon="pi pi-times" @click="resetFilters" severity="secondary" text />
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- Статистика -->
-        <div class="col-12">
-            <div class="grid">
-                <div class="col-12 md:col-3">
-                    <div class="card text-center">
-                        <div class="text-2xl font-bold text-blue-500">{{ totalReports }}</div>
-                        <div class="text-sm text-600">Всего отчётов</div>
-                    </div>
-                </div>
-                <div class="col-12 md:col-3">
-                    <div class="card text-center">
-                        <div class="text-2xl font-bold text-green-500">{{ thisMonthReports }}</div>
-                        <div class="text-sm text-600">За этот месяц</div>
-                    </div>
-                </div>
-                <div class="col-12 md:col-3">
-                    <div class="card text-center">
-                        <div class="text-2xl font-bold text-orange-500">{{ thisWeekReports }}</div>
-                        <div class="text-sm text-600">За эту неделю</div>
-                    </div>
-                </div>
-                <div class="col-12 md:col-3">
-                    <div class="card text-center">
-                        <div class="text-2xl font-bold text-purple-500">{{ totalSize }}</div>
-                        <div class="text-sm text-600">Общий размер</div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- Таблица отчётов -->
-        <div class="col-12">
-            <div class="card">
-                <DataTable
-                    :value="reports"
-                    :loading="loading"
-                    :paginator="true"
-                    :rows="pageSize"
-                    :totalRecords="totalElements"
-                    :lazy="true"
-                    @page="onPageChange"
-                    @sort="onSort"
-                    paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
-                    :rowsPerPageOptions="[10, 20, 50]"
-                    currentPageReportTemplate="Показано {first} - {last} из {totalRecords} записей"
-                    emptyMessage="Отчёты не найдены"
-                    responsiveLayout="scroll"
-                    :sortField="sortField"
-                    :sortOrder="sortOrder"
-                    removableSort
-                >
-                    <Column field="reportTitle" header="Заголовок" sortable>
-                        <template #body="{ data }">
-                            <div class="flex flex-column">
-                                <div class="font-semibold">{{ data.reportTitle }}</div>
-                                <div class="text-sm text-600" v-if="data.description">{{ data.description }}</div>
-                            </div>
-                        </template>
-                    </Column>
-
-                    <Column field="authorName" header="Автор" sortable>
-                        <template #body="{ data }">
-                            <div class="flex align-items-center gap-2">
-                                <i class="pi pi-user text-blue-500"></i>
-                                <span>{{ data.authorName }}</span>
-                            </div>
-                        </template>
-                    </Column>
-
-                    <Column field="companyName" header="Компания" sortable>
-                        <template #body="{ data }">
-                            <div class="flex align-items-center gap-2">
-                                <i class="pi pi-building text-green-500"></i>
-                                <span>{{ data.companyName }}</span>
-                            </div>
-                        </template>
-                    </Column>
-
-                    <Column field="startDate" header="Период" sortable>
-                        <template #body="{ data }">
-                            <div class="flex flex-column">
-                                <div class="text-sm">{{ formatDate(data.startDate) }}</div>
-                                <div class="text-sm text-600">по {{ formatDate(data.endDate) }}</div>
-                            </div>
-                        </template>
-                    </Column>
-
-                    <Column field="format" header="Формат" sortable>
-                        <template #body="{ data }">
-                            <Tag :value="data.format" :severity="data.format === 'PDF' ? 'danger' : 'info'" :icon="data.format === 'PDF' ? 'pi pi-file-pdf' : 'pi pi-file-word'" />
-                        </template>
-                    </Column>
-
-                    <Column field="fileSize" header="Размер" sortable>
-                        <template #body="{ data }">
-                            <div class="flex align-items-center gap-2">
-                                <i class="pi pi-database text-orange-500"></i>
-                                <span>{{ formatFileSize(data.fileSize) }}</span>
-                            </div>
-                        </template>
-                    </Column>
-
-                    <Column field="createdAt" header="Создан" sortable>
-                        <template #body="{ data }">
-                            <div class="flex flex-column">
-                                <div class="text-sm">{{ formatDateTime(data.createdAt) }}</div>
-                                <div class="text-xs text-600">{{ getTimeAgo(data.createdAt) }}</div>
-                            </div>
-                        </template>
-                    </Column>
-
-                    <Column header="Действия" :exportable="false" style="min-width: 120px">
-                        <template #body="{ data }">
-                            <div class="flex gap-1">
-                                <Button icon="pi pi-download" @click="handleDownload(data.id)" severity="success" text rounded :loading="downloadingReports.includes(data.id)" v-tooltip.top="'Скачать отчёт'" />
-                                <Button icon="pi pi-eye" @click="viewReport(data)" severity="info" text rounded v-tooltip.top="'Просмотреть детали'" />
-                                <Button icon="pi pi-trash" @click="confirmDelete(data)" severity="danger" text rounded v-tooltip.top="'Удалить отчёт'" />
-                            </div>
-                        </template>
-                    </Column>
-                </DataTable>
-            </div>
-        </div>
-    </div>
-
-    <!-- Диалог просмотра отчёта -->
-    <Dialog v-model:visible="showReportDialog" :header="selectedReport?.reportTitle" :modal="true" :style="{ width: '50vw' }" :maximizable="true">
-        <div v-if="selectedReport" class="flex flex-column gap-3">
-            <div class="grid">
-                <div class="col-6"><strong>Автор:</strong> {{ selectedReport.authorName }}</div>
-                <div class="col-6"><strong>Компания:</strong> {{ selectedReport.companyName }}</div>
-                <div class="col-6"><strong>Период:</strong> {{ formatDate(selectedReport.startDate) }} - {{ formatDate(selectedReport.endDate) }}</div>
-                <div class="col-6">
-                    <strong>Формат:</strong>
-                    <Tag :value="selectedReport.format" :severity="selectedReport.format === 'PDF' ? 'danger' : 'info'" />
-                </div>
-                <div class="col-6"><strong>Размер:</strong> {{ formatFileSize(selectedReport.fileSize) }}</div>
-                <div class="col-6"><strong>Создан:</strong> {{ formatDateTime(selectedReport.createdAt) }}</div>
-            </div>
-        </div>
-        <template #footer>
-            <Button label="Скачать" icon="pi pi-download" @click="handleDownload(selectedReport?.id)" severity="success" />
-            <Button label="Закрыть" icon="pi pi-times" @click="showReportDialog = false" severity="secondary" text />
-        </template>
-    </Dialog>
-
-    <!-- Диалог подтверждения удаления -->
-    <Dialog v-model:visible="showDeleteDialog" :header="'Удаление отчёта'" :modal="true" :style="{ width: '25vw' }">
-        <div class="flex align-items-center gap-3">
-            <i class="pi pi-exclamation-triangle text-orange-500 text-2xl"></i>
-            <span>Вы уверены, что хотите удалить этот отчёт? Это действие нельзя отменить.</span>
-        </div>
-        <template #footer>
-            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" severity="secondary" text />
-            <Button label="Удалить" icon="pi pi-trash" @click="handleDelete" severity="danger" />
-        </template>
-    </Dialog>
-</template>
-
 <script setup>
 import ReportService from '@/service/ReportService.js';
 import { useConfirm } from 'primevue/useconfirm';
@@ -439,6 +221,224 @@ onMounted(() => {
 });
 </script>
 
+<template>
+    <div class="grid">
+        <div class="col-12">
+            <div class="card">
+                <div class="flex justify-content-between align-items-center">
+                    <div>
+                        <h5>История отчётов</h5>
+                        <p>Просмотр и скачивание ранее созданных отчётов</p>
+                    </div>
+                    <div class="flex gap-2">
+                        <Button icon="pi pi-refresh" @click="loadReports" :loading="loading" severity="secondary" text v-tooltip.top="'Обновить список'" />
+                        <Button label="Создать отчёт" icon="pi pi-plus" @click="goToGenerator" severity="success" />
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Фильтры -->
+        <div class="col-12">
+            <div class="card">
+                <h6>Фильтры</h6>
+                <div class="grid">
+                    <div class="col-12 md:col-3">
+                        <div class="field">
+                            <label for="search">Поиск</label>
+                            <InputText id="search" v-model="filters.search" placeholder="Поиск по заголовку, автору или компании" @input="onSearch" />
+                        </div>
+                    </div>
+                    <div class="col-12 md:col-2">
+                        <div class="field">
+                            <label for="format">Формат</label>
+                            <Dropdown id="format" v-model="filters.format" :options="formatOptions" optionLabel="label" optionValue="value" placeholder="Все форматы" @change="applyFilters" />
+                        </div>
+                    </div>
+                    <div class="col-12 md:col-2">
+                        <div class="field">
+                            <label for="dateFrom">Дата с</label>
+                            <Calendar id="dateFrom" v-model="filters.dateFrom" dateFormat="dd.mm.yy" placeholder="Выберите дату" @date-select="applyFilters" />
+                        </div>
+                    </div>
+                    <div class="col-12 md:col-2">
+                        <div class="field">
+                            <label for="dateTo">Дата по</label>
+                            <Calendar id="dateTo" v-model="filters.dateTo" dateFormat="dd.mm.yy" placeholder="Выберите дату" @date-select="applyFilters" />
+                        </div>
+                    </div>
+                    <div class="col-12 md:col-3">
+                        <div class="field">
+                            <label>&nbsp;</label>
+                            <div class="flex gap-2">
+                                <Button label="Применить" icon="pi pi-filter" @click="applyFilters" severity="info" />
+                                <Button label="Сбросить" icon="pi pi-times" @click="resetFilters" severity="secondary" text />
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Статистика -->
+        <div class="col-12">
+            <div class="grid">
+                <div class="col-12 md:col-3">
+                    <div class="card text-center">
+                        <div class="text-2xl font-bold text-blue-500">{{ totalReports }}</div>
+                        <div class="text-sm text-600">Всего отчётов</div>
+                    </div>
+                </div>
+                <div class="col-12 md:col-3">
+                    <div class="card text-center">
+                        <div class="text-2xl font-bold text-green-500">{{ thisMonthReports }}</div>
+                        <div class="text-sm text-600">За этот месяц</div>
+                    </div>
+                </div>
+                <div class="col-12 md:col-3">
+                    <div class="card text-center">
+                        <div class="text-2xl font-bold text-orange-500">{{ thisWeekReports }}</div>
+                        <div class="text-sm text-600">За эту неделю</div>
+                    </div>
+                </div>
+                <div class="col-12 md:col-3">
+                    <div class="card text-center">
+                        <div class="text-2xl font-bold text-purple-500">{{ totalSize }}</div>
+                        <div class="text-sm text-600">Общий размер</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- Таблица отчётов -->
+        <div class="col-12">
+            <div class="card">
+                <DataTable
+                    :value="reports"
+                    :loading="loading"
+                    :paginator="true"
+                    :rows="pageSize"
+                    :totalRecords="totalElements"
+                    :lazy="true"
+                    @page="onPageChange"
+                    @sort="onSort"
+                    paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
+                    :rowsPerPageOptions="[10, 20, 50]"
+                    currentPageReportTemplate="Показано {first} - {last} из {totalRecords} записей"
+                    emptyMessage="Отчёты не найдены"
+                    responsiveLayout="scroll"
+                    :sortField="sortField"
+                    :sortOrder="sortOrder"
+                    removableSort
+                >
+                    <Column field="reportTitle" header="Заголовок" sortable>
+                        <template #body="{ data }">
+                            <div class="flex flex-column">
+                                <div class="font-semibold">{{ data.reportTitle }}</div>
+                                <div class="text-sm text-600" v-if="data.description">{{ data.description }}</div>
+                            </div>
+                        </template>
+                    </Column>
+
+                    <Column field="authorName" header="Автор" sortable>
+                        <template #body="{ data }">
+                            <div class="flex align-items-center gap-2">
+                                <i class="pi pi-user text-blue-500"></i>
+                                <span>{{ data.authorName }}</span>
+                            </div>
+                        </template>
+                    </Column>
+
+                    <Column field="companyName" header="Компания" sortable>
+                        <template #body="{ data }">
+                            <div class="flex align-items-center gap-2">
+                                <i class="pi pi-building text-green-500"></i>
+                                <span>{{ data.companyName }}</span>
+                            </div>
+                        </template>
+                    </Column>
+
+                    <Column field="startDate" header="Период" sortable>
+                        <template #body="{ data }">
+                            <div class="flex flex-column">
+                                <div class="text-sm">{{ formatDate(data.startDate) }}</div>
+                                <div class="text-sm text-600">по {{ formatDate(data.endDate) }}</div>
+                            </div>
+                        </template>
+                    </Column>
+
+                    <Column field="format" header="Формат" sortable>
+                        <template #body="{ data }">
+                            <Tag :value="data.format" :severity="data.format === 'PDF' ? 'danger' : 'info'" :icon="data.format === 'PDF' ? 'pi pi-file-pdf' : 'pi pi-file-word'" />
+                        </template>
+                    </Column>
+
+                    <Column field="fileSize" header="Размер" sortable>
+                        <template #body="{ data }">
+                            <div class="flex align-items-center gap-2">
+                                <i class="pi pi-database text-orange-500"></i>
+                                <span>{{ formatFileSize(data.fileSize) }}</span>
+                            </div>
+                        </template>
+                    </Column>
+
+                    <Column field="createdAt" header="Создан" sortable>
+                        <template #body="{ data }">
+                            <div class="flex flex-column">
+                                <div class="text-sm">{{ formatDateTime(data.createdAt) }}</div>
+                                <div class="text-xs text-600">{{ getTimeAgo(data.createdAt) }}</div>
+                            </div>
+                        </template>
+                    </Column>
+
+                    <Column header="Действия" :exportable="false" style="min-width: 120px">
+                        <template #body="{ data }">
+                            <div class="flex gap-1">
+                                <Button icon="pi pi-download" @click="handleDownload(data.id)" severity="success" text rounded :loading="downloadingReports.includes(data.id)" v-tooltip.top="'Скачать отчёт'" />
+                                <Button icon="pi pi-eye" @click="viewReport(data)" severity="info" text rounded v-tooltip.top="'Просмотреть детали'" />
+                                <Button icon="pi pi-trash" @click="confirmDelete(data)" severity="danger" text rounded v-tooltip.top="'Удалить отчёт'" />
+                            </div>
+                        </template>
+                    </Column>
+                </DataTable>
+            </div>
+        </div>
+    </div>
+
+    <!-- Диалог просмотра отчёта -->
+    <Dialog v-model:visible="showReportDialog" :header="selectedReport?.reportTitle" :modal="true" :style="{ width: '50vw' }" :maximizable="true">
+        <div v-if="selectedReport" class="flex flex-column gap-3">
+            <div class="grid">
+                <div class="col-6"><strong>Автор:</strong> {{ selectedReport.authorName }}</div>
+                <div class="col-6"><strong>Компания:</strong> {{ selectedReport.companyName }}</div>
+                <div class="col-6"><strong>Период:</strong> {{ formatDate(selectedReport.startDate) }} - {{ formatDate(selectedReport.endDate) }}</div>
+                <div class="col-6">
+                    <strong>Формат:</strong>
+                    <Tag :value="selectedReport.format" :severity="selectedReport.format === 'PDF' ? 'danger' : 'info'" />
+                </div>
+                <div class="col-6"><strong>Размер:</strong> {{ formatFileSize(selectedReport.fileSize) }}</div>
+                <div class="col-6"><strong>Создан:</strong> {{ formatDateTime(selectedReport.createdAt) }}</div>
+            </div>
+        </div>
+        <template #footer>
+            <Button label="Скачать" icon="pi pi-download" @click="handleDownload(selectedReport?.id)" severity="success" />
+            <Button label="Закрыть" icon="pi pi-times" @click="showReportDialog = false" severity="secondary" text />
+        </template>
+    </Dialog>
+
+    <!-- Диалог подтверждения удаления -->
+    <Dialog v-model:visible="showDeleteDialog" :header="'Удаление отчёта'" :modal="true" :style="{ width: '25vw' }">
+        <div class="flex align-items-center gap-3">
+            <i class="pi pi-exclamation-triangle text-orange-500 text-2xl"></i>
+            <span>Вы уверены, что хотите удалить этот отчёт? Это действие нельзя отменить.</span>
+        </div>
+        <template #footer>
+            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" severity="secondary" text />
+            <Button label="Удалить" icon="pi pi-trash" @click="handleDelete" severity="danger" />
+        </template>
+    </Dialog>
+</template>
+
 <style scoped>
 .p-fluid .field {
     margin-bottom: 1rem;
diff --git a/src/views/reports/ReportManager.vue b/src/views/reports/ReportManager.vue
index 61d8ff1..f7b0ff2 100644
--- a/src/views/reports/ReportManager.vue
+++ b/src/views/reports/ReportManager.vue
@@ -1,138 +1,3 @@
-<template>
-    <div class="grid">
-        <div class="col-12">
-            <div class="card">
-                <h5>Генерация отчётов</h5>
-                <p>Создайте новый отчёт с помощью AI-исследования по выбранной теме.</p>
-            </div>
-        </div>
-
-        <!-- Форма генерации отчёта -->
-        <div class="col-12 lg:col-6">
-            <div class="card">
-                <h5>Создать новый отчёт</h5>
-                <form @submit.prevent="handleGenerate" class="p-fluid">
-                    <div class="field">
-                        <label for="query">Тема исследования *</label>
-                        <InputText id="query" v-model="formData.query" :class="{ 'p-invalid': errors.query }" placeholder="Введите тему для исследования" />
-                        <small v-if="errors.query" class="p-error">{{ errors.query }}</small>
-                    </div>
-
-                    <div class="field">
-                        <label for="lang">Язык отчёта</label>
-                        <Dropdown id="lang" v-model="formData.lang" :options="langOptions" optionLabel="label" optionValue="value" placeholder="Выберите язык" />
-                    </div>
-
-                    <div class="field">
-                        <label for="report_type">Тип отчёта</label>
-                        <Dropdown id="report_type" v-model="formData.report_type" :options="reportTypeOptions" optionLabel="label" optionValue="value" placeholder="Выберите тип" />
-                    </div>
-
-                    <div class="field">
-                        <label for="depth">Глубина исследования: {{ formData.depth }}</label>
-                        <Slider id="depth" v-model.number="formData.depth" :min="1" :max="5" :step="1" :disabled="false" />
-                    </div>
-
-                    <div class="field">
-                        <label for="breadth">Широта исследования: {{ formData.breadth }}</label>
-                        <Slider id="breadth" v-model.number="formData.breadth" :min="2" :max="10" :step="1" :disabled="false" />
-                    </div>
-
-                    <div class="field">
-                        <Button type="submit" label="Сгенерировать отчёт" icon="pi pi-file-pdf" :loading="loading" :disabled="loading" class="w-full" />
-                    </div>
-                </form>
-            </div>
-        </div>
-
-        <!-- Статистика -->
-        <div class="col-12 lg:col-6">
-            <div class="card">
-                <h5>Статистика отчётов</h5>
-                <div class="grid">
-                    <div class="col-6">
-                        <div class="text-center">
-                            <div class="text-2xl font-bold text-blue-500">{{ totalReports }}</div>
-                            <div class="text-sm text-600">Всего отчётов</div>
-                        </div>
-                    </div>
-                    <div class="col-6">
-                        <div class="text-center">
-                            <div class="text-2xl font-bold text-green-500">{{ thisMonthReports }}</div>
-                            <div class="text-sm text-600">За этот месяц</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <!-- История отчётов -->
-        <div class="col-12">
-            <div class="card">
-                <div class="flex justify-content-between align-items-center mb-3">
-                    <h5>История отчётов</h5>
-                    <Button icon="pi pi-refresh" @click="loadReports" :loading="loading" severity="secondary" text />
-                </div>
-
-                <DataTable
-                    :value="reports"
-                    :loading="loading"
-                    :paginator="true"
-                    :rows="pageSize"
-                    :totalRecords="totalElements"
-                    :lazy="true"
-                    @page="onPageChange"
-                    paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
-                    :rowsPerPageOptions="[10, 20, 50]"
-                    currentPageReportTemplate="Показано {first} - {last} из {totalRecords} записей"
-                    emptyMessage="Отчёты не найдены"
-                    responsiveLayout="scroll"
-                >
-                    <Column field="reportTitle" header="Заголовок" sortable>
-                        <template #body="{ data }">
-                            <div class="font-semibold">{{ data.reportTitle }}</div>
-                        </template>
-                    </Column>
-
-                    <Column field="authorName" header="Автор" sortable></Column>
-
-                    <Column field="companyName" header="Компания" sortable></Column>
-
-                    <Column field="startDate" header="Период" sortable>
-                        <template #body="{ data }">
-                            <div>{{ formatDate(data.startDate) }} - {{ formatDate(data.endDate) }}</div>
-                        </template>
-                    </Column>
-
-                    <Column field="format" header="Формат" sortable>
-                        <template #body="{ data }">
-                            <Tag :value="data.format" :severity="data.format === 'PDF' ? 'danger' : 'info'" />
-                        </template>
-                    </Column>
-
-                    <Column field="fileSize" header="Размер" sortable>
-                        <template #body="{ data }">
-                            {{ formatFileSize(data.fileSize) }}
-                        </template>
-                    </Column>
-
-                    <Column field="createdAt" header="Создан" sortable>
-                        <template #body="{ data }">
-                            {{ formatDateTime(data.createdAt) }}
-                        </template>
-                    </Column>
-
-                    <Column header="Действия" :exportable="false">
-                        <template #body="{ data }">
-                            <Button icon="pi pi-download" @click="handleDownload(data.id)" severity="success" text rounded :loading="downloadingReports.includes(data.id)" />
-                        </template>
-                    </Column>
-                </DataTable>
-            </div>
-        </div>
-    </div>
-</template>
-
 <script setup>
 import ReportService from '@/service/ReportService.js';
 import { useToast } from 'primevue/usetoast';
@@ -344,6 +209,141 @@ onMounted(() => {
 });
 </script>
 
+<template>
+    <div class="grid">
+        <div class="col-12">
+            <div class="card">
+                <h5>Генерация отчётов</h5>
+                <p>Создайте новый отчёт с помощью AI-исследования по выбранной теме.</p>
+            </div>
+        </div>
+
+        <!-- Форма генерации отчёта -->
+        <div class="col-12 lg:col-6">
+            <div class="card">
+                <h5>Создать новый отчёт</h5>
+                <form @submit.prevent="handleGenerate" class="p-fluid">
+                    <div class="field">
+                        <label for="query">Тема исследования *</label>
+                        <InputText id="query" v-model="formData.query" :class="{ 'p-invalid': errors.query }" placeholder="Введите тему для исследования" />
+                        <small v-if="errors.query" class="p-error">{{ errors.query }}</small>
+                    </div>
+
+                    <div class="field">
+                        <label for="lang">Язык отчёта</label>
+                        <Dropdown id="lang" v-model="formData.lang" :options="langOptions" optionLabel="label" optionValue="value" placeholder="Выберите язык" />
+                    </div>
+
+                    <div class="field">
+                        <label for="report_type">Тип отчёта</label>
+                        <Dropdown id="report_type" v-model="formData.report_type" :options="reportTypeOptions" optionLabel="label" optionValue="value" placeholder="Выберите тип" />
+                    </div>
+
+                    <div class="field">
+                        <label for="depth">Глубина исследования: {{ formData.depth }}</label>
+                        <Slider id="depth" v-model.number="formData.depth" :min="1" :max="5" :step="1" :disabled="false" />
+                    </div>
+
+                    <div class="field">
+                        <label for="breadth">Широта исследования: {{ formData.breadth }}</label>
+                        <Slider id="breadth" v-model.number="formData.breadth" :min="2" :max="10" :step="1" :disabled="false" />
+                    </div>
+
+                    <div class="field">
+                        <Button type="submit" label="Сгенерировать отчёт" icon="pi pi-file-pdf" :loading="loading" :disabled="loading" class="w-full" />
+                    </div>
+                </form>
+            </div>
+        </div>
+
+        <!-- Статистика -->
+        <div class="col-12 lg:col-6">
+            <div class="card">
+                <h5>Статистика отчётов</h5>
+                <div class="grid">
+                    <div class="col-6">
+                        <div class="text-center">
+                            <div class="text-2xl font-bold text-blue-500">{{ totalReports }}</div>
+                            <div class="text-sm text-600">Всего отчётов</div>
+                        </div>
+                    </div>
+                    <div class="col-6">
+                        <div class="text-center">
+                            <div class="text-2xl font-bold text-green-500">{{ thisMonthReports }}</div>
+                            <div class="text-sm text-600">За этот месяц</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!-- История отчётов -->
+        <div class="col-12">
+            <div class="card">
+                <div class="flex justify-content-between align-items-center mb-3">
+                    <h5>История отчётов</h5>
+                    <Button icon="pi pi-refresh" @click="loadReports" :loading="loading" severity="secondary" text />
+                </div>
+
+                <DataTable
+                    :value="reports"
+                    :loading="loading"
+                    :paginator="true"
+                    :rows="pageSize"
+                    :totalRecords="totalElements"
+                    :lazy="true"
+                    @page="onPageChange"
+                    paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
+                    :rowsPerPageOptions="[10, 20, 50]"
+                    currentPageReportTemplate="Показано {first} - {last} из {totalRecords} записей"
+                    emptyMessage="Отчёты не найдены"
+                    responsiveLayout="scroll"
+                >
+                    <Column field="reportTitle" header="Заголовок" sortable>
+                        <template #body="{ data }">
+                            <div class="font-semibold">{{ data.reportTitle }}</div>
+                        </template>
+                    </Column>
+
+                    <Column field="authorName" header="Автор" sortable></Column>
+
+                    <Column field="companyName" header="Компания" sortable></Column>
+
+                    <Column field="startDate" header="Период" sortable>
+                        <template #body="{ data }">
+                            <div>{{ formatDate(data.startDate) }} - {{ formatDate(data.endDate) }}</div>
+                        </template>
+                    </Column>
+
+                    <Column field="format" header="Формат" sortable>
+                        <template #body="{ data }">
+                            <Tag :value="data.format" :severity="data.format === 'PDF' ? 'danger' : 'info'" />
+                        </template>
+                    </Column>
+
+                    <Column field="fileSize" header="Размер" sortable>
+                        <template #body="{ data }">
+                            {{ formatFileSize(data.fileSize) }}
+                        </template>
+                    </Column>
+
+                    <Column field="createdAt" header="Создан" sortable>
+                        <template #body="{ data }">
+                            {{ formatDateTime(data.createdAt) }}
+                        </template>
+                    </Column>
+
+                    <Column header="Действия" :exportable="false">
+                        <template #body="{ data }">
+                            <Button icon="pi pi-download" @click="handleDownload(data.id)" severity="success" text rounded :loading="downloadingReports.includes(data.id)" />
+                        </template>
+                    </Column>
+                </DataTable>
+            </div>
+        </div>
+    </div>
+</template>
+
 <style scoped>
 .p-fluid .field {
     margin-bottom: 1rem;
diff --git a/src/views/smm/AnalyticsDashboard.vue b/src/views/smm/AnalyticsDashboard.vue
index d964d2f..457659b 100644
--- a/src/views/smm/AnalyticsDashboard.vue
+++ b/src/views/smm/AnalyticsDashboard.vue
@@ -1,3 +1,108 @@
+<script>
+import AnalyticsService from '@/service/AnalyticsService.js';
+import { ChannelType } from '@/types/smm.js';
+import { useToast } from 'primevue/usetoast';
+import { onMounted, ref } from 'vue';
+
+export default {
+    name: 'AnalyticsDashboard',
+    setup() {
+        const toast = useToast();
+
+        // Reactive data
+        const systemStats = ref({});
+        const publishingStats = ref({});
+        const collecting = ref(false);
+
+        // Methods
+        const loadAnalytics = async () => {
+            try {
+                const [systemStatsData, publishingStatsData] = await Promise.all([AnalyticsService.getSystemStats(), AnalyticsService.getPublishingStats()]);
+
+                systemStats.value = systemStatsData;
+                publishingStats.value = publishingStatsData;
+            } catch (error) {
+                toast.add({
+                    severity: 'error',
+                    summary: 'Ошибка',
+                    detail: 'Не удалось загрузить аналитику: ' + error.message,
+                    life: 3000
+                });
+            }
+        };
+
+        const collectAnalytics = async () => {
+            collecting.value = true;
+            try {
+                await AnalyticsService.collectAnalytics();
+                toast.add({
+                    severity: 'success',
+                    summary: 'Успех',
+                    detail: 'Сбор аналитики запущен',
+                    life: 3000
+                });
+                // Перезагружаем данные после сбора
+                setTimeout(() => {
+                    loadAnalytics();
+                }, 2000);
+            } catch (error) {
+                toast.add({
+                    severity: 'error',
+                    summary: 'Ошибка',
+                    detail: 'Не удалось запустить сбор аналитики: ' + error.message,
+                    life: 3000
+                });
+            } finally {
+                collecting.value = false;
+            }
+        };
+
+        const formatCurrency = (value) => {
+            return new Intl.NumberFormat('ru-RU', {
+                style: 'currency',
+                currency: 'KZT'
+            }).format(value || 0);
+        };
+
+        const formatDateTime = (dateString) => {
+            if (!dateString) return 'Не определено';
+            return new Date(dateString).toLocaleString('ru-RU', {
+                year: 'numeric',
+                month: 'short',
+                day: 'numeric',
+                hour: '2-digit',
+                minute: '2-digit'
+            });
+        };
+
+        const getChannelTypeLabel = (type) => {
+            const labels = {
+                [ChannelType.TELEGRAM]: 'Telegram',
+                [ChannelType.VK]: 'VK',
+                [ChannelType.INSTAGRAM]: 'Instagram'
+            };
+            return labels[type] || type;
+        };
+
+        // Lifecycle
+        onMounted(() => {
+            loadAnalytics();
+        });
+
+        return {
+            systemStats,
+            publishingStats,
+            collecting,
+            loadAnalytics,
+            collectAnalytics,
+            formatCurrency,
+            formatDateTime,
+            getChannelTypeLabel
+        };
+    }
+};
+</script>
+
 <template>
     <div class="analytics-dashboard">
         <!-- Заголовок с кнопкой сбора аналитики -->
@@ -187,111 +292,6 @@
     </div>
 </template>
 
-<script>
-import AnalyticsService from '@/service/AnalyticsService.js';
-import { ChannelType } from '@/types/smm.js';
-import { useToast } from 'primevue/usetoast';
-import { onMounted, ref } from 'vue';
-
-export default {
-    name: 'AnalyticsDashboard',
-    setup() {
-        const toast = useToast();
-
-        // Reactive data
-        const systemStats = ref({});
-        const publishingStats = ref({});
-        const collecting = ref(false);
-
-        // Methods
-        const loadAnalytics = async () => {
-            try {
-                const [systemStatsData, publishingStatsData] = await Promise.all([AnalyticsService.getSystemStats(), AnalyticsService.getPublishingStats()]);
-
-                systemStats.value = systemStatsData;
-                publishingStats.value = publishingStatsData;
-            } catch (error) {
-                toast.add({
-                    severity: 'error',
-                    summary: 'Ошибка',
-                    detail: 'Не удалось загрузить аналитику: ' + error.message,
-                    life: 3000
-                });
-            }
-        };
-
-        const collectAnalytics = async () => {
-            collecting.value = true;
-            try {
-                await AnalyticsService.collectAnalytics();
-                toast.add({
-                    severity: 'success',
-                    summary: 'Успех',
-                    detail: 'Сбор аналитики запущен',
-                    life: 3000
-                });
-                // Перезагружаем данные после сбора
-                setTimeout(() => {
-                    loadAnalytics();
-                }, 2000);
-            } catch (error) {
-                toast.add({
-                    severity: 'error',
-                    summary: 'Ошибка',
-                    detail: 'Не удалось запустить сбор аналитики: ' + error.message,
-                    life: 3000
-                });
-            } finally {
-                collecting.value = false;
-            }
-        };
-
-        const formatCurrency = (value) => {
-            return new Intl.NumberFormat('ru-RU', {
-                style: 'currency',
-                currency: 'KZT'
-            }).format(value || 0);
-        };
-
-        const formatDateTime = (dateString) => {
-            if (!dateString) return 'Не определено';
-            return new Date(dateString).toLocaleString('ru-RU', {
-                year: 'numeric',
-                month: 'short',
-                day: 'numeric',
-                hour: '2-digit',
-                minute: '2-digit'
-            });
-        };
-
-        const getChannelTypeLabel = (type) => {
-            const labels = {
-                [ChannelType.TELEGRAM]: 'Telegram',
-                [ChannelType.VK]: 'VK',
-                [ChannelType.INSTAGRAM]: 'Instagram'
-            };
-            return labels[type] || type;
-        };
-
-        // Lifecycle
-        onMounted(() => {
-            loadAnalytics();
-        });
-
-        return {
-            systemStats,
-            publishingStats,
-            collecting,
-            loadAnalytics,
-            collectAnalytics,
-            formatCurrency,
-            formatDateTime,
-            getChannelTypeLabel
-        };
-    }
-};
-</script>
-
 <style scoped>
 .analytics-dashboard {
     padding: 1rem;
diff --git a/src/views/smm/CampaignList.vue b/src/views/smm/CampaignList.vue
index 27d4a81..ccdb1db 100644
--- a/src/views/smm/CampaignList.vue
+++ b/src/views/smm/CampaignList.vue
@@ -1,138 +1,3 @@
-<template>
-    <div class="card">
-        <div class="card-header">
-            <h5>Управление кампаниями</h5>
-            <Button icon="pi pi-plus" label="Создать кампанию" @click="showCreateDialog = true" class="p-button-success" />
-        </div>
-        <div class="card-content">
-            <DataTable
-                :value="campaigns"
-                :loading="loading"
-                paginator
-                :rows="10"
-                :rowsPerPageOptions="[5, 10, 20]"
-                sortMode="multiple"
-                removableSort
-                filterDisplay="row"
-                :globalFilterFields="['name', 'goal', 'status']"
-                v-model:filters="filters"
-                :filters="filters"
-            >
-                <template #header>
-                    <div class="flex justify-content-between">
-                        <span class="p-input-icon-left">
-                            <i class="pi pi-search" />
-                            <InputText v-model="filters['global'].value" placeholder="Поиск кампаний..." />
-                        </span>
-                    </div>
-                </template>
-
-                <Column field="name" header="Название" :sortable="true">
-                    <template #body="slotProps">
-                        <span class="font-semibold">{{ slotProps.data.name }}</span>
-                    </template>
-                </Column>
-
-                <Column field="goal" header="Цель" :sortable="true">
-                    <template #body="slotProps">
-                        <span>{{ slotProps.data.goal }}</span>
-                    </template>
-                </Column>
-
-                <Column field="budget" header="Бюджет" :sortable="true">
-                    <template #body="slotProps">
-                        <span class="font-semibold text-green-600">
-                            {{ formatCurrency(slotProps.data.budget) }}
-                        </span>
-                    </template>
-                </Column>
-
-                <Column field="startAt" header="Начало" :sortable="true">
-                    <template #body="slotProps">
-                        <span>{{ formatDate(slotProps.data.startAt) }}</span>
-                    </template>
-                </Column>
-
-                <Column field="endAt" header="Окончание" :sortable="true">
-                    <template #body="slotProps">
-                        <span>{{ formatDate(slotProps.data.endAt) }}</span>
-                    </template>
-                </Column>
-
-                <Column field="status" header="Статус" :sortable="true">
-                    <template #body="slotProps">
-                        <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
-                    </template>
-                </Column>
-
-                <Column header="Действия" :exportable="false">
-                    <template #body="slotProps">
-                        <div class="flex gap-2">
-                            <Button icon="pi pi-pencil" class="p-button-rounded p-button-text p-button-sm" @click="editCampaign(slotProps.data)" v-tooltip.top="'Редактировать'" />
-                            <Button icon="pi pi-trash" class="p-button-rounded p-button-text p-button-danger p-button-sm" @click="confirmDelete(slotProps.data)" v-tooltip.top="'Удалить'" />
-                        </div>
-                    </template>
-                </Column>
-            </DataTable>
-        </div>
-    </div>
-
-    <!-- Диалог создания/редактирования кампании -->
-    <Dialog v-model:visible="showCreateDialog" :header="editingCampaign ? 'Редактировать кампанию' : 'Создать кампанию'" :modal="true" :style="{ width: '50vw' }" :closable="false">
-        <div class="p-fluid">
-            <div class="field">
-                <label for="name">Название кампании *</label>
-                <InputText id="name" v-model="campaignForm.name" :class="{ 'p-invalid': !campaignForm.name }" />
-                <small v-if="!campaignForm.name" class="p-error">Название обязательно</small>
-            </div>
-
-            <div class="field">
-                <label for="goal">Цель кампании</label>
-                <Textarea id="goal" v-model="campaignForm.goal" rows="3" />
-            </div>
-
-            <div class="field">
-                <label for="budget">Бюджет</label>
-                <InputNumber id="budget" v-model="campaignForm.budget" mode="currency" currency="KZT" locale="ru-RU" :min="0" />
-            </div>
-
-            <div class="grid">
-                <div class="col-6">
-                    <div class="field">
-                        <label for="startAt">Дата начала</label>
-                        <Calendar id="startAt" v-model="campaignForm.startAt" dateFormat="yy-mm-dd" showTime hourFormat="24" />
-                    </div>
-                </div>
-                <div class="col-6">
-                    <div class="field">
-                        <label for="endAt">Дата окончания</label>
-                        <Calendar id="endAt" v-model="campaignForm.endAt" dateFormat="yy-mm-dd" showTime hourFormat="24" />
-                    </div>
-                </div>
-            </div>
-
-            <div class="field">
-                <label for="status">Статус</label>
-                <Dropdown id="status" v-model="campaignForm.status" :options="statusOptions" optionLabel="label" optionValue="value" />
-            </div>
-        </div>
-
-        <template #footer>
-            <Button label="Отмена" icon="pi pi-times" @click="cancelEdit" class="p-button-text" />
-            <Button :label="editingCampaign ? 'Обновить' : 'Создать'" icon="pi pi-check" @click="saveCampaign" :loading="saving" />
-        </template>
-    </Dialog>
-
-    <!-- Диалог подтверждения удаления -->
-    <Dialog v-model:visible="showDeleteDialog" header="Подтверждение удаления" :modal="true" :style="{ width: '25vw' }">
-        <p>Вы уверены, что хотите удалить кампанию "{{ campaignToDelete?.name }}"?</p>
-        <template #footer>
-            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" class="p-button-text" />
-            <Button label="Удалить" icon="pi pi-trash" @click="deleteCampaign" class="p-button-danger" :loading="deleting" />
-        </template>
-    </Dialog>
-</template>
-
 <script>
 import CampaignService from '@/service/CampaignService.js';
 import { CampaignStatus } from '@/types/smm.js';
@@ -367,6 +232,141 @@ export default {
 };
 </script>
 
+<template>
+    <div class="card">
+        <div class="card-header">
+            <h5>Управление кампаниями</h5>
+            <Button icon="pi pi-plus" label="Создать кампанию" @click="showCreateDialog = true" class="p-button-success" />
+        </div>
+        <div class="card-content">
+            <DataTable
+                :value="campaigns"
+                :loading="loading"
+                paginator
+                :rows="10"
+                :rowsPerPageOptions="[5, 10, 20]"
+                sortMode="multiple"
+                removableSort
+                filterDisplay="row"
+                :globalFilterFields="['name', 'goal', 'status']"
+                v-model:filters="filters"
+                :filters="filters"
+            >
+                <template #header>
+                    <div class="flex justify-content-between">
+                        <span class="p-input-icon-left">
+                            <i class="pi pi-search" />
+                            <InputText v-model="filters['global'].value" placeholder="Поиск кампаний..." />
+                        </span>
+                    </div>
+                </template>
+
+                <Column field="name" header="Название" :sortable="true">
+                    <template #body="slotProps">
+                        <span class="font-semibold">{{ slotProps.data.name }}</span>
+                    </template>
+                </Column>
+
+                <Column field="goal" header="Цель" :sortable="true">
+                    <template #body="slotProps">
+                        <span>{{ slotProps.data.goal }}</span>
+                    </template>
+                </Column>
+
+                <Column field="budget" header="Бюджет" :sortable="true">
+                    <template #body="slotProps">
+                        <span class="font-semibold text-green-600">
+                            {{ formatCurrency(slotProps.data.budget) }}
+                        </span>
+                    </template>
+                </Column>
+
+                <Column field="startAt" header="Начало" :sortable="true">
+                    <template #body="slotProps">
+                        <span>{{ formatDate(slotProps.data.startAt) }}</span>
+                    </template>
+                </Column>
+
+                <Column field="endAt" header="Окончание" :sortable="true">
+                    <template #body="slotProps">
+                        <span>{{ formatDate(slotProps.data.endAt) }}</span>
+                    </template>
+                </Column>
+
+                <Column field="status" header="Статус" :sortable="true">
+                    <template #body="slotProps">
+                        <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
+                    </template>
+                </Column>
+
+                <Column header="Действия" :exportable="false">
+                    <template #body="slotProps">
+                        <div class="flex gap-2">
+                            <Button icon="pi pi-pencil" class="p-button-rounded p-button-text p-button-sm" @click="editCampaign(slotProps.data)" v-tooltip.top="'Редактировать'" />
+                            <Button icon="pi pi-trash" class="p-button-rounded p-button-text p-button-danger p-button-sm" @click="confirmDelete(slotProps.data)" v-tooltip.top="'Удалить'" />
+                        </div>
+                    </template>
+                </Column>
+            </DataTable>
+        </div>
+    </div>
+
+    <!-- Диалог создания/редактирования кампании -->
+    <Dialog v-model:visible="showCreateDialog" :header="editingCampaign ? 'Редактировать кампанию' : 'Создать кампанию'" :modal="true" :style="{ width: '50vw' }" :closable="false">
+        <div class="p-fluid">
+            <div class="field">
+                <label for="name">Название кампании *</label>
+                <InputText id="name" v-model="campaignForm.name" :class="{ 'p-invalid': !campaignForm.name }" />
+                <small v-if="!campaignForm.name" class="p-error">Название обязательно</small>
+            </div>
+
+            <div class="field">
+                <label for="goal">Цель кампании</label>
+                <Textarea id="goal" v-model="campaignForm.goal" rows="3" />
+            </div>
+
+            <div class="field">
+                <label for="budget">Бюджет</label>
+                <InputNumber id="budget" v-model="campaignForm.budget" mode="currency" currency="KZT" locale="ru-RU" :min="0" />
+            </div>
+
+            <div class="grid">
+                <div class="col-6">
+                    <div class="field">
+                        <label for="startAt">Дата начала</label>
+                        <Calendar id="startAt" v-model="campaignForm.startAt" dateFormat="yy-mm-dd" showTime hourFormat="24" />
+                    </div>
+                </div>
+                <div class="col-6">
+                    <div class="field">
+                        <label for="endAt">Дата окончания</label>
+                        <Calendar id="endAt" v-model="campaignForm.endAt" dateFormat="yy-mm-dd" showTime hourFormat="24" />
+                    </div>
+                </div>
+            </div>
+
+            <div class="field">
+                <label for="status">Статус</label>
+                <Dropdown id="status" v-model="campaignForm.status" :options="statusOptions" optionLabel="label" optionValue="value" />
+            </div>
+        </div>
+
+        <template #footer>
+            <Button label="Отмена" icon="pi pi-times" @click="cancelEdit" class="p-button-text" />
+            <Button :label="editingCampaign ? 'Обновить' : 'Создать'" icon="pi pi-check" @click="saveCampaign" :loading="saving" />
+        </template>
+    </Dialog>
+
+    <!-- Диалог подтверждения удаления -->
+    <Dialog v-model:visible="showDeleteDialog" header="Подтверждение удаления" :modal="true" :style="{ width: '25vw' }">
+        <p>Вы уверены, что хотите удалить кампанию "{{ campaignToDelete?.name }}"?</p>
+        <template #footer>
+            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" class="p-button-text" />
+            <Button label="Удалить" icon="pi pi-trash" @click="deleteCampaign" class="p-button-danger" :loading="deleting" />
+        </template>
+    </Dialog>
+</template>
+
 <style scoped>
 .card {
     background: var(--surface-card);
diff --git a/src/views/smm/ChannelList.vue b/src/views/smm/ChannelList.vue
index a2b2d93..cde59bf 100644
--- a/src/views/smm/ChannelList.vue
+++ b/src/views/smm/ChannelList.vue
@@ -1,114 +1,3 @@
-<template>
-    <div class="card">
-        <div class="card-header">
-            <h5>Управление каналами</h5>
-            <Button icon="pi pi-plus" label="Создать канал" @click="showCreateDialog = true" class="p-button-success" />
-        </div>
-        <div class="card-content">
-            <DataTable
-                :value="channels"
-                :loading="loading"
-                paginator
-                :rows="10"
-                :rowsPerPageOptions="[5, 10, 20]"
-                sortMode="multiple"
-                removableSort
-                filterDisplay="row"
-                :globalFilterFields="['name', 'type']"
-                v-model:filters="filters"
-                :filters="filters"
-            >
-                <template #header>
-                    <div class="flex justify-content-between">
-                        <span class="p-input-icon-left">
-                            <i class="pi pi-search" />
-                            <InputText v-model="filters['global'].value" placeholder="Поиск каналов..." />
-                        </span>
-                    </div>
-                </template>
-
-                <Column field="name" header="Название" :sortable="true">
-                    <template #body="slotProps">
-                        <span class="font-semibold">{{ slotProps.data.name }}</span>
-                    </template>
-                </Column>
-
-                <Column field="type" header="Тип" :sortable="true">
-                    <template #body="slotProps">
-                        <Tag :value="getTypeLabel(slotProps.data.type)" :severity="getTypeSeverity(slotProps.data.type)" />
-                    </template>
-                </Column>
-
-                <Column field="apiKeyRef" header="API Ключ" :sortable="true">
-                    <template #body="slotProps">
-                        <span class="font-mono text-sm">{{ slotProps.data.apiKeyRef }}</span>
-                    </template>
-                </Column>
-
-                <Column field="isActive" header="Статус" :sortable="true">
-                    <template #body="slotProps">
-                        <Tag :value="slotProps.data.isActive ? 'Активен' : 'Неактивен'" :severity="slotProps.data.isActive ? 'success' : 'danger'" />
-                    </template>
-                </Column>
-
-                <Column header="Действия" :exportable="false">
-                    <template #body="slotProps">
-                        <div class="flex gap-2">
-                            <Button icon="pi pi-pencil" class="p-button-rounded p-button-text p-button-sm" @click="editChannel(slotProps.data)" v-tooltip.top="'Редактировать'" />
-                            <Button icon="pi pi-trash" class="p-button-rounded p-button-text p-button-danger p-button-sm" @click="confirmDelete(slotProps.data)" v-tooltip.top="'Удалить'" />
-                        </div>
-                    </template>
-                </Column>
-            </DataTable>
-        </div>
-    </div>
-
-    <!-- Диалог создания/редактирования канала -->
-    <Dialog v-model:visible="showCreateDialog" :header="editingChannel ? 'Редактировать канал' : 'Создать канал'" :modal="true" :style="{ width: '50vw' }" :closable="false">
-        <div class="p-fluid">
-            <div class="field">
-                <label for="name">Название канала *</label>
-                <InputText id="name" v-model="channelForm.name" :class="{ 'p-invalid': !channelForm.name }" />
-                <small v-if="!channelForm.name" class="p-error">Название обязательно</small>
-            </div>
-
-            <div class="field">
-                <label for="type">Тип канала *</label>
-                <Dropdown id="type" v-model="channelForm.type" :options="typeOptions" optionLabel="label" optionValue="value" :class="{ 'p-invalid': !channelForm.type }" />
-                <small v-if="!channelForm.type" class="p-error">Тип канала обязателен</small>
-            </div>
-
-            <div class="field">
-                <label for="apiKeyRef">API Ключ *</label>
-                <InputText id="apiKeyRef" v-model="channelForm.apiKeyRef" :class="{ 'p-invalid': !channelForm.apiKeyRef }" />
-                <small v-if="!channelForm.apiKeyRef" class="p-error">API ключ обязателен</small>
-                <small class="text-600">Ссылка на API ключ в системе</small>
-            </div>
-
-            <div class="field">
-                <div class="flex align-items-center">
-                    <Checkbox id="isActive" v-model="channelForm.isActive" :binary="true" />
-                    <label for="isActive" class="ml-2">Канал активен</label>
-                </div>
-            </div>
-        </div>
-
-        <template #footer>
-            <Button label="Отмена" icon="pi pi-times" @click="cancelEdit" class="p-button-text" />
-            <Button :label="editingChannel ? 'Обновить' : 'Создать'" icon="pi pi-check" @click="saveChannel" :loading="saving" />
-        </template>
-    </Dialog>
-
-    <!-- Диалог подтверждения удаления -->
-    <Dialog v-model:visible="showDeleteDialog" header="Подтверждение удаления" :modal="true" :style="{ width: '25vw' }">
-        <p>Вы уверены, что хотите удалить канал "{{ channelToDelete?.name }}"?</p>
-        <template #footer>
-            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" class="p-button-text" />
-            <Button label="Удалить" icon="pi pi-trash" @click="deleteChannel" class="p-button-danger" :loading="deleting" />
-        </template>
-    </Dialog>
-</template>
-
 <script>
 import ChannelService from '@/service/ChannelService.js';
 import { ChannelType } from '@/types/smm.js';
@@ -311,6 +200,117 @@ export default {
 };
 </script>
 
+<template>
+    <div class="card">
+        <div class="card-header">
+            <h5>Управление каналами</h5>
+            <Button icon="pi pi-plus" label="Создать канал" @click="showCreateDialog = true" class="p-button-success" />
+        </div>
+        <div class="card-content">
+            <DataTable
+                :value="channels"
+                :loading="loading"
+                paginator
+                :rows="10"
+                :rowsPerPageOptions="[5, 10, 20]"
+                sortMode="multiple"
+                removableSort
+                filterDisplay="row"
+                :globalFilterFields="['name', 'type']"
+                v-model:filters="filters"
+                :filters="filters"
+            >
+                <template #header>
+                    <div class="flex justify-content-between">
+                        <span class="p-input-icon-left">
+                            <i class="pi pi-search" />
+                            <InputText v-model="filters['global'].value" placeholder="Поиск каналов..." />
+                        </span>
+                    </div>
+                </template>
+
+                <Column field="name" header="Название" :sortable="true">
+                    <template #body="slotProps">
+                        <span class="font-semibold">{{ slotProps.data.name }}</span>
+                    </template>
+                </Column>
+
+                <Column field="type" header="Тип" :sortable="true">
+                    <template #body="slotProps">
+                        <Tag :value="getTypeLabel(slotProps.data.type)" :severity="getTypeSeverity(slotProps.data.type)" />
+                    </template>
+                </Column>
+
+                <Column field="apiKeyRef" header="API Ключ" :sortable="true">
+                    <template #body="slotProps">
+                        <span class="font-mono text-sm">{{ slotProps.data.apiKeyRef }}</span>
+                    </template>
+                </Column>
+
+                <Column field="isActive" header="Статус" :sortable="true">
+                    <template #body="slotProps">
+                        <Tag :value="slotProps.data.isActive ? 'Активен' : 'Неактивен'" :severity="slotProps.data.isActive ? 'success' : 'danger'" />
+                    </template>
+                </Column>
+
+                <Column header="Действия" :exportable="false">
+                    <template #body="slotProps">
+                        <div class="flex gap-2">
+                            <Button icon="pi pi-pencil" class="p-button-rounded p-button-text p-button-sm" @click="editChannel(slotProps.data)" v-tooltip.top="'Редактировать'" />
+                            <Button icon="pi pi-trash" class="p-button-rounded p-button-text p-button-danger p-button-sm" @click="confirmDelete(slotProps.data)" v-tooltip.top="'Удалить'" />
+                        </div>
+                    </template>
+                </Column>
+            </DataTable>
+        </div>
+    </div>
+
+    <!-- Диалог создания/редактирования канала -->
+    <Dialog v-model:visible="showCreateDialog" :header="editingChannel ? 'Редактировать канал' : 'Создать канал'" :modal="true" :style="{ width: '50vw' }" :closable="false">
+        <div class="p-fluid">
+            <div class="field">
+                <label for="name">Название канала *</label>
+                <InputText id="name" v-model="channelForm.name" :class="{ 'p-invalid': !channelForm.name }" />
+                <small v-if="!channelForm.name" class="p-error">Название обязательно</small>
+            </div>
+
+            <div class="field">
+                <label for="type">Тип канала *</label>
+                <Dropdown id="type" v-model="channelForm.type" :options="typeOptions" optionLabel="label" optionValue="value" :class="{ 'p-invalid': !channelForm.type }" />
+                <small v-if="!channelForm.type" class="p-error">Тип канала обязателен</small>
+            </div>
+
+            <div class="field">
+                <label for="apiKeyRef">API Ключ *</label>
+                <InputText id="apiKeyRef" v-model="channelForm.apiKeyRef" :class="{ 'p-invalid': !channelForm.apiKeyRef }" />
+                <small v-if="!channelForm.apiKeyRef" class="p-error">API ключ обязателен</small>
+                <small class="text-600">Ссылка на API ключ в системе</small>
+            </div>
+
+            <div class="field">
+                <div class="flex align-items-center">
+                    <Checkbox id="isActive" v-model="channelForm.isActive" :binary="true" />
+                    <label for="isActive" class="ml-2">Канал активен</label>
+                </div>
+            </div>
+        </div>
+
+        <template #footer>
+            <Button label="Отмена" icon="pi pi-times" @click="cancelEdit" class="p-button-text" />
+            <Button :label="editingChannel ? 'Обновить' : 'Создать'" icon="pi pi-check" @click="saveChannel" :loading="saving" />
+        </template>
+    </Dialog>
+
+    <!-- Диалог подтверждения удаления -->
+    <Dialog v-model:visible="showDeleteDialog" header="Подтверждение удаления" :modal="true" :style="{ width: '25vw' }">
+        <p>Вы уверены, что хотите удалить канал "{{ channelToDelete?.name }}"?</p>
+        <template #footer>
+            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" class="p-button-text" />
+            <Button label="Удалить" icon="pi pi-trash" @click="deleteChannel" class="p-button-danger" :loading="deleting" />
+        </template>
+    </Dialog>
+</template>
+
 <style scoped>
 .card {
     background: var(--surface-card);
diff --git a/src/views/smm/ContentList.vue b/src/views/smm/ContentList.vue
index ef69a10..4c194ca 100644
--- a/src/views/smm/ContentList.vue
+++ b/src/views/smm/ContentList.vue
@@ -1,196 +1,3 @@
-<template>
-    <div class="card">
-        <div class="card-header">
-            <h5>Управление контентом</h5>
-            <Button icon="pi pi-plus" label="Создать контент" @click="showCreateDialog = true" class="p-button-success" />
-        </div>
-        <div class="card-content">
-            <DataTable
-                :value="content"
-                :loading="loading"
-                paginator
-                :rows="10"
-                :rowsPerPageOptions="[5, 10, 20]"
-                sortMode="multiple"
-                removableSort
-                filterDisplay="row"
-                :globalFilterFields="['topic', 'locale', 'status']"
-                v-model:filters="filters"
-                :filters="filters"
-            >
-                <template #header>
-                    <div class="flex justify-content-between">
-                        <span class="p-input-icon-left">
-                            <i class="pi pi-search" />
-                            <InputText v-model="filters['global'].value" placeholder="Поиск контента..." />
-                        </span>
-                    </div>
-                </template>
-
-                <Column field="topic" header="Тема" :sortable="true">
-                    <template #body="slotProps">
-                        <span class="font-semibold">{{ slotProps.data.topic }}</span>
-                    </template>
-                </Column>
-
-                <Column field="locale" header="Локаль" :sortable="true">
-                    <template #body="slotProps">
-                        <Tag :value="slotProps.data.locale" severity="info" />
-                    </template>
-                </Column>
-
-                <Column field="campaignId" header="Кампания" :sortable="true">
-                    <template #body="slotProps">
-                        <span>{{ getCampaignName(slotProps.data.campaignId) }}</span>
-                    </template>
-                </Column>
-
-                <Column field="postDraft" header="Черновик" :sortable="true">
-                    <template #body="slotProps">
-                        <span class="text-sm">{{ truncateText(slotProps.data.postDraft, 50) }}</span>
-                    </template>
-                </Column>
-
-                <Column field="scheduledAt" header="Запланировано" :sortable="true">
-                    <template #body="slotProps">
-                        <span>{{ formatDate(slotProps.data.scheduledAt) }}</span>
-                    </template>
-                </Column>
-
-                <Column field="priority" header="Приоритет" :sortable="true">
-                    <template #body="slotProps">
-                        <Tag :value="slotProps.data.priority" :severity="getPrioritySeverity(slotProps.data.priority)" />
-                    </template>
-                </Column>
-
-                <Column field="status" header="Статус" :sortable="true">
-                    <template #body="slotProps">
-                        <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
-                    </template>
-                </Column>
-
-                <Column header="Действия" :exportable="false">
-                    <template #body="slotProps">
-                        <div class="flex gap-2">
-                            <Button icon="pi pi-eye" class="p-button-rounded p-button-text p-button-sm" @click="viewContent(slotProps.data)" v-tooltip.top="'Просмотр'" />
-                            <Button icon="pi pi-pencil" class="p-button-rounded p-button-text p-button-sm" @click="editContent(slotProps.data)" v-tooltip.top="'Редактировать'" />
-                            <Button v-if="slotProps.data.status === 'PENDING_APPROVAL'" icon="pi pi-check" class="p-button-rounded p-button-text p-button-success p-button-sm" @click="approveContent(slotProps.data)" v-tooltip.top="'Одобрить'" />
-                            <Button v-if="slotProps.data.status === 'APPROVED'" icon="pi pi-send" class="p-button-rounded p-button-text p-button-info p-button-sm" @click="publishContent(slotProps.data)" v-tooltip.top="'Опубликовать'" />
-                            <Button icon="pi pi-trash" class="p-button-rounded p-button-text p-button-danger p-button-sm" @click="confirmDelete(slotProps.data)" v-tooltip.top="'Удалить'" />
-                        </div>
-                    </template>
-                </Column>
-            </DataTable>
-        </div>
-    </div>
-
-    <!-- Диалог создания/редактирования контента -->
-    <Dialog v-model:visible="showCreateDialog" :header="editingContent ? 'Редактировать контент' : 'Создать контент'" :modal="true" :style="{ width: '70vw' }" :closable="false">
-        <div class="p-fluid">
-            <div class="grid">
-                <div class="col-6">
-                    <div class="field">
-                        <label for="campaignId">Кампания *</label>
-                        <Dropdown id="campaignId" v-model="contentForm.campaignId" :options="campaigns" optionLabel="name" optionValue="id" :class="{ 'p-invalid': !contentForm.campaignId }" />
-                        <small v-if="!contentForm.campaignId" class="p-error">Кампания обязательна</small>
-                    </div>
-                </div>
-                <div class="col-6">
-                    <div class="field">
-                        <label for="locale">Локаль *</label>
-                        <InputText id="locale" v-model="contentForm.locale" :class="{ 'p-invalid': !contentForm.locale }" />
-                        <small v-if="!contentForm.locale" class="p-error">Локаль обязательна</small>
-                    </div>
-                </div>
-            </div>
-
-            <div class="field">
-                <label for="topic">Тема *</label>
-                <InputText id="topic" v-model="contentForm.topic" :class="{ 'p-invalid': !contentForm.topic }" />
-                <small v-if="!contentForm.topic" class="p-error">Тема обязательна</small>
-            </div>
-
-            <div class="field">
-                <label for="postDraft">Черновик поста</label>
-                <Textarea id="postDraft" v-model="contentForm.postDraft" rows="4" />
-            </div>
-
-            <div class="field">
-                <label for="assetsRefs">Ссылки на ресурсы</label>
-                <InputText id="assetsRefs" v-model="contentForm.assetsRefs" />
-                <small class="text-600">Разделите ссылки запятыми</small>
-            </div>
-
-            <div class="grid">
-                <div class="col-6">
-                    <div class="field">
-                        <label for="scheduledAt">Время публикации</label>
-                        <Calendar id="scheduledAt" v-model="contentForm.scheduledAt" dateFormat="yy-mm-dd" showTime hourFormat="24" />
-                    </div>
-                </div>
-                <div class="col-6">
-                    <div class="field">
-                        <label for="priority">Приоритет</label>
-                        <InputNumber id="priority" v-model="contentForm.priority" :min="1" :max="10" />
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <template #footer>
-            <Button label="Отмена" icon="pi pi-times" @click="cancelEdit" class="p-button-text" />
-            <Button :label="editingContent ? 'Обновить' : 'Создать'" icon="pi pi-check" @click="saveContent" :loading="saving" />
-        </template>
-    </Dialog>
-
-    <!-- Диалог просмотра контента -->
-    <Dialog v-model:visible="showViewDialog" header="Просмотр контента" :modal="true" :style="{ width: '60vw' }">
-        <div v-if="viewingContent" class="content-view">
-            <div class="field">
-                <label>Тема:</label>
-                <p class="font-semibold">{{ viewingContent.topic }}</p>
-            </div>
-            <div class="field">
-                <label>Локаль:</label>
-                <p>{{ viewingContent.locale }}</p>
-            </div>
-            <div class="field">
-                <label>Кампания:</label>
-                <p>{{ getCampaignName(viewingContent.campaignId) }}</p>
-            </div>
-            <div class="field">
-                <label>Черновик поста:</label>
-                <p class="whitespace-pre-wrap">{{ viewingContent.postDraft }}</p>
-            </div>
-            <div class="field">
-                <label>Ссылки на ресурсы:</label>
-                <p>{{ viewingContent.assetsRefs }}</p>
-            </div>
-            <div class="field">
-                <label>Время публикации:</label>
-                <p>{{ formatDate(viewingContent.scheduledAt) }}</p>
-            </div>
-            <div class="field">
-                <label>Приоритет:</label>
-                <p>{{ viewingContent.priority }}</p>
-            </div>
-            <div class="field">
-                <label>Статус:</label>
-                <Tag :value="getStatusLabel(viewingContent.status)" :severity="getStatusSeverity(viewingContent.status)" />
-            </div>
-        </div>
-    </Dialog>
-
-    <!-- Диалог подтверждения удаления -->
-    <Dialog v-model:visible="showDeleteDialog" header="Подтверждение удаления" :modal="true" :style="{ width: '25vw' }">
-        <p>Вы уверены, что хотите удалить контент "{{ contentToDelete?.topic }}"?</p>
-        <template #footer>
-            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" class="p-button-text" />
-            <Button label="Удалить" icon="pi pi-trash" @click="deleteContent" class="p-button-danger" :loading="deleting" />
-        </template>
-    </Dialog>
-</template>
-
 <script>
 import CampaignService from '@/service/CampaignService.js';
 import ContentService from '@/service/ContentService.js';
@@ -501,6 +308,199 @@ export default {
 };
 </script>
 
+<template>
+    <div class="card">
+        <div class="card-header">
+            <h5>Управление контентом</h5>
+            <Button icon="pi pi-plus" label="Создать контент" @click="showCreateDialog = true" class="p-button-success" />
+        </div>
+        <div class="card-content">
+            <DataTable
+                :value="content"
+                :loading="loading"
+                paginator
+                :rows="10"
+                :rowsPerPageOptions="[5, 10, 20]"
+                sortMode="multiple"
+                removableSort
+                filterDisplay="row"
+                :globalFilterFields="['topic', 'locale', 'status']"
+                v-model:filters="filters"
+                :filters="filters"
+            >
+                <template #header>
+                    <div class="flex justify-content-between">
+                        <span class="p-input-icon-left">
+                            <i class="pi pi-search" />
+                            <InputText v-model="filters['global'].value" placeholder="Поиск контента..." />
+                        </span>
+                    </div>
+                </template>
+
+                <Column field="topic" header="Тема" :sortable="true">
+                    <template #body="slotProps">
+                        <span class="font-semibold">{{ slotProps.data.topic }}</span>
+                    </template>
+                </Column>
+
+                <Column field="locale" header="Локаль" :sortable="true">
+                    <template #body="slotProps">
+                        <Tag :value="slotProps.data.locale" severity="info" />
+                    </template>
+                </Column>
+
+                <Column field="campaignId" header="Кампания" :sortable="true">
+                    <template #body="slotProps">
+                        <span>{{ getCampaignName(slotProps.data.campaignId) }}</span>
+                    </template>
+                </Column>
+
+                <Column field="postDraft" header="Черновик" :sortable="true">
+                    <template #body="slotProps">
+                        <span class="text-sm">{{ truncateText(slotProps.data.postDraft, 50) }}</span>
+                    </template>
+                </Column>
+
+                <Column field="scheduledAt" header="Запланировано" :sortable="true">
+                    <template #body="slotProps">
+                        <span>{{ formatDate(slotProps.data.scheduledAt) }}</span>
+                    </template>
+                </Column>
+
+                <Column field="priority" header="Приоритет" :sortable="true">
+                    <template #body="slotProps">
+                        <Tag :value="slotProps.data.priority" :severity="getPrioritySeverity(slotProps.data.priority)" />
+                    </template>
+                </Column>
+
+                <Column field="status" header="Статус" :sortable="true">
+                    <template #body="slotProps">
+                        <Tag :value="getStatusLabel(slotProps.data.status)" :severity="getStatusSeverity(slotProps.data.status)" />
+                    </template>
+                </Column>
+
+                <Column header="Действия" :exportable="false">
+                    <template #body="slotProps">
+                        <div class="flex gap-2">
+                            <Button icon="pi pi-eye" class="p-button-rounded p-button-text p-button-sm" @click="viewContent(slotProps.data)" v-tooltip.top="'Просмотр'" />
+                            <Button icon="pi pi-pencil" class="p-button-rounded p-button-text p-button-sm" @click="editContent(slotProps.data)" v-tooltip.top="'Редактировать'" />
+                            <Button v-if="slotProps.data.status === 'PENDING_APPROVAL'" icon="pi pi-check" class="p-button-rounded p-button-text p-button-success p-button-sm" @click="approveContent(slotProps.data)" v-tooltip.top="'Одобрить'" />
+                            <Button v-if="slotProps.data.status === 'APPROVED'" icon="pi pi-send" class="p-button-rounded p-button-text p-button-info p-button-sm" @click="publishContent(slotProps.data)" v-tooltip.top="'Опубликовать'" />
+                            <Button icon="pi pi-trash" class="p-button-rounded p-button-text p-button-danger p-button-sm" @click="confirmDelete(slotProps.data)" v-tooltip.top="'Удалить'" />
+                        </div>
+                    </template>
+                </Column>
+            </DataTable>
+        </div>
+    </div>
+
+    <!-- Диалог создания/редактирования контента -->
+    <Dialog v-model:visible="showCreateDialog" :header="editingContent ? 'Редактировать контент' : 'Создать контент'" :modal="true" :style="{ width: '70vw' }" :closable="false">
+        <div class="p-fluid">
+            <div class="grid">
+                <div class="col-6">
+                    <div class="field">
+                        <label for="campaignId">Кампания *</label>
+                        <Dropdown id="campaignId" v-model="contentForm.campaignId" :options="campaigns" optionLabel="name" optionValue="id" :class="{ 'p-invalid': !contentForm.campaignId }" />
+                        <small v-if="!contentForm.campaignId" class="p-error">Кампания обязательна</small>
+                    </div>
+                </div>
+                <div class="col-6">
+                    <div class="field">
+                        <label for="locale">Локаль *</label>
+                        <InputText id="locale" v-model="contentForm.locale" :class="{ 'p-invalid': !contentForm.locale }" />
+                        <small v-if="!contentForm.locale" class="p-error">Локаль обязательна</small>
+                    </div>
+                </div>
+            </div>
+
+            <div class="field">
+                <label for="topic">Тема *</label>
+                <InputText id="topic" v-model="contentForm.topic" :class="{ 'p-invalid': !contentForm.topic }" />
+                <small v-if="!contentForm.topic" class="p-error">Тема обязательна</small>
+            </div>
+
+            <div class="field">
+                <label for="postDraft">Черновик поста</label>
+                <Textarea id="postDraft" v-model="contentForm.postDraft" rows="4" />
+            </div>
+
+            <div class="field">
+                <label for="assetsRefs">Ссылки на ресурсы</label>
+                <InputText id="assetsRefs" v-model="contentForm.assetsRefs" />
+                <small class="text-600">Разделите ссылки запятыми</small>
+            </div>
+
+            <div class="grid">
+                <div class="col-6">
+                    <div class="field">
+                        <label for="scheduledAt">Время публикации</label>
+                        <Calendar id="scheduledAt" v-model="contentForm.scheduledAt" dateFormat="yy-mm-dd" showTime hourFormat="24" />
+                    </div>
+                </div>
+                <div class="col-6">
+                    <div class="field">
+                        <label for="priority">Приоритет</label>
+                        <InputNumber id="priority" v-model="contentForm.priority" :min="1" :max="10" />
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <template #footer>
+            <Button label="Отмена" icon="pi pi-times" @click="cancelEdit" class="p-button-text" />
+            <Button :label="editingContent ? 'Обновить' : 'Создать'" icon="pi pi-check" @click="saveContent" :loading="saving" />
+        </template>
+    </Dialog>
+
+    <!-- Диалог просмотра контента -->
+    <Dialog v-model:visible="showViewDialog" header="Просмотр контента" :modal="true" :style="{ width: '60vw' }">
+        <div v-if="viewingContent" class="content-view">
+            <div class="field">
+                <label>Тема:</label>
+                <p class="font-semibold">{{ viewingContent.topic }}</p>
+            </div>
+            <div class="field">
+                <label>Локаль:</label>
+                <p>{{ viewingContent.locale }}</p>
+            </div>
+            <div class="field">
+                <label>Кампания:</label>
+                <p>{{ getCampaignName(viewingContent.campaignId) }}</p>
+            </div>
+            <div class="field">
+                <label>Черновик поста:</label>
+                <p class="whitespace-pre-wrap">{{ viewingContent.postDraft }}</p>
+            </div>
+            <div class="field">
+                <label>Ссылки на ресурсы:</label>
+                <p>{{ viewingContent.assetsRefs }}</p>
+            </div>
+            <div class="field">
+                <label>Время публикации:</label>
+                <p>{{ formatDate(viewingContent.scheduledAt) }}</p>
+            </div>
+            <div class="field">
+                <label>Приоритет:</label>
+                <p>{{ viewingContent.priority }}</p>
+            </div>
+            <div class="field">
+                <label>Статус:</label>
+                <Tag :value="getStatusLabel(viewingContent.status)" :severity="getStatusSeverity(viewingContent.status)" />
+            </div>
+        </div>
+    </Dialog>
+
+    <!-- Диалог подтверждения удаления -->
+    <Dialog v-model:visible="showDeleteDialog" header="Подтверждение удаления" :modal="true" :style="{ width: '25vw' }">
+        <p>Вы уверены, что хотите удалить контент "{{ contentToDelete?.topic }}"?</p>
+        <template #footer>
+            <Button label="Отмена" icon="pi pi-times" @click="showDeleteDialog = false" class="p-button-text" />
+            <Button label="Удалить" icon="pi pi-trash" @click="deleteContent" class="p-button-danger" :loading="deleting" />
+        </template>
+    </Dialog>
+</template>
+
 <style scoped>
 .card {
     background: var(--surface-card);
diff --git a/src/views/smm/SmmDashboard.vue b/src/views/smm/SmmDashboard.vue
index 64dd0e2..3f1c402 100644
--- a/src/views/smm/SmmDashboard.vue
+++ b/src/views/smm/SmmDashboard.vue
@@ -1,3 +1,131 @@
+<script>
+import AnalyticsService from '@/service/AnalyticsService.js';
+import CampaignService from '@/service/CampaignService.js';
+import ContentService from '@/service/ContentService.js';
+import { CampaignStatus, ContentStatus } from '@/types/smm.js';
+import { useToast } from 'primevue/usetoast';
+import { onMounted, ref } from 'vue';
+
+export default {
+    name: 'SmmDashboard',
+    setup() {
+        const toast = useToast();
+
+        // Reactive data
+        const stats = ref({});
+        const recentCampaigns = ref([]);
+        const recentContent = ref([]);
+        const loading = ref(false);
+
+        // Methods
+        const loadDashboardData = async () => {
+            loading.value = true;
+            try {
+                const [systemStats, publishingStats, campaigns, content] = await Promise.all([AnalyticsService.getSystemStats(), AnalyticsService.getPublishingStats(), CampaignService.getAllCampaigns(), ContentService.getAllContent()]);
+
+                stats.value = {
+                    campaigns: systemStats.campaigns?.total || 0,
+                    activeCampaigns: systemStats.campaigns?.activeCampaigns || 0,
+                    channels: systemStats.channels?.total || 0,
+                    activeChannels: systemStats.channels?.activeChannels || 0,
+                    content: systemStats.content?.total || 0,
+                    pendingApproval: systemStats.content?.pendingApproval || 0,
+                    published: publishingStats.totalPublished || 0,
+                    publishingRate: publishingStats.publishingRate || 0
+                };
+
+                // Получаем последние 5 кампаний
+                recentCampaigns.value = campaigns.sort((a, b) => new Date(b.startAt) - new Date(a.startAt)).slice(0, 5);
+
+                // Получаем последние 5 контентов
+                recentContent.value = content.sort((a, b) => new Date(b.scheduledAt || b.createdAt) - new Date(a.scheduledAt || a.createdAt)).slice(0, 5);
+            } catch (error) {
+                toast.add({
+                    severity: 'error',
+                    summary: 'Ошибка',
+                    detail: 'Не удалось загрузить данные: ' + error.message,
+                    life: 3000
+                });
+            } finally {
+                loading.value = false;
+            }
+        };
+
+        const formatDate = (dateString) => {
+            if (!dateString) return '-';
+            return new Date(dateString).toLocaleDateString('ru-RU', {
+                year: 'numeric',
+                month: 'short',
+                day: 'numeric'
+            });
+        };
+
+        const truncateText = (text, length) => {
+            if (!text) return '';
+            return text.length > length ? text.substring(0, length) + '...' : text;
+        };
+
+        const getStatusLabel = (status) => {
+            const labels = {
+                [CampaignStatus.PLANNED]: 'Запланирована',
+                [CampaignStatus.ACTIVE]: 'Активна',
+                [CampaignStatus.COMPLETED]: 'Завершена'
+            };
+            return labels[status] || status;
+        };
+
+        const getStatusSeverity = (status) => {
+            const severities = {
+                [CampaignStatus.PLANNED]: 'info',
+                [CampaignStatus.ACTIVE]: 'success',
+                [CampaignStatus.COMPLETED]: 'secondary'
+            };
+            return severities[status] || 'info';
+        };
+
+        const getContentStatusLabel = (status) => {
+            const labels = {
+                [ContentStatus.DRAFT]: 'Черновик',
+                [ContentStatus.PENDING_APPROVAL]: 'Ожидает',
+                [ContentStatus.APPROVED]: 'Одобрен',
+                [ContentStatus.PUBLISHED]: 'Опубликован',
+                [ContentStatus.FAILED]: 'Ошибка'
+            };
+            return labels[status] || status;
+        };
+
+        const getContentStatusSeverity = (status) => {
+            const severities = {
+                [ContentStatus.DRAFT]: 'info',
+                [ContentStatus.PENDING_APPROVAL]: 'warning',
+                [ContentStatus.APPROVED]: 'success',
+                [ContentStatus.PUBLISHED]: 'success',
+                [ContentStatus.FAILED]: 'danger'
+            };
+            return severities[status] || 'info';
+        };
+
+        // Lifecycle
+        onMounted(() => {
+            loadDashboardData();
+        });
+
+        return {
+            stats,
+            recentCampaigns,
+            recentContent,
+            loading,
+            formatDate,
+            truncateText,
+            getStatusLabel,
+            getStatusSeverity,
+            getContentStatusLabel,
+            getContentStatusSeverity
+        };
+    }
+};
+</script>
+
 <template>
     <div class="smm-dashboard">
         <div class="grid">
@@ -158,134 +286,6 @@
     </div>
 </template>
 
-<script>
-import AnalyticsService from '@/service/AnalyticsService.js';
-import CampaignService from '@/service/CampaignService.js';
-import ContentService from '@/service/ContentService.js';
-import { CampaignStatus, ContentStatus } from '@/types/smm.js';
-import { useToast } from 'primevue/usetoast';
-import { onMounted, ref } from 'vue';
-
-export default {
-    name: 'SmmDashboard',
-    setup() {
-        const toast = useToast();
-
-        // Reactive data
-        const stats = ref({});
-        const recentCampaigns = ref([]);
-        const recentContent = ref([]);
-        const loading = ref(false);
-
-        // Methods
-        const loadDashboardData = async () => {
-            loading.value = true;
-            try {
-                const [systemStats, publishingStats, campaigns, content] = await Promise.all([AnalyticsService.getSystemStats(), AnalyticsService.getPublishingStats(), CampaignService.getAllCampaigns(), ContentService.getAllContent()]);
-
-                stats.value = {
-                    campaigns: systemStats.campaigns?.total || 0,
-                    activeCampaigns: systemStats.campaigns?.activeCampaigns || 0,
-                    channels: systemStats.channels?.total || 0,
-                    activeChannels: systemStats.channels?.activeChannels || 0,
-                    content: systemStats.content?.total || 0,
-                    pendingApproval: systemStats.content?.pendingApproval || 0,
-                    published: publishingStats.totalPublished || 0,
-                    publishingRate: publishingStats.publishingRate || 0
-                };
-
-                // Получаем последние 5 кампаний
-                recentCampaigns.value = campaigns.sort((a, b) => new Date(b.startAt) - new Date(a.startAt)).slice(0, 5);
-
-                // Получаем последние 5 контентов
-                recentContent.value = content.sort((a, b) => new Date(b.scheduledAt || b.createdAt) - new Date(a.scheduledAt || a.createdAt)).slice(0, 5);
-            } catch (error) {
-                toast.add({
-                    severity: 'error',
-                    summary: 'Ошибка',
-                    detail: 'Не удалось загрузить данные: ' + error.message,
-                    life: 3000
-                });
-            } finally {
-                loading.value = false;
-            }
-        };
-
-        const formatDate = (dateString) => {
-            if (!dateString) return '-';
-            return new Date(dateString).toLocaleDateString('ru-RU', {
-                year: 'numeric',
-                month: 'short',
-                day: 'numeric'
-            });
-        };
-
-        const truncateText = (text, length) => {
-            if (!text) return '';
-            return text.length > length ? text.substring(0, length) + '...' : text;
-        };
-
-        const getStatusLabel = (status) => {
-            const labels = {
-                [CampaignStatus.PLANNED]: 'Запланирована',
-                [CampaignStatus.ACTIVE]: 'Активна',
-                [CampaignStatus.COMPLETED]: 'Завершена'
-            };
-            return labels[status] || status;
-        };
-
-        const getStatusSeverity = (status) => {
-            const severities = {
-                [CampaignStatus.PLANNED]: 'info',
-                [CampaignStatus.ACTIVE]: 'success',
-                [CampaignStatus.COMPLETED]: 'secondary'
-            };
-            return severities[status] || 'info';
-        };
-
-        const getContentStatusLabel = (status) => {
-            const labels = {
-                [ContentStatus.DRAFT]: 'Черновик',
-                [ContentStatus.PENDING_APPROVAL]: 'Ожидает',
-                [ContentStatus.APPROVED]: 'Одобрен',
-                [ContentStatus.PUBLISHED]: 'Опубликован',
-                [ContentStatus.FAILED]: 'Ошибка'
-            };
-            return labels[status] || status;
-        };
-
-        const getContentStatusSeverity = (status) => {
-            const severities = {
-                [ContentStatus.DRAFT]: 'info',
-                [ContentStatus.PENDING_APPROVAL]: 'warning',
-                [ContentStatus.APPROVED]: 'success',
-                [ContentStatus.PUBLISHED]: 'success',
-                [ContentStatus.FAILED]: 'danger'
-            };
-            return severities[status] || 'info';
-        };
-
-        // Lifecycle
-        onMounted(() => {
-            loadDashboardData();
-        });
-
-        return {
-            stats,
-            recentCampaigns,
-            recentContent,
-            loading,
-            formatDate,
-            truncateText,
-            getStatusLabel,
-            getStatusSeverity,
-            getContentStatusLabel,
-            getContentStatusSeverity
-        };
-    }
-};
-</script>
-
 <style scoped>
 .smm-dashboard {
     padding: 1rem;
diff --git a/types/marketing-request.ts b/types/marketing-request.ts
new file mode 100644
index 0000000..b984dc6
--- /dev/null
+++ b/types/marketing-request.ts
@@ -0,0 +1,185 @@
+// --- ENUMS ---
+export type BusinessStage =
+  | "JUST_STARTING"
+  | "LESS_THAN_ONE_YEAR"
+  | "ONE_TO_THREE_YEARS"
+  | "MORE_THAN_THREE_YEARS";
+export type ClientTarget = "PRIVATE_CLIENTS" | "BUSINESS" | "MIXED";
+export type OfferType = "SERVICES" | "GOODS" | "SUBSCRIPTION";
+export type AverageCheck = "LOW" | "MEDIUM" | "HIGH";
+export type CustomerBehavior =
+  | "BUY_QUICKLY"
+  | "COMPARE_OPTIONS"
+  | "REQUEST_PROPOSAL"
+  | "CHECK_REVIEWS"
+  | "NEED_CONSULTATION";
+export type GeoScope = "SINGLE_CITY" | "MULTI_CITY" | "FULL_COUNTRY" | "ONLINE";
+export type PurchaseFrequency =
+  | "ONCE"
+  | "MULTIPLE_PER_YEAR"
+  | "REGULARLY";
+export type VisualFactor =
+  | "VISUALS_IMPORTANT"
+  | "PARTIALLY"
+  | "EXPLANATION_IMPORTANT";
+export type DecisionPriority =
+  | "PRICE"
+  | "QUALITY"
+  | "SPEED"
+  | "TRUST"
+  | "SERVICE";
+export type DiscoveryMethod =
+  | "SEARCH_WEB"
+  | "RECOMMENDATIONS"
+  | "PRICE_SELECTION"
+  | "REVIEWS"
+  | "CONVENIENCE";
+export type PriceFeedback =
+  | "LOWER_THAN_EXPECTED"
+  | "AS_EXPECTED"
+  | "HIGHER_THAN_EXPECTED"
+  | "NOT_DISCUSSED";
+export type SmmStatus = "NONE" | "DORMANT" | "IRREGULAR" | "ACTIVE";
+export type LeadVolume = "NONE" | "SOMETIMES" | "REGULARLY";
+export type ResponseHandler = "MYSELF" | "EMPLOYEE" | "DELAYED";
+export type BusinessConstraint =
+  | "NONE"
+  | "SEASONALITY"
+  | "SMALL_TEAM"
+  | "LIMITED_BUDGET"
+  | "LONG_DEAL_CYCLE";
+
+// --- MAPPINGS ДЛЯ UI ---
+export const BusinessStageLabels: Record<BusinessStage, string> = {
+  JUST_STARTING: "Только запускаемся",
+  LESS_THAN_ONE_YEAR: "Работаем до 1 года",
+  ONE_TO_THREE_YEARS: "Работаем 1–3 года",
+  MORE_THAN_THREE_YEARS: "Работаем более 3 лет"
+};
+
+export const ClientTargetLabels: Record<ClientTarget, string> = {
+  PRIVATE_CLIENTS: "Работаем с конечными клиентами (B2C)",
+  BUSINESS: "Работаем с бизнесом (B2B)",
+  MIXED: "Смешанная модель (B2B + B2C)"
+};
+
+export const OfferTypeLabels: Record<OfferType, string> = {
+  SERVICES: "Услуги",
+  GOODS: "Товары",
+  SUBSCRIPTION: "Подписка / доступ"
+};
+
+export const AverageCheckLabels: Record<AverageCheck, string> = {
+  LOW: "Низкий чек",
+  MEDIUM: "Средний чек",
+  HIGH: "Высокий чек"
+};
+
+export const CustomerBehaviorLabels: Record<CustomerBehavior, string> = {
+  BUY_QUICKLY: "Покупают быстро, без долгих раздумий",
+  COMPARE_OPTIONS: "Сравнивают варианты и предложения",
+  REQUEST_PROPOSAL: "Запрашивают индивидуальное коммерческое предложение",
+  CHECK_REVIEWS: "Внимательно читают отзывы и рейтинги",
+  NEED_CONSULTATION: "Нуждаются в консультации перед покупкой"
+};
+
+export const GeoScopeLabels: Record<GeoScope, string> = {
+  SINGLE_CITY: "Один город",
+  MULTI_CITY: "Несколько городов",
+  FULL_COUNTRY: "Вся страна",
+  ONLINE: "Онлайн по всему миру"
+};
+
+export const PurchaseFrequencyLabels: Record<PurchaseFrequency, string> = {
+  ONCE: "Одна покупка",
+  MULTIPLE_PER_YEAR: "Несколько раз в год",
+  REGULARLY: "Регулярно (ежемесячно / чаще)"
+};
+
+export const VisualFactorLabels: Record<VisualFactor, string> = {
+  VISUALS_IMPORTANT: "Визуал критически важен (эстетика, фото, видео)",
+  PARTIALLY: "Важно, но не критично",
+  EXPLANATION_IMPORTANT:
+    "Тексты и экспертность важнее визуала для доверия"
+};
+
+export const DecisionPriorityLabels: Record<DecisionPriority, string> = {
+  PRICE: "Цена",
+  QUALITY: "Качество",
+  SPEED: "Скорость",
+  TRUST: "Доверие к бренду",
+  SERVICE: "Сервис и сопровождение"
+};
+
+export const DiscoveryMethodLabels: Record<DiscoveryMethod, string> = {
+  SEARCH_WEB: "Ищут в поиске и сравнивают",
+  RECOMMENDATIONS: "Приходят по рекомендациям / сарафанке",
+  PRICE_SELECTION: "Выбирают по цене / акциям",
+  REVIEWS: "Ориентируются на отзывы и рейтинги",
+  CONVENIENCE: "Выбирают по удобству (сайт, UX, доставка)"
+};
+
+export const PriceFeedbackLabels: Record<PriceFeedback, string> = {
+  LOWER_THAN_EXPECTED: "Часто говорят, что «дёшево / ниже ожиданий»",
+  AS_EXPECTED: "Цена воспринимается как ожидаемая",
+  HIGHER_THAN_EXPECTED: "Считают, что «дорого / выше ожиданий»",
+  NOT_DISCUSSED: "Цену обычно подробно не обсуждают"
+};
+
+export const SmmStatusLabels: Record<SmmStatus, string> = {
+  NONE: "Соцсетей нет",
+  DORMANT: "Есть, но почти не ведём",
+  IRREGULAR: "Ведём нерегулярно",
+  ACTIVE: "Активно ведём и развиваем"
+};
+
+export const LeadVolumeLabels: Record<LeadVolume, string> = {
+  NONE: "Заявок практически нет",
+  SOMETIMES: "Иногда приходят заявки",
+  REGULARLY: "Заявки приходят регулярно"
+};
+
+export const ResponseHandlerLabels: Record<ResponseHandler, string> = {
+  MYSELF: "Отвечает лично основатель / владелец",
+  EMPLOYEE: "Есть выделенный сотрудник",
+  DELAYED: "Отвечаем не сразу, с задержками"
+};
+
+export const BusinessConstraintLabels: Record<BusinessConstraint, string> = {
+  NONE: "Серьезных ограничений нет",
+  SEASONALITY: "Ярко выраженная сезонность",
+  SMALL_TEAM: "Маленькая команда",
+  LIMITED_BUDGET: "Ограниченный маркетинговый бюджет",
+  LONG_DEAL_CYCLE: "Длинный цикл сделки"
+};
+
+// --- MAIN REQUEST INTERFACE ---
+export interface MarketingAnalysisV3Request {
+  businessNiche: string;
+  productName: string;
+  goal: string;
+  businessStage: BusinessStage;
+  clientTarget: ClientTarget;
+  offerType: OfferType;
+  averageCheck: AverageCheck;
+  customerBehaviors: CustomerBehavior[]; // min 1, max 2
+  geoScope: GeoScope;
+  mainCity?: string;
+  presenceCities?: string[]; // max 5
+  promotionCities: string[]; // max 5
+  productDescription: string;
+  purchaseFrequency: PurchaseFrequency;
+  visualFactor: VisualFactor;
+  decisionPriorities: DecisionPriority[]; // min 1, max 2
+  discoveryMethods: DiscoveryMethod[]; // min 1, max 2
+  priceFeedback: PriceFeedback;
+  smmStatus: SmmStatus;
+  leadVolume: LeadVolume;
+  responseHandler: ResponseHandler;
+  constraints?: BusinessConstraint[];
+  userSocialLinks?: string[]; // max 5
+  knownCompetitorLinks?: string[]; // max 5
+  detailLevel: string;
+  analysisType: string[]; // ['РЫНОК', 'КОНКУРЕНТЫ', 'ЦА', 'КАНАЛЫ']
+}
+
diff --git a/types/marketing-v3.ts b/types/marketing-v3.ts
new file mode 100644
index 0000000..6c5c1ae
--- /dev/null
+++ b/types/marketing-v3.ts
@@ -0,0 +1,135 @@
+export interface MarketingAnalysisV3Result {
+  "0_executive_summary": ExecutiveSummary;
+  "1_market_landscape": MarketLandscape;
+  "2_geo_structure": GeoStructure;
+  "3_competitor_map": CompetitorProfile[];
+  "4_content_profile": ContentProfile;
+  "5_competition_intensity": CompetitionIntensity;
+  "6_reputation_analysis": ReputationAnalysis;
+  "7_behavioral_pattern": BehavioralPattern;
+  "8_search_demand": SearchDemand;
+  "9_user_positioning": UserPositioning;
+  "10_structured_conclusions": string[];
+  "11_smm_strategy_rationale": string;
+}
+
+export interface ExecutiveSummary {
+  businessStage: string;
+  geography: string;
+  activeCompetitors: number;
+  competitionLevel: string;
+  averageNicheEr: string;
+  averageRating: number;
+  demandTrend: string;
+  keyFigures: string[];
+}
+
+export interface TimeSeriesPoint {
+  period: string;
+  value: number;
+}
+
+export interface MarketLandscape {
+  activePlayersByPlatform: Record<string, number>;
+  cityDistribution: Record<string, number>;
+  demandDynamics: TimeSeriesPoint[];
+  nicheReputationLevel: number;
+}
+
+export interface CityMetrics {
+  city: string;
+  activePlayers: number;
+  avgEr: number;
+  avgRating: number;
+  avgPostsPerMonth: number;
+}
+
+export interface GeoStructure {
+  cityComparison: CityMetrics[];
+  densityIndex: number;
+}
+
+export interface CompetitorProfile {
+  name: string;
+  platform: string;
+  followers: number;
+  postsPerMonth: number;
+  er: number;
+  rating: number;
+  reviews: number;
+  strengths: string[];
+  weaknesses: string[];
+}
+
+export interface ContentProfile {
+  demoContentPercent: number;
+  expertContentPercent: number;
+  salesContentPercent: number;
+  reviewsContentPercent: number;
+  engagementContentPercent: number;
+  videoShare: number;
+  avgTextLength: string;
+  ctaFrequency: string;
+}
+
+export interface CompetitionIntensity {
+  ciiIndex: number;
+  intensityLabel: string;
+  contributingFactors: string[];
+}
+
+export interface ReputationAnalysis {
+  avgNicheRating: number;
+  medianReviews: number;
+  starDistribution: Record<string, number>;
+  highTrustBusinessShare: number;
+  avgOwnerResponseSpeed: string;
+}
+
+export interface BehavioralPattern {
+  promoFrequency: string;
+  bookingFrequency: string;
+  dmRequestFrequency: string;
+  priceVisibility: string;
+  avgCycleDuration: string;
+  commonCta: string[];
+}
+
+export interface SearchDemand {
+  avgFrequency: string;
+  seasonality: TimeSeriesPoint[];
+  peakPeriods: string[];
+  relatedQueries: string[];
+}
+
+export interface RadarMetrics {
+  activity: number;
+  engagement: number;
+  video: number;
+  reputation: number;
+  frequency: number;
+}
+
+export interface UserPositioning {
+  radarChart: RadarMetrics;
+  status: string;
+  gaps: string[];
+}
+
+export type MarketingAnalysisStatus =
+  | "QUEUED"
+  | "PROCESSING"
+  | "COMPLETED"
+  | "FAILED";
+
+export interface MarketingAnalysisV3Document {
+  id: string;
+  userId: string;
+  status: MarketingAnalysisStatus;
+  requestData: unknown;
+  resultData?: MarketingAnalysisV3Result;
+  errorMessage?: string;
+  createdAt: string;
+  updatedAt: string;
+}
+
diff --git a/vite.config.mjs.timestamp-1764696470038-eccc95bbad6b6.mjs b/vite.config.mjs.timestamp-1764696470038-eccc95bbad6b6.mjs
deleted file mode 100644
index ceb4601..0000000
--- a/vite.config.mjs.timestamp-1764696470038-eccc95bbad6b6.mjs
+++ /dev/null
@@ -1,47 +0,0 @@
-// vite.config.mjs
-import { fileURLToPath, URL } from "node:url";
-import { PrimeVueResolver } from "file:///Users/magzhanzhumabaev/Desktop/kt%20cloud/sakai-vue/node_modules/@primevue/auto-import-resolver/index.mjs";
-import vue from "file:///Users/magzhanzhumabaev/Desktop/kt%20cloud/sakai-vue/node_modules/@vitejs/plugin-vue/dist/index.mjs";
-import Components from "file:///Users/magzhanzhumabaev/Desktop/kt%20cloud/sakai-vue/node_modules/unplugin-vue-components/dist/vite.js";
-import { defineConfig } from "file:///Users/magzhanzhumabaev/Desktop/kt%20cloud/sakai-vue/node_modules/vite/dist/node/index.js";
-var __vite_injected_original_import_meta_url = "file:///Users/magzhanzhumabaev/Desktop/kt%20cloud/sakai-vue/vite.config.mjs";
-var vite_config_default = defineConfig({
-  optimizeDeps: {
-    noDiscovery: true
-  },
-  plugins: [
-    vue(),
-    Components({
-      resolvers: [PrimeVueResolver()]
-    })
-  ],
-  resolve: {
-    alias: {
-      "@": fileURLToPath(new URL("./src", __vite_injected_original_import_meta_url))
-    }
-  },
-  server: {
-    proxy: {
-      "/api": {
-        target: "https://api.konturai.kz",
-        changeOrigin: true,
-        secure: true,
-        configure: (proxy, _options) => {
-          proxy.on("error", (err, _req, _res) => {
-            console.log("proxy error", err);
-          });
-          proxy.on("proxyReq", (proxyReq, req, _res) => {
-            console.log("Sending Request to the Target:", req.method, req.url);
-          });
-          proxy.on("proxyRes", (proxyRes, req, _res) => {
-            console.log("Received Response from the Target:", proxyRes.statusCode, req.url);
-          });
-        }
-      }
-    }
-  }
-});
-export {
-  vite_config_default as default
-};
-//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcubWpzIl0sCiAgInNvdXJjZXNDb250ZW50IjogWyJjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfZGlybmFtZSA9IFwiL1VzZXJzL21hZ3poYW56aHVtYWJhZXYvRGVza3RvcC9rdCBjbG91ZC9zYWthaS12dWVcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfZmlsZW5hbWUgPSBcIi9Vc2Vycy9tYWd6aGFuemh1bWFiYWV2L0Rlc2t0b3Ava3QgY2xvdWQvc2FrYWktdnVlL3ZpdGUuY29uZmlnLm1qc1wiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9pbXBvcnRfbWV0YV91cmwgPSBcImZpbGU6Ly8vVXNlcnMvbWFnemhhbnpodW1hYmFldi9EZXNrdG9wL2t0JTIwY2xvdWQvc2FrYWktdnVlL3ZpdGUuY29uZmlnLm1qc1wiO2ltcG9ydCB7IGZpbGVVUkxUb1BhdGgsIFVSTCB9IGZyb20gJ25vZGU6dXJsJztcblxuaW1wb3J0IHsgUHJpbWVWdWVSZXNvbHZlciB9IGZyb20gJ0BwcmltZXZ1ZS9hdXRvLWltcG9ydC1yZXNvbHZlcic7XG5pbXBvcnQgdnVlIGZyb20gJ0B2aXRlanMvcGx1Z2luLXZ1ZSc7XG5pbXBvcnQgQ29tcG9uZW50cyBmcm9tICd1bnBsdWdpbi12dWUtY29tcG9uZW50cy92aXRlJztcbmltcG9ydCB7IGRlZmluZUNvbmZpZyB9IGZyb20gJ3ZpdGUnO1xuXG4vLyBodHRwczovL3ZpdGVqcy5kZXYvY29uZmlnL1xuZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29uZmlnKHtcbiAgICBvcHRpbWl6ZURlcHM6IHtcbiAgICAgICAgbm9EaXNjb3Zlcnk6IHRydWVcbiAgICB9LFxuICAgIHBsdWdpbnM6IFtcbiAgICAgICAgdnVlKCksXG4gICAgICAgIENvbXBvbmVudHMoe1xuICAgICAgICAgICAgcmVzb2x2ZXJzOiBbUHJpbWVWdWVSZXNvbHZlcigpXVxuICAgICAgICB9KVxuICAgIF0sXG4gICAgcmVzb2x2ZToge1xuICAgICAgICBhbGlhczoge1xuICAgICAgICAgICAgJ0AnOiBmaWxlVVJMVG9QYXRoKG5ldyBVUkwoJy4vc3JjJywgaW1wb3J0Lm1ldGEudXJsKSlcbiAgICAgICAgfVxuICAgIH0sXG4gICAgc2VydmVyOiB7XG4gICAgICAgIHByb3h5OiB7XG4gICAgICAgICAgICAnL2FwaSc6IHtcbiAgICAgICAgICAgICAgICB0YXJnZXQ6ICdodHRwczovL2FwaS5rb250dXJhaS5reicsXG4gICAgICAgICAgICAgICAgY2hhbmdlT3JpZ2luOiB0cnVlLFxuICAgICAgICAgICAgICAgIHNlY3VyZTogdHJ1ZSxcbiAgICAgICAgICAgICAgICBjb25maWd1cmU6IChwcm94eSwgX29wdGlvbnMpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgcHJveHkub24oJ2Vycm9yJywgKGVyciwgX3JlcSwgX3JlcykgPT4ge1xuICAgICAgICAgICAgICAgICAgICAgICAgY29uc29sZS5sb2coJ3Byb3h5IGVycm9yJywgZXJyKTtcbiAgICAgICAgICAgICAgICAgICAgfSk7XG4gICAgICAgICAgICAgICAgICAgIHByb3h5Lm9uKCdwcm94eVJlcScsIChwcm94eVJlcSwgcmVxLCBfcmVzKSA9PiB7XG4gICAgICAgICAgICAgICAgICAgICAgICBjb25zb2xlLmxvZygnU2VuZGluZyBSZXF1ZXN0IHRvIHRoZSBUYXJnZXQ6JywgcmVxLm1ldGhvZCwgcmVxLnVybCk7XG4gICAgICAgICAgICAgICAgICAgIH0pO1xuICAgICAgICAgICAgICAgICAgICBwcm94eS5vbigncHJveHlSZXMnLCAocHJveHlSZXMsIHJlcSwgX3JlcykgPT4ge1xuICAgICAgICAgICAgICAgICAgICAgICAgY29uc29sZS5sb2coJ1JlY2VpdmVkIFJlc3BvbnNlIGZyb20gdGhlIFRhcmdldDonLCBwcm94eVJlcy5zdGF0dXNDb2RlLCByZXEudXJsKTtcbiAgICAgICAgICAgICAgICAgICAgfSk7XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgfVxuICAgICAgICB9XG4gICAgfVxufSk7XG4iXSwKICAibWFwcGluZ3MiOiAiO0FBQTRVLFNBQVMsZUFBZSxXQUFXO0FBRS9XLFNBQVMsd0JBQXdCO0FBQ2pDLE9BQU8sU0FBUztBQUNoQixPQUFPLGdCQUFnQjtBQUN2QixTQUFTLG9CQUFvQjtBQUxnTCxJQUFNLDJDQUEyQztBQVE5UCxJQUFPLHNCQUFRLGFBQWE7QUFBQSxFQUN4QixjQUFjO0FBQUEsSUFDVixhQUFhO0FBQUEsRUFDakI7QUFBQSxFQUNBLFNBQVM7QUFBQSxJQUNMLElBQUk7QUFBQSxJQUNKLFdBQVc7QUFBQSxNQUNQLFdBQVcsQ0FBQyxpQkFBaUIsQ0FBQztBQUFBLElBQ2xDLENBQUM7QUFBQSxFQUNMO0FBQUEsRUFDQSxTQUFTO0FBQUEsSUFDTCxPQUFPO0FBQUEsTUFDSCxLQUFLLGNBQWMsSUFBSSxJQUFJLFNBQVMsd0NBQWUsQ0FBQztBQUFBLElBQ3hEO0FBQUEsRUFDSjtBQUFBLEVBQ0EsUUFBUTtBQUFBLElBQ0osT0FBTztBQUFBLE1BQ0gsUUFBUTtBQUFBLFFBQ0osUUFBUTtBQUFBLFFBQ1IsY0FBYztBQUFBLFFBQ2QsUUFBUTtBQUFBLFFBQ1IsV0FBVyxDQUFDLE9BQU8sYUFBYTtBQUM1QixnQkFBTSxHQUFHLFNBQVMsQ0FBQyxLQUFLLE1BQU0sU0FBUztBQUNuQyxvQkFBUSxJQUFJLGVBQWUsR0FBRztBQUFBLFVBQ2xDLENBQUM7QUFDRCxnQkFBTSxHQUFHLFlBQVksQ0FBQyxVQUFVLEtBQUssU0FBUztBQUMxQyxvQkFBUSxJQUFJLGtDQUFrQyxJQUFJLFFBQVEsSUFBSSxHQUFHO0FBQUEsVUFDckUsQ0FBQztBQUNELGdCQUFNLEdBQUcsWUFBWSxDQUFDLFVBQVUsS0FBSyxTQUFTO0FBQzFDLG9CQUFRLElBQUksc0NBQXNDLFNBQVMsWUFBWSxJQUFJLEdBQUc7QUFBQSxVQUNsRixDQUFDO0FBQUEsUUFDTDtBQUFBLE1BQ0o7QUFBQSxJQUNKO0FBQUEsRUFDSjtBQUNKLENBQUM7IiwKICAibmFtZXMiOiBbXQp9Cg==
diff --git a/Техническое задание №3 Модуль AI-генерации контента,md b/Техническое задание №3 Модуль AI-генерации контента.md
similarity index 100%
rename from Техническое задание №3 Модуль AI-генерации контента,md
rename to Техническое задание №3 Модуль AI-генерации контента.md