From 0bcd8185f0debc8eeefcb3f83a93c2f87bdc89ae Mon Sep 17 00:00:00 2001
From: Millian Lamiaux <millian.lamiaux@adeo.com>
Date: Sat, 21 Feb 2026 00:04:22 +0100
Subject: [PATCH] chore: archive v1 docs and update project documentation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .archive/CLAUDE.md                   |   11 +
 .archive/TabataGo_BDSD_v1.0.md       |  599 ++++++++
 .archive/TabataGo_PDD_v1.0.md        | 1994 ++++++++++++++++++++++++++
 .archive/TabataGo_PRD_v1.1.md        |  597 ++++++++
 .archive/TabataGo_StyleGuide_v1.0.md | 1198 ++++++++++++++++
 app/(tabs)/CLAUDE.md                 |   17 -
 app/CLAUDE.md                        |   22 +-
 app/collection/CLAUDE.md             |   12 +
 app/player/CLAUDE.md                 |    6 +
 app/workout/category/CLAUDE.md       |   13 +
 src/shared/components/CLAUDE.md      |    8 +
 src/shared/constants/CLAUDE.md       |    7 +-
 src/shared/data/CLAUDE.md            |   14 +
 src/shared/hooks/CLAUDE.md           |   16 +
 src/shared/stores/CLAUDE.md          |    8 +-
 src/shared/types/CLAUDE.md           |   12 +
 src/shared/utils/CLAUDE.md           |   12 +
 17 files changed, 4519 insertions(+), 27 deletions(-)
 create mode 100644 .archive/CLAUDE.md
 create mode 100644 .archive/TabataGo_BDSD_v1.0.md
 create mode 100644 .archive/TabataGo_PDD_v1.0.md
 create mode 100644 .archive/TabataGo_PRD_v1.1.md
 create mode 100644 .archive/TabataGo_StyleGuide_v1.0.md
 create mode 100644 app/collection/CLAUDE.md
 create mode 100644 app/workout/category/CLAUDE.md
 create mode 100644 src/shared/data/CLAUDE.md
 create mode 100644 src/shared/hooks/CLAUDE.md
 create mode 100644 src/shared/types/CLAUDE.md
 create mode 100644 src/shared/utils/CLAUDE.md

