From 415aab9e85e4073cc733f749b2f9c0bd4fa10a49 Mon Sep 17 00:00:00 2001
From: laurentbarontini <l.barontini@open-squared.ch>
Date: Sat, 2 May 2026 20:59:07 +0200
Subject: [PATCH] Cards correction

---
 backend/app/program_content.py                    |  2 +-
 .../svg/01_lecture_ecriture_nombres_entiers.svg   | 15 +++++++++------
 frontend/src/styles.css                           | 10 +++++-----
 3 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/backend/app/program_content.py b/backend/app/program_content.py
index 43cd7eb..ee2301c 100644
--- a/backend/app/program_content.py
+++ b/backend/app/program_content.py
@@ -25,7 +25,7 @@ def default_content_root() -> Path:
 
 
 CONTENT_ROOT = Path(os.getenv("PROGRAM_CONTENT_ROOT", default_content_root())).resolve()
-LESSON_BACKGROUND = "#f5f7fb"
+LESSON_BACKGROUND = "#f8fafc"
 
 GRADE_ALIASES = {
     "CM1": "cm1",
diff --git a/backend/contenus_pedagogiques/cycle_3/mathematiques/cm1/01_nombres_calcul_resolution/01A_nombres_entiers/svg/01_lecture_ecriture_nombres_entiers.svg b/backend/contenus_pedagogiques/cycle_3/mathematiques/cm1/01_nombres_calcul_resolution/01A_nombres_entiers/svg/01_lecture_ecriture_nombres_entiers.svg
index 971dfc6..3b332b5 100644
--- a/backend/contenus_pedagogiques/cycle_3/mathematiques/cm1/01_nombres_calcul_resolution/01A_nombres_entiers/svg/01_lecture_ecriture_nombres_entiers.svg
+++ b/backend/contenus_pedagogiques/cycle_3/mathematiques/cm1/01_nombres_calcul_resolution/01A_nombres_entiers/svg/01_lecture_ecriture_nombres_entiers.svg
@@ -62,24 +62,27 @@
   <g transform="translate(110 535)">
     <rect x="0" y="0" width="410" height="220" rx="24" class="panel"/>
     <text x="34" y="52" class="h2blue">Exemple 1</text>
-    <rect x="55" y="88" width="300" height="90" rx="18" fill="#f7fbf9" stroke="#edf3f0"/>
+    <rect x="50" y="82" width="310" height="112" rx="18" fill="#f7fbf9" stroke="#edf3f0"/>
     <text x="92" y="124" class="body">7 425</text>
-    <text x="92" y="156" class="small">sept-mille-quatre-cent-vingt-cinq</text>
+    <text x="92" y="156" class="small">sept-mille-quatre-cent</text>
+    <text x="92" y="180" class="small">vingt-cinq</text>
   </g>
 
   <g transform="translate(595 535)">
     <rect x="0" y="0" width="410" height="220" rx="24" class="panel"/>
     <text x="34" y="52" class="h2blue">Exemple 2</text>
-    <rect x="55" y="88" width="300" height="90" rx="18" fill="#f7fbf9" stroke="#edf3f0"/>
+    <rect x="50" y="82" width="310" height="112" rx="18" fill="#f7fbf9" stroke="#edf3f0"/>
     <text x="92" y="124" class="body">38 090</text>
-    <text x="92" y="156" class="small">trente-huit-mille-quatre-vingt-dix</text>
+    <text x="92" y="156" class="small">trente-huit-mille</text>
+    <text x="92" y="180" class="small">quatre-vingt-dix</text>
   </g>
 
   <g transform="translate(1080 535)">
     <rect x="0" y="0" width="410" height="220" rx="24" class="panel"/>
     <text x="34" y="52" class="h2blue">Exemple 3</text>
-    <rect x="55" y="88" width="300" height="90" rx="18" fill="#f7fbf9" stroke="#edf3f0"/>
+    <rect x="50" y="82" width="310" height="112" rx="18" fill="#f7fbf9" stroke="#edf3f0"/>
     <text x="92" y="124" class="body">506 012</text>
-    <text x="92" y="156" class="small">cinq-cent-six-mille-douze</text>
+    <text x="92" y="156" class="small">cinq-cent-six-mille</text>
+    <text x="92" y="180" class="small">douze</text>
   </g>
 </svg>
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 2fad567..72b777f 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -1,7 +1,7 @@
 :root {
   font-family: Inter, system-ui, sans-serif;
   color: #14213d;
-  background: #f5f7fb;
+  background: #f8fafc;
 }
 
 * { box-sizing: border-box; }
@@ -386,7 +386,7 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
   height: 144px;
   border-radius: 0;
   overflow: hidden;
-  background: #f5f7fb;
+  background: #f8fafc;
   box-shadow: none;
 }
 .avatar.speaking { animation: pulse 0.7s infinite alternate; }
@@ -423,7 +423,7 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
 
 .student-screen {
   height: 100vh;
-  background: #f5f7fb;
+  background: #f8fafc;
 }
 .student-home {
   width: min(1040px, 100%);
@@ -580,7 +580,7 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
   flex-direction: column;
   gap: 0.4rem;
   padding: 0;
-  background: #f5f7fb;
+  background: #f8fafc;
   color: #14213d;
   border: none;
 }
@@ -591,7 +591,7 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
   object-fit: contain;
   border: 0;
   border-radius: 30px;
-  background: #f5f7fb;
+  background: #f8fafc;
 }
 .lesson-bubble {
   min-height: 68px;