Aperçu de la boîte de collision dans l'éditeur + blocage physique au jeu

Deux retours utilisateur sur la boîte de collision (ajoutée précédemment) :

- Visible et réglable directement dans l'éditeur de scène : pour l'objet
  sélectionné, un contour pointillé (rectangle/cercle) se superpose sur
  le canevas — glisser son corps ajuste le décalage, glisser sa poignée
  (coin bas-droit) ajuste la taille, les deux se répercutent dans le
  panneau "🧱 Collision" et inversement (édition des champs -> aperçu à
  jour). static/js/scenes/scene-editor.js::onCollisionBoxMouseDown/
  onCollisionBoxResizeMouseDown, mirror des poignées de position/taille
  déjà existantes pour l'objet lui-même.

- Bloque désormais RÉELLEMENT le déplacement au clavier : avant chaque
  pas, personnage-controller.js teste si la position candidate
  chevaucherait la boîte de collision d'un autre objet solide (jamais un
  "fond", jamais un objet à collision désactivée) et annule ce pas — par
  AXE séparément, pour permettre de glisser le long d'un mur en
  diagonale plutôt qu'un blocage total au moindre contact. Réutilise
  forgeShapesOverlap (conditions.js, factorisé depuis elementsOverlap
  pour ne jamais dupliquer la règle "qu'est-ce qui se touche").

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

static/js/play/conditions.js

@@ -117,7 +117,8 @@ function forgeCollisionRectFromBox(box, collision) {
   const offsetY = (collision && collision.offset_y) || 0;
   const left = box.left + (box.width - width) / 2 + offsetX;
   const top = box.top + (box.height - height) / 2 + offsetY;
-  return { left, top, right: left + width, bottom: top + height, width, height };
+  const shape = (collision && collision.shape) || 'rectangle';
+  return { left, top, right: left + width, bottom: top + height, width, height, shape };
 }
 
 function forgeRectanglesOverlap(a, b) {
@@ -135,6 +136,17 @@ function forgeCirclesOverlap(a, b) {
   return Math.sqrt(dx * dx + dy * dy) < (ar + br);
 }
 
+// Choisit rectangle-rectangle ou cercle-cercle selon la forme des DEUX
+// boîtes (voir forgeCollisionRectFromBox, qui pose `shape` dessus) —
+// réutilisée aussi bien par elementsOverlap() ci-dessous (condition de
+// flow) que par forgeWouldCollide() (personnage-controller.js, blocage
+// physique du déplacement au clavier) : UNE seule règle de "qu'est-ce qui
+// se touche", jamais deux implémentations qui pourraient diverger.
+function forgeShapesOverlap(a, b) {
+  if (a.shape === 'cercle' && b.shape === 'cercle') return forgeCirclesOverlap(a, b);
+  return forgeRectanglesOverlap(a, b);
+}
+
 // Phase 5 — condition de collision : chevauchement des BOÎTES DE
 // COLLISION (voir forgeCollisionRectFromBox ci-dessus) de deux éléments,
 // positionnées sur leur rectangle RÉEL à l'écran (getBoundingClientRect —
@@ -159,10 +171,7 @@ function elementsOverlap(elementIdA, elementIdB) {
   }
   const rectA = forgeCollisionRectFromBox(a.getBoundingClientRect(), objA && objA.collision);
   const rectB = forgeCollisionRectFromBox(b.getBoundingClientRect(), objB && objB.collision);
-  const shapeA = (objA && objA.collision && objA.collision.shape) || 'rectangle';
-  const shapeB = (objB && objB.collision && objB.collision.shape) || 'rectangle';
-  if (shapeA === 'cercle' && shapeB === 'cercle') return forgeCirclesOverlap(rectA, rectB);
-  return forgeRectanglesOverlap(rectA, rectB);
+  return forgeShapesOverlap(rectA, rectB);
 }
 
 function evaluateConditionClause(clause) {
@@ -207,6 +216,6 @@ function evaluateConditionNode(node) {
 if (typeof module !== 'undefined' && module.exports) {
   module.exports = {
     readFieldValue, compareValues, readVariableValue, resolveVariablePath, evaluateConditionClause, evaluateConditionNode,
-    forgeCollisionRectFromBox, forgeRectanglesOverlap, forgeCirclesOverlap,
+    forgeCollisionRectFromBox, forgeRectanglesOverlap, forgeCirclesOverlap, forgeShapesOverlap,
   };
 }