# Plan — Polish UI & Features v1.2.0

## Vue d'ensemble
7 améliorations validées par l'utilisateur pour le Minuteur Dragodinde.

---

## Phase 1 — Fondations visuelles (rapide, 0 risque)

### 1.1 Tooltips sur les pills de stats
- **Quoi** : Ajouter un `title="Sérénité"`, `title="Endurance"` etc. sur chaque pill
- **Impact** : Ligne ~1654 (PILL_DEFS forEach) — ajouter un champ `label` et l'injecter en `title=`
- **Complexité** : Très faible (~5 min)
- **Risque** : Aucun

### 1.2 Indication visuelle "en retard" (pause longue)
- **Quoi** : Si un timer est en pause depuis > 5 min, colorer le tab en orange/rouge
- **Impact** :
  - Lignes 1386, 1985 (updateTabDots) — ajouter classe `.paused-long`
  - Détection : `enc.timer.pausedAt && (Date.now() - enc.timer.pausedAt) > 300000`
  - CSS : nouveau style `.tab.paused-long`
- **Complexité** : Faible (~15 min)
- **Risque** : Aucun

---

## Phase 2 — Barre de progression & animations (~1h)

### 2.1 Barre de progression sous chaque tab d'enclos
- **Quoi** : Fine barre colorée (3-4px) sous chaque onglet montrant le % d'avancement global
- **Impact** :
  - Lignes 1341-1420 (renderTabs) — ajouter un `<div class="tab-progress">` dans chaque tab
  - Lignes 1981-1986 (updateTabDots) — mettre à jour la largeur via `gel()`
  - `enclosGlobalState()` fournit déjà `globalMax`, `allDone`, `ddDone`
  - Calcul % : `ddDone / enc.dragodindes.length` ou basé sur le temps écoulé vs totalSec
  - CSS : `.tab-progress { height:3px; background:var(--ok); transition:width .5s }`
- **Complexité** : Moyenne (~30 min)
- **Risque** : Faible — touche le rendu des tabs mais pas la logique

### 2.2 Animations de transition entre onglets
- **Quoi** : Fade-in quand on switch de tab (opacity 0→1)
- **Impact** :
  - Ligne 40 : CSS `.enclos-content` — ajouter `transition: opacity .2s`
  - Ligne 1465 (renderContent) — set opacity 0 avant innerHTML, puis 1 après un rAF
  - Alternative plus simple : classe `.fade-in` avec animation CSS
- **Complexité** : Faible (~20 min)
- **Risque** : Faible — purement visuel, pas de logique métier

---

## Phase 3 — Thème clair/sombre (~1h30)

### 3.1 Système de thème
- **Quoi** : Toggle dans le header pour basculer entre dark (actuel) et light
- **Impact** :
  - Lignes 9-14 : Dupliquer les variables dans `[data-theme="light"]` avec des couleurs claires
  - ~320 occurrences de couleurs dans le fichier, MAIS la majorité utilise déjà `var(--xxx)`
  - **Problème principal** : les couleurs inline dans le JS (ex: `style="color:rgb(192,96,255)"`) ne changent PAS avec les variables CSS
  - Il faudra auditer les styles inline dans renderDDs, renderDashboard, etc.
  - Sauvegarde du choix dans `S.theme` (persisté via save())
  - Toggle : bouton 🌙/☀ dans le header
- **Complexité** : Moyenne-élevée (~1h30)
- **Risque** : Moyen — beaucoup de couleurs inline à vérifier, risque d'oublis visuels
- **Effet de bord** : Les couleurs des jauges (--ser, --end, --mat, --amour, --xp) doivent rester lisibles sur fond clair

---

## Phase 4 — Raccourcis clavier (~30 min)

### 4.1 Raccourcis globaux
- **Quoi** :
  - `Espace` : Play/Pause le timer de l'enclos actif
  - `1-6` : Switch vers l'enclos 1 à 6
  - `D` : Dashboard
  - `N` : Ajouter une DD dans l'enclos actif
- **Impact** :
  - Ajouter un `document.addEventListener('keydown', ...)` en fin de fichier
  - Vérifier que `document.activeElement` n'est pas un input (sinon les raccourcis interfèrent avec la saisie)
- **Complexité** : Faible (~30 min)
- **Risque** : Moyen — doit ignorer les frappes quand un input est focus

---

## Phase 5 — Planificateur journalier (~2h)

### 5.1 Objectifs du jour
- **Quoi** : Nouvel onglet "Objectifs" où l'utilisateur définit ce qu'il veut accomplir aujourd'hui
  - Ex: "Monter 5 DD au level 34", "Baisser sérénité de 3 DD à -5000"
  - Progression auto-calculée à partir des timers actifs
  - Récap fin de journée
- **Impact** :
  - Nouvel onglet dans SPECIAL_TABS
  - Nouveau champ `S.dailyGoals` dans l'état
  - Calcul de progression basé sur les stats actuelles vs objectifs
  - Interface : liste d'objectifs avec barres de progression
- **Complexité** : Élevée (~2h)
- **Risque** : Moyen — nouvelle feature isolée, mais il faut définir précisément ce qu'est "faisable en une journée humaine" (calcul basé sur les taux de jauges)
- **Note utilisateur** : "il faut calculer ce qui est faisable et productible en une journée humaine"

---

## Ordre d'exécution recommandé

| Ordre | Phase | Temps estimé | Dépendances |
|-------|-------|-------------|-------------|
| 1 | 1.1 Tooltips pills | ~5 min | Aucune |
| 2 | 1.2 Indication retard | ~15 min | Aucune |
| 3 | 2.1 Barre progression tabs | ~30 min | Aucune |
| 4 | 2.2 Animations transition | ~20 min | Aucune |
| 5 | 4.1 Raccourcis clavier | ~30 min | Aucune |
| 6 | 3.1 Thème clair/sombre | ~1h30 | Phases 1-2 (pour vérifier le rendu) |
| 7 | 5.1 Planificateur journalier | ~2h | Aucune |

**Total estimé : ~5h**
