Add widget preview and combined widget

- Add live preview iframe in widget settings modal
- Create combined widget (all-in-one: leaderboard + current + progress)
- Add widget type tabs for switching preview
- Update documentation with completed tasks

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

docs/tz-obs-widget.md

@@ -557,41 +557,42 @@ async def validate_widget_token(token: str, marathon_id: int, db: AsyncSession)
 
 ## План реализации
 
-### Этап 1: Backend — модель и токены
-- [ ] Создать модель `WidgetToken`
-- [ ] Миграция для таблицы `widget_tokens`
-- [ ] API создания токена (`POST /marathons/{id}/widget-token`)
-- [ ] API отзыва токена (`DELETE /widget-tokens/{id}`)
-- [ ] Валидация токена
+### Этап 1: Backend — модель и токены ✅
+- [x] Создать модель `WidgetToken`
+- [x] Миграция для таблицы `widget_tokens`
+- [x] API создания токена (`POST /widgets/marathons/{id}/token`)
+- [x] API отзыва токена (`DELETE /widgets/tokens/{id}`)
+- [x] API регенерации токена (`POST /widgets/tokens/{id}/regenerate`)
+- [x] Валидация токена
 
-### Этап 2: Backend — API виджетов
-- [ ] Эндпоинт `/widget/leaderboard`
-- [ ] Эндпоинт `/widget/current`
-- [ ] Эндпоинт `/widget/progress`
-- [ ] Схемы ответов
+### Этап 2: Backend — API виджетов ✅
+- [x] Эндпоинт `/widgets/data/leaderboard`
+- [x] Эндпоинт `/widgets/data/current`
+- [x] Эндпоинт `/widgets/data/progress`
+- [x] Схемы ответов
 - [ ] Rate limiting
 
-### Этап 3: Frontend — страницы виджетов
-- [ ] Роутинг `/widget/*`
-- [ ] Компонент `LeaderboardWidget`
-- [ ] Компонент `CurrentWidget`
-- [ ] Компонент `ProgressWidget`
-- [ ] Polling обновлений
+### Этап 3: Frontend — страницы виджетов ✅
+- [x] Роутинг `/widget/*`
+- [x] Компонент `LeaderboardWidget`
+- [x] Компонент `CurrentWidget`
+- [x] Компонент `ProgressWidget`
+- [x] Polling обновлений (30 сек)
 
-### Этап 4: Frontend — темы и стили
-- [ ] Базовые стили виджетов
-- [ ] Тема Dark
-- [ ] Тема Light
-- [ ] Тема Neon
-- [ ] Поддержка прозрачного фона
-- [ ] Параметры кастомизации через URL
+### Этап 4: Frontend — темы и стили ✅
+- [x] Базовые стили виджетов
+- [x] Тема Dark
+- [x] Тема Light
+- [x] Тема Neon
+- [x] Поддержка прозрачного фона
+- [x] Параметры кастомизации через URL (theme, count, avatars, transparent)
 
-### Этап 5: Frontend — страница настроек
-- [ ] Страница генерации виджетов
-- [ ] Форма настроек (тема, количество и т.д.)
-- [ ] Копирование URL
-- [ ] Превью виджетов
-- [ ] Инструкция по добавлению в OBS
+### Этап 5: Frontend — страница настроек ✅
+- [x] Модальное окно настройки виджетов (WidgetSettingsModal)
+- [x] Форма настроек (тема, количество, аватарки, прозрачность)
+- [x] Копирование URL
+- [x] Превью виджетов (iframe)
+- [x] Инструкция по добавлению в OBS
 
 ### Этап 6: Тестирование
 - [ ] Проверка в OBS Browser Source
@@ -600,6 +601,10 @@ async def validate_widget_token(token: str, marathon_id: int, db: AsyncSession)
 - [ ] Тестирование на разных разрешениях
 - [ ] Проверка производительности (polling)
 
+### Не реализовано (опционально)
+- [x] Комбинированный виджет
+- [ ] Rate limiting для API виджетов
+
 ---
 
 ## Примеры виджетов