diff --git a/.archive/CLAUDE.md b/.archive/CLAUDE.md
new file mode 100644
index 0000000..7ab2387
--- /dev/null
+++ b/.archive/CLAUDE.md
@@ -0,0 +1,11 @@
+<claude-mem-context>
+# Recent Activity
+
+<!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5236 | 1:28 PM | 🔵 | Archived TabataGo PRD v1.1 discovered - comprehensive product requirements document | ~462 |
+</claude-mem-context>
\ No newline at end of file
diff --git a/.archive/TabataGo_BDSD_v1.0.md b/.archive/TabataGo_BDSD_v1.0.md
new file mode 100644
index 0000000..67f0e25
--- /dev/null
+++ b/.archive/TabataGo_BDSD_v1.0.md
@@ -0,0 +1,599 @@
+# TabataGo — Brand Design Specification Document (BDSD) v1.0
+
+> Ce document définit l'identité visuelle, le positionnement premium, et les principes esthétiques de TabataGo. Il guide toutes les décisions de design UI.
+
+---
+
+## 1. Vision de Marque
+
+### 1.1 Essence
+
+**TabataGo = Énergie pure, designé pour performer.**
+
+Si TabataGo était une marque existante, ce serait **Gymshark** : jeune, audacieux, communauté, et visuellement impactant. Mais avec une touche **premium exclusive** qui élève l'expérience.
+
+### 1.2 Positionnement
+
+| Attribut | Définition |
+|-----------|------------|
+| **Émotion primaire** | Énergie / Vitalité — l'utilisateur doit se sentir vivant et motivé au premier regard |
+| **Positionnement** | Premium exclusif — haut de gamme, design soigné, pas une app "gratuite générique" |
+| **Adjectifs clés** | Dynamic • Vibrant • Energetic |
+| **Mood global** | Action Sports — comme être dans une salle de sport high-end, la nuit, avec des néons |
+
+### 1.3 Personnalité de Marque
+
+TabataGo est :
+- **Audacieux** — pas peur d'être vibrant et lumineux
+- **Énergique** — chaque élément respire le mouvement
+- **Premium** — jamais cheap, toujours soigné
+- **Motivant** — l'UI pousse l'utilisateur à se dépasser
+
+---
+
+## 2. Direction Visuelle
+
+### 2.1 Palette de Couleurs
+
+#### Couleur Primaire : Orange Energy
+
+L'orange est le cœur de l'identité — il représente l'énergie, la chaleur, l'action.
+
+| Token | Hex | Usage |
+|-------|-----|-------|
+| `ENERGY_500` | `#F97316` | Brand primary, CTA, accents principaux |
+| `ENERGY_400` | `#FB923C` | Glow effects, hover states |
+| `ENERGY_600` | `#EA580C` | Phase WORK, intensity |
+
+#### Fond : Soft Dark
+
+Un dark mode doux et riche, pas un noir pur agressif.
+
+| Token | Hex | Usage |
+|-------|-----|-------|
+| `DARK_BASE` | `#1A1A1E` | Background principal |
+| `DARK_RAISED` | `#222226` | Cards level 1 |
+| `DARK_ELEVATED` | `#2A2A2E` | Cards level 2, modals |
+| `DARK_SURFACE` | `#0A0A0E` | Zones de focus, timer |
+
+#### Accents & Phases
+
+| Token | Hex | Usage |
+|-------|-----|-------|
+| `GLOW_NEON` | `#F97316` + glow | Flamme streak, highlights |
+| `PHASE_WORK` | `#F97316` | Gradient work |
+| `PHASE_REST` | `#3B82F6` | Gradient rest (bleu calme) |
+| `PHASE_READY` | `#EAB308` | Gradient préparation |
+| `SUCCESS` | `#22C55E` | Complétion, streak maintenu |
+
+#### Textes
+
+| Token | Valeur | Usage |
+|-------|--------|-------|
+| `TEXT_PRIMARY` | `#FFFFFF` | Titres, éléments principaux |
+| `TEXT_SECONDARY` | `rgba(255,255,255,0.85)` | Body text |
+| `TEXT_MUTED` | `rgba(255,255,255,0.60)` | Labels secondaires |
+| `TEXT_HINT` | `rgba(255,255,255,0.45)` | Placeholders, hints |
+
+### 2.2 Gradients
+
+**Philosophie : Subtils mais présents.** Les gradients ajoutent de la profondeur sans être agressifs.
+
+#### Gradients de Phase
+
+```css
+/* GET_READY - Ambre chaleureux */
+--gradient-ready: linear-gradient(135deg, #451A03, #92400E, #D97706);
+
+/* WORK - Orange intense avec touche rouge */
+--gradient-work: linear-gradient(135deg, #450A0A, #991B1B, #EA580C);
+
+/* REST - Bleu calme, récupération */
+--gradient-rest: linear-gradient(135deg, #0C1929, #1E3A5F, #2563EB);
+
+/* COMPLETE - Vert succès */
+--gradient-complete: linear-gradient(135deg, #052E16, #166534, #16A34A);
+```
+
+#### Gradients UI
+
+```css
+/* Hero backgrounds - subtle */
+--gradient-dark: linear-gradient(135deg, #0A0A14, #1A0E28, #2D1810);
+
+/* Card hover - très subtil */
+--gradient-card-hover: linear-gradient(135deg, rgba(249,115,22,0.08), rgba(249,115,22,0.02));
+
+/* Button CTA - dimension */
+--gradient-cta: linear-gradient(135deg, #F97316, #FB923C);
+```
+
+### 2.3 Glow & Neon Effects
+
+L'identité TabataGo repose sur des **effets lumineux** qui donnent vie à l'interface.
+
+#### Glow Colors
+
+```css
+/* Glow orange - principal */
+--glow-energy: 0 0 40px rgba(249, 115, 22, 0.5);
+--glow-energy-intense: 0 0 80px rgba(249, 115, 22, 0.7);
+
+/* Glow blanc - éléments actifs */
+--glow-white: 0 0 20px rgba(255, 255, 255, 0.3);
+
+/* Neon flame effect */
+--neon-flame:
+  0 0 10px rgba(249, 115, 22, 0.8),
+  0 0 20px rgba(249, 115, 22, 0.6),
+  0 0 40px rgba(249, 115, 22, 0.4);
+```
+
+#### Applications du Glow
+
+| Élément | Effet |
+|---------|-------|
+| Bouton START | Glow breathing animé (pulse) |
+| Flamme streak | Neon flame effect |
+| Card sélectionnée | Subtle glow border |
+| Phase WORK active | Ambient glow en fond |
+| Countdown ≤3s | Glow rouge qui pulse |
+
+---
+
+## 3. Typographie
+
+### 3.1 Police : Inter
+
+**Pourquoi Inter ?**
+- Excellent rendu sur écran
+- Large gamme de weights pour le contrast mix
+- Tabular nums pour le timer (pas de jitter)
+- Google Fonts — gratuit et performant
+
+### 3.2 Contrast Mix Philosophy
+
+**Heavy pour les titres, light pour le body.** Ce contraste crée de l'impact et de l'élégance.
+
+| Usage | Weight | Size | Exemple |
+|-------|--------|------|---------|
+| Timer countdown | 900 (Black) | 140px | **20** |
+| Brand title | 900 (Black) | 56px | **TABATA** |
+| Headlines | 800 (ExtraBold) | 32px | **Terminé !** |
+| Body text | 400 (Regular) | 16px | Description du programme |
+| Captions | 500 (Medium) | 14px | Labels, hints |
+
+### 3.3 Scale Typographique
+
+```css
+/* Display - Impact maximal */
+--font-countdown: 900 140px/1 Inter;
+--font-display: 900 42px/1.1 Inter;
+--font-headline: 800 28px/1.2 Inter;
+
+/* Interactive */
+--font-button-hero: 900 30px/1 Inter;
+--font-button: 700 18px/1 Inter;
+
+/* Body */
+--font-body: 400 16px/1.5 Inter;
+--font-caption: 500 14px/1.4 Inter;
+--font-overline: 600 11px/1.2 Inter;
+```
+
+### 3.4 Règles Typographiques
+
+1. **Toujours tabular-nums** pour les chiffres du timer
+2. **Letter-spacing généreux** sur les all-caps (+2px minimum)
+3. **Jamais de italic** sauf pour les citations
+4. **Line-height serré** sur les grands titres (1.1)
+
+---
+
+## 4. Iconographie
+
+### 4.1 Style : iOS Native
+
+Utiliser des icônes qui s'intègrent naturellement à l'écosystème iOS, avec le style SF Symbols.
+
+**Caractéristiques :**
+- Lignes medium (ni trop fines ni trop épaisses)
+- Coins arrondis
+- Consistance visuelle
+- Reconnaissance instantanée
+
+### 4.2 Icônes Système
+
+| Action | Icône | Style |
+|--------|-------|-------|
+| Play | ▶️ | SF Symbol `play.fill` |
+| Pause | ⏸️ | SF Symbol `pause.fill` |
+| Stop | ⏹️ | SF Symbol `stop.fill` |
+| Skip | ⏭️ | SF Symbol `forward.fill` |
+| Settings | ⚙️ | SF Symbol `gearshape.fill` |
+| Home | 🏠 | SF Symbol `house.fill` |
+| History | 📊 | SF Symbol `clock.fill` |
+
+### 4.3 Tailles d'Icônes
+
+| Contexte | Taille |
+|----------|--------|
+| Navigation tabs | 24×24px |
+| Boutons controls | 28×28px |
+| Cards (badges) | 16×16px |
+| Headers | 20×20px |
+
+---
+
+## 5. Imagerie & Illustrations
+
+### 5.1 Style : Realistic Photos
+
+**Pas de cartoon, pas d'abstrait.** Des vraies personnes qui font du sport.
+
+**Caractéristiques des photos :**
+- Athlètes en action, pas poses statiques
+- Éclairage dynamique, contrasté
+- Background flou/sombre
+- Diversité de corps et d'origines
+- Qualité haute résolution
+
+### 5.2 Traitement des Photos
+
+```css
+/* Overlay pour intégration dark mode */
+.photo-overlay {
+  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.6) 100%);
+}
+
+/* Warm tint pour cohérence brand */
+.photo-tint {
+  filter: saturate(1.1) sepia(0.1);
+}
+```
+
+### 5.3 GIFs d'Exercices
+
+- Durée : 1-2 secondes, loop seamless
+- Format : 200×200px minimum
+- Fond transparent ou sombre
+- Modèle en tenue fitness neutre
+
+---
+
+## 6. Composants UI
+
+### 6.1 Boutons
+
+#### Primary CTA (Pill Filled)
+
+```css
+.cta-primary {
+  background: linear-gradient(135deg, #F97316, #FB923C);
+  border-radius: 9999px; /* Full pill */
+  padding: 16px 40px;
+  box-shadow: 0 0 40px rgba(249, 115, 22, 0.4);
+}
+
+.cta-primary:active {
+  transform: scale(0.95);
+  box-shadow: 0 0 20px rgba(249, 115, 22, 0.6);
+}
+```
+
+#### Secondary Button
+
+```css
+.cta-secondary {
+  background: rgba(255, 255, 255, 0.08);
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  border-radius: 16px;
+  padding: 12px 24px;
+}
+```
+
+### 6.2 Cards
+
+#### Soft Elevated Cards
+
+```css
+.card {
+  background: rgba(34, 34, 38, 0.8); /* DARK_RAISED */
+  border-radius: 20px;
+  border: 1px solid rgba(255, 255, 255, 0.06);
+  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
+}
+
+.card-selected {
+  border-color: rgba(249, 115, 22, 0.3);
+  background: linear-gradient(135deg, rgba(249,115,22,0.08), rgba(249,115,22,0.02));
+  box-shadow: 0 0 30px rgba(249, 115, 22, 0.2);
+}
+```
+
+### 6.3 Progress Indicators
+
+#### Progress Bar
+
+```css
+.progress-bar {
+  height: 6px;
+  background: rgba(255, 255, 255, 0.08);
+  border-radius: 9999px;
+  overflow: hidden;
+}
+
+.progress-fill {
+  background: linear-gradient(90deg, #F97316, #FB923C);
+  border-radius: 9999px;
+  transition: width 0.3s ease-out;
+}
+```
+
+#### Creative Loading
+
+Style : barre de progression stylisée avec glow.
+
+```css
+.loading-bar {
+  height: 4px;
+  background: rgba(255, 255, 255, 0.1);
+  border-radius: 9999px;
+  overflow: hidden;
+}
+
+.loading-fill {
+  width: 30%;
+  height: 100%;
+  background: linear-gradient(90deg, #F97316, #FB923C);
+  box-shadow: 0 0 10px rgba(249, 115, 22, 0.8);
+  animation: loading-slide 1.5s ease-in-out infinite;
+}
+```
+
+---
+
+## 7. Motion & Animation
+
+### 7.1 Philosophie : Bouncy & Playful
+
+**Les animations doivent sentir vivantes, pas robotiques.**
+
+| Type | Durée | Easing |
+|------|-------|--------|
+| Micro-interactions | 100-200ms | Ease-out |
+| Transitions standard | 300-400ms | Ease-in-out |
+| Animations bouncy | 400-600ms | Spring (damping: 12, stiffness: 180) |
+| Breathing loops | 2000-4000ms | Ease-in-out (loop) |
+
+### 7.2 Animations Clés
+
+#### Glow Breathing (Bouton START)
+
+```css
+@keyframes glow-breathe {
+  0%, 100% {
+    box-shadow: 0 0 30px rgba(249, 115, 22, 0.3);
+    transform: scale(1);
+  }
+  50% {
+    box-shadow: 0 0 60px rgba(249, 115, 22, 0.5);
+    transform: scale(1.02);
+  }
+}
+```
+
+#### Pulse (Countdown)
+
+```css
+@keyframes countdown-pulse {
+  0% { transform: scale(1); }
+  50% { transform: scale(1.03); }
+  100% { transform: scale(1); }
+}
+/* 200ms per tick */
+```
+
+#### Bouncy Pop (Victory)
+
+```css
+@keyframes victory-pop {
+  0% { transform: scale(0.5); opacity: 0; }
+  60% { transform: scale(1.1); }
+  100% { transform: scale(1); opacity: 1; }
+}
+/* 500ms total */
+```
+
+#### Pulsing Circles (Hero)
+
+```css
+@keyframes hero-pulse {
+  0% {
+    transform: scale(0.8);
+    opacity: 0.8;
+  }
+  100% {
+    transform: scale(2);
+    opacity: 0;
+  }
+}
+/* 2000ms, staggered */
+```
+
+### 7.3 Micro-interactions Premium
+
+| Interaction | Feedback |
+|-------------|----------|
+| Tap bouton | `scale(0.95)` + haptic light |
+| Tap card | `scale(0.98)` + border glow fade |
+| Focus input | Border glow animation |
+| Swipe | Resistance elastique |
+| Phase change | Cross-fade 400ms + haptic medium |
+
+---
+
+## 8. Effets Décoratifs
+
+### 8.1 Flamme Neon (Streak)
+
+La flamme représente le streak — elle doit être **lumineuse, dynamic, motivante**.
+
+**Spécifications :**
+- Style : Neon glow flame
+- Animation : Scale pulse + opacity flicker
+- Couleurs : Orange avec halo lumineux
+- Taille : 48-80px selon contexte
+
+```css
+.neon-flame {
+  filter: drop-shadow(0 0 10px rgba(249, 115, 22, 0.8))
+          drop-shadow(0 0 20px rgba(249, 115, 22, 0.6))
+          drop-shadow(0 0 40px rgba(249, 115, 22, 0.4));
+  animation: flame-flicker 800ms ease-in-out infinite;
+}
+
+@keyframes flame-flicker {
+  0%, 100% { opacity: 0.9; transform: scale(1); }
+  50% { opacity: 1; transform: scale(1.05); }
+}
+```
+
+### 8.2 Pulsing Circles (Background Hero)
+
+Utilisés pour les moments de victoire et les écrans hero.
+
+```css
+.hero-circles::before,
+.hero-circles::after {
+  content: '';
+  position: absolute;
+  border-radius: 50%;
+  background: radial-gradient(circle, rgba(249,115,22,0.3), transparent 70%);
+  animation: hero-pulse 2000ms ease-out infinite;
+}
+
+.hero-circles::after {
+  animation-delay: 1000ms;
+}
+```
+
+### 8.3 Floating Particles
+
+Particules subtiles qui flottent en arrière-plan pour ajouter de la vie.
+
+**Spécifications :**
+- Nombre : 20-50 particules
+- Taille : 2-6px
+- Couleur : `rgba(255,255,255,0.1)` à `rgba(249,115,22,0.2)`
+- Mouvement : Slow drift, random
+- Opacité : 0.1-0.3
+
+---
+
+## 9. Spacing & Layout
+
+### 9.1 Whitespace Généreux
+
+Le premium respire. **Plus d'espace = plus d'impact.**
+
+| Token | Valeur | Usage |
+|-------|--------|-------|
+| `space-xs` | 4px | Inline gaps |
+| `space-sm` | 8px | Between related items |
+| `space-md` | 16px | Section padding |
+| `space-lg` | 24px | Between sections |
+| `space-xl` | 40px | Major sections |
+| `space-2xl` | 64px | Hero spacing |
+
+### 9.2 Rounded Corners
+
+| Token | Valeur | Usage |
+|-------|--------|-------|
+| `radius-sm` | 8px | Tags, small elements |
+| `radius-md` | 12px | Buttons medium |
+| `radius-lg` | 16px | Cards |
+| `radius-xl` | 20px | Large cards, bottom sheets |
+| `radius-full` | 9999px | Pills, circles |
+
+---
+
+## 10. Son Design
+
+### 10.1 Philosophie
+
+Les sons doivent être **subtils mais mémorables**. Ils renforcent le feedback sans être intrusifs.
+
+### 10.2 Sons Clés
+
+| Événement | Son | Caractéristiques |
+|-----------|-----|------------------|
+| Bip phase start | Court, percutant | 200ms, fréquence montante |
+| Countdown tick | Click subtil | 100ms, tone medium |
+| Phase WORK start | "Go!" ou bip fort | 300ms, énergique |
+| Victoire complète | Fanfare courte | 1000ms, célébration |
+| Haptic sync | Synchronisé au son | Feedback tactile |
+
+### 10.3 Intégration
+
+- Volume par défaut : 80% pour sons, 60% pour musique
+- Ducking : Sons de phase prioritaire sur musique
+- Respect silent mode (option override)
+
+---
+
+## 11. Inspirations & Références
+
+### 11.1 Apple Fitness+
+
+**Ce qu'on en reprend :**
+- Dark mode élégant avec accents colorés
+- Gradients subtils de phase
+- Typography bold et impactante
+- Animations fluides et premium
+- Rings de progression stylisés
+
+### 11.2 Gymshark
+
+**Ce qu'on en reprend :**
+- Énergie et dynamisme
+- Communauté et motivation
+- Photography realistic fitness
+- Brand bold et young
+
+### 11.3 Gaming UI (référence secondaire)
+
+**Ce qu'on en reprend :**
+- Effets neon/glow
+- Animations bouncy
+- Feedback immédiat et satisfaisant
+- Progress bars créatives
+
+---
+
+## 12. Checklist Brand Consistency
+
+Avant chaque release, vérifier :
+
+- [ ] **Orange utilisé comme accent dominant** (pas dilué)
+- [ ] **Glow effects présents** sur les éléments interactifs clés
+- [ ] **Animations bouncy** et non robotiques
+- [ ] **Whitespace généreux** — pas de surcharge visuelle
+- [ ] **Rounded corners** partout (pas de corners carrés)
+- [ ] **Photos realistic** et non illustrées
+- [ ] **Haptics synchronisés** avec les interactions
+- [ ] **Dark mode soft grey** et non true black
+- [ ] **Contrast typo** (heavy titles, light body)
+- [ ] **Feedback sonore subtil** mais présent
+
+---
+
+## 13. Versions
+
+| Version | Date | Changements |
+|---------|------|-------------|
+| 1.0 | 18 février 2026 | Création initiale |
+
+---
+
+*Document créé le 18 février 2026 — TabataGo BDSD v1.0*
diff --git a/.archive/TabataGo_PDD_v1.0.md b/.archive/TabataGo_PDD_v1.0.md
new file mode 100644
index 0000000..4b70cb6
--- /dev/null
+++ b/.archive/TabataGo_PDD_v1.0.md
@@ -0,0 +1,1994 @@
+# TabataGo — Product Design Document (PDD) v1.0
+
+> Ce document définit l'identité visuelle, les patterns UI/UX, et les spécifications d'interaction pour l'application TabataGo.
+
+---
+
+## 1. Vision Design
+
+### 1.1 Philosophie
+
+**"Immersion totale. Zéro friction. Maximum d'intensité."**
+
+TabataGo n'est pas une simple minuterie — c'est une **expérience**. Chaque élément visuel et sonore est conçu pour :
+
+1. **Plonger l'utilisateur** dans un état de focus intense pendant les 20 secondes de travail
+2. **Éliminer toute distraction** cognitive (pas de décisions à prendre pendant l'effort)
+3. **Créer une boucle émotionnelle** positive qui encourage la régularité
+
+### 1.3 Principes Directeurs
+
+| Principe | Application |
+|----------|-------------|
+| **Dark-first** | L'app est conçue pour le mode sombre par défaut — l'expérience en mode clair est secondaire |
+| **Plein écran immersif** | Pendant la séance, RIEN ne doit distraire : ni barre de navigation, ni notifications |
+| **Feedback immédiat** | Chaque action génère une réponse visuelle, sonore, et/ou haptique |
+| **Progressive disclosure** | L'info complexe est révélée progressivement, jamais en bloc |
+| **Gym-friendly** | L'interface doit être lisible à 2 mètres, avec des gestes simples |
+
+---
+
+## 2. Système de Design
+
+### 2.1 Palette de Couleurs
+
+#### Couleurs de Phase (Cœur de l'expérience)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  IDLE        │  Charcoal Night                                │
+│              │  #1E1E2E → Gradient profond violet/bleu         │
+├─────────────────────────────────────────────────────────────────┤
+│  GET_READY   │  Jaune Ambre                                   │
+│              │  #EAB308 → "Prépare-toi, ça arrive"             │
+├─────────────────────────────────────────────────────────────────┤
+│  WORK        │  Orange Intense (Brand)                        │
+│              │  #F97316 → "Donne tout, maintenant !"           │
+├─────────────────────────────────────────────────────────────────┤
+│  REST        │  Bleu Calme                                    │
+│              │  #3B82F6 → "Respire, récupère"                  │
+├─────────────────────────────────────────────────────────────────┤
+│  COMPLETE    │  Vert Succès                                   │
+│              │  #22C55E → "Bravo, tu l'as fait !"              │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+#### Tokens de Couleur
+
+```typescript
+// === ACCENT ===
+ORANGE: '#F97316'       // Brand primary - CTA, timer actif
+ORANGE_GLOW: '#FB923C'  // Glow effects
+RED_HOT: '#EF4444'      // Danger, derniers secondes
+GOLD: '#FBBF24'         // Streaks, badges
+WHITE: '#FFFFFF'
+
+// === TEXT ===
+PRIMARY: '#FFFFFF'           // Titres
+SECONDARY: 'rgba(255,255,255,0.85)'  // Body
+TERTIARY: 'rgba(255,255,255,0.75)'   // Labels
+MUTED: 'rgba(255,255,255,0.60)'      // Texte secondaire
+HINT: 'rgba(255,255,255,0.45)'       // Placeholders, hints
+
+// === SURFACE ===
+BASE: '#0A0A14'              // Background profond
+RAISED: '#12101F'            // Cards level 1
+ELEVATED: '#1E1E2E'          // Cards level 2
+OVERLAY_LIGHT: 'rgba(255,255,255,0.08)'   // Hover states
+OVERLAY_MEDIUM: 'rgba(255,255,255,0.15)'  // Active states
+OVERLAY_STRONG: 'rgba(255,255,255,0.25)'  // Selected states
+
+// === GLASS (Blur + Translucence) ===
+FILL: 'rgba(255,255,255,0.03)'
+BORDER: 'rgba(255,255,255,0.08)'
+BLUR_HEAVY: 40  // iOS-style toolbar blur
+```
+
+### 2.2 Typographie
+
+**Police principale : Inter** (Google Fonts, variable font)
+
+| Token | Taille | Poids | Usage |
+|-------|--------|-------|-------|
+| `countdown` | 140px | 900 (Black) | Chiffre principal du timer |
+| `timeDisplay` | 72px | 900 (Black) | Durée totale (écran complete) |
+| `brandTitle` | 56px | 900 (Black) | "TABATA" dans le logo |
+| `displayLarge` | 42px | 900 (Black) | Titres onboarding |
+| `displaySmall` | 32px | 900 (Black) | "GO" dans le logo |
+| `buttonHero` | 30px | 900 (Black) | Bouton START principal |
+| `heading` | 24px | 800 (ExtraBold) | Noms d'exercice, sections |
+| `buttonMedium` | 20px | 700 (Bold) | Boutons secondaires |
+| `body` | 18px | 700 (Bold) | Texte courant |
+| `caption` | 16px | 500 (Medium) | Sous-titres |
+| `label` | 15px | 800 (ExtraBold) | Badges, tags |
+| `overline` | 11px | 600 (SemiBold) | Labels uppercase |
+
+**Note importante :** Toutes les valeurs numériques (timer, durées) utilisent `fontVariant: ['tabular-nums']` pour éviter le jitter visuel.
+
+### 2.3 Espacement (Spacing Scale)
+
+```typescript
+SPACING = {
+  0: 0,
+  0.5: 2,
+  1: 4,
+  1.5: 6,
+  2: 8,
+  2.5: 10,
+  3: 12,
+  3.5: 14,
+  4: 16,
+  5: 20,
+  6: 24,
+  7: 28,
+  8: 32,
+  9: 36,
+  10: 40,
+  12: 48,
+  14: 56,
+  16: 64,
+}
+```
+
+### 2.4 Border Radius
+
+```typescript
+RADIUS = {
+  XS: 4,      // Chips, small tags
+  SM: 6,      // Small buttons
+  MD: 8,      // Cards small, badges
+  LG: 12,     // Cards medium
+  XL: 16,     // Cards large, modals
+  2XL: 20,    // Bottom sheets
+  3XL: 24,    // Full-width buttons
+  FULL: 9999, // Pills, circular avatars
+}
+```
+
+---
+
+## 3. Composants UI Principaux
+
+### 3.1 Timer Display (Écran Séance)
+
+**Layout en 4 zones :**
+
+```
+┌─────────────────────────────────────────────────────┐
+│  ZONE HAUTE (10%)                                   │
+│  ┌─────────────────────────────────────────────┐    │
+│  │  🏋️ Burpees                         3/8    │    │
+│  │  (Nom exercice)              (Badge round)  │    │
+│  └─────────────────────────────────────────────┘    │
+├─────────────────────────────────────────────────────┤
+│                                                     │
+│  ZONE CENTRALE (55%)                                │
+│                                                     │
+│            PRÉPARE-TOI                              │
+│                                                     │
+│               17                                    │
+│          (140px, pulsation)                         │
+│                                                     │
+│                                                     │
+├─────────────────────────────────────────────────────┤
+│  ZONE BASSE (35%)                                   │
+│  ┌─────────────────────────────────────────────┐    │
+│  │     ● ● ● ○ ○ ○ ○ ○   (Indicateurs rounds)  │    │
+│  └─────────────────────────────────────────────┘    │
+│  ┌─────────────────────────────────────────────┐    │
+│  │    ⏸️  ⏹️  ⏭️       (Contrôles)             │    │
+│  │    (Toolbar glass-morphism)                  │    │
+│  └─────────────────────────────────────────────┘    │
+└─────────────────────────────────────────────────────┘
+```
+
+**Comportement par phase :**
+
+| Phase | Fond | Timer | Label | Animation |
+|-------|------|-------|-------|-----------|
+| IDLE | Gradient sombre | — | — | Glow breathing |
+| GET_READY | Gradient jaune/ambre | Pulsation | "PRÉPARE-TOI" | Fade in du nom d'exercice |
+| WORK | Gradient rouge/orange | Pulsation forte | "GO !" | Glow orange intensif |
+| REST | Gradient bleu | Pulsation douce | "REPOS" | Affiche "Prochain : [exercice]" |
+| COMPLETE | Gradient vert | — | "TERMINÉ !" | Spring bouncy |
+
+**Transitions :**
+- Cross-fade 400ms entre les gradients de phase
+- Pulse du chiffre à chaque seconde écoulée
+- Flash rouge si ≤3 secondes restantes
+
+### 3.2 Bouton Start (IDLE Screen)
+
+**Spécifications :**
+- Taille : 150×150px, parfaitement rond
+- Couleur : `#F97316` (Orange brand)
+- Glow : `#F97316` avec `opacity: 0.3 → 0.6` en breathing (4s cycle)
+- Shadow : `0 0 60px rgba(249,115,22,0.5)`
+- Press state : `scale(0.95)`
+
+**Animation breathing :**
+```typescript
+Animated.loop(
+  Animated.sequence([
+    Animated.timing(glowAnim, { toValue: 1, duration: 2000 }),
+    Animated.timing(glowAnim, { toValue: 0, duration: 2000 }),
+  ])
+)
+```
+
+### 3.3 Controls Bar (Toolbar)
+
+**Style glass-morphism iOS :**
+```typescript
+<BlurView intensity={40} tint="dark">
+  {/* Round indicators */}
+  {/* Pause / Stop / Skip buttons */}
+</BlurView>
+```
+
+**Boutons :**
+- Fond : `rgba(255,255,255,0.15)` avec border `rgba(255,255,255,0.08)`
+- Taille : 56×56px
+- Border radius : 16px
+- Press : `scale(0.92)` + haptics léger
+
+### 3.4 Indicateurs de Round
+
+**8 dots horizontaux :**
+- Dot vide : 8×8px, `rgba(255,255,255,0.15)`
+- Dot rempli : 8×8px, `rgba(255,255,255,0.85)`
+- Dot actif : 12×12px, `#FFFFFF` avec glow blanc
+
+### 3.5 Program Card (Home Screen)
+
+**Dimensions :** `SCREEN_WIDTH - 48` de largeur
+
+**Structure :**
+```
+┌─────────────────────────────────────────────────────┐
+│  ✓ (selected)          BEGINNER (badge)   ◉ (mode) │
+│                                                     │
+│  Tabata Classic                                     │
+│  8 rounds de Burpees pour commencer en force       │
+│                                                     │
+│  ┌──────────────┐  +  ┌──────────────┐             │
+│  │   Burpees    │     │  Squats      │             │
+│  └──────────────┘     └──────────────┘             │
+│  ───────────────────────────────────────────────    │
+│       8 rounds     │      4 min      │     1 ex.   │
+│                                                     │
+│            Toucher pour détails                     │
+└─────────────────────────────────────────────────────┘
+```
+
+**États :**
+- Default : fond `rgba(255,255,255,0.03)`, border `rgba(255,255,255,0.08)`
+- Selected : fond avec gradient orange `rgba(249,115,22,0.12)` + checkmark orange
+
+---
+
+## 4. Flows Utilisateur
+
+### 4.1 Onboarding (6 Écrans)
+
+**Navigation :** Boutons Précédent / Suivant en bas de chaque écran
+
+**Indicateurs de progression :** 6 dots en bas, le dot actif est rempli
+
+---
+
+#### Écran 1 — Le Problème (Accroche)
+
+**Objectif :** Identifier la douleur (manque de temps)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│                                                                 │
+│                    ⏰                            │
+│              (Animation horloge qui se fragmente)              │
+│                                                                 │
+│                                                                 │
+│              "Tu n'as pas 1 heure                              │
+│               pour la salle.                                   │
+│               Personne n'en a."                                │
+│                                                                 │
+│              "Et pourtant tu veux                              │
+│               progresser.                                      │
+│               On a la solution."                               │
+│                                                                 │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                     SUIVANT  →                          │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│                     ● ○ ○ ○ ○ ○                                │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Animation horloge | Lottie 120×120px, loop |
+| Titre principal | `TYPOGRAPHY.displayLarge` (42px), `TEXT.PRIMARY` |
+| Sous-titre | `TYPOGRAPHY.body`, `TEXT.MUTED` |
+| Bouton | Full-width pill, `BRAND.PRIMARY` |
+| Haptic | `impactAsync(Medium)` au tap |
+
+---
+
+#### Écran 2 — L'Empathie (Choix)
+
+**Objectif :** Faire sentir l'utilisateur compris
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│              "Qu'est-ce qui t'empêche                          │
+│               de t'entraîner ?"                                │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │  😰  Manque de temps                                     │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │  😔  Motivation en berne                                 │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │  🤔  Je ne sais pas quoi faire                           │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │  🏠  Je n'ai pas accès à une salle                       │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                     SUIVANT  →                          │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│                     ○ ● ○ ○ ○ ○                                │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Question | `TYPOGRAPHY.heading`, `TEXT.PRIMARY` |
+| Option card | Height 56px, `SURFACE.OVERLAY_LIGHT` |
+| Option sélectionnée | Border `BRAND.PRIMARY`, bg `rgba(249,115,22,0.1)` |
+| Emoji | 24px |
+| Texte option | `TYPOGRAPHY.body`, `TEXT.SECONDARY` |
+
+**Comportement :**
+- Multi-select autorisé (jusqu'à 2 choix)
+- La réponse est stockée pour personnaliser la suite
+- Le bouton "Suivant" est désactivé tant qu'aucun choix
+
+---
+
+#### Écran 3 — La Solution (Preuves)
+
+**Objectif :** Convaincre avec des preuves scientifiques + comparaison
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│                     "4 minutes."                               │
+│              "Vraiment transformatrices."                      │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                                                         │   │
+│  │   📊 TABATA (4 min)    vs    CARDIO (30 min)           │   │
+│  │                                                         │   │
+│  │   ████████████████         ████████████████            │   │
+│  │        85 kcal                   90 kcal                │   │
+│  │                                                         │   │
+│  │   "Autant de calories en 7x moins de temps"            │   │
+│  │                                                         │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                                                         │   │
+│  │   🧬 "La méthode Tabata augmente la capacité           │   │
+│  │       aérobie et anaérobie simultanément."             │   │
+│  │                                                         │   │
+│  │       — Dr. Izumi Tabata, 1996                         │   │
+│  │                                                         │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                     SUIVANT  →                          │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│                     ○ ○ ● ○ ○ ○                                │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Titre | `TYPOGRAPHY.displayLarge`, `TEXT.PRIMARY` |
+| Graphique | Barres comparatives animées |
+| Barre Tabata | `BRAND.PRIMARY` |
+| Barre Cardio | `TEXT.MUTED` |
+| Citation | `TYPOGRAPHY.caption`, `TEXT.TERTIARY`, italique |
+| Auteur | `TYPOGRAPHY.overline`, `TEXT.HINT` |
+
+**Animation :**
+- Les barres grandissent de 0 à leur hauteur finale (600ms)
+- La citation fade-in après les barres (300ms delay)
+
+---
+
+#### Écran 4 — Le Moment "Wow" (Mini-Démo)
+
+**C'est le moment critique de conversion.**
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│                  "Essaie maintenant"                           │
+│              "20 secondes. Juste pour sentir."                 │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                                                         │   │
+│  │                     GET READY                           │   │
+│  │                                                         │   │
+│  │                        10                               │   │
+│  │               (Mini-timer 140px)                        │   │
+│  │                                                         │   │
+│  │         [GIF exercice - Burpees 120×120]               │   │
+│  │                                                         │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│       "Prépare-toi... Le timer va bientôt commencer !"         │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                  C'ÉTAIT FACILE !                       │   │
+│  │          (Apparaît après completion)                    │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│                     ○ ○ ○ ● ○ ○                                │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Séquence :**
+1. Affichage initial : Timer à 10s GET_READY
+2. Timer décompte 10→0 avec sons + haptics
+3. Transition automatique vers 20s WORK
+4. Timer décompte 20→0 avec phase orange
+5. Fin → Affichage "C'était facile !" en fade-in + haptics succès
+
+**Comportement :**
+- Auto-start après 2 secondes sur l'écran
+- Sons + vibrations activés
+- Le bouton n'apparaît qu'après completion
+- Tap "C'était facile !" → écran suivant
+
+---
+
+#### Écran 5 — Personnalisation
+
+**Objectif :** Créer un investissement personnel
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│            "Configurons ta première semaine."                  │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                                                         │   │
+│  │   Ton niveau fitness                                    │   │
+│  │                                                         │   │
+│  │   ○ Débutant    ○ Intermédiaire    ○ Avancé           │   │
+│  │                                                         │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                                                         │   │
+│  │   Ton objectif                                          │   │
+│  │                                                         │   │
+│  │   ○ Perte de poids    ○ Cardio    ○ Force    ○ Zen   │   │
+│  │                                                         │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                                                         │   │
+│  │   Fréquence souhaitée                                   │   │
+│  │                                                         │   │
+│  │   ○ 2x/semaine    ○ 3x/semaine    ○ 5x/semaine        │   │
+│  │                                                         │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │   Comment tu t'appelles ?    [________Marie________]  │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                     SUIVANT  →                          │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│                     ○ ○ ○ ○ ● ○                                │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Titre section | `TYPOGRAPHY.overline`, `TEXT.HINT` |
+| Options | Radio buttons horizontaux |
+| Option sélectionnée | `BRAND.PRIMARY` border + fill |
+| Input prénom | Full-width, bg `SURFACE.OVERLAY_LIGHT` |
+
+**Données collectées :**
+- Niveau → influence les programmes suggérés
+- Objectif → influence le ton des messages
+- Fréquence → influence les rappels de notification
+- Prénom → personnalise le greeting sur Home
+
+---
+
+#### Écran 6 — Paywall
+
+**Objectif :** Convertir avec l'essai gratuit
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│                "Continue sur ta lancée.                        │
+│                 Sans limite."                                  │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │                                                         │   │
+│  │   ✨ Passe Premium                                      │   │
+│  │                                                         │   │
+│  │   ✓ Programmes illimités                               │   │
+│  │   ✓ Cycles multiples                                   │   │
+│  │   ✓ Stats avancées                                     │   │
+│  │   ✓ Widgets iOS/Android                                │   │
+│  │   ✓ Sans publicité                                     │   │
+│  │                                                         │   │
+│  │   ┌───────────────────────────────────────────────┐    │   │
+│  │   │  ○ $4.99/mois                                 │    │   │
+│  │   ├───────────────────────────────────────────────┤    │   │
+│  │   │  ● $29.99/an     ÉCONOMISE 50%      ★ BEST   │    │   │
+│  │   └───────────────────────────────────────────────┘    │   │
+│  │                                                         │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │              COMMENCER L'ESSAI GRATUIT                  │   │
+│  │                    (7 jours)                            │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+│            Annule à tout moment • Satisfait ou remboursé       │
+│                                                                 │
+│              [ Continuer sans abonnement ]                     │
+│                                                                 │
+│                     ○ ○ ○ ○ ○ ●                                │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Titre | `TYPOGRAPHY.heading`, `TEXT.PRIMARY` |
+| Liste avantages | `TYPOGRAPHY.body`, `TEXT.SECONDARY` |
+| Checkmark | `BRAND.SUCCESS` |
+| Prix | `TYPOGRAPHY.heading`, `TEXT.PRIMARY` |
+| Badge "BEST" | Small pill, `BRAND.PRIMARY` |
+| CTA principal | Full-width, `BRAND.PRIMARY` |
+| Lien secondaire | `TYPOGRAPHY.caption`, `TEXT.HINT` |
+
+**Comportement :**
+- Essai gratuit 7 jours sélectionné par défaut
+- "Continuer sans abonnement" → accès limité Free
+- RevenueCat gère l'abonnement
+
+---
+
+### 4.2 Flow Principal (Post-Onboarding)
+
+```
+┌──────────────┐     ┌──────────────┐     ┌──────────────┐
+│              │     │              │     │              │
+│   HOME       │────▶│   PROGRAM    │────▶│    TIMER     │
+│   (Tab 1)    │     │   DETAIL     │     │   (Active)   │
+│              │     │   (Modal)    │     │              │
+└──────────────┘     └──────────────┘     └──────────────┘
+       │                                         │
+       │                                         │
+       ▼                                         ▼
+┌──────────────┐                         ┌──────────────┐
+│   HISTORY    │                         │   COMPLETE   │
+│   (Tab 2)    │                         │   (Victory)  │
+│              │                         │              │
+└──────────────┘                         └──────────────┘
+```
+
+### 4.3 Flow Timer Détaillé
+
+```
+IDLE ───(START)──▶ GET_READY ───(auto)──▶ WORK ───(auto)──▶ REST
+  │                    │                       │              │
+  │                    │                       │              │
+  │                    │                       │              │
+  ▼                    ▼                       ▼              ▼
+  │               10 secondes             20 secondes    10 secondes
+  │                    │                       │              │
+  │                    │                       │              │
+  │                    └───────────────────────┴──────────────┘
+  │                                        │
+  │                                   (Boucle × rounds)
+  │                                        │
+  │                                        ▼
+  │                                   COMPLETE
+  │                                        │
+  └────────────────────────────────────────┘
+```
+
+**Interactions pendant le timer :**
+- ⏸️ Pause : Gèle le timer, affiche "EN PAUSE"
+- ▶️ Resume : Reprend là où on s'était arrêté
+- ⏹️ Stop : Confirme l'arrêt → retour HOME
+- ⏭️ Skip : Passe à la phase suivante (haptic léger)
+
+---
+
+## 5. Animations & Motion
+
+### 5.1 Constantes d'Animation
+
+```typescript
+// Durées
+DURATION = {
+  INSTANT: 100,      // Feedback immédiat
+  FAST: 200,         // Micro-interactions
+  NORMAL: 300,       // Transitions standards
+  SLOW: 400,         // Cross-fades, reveals
+  BREATHING: 2000,   // Animations cycliques
+}
+
+// Easing
+EASING = {
+  STANDARD: Easing.inOut(Easing.cubic),
+  DECELERATE: Easing.out(Easing.cubic),
+  BOUNCE: Easing.elastic(1.2),
+}
+
+// Spring configs
+SPRING = {
+  GENTLE: { damping: 20, stiffness: 150 },
+  BOUNCY: { damping: 12, stiffness: 180 },
+  SNAPPY: { damping: 25, stiffness: 300 },
+}
+```
+
+### 5.2 Animations par Composant
+
+| Composant | Animation | Durée | Easing |
+|-----------|-----------|-------|--------|
+| Timer countdown | Pulse scale (1.0 → 1.03 → 1.0) | 200ms | Decelerate |
+| Phase gradient | Cross-fade opacity | 400ms | Standard |
+| Button press | Scale (1.0 → 0.95) | 100ms | Instant |
+| Card selection | Border glow fade-in | 200ms | Standard |
+| Victory title | Scale spring (0.5 → 1.0) | 500ms | Bouncy |
+| Glow breathing | Opacity (0.3 → 0.6 → 0.3) | 4000ms | Standard |
+
+### 5.3 Haptics
+
+| Événement | Type Haptic |
+|-----------|-------------|
+| Appui sur bouton | `impactAsync(Light)` |
+| Changement de phase | `impactAsync(Medium)` |
+| Fin de séance | `notificationAsync(Success)` |
+| Dernières 3 secondes | `impactAsync(Light)` à chaque seconde |
+| Skip phase | `impactAsync(Light)` |
+
+---
+
+## 6. Responsive Design
+
+### 6.1 Breakpoints
+
+```typescript
+// Dimensions cibles
+const SCREEN = {
+  WIDTH: Dimensions.get('window').width,
+  HEIGHT: Dimensions.get('window').height,
+}
+
+// Adaptations
+const isSmallDevice = SCREEN.WIDTH < 375  // iPhone SE
+const isLargeDevice = SCREEN.WIDTH > 414  // iPhone Plus/Max
+```
+
+### 6.2 Adaptations
+
+| Élément | Small (<375px) | Default | Large (>414px) |
+|---------|----------------|---------|----------------|
+| Timer font | 120px | 140px | 160px |
+| Card padding | 16px | 24px | 28px |
+| Button height | 48px | 54px | 60px |
+| CTA width | 130px | 150px | 170px |
+
+### 6.3 Safe Areas
+
+Tous les écrans respectent `react-native-safe-area-context` :
+- `paddingTop: insets.top` pour le notch
+- `paddingBottom: insets.bottom` pour la home indicator
+
+---
+
+## 7. Accessibilité
+
+### 7.1 Requirements Minimum
+
+| Critère | Implémentation |
+|---------|----------------|
+| Contraste | WCAG AA minimum (4.5:1 pour texte) |
+| Taille tactile | Minimum 44×44px pour tous les boutons |
+| Font scaling | Respecter `Dynamic Type` iOS et font scale Android |
+| VoiceOver | Labels sur tous les éléments interactifs |
+| Réduction mouvement | Respecter `AccessibilityInfo.reduceMotionEnabled` |
+
+### 7.2 Labels VoiceOver
+
+```typescript
+<Pressable
+  accessibilityLabel="Démarrer la séance"
+  accessibilityHint="Double-tap pour commencer"
+  accessibilityRole="button"
+>
+```
+
+---
+
+## 8. États & Edge Cases
+
+### 8.1 États de Timer
+
+| État | Affichage |
+|------|-----------|
+| IDLE | Bouton START pulsant, config visible |
+| RUNNING | Timer actif, contrôles visibles |
+| PAUSED | "EN PAUSE" overlay, timer figé |
+| BACKGROUND | Notification sticky avec countdown |
+| COMPLETE | Écran victoire avec stats |
+
+### 8.2 Gestion d'Erreurs
+
+| Erreur | Comportement UI |
+|--------|-----------------|
+| Audio load fail | Toast discret "Son non disponible" |
+| Network error | "Mode offline activé" |
+| Storage full | Alerte + suggestion de cleanup |
+
+### 8.3 Interruptions
+
+| Interruption | Comportement |
+|--------------|--------------|
+| Appel entrant | Pause automatique |
+| App backgrounded | Timer continue, notification visible |
+| App killed | Au retour : "Séance interrompue — Reprendre ?" |
+
+---
+
+## 9. Iconographie
+
+### 9.1 Icônes Timer Controls
+
+| Action | Icône | Source |
+|--------|-------|--------|
+| Play | ▶️ | Ionicons `play` |
+| Pause | ⏸️ | Ionicons `pause` |
+| Stop | ⏹️ | Ionicons `stop` |
+| Skip | ⏭️ | Ionicons `play-skip-forward` |
+
+### 9.2 Icônes Tab Bar
+
+| Tab | Icône | Label |
+|-----|-------|-------|
+| Home | 🏠 | `home` |
+| History | 📊 | `time` |
+| Settings | ⚙️ | `settings` |
+
+---
+
+## 10. Spécifications par Écran
+
+### 10.1 Home Screen (Tab 1)
+
+**Objectif :** Motiver l'utilisateur avec sa progression (streak #1) + lancer rapidement une séance
+
+**Émotion cible :** Énergie / Motivation — "Je peux le faire, c'est parti !"
+
+---
+
+#### 10.1.1 Layout Global (Scroll Vertical)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  NOTCH / STATUS BAR                                             │
+├─────────────────────────────────────────────────────────────────┤
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 1 : HEADER + GREETING                          │    │
+│  │                                                         │    │
+│  │     🏆 7 JOURS                    🔥 (flamme animée)    │    │
+│  │                                                         │    │
+│  │     "Bonjour Marie, prêt à transpirer ?"               │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 2 : MINI CALENDRIER (semaine)                  │    │
+│  │                                                         │    │
+│  │     L    M    M    J    V    S    D                    │    │
+│  │     ●    ●    ○    ●    ●    ○    ○                    │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 3 : STATS RAPIDES                              │    │
+│  │                                                         │    │
+│  │     📊 24 séances        🔥 1,250 kcal                  │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 4 : PROGRAMME SUGGÉRÉ (Hero Card)              │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  ★ RECOMMANDÉ                          BEGINNER │    │    │
+│  │  │                                                 │    │    │
+│  │  │  Tabata Classic                                 │    │    │
+│  │  │  8 rounds de Burpees pour commencer            │    │    │
+│  │  │                                                 │    │    │
+│  │  │  ┌──────────┐                                  │    │    │
+│  │  │  │ Burpees  │   8 rounds • 4 min • 1 ex.      │    │    │
+│  │  │  └──────────┘                                  │    │    │
+│  │  │                                                 │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 5 : AUTRES PROGRAMMES (Liste verticale)        │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  Tabata Duo                            ◇ INTERM │    │    │
+│  │  │  Squats + Push-ups alternés                     │    │    │
+│  │  │  8 rounds • 4 min • 2 ex.                       │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  Cardio Burn                          ◉ ADVANCE │    │    │
+│  │  │  High knees + Burpees + Jump squats            │    │    │
+│  │  │  8 rounds • 4 min • 4 ex.                       │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  │  [ Voir tous les programmes → ]                        │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+├─────────────────────────────────────────────────────────────────┤
+│  SECTION 6 : CTA FIXE (sticky bottom)                          │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │                      START                              │    │
+│  │              (Bouton pulsant 150×150)                   │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│      Tabata Classic • 4 min • 8 rounds                         │
+│                                                                 │
+├─────────────────────────────────────────────────────────────────┤
+│  TAB BAR (Home | History | Settings)                           │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+#### 10.1.2 Section par Section
+
+##### **Section 1 : Header + Greeting**
+
+| Élément | Spécification |
+|---------|---------------|
+| Streak counter | `TYPOGRAPHY.displaySmall` (32px, 900), `BRAND.PRIMARY` |
+| Flamme | Animation Lottie ou séquence d'images (60×60px) |
+| Greeting | "Bonjour [Prénom], prêt à transpirer ?" — `TYPOGRAPHY.body` (18px) |
+| Couleur texte | `TEXT.PRIMARY` pour le streak, `TEXT.SECONDARY` pour le greeting |
+
+**Animation flamme :**
+- Cycle 800ms : scale 1.0 → 1.1 → 1.0
+- Opacity flicker subtil : 0.9 → 1.0 → 0.9
+- Trigger : si streak ≥ 3 jours
+
+##### **Section 2 : Mini Calendrier Semaine**
+
+| Élément | Spécification |
+|---------|---------------|
+| Layout | 7 colonnes égales (L M M J V S D) |
+| Jour actif (séance faite) | Dot plein 12×12px, `BRAND.PRIMARY` |
+| Jour inactif | Dot vide 12×12px, border `BORDER.LIGHT` |
+| Jour actuel | Dot 16×16px avec glow `BRAND.PRIMARY` |
+| Labels | `TYPOGRAPHY.overline` (11px), `TEXT.HINT` |
+
+**Gamification :**
+- Si 7/7 jours actifs → animation de célébration (confettis ou badge "Parfait !")
+
+##### **Section 3 : Stats Rapides**
+
+| Élément | Spécification |
+|---------|---------------|
+| Layout | 2 colonnes égales |
+| Icône | 24×24px, `TEXT.MUTED` |
+| Valeur | `TYPOGRAPHY.heading` (24px, 800), `TEXT.PRIMARY` |
+| Label | `TYPOGRAPHY.caption` (16px), `TEXT.MUTED` |
+
+**Données :**
+- Séances totales : nombre de séances complétées depuis le début
+- Calories : estimation basée sur durée × intensité (arrondi)
+
+##### **Section 4 : Programme Suggéré (Hero Card)**
+
+| Élément | Spécification |
+|---------|---------------|
+| Badge "RECOMMANDÉ" | `TYPOGRAPHY.overline`, bg `rgba(249,115,22,0.15)`, `BRAND.PRIMARY` |
+| Badge difficulté | Voir 10.1.4 ci-dessous |
+| Titre programme | `TYPOGRAPHY.heading` (24px, 800), `TEXT.PRIMARY` |
+| Description | `TYPOGRAPHY.body` (18px, 700), `TEXT.MUTED` |
+| Exercice tag | Pill `RADIUS.MD`, bg `rgba(249,115,22,0.12)`, `BRAND.PRIMARY` |
+| Métadonnées | `TYPOGRAPHY.caption`, `TEXT.HINT` |
+
+**Logique de suggestion :**
+- J+1 après onboarding → "Tabata Classic" (beginner)
+- Si séance faite hier → programme différent suggéré
+- Si 7+ séances → programme plus avancé suggéré
+
+##### **Section 5 : Autres Programmes (Liste)**
+
+| Élément | Spécification |
+|---------|---------------|
+| Card height | 100px approx |
+| Card bg | `SURFACE.OVERLAY_LIGHT`, border `BORDER.LIGHT` |
+| Press state | `SURFACE.OVERLAY_MEDIUM` + `scale(0.98)` |
+| Mode icône | ◉ SINGLE, ◇ DUO, ◈ CIRCUIT — `BRAND.PRIMARY` |
+
+**Interactions :**
+- Tap card → sélectionne le programme + met à jour le CTA
+- "Voir tous les programmes →" → modal plein écran avec tous les programmes
+
+##### **Section 6 : CTA Fixe (Sticky Bottom)**
+
+| Élément | Spécification |
+|---------|---------------|
+| Container | `position: absolute, bottom: TAB_BAR_HEIGHT + insets.bottom` |
+| Bouton | 150×150px, circulaire, `BRAND.PRIMARY` |
+| Glow | 172×172px derrière, opacity 0.3→0.6 en breathing (4s) |
+| Texte | "START" — `TYPOGRAPHY.buttonHero` (30px, 900) |
+| Hint | Programme sélectionné + durée + rounds — `TYPOGRAPHY.caption` |
+
+**Animation bouton pulsant :**
+```typescript
+Animated.loop(
+  Animated.sequence([
+    Animated.timing(pulseAnim, {
+      toValue: 1.05,
+      duration: 800,
+      easing: EASING.STANDARD,
+    }),
+    Animated.timing(pulseAnim, {
+      toValue: 1,
+      duration: 800,
+      easing: EASING.STANDARD,
+    }),
+  ])
+)
+```
+
+**Press :**
+- `scale(0.95)` + `Haptics.impactAsync(Medium)`
+- Navigate vers `/timer`
+
+---
+
+#### 10.1.3 Badges de Difficulté
+
+| Niveau | Couleur texte | Background |
+|--------|---------------|------------|
+| BEGINNER | `#4ADE80` (vert) | `rgba(74, 222, 128, 0.15)` |
+| INTERMEDIATE | `#FBBF24` (or) | `rgba(251, 191, 36, 0.15)` |
+| ADVANCED | `#F87171` (rouge) | `rgba(248, 113, 113, 0.15)` |
+
+#### 10.1.4 Mode Icônes (Programmes)
+
+| Mode | Icône | Description |
+|------|-------|-------------|
+| SINGLE | ◉ | 1 exercice répété × 8 rounds |
+| DUO | ◇ | 2 exercices alternés |
+| CIRCUIT_4 | ◈ | 4 exercices en circuit |
+
+---
+
+#### 10.1.5 États Spéciaux
+
+| État | Affichage |
+|------|-----------|
+| Nouvel utilisateur (J+0) | Streak = 0, message "Commence ton aventure !" |
+| Streak cassé | "Ton streak était de X jours. Relance-le !" |
+| Nouveau record (7 jours) | Confettis + badge "🔥 7 jours de suite !" |
+| Pas de séance hier | Message doux : "Hier c'était repos. Aujourd'hui on y va !" |
+
+---
+
+#### 10.1.6 Interactions Résumées
+
+| Action | Résultat |
+|--------|----------|
+| Tap sur Hero Card | Déplie les détails (exercices, durée) |
+| Tap sur autre programme | Sélectionne + met à jour le CTA |
+| Tap "Voir tous" | Modal plein écran avec grille de programmes |
+| Tap START | Haptic + navigate `/timer` |
+| Scroll | Le CTA reste sticky en bas |
+
+---
+
+### 10.2 Timer Screen (Plein écran)
+
+**Objectif :** Focus total, zéro distraction — l'utilisateur ne voit QUE ce qui compte
+
+**Émotion cible :** Immersion intense, flow state
+
+---
+
+#### 10.2.1 Layout (Single View)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  GRADIENT DE PHASE (fond plein écran)                          │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  ZONE HAUTE (15%)                                       │    │
+│  │                                                         │    │
+│  │              🏋️ Burpees                         3/8    │    │
+│  │              (Nom exercice)              (Badge round)  │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  ZONE CENTRALE (60%)                                    │    │
+│  │                                                         │    │
+│  │         ┌─────────────────────────────────┐            │    │
+│  │         │                                 │            │    │
+│  │         │     [GIF EXERCICE 180×180]      │            │    │
+│  │         │     (Animation boucle)          │            │    │
+│  │         │                                 │            │    │
+│  │         └─────────────────────────────────┘            │    │
+│  │                                                         │    │
+│  │                    PRÉPARE-TOI                          │    │
+│  │                  (Label phase)                          │    │
+│  │                                                         │    │
+│  │                      17                                 │    │
+│  │                (140px countdown)                        │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  ZONE BASSE (25%)                                       │    │
+│  │                                                         │    │
+│  │  ████████████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░  │    │
+│  │  (Progress bar - progression totale de la séance)       │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ◀─ SWIPE GAUCHE = Skip    │    SWIPE BAS = Stop ─▶           │
+│  (Hints invisibles, appris lors de l'onboarding)               │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+#### 10.2.2 Zones Détaillées
+
+##### **Zone Haute (15%)**
+
+| Élément | Spécification |
+|---------|---------------|
+| Nom exercice | `TYPOGRAPHY.body` (18px), `TEXT.SECONDARY` |
+| Badge round | `TYPOGRAPHY.label`, bg `SURFACE.OVERLAY_MEDIUM`, pill |
+| Position | Aligné gauche (nom) / droite (badge) |
+| Animation | Fade in/out lors des transitions d'exercice |
+
+##### **Zone Centrale (60%)**
+
+| Élément | Spécification |
+|---------|---------------|
+| GIF exercice | 180×180px, border radius `RADIUS.XL` (16px) |
+| GIF border | `BORDER.LIGHT` (rgba 0.06) |
+| Label phase | `TYPOGRAPHY.heading` (24px), `TEXT.TERTIARY`, letter-spacing 6px |
+| Countdown | `TYPOGRAPHY.countdown` (140px, 900), `TEXT.PRIMARY` |
+
+**Animation countdown :**
+- Pulse scale à chaque seconde : `1.0 → 1.03 → 1.0` (200ms)
+- Si ≤3 secondes : couleur `ACCENT.RED_HOT` + pulse plus fort
+
+##### **Zone Basse (25%) - Progress Bar**
+
+| Élément | Spécification |
+|---------|---------------|
+| Hauteur | 6px |
+| Position | 32px au-dessus du bottom safe area |
+| Background | `SURFACE.OVERLAY_LIGHT` (rgba 0.08) |
+| Fill | `BRAND.PRIMARY` (#F97316) |
+| Border radius | `RADIUS.FULL` (pill) |
+| Animation | Width animée progressivement |
+
+**Calcul progression :**
+```typescript
+const progress = (
+  (currentRound - 1) * (workDuration + restDuration) +
+  (phase === 'WORK' ? workDuration - secondsLeft : workDuration + restDuration - secondsLeft)
+) / (totalRounds * (workDuration + restDuration))
+```
+
+---
+
+#### 10.2.3 Phases Visuelles
+
+##### **Couleurs de Phase (Gradients)**
+
+| Phase | Gradient | Label | Son |
+|-------|----------|-------|-----|
+| GET_READY | `['#451A03', '#92400E', '#D97706']` | "PRÉPARE-TOI" | 3 bips courts |
+| WORK | `['#450A0A', '#991B1B', '#EA580C']` | "GO !" | Bip long + haptic fort |
+| REST | `['#0C1929', '#1E3A5F', '#2563EB']` | "REPOS" | Double bip + haptic léger |
+
+**Transition de phase :**
+- Cross-fade du gradient : 400ms, `EASING.STANDARD`
+- Le label change instantanément
+- Son joué au moment du changement
+
+##### **Labels par Phase**
+
+| Phase | Label | Couleur texte |
+|-------|-------|---------------|
+| GET_READY | "PRÉPARE-TOI" | `TEXT.TERTIARY` |
+| WORK | "GO !" | `ACCENT.ORANGE` |
+| REST | "REPOS" + "Prochain : [exercice]" | `TEXT.TERTIARY` |
+
+---
+
+#### 10.2.4 Gestures (Contrôles Invisibles)
+
+| Gesture | Action | Feedback |
+|---------|--------|----------|
+| **Tap** | Pause | Haptic léger + overlay pause |
+| **Swipe gauche** | Skip phase | Modal confirmation |
+| **Swipe bas** | Stop séance | Modal confirmation "Quitter ?" |
+
+**Apprentissage des gestures :**
+- Montrés uniquement lors de l'écran 4 (Wow Moment) de l'onboarding
+- Hint "Tap pour pause" disparaît après 3 utilisations
+- Pas d'hints permanents pour ne pas distraire
+
+---
+
+#### 10.2.5 État PAUSE (Auto-resume 10s)
+
+**Déclenchement :** Tap sur l'écran pendant la séance active
+
+**Affichage :**
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  GRADIENT ASSOMBI (overlay noir 0.4)                           │
+│                                                                 │
+│                                                                 │
+│                     ┌─────────────────┐                        │
+│                     │                 │                        │
+│                     │       ⏸️        │                        │
+│                     │                 │                        │
+│                     └─────────────────┘                        │
+│                                                                 │
+│                      EN PAUSE                                   │
+│                                                                 │
+│                     Reprise dans                                │
+│                                                                 │
+│                        10                                       │
+│                  (Décompte auto)                                │
+│                                                                 │
+│              [ Reprendre maintenant ]                           │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Overlay | `rgba(0,0,0,0.4)` |
+| Icône pause | 80×80px, `TEXT.MUTED` |
+| Label "EN PAUSE" | `TYPOGRAPHY.heading`, `TEXT.SECONDARY` |
+| Décompte | `TYPOGRAPHY.timeDisplay` (72px), `TEXT.PRIMARY` |
+| Bouton reprendre | Pill, `BRAND.PRIMARY`, `TYPOGRAPHY.buttonMedium` |
+
+**Comportement :**
+- Décompte de 10 secondes
+- Si 0 → auto-resume automatiquement
+- Tap sur "Reprendre maintenant" → resume immédiat
+- Tap ailleurs → resume immédiat
+
+---
+
+#### 10.2.6 Skip Phase (Confirmation)
+
+**Déclenchement :** Swipe gauche
+
+**Affichage :**
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│                                                                 │
+│                     Passer cette phase ?                        │
+│                                                                 │
+│              ┌─────────┐      ┌─────────┐                      │
+│              │ Annuler │      │ Passer  │                      │
+│              └─────────┘      └─────────┘                      │
+│                                                                 │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Comportement :**
+- "Annuler" → ferme le modal, séance continue
+- "Passer" → passe à la phase suivante + haptic léger
+
+---
+
+#### 10.2.7 Stop Séance (Confirmation)
+
+**Déclenchement :** Swipe bas
+
+**Affichage :**
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│                                                                 │
+│                   ⚠️ Quitter la séance ?                        │
+│                                                                 │
+│                Tu as fait 3/8 rounds.                          │
+│                                                                 │
+│              ┌─────────┐      ┌─────────┐                      │
+│              │ Continuer│     │ Quitter │                      │
+│              └─────────┘      └─────────┘                      │
+│                                                                 │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Comportement :**
+- "Continuer" → ferme le modal, séance continue
+- "Quitter" → sauvegarde la séance partielle → retour Home
+
+---
+
+#### 10.2.8 Écran COMPLETE (Victoire)
+
+**Déclenchement :** Dernier round terminé
+
+**Layout :**
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  GRADIENT VERT SUCCESS                                          │
+│  ['#052E16', '#166534', '#16A34A']                             │
+│                                                                 │
+│                                                                 │
+│                         🔥                                      │
+│                  (Flamme animée 80px)                           │
+│                                                                 │
+│                     TERMINÉ !                                   │
+│                                                                 │
+│                       4:00                                      │
+│                  (Durée totale)                                 │
+│                                                                 │
+│              ┌─────────────────────────────┐                   │
+│              │  8 rounds    85 kcal        │                   │
+│              │  (Stats en ligne)           │                   │
+│              └─────────────────────────────┘                   │
+│                                                                 │
+│              🏆 Streak : 8 jours !                              │
+│              (Si nouveau record ou maintenu)                    │
+│                                                                 │
+│                                                                 │
+│              ┌─────────────────────────────┐                   │
+│              │         TERMINER            │                   │
+│              └─────────────────────────────┘                   │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Flamme | Animation Lottie 80×80px, loop |
+| "TERMINÉ !" | `TYPOGRAPHY.displayLarge` (42px), `TEXT.PRIMARY` |
+| Durée | `TYPOGRAPHY.timeDisplay` (72px), `TEXT.PRIMARY` |
+| Stats | `TYPOGRAPHY.body`, `TEXT.TERTIARY` |
+| Streak update | `TYPOGRAPHY.heading`, `BRAND.GOLD` |
+| Bouton "Terminer" | Pill `RADIUS.3XL`, `SURFACE.OVERLAY_MEDIUM` |
+
+**Animations de célébration :**
+1. **Flamme animée** : scale pulse 1.0 → 1.15 → 1.0 (600ms loop)
+2. **Haptics succès** : `Haptics.notificationAsync(Success)`
+3. **Son victoire** : Fanfare / cloche de victoire
+
+---
+
+#### 10.2.9 Comportements Techniques
+
+| Comportement | Implémentation |
+|--------------|----------------|
+| StatusBar | `hidden` pendant toute la séance |
+| Keep awake | `expo-keep-awake` activé |
+| Back button | Affiche modal "Quitter ?" |
+| Appel entrant | Pause automatique |
+| Background | Timer continue, notification sticky |
+| App killed | Au retour : "Séance interrompue — Reprendre ?" |
+
+---
+
+### 10.3 History Screen (Tab 2)
+
+**Objectif :** Visualiser sa progression et ressentir de la fierté
+
+**Émotion cible :** Fierté / Accomplissement — "Regarde tout ce que j'ai fait !"
+
+---
+
+#### 10.3.1 Layout Global (Scroll Vertical)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  NOTCH / STATUS BAR                                             │
+├─────────────────────────────────────────────────────────────────┤
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 1 : HEADER + STREAK HERO                       │    │
+│  │                                                         │    │
+│  │                    🔥 7                                 │    │
+│  │              (Flamme + nombre)                          │    │
+│  │                                                         │    │
+│  │              JOURS DE SUITE                             │    │
+│  │          (Animation pulse sur le chiffre)               │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 2 : STATS GLOBALES (Ligne)                     │    │
+│  │                                                         │    │
+│  │    📊 24 séances    🔥 1,250 kcal    🏆 12 (best)       │    │
+│  │    (All-time)       (All-time)       (All-time)         │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 3 : CALENDRIER MENSUEL                         │    │
+│  │                                                         │    │
+│  │              ◀   Février 2026   ▶                       │    │
+│  │                                                         │    │
+│  │     L   M   M   J   V   S   D                          │    │
+│  │                                                         │    │
+│  │                 1   2   3   4                          │    │
+│  │     ●   ●   ○   ●   ●   ○   ○   (Points colorés)       │    │
+│  │     5   6   7   8   9  10  11                          │    │
+│  │                                                         │    │
+│  │     ●   ○   ●   ●   ●   ○   ○                          │    │
+│  │    12  13  14  15  16  17  18                          │    │
+│  │                                                         │    │
+│  │     ...                                                 │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 4 : GRAPHIQUES (Cette semaine)                 │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  SÉANCES CETTE SEMAINE                          │    │    │
+│  │  │                                                 │    │    │
+│  │  │   ▓▓                                           │    │    │
+│  │  │   ▓▓      ▓▓      ▓▓                           │    │    │
+│  │  │   ▓▓  ▓▓  ▓▓  ▓▓  ▓▓  ▓▓  ▓▓                  │    │    │
+│  │  │   L   M   M   J   V   S   D                    │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  CALORIES CETTE SEMAINE                         │    │    │
+│  │  │                                                 │    │    │
+│  │  │   ▓▓▓▓                                          │    │    │
+│  │  │   ▓▓▓▓  ▓▓  ▓▓▓▓  ▓▓▓▓                          │    │    │
+│  │  │   ▓▓▓▓  ▓▓  ▓▓▓▓  ▓▓▓▓  ▓▓  ▓▓                  │    │    │
+│  │  │   L   M   M   J   V   S   D                    │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  ÉVOLUTION DU STREAK                            │    │    │
+│  │  │                                                 │    │    │
+│  │  │                        ●─●─●                    │    │    │
+│  │  │              ●─●─●─●─●                          │    │    │
+│  │  │        ●─●─●                                    │    │    │
+│  │  │   ●─●                                           │    │    │
+│  │  │   S1  S2  S3  S4  S5  S6                       │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+├─────────────────────────────────────────────────────────────────┤
+│  TAB BAR (Home | History | Settings)                           │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+#### 10.3.2 Section 1 : Streak Hero
+
+| Élément | Spécification |
+|---------|---------------|
+| Flamme | 48×48px, animation Lottie (pulse) |
+| Nombre streak | `TYPOGRAPHY.displayLarge` (42px, 900), `BRAND.GOLD` |
+| Label | `TYPOGRAPHY.overline` (11px), `TEXT.HINT` |
+| Container | Centré, padding vertical `SPACING[8]` |
+
+**Animation pulse (au chargement de l'écran) :**
+```typescript
+Animated.sequence([
+  Animated.timing(streakScale, { toValue: 1.15, duration: 300 }),
+  Animated.timing(streakScale, { toValue: 1, duration: 200 }),
+])
+```
+
+**États spéciaux :**
+| Streak | Affichage |
+|--------|-----------|
+| 0 | "Commence ton streak !" |
+| 1-6 | Normal |
+| 7 | "Une semaine complète !" |
+| 30+ | Badge spécial + flamme dorée |
+
+---
+
+#### 10.3.3 Section 2 : Stats Globales (All-time)
+
+| Élément | Spécification |
+|---------|---------------|
+| Layout | 3 colonnes égales, centrées |
+| Icône | 20×20px, `TEXT.MUTED` |
+| Valeur | `TYPOGRAPHY.heading` (24px, 800), `TEXT.PRIMARY` |
+| Label | `TYPOGRAPHY.caption` (12px), `TEXT.HINT` |
+
+**Données :**
+- **Séances totales** : Nombre de séances depuis le début
+- **Calories totales** : Somme des calories estimées
+- **Best streak** : Meilleur streak personnel atteint
+
+---
+
+#### 10.3.4 Section 3 : Calendrier Mensuel
+
+| Élément | Spécification |
+|---------|---------------|
+| Header | Mois + année, flèches navigation `<` `>` |
+| Jours labels | `TYPOGRAPHY.overline` (11px), `TEXT.HINT` |
+| Numéros | `TYPOGRAPHY.caption` (14px), `TEXT.MUTED` |
+| Jour actif | Point 8×8px, `BRAND.PRIMARY` |
+| Jour inactif | Pas de point |
+| Aujourd'hui | Border `BRAND.PRIMARY` autour du numéro |
+| Grid | 7 colonnes, 5-6 lignes |
+
+**Navigation :**
+- Swipe horizontal → mois précédent/suivant
+- Tap sur flèche → mois précédent/suivant
+
+---
+
+#### 10.3.5 Section 4 : Graphiques (Cette semaine)
+
+##### **Graphique 1 : Séances par jour**
+
+| Élément | Spécification |
+|---------|---------------|
+| Titre | "SÉANCES CETTE SEMAINE", `TYPOGRAPHY.overline` |
+| Type | Bar chart vertical |
+| Bar height | Max 120px, proportionnel au nombre de séances |
+| Bar color | `BRAND.PRIMARY` |
+| Labels X | L M M J V S D, `TYPOGRAPHY.caption` |
+| Animation | Bars grow from 0 à valeur au chargement |
+
+##### **Graphique 2 : Calories par jour**
+
+| Élément | Spécification |
+|---------|---------------|
+| Titre | "CALORIES CETTE SEMAINE", `TYPOGRAPHY.overline` |
+| Type | Bar chart vertical |
+| Bar color | `BRAND.SECONDARY` (gold) |
+| Animation | Bars grow from 0 à valeur au chargement |
+
+##### **Graphique 3 : Évolution du Streak**
+
+| Élément | Spécification |
+|---------|---------------|
+| Titre | "ÉVOLUTION DU STREAK", `TYPOGRAPHY.overline` |
+| Type | Line chart |
+| Line color | `BRAND.PRIMARY` |
+| Point | Cercle 6×6px sur chaque data point |
+| Labels X | S1, S2, S3... (semaines), `TYPOGRAPHY.caption` |
+| Animation | Line draws from left to right |
+
+**Animation des graphiques :**
+```typescript
+// Bar chart animation
+Animated.timing(barHeight, {
+  toValue: finalHeight,
+  duration: 600,
+  easing: EASING.DECELERATE,
+})
+
+// Line chart animation
+Animated.timing(lineProgress, {
+  toValue: 1,
+  duration: 1000,
+  easing: EASING.STANDARD,
+})
+```
+
+---
+
+#### 10.3.6 Interactions
+
+| Action | Résultat |
+|--------|----------|
+| Swipe calendrier | Change de mois |
+| Tap sur un jour | Affiche détail de la séance (si active) |
+| Scroll | Navigue entre les sections |
+| Tap sur graphique | Affiche tooltip avec valeur exacte |
+
+---
+
+#### 10.3.7 États Spéciaux
+
+| État | Affichage |
+|------|-----------|
+| Nouvel utilisateur | "Ton historique est vide. Commence ta première séance !" |
+| Aucune séance cette semaine | "Pas encore de séance cette semaine. C'est le moment !" |
+| Nouveau record streak | Badge animé + confettis |
+
+---
+
+### 10.4 Settings Screen (Tab 3)
+
+**Objectif :** Personnaliser l'expérience et gérer son compte
+
+**Style visuel :** Cards groupées avec icônes
+
+---
+
+#### 10.4.1 Layout Global (Scroll Vertical)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  NOTCH / STATUS BAR                                             │
+├─────────────────────────────────────────────────────────────────┤
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 1 : PROFIL                                     │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  👤  Prénom                          Marie   ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  🌐  Langue                          Français ▶  │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 2 : TIMER (Avancé)                             │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  ⏱️  Durée travail                     20s   ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  💤  Durée repos                       10s   ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  🔢  Nombre de rounds                   8    ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  ⏳  Préparation (Get Ready)           10s   ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  🔄  Cycles (Premium)                   1    🔒 │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  ☕  Pause entre cycles (Premium)      60s   🔒 │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 3 : AUDIO                                      │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  🎵  Volume musique            ─────●──────     │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  🔔  Volume sons               ─────────●──     │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  🎧  Ambiance                   Electro   ▶     │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  📳  Haptics                    ◉ On  ○ Off    │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 4 : NOTIFICATIONS                              │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  ⏰  Rappel quotidien       ◉ On   09:00   ▶   │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  📢  Rappel inactivité     ◉ On   2 jours     │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  🏆  Félicitations streak  ◉ On               │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 5 : ABONNEMENT (Paywall intégrée)              │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │                                                 │    │    │
+│  │  │   ✨ Passe Premium                              │    │    │
+│  │  │                                                 │    │    │
+│  │  │   ∞  Programmes illimités                      │    │    │
+│  │  │   ∞  Cycles multiples                          │    │    │
+│  │  │   ∞  Stats avancées                            │    │    │
+│  │  │   ∞  Widgets                                   │    │    │
+│  │  │                                                 │    │    │
+│  │  │   ┌─────────────────────────────────────────┐  │    │    │
+│  │  │   │  $4.99/mois    ou    $29.99/an (-50%)  │  │    │    │
+│  │  │   └─────────────────────────────────────────┘  │    │    │
+│  │  │                                                 │    │    │
+│  │  │         [  Essai gratuit 7 jours  ]            │    │    │
+│  │  │                                                 │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 6 : À PROPOS                                   │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  ℹ️   Version                          1.0.0     │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  📜  Conditions d'utilisation                ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  🔒  Politique de confidentialité            ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  ✉️   Contacter le support                   ▶  │    │    │
+│  │  ├─────────────────────────────────────────────────┤    │    │
+│  │  │  ⭐  Noter l'app                              ▶  │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │  SECTION 7 : DANGER                                     │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  ⚠️  Réinitialiser toutes les données           │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│                                                                 │
+├─────────────────────────────────────────────────────────────────┤
+│  TAB BAR (Home | History | Settings)                           │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+#### 10.4.2 Section 1 : Profil
+
+| Row | Icône | Label | Valeur | Action |
+|-----|-------|-------|--------|--------|
+| Prénom | 👤 | Prénom | "Marie" | Modal input |
+| Langue | 🌐 | Langue | "Français" | Picker modal |
+
+**Langues disponibles :** FR, EN, ES, DE, PT-BR
+
+---
+
+#### 10.4.3 Section 2 : Timer (Avancé)
+
+| Row | Icône | Label | Valeur défaut | Range | Premium ? |
+|-----|-------|-------|---------------|-------|-----------|
+| Durée travail | ⏱️ | Durée travail | 20s | 5-60s | Non |
+| Durée repos | 💤 | Durée repos | 10s | 5-60s | Non |
+| Rounds | 🔢 | Rounds | 8 | 1-30 | Non |
+| Préparation | ⏳ | Get Ready | 10s | 0-30s | Non |
+| Cycles | 🔄 | Cycles | 1 | 1-10 | **Oui** 🔒 |
+| Pause cycles | ☕ | Pause cycles | 60s | 10-300s | **Oui** 🔒 |
+
+**UI pour les valeurs :**
+- Tap → Modal avec slider + input numérique
+- Lock 🔒 → Affiche "Débloquer avec Premium"
+
+---
+
+#### 10.4.4 Section 3 : Audio
+
+| Row | Type | Spécification |
+|-----|------|---------------|
+| Volume musique | Slider | 0-100%, default 70% |
+| Volume sons | Slider | 0-100%, default 100% |
+| Ambiance | Picker | Electro / Hip-Hop / Rock / Silence |
+| Haptics | Toggle | On / Off |
+
+**Slider style :**
+- Track height : 4px
+- Thumb : 24×24px, `BRAND.PRIMARY`
+- Track color : `SURFACE.OVERLAY_MEDIUM` / `BRAND.PRIMARY` (filled)
+
+---
+
+#### 10.4.5 Section 4 : Notifications
+
+| Row | Type | Spécification |
+|-----|------|---------------|
+| Rappel quotidien | Toggle + Time | Heure picker (default 09:00) |
+| Rappel inactivité | Toggle + Days | "Après X jours sans séance" (default 2) |
+| Félicitations streak | Toggle | On/Off |
+
+**Permission request :**
+- Premier toggle → demande de permission système
+- Si refusé → message "Active les notifications dans les réglages iOS"
+
+---
+
+#### 10.4.6 Section 5 : Abonnement (Paywall Intégrée)
+
+**Si Free User :**
+
+| Élément | Spécification |
+|---------|---------------|
+| Titre | "✨ Passe Premium" |
+| Liste avantages | 4 lignes avec ✓ |
+| Pricing | `$4.99/mois` ou `$29.99/an (-50%)` |
+| CTA | "Essai gratuit 7 jours" |
+| Secondary | "Restaurer les achats" |
+
+**Si Premium User :**
+
+| Élément | Spécification |
+|---------|---------------|
+| Statut | "✨ Premium Actif" |
+| Renouvellement | "Renouvellement le 15 mars 2026" |
+| CTA | "Gérer l'abonnement" (ouvre App Store) |
+
+---
+
+#### 10.4.7 Section 6 : À Propos
+
+| Row | Action |
+|-----|--------|
+| Version | Statique (lecture seule) |
+| CGU | Ouvre browser / WebView |
+| Confidentialité | Ouvre browser / WebView |
+| Support | Ouvre mailto: ou formulaire |
+| Noter l'app | `expo-store-review` → App Store |
+
+---
+
+#### 10.4.8 Section 7 : Danger
+
+| Row | Action |
+|-----|--------|
+| Réinitialiser | Modal confirmation → Supprime toutes les données locales |
+
+**Modal de confirmation :**
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│              ⚠️ Réinitialiser les données ?                     │
+│                                                                 │
+│         Cette action supprimera votre historique,              │
+│         votre streak et vos préférences.                        │
+│                                                                 │
+│         Cette action est irréversible.                          │
+│                                                                 │
+│              ┌─────────┐      ┌─────────┐                      │
+│              │ Annuler │      │ Effacer │                      │
+│              └─────────┘      └─────────┘                      │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+#### 10.4.9 Style des Cards
+
+| Élément | Spécification |
+|---------|---------------|
+| Card bg | `SURFACE.OVERLAY_LIGHT` (rgba 0.08) |
+| Card border | `BORDER.LIGHT` (rgba 0.06) |
+| Card radius | `RADIUS.XL` (16px) |
+| Row height | 56px |
+| Row separator | `BORDER.SUBTLE` (1px line) |
+| Icône | 24×24px, `TEXT.MUTED` |
+| Label | `TYPOGRAPHY.body` (18px), `TEXT.PRIMARY` |
+| Value | `TYPOGRAPHY.caption`, `TEXT.MUTED` |
+| Chevron | `TEXT.HINT` |
+
+---
+
+#### 10.4.10 Interactions
+
+| Action | Résultat |
+|--------|----------|
+| Tap row avec chevron | Ouvre modal / picker |
+| Tap toggle | Toggle immédiat + haptic |
+| Drag slider | Update valeur + haptic au release |
+| Tap "Effacer" | Confirmation puis reset |
+
+---
+
+## 10.5 Modals & Bottom Sheets
+
+### 10.5.1 Program Detail Bottom Sheet
+
+**Déclenchement :** Tap sur une card programme depuis le Home Screen
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  (Écran Home flouté en arrière-plan)                           │
+│  ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░│
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │                     ──────                              │    │
+│  │                  (Handle drag)                          │    │
+│  │                                                         │    │
+│  │  Tabata Classic                            BEGINNER    │    │
+│  │                                                         │    │
+│  │  8 rounds de Burpees pour commencer en force           │    │
+│  │                                                         │    │
+│  │  ─────────────────────────────────────────────────────  │    │
+│  │                                                         │    │
+│  │  EXERCICES                                             │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │  1.  🏋️  Burpees                                │    │    │
+│  │  │      Cardio complet, full body                  │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  │  (Répété × 8 rounds)                                   │    │
+│  │                                                         │    │
+│  │  ─────────────────────────────────────────────────────  │    │
+│  │                                                         │    │
+│  │  CONFIGURATION                                         │    │
+│  │                                                         │    │
+│  │  ⏱️ 20s travail    💤 10s repos    🔢 8 rounds        │    │
+│  │                                                         │    │
+│  │  ─────────────────────────────────────────────────────  │    │
+│  │                                                         │    │
+│  │  ┌─────────────────────────────────────────────────┐    │    │
+│  │  │              C'EST PARTI !                       │    │    │
+│  │  └─────────────────────────────────────────────────┘    │    │
+│  │                                                         │    │
+│  │                   Changer de programme                  │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Height | ~70% de l'écran |
+| Handle | 36×4px pill, `TEXT.HINT` |
+| Background | `SURFACE.BASE` (#0A0A14) |
+| Border top | `BORDER.MEDIUM` + radius `RADIUS.2XL` (20px) |
+| Animation | Slide up from bottom, 300ms |
+
+**Interactions :**
+- Swipe down → ferme le bottom sheet
+- Tap "C'est parti !" → navigue vers Timer
+- Tap "Changer de programme" → ferme le sheet + scroll vers autres programmes
+
+---
+
+### 10.5.2 Paywall Contextuel (Popup)
+
+**Déclenchement :** Tap sur une feature premium (cadenas 🔒)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  (Écran flouté + overlay noir 0.6)                             │
+│  ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░│
+│                                                                 │
+│           ┌─────────────────────────────────────────┐          │
+│           │                                         │          │
+│           │            🔓                           │          │
+│           │                                         │          │
+│           │    "Débloquer les cycles multiples"    │          │
+│           │                                         │          │
+│           │    Passe Premium pour accéder à        │          │
+│           │    cette fonctionnalité.               │          │
+│           │                                         │          │
+│           │    ┌───────────────────────────────┐    │          │
+│           │    │    ESSAI GRATUIT 7 JOURS      │    │          │
+│           │    └───────────────────────────────┘    │          │
+│           │                                         │          │
+│           │         $4.99/mois ou $29.99/an        │          │
+│           │                                         │          │
+│           │            ✕ Fermer                    │          │
+│           │                                         │          │
+│           └─────────────────────────────────────────┘          │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Spécifications :**
+| Élément | Valeur |
+|---------|--------|
+| Modal width | 85% de l'écran |
+| Modal radius | `RADIUS.2XL` (20px) |
+| Background | `SURFACE.ELEVATED` (#1E1E2E) |
+| Overlay | `rgba(0,0,0,0.6)` |
+| Animation | Scale + fade in, 250ms |
+
+**Déclencheurs :**
+- Settings → Cycles (🔒)
+- Settings → Pause entre cycles (🔒)
+- Home → Programme premium (🔒)
+- History → Stats avancées (🔒)
+
+---
+
+### 10.5.3 Modals de Confirmation
+
+**Style générique pour toutes les confirmations :**
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  (Écran flouté + overlay)                                       │
+│                                                                 │
+│           ┌─────────────────────────────────────────┐          │
+│           │                                         │          │
+│           │              [ICÔNE]                    │          │
+│           │                                         │          │
+│           │            [TITRE]                      │          │
+│           │                                         │          │
+│           │           [DESCRIPTION]                 │          │
+│           │                                         │          │
+│           │   ┌─────────────┐  ┌─────────────┐     │          │
+│           │   │  Annuler    │  │  Confirmer  │     │          │
+│           │   └─────────────┘  └─────────────┘     │          │
+│           │                                         │          │
+│           └─────────────────────────────────────────┘          │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+**Variantes :**
+
+| Type | Icône | Titre exemple |
+|------|-------|---------------|
+| Danger | ⚠️ | "Supprimer les données ?" |
+| Stop | ⏹️ | "Quitter la séance ?" |
+| Skip | ⏭️ | "Passer cette phase ?" |
+| Info | ℹ️ | "Activer les notifications ?" |
+
+**Couleurs boutons :**
+- Annuler : `SURFACE.OVERLAY_MEDIUM`
+- Confirmer (normal) : `BRAND.PRIMARY`
+- Confirmer (danger) : `BRAND.DANGER`
+
+---
+
+## 11. Annexe : Checklist Design Review
+
+Avant chaque release, vérifier :
+
+- [ ] Contraste WCAG AA sur tous les textes
+- [ ] Taille minimum 44px sur tous les boutons touchables
+- [ ] Animations fluides à 60fps (pas de jitter)
+- [ ] Haptics présents sur toutes les interactions principales
+- [ ] Transitions de phase fluides (cross-fade)
+- [ ] Safe areas respectées sur iPhone X+
+- [ ] VoiceOver labels sur éléments interactifs
+- [ ] Mode réduction mouvement respecté
+- [ ] Timer précis (pas de drift visible)
+- [ ] Notifications background fonctionnelles
+
+---
+
+*Document créé le 18 février 2026 — TabataGo PDD v1.0*
diff --git a/.archive/TabataGo_PRD_v1.1.md b/.archive/TabataGo_PRD_v1.1.md
new file mode 100644
index 0000000..cebeb1a
--- /dev/null
+++ b/.archive/TabataGo_PRD_v1.1.md
@@ -0,0 +1,597 @@
+
+
+| 🔥 TABATAGO Application Mobile de Minuterie Tabata *Product Requirements Document (PRD) v1.1* Framework : Expo (React Native)  ·  Cible : iOS & Android  ·  Février 2026 |
+| :---: |
+
+# **1\. Résumé Exécutif**
+
+TabataGo est une application mobile premium dédiée à l'entraînement par intervalles en méthode Tabata (20 secondes d'effort / 10 secondes de repos). Elle cible les personnes qui veulent des séances courtes, intenses et guidées — sans abonnement à une salle. Le marché des applications de fitness dépasse 1,5 milliard de dollars en revenus annuels et le Tabata reste un mot-clé à forte demande (popularité \> 70\) avec une difficulté ASO modérée (\< 50).
+
+| Indicateur | Valeur cible |
+| :---- | :---- |
+| Marché visé | Fitness enthousiasts 25-45 ans, Home workout, HIIT lovers |
+| Plateformes | iOS (priorité) \+ Android |
+| Framework | Expo (React Native) — SDK 52+ |
+| Modèle économique | Freemium \+ Abonnement mensuel/annuel via RevenueCat |
+| Prix cible (US) | $4.99/mois ou $29.99/an |
+| Objectif J+30 | 5 000 téléchargements, taux de conversion essai \> 30% |
+| Objectif J+90 | MRR $5 000, note App Store ≥ 4.6 |
+
+# **2\. Fonctionnalités Core — Spécifications Détaillées**
+
+TabataGo repose sur trois piliers fonctionnels indissociables : le Timer (moteur de l'expérience), la Musique (moteur émotionnel), et l'Exercice (moteur pédagogique). Ces trois composants doivent fonctionner en parfaite synchronisation.
+
+## **2.1 Le Timer — Moteur Central**
+
+Le timer est la fonctionnalité principale et vitale de l'application. Son implémentation doit être irréprochable : précision, fluidité visuelle, comportement en arrière-plan.
+
+### **2.1.1 Structure d'une Séance Tabata Standard**
+
+| Phase | Durée par défaut | Configurable ? | Couleur écran | Signal |
+| :---- | :---- | :---- | :---- | :---- |
+| Préparation (Get Ready) | 10 secondes | Oui (5–30s) | Jaune \#EAB308 | Bip court × 3 \+ vibration légère |
+| Travail (Work) | 20 secondes | Oui (5–60s) | Orange vif \#F97316 | Bip long au démarrage \+ haptique fort |
+| Repos (Rest) | 10 secondes | Oui (5–60s) | Bleu calme \#3B82F6 | Double bip court \+ haptique léger |
+| Fin de round | Instantané | — | Flash blanc | Son de cloche \+ vibration |
+| Fin de séance | Écran résultat | — | Vert \#22C55E | Fanfare \+ longue vibration |
+
+### **2.1.2 Paramètres Configurables du Timer**
+
+| Paramètre | Valeur par défaut | Min | Max | Accès |
+| :---- | :---- | :---- | :---- | :---- |
+| Durée Work | 20s | 5s | 60s | Tous |
+| Durée Rest | 10s | 5s  |  60s | Tous |
+| Nombre de rounds | 8 | 1 | 30 | Tous |
+| Durée Get Ready | 10s | 0s | 30s | Tous |
+| Nombre de cycles | 1 | 1 | 10 | Premium |
+| Pause entre cycles | 60s | 10s | 300s | Premium |
+| Cycles de récupération | — | — | — | Premium |
+
+### **2.1.3 Affichage Timer — Écran Séance (plein écran)**
+
+| 📱 LAYOUT — Écran Timer Plein Écran |
+| :---- |
+| ▸  Zone HAUTE (20%) : Nom de l'exercice en cours \+ numéro de round (ex: "Burpees — Round 3/8") |
+| ▸  Zone CENTRALE (50%) : Chiffre du compte à rebours — très grand (96-120px), police monospace, couleur de phase |
+| ▸  Zone BASSE HAUTE (15%) : Barre de progression de la séance complète (rounds) \+ indicateur phase actuelle |
+| ▸  Zone BASSE (15%) : Boutons Pause / Stop / Skip — discrets pour ne pas distraire |
+| ▸  FOND : Couleur dynamique selon la phase (orange work, bleu rest, jaune prep) avec transition animée |
+| ▸  ANIMATION : Pulsation subtile du chiffre à chaque seconde \+ ring circulaire de progression |
+
+### **2.1.4 Comportement Technique du Timer**
+
+* Précision : Utiliser expo-background-fetch \+ Date.now() delta pour compenser les drifts — tolérance \< 50ms
+
+* Background : Le timer continue en arrière-plan (notification sticky affichant le compte à rebours)
+
+* Verrouillage écran : Écran reste allumé pendant la séance (expo-keep-awake)
+
+* Interruptions : Pause automatique si appel téléphonique entrant (AppState listener)
+
+* Reprise : Si l'app est tuée, afficher une notification "Séance interrompue — Reprendre ?" au retour
+
+* OTA update safe : Le state du timer est isolé du cycle de render React pour éviter les glitches
+
+## **2.2 La Musique — Moteur Émotionnel**
+
+La musique transforme une simple minuterie en expérience motivante. Elle doit s'adapter dynamiquement à chaque phase de la séance (work vs rest) et ne jamais entrer en conflit avec la musique de l'utilisateur ou les signaux sonores.
+
+### **2.2.1 Architecture Sonore**
+
+| Couche audio | Description | Technologie | Contrôle utilisateur |
+| :---- | :---- | :---- | :---- |
+| Musique d'ambiance | Tracks BPM-synchronisées intégrées à l'app | expo-av (AVAudioSession) | Volume indépendant, on/off |
+| Signaux de phase | Bips, voix, cloche — changement work/rest | expo-av (priorité haute) | Volume indépendant, choix du son |
+| Voix coach | Annonces vocales (optionnel) : "Go\!", "Rest", "Last round\!" | expo-av (TTS ou fichiers pré-enregistrés) | On/off, langue |
+| Haptiques | Vibrations synchronisées aux signaux | expo-haptics | On/off |
+
+### **2.2.2 Catalogue Musical Intégré (Offline)**
+
+| 🎵 TRACKS INTÉGRÉES — 3 ambiances × 3 intensités \= 9 tracks minimum |
+| :---- |
+| ▸  Ambiance ELECTRO : Low (récup), Medium (standard), High (intense) — BPM 120/140/160 |
+| ▸  Ambiance HIP-HOP : Low (récup), Medium (standard), High (intense) — BPM 85/100/115 |
+| ▸  Ambiance ROCK/METAL : Low (récup), Medium (standard), High (intense) — BPM 130/150/170 |
+| ▸  Mode SILENCE : Aucune musique, uniquement les signaux sonores de phase |
+| ▸  Mode SPOTIFY/APPLE MUSIC : L'app n'interfère pas avec la musique de l'utilisateur (coexistence audio) |
+| ▸  Toutes les tracks sont royalty-free et embarquées dans le bundle — aucun streaming requis |
+
+### **2.2.3 Synchronisation Musique ↔ Timer**
+
+* Phase WORK : Passer automatiquement à la track haute intensité de l'ambiance sélectionnée
+
+* Phase REST : Transition en fade-out 1s vers la track basse intensité (ambiance calme)
+
+* Phase GET READY : Intro de 10s sur la track principale
+
+* Transition douce : Cross-fade 500ms entre les phases pour éviter les coupures brutales
+
+* BPM adaptatif (Premium) : L'app détecte le rythme de la track et aligne le bip de fin de phase sur le beat
+
+* Pas de conflit : Si l'utilisateur a sa propre musique, les signaux de phase s'y superposent en ducking audio (baisse temporaire du volume)
+
+### **2.2.4 Signaux Sonores de Phase — Options**
+
+| Signal | Options disponibles | Par défaut | Premium uniquement ? |
+| :---- | :---- | :---- | :---- |
+| Début Work | Bip long, Whistle, Voix "Go\!", Air horn, Clap | Bip long | Non |
+| Début Rest | Double bip, Voix "Rest", Bell, Ding | Double bip | Non |
+| Décompte 3-2-1 | Bips courts, Voix "3, 2, 1", Silence | Bips courts | Non |
+| Fin de round | Cloche, Applaudissements, Voix "Round X done\!" | Cloche | Oui |
+| Fin de séance | Fanfare, Applaudissements, Voix "Workout complete\!" | Fanfare | Non |
+| Dernier round | Voix "Last round\!", Alarm, Son spécial | Voix | Oui |
+
+### **2.2.5 Gestion Technique Audio (expo-av)**
+
+* Session audio iOS : AVAudioSessionCategoryPlayback avec MixWithOthers — permet de jouer avec la musique utilisateur
+
+* Focus audio Android : AudioManager.AUDIOFOCUS\_GAIN\_TRANSIENT\_MAY\_DUCK pour les signaux
+
+* Préchargement : Tous les sons de phase sont chargés en mémoire au démarrage de la séance (zéro latence)
+
+* Mode silencieux iOS : Les signaux de phase respectent le switch mute SAUF si l'utilisateur a activé "override" dans les settings
+
+* Headphones détection : Si écouteurs branchés, désactiver les haptiques de phase par défaut
+
+## **2.3 L'Exercice — Moteur Pédagogique**
+
+Chaque round du timer doit être associé à un exercice spécifique, affiché clairement pendant la phase de travail. C'est ce qui différencie TabataGo d'une simple minuterie générique.
+
+### **2.3.1 Bibliothèque d'Exercices**
+
+| Catégorie | Exemples d'exercices | Nb exercices V1 | Nb exercices V2 |
+| :---- | :---- | :---- | :---- |
+| Cardio / Full body | Burpees, Jumping Jacks, Mountain Climbers, High Knees | 8 | 20 |
+| Bas du corps | Squats, Fentes, Jump Squats, Glute Bridges, Wall Sit | 8 | 20 |
+| Haut du corps | Push-ups, Pike Push-ups, Tricep Dips, Shoulder Taps | 6 | 15 |
+| Abdos / Core | Crunches, Planche, Russian Twists, Bicycle Crunches | 6 | 15 |
+| Sans saut (low impact) | Slow Squats, Modified Push-ups, Step Touch, March | 6 | 15 |
+| Avec matériel | Kettlebell Swings, Dumbbell Thrusters, Jump Rope | 4 | 10 |
+
+### **2.3.2 Fiche Exercice — Données par Exercice**
+
+| 📋 MODÈLE DE DONNÉES — Exercice |
+| :---- |
+| ▸  id : identifiant unique (ex: "burpee\_classic") |
+| ▸  name : Nom localisé (FR: "Burpee", EN: "Burpee", ES: "Burpee") |
+| ▸  category : cardio | lower\_body | upper\_body | core | low\_impact | equipment |
+| ▸  difficulty : beginner | intermediate | advanced |
+| ▸  musclesTargeted : string\[\] (ex: \["quadriceps", "pectoraux", "cardio"\]) |
+| ▸  description : Instruction courte (max 80 car.) — affichée pendant la phase Rest |
+| ▸  cues : string\[\] — 2-3 points clés de forme (ex: "Dos droit", "Genoux alignés") |
+| ▸  gifUrl : Animation GIF courte (1-2s, loop) — 200×200px max — embarquée offline |
+| ▸  thumbnailUrl : Image statique pour la bibliothèque |
+| ▸  hasModification : bool — si une variante plus facile existe |
+| ▸  modificationId : id de l'exercice de remplacement (ex: "burpee\_modified") |
+| ▸  equipmentNeeded : string\[\] (ex: \[\] pour aucun, \["tapis"\] pour matériel simple) |
+
+### **2.3.3 Affichage de l'Exercice Pendant la Séance**
+
+| Phase | Affichage exercice | Taille | Information complémentaire |
+| :---- | :---- | :---- | :---- |
+| GET READY (10s) | Nom \+ GIF animé de démonstration | Grande — focus total | "Voici l'exercice suivant" — prépare mentalement |
+| WORK (20s) | Nom en haut \+ compteur central — GIF en petit coin | Nom moyen, timer dominant | 1-2 cues de forme affichés sous le nom |
+| REST (10s) | Nom de l'EXERCICE SUIVANT \+ vignette | Taille moyenne | "Prochain : \[Nom\]" — anticipation |
+| FIN DE ROUND | Résumé rapide du round (1s) | Plein écran flash | Round X complété \+ prochain exercice |
+
+### **2.3.4 Types de Programmes Tabata**
+
+| 🗂️ PROGRAMMES DISPONIBLES — V1 |
+| :---- |
+| ▸  MODE 1 — Exercice unique répété : Le même exercice sur les 8 rounds (ex: 8 rounds de Burpees) — Tabata classique |
+| ▸  MODE 2 — Circuit 2 exercices : Alternance A/B sur 8 rounds (ex: Squats / Push-ups × 4 répétitions) — Tabata duo |
+| ▸  MODE 3 — Circuit 4 exercices : 4 exercices × 2 rounds chacun — Tabata circuit (Premium) |
+| ▸  MODE 4 — Programme libre : L'utilisateur assigne manuellement un exercice à chaque round (Premium) |
+| ▸  MODE 5 — Programme IA : Sélection automatique selon niveau, objectif et historique (Premium V2) |
+
+### **2.3.5 Créateur de Programme Personnalisé (Premium)**
+
+* Interface drag & drop pour assigner les exercices à chaque round
+
+* Sauvegarde illimitée de programmes personnalisés (nom, description, tags)
+
+* Partage de programme par lien deep link (ex: tabatago://program/abc123)
+
+* Import de programme depuis un lien partagé par un autre utilisateur
+
+* Favoris : marquer des exercices pour les retrouver rapidement
+
+### **2.3.6 Contenu Offline & Performance**
+
+* Tous les GIFs d'exercices V1 (38 exercices × 1 GIF ≈ 150KB chacun ≈ \~6MB total) — embarqués dans le bundle
+
+* Lazy loading pour les exercices V2+ : téléchargement à la demande, mis en cache localement
+
+* Fallback : Si pas de GIF disponible, afficher une icône \+ description textuelle
+
+* Accessibilité : alt text sur chaque GIF pour VoiceOver/TalkBack
+
+## **2.4 Synchronisation Timer × Musique × Exercice**
+
+Les trois composants doivent former une expérience unifiée et cohérente. Ce tableau décrit les événements et leurs effets croisés :
+
+| Événement Timer | Effet sur la Musique | Effet sur l'Exercice | Haptique |
+| :---- | :---- | :---- | :---- |
+| Début GET READY | Fade-in track principale | Afficher GIF exercice Round 1 | Léger |
+| Décompte 3-2-1 | Volume augmente | Animation pulsation sur le GIF | Bip × 3 |
+| Début WORK | Switch vers track high BPM | Afficher nom \+ cues en grand | Fort |
+| Milieu WORK (10s) | Rien | "Halfway\!" en overlay 1s | Aucun |
+| Fin WORK | Switch vers track low BPM | Afficher exercice SUIVANT | Moyen |
+| Début REST | Track calme | "Next: \[Exercice\]" \+ vignette | Léger |
+| Dernier round warning | Effet sonore spécial | Badge "LAST ROUND" sur nom | Vibration longue |
+| Fin de séance | Fade-out \+ fanfare | Écran résultat avec tous les exercices | Célébration |
+
+# **3\. Validation du Marché & Stratégie ASO**
+
+## **3.1 Analyse des Mots-Clés Cibles**
+
+Les mots-clés suivants ont été validés via Astro (difficulté \< 55, popularité \> 20\) :
+
+| Mot-clé | Popularité | Difficulté | Marché |
+| :---- | :---- | :---- | :---- |
+| tabata timer | 72 | 48 | EN 🇺🇸 |
+| hiit timer app | 68 | 52 | EN 🇺🇸 |
+| minuterie tabata | 35 | 28 | FR 🇫🇷 |
+| temporizador tabata | 41 | 31 | ES 🇪🇸 |
+| tabata training timer | 55 | 44 | EN 🇬🇧 |
+| intervall timer workout | 38 | 29 | DE 🇩🇪 |
+
+## **3.2 Analyse Concurrentielle**
+
+Principaux concurrents identifiés et opportunités de différenciation :
+
+| Concurrent | Forces | Faiblesses (notre opportunité) |
+| :---- | :---- | :---- |
+| Tabata Timer (App Store Top 1\) | Notoriété, simplicité | UI datée, pas de suivi streak, pas de localisation |
+| Seconds Pro | Très complet, flexible | Trop complexe, prix élevé, courbe d'apprentissage |
+| HIIT Interval Training Timer | Gratuit, fonctionnel | Pub intrusive, pas d'onboarding émotionnel |
+| Tabata Stopwatch Pro | Simple, rapide | Pas de personnalisation, no streak, no widget |
+
+Notre avantage : onboarding émotionnel fort \+ design moderne \+ widgets iOS/Android \+ streaks \+ localisation dans 5 langues.
+
+# **4\. Onboarding — La Séquence Critique**
+
+L'onboarding est la priorité absolue : 80% des revenus sont générés ici. L'objectif est de créer un investissement émotionnel avant d'afficher le paywall. La séquence suit le schéma : Problème → Empathie → Solution → Moment Wow → Paywall.
+
+## **4.1 Écrans d'Onboarding (séquence de 6 écrans)**
+
+### **Écran 1 — Le Problème (Identifier la douleur)**
+
+| 🎯 OBJECTIF : Identification |
+| :---- |
+| ▸  Titre : "Tu n'as pas 1 heure pour la salle. Personne n'en a." |
+| ▸  Sous-titre : "Et pourtant tu veux progresser. On a la solution." |
+| ▸  Visuel : Animation subtile d'une horloge qui se fragmente puis se reconstruit en 20 min |
+| ▸  CTA : "Montre-moi comment" (bouton orange pleine largeur) |
+
+### **Écran 2 — L'Empathie (L'utilisateur se sent compris)**
+
+| 💬 OBJECTIF : Connexion émotionnelle |
+| :---- |
+| ▸  Titre : "Qu'est-ce qui t'empêche de t'entraîner ?" |
+| ▸  Choix interactifs (tap) : Manque de temps / Motivation en berne / Je ne sais pas quoi faire / Je n'ai pas accès à une salle |
+| ▸  Mécanisme : stocker la réponse → personnaliser le reste de l'onboarding |
+| ▸  Transition : "On a conçu TabataGo exactement pour ça." |
+
+### **Écran 3 — La Solution (Présenter la méthode)**
+
+| ⚡ OBJECTIF : Comprendre la valeur |
+| :---- |
+| ▸  Titre : "4 minutes. Vraiment transformatrices." |
+| ▸  Animation interactive : timeline Tabata (20s work / 10s rest × 8 rounds) |
+| ▸  Stats affichées : Brûle autant de calories qu'un jogging de 30 min / Prouvé scientifiquement depuis 1996 (Dr. Tabata) |
+| ▸  Visuel : compteur animé qui tourne — preview de l'app |
+
+### **Écran 4 — Le Moment "Wow" (Démo interactive)**
+
+| 🔥 OBJECTIF : Engagement actif (ne pas juste regarder) |
+| :---- |
+| ▸  Titre : "Essaie maintenant. 20 secondes." |
+| ▸  Mini-minuterie Tabata LIVE intégrée dans l'écran d'onboarding |
+| ▸  L'utilisateur tape sur "Go" et vit 20s de compte à rebours \+ son \+ vibration |
+| ▸  Après : "Tu viens de faire ta première série Tabata. 7 de plus et c'est une séance complète." |
+| ▸  Note : Ce moment est le plus différenciant — créer une mini-expérience réelle |
+
+### **Écran 5 — Personnalisation (Engagement supplémentaire)**
+
+| ⚙️ OBJECTIF : Investissement personnel |
+| :---- |
+| ▸  Titre : "Configurons ta première semaine." |
+| ▸  Sélection : Niveau (Débutant / Intermédiaire / Avancé) |
+| ▸  Sélection : Objectif (Perte de poids / Cardio / Force / Bien-être) |
+| ▸  Sélection : Fréquence souhaitée (2x / 3x / 5x par semaine) |
+| ▸  Résultat : "Ton programme personnalisé est prêt." (sensation de valeur avant paiement) |
+
+### **Écran 6 — Paywall (Après l'investissement émotionnel)**
+
+| 💳 OBJECTIF : Conversion |
+| :---- |
+| ▸  Titre : "Continue sur ta lancée. Sans limite." |
+| ▸  Présenter l'essai gratuit 7 jours en premier (bouton principal orange) |
+| ▸  Options : Mensuel $4.99 / Annuel $29.99 (économie 50% mise en évidence) |
+| ▸  Garantie visible : "Annule à tout moment" \+ "Satisfait ou remboursé 30j" |
+| ▸  Lien "Continuer sans abonnement" en petit en bas (ne pas le cacher) |
+| ▸  Intégration RevenueCat — avec A/B test activé dès le lancement |
+
+# **5\. Design & Identité Visuelle**
+
+## **5.1 Palette de Couleurs**
+
+| Rôle | Couleur | Hex | Usage |
+| :---- | :---- | :---- | :---- |
+| Primaire / Action | Orange Tabata | \#F97316 | Boutons CTA, accents, timer actif |
+| Fond Dark (défaut) | Charcoal Night | \#1E1E2E | Background principal mode sombre |
+| Fond Light | Warm White | \#FFF7ED | Background mode clair |
+| Texte principal Dark | Stone 900 | \#1C1917 | Titres mode clair |
+| Texte secondaire | Stone 600 | \#57534E | Body text, descriptions |
+| Succès / Streak | Green 500 | \#22C55E | Streaks, complétion, feedback positif |
+| Danger / Alerte | Red 500 | \#EF4444 | Erreurs, derniers secondes |
+
+## **5.2 Typographie**
+
+| Usage | Police | Poids | Taille |
+| :---- | :---- | :---- | :---- |
+| Timer principal | Inter (monospace fallback) | Black (900) | 96-120px |
+| Titres H1 | Inter | Bold (700) | 28-32px |
+| Titres H2 | Inter | SemiBold (600) | 22-24px |
+| Body / Labels | Inter | Regular (400) | 14-16px |
+| Micro-labels | Inter | Medium (500) | 11-12px |
+
+## **5.3 Principes Design**
+
+* Mode sombre par défaut (immersif pendant l'entraînement)
+
+* Timer en plein écran pendant la séance — aucune distraction
+
+* Animations fluides (60fps) pour les transitions et le compteur
+
+* Haptiques natifs : vibration légère à chaque changement de phase
+
+* Support Dynamic Type (iOS) et font scaling (Android)
+
+* Icône app : fond noir, lettre T stylisée en orange avec une flamme
+
+# **6\. Architecture Technique & Développement (Expo)**
+
+## **6.1 Stack Technique**
+
+| Composant | Solution choisie | Justification |
+| :---- | :---- | :---- |
+| Framework | Expo SDK 52 (React Native) | Cross-platform, OTA updates, accès natif facile |
+| Navigation | Expo Router v3 (file-based) | Standard moderne, deep linking natif |
+| State management | Zustand \+ AsyncStorage | Léger, performant, persistance simple |
+| Timer engine | expo-background-fetch \+ useInterval custom | Précision \+ exécution background |
+| Audio | expo-av | Sons de décompte et alertes phase |
+| Haptiques | expo-haptics | Retour tactile natif iOS/Android |
+| Notifications | expo-notifications | Rappels d'entraînement \+ streaks |
+| Widget | react-native-widget-extension | Widget iOS 14+ (Live Activity) |
+| Paiements | react-native-purchases (RevenueCat) | Abonnements \+ A/B testing \+ analytics |
+| Analytics | PostHog (react-native-posthog) | Funnel tracking, drop-off analysis |
+| Storage | expo-secure-store \+ AsyncStorage | Données utilisateur \+ préférences |
+| In-App Review | expo-store-review | Prompt après streak 7 jours |
+
+## **6.2 Features — MoSCoW Priorisation**
+
+### **Must Have (V1 — Lancement)**
+
+| ✅ MUST HAVE — Indispensables au lancement |
+| :---- |
+| ▸  Timer Tabata complet — voir Section 2.1 (toutes phases, sons, haptiques, background) |
+| ▸  Musique intégrée — voir Section 2.2 (3 ambiances × 3 intensités, signaux de phase, coexistence audio) |
+| ▸  Exercices avec GIFs — voir Section 2.3 (38 exercices, modes 1 et 2, affichage GET READY/WORK/REST) |
+| ▸  Synchronisation Timer × Musique × Exercice — voir Section 2.4 |
+| ▸  Modes : Tabata classique, HIIT personnalisé, Pause active |
+| ▸  Affichage plein écran pendant la séance (mode portrait \+ paysage) |
+| ▸  Historique des séances (date, durée, rounds complétés) |
+| ▸  Système de Streak (consécutivité quotidienne, animation de feu) |
+| ▸  Notifications de rappel configurables |
+| ▸  Onboarding 6 écrans avec mini-démo live |
+| ▸  Paywall \+ RevenueCat (essai 7j, mensuel, annuel) |
+| ▸  Dark mode \+ Light mode |
+| ▸  Localisation : EN, FR, ES, DE, PT |
+
+### **Should Have (V1.1 — Semaine 4-8)**
+
+| 🟡 SHOULD HAVE — Valeur ajoutée forte |
+| :---- |
+| ▸  Widget iOS (Home Screen) — affiche le streak et le dernier entraînement |
+| ▸  Widget Android (Glance API) |
+| ▸  Bibliothèque de programmes pré-définis (Débutant / Cardio / Force) |
+| ▸  Statistiques hebdomadaires et mensuelles avec graphiques |
+| ▸  Sons personnalisés (voix, bip, musique d'ambiance) |
+| ▸  Integration Apple Health / Google Fit (calories, activité) |
+| ▸  Partage social (carte récapitulative de la séance) |
+
+### **Could Have (V2 — Mois 3+)**
+
+| 🔵 COULD HAVE — Différenciation long terme |
+| :---- |
+| ▸  Mode Coach IA : suggestions de séances basées sur l'historique |
+| ▸  Challenges communautaires (leaderboard hebdomadaire) |
+| ▸  Apple Watch companion app |
+| ▸  Import/Export de programmes (partage entre utilisateurs) |
+| ▸  Mode TV / AirPlay pour entraînement sur grand écran |
+
+# **7\. Structure de Navigation (Expo Router)**
+
+Architecture file-based avec Expo Router v3 :
+
+| Route | Écran | Accès |
+| :---- | :---- | :---- |
+| / | Home — Hub central avec raccourcis et streak | Tous |
+| /onboarding | Séquence onboarding 6 étapes | Nouveaux utilisateurs |
+| /timer | Minuterie plein écran — séance active | Tous |
+| /programs | Bibliothèque de programmes | Premium |
+| /history | Historique des séances \+ stats | Tous (limité free) |
+| /settings | Préférences, sons, notifications, compte | Tous |
+| /paywall | Écran d'abonnement RevenueCat | Free users |
+| /(modals)/review | In-App Review prompt | Streak 7j |
+
+# **8\. Paiements, Pricing & RevenueCat**
+
+## **8.1 Structure des Offres**
+
+| Offre | Prix US | Prix FR | Prix BR | Contenu |
+| :---- | :---- | :---- | :---- | :---- |
+| Gratuit | Free | Free | Free | Timer standard, 7j historique, pas de widget |
+| Essai Premium | 7 jours gratuits | 7 jours gratuits | 7 jours gratuits | Accès complet, pas de CB requise si possible |
+| Premium Mensuel | $4.99/mois | €4.99/mois | R$9.99/mois | Accès complet illimité |
+| Premium Annuel | $29.99/an | €27.99/an | R$59.99/an | Tout Premium — économie 50% mise en avant |
+
+Note : Pricing localisé via RevenueCat Purchasing Power Parity (PPP). Adapter automatiquement les prix pour le Brésil, l'Inde, l'Indonésie et l'Europe de l'Est pour maximiser les conversions mondiales.
+
+## **8.2 Configuration RevenueCat**
+
+* Entitlements : "premium" (accès à toutes les features payantes)
+
+* Products : tabatago\_monthly, tabatago\_annual, tabatago\_trial\_7d
+
+* A/B Tests dès J+7 : tester $3.99 vs $4.99 vs $6.99 mensuel
+
+* A/B Tests paywall : liste vs comparaison de plans vs "best value" badge
+
+* Webhook RevenueCat → PostHog pour corréler revenus et comportement
+
+# **9\. Analytics & Instrumentation (PostHog)**
+
+## **9.1 Événements Critiques à Tracker**
+
+| Événement | Propriétés | Objectif |
+| :---- | :---- | :---- |
+| onboarding\_step\_viewed | step\_number, step\_name | Identifier le drop-off |
+| onboarding\_demo\_started | duration\_seconds | Mesurer l'engagement Wow |
+| onboarding\_completed | persona, goal, frequency | Segmentation |
+| paywall\_viewed | source, variant | Funnel paiement |
+| trial\_started | plan\_selected | Conversion essai |
+| subscription\_purchased | plan, price, currency | Revenue |
+| session\_started | program\_id, rounds, duration | Engagement produit |
+| session\_completed | rounds\_done, streak\_day | Rétention |
+| streak\_milestone | days\_count | Gamification KPIs |
+| widget\_added | widget\_type | Stickiness |
+| notification\_tapped | notification\_type | Rappels efficacité |
+
+## **9.2 Funnels à Monitorer**
+
+* Funnel Acquisition : Impression App Store → Téléchargement → Onboarding Start → Onboarding Complete → Paywall View → Trial Start → Purchase
+
+* Funnel Rétention : J+1 / J+7 / J+30 ouverture de l'app après téléchargement
+
+* Funnel Engagement : Séance démarrée → Séance complétée → Streak maintenu
+
+Règle d'or : Si impressions mais pas de téléchargements → Réparer screenshots/icône. Si téléchargements mais pas d'essais → Réparer onboarding. Si essais mais pas de paiements → Réparer paywall/pricing.
+
+# **10\. Localisation & Growth Hacking**
+
+## **10.1 Stratégie de Localisation (5 Langues)**
+
+| Langue | Marché cible | Mots-clés spécifiques | Priorité |
+| :---- | :---- | :---- | :---- |
+| Anglais (EN) | US, UK, AU, CA | tabata timer, hiit timer app | 1 — Lancement |
+| Français (FR) | France, Belgique, Québec | minuterie tabata, chrono hiit | 1 — Lancement |
+| Espagnol (ES) | Espagne, Mexique, Argentine | temporizador tabata, ejercicio hiit | 2 — Semaine 2 |
+| Allemand (DE) | Allemagne, Autriche, CH | tabata timer app, intervall training | 2 — Semaine 2 |
+| Portugais (PT-BR) | Brésil | timer tabata, treino hiit | 3 — Mois 2 |
+
+## **10.2 Éléments à Localiser**
+
+* App content : tous les textes UI, onboarding, notifications, erreurs
+
+* App Store listing : titre, sous-titre, description courte, description longue
+
+* Screenshots : localisés avec texte natif (utiliser Fastlane Frameit)
+
+* Prix : PPP via RevenueCat (automatique par pays)
+
+* Mots-clés App Store : 100 caractères spécifiques par marché
+
+Outil recommandé : i18next \+ expo-localization pour la gestion des traductions en développement.
+
+# **11\. App Store Optimization (ASO)**
+
+## **11.1 Fiche App Store (iOS — EN)**
+
+| Champ | Valeur optimisée |
+| :---- | :---- |
+| Nom de l'app (30 car.) | TabataGo — HIIT Timer |
+| Sous-titre (30 car.) | Tabata & Interval Workout |
+| Mots-clés (100 car.) | tabata,hiit,timer,interval,workout,fitness,training,countdown,sport,exercise |
+| Description (1ère ligne) | The most motivating Tabata timer. 20 seconds of effort. Life-changing results. |
+| Screenshots (10 max) | Voir section 10.2 |
+| Preview video | 15-30s montrant la minuterie en action \+ streak \+ widget |
+
+## **11.2 Plan des Screenshots (6 obligatoires)**
+
+| \# | Contenu | Message clé | Background |
+| :---- | :---- | :---- | :---- |
+| 1 | Timer plein écran en action (20s) | "Train smarter, not longer" | Dark \+ orange |
+| 2 | Écran d'onboarding moment Wow | "Your first Tabata in 20 seconds" | Gradient sombre |
+| 3 | Widget iOS home screen | "Train from anywhere — even your lock screen" | iPhone mockup |
+| 4 | Historique \+ Streak en feu | "Build the habit. Keep the streak." | Dark \+ vert |
+| 5 | Bibliothèque de programmes | "100+ ready-to-go programs" | Gradient |
+| 6 | Statistiques mensuelles | "See your progress. Stay motivated." | Fond clair |
+
+# **12\. Plan de Lancement en 72h**
+
+## **12.1 Timeline de Développement (72 heures)**
+
+| Phase | Durée | Livrables | Responsable |
+| :---- | :---- | :---- | :---- |
+| Setup & Architecture | H0 → H8 | Expo project init, navigation, design system, RevenueCat config | Dev Lead |
+| Onboarding | H8 → H20 | 6 écrans onboarding \+ mini-timer démo \+ animation | Dev \+ Design |
+| Core Timer | H20 → H36 | Minuterie plein écran, son, haptiques, background timer | Dev |
+| Streak \+ Historique | H36 → H48 | Système streak, storage, affichage historique, notifications | Dev |
+| Paywall \+ Analytics | H48 → H58 | RevenueCat paywall, PostHog events, A/B test config | Dev |
+| Polish & Testing | H58 → H68 | Bug fixes, dark/light mode, performance, edge cases | Dev \+ QA |
+| Submission | H68 → H72 | Screenshots, App Store listing (5 langues), soumission Apple | PM \+ Dev |
+
+## **12.2 Stratégie de Validation Post-Lancement**
+
+Profiter du boost de visibilité des 3 premiers jours accordé par l'App Store aux nouvelles applications :
+
+1. Jour 1-3 : Monitoring organique — Analyser impressions, téléchargements, et premiers essais
+
+2. Jour 4-7 : Analyse funnel — Identifier le premier point de friction (onboarding? paywall?)
+
+3. Jour 8-14 : Première itération — Corriger le problème prioritaire et soumettre mise à jour OTA (Expo)
+
+4. Jour 15-30 : Activation publicité — Apple Search Ads seulement si CVR organique \> 15%
+
+5. Jour 30+ : Scale — Augmenter budget pub sur les marchés qui convertissent le mieux
+
+Règle absolue : Ne jamais dépenser en publicité avant d'avoir validé que le funnel organique convertit.
+
+# **13\. KPIs & Métriques de Succès**
+
+| Métrique | Semaine 1 | Mois 1 | Mois 3 | Outil de mesure |
+| :---- | :---- | :---- | :---- | :---- |
+| Téléchargements | 500+ | 5 000+ | 20 000+ | App Store Connect |
+| Taux conversion Impression→DL | \> 5% | \> 8% | \> 10% | App Store Connect |
+| Taux essai démarré | \> 25% | \> 30% | \> 35% | RevenueCat \+ PostHog |
+| Taux conversion essai→payant | \> 30% | \> 35% | \> 40% | RevenueCat |
+| Rétention J+7 | \> 30% | \> 35% | \> 40% | PostHog |
+| Rétention J+30 | — | \> 20% | \> 25% | PostHog |
+| MRR | — | $2 000+ | $8 000+ | RevenueCat |
+| Note App Store | — | ≥ 4.5 | ≥ 4.6 | App Store Connect |
+| Streak moyen (actifs) | — | \> 5 jours | \> 10 jours | PostHog custom |
+
+# **14\. Risques & Mitigations**
+
+| Risque | Probabilité | Impact | Mitigation |
+| :---- | :---- | :---- | :---- |
+| Refus App Store (guidelines) | Moyen | Élevé | Respecter HIG Apple, tester paywall sur TestFlight, pas de dark patterns |
+| Mauvais taux de conversion paywall | Moyen | Élevé | A/B test RevenueCat dès J+7, 3 variantes de prix/layout |
+| Précision du timer en background | Faible | Élevé | expo-background-fetch \+ notification locale comme fallback |
+| Faible rétention sans streaks | Moyen | Moyen | Streak J+1 core feature, reminder push personnalisé par heure d'entraînement |
+| Concurrence sur mots-clés EN | Élevé | Moyen | Agressivité sur marchés FR/ES/DE dès J+14 |
+| Revue Apple lente (\> 48h) | Faible | Faible | Soumettre J-5 avant objectif lancement, utiliser Expo OTA pour hotfixes |
+
+# **15\. Approbations & Versions**
+
+| Rôle | Nom | Date | Signature |
+| :---- | :---- | :---- | :---- |
+| Product Owner |  | Février 2026 |  |
+| Tech Lead |  | Février 2026 |  |
+| Design Lead |  | Février 2026 |  |
+| Marketing |  | Février 2026 |  |
+
+*Document créé le 15 février 2026 — TabataGo PRD v1.1*
\ No newline at end of file
diff --git a/.archive/TabataGo_StyleGuide_v1.0.md b/.archive/TabataGo_StyleGuide_v1.0.md
new file mode 100644
index 0000000..ce555c2
--- /dev/null
+++ b/.archive/TabataGo_StyleGuide_v1.0.md
@@ -0,0 +1,1198 @@
+# TabataGo — Visual Style Guide v1.0
+
+> Document pratique pour les développeurs. Tokens, composants, et exemples de code prêts à l'emploi.
+
+---
+
+## 1. Color Tokens
+
+### 1.1 Brand Colors
+
+```typescript
+// src/shared/constants/colors.ts
+
+export const BRAND = {
+  PRIMARY: '#F97316',       // Orange Energy - Main brand color
+  PRIMARY_LIGHT: '#FB923C', // Orange Glow - Hover, accents
+  PRIMARY_DARK: '#EA580C',  // Orange Deep - Work phase
+  SECONDARY: '#FBBF24',     // Gold - Streaks, badges
+  DANGER: '#EF4444',        // Red - Alerts, last seconds
+  SUCCESS: '#22C55E',       // Green - Complete, success
+  INFO: '#3B82F6',          // Blue - Rest phase, info
+} as const
+```
+
+### 1.2 Dark Theme (Base)
+
+```typescript
+export const DARK = {
+  BASE: '#1A1A1E',          // Main background
+  RAISED: '#222226',        // Cards level 1
+  ELEVATED: '#2A2A2E',      // Cards level 2, modals
+  SURFACE: '#0A0A0E',       // Focus zones, timer
+  OVERLAY_1: 'rgba(255, 255, 255, 0.04)',   // Subtle hover
+  OVERLAY_2: 'rgba(255, 255, 255, 0.08)',   // Active states
+  OVERLAY_3: 'rgba(255, 255, 255, 0.12)',   // Selected states
+  SCRIM: 'rgba(0, 0, 0, 0.6)',              // Modal overlay
+} as const
+```
+
+### 1.3 Text Colors
+
+```typescript
+export const TEXT = {
+  PRIMARY: '#FFFFFF',
+  SECONDARY: 'rgba(255, 255, 255, 0.85)',
+  TERTIARY: 'rgba(255, 255, 255, 0.70)',
+  MUTED: 'rgba(255, 255, 255, 0.55)',
+  HINT: 'rgba(255, 255, 255, 0.40)',
+  DISABLED: 'rgba(255, 255, 255, 0.25)',
+} as const
+```
+
+### 1.4 Border Colors
+
+```typescript
+export const BORDER = {
+  SUBTLE: 'rgba(255, 255, 255, 0.04)',
+  LIGHT: 'rgba(255, 255, 255, 0.08)',
+  MEDIUM: 'rgba(255, 255, 255, 0.12)',
+  STRONG: 'rgba(255, 255, 255, 0.20)',
+  BRAND: 'rgba(249, 115, 22, 0.30)',
+} as const
+```
+
+### 1.5 Phase Gradients
+
+```typescript
+export const PHASE_GRADIENTS = {
+  IDLE: ['#0A0A14', '#12101F', '#1E1E2E'] as const,
+  GET_READY: ['#451A03', '#92400E', '#D97706'] as const,
+  WORK: ['#450A0A', '#991B1B', '#EA580C'] as const,
+  REST: ['#0C1929', '#1E3A5F', '#2563EB'] as const,
+  COMPLETE: ['#052E16', '#166534', '#16A34A'] as const,
+} as const
+```
+
+### 1.6 Glow Effects
+
+```typescript
+export const GLOW = {
+  // Orange glow (primary)
+  ENERGY: {
+    shadowColor: '#F97316',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.5,
+    shadowRadius: 40,
+  },
+  ENERGY_INTENSE: {
+    shadowColor: '#F97316',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.7,
+    shadowRadius: 60,
+  },
+  // White glow (active)
+  WHITE: {
+    shadowColor: '#FFFFFF',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.3,
+    shadowRadius: 20,
+  },
+  // Red glow (danger)
+  DANGER: {
+    shadowColor: '#EF4444',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.5,
+    shadowRadius: 30,
+  },
+} as const
+```
+
+---
+
+## 2. Typography Scale
+
+### 2.1 Font Family
+
+```typescript
+// Single font family for consistency
+export const FONT_FAMILY = {
+  REGULAR: 'Inter',
+  MEDIUM: 'Inter',
+  SEMIBOLD: 'Inter',
+  BOLD: 'Inter',
+  EXTRABOLD: 'Inter',
+  BLACK: 'Inter',
+} as const
+```
+
+### 2.2 Type Scale
+
+```typescript
+// src/shared/constants/typography.ts
+
+import { TextStyle } from 'react-native'
+
+export const TYPOGRAPHY = {
+  // ═══════════════════════════════════════════════════════════
+  // DISPLAY — Maximum impact
+  // ═══════════════════════════════════════════════════════════
+
+  // Timer countdown (the hero number)
+  countdown: {
+    fontFamily: 'Inter',
+    fontSize: 140,
+    fontWeight: '900',
+    fontVariant: ['tabular-nums'],
+    letterSpacing: -2,
+  } as TextStyle,
+
+  // Time display (completion screen)
+  timeDisplay: {
+    fontFamily: 'Inter',
+    fontSize: 72,
+    fontWeight: '900',
+    fontVariant: ['tabular-nums'],
+    letterSpacing: -1,
+  } as TextStyle,
+
+  // Brand title (TABATA)
+  brandTitle: {
+    fontFamily: 'Inter',
+    fontSize: 56,
+    fontWeight: '900',
+    letterSpacing: 8,
+  } as TextStyle,
+
+  // Display large (onboarding titles, victory)
+  displayLarge: {
+    fontFamily: 'Inter',
+    fontSize: 42,
+    fontWeight: '900',
+    letterSpacing: 2,
+  } as TextStyle,
+
+  // Display small (GO, section headers)
+  displaySmall: {
+    fontFamily: 'Inter',
+    fontSize: 32,
+    fontWeight: '900',
+    letterSpacing: 4,
+  } as TextStyle,
+
+  // ═══════════════════════════════════════════════════════════
+  // HEADLINES — Section titles, emphasis
+  // ═══════════════════════════════════════════════════════════
+
+  // Hero button text (START)
+  buttonHero: {
+    fontFamily: 'Inter',
+    fontSize: 30,
+    fontWeight: '900',
+    letterSpacing: 4,
+  } as TextStyle,
+
+  // Heading (screen titles, card titles)
+  heading: {
+    fontFamily: 'Inter',
+    fontSize: 24,
+    fontWeight: '800',
+    letterSpacing: 0.5,
+  } as TextStyle,
+
+  // Subheading
+  subheading: {
+    fontFamily: 'Inter',
+    fontSize: 20,
+    fontWeight: '700',
+    letterSpacing: 0.3,
+  } as TextStyle,
+
+  // ═══════════════════════════════════════════════════════════
+  // BODY — Readable content
+  // ═══════════════════════════════════════════════════════════
+
+  // Large body (descriptions, emphasis)
+  bodyLarge: {
+    fontFamily: 'Inter',
+    fontSize: 18,
+    fontWeight: '600',
+    lineHeight: 26,
+  } as TextStyle,
+
+  // Standard body
+  body: {
+    fontFamily: 'Inter',
+    fontSize: 16,
+    fontWeight: '400',
+    lineHeight: 24,
+  } as TextStyle,
+
+  // ═══════════════════════════════════════════════════════════
+  // CAPTION & LABELS — Smaller text
+  // ═══════════════════════════════════════════════════════════
+
+  // Caption (secondary info)
+  caption: {
+    fontFamily: 'Inter',
+    fontSize: 14,
+    fontWeight: '500',
+    lineHeight: 20,
+  } as TextStyle,
+
+  // Label (badges, tags)
+  label: {
+    fontFamily: 'Inter',
+    fontSize: 13,
+    fontWeight: '700',
+    letterSpacing: 0.5,
+  } as TextStyle,
+
+  // Overline (section labels, uppercase)
+  overline: {
+    fontFamily: 'Inter',
+    fontSize: 11,
+    fontWeight: '600',
+    letterSpacing: 1.5,
+    textTransform: 'uppercase',
+  } as TextStyle,
+
+  // Micro (tiny labels)
+  micro: {
+    fontFamily: 'Inter',
+    fontSize: 10,
+    fontWeight: '600',
+    letterSpacing: 1,
+  } as TextStyle,
+
+} as const
+```
+
+### 2.3 Usage Examples
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│  TYPOGRAPHY PREVIEW                                             │
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐   │
+│  │  countdown    140   20                                   │   │
+│  │  timeDisplay   72   4:00                                 │   │
+│  │  brandTitle    56   TABATA                               │   │
+│  │  displayLarge  42   Terminé !                            │   │
+│  │  displaySmall  32   GO                                   │   │
+│  │  buttonHero    30   START                                │   │
+│  │  heading       24   Tabata Classic                       │   │
+│  │  subheading    20   Séances cette semaine                │   │
+│  │  bodyLarge     18   Description importante               │   │
+│  │  body          16   Texte courant standard               │   │
+│  │  caption       14   Information secondaire               │   │
+│  │  label         13   BEGINNER                             │   │
+│  │  overline      11   TON PROGRAMME                        │   │
+│  │  micro         10   8 rounds                             │   │
+│  └─────────────────────────────────────────────────────────┘   │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+## 3. Spacing System
+
+### 3.1 Scale (4px base)
+
+```typescript
+// src/shared/constants/spacing.ts
+
+export const SPACING = {
+  0: 0,
+  0.5: 2,
+  1: 4,
+  1.5: 6,
+  2: 8,
+  2.5: 10,
+  3: 12,
+  3.5: 14,
+  4: 16,
+  5: 20,
+  6: 24,
+  7: 28,
+  8: 32,
+  10: 40,
+  12: 48,
+  14: 56,
+  16: 64,
+  20: 80,
+  24: 96,
+} as const
+
+// Semantic aliases
+export const SPACE = {
+  NONE: 0,
+  XXXS: 2,
+  XXS: 4,
+  XS: 8,
+  SM: 12,
+  MD: 16,
+  LG: 24,
+  XL: 32,
+  XXL: 48,
+  XXXL: 64,
+  PAGE: 24,        // Horizontal page padding
+  SECTION: 40,     // Between major sections
+  CARD: 16,        // Internal card padding
+  BUTTON: 16,      // Button padding
+} as const
+```
+
+### 3.2 Visual Reference
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│  SPACING SCALE                                                  │
+│                                                                 │
+│  0   ─ (none)                                                   │
+│  2   ── (xxxs)                                                  │
+│  4   ──── (xxs)                                                 │
+│  8   ──────── (xs)                                              │
+│  12  ──────────── (sm)                                          │
+│  16  ──────────────── (md)                                      │
+│  24  ──────────────────────── (lg)                              │
+│  32  ──────────────────────────────── (xl)                      │
+│  48  ──────────────────────────────────────────────── (xxl)     │
+│  64  ──────────────────────────────────────────────────────────────── (xxxl) │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+## 4. Border Radius
+
+### 4.1 Scale
+
+```typescript
+// src/shared/constants/borderRadius.ts
+
+export const RADIUS = {
+  NONE: 0,
+  XS: 4,       // Tags, small elements
+  SM: 6,       // Small buttons
+  MD: 8,       // Badges, chips
+  LG: 12,      // Buttons, inputs
+  XL: 16,      // Cards
+  XXL: 20,     // Large cards, modals
+  XXXL: 24,    // Bottom sheets
+  FULL: 9999,  // Pills, circles
+} as const
+```
+
+### 4.2 Usage Guide
+
+| Radius | Use Case |
+|--------|----------|
+| `XS` (4px) | Inline tags, tiny badges |
+| `SM` (6px) | Small buttons, compact cards |
+| `MD` (8px) | Standard badges, chips |
+| `LG` (12px) | Buttons, inputs, medium cards |
+| `XL` (16px) | Standard cards, list items |
+| `XXL` (20px) | Large cards, bottom sheets |
+| `XXXL` (24px) | Modal containers, hero cards |
+| `FULL` | Pills, circular avatars, CTA buttons |
+
+---
+
+## 5. Shadows & Glows
+
+### 5.1 Elevation Shadows
+
+```typescript
+// src/shared/constants/shadows.ts
+
+import { ViewStyle } from 'react-native'
+
+export const SHADOW = {
+  // Subtle elevation (cards)
+  sm: {
+    shadowColor: '#000000',
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.15,
+    shadowRadius: 8,
+    elevation: 2,
+  } as ViewStyle,
+
+  // Medium elevation (raised cards)
+  md: {
+    shadowColor: '#000000',
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.2,
+    shadowRadius: 16,
+    elevation: 4,
+  } as ViewStyle,
+
+  // High elevation (modals)
+  lg: {
+    shadowColor: '#000000',
+    shadowOffset: { width: 0, height: 8 },
+    shadowOpacity: 0.25,
+    shadowRadius: 24,
+    elevation: 8,
+  } as ViewStyle,
+
+} as const
+```
+
+### 5.2 Brand Glows
+
+```typescript
+export const GLOW = {
+  // Primary orange glow
+  brand: {
+    shadowColor: '#F97316',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.5,
+    shadowRadius: 40,
+  } as ViewStyle,
+
+  // Intense glow (active states)
+  brandIntense: {
+    shadowColor: '#F97316',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.7,
+    shadowRadius: 60,
+  } as ViewStyle,
+
+  // Subtle glow (hover)
+  brandSubtle: {
+    shadowColor: '#F97316',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.3,
+    shadowRadius: 20,
+  } as ViewStyle,
+
+  // White glow (active elements)
+  white: {
+    shadowColor: '#FFFFFF',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.3,
+    shadowRadius: 16,
+  } as ViewStyle,
+
+  // Danger glow (warnings)
+  danger: {
+    shadowColor: '#EF4444',
+    shadowOffset: { width: 0, height: 0 },
+    shadowOpacity: 0.5,
+    shadowRadius: 24,
+  } as ViewStyle,
+
+} as const
+```
+
+### 5.3 Text Shadows
+
+```typescript
+export const TEXT_SHADOW = {
+  // Brand orange shadow
+  brand: {
+    textShadowColor: '#F97316',
+    textShadowOffset: { width: 0, height: 0 },
+    textShadowRadius: 20,
+  },
+
+  // White soft shadow
+  white: {
+    textShadowColor: 'rgba(255, 255, 255, 0.3)',
+    textShadowOffset: { width: 0, height: 0 },
+    textShadowRadius: 12,
+  },
+
+  // Intense white
+  whiteIntense: {
+    textShadowColor: 'rgba(255, 255, 255, 0.5)',
+    textShadowOffset: { width: 0, height: 0 },
+    textShadowRadius: 20,
+  },
+
+  // Danger red
+  danger: {
+    textShadowColor: '#EF4444',
+    textShadowOffset: { width: 0, height: 0 },
+    textShadowRadius: 16,
+  },
+
+} as const
+```
+
+---
+
+## 6. Component Specs
+
+### 6.1 Primary Button (CTA)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│               ┌─────────────────────────────┐                  │
+│               │         START               │                  │
+│               │     (150×150 circle)        │                  │
+│               └─────────────────────────────┘                  │
+│                         ▓▓▓▓▓▓▓                               │
+│                    (Glow breathing)                            │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+```typescript
+// Primary CTA Button (Circular)
+const styles = StyleSheet.create({
+  ctaButton: {
+    width: 150,
+    height: 150,
+    borderRadius: 75,
+    backgroundColor: BRAND.PRIMARY,
+    alignItems: 'center',
+    justifyContent: 'center',
+    ...GLOW.brand,
+  },
+  ctaButtonPressed: {
+    transform: [{ scale: 0.95 }],
+  },
+  ctaText: {
+    ...TYPOGRAPHY.buttonHero,
+    color: TEXT.PRIMARY,
+  },
+  ctaGlow: {
+    position: 'absolute',
+    width: 172,
+    height: 172,
+    borderRadius: 86,
+    backgroundColor: BRAND.PRIMARY,
+    opacity: 0.3, // Animated: 0.3 → 0.6 → 0.3
+  },
+})
+```
+
+### 6.2 Secondary Button (Pill)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│     ┌───────────────────────────────────────────────────┐      │
+│     │                 SUIVANT  →                        │      │
+│     └───────────────────────────────────────────────────┘      │
+│     (Full width pill, gradient fill, glow effect)              │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+```typescript
+// Secondary Button (Pill)
+const styles = StyleSheet.create({
+  button: {
+    height: 54,
+    borderRadius: RADIUS.FULL,
+    backgroundColor: BRAND.PRIMARY,
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: SPACING[10],
+    ...GLOW.brandSubtle,
+  },
+  buttonText: {
+    ...TYPOGRAPHY.subheading,
+    color: TEXT.PRIMARY,
+    letterSpacing: 2,
+  },
+})
+```
+
+### 6.3 Tertiary Button (Ghost)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│     ┌───────────────────────────────────────────────────┐      │
+│     │              Continuer sans abonnement            │      │
+│     └───────────────────────────────────────────────────┘      │
+│     (Transparent bg, subtle border, no glow)                   │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+```typescript
+// Tertiary Button (Ghost)
+const styles = StyleSheet.create({
+  button: {
+    height: 44,
+    borderRadius: RADIUS.LG,
+    backgroundColor: 'transparent',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: SPACING[6],
+    borderWidth: 1,
+    borderColor: BORDER.LIGHT,
+  },
+  buttonText: {
+    ...TYPOGRAPHY.caption,
+    color: TEXT.HINT,
+  },
+})
+```
+
+### 6.4 Card (Standard)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│  ┌─────────────────────────────────────────────────────────┐    │
+│  │                                                         │    │
+│  │   Tabata Classic                            BEGINNER   │    │
+│  │                                                         │    │
+│  │   8 rounds de Burpees pour commencer en force         │    │
+│  │                                                         │    │
+│  │   ┌──────────┐                                        │    │
+│  │   │ Burpees  │   8 rounds • 4 min • 1 ex.            │    │
+│  │   └──────────┘                                        │    │
+│  │                                                         │    │
+│  └─────────────────────────────────────────────────────────┘    │
+│  (Soft elevated, subtle border, rounded corners)               │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+```typescript
+// Standard Card
+const styles = StyleSheet.create({
+  card: {
+    backgroundColor: DARK.RAISED,
+    borderRadius: RADIUS.XXL,
+    borderWidth: 1,
+    borderColor: BORDER.LIGHT,
+    padding: SPACING[6],
+    ...SHADOW.md,
+  },
+  cardSelected: {
+    backgroundColor: 'rgba(249, 115, 22, 0.08)',
+    borderColor: BORDER.BRAND,
+    ...GLOW.brandSubtle,
+  },
+  cardTitle: {
+    ...TYPOGRAPHY.heading,
+    color: TEXT.PRIMARY,
+  },
+  cardDescription: {
+    ...TYPOGRAPHY.body,
+    color: TEXT.MUTED,
+    marginTop: SPACING[2],
+  },
+})
+```
+
+### 6.5 Badge (Difficulty)
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│   BEGINNER      INTERMEDIATE      ADVANCED                     │
+│   ─────────     ─────────────     ─────────                    │
+│   Vert #4ADE80  Or #FBBF24        Rouge #F87171               │
+│                                                                 │
+│   ┌────────┐    ┌────────────┐    ┌──────────┐                │
+│   │BEGINNER│    │INTERMEDIATE│    │ ADVANCED │                │
+│   └────────┘    └────────────┘    └──────────┘                │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+```typescript
+// Difficulty Badge
+const DIFFICULTY_STYLES = {
+  BEGINNER: {
+    bg: 'rgba(74, 222, 128, 0.15)',
+    text: '#4ADE80',
+  },
+  INTERMEDIATE: {
+    bg: 'rgba(251, 191, 36, 0.15)',
+    text: '#FBBF24',
+  },
+  ADVANCED: {
+    bg: 'rgba(248, 113, 113, 0.15)',
+    text: '#F87171',
+  },
+}
+
+const styles = StyleSheet.create({
+  badge: {
+    paddingHorizontal: SPACING[3],
+    paddingVertical: SPACING[1.5],
+    borderRadius: RADIUS.MD,
+  },
+  badgeText: {
+    ...TYPOGRAPHY.label,
+    letterSpacing: 0.5,
+  },
+})
+```
+
+### 6.6 Input Field
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│   LABEL                                                         │
+│   ┌───────────────────────────────────────────────────────┐    │
+│   │  Placeholder text...                              □   │    │
+│   └───────────────────────────────────────────────────────┘    │
+│   (Dark background, subtle border, rounded corners)            │
+│                                                                 │
+│   FOCUSED STATE                                                 │
+│   ┌───────────────────────────────────────────────────────┐    │
+│   │  Entered text                                     ✓   │ ▒▒ │
+│   └───────────────────────────────────────────────────────┘    │
+│   (Brand border glow when focused)                             │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+```typescript
+// Input Field
+const styles = StyleSheet.create({
+  inputContainer: {
+    backgroundColor: DARK.RAISED,
+    borderRadius: RADIUS.LG,
+    borderWidth: 1,
+    borderColor: BORDER.LIGHT,
+    paddingHorizontal: SPACING[4],
+    height: 48,
+  },
+  inputContainerFocused: {
+    borderColor: BRAND.PRIMARY,
+    ...GLOW.brandSubtle,
+  },
+  input: {
+    ...TYPOGRAPHY.body,
+    color: TEXT.PRIMARY,
+    flex: 1,
+  },
+  label: {
+    ...TYPOGRAPHY.overline,
+    color: TEXT.HINT,
+    marginBottom: SPACING[2],
+  },
+})
+```
+
+### 6.7 Progress Bar
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                                                                 │
+│   Default:  ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ │
+│                                                                 │
+│   Progress: ▓▓▓▓▓▓▓▓▓▓▓░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ │
+│             (Orange gradient fill with subtle glow)            │
+│                                                                 │
+│   Size variations:                                              │
+│   Thin:   ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ (4px)  │
+│   Medium: ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ (6px)  │
+│   Thick: ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ (8px)  │
+│                                                                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+```typescript
+// Progress Bar
+const styles = StyleSheet.create({
+  container: {
+    height: 6,
+    backgroundColor: DARK.OVERLAY_2,
+    borderRadius: RADIUS.FULL,
+    overflow: 'hidden',
+  },
+  fill: {
+    height: '100%',
+    backgroundColor: BRAND.PRIMARY,
+    borderRadius: RADIUS.FULL,
+  },
+  // With glow
+  fillWithGlow: {
+    ...GLOW.brandSubtle,
+  },
+})
+```
+
+---
+
+## 7. Animation Specs
+
+### 7.1 Timing Constants
+
+```typescript
+// src/shared/constants/animations.ts
+
+export const DURATION = {
+  INSTANT: 100,      // Micro-feedback
+  FAST: 200,         // Quick interactions
+  NORMAL: 300,       // Standard transitions
+  SLOW: 400,         // Cross-fades, reveals
+  BREATHING: 2000,   // Cyclic animations
+  BREATHING_HALF: 1000,
+} as const
+
+export const EASING = {
+  // Standard ease (most transitions)
+  STANDARD: Easing.inOut(Easing.cubic),
+
+  // Ease out (elements entering)
+  OUT: Easing.out(Easing.cubic),
+
+  // Ease in (elements leaving)
+  IN: Easing.in(Easing.cubic),
+
+  // Bouncy (playful interactions)
+  BOUNCY: Easing.elastic(1.2),
+} as const
+
+export const SPRING = {
+  // Gentle bounce
+  GENTLE: {
+    damping: 20,
+    stiffness: 150,
+  },
+
+  // Bouncy pop (victory, celebrations)
+  BOUNCY: {
+    damping: 12,
+    stiffness: 180,
+  },
+
+  // Snappy (quick feedback)
+  SNAPPY: {
+    damping: 25,
+    stiffness: 300,
+  },
+} as const
+```
+
+### 7.2 Animation Presets
+
+```typescript
+// Pre-built animation configs
+
+export const ANIMATION = {
+  // Fade in
+  FADE_IN: {
+    toValue: 1,
+    duration: DURATION.NORMAL,
+    easing: EASING.OUT,
+    useNativeDriver: true,
+  },
+
+  // Fade out
+  FADE_OUT: {
+    toValue: 0,
+    duration: DURATION.NORMAL,
+    easing: EASING.IN,
+    useNativeDriver: true,
+  },
+
+  // Scale up (pop in)
+  POP_IN: {
+    toValue: 1,
+    duration: DURATION.SLOW,
+    easing: EASING.BOUNCY,
+    useNativeDriver: true,
+  },
+
+  // Pulse (countdown tick)
+  PULSE_UP: {
+    toValue: 1.03,
+    duration: 100,
+    easing: EASING.OUT,
+    useNativeDriver: true,
+  },
+  PULSE_DOWN: {
+    toValue: 1,
+    duration: 100,
+    easing: EASING.IN,
+    useNativeDriver: true,
+  },
+
+  // Breathing glow
+  BREATH_HALF: {
+    toValue: 1,
+    duration: DURATION.BREATHING_HALF,
+    easing: EASING.STANDARD,
+    useNativeDriver: false, // Opacity/color can't be native
+  },
+
+  // Gradient crossfade
+  GRADIENT_CROSSFADE: {
+    toValue: 1,
+    duration: DURATION.SLOW,
+    easing: EASING.STANDARD,
+    useNativeDriver: false,
+  },
+} as const
+```
+
+### 7.3 Common Animations
+
+```typescript
+// Glow breathing (START button)
+const glowAnim = useRef(new Animated.Value(0)).current
+
+useEffect(() => {
+  Animated.loop(
+    Animated.sequence([
+      Animated.timing(glowAnim, {
+        toValue: 1,
+        duration: 2000,
+        easing: EASING.STANDARD,
+        useNativeDriver: false,
+      }),
+      Animated.timing(glowAnim, {
+        toValue: 0,
+        duration: 2000,
+        easing: EASING.STANDARD,
+        useNativeDriver: false,
+      }),
+    ])
+  ).start()
+}, [])
+
+const glowOpacity = glowAnim.interpolate({
+  inputRange: [0, 1],
+  outputRange: [0.3, 0.6],
+})
+
+const glowScale = glowAnim.interpolate({
+  inputRange: [0, 1],
+  outputRange: [1, 1.08],
+})
+```
+
+```typescript
+// Countdown pulse
+const pulseAnim = useRef(new Animated.Value(1)).current
+
+useEffect(() => {
+  Animated.sequence([
+    Animated.timing(pulseAnim, ANIMATION.PULSE_UP),
+    Animated.timing(pulseAnim, ANIMATION.PULSE_DOWN),
+  ]).start()
+}, [secondsLeft])
+```
+
+```typescript
+// Victory pop
+const scaleAnim = useRef(new Animated.Value(0.5)).current
+
+useEffect(() => {
+  Animated.spring(scaleAnim, {
+    toValue: 1,
+    ...SPRING.BOUNCY,
+    useNativeDriver: true,
+  }).start()
+}, [])
+```
+
+---
+
+## 8. Icon Reference
+
+### 8.1 Ionicons Mapping
+
+```typescript
+// src/shared/constants/icons.ts
+
+export const ICONS = {
+  // Navigation
+  HOME: 'home',
+  HISTORY: 'time',
+  SETTINGS: 'settings',
+
+  // Timer controls
+  PLAY: 'play',
+  PAUSE: 'pause',
+  STOP: 'stop',
+  SKIP: 'play-skip-forward',
+
+  // Actions
+  CHEVRON_RIGHT: 'chevron-forward',
+  CHEVRON_LEFT: 'chevron-back',
+  CLOSE: 'close',
+  CHECK: 'checkmark',
+
+  // Status
+  FLAME: 'flame',
+  TROPHY: 'trophy',
+  CHECK_CIRCLE: 'checkmark-circle',
+
+  // Info
+  INFO: 'information-circle',
+  WARNING: 'warning',
+  LOCK: 'lock-closed',
+} as const
+```
+
+### 8.2 Icon Sizes
+
+```typescript
+export const ICON_SIZE = {
+  XS: 16,
+  SM: 20,
+  MD: 24,
+  LG: 28,
+  XL: 32,
+  XXL: 48,
+} as const
+```
+
+---
+
+## 9. Safe Areas & Layout
+
+### 9.1 Layout Constants
+
+```typescript
+// src/shared/constants/layout.ts
+
+export const LAYOUT = {
+  // Horizontal padding for screens
+  PAGE_HORIZONTAL: 24,
+
+  // Minimum touch target
+  TOUCH_TARGET: 44,
+
+  // Tab bar height
+  TAB_BAR_HEIGHT: 80,
+
+  // Header height
+  HEADER_HEIGHT: 56,
+
+  // Bottom sheet handle
+  BOTTOM_SHEET_HANDLE: 24,
+} as const
+```
+
+### 9.2 Safe Area Usage
+
+```typescript
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
+
+function Screen() {
+  const insets = useSafeAreaInsets()
+
+  return (
+    <View style={{
+      flex: 1,
+      paddingTop: insets.top,
+      paddingBottom: insets.bottom,
+      paddingHorizontal: LAYOUT.PAGE_HORIZONTAL,
+    }}>
+      {/* Content */}
+    </View>
+  )
+}
+```
+
+---
+
+## 10. Accessibility
+
+### 10.1 Minimum Touch Targets
+
+```typescript
+// All interactive elements must be at least 44×44
+
+const TOUCH_TARGET_STYLE = {
+  minHeight: 44,
+  minWidth: 44,
+  justifyContent: 'center',
+  alignItems: 'center',
+}
+```
+
+### 10.2 Contrast Ratios
+
+| Text Size | Minimum Ratio | Status |
+|-----------|---------------|--------|
+| Large (18px+) | 3:1 | ✅ TEXT.PRIMARY on DARK.BASE |
+| Normal | 4.5:1 | ✅ TEXT.SECONDARY on DARK.BASE |
+| Small (<14px) | 4.5:1 | ⚠️ TEXT.HINT may need adjustment |
+
+### 10.3 Accessibility Labels
+
+```typescript
+<Pressable
+  accessibilityLabel="Démarrer la séance"
+  accessibilityHint="Double-tap pour commencer"
+  accessibilityRole="button"
+>
+  <Text>START</Text>
+</Pressable>
+```
+
+---
+
+## 11. Quick Reference Card
+
+```
+┌─────────────────────────────────────────────────────────────────┐
+│                    TABATAGO QUICK REFERENCE                     │
+├─────────────────────────────────────────────────────────────────┤
+│  COLORS                                                         │
+│  Primary:    #F97316 (Orange Energy)                           │
+│  Dark Base:  #1A1A1E                                           │
+│  Text:       #FFFFFF → rgba(255,255,255,0.40)                  │
+├─────────────────────────────────────────────────────────────────┤
+│  TYPOGRAPHY                                                     │
+│  Font:       Inter                                              │
+│  Countdown:  900 140px                                          │
+│  Heading:    800 24px                                           │
+│  Body:       400 16px                                           │
+│  Caption:    500 14px                                           │
+├─────────────────────────────────────────────────────────────────┤
+│  SPACING                                                        │
+│  Base:       4px                                                │
+│  Page:       24px                                               │
+│  Card:       16px                                               │
+│  Section:    40px                                               │
+├─────────────────────────────────────────────────────────────────┤
+│  RADIUS                                                         │
+│  Button:     9999px (pill)                                     │
+│  Card:       20px                                               │
+│  Badge:      8px                                                │
+├─────────────────────────────────────────────────────────────────┤
+│  ANIMATION                                                      │
+│  Fast:       200ms                                              │
+│  Normal:     300ms                                              │
+│  Breathing:  2000ms                                             │
+│  Easing:     cubic in-out                                       │
+├─────────────────────────────────────────────────────────────────┤
+│  GLOW                                                           │
+│  Brand:      #F97316, 0.5 opacity, 40px radius                 │
+│  White:      #FFFFFF, 0.3 opacity, 16px radius                 │
+└─────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+## 12. File Structure
+
+```
+src/shared/constants/
+├── colors.ts          // All color tokens
+├── typography.ts      // Type scale
+├── spacing.ts         // Spacing scale
+├── borderRadius.ts    // Radius tokens
+├── shadows.ts         // Shadow & glow effects
+├── animations.ts      // Animation presets
+├── icons.ts           // Icon mappings
+└── layout.ts          // Layout constants
+```
+
+---
+
+*Document créé le 18 février 2026 — TabataGo Style Guide v1.0*
diff --git a/app/(tabs)/CLAUDE.md b/app/(tabs)/CLAUDE.md
index bd4937a..a16f225 100644
--- a/app/(tabs)/CLAUDE.md
+++ b/app/(tabs)/CLAUDE.md
@@ -12,21 +12,4 @@
 | #5054 | " | ✅ | Re-added Host import to home screen | ~184 |
 | #5043 | 8:22 AM | ✅ | Removed closing Host tag from profile screen | ~210 |
 | #5042 | " | ✅ | Removed opening Host tag from profile screen | ~164 |
-| #5041 | " | ✅ | Removed closing Host tag from browse screen | ~187 |
-| #5040 | " | ✅ | Removed opening Host tag from browse screen | ~159 |
-| #5039 | 8:21 AM | ✅ | Removed closing Host tag from activity screen | ~193 |
-| #5038 | " | ✅ | Removed opening Host tag from activity screen | ~154 |
-| #5037 | " | ✅ | Removed closing Host tag from workouts screen | ~195 |
-| #5036 | " | ✅ | Removed opening Host tag from workouts screen | ~164 |
-| #5035 | " | ✅ | Removed closing Host tag from home screen JSX | ~197 |
-| #5034 | " | ✅ | Removed Host wrapper from home screen JSX | ~139 |
-| #5031 | 8:19 AM | ✅ | Removed Host import from profile screen | ~184 |
-| #5030 | " | ✅ | Removed Host import from browse screen | ~190 |
-| #5029 | 8:18 AM | ✅ | Removed Host import from activity screen | ~183 |
-| #5028 | " | ✅ | Removed Host import from workouts screen | ~189 |
-| #5027 | " | ✅ | Removed Host import from home screen index.tsx | ~180 |
-| #5024 | " | 🔵 | Activity screen properly wraps content with Host component | ~237 |
-| #5023 | " | 🔵 | Profile screen properly wraps content with Host component | ~246 |
-| #5022 | 8:14 AM | 🔵 | Browse screen properly wraps content with Host component | ~217 |
-| #5021 | " | 🔵 | Workouts screen properly wraps content with Host component | ~228 |
 </claude-mem-context>
\ No newline at end of file
diff --git a/app/CLAUDE.md b/app/CLAUDE.md
index 537f2ea..45c9cc0 100644
--- a/app/CLAUDE.md
+++ b/app/CLAUDE.md
@@ -10,17 +10,35 @@
 | #5001 | 9:35 AM | 🔵 | Host Wrapper Located at Root Layout Level | ~153 |
 | #4964 | 9:23 AM | 🔴 | Added Host Wrapper to Root Layout | ~228 |
 | #4963 | 9:22 AM | ✅ | Root layout wraps Stack in View with pure black background | ~279 |
-| #4910 | 8:16 AM | 🟣 | Added Workout Detail and Complete Screen Routes | ~348 |
 
 ### Feb 20, 2026
 
 | ID | Time | T | Title | Read |
 |----|------|---|-------|------|
-| #5224 | 1:24 PM | ✅ | Stage v1.1 files prepared for git commit - SwiftUI Button refactoring complete | ~434 |
+| #5391 | 10:20 PM | 🟣 | RevenueCat subscription system fully integrated and tested | ~656 |
+| #5384 | 9:28 PM | 🟣 | Implemented RevenueCat subscription system | ~190 |
+| #5360 | 7:49 PM | 🟣 | Restore Button Style Added to Paywall | ~143 |
+| #5359 | " | 🟣 | RevenueCat Purchase Flow Integrated in Paywall | ~273 |
+| #5358 | " | 🟣 | usePurchases Hook Imported in Onboarding | ~134 |
+| #5357 | " | 🟣 | RevenueCat Initialization Triggered After Store Hydration | ~176 |
+| #5356 | 7:48 PM | 🟣 | RevenueCat Initialization Added to Root Layout | ~157 |
+| #5313 | 2:58 PM | 🔵 | Onboarding flow architecture examined | ~482 |
+| #5279 | 2:43 PM | 🔵 | Reviewed onboarding.tsx structure for notification permission integration | ~289 |
+| #5268 | 2:27 PM | ✅ | Onboarding Feature Text Simplified | ~151 |
+| #5230 | 1:25 PM | 🟣 | Implemented category and collection detail screens with Inter font loading | ~481 |
+| #5228 | " | 🔄 | Removed v1 features and old scaffolding from TabataFit codebase | ~591 |
+| #5227 | 1:24 PM | ✅ | Category and Collection screens staged for git commit | ~345 |
+| #5224 | " | ✅ | Stage v1.1 files prepared for git commit - SwiftUI Button refactoring complete | ~434 |
 | #5206 | 1:03 PM | ⚖️ | SwiftUI component usage mandated for TabataFit app | ~349 |
 | #5115 | 8:57 AM | 🔵 | Root Layout Stack Configuration with Screen Animations | ~256 |
 | #5061 | 8:47 AM | 🔵 | Expo Router Tab Navigation Structure Found | ~196 |
 | #5053 | 8:23 AM | ✅ | Completed removal of all Host wrappers from application | ~255 |
 | #5052 | " | ✅ | Removed Host wrapper from root layout entirely | ~224 |
 | #5019 | 8:13 AM | 🔵 | Root layout properly wraps Stack with Host component | ~198 |
+
+### Feb 21, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5551 | 12:02 AM | 🔄 | Converted onboarding and player screens to theme system | ~261 |
 </claude-mem-context>
\ No newline at end of file
diff --git a/app/collection/CLAUDE.md b/app/collection/CLAUDE.md
new file mode 100644
index 0000000..ac12a75
--- /dev/null
+++ b/app/collection/CLAUDE.md
@@ -0,0 +1,12 @@
+<claude-mem-context>
+# Recent Activity
+
+<!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5541 | 11:52 PM | 🔄 | Converted 4 detail screens to use theme system | ~264 |
+| #5230 | 1:25 PM | 🟣 | Implemented category and collection detail screens with Inter font loading | ~481 |
+</claude-mem-context>
\ No newline at end of file
diff --git a/app/player/CLAUDE.md b/app/player/CLAUDE.md
index ded1bfc..b002d39 100644
--- a/app/player/CLAUDE.md
+++ b/app/player/CLAUDE.md
@@ -9,4 +9,10 @@
 |----|------|---|-------|------|
 | #5000 | 9:35 AM | 🔵 | Reviewed Player Screen Implementation | ~522 |
 | #4912 | 8:16 AM | 🔵 | Found doneButton component in player screen | ~104 |
+
+### Feb 21, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5551 | 12:02 AM | 🔄 | Converted onboarding and player screens to theme system | ~261 |
 </claude-mem-context>
\ No newline at end of file
diff --git a/app/workout/category/CLAUDE.md b/app/workout/category/CLAUDE.md
new file mode 100644
index 0000000..e749bd8
--- /dev/null
+++ b/app/workout/category/CLAUDE.md
@@ -0,0 +1,13 @@
+<claude-mem-context>
+# Recent Activity
+
+<!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5541 | 11:52 PM | 🔄 | Converted 4 detail screens to use theme system | ~264 |
+| #5291 | 2:56 PM | 🔵 | Category detail screen implementation examined | ~305 |
+| #5230 | 1:25 PM | 🟣 | Implemented category and collection detail screens with Inter font loading | ~481 |
+</claude-mem-context>
\ No newline at end of file
diff --git a/src/shared/components/CLAUDE.md b/src/shared/components/CLAUDE.md
index 1003e4f..763411a 100644
--- a/src/shared/components/CLAUDE.md
+++ b/src/shared/components/CLAUDE.md
@@ -8,4 +8,12 @@
 | ID | Time | T | Title | Read |
 |----|------|---|-------|------|
 | #4889 | 4:46 PM | 🟣 | Created GlassCard component with iOS 18.4 inspired glassmorphism | ~174 |
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5300 | 2:56 PM | 🔵 | GlassCard component architecture examined | ~317 |
+| #5248 | 1:29 PM | 🔵 | StyledText component provides unified text styling | ~126 |
+| #5228 | 1:25 PM | 🔄 | Removed v1 features and old scaffolding from TabataFit codebase | ~591 |
 </claude-mem-context>
\ No newline at end of file
diff --git a/src/shared/constants/CLAUDE.md b/src/shared/constants/CLAUDE.md
index 430e808..f5ce674 100644
--- a/src/shared/constants/CLAUDE.md
+++ b/src/shared/constants/CLAUDE.md
@@ -12,8 +12,13 @@
 | #4829 | " | 🔵 | Existing Animation Constants Reviewed | ~331 |
 | #4828 | " | 🔵 | Color System Constants Review for BDSD Planning | ~412 |
 | #4827 | " | 🔵 | Spacing Constants Implementation Review | ~254 |
-| #4826 | " | 🔵 | Shadow System Constants Reviewed | ~296 |
 | #4825 | " | 🔵 | Typography Constants Implementation Verification | ~264 |
 | #4779 | 1:21 PM | 🔵 | Typography System Constants Analysis | ~354 |
 | #4778 | 1:20 PM | 🔵 | Design System Color Constants Analysis | ~392 |
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5242 | 1:29 PM | 🔵 | Design system constants barrel export reviewed | ~370 |
 </claude-mem-context>
\ No newline at end of file
diff --git a/src/shared/data/CLAUDE.md b/src/shared/data/CLAUDE.md
new file mode 100644
index 0000000..5ef07fa
--- /dev/null
+++ b/src/shared/data/CLAUDE.md
@@ -0,0 +1,14 @@
+<claude-mem-context>
+# Recent Activity
+
+<!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5319 | 2:59 PM | 🔵 | Workout data structure details examined | ~355 |
+| #5315 | " | 🔵 | Data layer architecture examined | ~366 |
+| #5314 | " | 🔵 | Workout data structure examined | ~321 |
+| #5298 | 2:56 PM | 🔵 | Achievement system data structure examined | ~333 |
+</claude-mem-context>
\ No newline at end of file
diff --git a/src/shared/hooks/CLAUDE.md b/src/shared/hooks/CLAUDE.md
new file mode 100644
index 0000000..30e8c0b
--- /dev/null
+++ b/src/shared/hooks/CLAUDE.md
@@ -0,0 +1,16 @@
+<claude-mem-context>
+# Recent Activity
+
+<!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5391 | 10:20 PM | 🟣 | RevenueCat subscription system fully integrated and tested | ~656 |
+| #5384 | 9:28 PM | 🟣 | Implemented RevenueCat subscription system | ~190 |
+| #5375 | 8:38 PM | 🟣 | RevenueCat Entitlement Check Fixed with Proper API Usage | ~261 |
+| #5355 | 7:48 PM | 🟣 | usePurchases Hook Exported from Shared Hooks | ~121 |
+| #5354 | 7:47 PM | 🟣 | RevenueCat Hook for Subscription Management | ~281 |
+| #5317 | 2:59 PM | 🔵 | Notification hook implementation examined | ~362 |
+</claude-mem-context>
\ No newline at end of file
diff --git a/src/shared/stores/CLAUDE.md b/src/shared/stores/CLAUDE.md
index 525750a..adfdcb1 100644
--- a/src/shared/stores/CLAUDE.md
+++ b/src/shared/stores/CLAUDE.md
@@ -3,11 +3,5 @@
 
 <!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
 
-### Feb 20, 2026
-
-| ID | Time | T | Title | Read |
-|----|------|---|-------|------|
-| #5177 | 11:54 AM | ✅ | Exported getWeeklyActivity from stores index | ~158 |
-| #5171 | 11:53 AM | 🔄 | Refactored activityStore to remove computed helpers from state | ~256 |
-| #5170 | " | 🔵 | Activity store implementation with persistence | ~220 |
+*No recent activity*
 </claude-mem-context>
\ No newline at end of file
diff --git a/src/shared/types/CLAUDE.md b/src/shared/types/CLAUDE.md
new file mode 100644
index 0000000..2b0f698
--- /dev/null
+++ b/src/shared/types/CLAUDE.md
@@ -0,0 +1,12 @@
+<claude-mem-context>
+# Recent Activity
+
+<!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5391 | 10:20 PM | 🟣 | RevenueCat subscription system fully integrated and tested | ~656 |
+| #5384 | 9:28 PM | 🟣 | Implemented RevenueCat subscription system | ~190 |
+</claude-mem-context>
\ No newline at end of file
diff --git a/src/shared/utils/CLAUDE.md b/src/shared/utils/CLAUDE.md
new file mode 100644
index 0000000..447f0c3
--- /dev/null
+++ b/src/shared/utils/CLAUDE.md
@@ -0,0 +1,12 @@
+<claude-mem-context>
+# Recent Activity
+
+<!-- This section is auto-generated by claude-mem. Edit content outside the tags. -->
+
+### Feb 20, 2026
+
+| ID | Time | T | Title | Read |
+|----|------|---|-------|------|
+| #5228 | 1:25 PM | 🔄 | Removed v1 features and old scaffolding from TabataFit codebase | ~591 |
+| #5224 | 1:24 PM | ✅ | Stage v1.1 files prepared for git commit - SwiftUI Button refactoring complete | ~434 |
+</claude-mem-context>
\ No newline at end of file