From d5e935401660b3e63c698cd1a8ce5f6c04514c9c Mon Sep 17 00:00:00 2001
From: Antigravity <Antigravity@qpid.pro>
Date: Mon, 5 Oct 2026 15:43:05 +0300
Subject: [PATCH] docs(todo): add mobile layout optimization task 4 and move
 bookmarklet to coming soon

---
 TODO.md | 59 ++++++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 48 insertions(+), 11 deletions(-)

diff --git a/TODO.md b/TODO.md
index d214087..063c6de 100644
--- a/TODO.md
+++ b/TODO.md
@@ -62,7 +62,48 @@
 
 ---
 
-### 4. 🔌 Пул соединений HTTP (`httpx.AsyncClient` с Keep-Alive)
+### 4. 📱 Мобильная оптимизация и адаптивная верстка (iPhone 12 / iOS Safari)
+- [ ] **Системный фундамент iOS и сброс ограничений (Core Foundation)**:
+  - Метатег `viewport`: добавить `viewport-fit=cover` для поддержки челки и нижней панели iPhone.
+  - Устранение бага принудительного авто-зума: установить `font-size: 16px` для `<input>`, `<textarea>`, `<select>` на экранах `≤ 768px` (сохраняя компактные внутренние отступы).
+  - Замена `100vh` на динамические единицы `100dvh` (Dynamic Viewport Height) для модальных окон, оверлеев и экрана авторизации.
+  - Добавление безопасных отступов `env(safe-area-inset-top)` и `env(safe-area-inset-bottom)`.
+  - Предотвращение горизонтального скролла (`overflow-x: hidden` на уровне контейнера приложения).
+- [ ] **Мобильная навигация: переход к нативному паттерну (App Header + Bottom Tab Bar)**:
+  - Компактная верхняя шапка: логотип `📖 Notes`, переключатель темы `🌓`, кнопка вызова профиля/действий.
+  - Фиксированная нижняя панель вкладок (Bottom Tab Bar) с нативным iOS UX:
+    1. 🔍 **Словарь** (Поиск и словарь)
+    2. 🎓 **Тренажёр** (SRS с бейджем количества повторений)
+    3. 📚 **Читалка** (Библиотека книг)
+    4. 📊 **Прогресс** (Статистика и стрик)
+    5. ⚙️ **Меню** (Смена пароля, экспорт, выход)
+  - Сохранение текущей десктопной строки без изменений на больших экранах (`> 768px`).
+- [ ] **Адаптация экрана словаря и карточек (Dictionary & Cards View)**:
+  - Поле поиска/перевода на полную ширину экрана с удобной сенсорной кнопкой «Перевести».
+  - Скрытие неактуальных десктопных подсказок горячих клавиш (`<kbd>Ctrl+Enter</kbd>`) на мобильных устройствах.
+  - Вертикальная раскладка полей метаданных при редактировании карточки (папка, теги, заметка).
+  - Горизонтальный скролл чипсов коллекций и тегов (`overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch`) вместо многострочного переноса.
+  - Увеличенные зоны нажатия (Touch Targets ≥ 44px) для кнопок действий над карточкой (удаление, редактирование, озвучка).
+- [ ] **Интерактивная читалка и переход к Mobile Bottom Sheet**:
+  - Трансформация всплывающего попапа перевода (`reader-word-popup`) в нативную выдвижную нижнюю шторку (Bottom Sheet) на смартфонах:
+    - Заголовок с термином, транскрипцией и бейджем `⭐ В библиотеке`.
+    - Блок перевода и контекстной цитаты книги.
+    - Большая кнопка «💾 Добавить в словарь» под большой палец.
+    - Исключение вылетов за границы экрана и перекрытия текста пальцем.
+  - Двухстрочный адаптивный тулбар читалки (навигация по главам + размер шрифта `A-/A+` и подсветка).
+  - Сетка библиотеки `bookshelf-grid` в одну колонку на экранах `≤ 640px`.
+- [ ] **Тренажёр интервальных повторений (SRS Trainer)**:
+  - Ограничение высоты карточки SRS (`max-height: 48dvh`), чтобы карточка и кнопки оценки гарантированно помещались без вертикального скролла на 390px.
+  - Кнопки оценки (Снова / Трудно / Хорошо / Легко) в сетку 2×2 с высотой от 50px и четкими цветовыми акцентами.
+  - Вертикальный список вариантов в режиме квиза (4 варианта) на всю ширину экрана.
+- [ ] **Модальные окна (Статистика, Пароль, Экспорт)**:
+  - Метрики статистики в сетку 2×2 вместо сжатых 4 колонок.
+  - Плавный горизонтальный скролл календаря активности (Heatmap).
+  - Разворачивание модальных окон в адаптивный мобильный слой с удобной кнопкой закрытия.
+
+---
+
+### 5. 🔌 Пул соединений HTTP (`httpx.AsyncClient` с Keep-Alive)
 - [ ] В [`app/dictionary.py`](file:///home/ai-projects/services/study.qpid.pro/app/dictionary.py) создать синглтон-клиент `get_http_client()` с пулом соединений:
   ```python
   limits = httpx.Limits(max_keepalive_connections=10, max_connections=20)
@@ -72,7 +113,7 @@
 
 ---
 
-### 5. 🗄️ Тюнинг SQLite PRAGMA и составных индексов
+### 6. 🗄️ Тюнинг SQLite PRAGMA и составных индексов
 - [ ] В [`app/database.py`](file:///home/ai-projects/services/study.qpid.pro/app/database.py):
   - Вынести `PRAGMA journal_mode=WAL;` в `init_db()` (убрать избыточный вызов при каждом запросе).
   - Включить параметры производительности памяти Linux:
@@ -85,13 +126,13 @@
 
 ---
 
-### 6. ✂️ Де-блоатинг внешних парсеров (YAGNI)
+### 7. ✂️ Де-блоатинг внешних парсеров (YAGNI)
 - [ ] Удалить лишний сетевой опрос Datamuse (`fetch_datamuse`) — он дублирует определения и перегружает ответ нерелевантными рифмами.
 - [ ] Упростить хрупкий regex-парсинг разметки Wikitext, опираясь на стабильные REST JSON эндпоинты.
 
 ---
 
-### 7. 📚 Локальный оффлайн-словарь (99%+ покрытия со словоформами, SQLite 10–20 МБ)
+### 8. 📚 Локальный оффлайн-словарь (99%+ покрытия со словоформами, SQLite 10–20 МБ)
 - [ ] Создать в SQLite таблицу:
   ```sql
   CREATE TABLE IF NOT EXISTS offline_dictionary (
@@ -113,7 +154,7 @@
 
 ---
 
-### 8. 🧩 Модульность фронтенда на нативных ES-модулях (без Webpack/Vite)
+### 9. 🧩 Модульность фронтенда на нативных ES-модулях (без Webpack/Vite)
 - [ ] Перевести [`app/static/js/app.js`](file:///home/ai-projects/services/study.qpid.pro/app/static/js/app.js) на нативный браузерный синтаксис `<script type="module">`.
 - [ ] Выделить модули с нативным `import/export`:
   - `modules/reader.js` — читалку, блок-парсер и навигацию по главам.
@@ -122,16 +163,12 @@
   - `modules/ui.js` — тосты, модальные окна, темы оформления.
 - [ ] Сохранить полное отсутствие внешних сборщиков (0 npm-пакетов, чистая платформа).
 
----
-
-### 9. 🌐 Быстрый захват из браузера (Bookmarklet)
-- [ ] Создать JavaScript-букмарклет для добавления слова/фразы из любого окна браузера в личный словарь [`study.qpid.pro`](https://study.qpid.pro).
-
-
 ---
 
 ## ⏳ Coming Soon
 
+- [ ] **🌐 Быстрый захват из браузера (Bookmarklet)**:
+  - Создать JavaScript-букмарклет для добавления слова/фразы из любого окна браузера в личный словарь [`study.qpid.pro`](https://study.qpid.pro) (низший приоритет).
 - [ ] **Нативная автономная озвучка (HTML5 Web Speech API / `speechSynthesis`)**:
   - Использовать встроенный в браузер синтезатор речи `window.speechSynthesis` (en-US, en-GB).
   - 0 сетевых запросов к серверу, 100% оффлайн-работа.