Le mini-jeu remplit toute la hauteur/largeur du document, pas juste une carte centrée

Retour utilisateur du 23/09/2026 : une carte à largeur confortable
(même centrée) ne suffisait pas, "le mini jeu dois prendre toute la
hauteur et la largeur du document". Retire le max-width des cartes
internes (.docQuizCard/.docQuizResultCard/.docAssocCard/
.docMemoryCardWrap) — leur fond/bordure couvre désormais toute la
page (width:100% + align-items:stretch côté joueur pour la hauteur) —
et centre leur CONTENU à l'intérieur via display:flex +
justify-content:center sur la carte elle-même, plutôt que de le
laisser collé en haut d'une grande surface vide. Vérifié par
getComputedStyle (max-width devient bien "none", pointer-events et
plein-cadre de la page toujours corrects dans les deux modes).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

static/document/document-editor.css

@@ -539,13 +539,16 @@ img.docImage {
    sinon rien ne serait visible en édition). ---- */
 
 /* Le joueur remplit TOUTE la hauteur/largeur disponible (voir
-   [class$="Player"] plus haut, flex:1 dans .docMinigame:only-child)
+   [class$="Player"] plus haut, flex:1 dans .docMinigame:only-child) ET
-   mais sa CARTE interne (.docQuizCard, .docAssocCard,
+   sa CARTE interne (.docQuizCard, .docAssocCard, .docMemoryCardWrap...)
-   .docMemoryCardWrap...) garde sa taille naturelle — sans ce
+   doit elle aussi occuper toute cette place, pas juste une carte
-   display:flex + centrage, elle restait tassée en haut-gauche de cette
+   centrée avec une largeur confortable (retour utilisateur du
-   grande boîte au lieu d'occuper visuellement l'espace (retour
+   23/09/2026 : "le mini jeu dois prendre toute la hauteur et la
-   utilisateur du 23/09/2026 : "un mini jeu prend toute la place et est
+   largeur du document" — une carte à largeur limitée, même centrée,
-   centrer pas aligner en haut"). */
+   ne suffisait pas). align-items:stretch (valeur par défaut, posée
+   explicitement pour être claire) étire la carte sur tout l'axe
+   croisé ; sa largeur 100% (voir chaque carte plus bas, sans
+   max-width) fait le reste. */
 .docQuizPlayer,
 .docAssocPlayer,
 .docMemoryPlayer,
@@ -553,9 +556,8 @@ img.docImage {
 .docScenarioPlayer {
   pointer-events: none;
   display: flex;
-  align-items: center;
+  align-items: stretch;
-  justify-content: center;
+  padding: 24px;
-  padding: 40px;
 }
 
 .docEditor3.docEditor3--preview [data-kind="quiz"],
@@ -590,8 +592,16 @@ img.docImage {
 
 .docQuizCard,
 .docQuizResultCard {
+  /* Toute la hauteur/largeur du DOCUMENT (retour utilisateur du
+     23/09/2026), pas juste une carte confortable centrée : la carte
+     elle-même (fond/bordure) couvre désormais toute la page ;
+     display:flex + justify-content:center centre son CONTENU à
+     l'intérieur de cette grande surface, plutôt que de le laisser
+     collé en haut ou étiré verticalement de façon disgracieuse. */
   width: 100%;
-  max-width: 640px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
   background: linear-gradient(180deg, var(--doc-card), var(--doc-bg-2));
   border: 1px solid var(--doc-border);
   border-radius: 16px;
@@ -797,7 +807,9 @@ img.docImage {
    dupliquer ces règles. ---- */
 .docAssocCard {
   width: 100%;
-  max-width: 760px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
   background: linear-gradient(180deg, var(--doc-card), var(--doc-bg-2));
   border: 1px solid var(--doc-border);
   border-radius: 16px;
@@ -951,7 +963,9 @@ img.docImage {
    visuels, voir forgeDocRenderMemoryProps ci-dessus). ---- */
 .docMemoryCardWrap {
   width: 100%;
-  max-width: 760px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
   background: linear-gradient(180deg, var(--doc-card), var(--doc-bg-2));
   border: 1px solid var(--doc-border);
   border-radius: 16px;