feat(ui): unify header and implement navigation drawer (Task 17)

- Redesign top header into clean, uncluttered layout with hamburger drawer trigger, clickable logo, central SRS focus badge, theme toggle and profile avatar
- Implement unified responsive Navigation Drawer for both desktop and mobile with touch swipe-to-dismiss, backdrop blur, keyboard Esc support and background scroll lock
- Streamline mobile bottom tab bar to 4 core actions (Dictionary, SRS, Reader, Menu) with Menu opening the unified drawer
- Synchronize real-time SRS due badges and dictionary word statistics between header, bottom tabs, and drawer
- Eliminate obsolete separate mobile-menu-modal in favor of unified drawer
- Bump Service Worker cache version to notes-v5.7

TODO.md

@@ -377,24 +377,28 @@
 
 ---
 
-### 17. 🍔 Разгрузка хеддера и единая навигация через боковое меню / Drawer (Unified Navigation & Header Redesign)
-- [ ] **Проблема перегруженного хеддера**:
-  - В шапке скопилось 8+ кнопок (`📚 Читалка`, `🎯 Тесты CEFR`, `📖 Грамматика`, `🎓 Тренажёр`, `📊 Статистика`, `📤 Экспорт`, тема, шестеренка, профиль), на экранах планшетов и ноутбуков возникает переполнение и визуальный шум.
-  - Разрозненность UX: на десктопе все кнопки в шапке, на мобильных — нижний таб-бар + модальное меню.
-- [ ] **Единый лаконичный Header (Desktop, Tablet, Mobile)**:
+### 17. 🍔 Разгрузка хеддера и единая навигация через боковое меню / Drawer (Unified Navigation & Header Redesign) (Completed)
+- [x] **Проблема перегруженного хеддера полностью решена**:
+  - Ликвидировано нагромождение из 8+ кнопок в шапке, устранён визуальный шум и горизонтальный сдвиг на планшетах и компактных экранах.
+  - Устранена разрозненность UX: на десктопе, планшете и смартфоне теперь действует единая система навигации.
+- [x] **Единый лаконичный Header (Desktop, Tablet, Mobile)**:
   - Слева: Кнопка вызова бокового меню (Бургер `☰` / `ph-list`), кликабельный логотип `📖 Notes` (возврат в словарь).
-  - Центр: Фокусная кнопка быстрого доступа к активному действию (например, `🎓 Тренажёр SRS` с живым счётчиком повторений `srs-badge`).
-  - Справа: Переключатель темы `🌓`, компактная плашка пользователя/аватар.
-- [ ] **Единый выдвижной Drawer (Боковое меню навигации)**:
-  - Плавная аппаратная анимация (`transform: translateX`, `backdrop-filter: blur`).
+  - Центр: Фокусная кнопка быстрого доступа к главному ежедневному действию (`🎓 Тренажёр SRS` с живым счётчиком повторений `srs-badge`) и компактные счетчики базы (`Всего: X`, `Сегодня: +Y`). На смартфонах счетчики автоматически скрываются, а кнопка сжимается до компактного бейджа `🎓 (N)`.
+  - Справа: Переключатель темы `🌓`, компактная плашка пользователя/аватар `👤 user` (на смартфонах отображается только иконка аватара).
+- [x] **Единый выдвижной Drawer (Боковое меню навигации)**:
+  - Плавная аппаратная анимация (`transform: translateX`, `backdrop-filter: blur(4px)`).
+  - Карточка профиля с аватаром, именем пользователя и описанием.
+  - Интерактивный мини-дашборд статистики (Всего в базе, Сегодня, На повторение).
   - Логическая группировка пунктов с красивыми иконками:
-    - **Обучение & Чтение**: Словарь, Читалка, Тесты CEFR, Грамматика Мерфи, Тренажёр SRS.
-    - **Аналитика**: Статистика обучения и календарь активности (Heatmap).
-    - **Настройки & Профиль**: Экспорт словаря, Смена пароля, Переключение темы, Выход.
+    - **Обучение & Чтение**: Словарь & Поиск, Тренажёр SRS (с живым бейджем), Читалка & Книги, Тесты CEFR (A1–B2), Грамматика Мерфи & Тетрадь.
+    - **Аналитика**: Календарь активности & Статистика (Heatmap).
+    - **Настройки & Профиль**: Экспорт словаря, Сменить пароль, Переключение темы, Выход из аккаунта.
   - Закрытие по клику вне области (оверлей), кнопке `✕`, клавише <kbd>Esc</kbd> и свайпу влево на тач-устройствах (Swipe to dismiss).
   - Блокировка скролла фона (`overflow: hidden` на `body`) при открытом Drawer.
-- [ ] **Оптимизация мобильного режима**:
-  - Согласование с Bottom Tab Bar: оставить на нижней панели только 3-4 ключевых быстрых действия либо полностью перевести навигацию в чистый Drawer-паттерн без дублирования элементов.
+  - Подсветка активного раздела (`.active`), синхронизированная с URL-хэшем и переходами между экранами.
+- [x] **Оптимизация мобильного режима**:
+  - На нижней панели (Bottom Tab Bar) оставлены 4 ключевых быстрых действия: `📖 Словарь`, `🎓 Тренажёр`, `📚 Читалка`, `☰ Меню`.
+  - Тап по `☰ Меню` на мобильном открывает единый Drawer, полностью заменив устаревший отдельный модальный слой `mobile-menu-modal` без дублирования верстки и стилей.
 
 ---