fix(app): cadrage revelation — resize canvas + maxZoom 15

- ResizeObserver sur le conteneur : MapLibre ne detecte pas seul les
  changements de taille (panneau resultat, rotation ecran)
- map.resize() avant fitBounds : le panneau resultat remplace la photo,
  le canvas etait obsolete et le cadrage fausse (marqueur reel coupe)
- maxZoom 12 -> 15 : pour un guess proche, les deux marqueurs restent
  distinguables (juger visuellement la qualite du guess)

.gitignore

@@ -0,0 +1,2 @@
+# Paquet YunoHost (dépôt séparé : ORGANISATION-KA-INTERNATIONALE/jwe_ynh)
+jwe_ynh/

app/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "jwe",
-  "version": "2.0.0",
+  "version": "2.0.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "jwe",
-      "version": "2.0.0",
+      "version": "2.0.2",
       "dependencies": {
         "mapillary-js": "^4.1.2",
         "maplibre-gl": "^5.1.0",

app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jwe",
-  "version": "2.0.0",
+  "version": "2.0.2",
   "private": true,
   "type": "module",
   "scripts": {

app/src/lib/components/GameMap.svelte

@@ -50,6 +50,7 @@
 	let guessMarker: Marker | null = null;
 	let realMarker: Marker | null = null;
 	let explorerMarkers: Marker[] = [];
+	let observateurTaille: ResizeObserver | null = null;
 
 	const SRC_LIGNE = 'jwe-ligne';
 	const SRC_PAIRES = 'jwe-paires';
@@ -143,7 +144,12 @@
 				[Math.min(guess.lon, real.lon), Math.min(guess.lat, real.lat)],
 				[Math.max(guess.lon, real.lon), Math.max(guess.lat, real.lat)]
 			);
-			map.fitBounds(bounds, { padding: 80, duration: reducedMotion ? 0 : 900, maxZoom: 12 });
+			// Le panneau résultat vient de remplacer la photo : synchroniser la
+			// taille du canvas AVANT de calculer le cadrage, sinon il est faussé.
+			// maxZoom 15 (et non 12) : pour un guess proche du lieu, les deux
+			// marqueurs doivent rester distinguables (juger « à quel point on est bon »).
+			map.resize();
+			map.fitBounds(bounds, { padding: 90, duration: reducedMotion ? 0 : 900, maxZoom: 15 });
 		} else {
 			map.easeTo({ center: [real.lon, real.lat], zoom: 11, duration: reducedMotion ? 0 : 900 });
 		}
@@ -316,9 +322,15 @@
 				syncExplorerMarkers();
 				if (real) dessinerRevelation();
 			});
+			// MapLibre ne détecte pas seul les changements de taille du conteneur
+			// (panneau résultat qui remplace la photo, rotation d'écran…).
+			observateurTaille = new ResizeObserver(() => map?.resize());
+			observateurTaille.observe(conteneur);
 		})();
 		return () => {
 			detruit = true;
+			observateurTaille?.disconnect();
+			observateurTaille = null;
 			map?.remove();
 			map = null;
 		};
@@ -326,7 +338,13 @@
 
 	let ancienReal: Coordonnees | null = null;
 	$effect(() => {
-		if (!map || !map.loaded()) return;
+		// Lecture inconditionnelle de `real` : au montage la carte n'existe pas
+		// encore, et un retour anticipé avant toute lecture réactive ferait que
+		// Svelte n'enregistre aucune dépendance — l'effet ne serait jamais relancé.
+		// (isStyleLoaded et non loaded : loaded() reste faux pendant le chargement
+		// des tuiles, ce qui ferait rater le dessin juste après un zoom/pan.)
+		void real;
+		if (!map || !map.isStyleLoaded()) return;
 		if (real && !ancienReal) dessinerRevelation();
 		if (!real && ancienReal) nettoyerRevelation();
 		ancienReal = real;