Écran de progression (#/progression) : courbe du taux d'erreur, parties, exercices

La ligne de progression de l'accueil y mène. Les taux viennent des
analyses rangées ; les parties non analysées le sont en arrière-plan.
« Créer des exercices » ouvre le prompt du gabarit exercices, avec les
thèmes des erreurs comptés sur les faits du moteur.

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

web/app.css

@@ -1829,10 +1829,31 @@ html.bare .topbar {
   line-height: 20px;
 }
 
-.home-progress:empty {
+/* La ligne de progression : un lien vers #/progression (1h), haut de
+ * 44 px pour le doigt, en caption. */
+.home-progress {
+  display: flex;
+  gap: var(--space-1);
+  align-items: center;
+  min-height: 44px;
+  text-decoration: none;
+}
+
+.home-progress[hidden] {
   display: none;
 }
 
+.home-progress-text {
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+
+.home-progress .icon {
+  flex: none;
+  width: 16px;
+  height: 16px;
+}
+
 .home-footer {
   display: flex;
   gap: 10px;
@@ -3434,6 +3455,108 @@ html.landscape .summary-panel > .summary-end {
 .curve-band { fill: transparent; cursor: pointer; }
 .curve-band.selected { fill: var(--accent); fill-opacity: 0.08; }
 
+/* La progression (#/progression, 1h) : la phrase du maître, la courbe du
+ * taux d'erreur (le dernier point en verdict-good), puis les parties. La
+ * page reprend l'en-tête et les cartes de l'analyse. */
+.progression-summary {
+  margin: 0 0 var(--space-4);
+  font-size: 17px;
+  line-height: 24px;
+}
+
+.progression-summary:empty {
+  display: none;
+}
+
+.progression-curve {
+  display: block;
+  width: 100%;
+  height: 168px;
+  font-family: var(--font-sans);
+}
+
+.progression-dot { fill: var(--text); }
+.progression-dot.last { fill: var(--verdict-good); }
+.progression-value { fill: var(--muted); font-size: 12px; }
+.progression-value.last { fill: var(--verdict-good); font-weight: 700; }
+
+.progression .link-button {
+  display: inline-flex;
+  align-items: center;
+}
+
+.progression-actions {
+  display: flex;
+  justify-content: flex-end;
+  margin: 0 0 var(--space-4);
+}
+
+.progression-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-2);
+  margin: var(--space-2) 0 0;
+  padding: 0;
+  list-style: none;
+}
+
+.progression-item {
+  display: flex;
+  gap: var(--space-2);
+  align-items: center;
+  padding: var(--space-2) var(--space-3);
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-md);
+}
+
+/* Toute la ligne ouvre le bilan de la partie. */
+.progression-game {
+  display: flex;
+  flex: 1;
+  gap: var(--space-3);
+  align-items: center;
+  min-width: 0;
+  min-height: 44px;
+  color: inherit;
+  text-decoration: none;
+}
+
+.progression-text {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.progression-text .muted {
+  font-size: 15px;
+  line-height: 20px;
+}
+
+.progression-rate {
+  display: flex;
+  flex: none;
+  flex-direction: column;
+  align-items: flex-end;
+  text-align: right;
+}
+
+.progression-rate strong {
+  font-size: 22px;
+  line-height: 26px;
+  font-variant-numeric: tabular-nums;
+}
+
+.progression-rate.pending {
+  font-size: 13px;
+  color: var(--muted);
+}
+
+.progression-analysis {
+  flex: none;
+}
+
 /* Le visualiseur : « ‹ Coup 7 sur 24 · 6-1 › », le plateau d'avant le
  * coup, la phrase du maître, votre coup contre celui du maître. */
 .viewer-nav {