readme: section JWE v2

docs: audit OKI - conforme, fix anti-spoiler credit photo
app: refonte JWE v2 - SvelteKit 2 + Svelte 5 + MapLibre, 4 modes de jeu, API anti-triche, ecran Cas B 'Pwen blinde', i18n FR/GCF, PWA
2026-07-16 21:05:22 -04:00 · 2026-07-16 21:05:22 -04:00 · 2026-07-16 21:05:22 -04:00 · 2026-07-16 21:05:22 -04:00 · 2026-07-16 21:05:22 -04:00
46 changed files with 10519 additions and 0 deletions
@@ -1,5 +1,15 @@
 # JWE

+> **JWE v2 — refonte GeoGuessr souverain** : jeu de géolocalisation (photo unique → placer la commune sur une carte MapLibre) centré sur la Guadeloupe, la Martinique, la Guyane et La Réunion, avec une phase éducative Wikipedia/Wikidata après chaque manche.
+>
+> - **Application** : [`app/`](app/) — SvelteKit 2 + Svelte 5 + MapLibre GL JS, PWA, bilingue français/créole, licence MIT.
+> - **Documentation** : [`docs/architecture.md`](docs/architecture.md) (décisions), [`docs/deploiement.md`](docs/deploiement.md) (auto-hébergement), [`docs/contribution.md`](docs/contribution.md) (ajouter un lieu).
+> - **Démarrage rapide** : `cd app && npm ci && npm run dev` (Node ≥ 20 ; la version historique PHP ci-dessous reste fonctionnelle telle quelle).
+
+---
+
+## Version historique (PHP)
+
 <p align="center">
 Ce projet cartographique est une application Web simple qui vous permet de tester vos connaissances des communes ou des pays proposés à l'aide de cartes interactives.
 </p>
@@ -0,0 +1,7 @@
+node_modules
+build
+.svelte-kit
+.env
+.env.*
+!.env.example
+.vite
@@ -0,0 +1,28 @@
+MIT License
+
+Copyright (c) 2026 ORGANISATION KA INTERNATIONALE (OKI) & contributeurs JWE
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+---
+
+Note : les photographies affichées par l'application restent la propriété de
+leurs auteurs respectifs et sont distribuées sous leurs licences Wikimedia
+Commons (voir content/credits.md). Les extraits d'articles Wikipédia sont
+sous licence CC BY-SA 4.0 (https://creativecommons.org/licenses/by-sa/4.0/deed.fr).
@@ -0,0 +1,25 @@
+{
+  "name": "jwe",
+  "version": "2.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite dev",
+    "build": "vite build",
+    "preview": "vite preview",
+    "start": "node build",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json"
+  },
+  "devDependencies": {
+    "@sveltejs/adapter-node": "^5.2.0",
+    "@sveltejs/kit": "^2.16.0",
+    "@sveltejs/vite-plugin-svelte": "^5.0.0",
+    "svelte": "^5.0.0",
+    "svelte-check": "^4.1.0",
+    "typescript": "^5.6.0",
+    "vite": "^6.0.0"
+  },
+  "dependencies": {
+    "maplibre-gl": "^5.1.0"
+  }
+}
@@ -0,0 +1,12 @@
+// See https://svelte.dev/docs/kit/types#app.d.ts
+declare global {
+	namespace App {
+		// interface Error {}
+		// interface Locals {}
+		// interface PageData {}
+		// interface PageState {}
+		// interface Platform {}
+	}
+}
+
+export {};
@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="fr">
+	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+		<meta name="theme-color" content="#0b3d2e" />
+		<link rel="icon" href="%sveltekit.assets%/favicon.ico" />
+		<link rel="manifest" href="%sveltekit.assets%/manifest.webmanifest" />
+		%sveltekit.head%
+	</head>
+	<body data-sveltekit-preload-data="hover">
+		<div style="display: contents">%sveltekit.body%</div>
+	</body>
+</html>
@@ -0,0 +1,421 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { env } from '$env/dynamic/public';
+	import { t } from '$lib/i18n/store.svelte';
+	import { MAX_BOUNDS, MIN_ZOOM, REGION_BOUNDS, REGIONS } from '$lib/map/regions';
+	import styleOki from '$lib/map/style-oki.json';
+	import type { Coordonnees, Region } from '$lib/types';
+	import type { Map as MLMap, Marker, StyleSpecification } from 'maplibre-gl';
+
+	interface Paire {
+		from: Coordonnees;
+		to: Coordonnees;
+		label?: string;
+	}
+
+	interface MarqueurInfo {
+		id: string;
+		lat: number;
+		lon: number;
+		label: string;
+	}
+
+	interface Props {
+		guess?: Coordonnees | null;
+		real?: Coordonnees | null;
+		interactive?: boolean;
+		pairs?: Paire[];
+		markers?: MarqueurInfo[];
+		onguess?: (c: Coordonnees) => void;
+		onvalidate?: () => void;
+		onmarkerclick?: (id: string) => void;
+	}
+
+	let {
+		guess = $bindable(null),
+		real = null,
+		interactive = true,
+		pairs = [],
+		markers = [],
+		onguess,
+		onvalidate,
+		onmarkerclick
+	}: Props = $props();
+
+	let conteneur: HTMLDivElement;
+	let map: MLMap | null = null;
+	let ml: typeof import('maplibre-gl') | null = null;
+	let guessMarker: Marker | null = null;
+	let realMarker: Marker | null = null;
+	let explorerMarkers: Marker[] = [];
+	let raf = 0;
+
+	const SRC_LIGNE = 'jwe-ligne';
+	const SRC_PAIRES = 'jwe-paires';
+
+	const reducedMotion =
+		typeof window !== 'undefined' && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+
+	function styleUrl(): string | StyleSpecification {
+		// Bascule vers un tileserver auto-hébergé sans changement de code.
+		if (env.PUBLIC_TILES_URL) return env.PUBLIC_TILES_URL;
+		return styleOki as unknown as StyleSpecification;
+	}
+
+	function ensureSource(id: string): void {
+		if (map && !map.getSource(id)) {
+			map.addSource(id, {
+				type: 'geojson',
+				data: { type: 'FeatureCollection', features: [] }
+			});
+		}
+	}
+
+	function setGeoJSON(id: string, data: GeoJSON.FeatureCollection): void {
+		const src = map?.getSource(id) as import('maplibre-gl').GeoJSONSource | undefined;
+		src?.setData(data);
+	}
+
+	function ligneFeature(from: Coordonnees, to: Coordonnees, props: GeoJSON.GeoJsonProperties): GeoJSON.Feature {
+		return {
+			type: 'Feature',
+			properties: props,
+			geometry: { type: 'LineString', coordinates: [[from.lon, from.lat], [to.lon, to.lat]] }
+		};
+	}
+
+	function pointFeature(c: Coordonnees, props: GeoJSON.GeoJsonProperties): GeoJSON.Feature {
+		return {
+			type: 'Feature',
+			properties: props,
+			geometry: { type: 'Point', coordinates: [c.lon, c.lat] }
+		};
+	}
+
+	function dessinerRevelation(): void {
+		if (!map || !ml || !real) return;
+		ensureSource(SRC_LIGNE);
+		if (!map.getLayer('jwe-ligne-line')) {
+			map.addLayer({
+				id: 'jwe-ligne-line',
+				type: 'line',
+				source: SRC_LIGNE,
+				paint: { 'line-color': '#e4572e', 'line-width': 3, 'line-dasharray': [2, 1.5] }
+			});
+		}
+		const features: GeoJSON.Feature[] = guess ? [ligneFeature(guess, real, null)] : [];
+		setGeoJSON(SRC_LIGNE, { type: 'FeatureCollection', features });
+
+		// Marqueur vert = position réelle
+		realMarker?.remove();
+		realMarker = new ml.Marker({ color: '#0b3d2e' }).setLngLat([real.lon, real.lat]).addTo(map);
+
+		// Le marqueur du joueur « vole » vers la position réelle (sauf reduced-motion)
+		if (guessMarker && guess) {
+			const from = { ...guess };
+			if (reducedMotion) {
+				guessMarker.setLngLat([real.lon, real.lat]);
+			} else {
+				const debut = performance.now();
+				const duree = 1400;
+				const step = (now: number) => {
+					if (!guessMarker) return;
+					const k = Math.min(1, (now - debut) / duree);
+					const e = 1 - Math.pow(1 - k, 3);
+					guessMarker.setLngLat([
+						from.lon + (real.lon - from.lon) * e,
+						from.lat + (real.lat - from.lat) * e
+					]);
+					if (k < 1) raf = requestAnimationFrame(step);
+				};
+				raf = requestAnimationFrame(step);
+			}
+			const bounds = new ml.LngLatBounds(
+				[Math.min(from.lon, real.lon), Math.min(from.lat, real.lat)],
+				[Math.max(from.lon, real.lon), Math.max(from.lat, real.lat)]
+			);
+			map.fitBounds(bounds, { padding: 80, duration: reducedMotion ? 0 : 900, maxZoom: 12 });
+		} else {
+			map.easeTo({ center: [real.lon, real.lat], zoom: 11, duration: reducedMotion ? 0 : 900 });
+		}
+	}
+
+	function nettoyerRevelation(): void {
+		cancelAnimationFrame(raf);
+		realMarker?.remove();
+		realMarker = null;
+		setGeoJSON(SRC_LIGNE, { type: 'FeatureCollection', features: [] });
+	}
+
+	function syncGuessMarker(): void {
+		if (!map || !ml) return;
+		if (guess) {
+			if (!guessMarker) {
+				guessMarker = new ml.Marker({ color: '#e4572e', draggable: true })
+					.setLngLat([guess.lon, guess.lat])
+					.addTo(map);
+				guessMarker.on('dragend', () => {
+					const ll = guessMarker?.getLngLat();
+					if (ll) {
+						guess = { lat: ll.lat, lon: ll.lng };
+						onguess?.(guess);
+					}
+				});
+			} else {
+				guessMarker.setLngLat([guess.lon, guess.lat]);
+			}
+			guessMarker.setDraggable(interactive && !real);
+		} else {
+			guessMarker?.remove();
+			guessMarker = null;
+		}
+	}
+
+	function syncPaires(): void {
+		if (!map || !ml) return;
+		ensureSource(SRC_PAIRES);
+		if (!map.getLayer('jwe-paires-line')) {
+			map.addLayer({
+				id: 'jwe-paires-line',
+				type: 'line',
+				source: SRC_PAIRES,
+				filter: ['==', ['geometry-type'], 'LineString'],
+				paint: { 'line-color': '#5a6b62', 'line-width': 2, 'line-dasharray': [2, 1.5] }
+			});
+			map.addLayer({
+				id: 'jwe-paires-points',
+				type: 'circle',
+				source: SRC_PAIRES,
+				filter: ['==', ['geometry-type'], 'Point'],
+				paint: {
+					'circle-radius': 7,
+					'circle-color': ['get', 'couleur'],
+					'circle-stroke-color': '#fffdf8',
+					'circle-stroke-width': 2
+				}
+			});
+		}
+		const features: GeoJSON.Feature[] = [];
+		for (const p of pairs) {
+			features.push(ligneFeature(p.from, p.to, null));
+			features.push(pointFeature(p.from, { couleur: '#e4572e' })); // joueur
+			features.push(pointFeature(p.to, { couleur: '#0b3d2e' })); // réel
+		}
+		setGeoJSON(SRC_PAIRES, { type: 'FeatureCollection', features });
+		if (pairs.length > 0) {
+			const b = new ml.LngLatBounds();
+			for (const p of pairs) {
+				b.extend([p.from.lon, p.from.lat]);
+				b.extend([p.to.lon, p.to.lat]);
+			}
+			map.fitBounds(b, { padding: 60, duration: reducedMotion ? 0 : 800 });
+		}
+	}
+
+	function syncExplorerMarkers(): void {
+		if (!map || !ml) return;
+		for (const m of explorerMarkers) m.remove();
+		explorerMarkers = [];
+		for (const info of markers) {
+			const el = document.createElement('button');
+			el.type = 'button';
+			el.className = 'marqueur-explorer';
+			el.setAttribute('aria-label', info.label);
+			const mk = new ml.Marker({ element: el, color: '#175e70' })
+				.setLngLat([info.lon, info.lat])
+				.addTo(map!);
+			el.addEventListener('click', (e) => {
+				e.stopPropagation();
+				onmarkerclick?.(info.id);
+			});
+			explorerMarkers.push(mk);
+		}
+	}
+
+	function sauterVers(region: Region): void {
+		const b = REGION_BOUNDS[region];
+		map?.fitBounds(
+			[
+				[b[0], b[1]],
+				[b[2], b[3]]
+			],
+			{ duration: reducedMotion ? 0 : 800 }
+		);
+	}
+
+	function onKeydown(e: KeyboardEvent): void {
+		if (!map) return;
+		const pas = 140; // pixels de déplacement
+		if (e.key === 'Enter') {
+			e.preventDefault();
+			onvalidate?.();
+			return;
+		}
+		const dirs: Record<string, [number, number]> = {
+			ArrowUp: [0, -pas],
+			ArrowDown: [0, pas],
+			ArrowLeft: [-pas, 0],
+			ArrowRight: [pas, 0]
+		};
+		const d = dirs[e.key];
+		if (!d) return;
+		e.preventDefault();
+		if (guessMarker && interactive && !real) {
+			// Déplacer le marqueur : conversion écran → géo pour garder un pas constant
+			const ll = guessMarker.getLngLat();
+			const pt = map.project([ll.lng, ll.lat]);
+			const nv = map.unproject([pt.x + d[0], pt.y + d[1]]);
+			guess = { lat: nv.lat, lon: nv.lng };
+			onguess?.(guess);
+		} else {
+			map.panBy(d, { duration: 100 });
+		}
+	}
+
+	onMount(() => {
+		let detruit = false;
+		// Lazy load : MapLibre (JS + CSS) n'est chargé que sur les écrans avec carte.
+		void (async () => {
+			const [mod] = await Promise.all([import('maplibre-gl'), import('maplibre-gl/dist/maplibre-gl.css')]);
+			if (detruit) return;
+			ml = mod;
+			map = new mod.Map({
+				container: conteneur,
+				style: styleUrl(),
+				center: [-58, 0],
+				zoom: 3.6,
+				minZoom: MIN_ZOOM,
+				maxBounds: [
+					[MAX_BOUNDS[0], MAX_BOUNDS[1]],
+					[MAX_BOUNDS[2], MAX_BOUNDS[3]]
+				],
+				attributionControl: { compact: true },
+				// Libellés FR/créole des contrôles natifs (sinon « Zoom in/out » en anglais)
+				locale: {
+					'NavigationControl.ZoomIn': t().carte.zoomIn,
+					'NavigationControl.ZoomOut': t().carte.zoomOut
+				}
+			});
+			map.addControl(new mod.NavigationControl({ showCompass: false }), 'top-left');
+			map.on('click', (e) => {
+				if (!interactive || real) return;
+				guess = { lat: e.lngLat.lat, lon: e.lngLat.lng };
+				onguess?.(guess);
+			});
+			map.on('load', () => {
+				syncGuessMarker();
+				syncPaires();
+				syncExplorerMarkers();
+				if (real) dessinerRevelation();
+			});
+		})();
+		return () => {
+			detruit = true;
+			cancelAnimationFrame(raf);
+			map?.remove();
+			map = null;
+		};
+	});
+
+	let ancienReal: Coordonnees | null = null;
+	$effect(() => {
+		if (!map || !map.loaded()) return;
+		if (real && !ancienReal) dessinerRevelation();
+		if (!real && ancienReal) nettoyerRevelation();
+		ancienReal = real;
+	});
+
+	$effect(() => {
+		if (map?.loaded()) syncGuessMarker();
+		void guess;
+		void interactive;
+	});
+
+	$effect(() => {
+		if (map?.loaded()) syncPaires();
+		void pairs;
+	});
+
+	$effect(() => {
+		if (map?.loaded()) syncExplorerMarkers();
+		void markers;
+	});
+</script>
+
+<div class="carte-wrap">
+	<!-- La zone carte est volontairement focusable : flèches = déplacer le marqueur, Entrée = valider -->
+	<!-- svelte-ignore a11y_no_noninteractive_tabindex, a11y_no_noninteractive_element_interactions -->
+	<div
+		class="carte"
+		bind:this={conteneur}
+		role="application"
+		aria-label={t().carte.ariaLabel}
+		tabindex="0"
+		onkeydown={onKeydown}
+	></div>
+	<div class="sauts" role="group" aria-label={t().carte.sautRegion}>
+		{#each REGIONS as region (region)}
+			<button type="button" class="saut" onclick={() => sauterVers(region)}>
+				{t().regions[region]}
+			</button>
+		{/each}
+	</div>
+</div>
+
+<style>
+	.carte-wrap {
+		position: relative;
+		width: 100%;
+		height: 100%;
+	}
+
+	.carte {
+		width: 100%;
+		height: 100%;
+		border-radius: var(--oki-radius);
+		overflow: hidden;
+	}
+
+	.sauts {
+		position: absolute;
+		bottom: 0.75rem;
+		left: 50%;
+		transform: translateX(-50%);
+		display: flex;
+		gap: 0.4rem;
+		flex-wrap: wrap;
+		justify-content: center;
+		padding: 0 0.5rem;
+	}
+
+	.saut {
+		background: rgba(255, 253, 248, 0.94);
+		color: var(--oki-vert);
+		border: 1px solid var(--oki-sable-fonce);
+		border-radius: 999px;
+		padding: 0.35rem 0.8rem;
+		font-size: 0.8rem;
+		font-weight: 650;
+		cursor: pointer;
+		box-shadow: var(--oki-ombre);
+	}
+
+	.saut:hover {
+		background: var(--oki-vert-doux);
+	}
+
+	:global(.marqueur-explorer) {
+		width: 26px;
+		height: 26px;
+		border-radius: 50%;
+		border: 2.5px solid var(--oki-blanc);
+		background: var(--oki-bleu);
+		cursor: pointer;
+		box-shadow: var(--oki-ombre);
+	}
+
+	:global(.marqueur-explorer:hover),
+	:global(.marqueur-explorer:focus-visible) {
+		background: var(--oki-vert-clair);
+	}
+</style>
@@ -0,0 +1,43 @@
+<script lang="ts">
+	import { t } from '$lib/i18n/store.svelte';
+	import { getLang, setLang, type Lang } from '$lib/i18n/store.svelte';
+</script>
+
+<div class="lang-switch" role="group" aria-label="Langue / Lang">
+	{#each ['fr', 'gcf'] as l (l)}
+		<button
+			type="button"
+			class:actif={getLang() === l}
+			aria-pressed={getLang() === l}
+			onclick={() => setLang(l as Lang)}
+		>
+			{t().langue[l as Lang]}
+		</button>
+	{/each}
+</div>
+
+<style>
+	.lang-switch {
+		display: flex;
+		gap: 0.25rem;
+		background: var(--oki-vert-doux);
+		border-radius: 999px;
+		padding: 0.2rem;
+	}
+
+	button {
+		border: none;
+		background: transparent;
+		color: var(--oki-vert);
+		border-radius: 999px;
+		padding: 0.3rem 0.75rem;
+		font-size: 0.85rem;
+		font-weight: 600;
+		cursor: pointer;
+	}
+
+	button.actif {
+		background: var(--oki-vert);
+		color: #fff;
+	}
+</style>
@@ -0,0 +1,47 @@
+<script lang="ts">
+	import type { Photo } from '$lib/types';
+
+	interface Props {
+		photo: Photo;
+		revealed?: boolean;
+	}
+
+	let { photo, revealed = false }: Props = $props();
+</script>
+
+<figure class="photo-panel">
+	<img src={photo.url} alt={photo.alt} loading="lazy" decoding="async" />
+	{#if revealed}
+		<figcaption>{photo.credit}</figcaption>
+	{/if}
+</figure>
+
+<style>
+	.photo-panel {
+		position: relative;
+		margin: 0;
+		width: 100%;
+		height: 100%;
+		overflow: hidden;
+		background: var(--oki-vert);
+		border-radius: var(--oki-radius);
+	}
+
+	img {
+		width: 100%;
+		height: 100%;
+		object-fit: cover;
+		display: block;
+	}
+
+	figcaption {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		padding: 0.4rem 0.8rem;
+		font-size: 0.72rem;
+		color: #fff;
+		background: linear-gradient(transparent, rgba(11, 61, 46, 0.85));
+	}
+</style>
@@ -0,0 +1,114 @@
+<script lang="ts">
+	import WikiFiche from './WikiFiche.svelte';
+	import { t } from '$lib/i18n/store.svelte';
+	import type { GuessResult } from '$lib/types';
+
+	interface Props {
+		result: GuessResult;
+		labelBouton?: string;
+		creditPhoto?: string;
+		onsuivant?: () => void;
+	}
+
+	let { result, labelBouton, creditPhoto, onsuivant }: Props = $props();
+</script>
+
+<section class="resultat" aria-live="polite">
+	<header class="score-bloc">
+		<p class="bravo">{result.score > 0 ? t().micro.bravo : t().micro.kiteSaYe}</p>
+		<p class="score">
+			<span class="valeur">{result.score}</span>
+			<span class="unite">{t().resultat.points}</span>
+		</p>
+		{#if result.distanceKm !== null}
+			<p class="distance">{t().resultat.distance} : {result.distanceKm} {t().resultat.km}</p>
+		{/if}
+		<p class="lieu">
+			<strong>{result.nom}</strong>
+			{#if result.nom_creole && result.nom_creole !== result.nom}
+				<span class="creole"> · {result.nom_creole}</span>
+			{/if}
+			<br />
+			{t().resultat.commune} : {result.commune} — {t().regions[result.region]}
+		</p>
+	</header>
+
+	{#key result.nom}
+		<WikiFiche
+			nom={result.nom}
+			wikidataId={result.wikidata_id}
+			tonPositif={result.score > 0 ? t().resultat.trouve : t().resultat.aDecouvrir}
+		/>
+	{/key}
+
+	{#if creditPhoto}
+		<p class="credit-photo">{creditPhoto}</p>
+	{/if}
+
+	{#if onsuivant}
+		<button type="button" class="btn btn-primaire suivant" onclick={onsuivant}>
+			{labelBouton ?? t().resultat.suivant}
+		</button>
+	{/if}
+</section>
+
+<style>
+	.resultat {
+		display: flex;
+		flex-direction: column;
+		gap: 1rem;
+	}
+
+	.score-bloc {
+		text-align: center;
+	}
+
+	.bravo {
+		margin: 0;
+		font-size: 1.3rem;
+		font-weight: 700;
+		color: var(--oki-vert-clair);
+	}
+
+	.score {
+		margin: 0.2rem 0;
+	}
+
+	.score .valeur {
+		font-size: 2.6rem;
+		font-weight: 800;
+		color: var(--oki-vert);
+	}
+
+	.score .unite {
+		font-size: 1rem;
+		color: var(--oki-encre-doux);
+		margin-left: 0.3rem;
+	}
+
+	.distance {
+		margin: 0;
+		color: var(--oki-encre-doux);
+	}
+
+	.credit-photo {
+		margin: 0;
+		font-size: 0.72rem;
+		color: var(--oki-encre-doux);
+		text-align: center;
+	}
+
+	.lieu {
+		margin: 0.5rem 0 0;
+	}
+
+	.creole {
+		color: var(--oki-vert-clair);
+		font-style: italic;
+	}
+
+	.suivant {
+		align-self: center;
+		min-width: 220px;
+	}
+</style>
@@ -0,0 +1,87 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+
+	interface Props {
+		dureeMs?: number; // fenêtre du bonus temps (60 s)
+		actif?: boolean;
+	}
+
+	let { dureeMs = 60000, actif = true }: Props = $props();
+
+	let ecoule = $state(0);
+	let intervalle: ReturnType<typeof setInterval> | null = null;
+	const depart = Date.now();
+
+	// Fraction restante, de 1 (plein) à 0 (vide) — informatif, jamais anxiogène.
+	let fraction = $derived(Math.max(0, 1 - ecoule / dureeMs));
+	let termine = $derived(ecoule >= dureeMs);
+
+	const R = 15.5;
+	const C = 2 * Math.PI * R;
+
+	/** Temps écoulé en ms (pour le bonus côté /api/guess). */
+	export function tempsMs(): number {
+		return Date.now() - depart;
+	}
+
+	onMount(() => {
+		if (actif) {
+			intervalle = setInterval(() => {
+				ecoule = Date.now() - depart;
+				if (ecoule >= dureeMs && intervalle) {
+					clearInterval(intervalle);
+					intervalle = null;
+				}
+			}, 250);
+		}
+		return () => {
+			if (intervalle) clearInterval(intervalle);
+		};
+	});
+</script>
+
+<div class="timer" class:termine role="timer" aria-label="Minuteur" title="Minuteur">
+	<svg viewBox="0 0 36 36" aria-hidden="true">
+		<circle class="fond" cx="18" cy="18" r={R} />
+		<circle
+			class="reste"
+			cx="18"
+			cy="18"
+			r={R}
+			stroke-dasharray={C}
+			stroke-dashoffset={C * (1 - fraction)}
+			transform="rotate(-90 18 18)"
+		/>
+	</svg>
+</div>
+
+<style>
+	.timer {
+		width: 40px;
+		height: 40px;
+	}
+
+	svg {
+		width: 100%;
+		height: 100%;
+		display: block;
+	}
+
+	.fond {
+		fill: rgba(255, 253, 248, 0.85);
+		stroke: var(--oki-sable-fonce);
+		stroke-width: 3;
+	}
+
+	.reste {
+		fill: none;
+		stroke: var(--oki-vert-clair); /* couleur douce, calm technology */
+		stroke-width: 3;
+		stroke-linecap: round;
+		transition: stroke-dashoffset 0.25s linear;
+	}
+
+	.termine .reste {
+		stroke: var(--oki-sable-fonce);
+	}
+</style>
@@ -0,0 +1,182 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { t } from '$lib/i18n/store.svelte';
+	import type { WikiSummary } from '$lib/types';
+
+	interface Props {
+		nom: string;
+		wikidataId: string | null;
+		tonPositif?: string;
+		tonNeutre?: string;
+	}
+
+	let { nom, wikidataId, tonPositif, tonNeutre }: Props = $props();
+
+	// undefined = chargement, null = pas de fiche (Cas B), WikiSummary = Cas A
+	let wiki = $state<WikiSummary | null | undefined>(undefined);
+
+	onMount(() => {
+		if (!wikidataId) {
+			wiki = null;
+			return;
+		}
+		let annule = false;
+		void (async () => {
+			try {
+				const res = await fetch(`/api/wiki/${wikidataId}`);
+				if (annule) return;
+				wiki = res.ok ? ((await res.json()) as WikiSummary) : null;
+			} catch {
+				if (!annule) wiki = null;
+			}
+		})();
+		return () => {
+			annule = true;
+		};
+	});
+
+	const lienContribution = $derived(
+		`https://fr.wikipedia.org/w/index.php?search=${encodeURIComponent(nom)}&title=Sp%C3%A9cial:Recherche`
+	);
+</script>
+
+{#if wiki === undefined}
+	<div class="panneau chargement">
+		<p>{t().explorer.chargerFiche}</p>
+	</div>
+{:else if wiki}
+	<!-- Cas A : fiche Wikipédia existante -->
+	<article class="panneau cas-a">
+		<h2>
+			<a href={wiki.url} target="_blank" rel="noopener noreferrer">{wiki.title}</a>
+		</h2>
+		{#if tonPositif || tonNeutre}
+			<p class="ton">{tonPositif ?? tonNeutre}</p>
+		{/if}
+		{#if wiki.thumbnail}
+			<img src={wiki.thumbnail} alt="" loading="lazy" decoding="async" />
+		{/if}
+		<p class="extrait">{wiki.extract}</p>
+		<a class="lien-wiki" href={wiki.url} target="_blank" rel="noopener noreferrer">
+			{t().resultat.lireWiki} ↗
+		</a>
+	</article>
+{:else}
+	<!-- Cas B : lacune documentaire — panneau volontairement distinct (Peak-End) -->
+	<article class="panneau cas-b">
+		<h2><span class="icone" aria-hidden="true">◌</span> {t().lacune.titre}</h2>
+		<p class="texte">{t().lacune.texte}</p>
+		<a class="btn btn-cta" href={lienContribution} target="_blank" rel="noopener noreferrer">
+			{t().lacune.cta} ↗
+		</a>
+		<p class="guide">
+			{t().lacune.guide}
+			<a href="https://fr.wikipedia.org/wiki/Aide:Premiers_pas" target="_blank" rel="noopener noreferrer">
+				{t().lacune.guideLien} ↗
+			</a>
+		</p>
+	</article>
+{/if}
+
+<style>
+	.panneau {
+		border-radius: var(--oki-radius);
+		padding: 1.1rem 1.25rem;
+		box-shadow: var(--oki-ombre);
+	}
+
+	.chargement {
+		background: var(--oki-blanc);
+		color: var(--oki-encre-doux);
+		text-align: center;
+	}
+
+	/* Cas A : vert doux, apaisé */
+	.cas-a {
+		background: var(--oki-vert-doux);
+		border: 1.5px solid var(--oki-vert-clair);
+	}
+
+	.cas-a h2 {
+		margin: 0 0 0.3rem;
+		font-size: 1.2rem;
+	}
+
+	.cas-a h2 a {
+		color: var(--oki-vert);
+	}
+
+	.cas-a .ton {
+		margin: 0 0 0.6rem;
+		font-weight: 600;
+		color: var(--oki-vert-clair);
+	}
+
+	.cas-a img {
+		float: right;
+		width: 96px;
+		height: auto;
+		margin: 0 0 0.5rem 0.8rem;
+		border-radius: var(--oki-radius-petit);
+	}
+
+	.cas-a .extrait {
+		margin: 0 0 0.6rem;
+	}
+
+	.lien-wiki {
+		color: var(--oki-bleu);
+		font-weight: 650;
+	}
+
+	/* Cas B : teinte sable/orangée distincte, icône spécifique */
+	.cas-b {
+		background: var(--oki-lacune-fond);
+		border: 2px solid var(--oki-lacune-bord);
+	}
+
+	.cas-b h2 {
+		margin: 0 0 0.5rem;
+		font-size: 1.25rem;
+		color: #8a5a00;
+		display: flex;
+		align-items: center;
+		gap: 0.5rem;
+	}
+
+	.cas-b .icone {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		width: 1.6rem;
+		height: 1.6rem;
+		border: 2.5px dashed var(--oki-lacune-bord);
+		border-radius: 50%;
+		font-size: 1rem;
+	}
+
+	.cas-b .texte {
+		margin: 0 0 0.9rem;
+		font-size: 1.02rem;
+	}
+
+	.btn-cta {
+		background: var(--oki-lacune-bord);
+		color: #fff;
+	}
+
+	.btn-cta:hover {
+		background: #b98a2f;
+	}
+
+	.guide {
+		margin: 0.8rem 0 0;
+		font-size: 0.88rem;
+		color: var(--oki-encre-doux);
+	}
+
+	.guide a {
+		color: var(--oki-bleu);
+		font-weight: 600;
+	}
+</style>
@@ -0,0 +1,109 @@
+const fr = {
+	app: {
+		titre: 'JWE',
+		sousTitre: 'Jeu de géolocalisation — Guadeloupe, Martinique, Guyane, La Réunion'
+	},
+	regions: {
+		GUADELOUPE: 'Guadeloupe',
+		MARTINIQUE: 'Martinique',
+		GUYANE: 'Guyane',
+		REUNION: 'La Réunion',
+		TOUTES: 'Toutes les régions'
+	},
+	modes: {
+		monument: 'Konnèt moniman',
+		monumentDesc: 'Reconnais le monument photographié et place-le sur la carte.',
+		lieu: 'Kote mwen ye ?',
+		lieuDesc: 'Une rue, un bord de mer, une forêt… devine où tu es.',
+		defi: 'Défi 5 rounds',
+		defiDesc: '5 lieux d’affilée, monuments et lieux mélangés.',
+		explorer: 'Aprann',
+		explorerDesc: 'Explore la carte librement et lis les fiches Wikipédia. Sans score.'
+	},
+	accueil: {
+		choixRegion: 'Choisis ta région',
+		choixMode: 'Choisis ton mode',
+		options: 'Options',
+		timer: 'Minuteur (60 s, bonus de score)',
+		jouer: 'Jouer'
+	},
+	jeu: {
+		charger: 'Chargement du lieu…',
+		erreur: 'Impossible de charger un lieu. Réessaie.',
+		reessayer: 'Réessayer',
+		valider: 'Valider ma position',
+		passer: 'Passer',
+		indice: 'Indice',
+		indicePenalite: '−10 % de score',
+		indiceRestant: 'indice restant',
+		indicesRestants: 'indices restants',
+		plusDIndice: 'Plus d’indice disponible',
+		poserMarqueur: 'Clique sur la carte pour placer ton marqueur',
+		round: 'Manche',
+		sur: 'sur',
+		difficulte: {
+			FACILE: 'Facile',
+			MOYEN: 'Moyen',
+			DIFFICILE: 'Difficile',
+			EXPERT: 'Expert'
+		}
+	},
+	resultat: {
+		bravo: 'Bravo !',
+		score: 'Score',
+		points: 'points',
+		distance: 'Distance',
+		km: 'km',
+		trouve: 'Tu as trouvé ! Apprends-en plus sur ce lieu.',
+		aDecouvrir: 'Le lieu était ici. Apprends-en plus sur lui.',
+		lireWiki: 'Lire la suite sur Wikipédia',
+		commune: 'Commune',
+		region: 'Région',
+		suivant: 'Lieu suivant',
+		voirBilan: 'Voir le bilan',
+		rejouer: 'Rejouer',
+		retourAccueil: 'Retour à l’accueil'
+	},
+	lacune: {
+		titre: 'Pwen blindé — Sa pa dokimanté',
+		texte:
+			'Ce lieu existe, mais il n’a pas de page sur Wikipédia ni de fiche sur Wikidata. Pour nos régions, c’est un enjeu majeur : si nous ne documentons pas nos propres territoires, notre histoire et notre géographie disparaissent des cartes numériques et des bases de données mondiales (qui alimentent même l’intelligence artificielle).',
+		cta: 'Kontribyé sou Wikipédia',
+		guide: 'Besoin d’aide pour démarrer ? Suis le guide OKI « Comment contribuer à Wikipédia ».',
+		guideLien: 'Ouvrir le guide de contribution'
+	},
+	defi: {
+		bilan: 'Bilan du défi',
+		scoreTotal: 'Score total',
+		partager: 'Partager',
+		telecharger: 'Télécharger l’image',
+		taPosition: 'Ta position',
+		positionReelle: 'Position réelle',
+		manche: 'Manche'
+	},
+	explorer: {
+		titre: 'Aprann — Explorer',
+		filtrer: 'Filtrer par région',
+		chargerFiche: 'Chargement de la fiche…',
+		aucuneFiche: 'Sélectionne un marqueur sur la carte.',
+		fermer: 'Fermer le panneau'
+	},
+	carte: {
+		ariaLabel: 'Carte de jeu. Flèches pour déplacer le marqueur, Entrée pour valider.',
+		sautRegion: 'Aller à la région',
+		zoomIn: 'Zoomer',
+		zoomOut: 'Dézoomer'
+	},
+	micro: {
+		bravo: 'Bravo !',
+		kiteSaYe: 'Kité sa ye ?',
+		pwenBlinde: 'Pwen blindé'
+	},
+	langue: {
+		fr: 'Français',
+		gcf: 'Kreyòl'
+	}
+};
+
+export default fr;
+export type Dict = typeof fr;
@@ -0,0 +1,110 @@
+import type { Dict } from './fr';
+
+const gcf: Dict = {
+	app: {
+		titre: 'JWE',
+		sousTitre: 'Jwé jéyolokalizasyon — Gwadloup, Matinik, Giyan, Léryinyon'
+	},
+	regions: {
+		GUADELOUPE: 'Gwadloup',
+		MARTINIQUE: 'Matinik',
+		GUYANE: 'Giyan',
+		REUNION: 'Léryinyon',
+		TOUTES: 'Tout péyi yo'
+	},
+	modes: {
+		monument: 'Konnèt moniman',
+		monumentDesc: 'Roukonèt moniman-an asou foto-a é mété’y asou kat-la.',
+		lieu: 'Kote mwen ye ?',
+		lieuDesc: 'On lari, on bodlanmè, on fowé… chwé kote ou yé.',
+		defi: 'Défi 5 rounds',
+		defiDesc: '5 koté youn dèyè ròt, moniman épi plas mélanjé.',
+		explorer: 'Aprann',
+		explorerDesc: 'Flanné asou kat-la é li fich Wikipédia yo. San pwen.'
+	},
+	accueil: {
+		choixRegion: 'Chwazi péyi ou',
+		choixMode: 'Chwazi jan ou vlé jwé',
+		options: 'Règlaj',
+		timer: 'Kronomèt (60 s, bonus pwen)',
+		jouer: 'Jwé'
+	},
+	jeu: {
+		charger: 'Nou ka chajé koté-la…',
+		erreur: 'Nou pa rivé chajé on koté. Éséyé ankò.',
+		reessayer: 'Éséyé ankò',
+		valider: 'Validé pozisyon mwen',
+		passer: 'Pasé',
+		indice: 'Endis',
+		indicePenalite: '−10 % pwen',
+		indiceRestant: 'endis ki rété',
+		indicesRestants: 'endis ki rété',
+		plusDIndice: 'Pa ni endis ankò',
+		poserMarqueur: 'Kwiké asou kat-la pou mété makò-a',
+		round: 'Mannèk',
+		sur: 'asou',
+		difficulte: {
+			FACILE: 'Fasil',
+			MOYEN: 'Mwayen',
+			DIFFICILE: 'Difisil',
+			EXPERT: 'Espè'
+		}
+	},
+	resultat: {
+		bravo: 'Bravo !',
+		score: 'Pwen',
+		points: 'pwen',
+		distance: 'Distans',
+		km: 'km',
+		trouve: 'Ou trouvé ! Aprann pli plis asou koté sa-a.',
+		aDecouvrir: 'Koté-la té la. Aprann pli plis asou’y.',
+		lireWiki: 'Li swit-la asou Wikipédia',
+		commune: 'Komin',
+		region: 'Péyi',
+		suivant: 'Koté swivan',
+		voirBilan: 'Wè bilan-an',
+		rejouer: 'Rèjwé',
+		retourAccueil: 'Tounen an lakay'
+	},
+	lacune: {
+		titre: 'Pwen blindé — Sa pa dokimanté',
+		texte:
+			'Koté sa-a égzisté, men i pa ni on paj asou Wikipédia ni on fich asou Wikidata. Pou péyi nou, sé on zafè enpòtan anpil : si nou pa dokimanté pwòp téritwa nou, listwa épi jéwografi nou kay disparèt asou kat nimérik épi labaz donné lemonn yo (ki manm ka bay manjé a lintelijans atifisyèl).',
+		cta: 'Kontribyé sou Wikipédia',
+		guide: 'Ou bizwen èd pou koumansé ? Swiv gid OKI « Kijan pou kontribyé sou Wikipédia ».',
+		guideLien: 'Ouvri gid kontribisyon-an'
+	},
+	defi: {
+		bilan: 'Bilan défi-a',
+		scoreTotal: 'Total pwen',
+		partager: 'Palé di moun',
+		telecharger: 'Téléchajé foto-a',
+		taPosition: 'Pozisyon ou',
+		positionReelle: 'Rèl pozisyon-an',
+		manche: 'Mannèk'
+	},
+	explorer: {
+		titre: 'Aprann — Flanné',
+		filtrer: 'Triyé pa péyi',
+		chargerFiche: 'Nou ka chajé fich-la…',
+		aucuneFiche: 'Kwiké asou on makò asou kat-la.',
+		fermer: 'Fèmé pano-a'
+	},
+	carte: {
+		ariaLabel: 'Kat jwé-a. Flèch yo pou déplasé makò-a, Antré pou validé.',
+		sautRegion: 'Alé o péyi',
+		zoomIn: 'Zoumé',
+		zoomOut: 'Dézoumé'
+	},
+	micro: {
+		bravo: 'Bravo !',
+		kiteSaYe: 'Kité sa ye ?',
+		pwenBlinde: 'Pwen blindé'
+	},
+	langue: {
+		fr: 'Français',
+		gcf: 'Kreyòl'
+	}
+};
+
+export default gcf;
@@ -0,0 +1,38 @@
+import { browser } from '$app/environment';
+import fr, { type Dict } from './fr';
+import gcf from './gcf';
+
+export type Lang = 'fr' | 'gcf';
+
+const dicts: Record<Lang, Dict> = { fr, gcf };
+const STORAGE_KEY = 'jwe-lang';
+
+let lang = $state<Lang>('fr');
+
+/** Dictionnaire courant — fonction réactive : lit le `$state`, donc les templates se mettent à jour. */
+export function t(): Dict {
+	return dicts[lang];
+}
+
+export function getLang(): Lang {
+	return lang;
+}
+
+export function setLang(next: Lang): void {
+	lang = next;
+	if (browser) {
+		localStorage.setItem(STORAGE_KEY, next);
+		document.documentElement.lang = next;
+	}
+}
+
+/** À appeler une fois au montage du layout : restaure la langue persistée. */
+export function initLang(): void {
+	if (!browser) return;
+	const saved = localStorage.getItem(STORAGE_KEY);
+	if (saved === 'fr' || saved === 'gcf') {
+		setLang(saved);
+	} else {
+		document.documentElement.lang = lang;
+	}
+}
@@ -0,0 +1,16 @@
+import type { Region } from '$lib/types';
+
+/** Bornes de chaque région : [lonOuest, latSud, lonEst, latNord]. */
+export const REGION_BOUNDS: Record<Region, [number, number, number, number]> = {
+	GUADELOUPE: [-61.9, 15.8, -60.95, 16.55],
+	MARTINIQUE: [-61.25, 14.35, -60.75, 14.95],
+	GUYANE: [-54.7, 1.9, -51.5, 6.0],
+	REUNION: [55.15, -21.42, 55.9, -20.82]
+};
+
+/** Enveloppe union des 4 régions (≈ lon −63…57, lat −23…18) : interdit de sortir du terrain de jeu. */
+export const MAX_BOUNDS: [number, number, number, number] = [-63, -23, 57, 18];
+
+export const MIN_ZOOM = 4;
+
+export const REGIONS: Region[] = ['GUADELOUPE', 'MARTINIQUE', 'GUYANE', 'REUNION'];
@@ -0,0 +1,152 @@
+import rawLieux from './data/lieux.json';
+import type {
+	Categorie,
+	Difficulte,
+	ExplorerLieu,
+	GuessResult,
+	Lieu,
+	Region,
+	RoundPlace
+} from '$lib/types';
+
+const lieux = rawLieux as Lieu[];
+
+const REGIONS: Region[] = ['GUADELOUPE', 'MARTINIQUE', 'GUYANE', 'REUNION'];
+const CATEGORIES: Categorie[] = ['MONUMENT', 'LIEU'];
+
+export const MAX_POINTS = 5000;
+
+/** Rayon (km) de la courbe de score selon la difficulté du lieu. */
+export const RAYONS: Record<Difficulte, number> = {
+	FACILE: 50,
+	MOYEN: 15,
+	DIFFICILE: 5,
+	EXPERT: 1
+};
+
+/** Distance haversine en km. */
+export function haversineKm(a: { lat: number; lon: number }, b: { lat: number; lon: number }): number {
+	const R = 6371;
+	const dLat = ((b.lat - a.lat) * Math.PI) / 180;
+	const dLon = ((b.lon - a.lon) * Math.PI) / 180;
+	const s =
+		Math.sin(dLat / 2) ** 2 +
+		Math.cos((a.lat * Math.PI) / 180) * Math.cos((b.lat * Math.PI) / 180) * Math.sin(dLon / 2) ** 2;
+	return 2 * R * Math.asin(Math.sqrt(s));
+}
+
+function parseRegion(value: string | null): Region | null {
+	return value && REGIONS.includes(value as Region) ? (value as Region) : null;
+}
+
+function parseCategorie(value: string | null): Categorie | null {
+	return value && CATEGORIES.includes(value as Categorie) ? (value as Categorie) : null;
+}
+
+export function getLieuById(id: string): Lieu | undefined {
+	return lieux.find((l) => l.id === id);
+}
+
+/** Sélection aléatoire d'un lieu, avec filtres optionnels. */
+export function getRandomLieu(options: {
+	region?: string | null;
+	categorie?: string | null;
+	exclude?: string | null;
+}): Lieu | null {
+	const region = parseRegion(options.region ?? null);
+	const categorie = parseCategorie(options.categorie ?? null);
+	const excluded = new Set(
+		(options.exclude ?? '')
+			.split(',')
+			.map((s) => s.trim())
+			.filter(Boolean)
+	);
+	let pool = lieux.filter((l) => !excluded.has(l.id));
+	if (region) pool = pool.filter((l) => l.region === region);
+	if (categorie) pool = pool.filter((l) => l.categorie === categorie);
+	// Si tout a été exclu, on réessaie sans les exclusions (le jeu doit continuer).
+	if (pool.length === 0) {
+		pool = lieux;
+		if (region) pool = pool.filter((l) => l.region === region);
+		if (categorie) pool = pool.filter((l) => l.categorie === categorie);
+	}
+	if (pool.length === 0) return null;
+	return pool[Math.floor(Math.random() * pool.length)];
+}
+
+/** Anti-triche : ne garde que les champs publiques pour /api/round. */
+export function sanitizeRound(lieu: Lieu): RoundPlace {
+	return {
+		id: lieu.id,
+		nom: lieu.nom,
+		nom_creole: lieu.nom_creole,
+		categorie: lieu.categorie,
+		difficulte: lieu.difficulte,
+		photo: lieu.photo,
+		indices: lieu.indices
+	};
+}
+
+/**
+ * Scoring recalculé côté serveur :
+ * score = round(5000 × e^(−d/r)), r selon difficulté ;
+ * pénalité −10 % par indice ; bonus temps ≤ +20 % ; total plafonné à 5000.
+ */
+export function scoreGuess(
+	lieu: Lieu,
+	guess: { lat: number; lon: number },
+	hintsUsed: number,
+	timeMs?: number
+): GuessResult {
+	const distanceKm = haversineKm(guess, lieu.coordonnees);
+	const base = Math.round(MAX_POINTS * Math.exp(-distanceKm / RAYONS[lieu.difficulte]));
+	const penalises = base * Math.max(0, 1 - 0.1 * Math.max(0, hintsUsed));
+	let total = penalises;
+	if (typeof timeMs === 'number' && Number.isFinite(timeMs) && timeMs >= 0) {
+		total += penalises * 0.2 * Math.max(0, 1 - timeMs / 60000);
+	}
+	const score = Math.min(MAX_POINTS, Math.round(total));
+	return {
+		distanceKm: Math.round(distanceKm * 10) / 10,
+		score,
+		coordonnees: lieu.coordonnees,
+		commune: lieu.commune,
+		region: lieu.region,
+		nom: lieu.nom,
+		nom_creole: lieu.nom_creole,
+		wikidata_id: lieu.wikidata_id
+	};
+}
+
+/** Réponse « Passer » : la vérité est révélée, score 0, pas de distance. */
+export function skipResult(lieu: Lieu): GuessResult {
+	return {
+		distanceKm: null,
+		score: 0,
+		coordonnees: lieu.coordonnees,
+		commune: lieu.commune,
+		region: lieu.region,
+		nom: lieu.nom,
+		nom_creole: lieu.nom_creole,
+		wikidata_id: lieu.wikidata_id
+	};
+}
+
+/** Catalogue Explorer : coords arrondies à 0.05° (mode sans score, fiches autorisées). */
+export function catalogueExplorer(): ExplorerLieu[] {
+	return lieux.map((l) => ({
+		id: l.id,
+		nom: l.nom,
+		nom_creole: l.nom_creole,
+		region: l.region,
+		commune: l.commune,
+		coordonnees: {
+			lat: Math.round(l.coordonnees.lat / 0.05) * 0.05,
+			lon: Math.round(l.coordonnees.lon / 0.05) * 0.05
+		},
+		categorie: l.categorie,
+		difficulte: l.difficulte,
+		wikidata_id: l.wikidata_id,
+		photo: l.photo
+	}));
+}
@@ -0,0 +1,32 @@
+import type { Coordonnees, GuessResult, RoundPlace } from '$lib/types';
+
+export interface MancheDefi {
+	place: RoundPlace;
+	guess: Coordonnees | null;
+	result: GuessResult;
+}
+
+/** État du Défi 5 rounds — client uniquement, sans session serveur. */
+function creerDefiStore() {
+	let manches = $state<MancheDefi[]>([]);
+
+	return {
+		get manches() {
+			return manches;
+		},
+		get total() {
+			return manches.reduce((s, m) => s + m.result.score, 0);
+		},
+		get termine() {
+			return manches.length >= 5;
+		},
+		ajouter(manche: MancheDefi) {
+			manches = [...manches, manche];
+		},
+		reinitialiser() {
+			manches = [];
+		}
+	};
+}
+
+export const defi = creerDefiStore();
@@ -0,0 +1,118 @@
+/* Tokens OKI — doctrine « calm technology » : couleurs ancrées dans le territoire,
+   un seul accent fort (corail) réservé à l'action primaire (Von Restorff). */
+:root {
+	--oki-vert: #0b3d2e; /* vert profond — couleur principale de la marque */
+	--oki-vert-clair: #17624a;
+	--oki-vert-doux: #e3efe7;
+	--oki-sable: #f5efe2; /* fonds */
+	--oki-sable-fonce: #e7dcc4;
+	--oki-bleu: #175e70; /* bleu caraïbe profond */
+	--oki-bleu-doux: #d9ecef;
+	--oki-corail: #e4572e; /* accent — action primaire UNIQUEMENT */
+	--oki-corail-fonce: #c4441f;
+	--oki-encre: #22302a;
+	--oki-encre-doux: #5a6b62;
+	--oki-blanc: #fffdf8;
+	--oki-lacune-fond: #fdf3e3; /* panneau Cas B « Pwen blindé » — teinte distincte */
+	--oki-lacune-bord: #d9a441;
+
+	--oki-radius: 14px;
+	--oki-radius-petit: 9px;
+	--oki-ombre: 0 2px 10px rgba(11, 61, 46, 0.14);
+	--oki-font:
+		system-ui,
+		-apple-system,
+		'Segoe UI',
+		Roboto,
+		sans-serif;
+}
+
+* {
+	box-sizing: border-box;
+}
+
+html,
+body {
+	margin: 0;
+	padding: 0;
+}
+
+body {
+	font-family: var(--oki-font);
+	color: var(--oki-encre);
+	background: var(--oki-sable);
+	line-height: 1.5;
+}
+
+button {
+	font-family: inherit;
+}
+
+/* — Boutons — */
+.btn {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	gap: 0.5rem;
+	border: none;
+	border-radius: var(--oki-radius-petit);
+	padding: 0.85rem 1.6rem;
+	font-size: 1.05rem;
+	font-weight: 650;
+	cursor: pointer;
+	text-decoration: none;
+	transition: background-color 0.15s ease;
+}
+
+.btn:focus-visible,
+a:focus-visible,
+[tabindex]:focus-visible {
+	outline: 3px solid var(--oki-bleu);
+	outline-offset: 2px;
+}
+
+/* Action primaire : le seul élément fortement coloré de l'écran */
+.btn-primaire {
+	background: var(--oki-corail);
+	color: #fff;
+	box-shadow: var(--oki-ombre);
+}
+
+.btn-primaire:hover {
+	background: var(--oki-corail-fonce);
+}
+
+.btn-primaire:disabled {
+	background: var(--oki-sable-fonce);
+	color: var(--oki-encre-doux);
+	cursor: not-allowed;
+	box-shadow: none;
+}
+
+.btn-secondaire {
+	background: var(--oki-vert-doux);
+	color: var(--oki-vert);
+}
+
+.btn-secondaire:hover {
+	background: #d2e5d9;
+}
+
+.btn-tertiaire {
+	background: transparent;
+	color: var(--oki-vert-clair);
+	border: 1.5px solid var(--oki-vert-clair);
+}
+
+.btn-tertiaire:hover {
+	background: var(--oki-vert-doux);
+}
+
+@media (prefers-reduced-motion: reduce) {
+	*,
+	*::before,
+	*::after {
+		transition-duration: 0.01ms !important;
+		animation-duration: 0.01ms !important;
+	}
+}
@@ -0,0 +1,82 @@
+export type Region = 'GUADELOUPE' | 'MARTINIQUE' | 'GUYANE' | 'REUNION';
+export type Categorie = 'MONUMENT' | 'LIEU';
+export type Difficulte = 'FACILE' | 'MOYEN' | 'DIFFICILE' | 'EXPERT';
+
+export interface Coordonnees {
+	lat: number;
+	lon: number;
+}
+
+export interface Indice {
+	niveau: number;
+	texte: string;
+}
+
+export interface Photo {
+	url: string;
+	credit: string;
+	alt: string;
+}
+
+/** Lieu complet — serveur uniquement, jamais exposé tel quel au client. */
+export interface Lieu {
+	id: string;
+	nom: string;
+	nom_creole: string;
+	region: Region;
+	commune: string;
+	coordonnees: Coordonnees;
+	categorie: Categorie;
+	difficulte: Difficulte;
+	wikidata_id: string | null;
+	photo: Photo;
+	indices: Indice[];
+}
+
+/** Lieu SANITISÉ envoyé par GET /api/round (aucune coordonnée, commune, région, wikidata_id). */
+export interface RoundPlace {
+	id: string;
+	nom: string;
+	nom_creole: string;
+	categorie: Categorie;
+	difficulte: Difficulte;
+	photo: Photo;
+	indices: Indice[];
+}
+
+/** Réponse de POST /api/guess : la vérité n'est révélée qu'après soumission. */
+export interface GuessResult {
+	distanceKm: number | null;
+	score: number;
+	coordonnees: Coordonnees;
+	commune: string;
+	region: Region;
+	nom: string;
+	nom_creole: string;
+	wikidata_id: string | null;
+}
+
+/** Entrée du catalogue Explorer : coords arrondies à 0.05°, mode sans score. */
+export interface ExplorerLieu {
+	id: string;
+	nom: string;
+	nom_creole: string;
+	region: Region;
+	commune: string;
+	coordonnees: Coordonnees;
+	categorie: Categorie;
+	difficulte: Difficulte;
+	wikidata_id: string | null;
+	photo: Photo;
+}
+
+/** Réponse normalisée de GET /api/wiki/[qid]. */
+export interface WikiSummary {
+	qid: string;
+	title: string;
+	extract: string;
+	url: string;
+	thumbnail: string | null;
+}
+
+export type GameMode = 'monument' | 'lieu' | 'defi';
@@ -0,0 +1,82 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import '$lib/styles/oki.css';
+	import LangSwitch from '$lib/components/LangSwitch.svelte';
+	import { initLang, t } from '$lib/i18n/store.svelte';
+
+	let { children } = $props();
+
+	onMount(() => {
+		initLang();
+	});
+</script>
+
+<div class="app">
+	<header class="entete">
+		<a href="/" class="logo" aria-label="JWE — accueil">
+			<svg viewBox="0 0 32 32" width="30" height="30" aria-hidden="true">
+				<circle cx="16" cy="16" r="14" fill="none" stroke="currentColor" stroke-width="2.5" />
+				<path d="M16 7 L21 22 L16 18.5 L11 22 Z" fill="currentColor" />
+			</svg>
+			<span>{t().app.titre}</span>
+		</a>
+		<nav class="nav-lang">
+			<a href="/explorer" class="lien-explorer">{t().modes.explorer}</a>
+			<LangSwitch />
+		</nav>
+	</header>
+	<main>
+		{@render children()}
+	</main>
+</div>
+
+<style>
+	.app {
+		min-height: 100dvh;
+		display: flex;
+		flex-direction: column;
+	}
+
+	.entete {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0.6rem 1rem;
+		background: var(--oki-vert);
+		color: #fff;
+	}
+
+	.logo {
+		display: inline-flex;
+		align-items: center;
+		gap: 0.5rem;
+		color: #fff;
+		text-decoration: none;
+		font-size: 1.4rem;
+		font-weight: 800;
+		letter-spacing: 0.04em;
+	}
+
+	.nav-lang {
+		display: flex;
+		align-items: center;
+		gap: 0.8rem;
+	}
+
+	.lien-explorer {
+		color: var(--oki-vert-doux);
+		text-decoration: none;
+		font-weight: 600;
+		font-size: 0.95rem;
+	}
+
+	.lien-explorer:hover {
+		color: #fff;
+	}
+
+	main {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+	}
+</style>
@@ -0,0 +1,258 @@
+<script lang="ts">
+	import { goto } from '$app/navigation';
+	import { t } from '$lib/i18n/store.svelte';
+	import { REGIONS } from '$lib/map/regions';
+	import type { GameMode, Region } from '$lib/types';
+
+	type ChoixRegion = Region | 'TOUTES';
+
+	let region = $state<ChoixRegion>('TOUTES');
+	let mode = $state<GameMode>('monument');
+	let timer = $state(false);
+
+	const modes: { id: GameMode; emoji: string }[] = [
+		{ id: 'monument', emoji: '🏛️' },
+		{ id: 'lieu', emoji: '📍' },
+		{ id: 'defi', emoji: '⛰️' }
+	];
+
+	function jouer(): void {
+		const params = new URLSearchParams();
+		if (region !== 'TOUTES') params.set('region', region);
+		if (timer) params.set('timer', '1');
+		goto(`/jeu/${mode}${params.size ? `?${params}` : ''}`);
+	}
+</script>
+
+<svelte:head>
+	<title>{t().app.titre} — {t().app.sousTitre}</title>
+	<meta name="description" content={t().app.sousTitre} />
+</svelte:head>
+
+<div class="accueil">
+	<section class="hero">
+		<h1>{t().app.titre}</h1>
+		<p class="accroche">{t().micro.kiteSaYe}</p>
+		<p class="sous-titre">{t().app.sousTitre}</p>
+	</section>
+
+	<section aria-labelledby="titre-regions">
+		<h2 id="titre-regions">{t().accueil.choixRegion}</h2>
+		<div class="grille regions">
+			{#each REGIONS as r (r)}
+				<button
+					type="button"
+					class="carte-region region-{r.toLowerCase()}"
+					class:choisi={region === r}
+					aria-pressed={region === r}
+					onclick={() => (region = r)}
+				>
+					<span class="nom">{t().regions[r]}</span>
+				</button>
+			{/each}
+			<button
+				type="button"
+				class="carte-region toutes"
+				class:choisi={region === 'TOUTES'}
+				aria-pressed={region === 'TOUTES'}
+				onclick={() => (region = 'TOUTES')}
+			>
+				<span class="nom">{t().regions.TOUTES}</span>
+			</button>
+		</div>
+	</section>
+
+	<section aria-labelledby="titre-modes">
+		<h2 id="titre-modes">{t().accueil.choixMode}</h2>
+		<div class="grille modes">
+			{#each modes as m (m.id)}
+				<button
+					type="button"
+					class="carte-mode"
+					class:choisi={mode === m.id}
+					aria-pressed={mode === m.id}
+					onclick={() => (mode = m.id)}
+				>
+					<span class="emoji" aria-hidden="true">{m.emoji}</span>
+					<span class="nom">{t().modes[m.id]}</span>
+					<span class="desc">{t().modes[`${m.id}Desc`]}</span>
+				</button>
+			{/each}
+			<a href="/explorer" class="carte-mode explorer">
+				<span class="emoji" aria-hidden="true">🧭</span>
+				<span class="nom">{t().modes.explorer}</span>
+				<span class="desc">{t().modes.explorerDesc}</span>
+			</a>
+		</div>
+	</section>
+
+	<section class="options" aria-labelledby="titre-options">
+		<h2 id="titre-options">{t().accueil.options}</h2>
+		<label class="option-timer">
+			<input type="checkbox" bind:checked={timer} />
+			<span>{t().accueil.timer}</span>
+		</label>
+	</section>
+
+	<div class="zone-pouce">
+		<button type="button" class="btn btn-primaire jouer" onclick={jouer}>
+			{t().accueil.jouer}
+		</button>
+	</div>
+</div>
+
+<style>
+	.accueil {
+		width: 100%;
+		max-width: 860px;
+		margin: 0 auto;
+		padding: 1.25rem 1rem 7rem; /* espace pour le bouton fixe en zone pouce */
+		display: flex;
+		flex-direction: column;
+		gap: 1.6rem;
+	}
+
+	.hero {
+		text-align: center;
+	}
+
+	.hero h1 {
+		margin: 0;
+		font-size: 3rem;
+		font-weight: 800;
+		color: var(--oki-vert);
+		letter-spacing: 0.06em;
+	}
+
+	.accroche {
+		margin: 0.2rem 0 0;
+		font-size: 1.25rem;
+		font-weight: 650;
+		color: var(--oki-vert-clair);
+		font-style: italic;
+	}
+
+	.sous-titre {
+		margin: 0.4rem 0 0;
+		color: var(--oki-encre-doux);
+	}
+
+	h2 {
+		font-size: 1.05rem;
+		color: var(--oki-vert);
+		margin: 0 0 0.6rem;
+	}
+
+	.grille {
+		display: grid;
+		gap: 0.7rem;
+	}
+
+	.regions {
+		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
+	}
+
+	.modes {
+		grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+	}
+
+	.carte-region,
+	.carte-mode {
+		border: 2px solid transparent;
+		border-radius: var(--oki-radius);
+		background: var(--oki-blanc);
+		box-shadow: var(--oki-ombre);
+		cursor: pointer;
+		text-align: center;
+		color: var(--oki-encre);
+		text-decoration: none;
+	}
+
+	.carte-region {
+		padding: 1.4rem 0.6rem;
+		font-size: 1.05rem;
+		font-weight: 700;
+	}
+
+	.carte-region .nom {
+		color: var(--oki-vert);
+	}
+
+	.carte-mode {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		gap: 0.35rem;
+		padding: 1rem 0.8rem;
+	}
+
+	.carte-mode .emoji {
+		font-size: 1.6rem;
+	}
+
+	.carte-mode .nom {
+		font-weight: 750;
+		color: var(--oki-vert);
+	}
+
+	.carte-mode .desc {
+		font-size: 0.85rem;
+		color: var(--oki-encre-doux);
+	}
+
+	.carte-region:hover,
+	.carte-mode:hover {
+		border-color: var(--oki-vert-clair);
+	}
+
+	.carte-region.choisi,
+	.carte-mode.choisi {
+		border-color: var(--oki-vert);
+		background: var(--oki-vert-doux);
+	}
+
+	.options {
+		display: flex;
+		flex-direction: column;
+		gap: 0.4rem;
+	}
+
+	.option-timer {
+		display: flex;
+		align-items: center;
+		gap: 0.6rem;
+		font-size: 1rem;
+		cursor: pointer;
+	}
+
+	.option-timer input {
+		width: 1.2rem;
+		height: 1.2rem;
+		accent-color: var(--oki-vert);
+	}
+
+	/* Bouton « Jouer » : fixe en zone du pouce sur mobile */
+	.zone-pouce {
+		position: fixed;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		padding: 0.8rem 1rem calc(0.8rem + env(safe-area-inset-bottom));
+		background: linear-gradient(transparent, var(--oki-sable) 35%);
+		display: flex;
+		justify-content: center;
+		z-index: 10;
+	}
+
+	.jouer {
+		width: min(420px, 100%);
+		padding: 1rem;
+		font-size: 1.2rem;
+	}
+
+	@media (min-width: 768px) {
+		.hero h1 {
+			font-size: 3.6rem;
+		}
+	}
+</style>
@@ -0,0 +1,51 @@
+import { json } from '@sveltejs/kit';
+import { getLieuById, scoreGuess, skipResult } from '$lib/server/lieux';
+import type { RequestHandler } from './$types';
+
+interface GuessBody {
+	id?: unknown;
+	lat?: unknown;
+	lon?: unknown;
+	hintsUsed?: unknown;
+	timeMs?: unknown;
+	skip?: unknown;
+}
+
+/**
+ * POST /api/guess { id, lat, lon, hintsUsed, timeMs? }
+ * → score recalculé serveur + vérité du lieu (révélée seulement ici).
+ * `skip: true` révèle la réponse avec un score de 0 (bouton « Passer »).
+ */
+export const POST: RequestHandler = async ({ request }) => {
+	let body: GuessBody;
+	try {
+		body = (await request.json()) as GuessBody;
+	} catch {
+		return json({ erreur: 'Corps JSON invalide' }, { status: 400 });
+	}
+
+	if (typeof body.id !== 'string') {
+		return json({ erreur: 'id manquant' }, { status: 400 });
+	}
+	const lieu = getLieuById(body.id);
+	if (!lieu) {
+		return json({ erreur: 'Lieu inconnu' }, { status: 404 });
+	}
+
+	if (body.skip === true) {
+		return json(skipResult(lieu));
+	}
+
+	const lat = Number(body.lat);
+	const lon = Number(body.lon);
+	if (!Number.isFinite(lat) || !Number.isFinite(lon) || Math.abs(lat) > 90 || Math.abs(lon) > 180) {
+		return json({ erreur: 'Coordonnées invalides' }, { status: 400 });
+	}
+	const hintsUsed = Math.max(0, Math.floor(Number(body.hintsUsed) || 0));
+	const timeMs =
+		typeof body.timeMs === 'number' && Number.isFinite(body.timeMs) && body.timeMs >= 0
+			? body.timeMs
+			: undefined;
+
+	return json(scoreGuess(lieu, { lat, lon }, hintsUsed, timeMs));
+};
@@ -0,0 +1,10 @@
+import { json } from '@sveltejs/kit';
+import { catalogueExplorer } from '$lib/server/lieux';
+import type { RequestHandler } from './$types';
+
+/** GET /api/lieux → catalogue Explorer (coords arrondies à 0.05°, mode sans score). */
+export const GET: RequestHandler = () => {
+	return json(catalogueExplorer(), {
+		headers: { 'Cache-Control': 'public, max-age=300' }
+	});
+};
@@ -0,0 +1,18 @@
+import { json } from '@sveltejs/kit';
+import { getRandomLieu, sanitizeRound } from '$lib/server/lieux';
+import type { RequestHandler } from './$types';
+
+/** GET /api/round?region=&categorie=&exclude=id1,id2 → lieu aléatoire SANITISÉ. */
+export const GET: RequestHandler = ({ url }) => {
+	const lieu = getRandomLieu({
+		region: url.searchParams.get('region'),
+		categorie: url.searchParams.get('categorie'),
+		exclude: url.searchParams.get('exclude')
+	});
+	if (!lieu) {
+		return json({ erreur: 'Aucun lieu disponible pour ces critères' }, { status: 404 });
+	}
+	return json(sanitizeRound(lieu), {
+		headers: { 'Cache-Control': 'no-store' }
+	});
+};
@@ -0,0 +1,81 @@
+import { json } from '@sveltejs/kit';
+import type { WikiSummary } from '$lib/types';
+import type { RequestHandler } from './$types';
+
+const USER_AGENT = 'JWE-OKI/2.0 (https://labola.o-k-i.net/ORGANISATION-KA-INTERNATIONALE/JWE; contact OKI)';
+const TTL_MS = 24 * 60 * 60 * 1000; // 24 h
+
+const cache = new Map<string, { expires: number; summary: WikiSummary }>();
+
+interface WbEntity {
+	labels?: { fr?: { value: string } };
+	sitelinks?: { frwiki?: { title: string } };
+}
+
+interface WbResponse {
+	entities?: Record<string, WbEntity>;
+}
+
+interface RestSummary {
+	title?: string;
+	extract?: string;
+	content_urls?: { desktop?: { page?: string } };
+	thumbnail?: { source?: string };
+}
+
+/** GET /api/wiki/[qid] → extrait Wikipédia FR normalisé (404 si pas de sitelink fr). */
+export const GET: RequestHandler = async ({ params, fetch }) => {
+	const qid = params.qid;
+	if (!/^Q\d+$/.test(qid)) {
+		return json({ erreur: 'Identifiant Wikidata invalide' }, { status: 400 });
+	}
+
+	const cached = cache.get(qid);
+	if (cached && cached.expires > Date.now()) {
+		return json(cached.summary, { headers: { 'Cache-Control': 'public, max-age=3600' } });
+	}
+
+	const headers = { 'User-Agent': USER_AGENT, Accept: 'application/json' };
+
+	// 1. Wikidata : sitelink frwiki (+ libellé fr en fallback)
+	const wbUrl = `https://www.wikidata.org/w/api.php?action=wbgetentities&ids=${encodeURIComponent(qid)}&props=sitelinks%7Clabels&sitefilter=frwiki&languages=fr&format=json`;
+	let entity: WbEntity | undefined;
+	try {
+		const res = await fetch(wbUrl, { headers });
+		if (!res.ok) throw new Error(`wikidata ${res.status}`);
+		entity = ((await res.json()) as WbResponse).entities?.[qid];
+	} catch {
+		return json({ erreur: 'Wikidata injoignable' }, { status: 502 });
+	}
+
+	const titre = entity?.sitelinks?.frwiki?.title;
+	if (!titre) {
+		// Pas de page Wikipédia FR → le front bascule sur l'écran « Pwen blindé ».
+		return json({ erreur: 'Pas de page Wikipédia en français' }, { status: 404 });
+	}
+
+	// 2. Wikipédia FR : résumé de l'article
+	let data: RestSummary;
+	try {
+		const res = await fetch(
+			`https://fr.wikipedia.org/api/rest_v1/page/summary/${encodeURIComponent(titre)}`,
+			{ headers }
+		);
+		if (res.status === 404) return json({ erreur: 'Article introuvable' }, { status: 404 });
+		if (!res.ok) throw new Error(`wikipedia ${res.status}`);
+		data = (await res.json()) as RestSummary;
+	} catch {
+		return json({ erreur: 'Wikipédia injoignable' }, { status: 502 });
+	}
+
+	const summary: WikiSummary = {
+		qid,
+		title: data.title ?? titre,
+		extract: data.extract ?? '',
+		url: data.content_urls?.desktop?.page ?? `https://fr.wikipedia.org/wiki/${encodeURIComponent(titre)}`,
+		thumbnail: data.thumbnail?.source ?? null
+	};
+	cache.set(qid, { expires: Date.now() + TTL_MS, summary });
+
+	return json(summary, { headers: { 'Cache-Control': 'public, max-age=3600' } });
+};
@@ -0,0 +1,261 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import GameMap from '$lib/components/GameMap.svelte';
+	import WikiFiche from '$lib/components/WikiFiche.svelte';
+	import { t } from '$lib/i18n/store.svelte';
+	import { REGIONS } from '$lib/map/regions';
+	import type { ExplorerLieu, Region } from '$lib/types';
+
+	type Filtre = Region | 'TOUTES';
+
+	let lieux = $state<ExplorerLieu[]>([]);
+	let filtre = $state<Filtre>('TOUTES');
+	let selection = $state<ExplorerLieu | null>(null);
+	let erreur = $state(false);
+
+	const lieuxFiltres = $derived(
+		filtre === 'TOUTES' ? lieux : lieux.filter((l) => l.region === filtre)
+	);
+	const markers = $derived(
+		lieuxFiltres.map((l) => ({
+			id: l.id,
+			lat: l.coordonnees.lat,
+			lon: l.coordonnees.lon,
+			label: `${l.nom} — ${l.commune}`
+		}))
+	);
+
+	function ouvrir(id: string): void {
+		selection = lieux.find((l) => l.id === id) ?? null;
+	}
+
+	onMount(() => {
+		void (async () => {
+			try {
+				const res = await fetch('/api/lieux');
+				if (!res.ok) throw new Error(String(res.status));
+				lieux = (await res.json()) as ExplorerLieu[];
+			} catch {
+				erreur = true;
+			}
+		})();
+	});
+</script>
+
+<svelte:head>
+	<title>{t().app.titre} — {t().explorer.titre}</title>
+</svelte:head>
+
+<div class="explorer">
+	<div class="filtres" role="group" aria-label={t().explorer.filtrer}>
+		<button
+			type="button"
+			class:actif={filtre === 'TOUTES'}
+			aria-pressed={filtre === 'TOUTES'}
+			onclick={() => (filtre = 'TOUTES')}
+		>
+			{t().regions.TOUTES}
+		</button>
+		{#each REGIONS as r (r)}
+			<button
+				type="button"
+				class:actif={filtre === r}
+				aria-pressed={filtre === r}
+				onclick={() => (filtre = r)}
+			>
+				{t().regions[r]}
+			</button>
+		{/each}
+	</div>
+
+	<div class="carte-explorer">
+		{#if erreur}
+			<p class="erreur">{t().jeu.erreur}</p>
+		{:else}
+			<GameMap interactive={false} {markers} onmarkerclick={ouvrir} />
+		{/if}
+	</div>
+
+	<!-- Panneau latéral (desktop) / bottom sheet (mobile) -->
+	<aside class="fiche" class:ouvert={!!selection} aria-live="polite">
+		{#if selection}
+			<button
+				type="button"
+				class="fermer"
+				aria-label={t().explorer.fermer}
+				onclick={() => (selection = null)}
+			>
+				✕
+			</button>
+			<figure class="fiche-photo">
+				<img
+					src={selection.photo.url}
+					alt={selection.photo.alt}
+					loading="lazy"
+					decoding="async"
+				/>
+				<figcaption>{selection.photo.credit}</figcaption>
+			</figure>
+			<h1>{selection.nom}</h1>
+			{#if selection.nom_creole && selection.nom_creole !== selection.nom}
+				<p class="creole">{selection.nom_creole}</p>
+			{/if}
+			<p class="localisation">
+				{t().resultat.commune} : {selection.commune} — {t().regions[selection.region]}
+			</p>
+			{#key selection.id}
+				<WikiFiche nom={selection.nom} wikidataId={selection.wikidata_id} />
+			{/key}
+		{:else}
+			<p class="vide">{t().explorer.aucuneFiche}</p>
+		{/if}
+	</aside>
+</div>
+
+<style>
+	.explorer {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		position: relative;
+		min-height: 0;
+	}
+
+	.filtres {
+		display: flex;
+		gap: 0.4rem;
+		flex-wrap: wrap;
+		padding: 0.6rem 0.8rem;
+		background: var(--oki-blanc);
+		border-bottom: 1px solid var(--oki-sable-fonce);
+	}
+
+	.filtres button {
+		border: 1.5px solid var(--oki-vert-clair);
+		background: transparent;
+		color: var(--oki-vert);
+		border-radius: 999px;
+		padding: 0.35rem 0.9rem;
+		font-size: 0.88rem;
+		font-weight: 650;
+		cursor: pointer;
+	}
+
+	.filtres button.actif {
+		background: var(--oki-vert);
+		border-color: var(--oki-vert);
+		color: #fff;
+	}
+
+	.carte-explorer {
+		flex: 1;
+		min-height: 0;
+		padding: 0.6rem;
+	}
+
+	.erreur {
+		text-align: center;
+		color: var(--oki-encre-doux);
+	}
+
+	/* Bottom sheet mobile */
+	.fiche {
+		position: absolute;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		max-height: 62%;
+		overflow-y: auto;
+		background: var(--oki-blanc);
+		border-radius: var(--oki-radius) var(--oki-radius) 0 0;
+		box-shadow: 0 -4px 18px rgba(11, 61, 46, 0.2);
+		padding: 1rem;
+		transform: translateY(calc(100% - 3.2rem));
+		transition: transform 0.25s ease;
+	}
+
+	.fiche.ouvert {
+		transform: translateY(0);
+	}
+
+	.fiche .vide {
+		margin: 0;
+		text-align: center;
+		color: var(--oki-encre-doux);
+		padding-bottom: 0.4rem;
+	}
+
+	.fermer {
+		position: absolute;
+		top: 0.6rem;
+		right: 0.6rem;
+		border: none;
+		background: var(--oki-vert-doux);
+		color: var(--oki-vert);
+		width: 2rem;
+		height: 2rem;
+		border-radius: 50%;
+		font-size: 1rem;
+		cursor: pointer;
+	}
+
+	.fiche-photo {
+		margin: 0 0 0.6rem;
+	}
+
+	.fiche-photo img {
+		width: 100%;
+		max-height: 200px;
+		object-fit: cover;
+		border-radius: var(--oki-radius-petit);
+		display: block;
+	}
+
+	.fiche-photo figcaption {
+		font-size: 0.72rem;
+		color: var(--oki-encre-doux);
+		margin-top: 0.2rem;
+	}
+
+	.fiche h1 {
+		margin: 0;
+		font-size: 1.3rem;
+		color: var(--oki-vert);
+	}
+
+	.creole {
+		margin: 0.1rem 0 0;
+		font-style: italic;
+		color: var(--oki-vert-clair);
+	}
+
+	.localisation {
+		margin: 0.3rem 0 0.8rem;
+		color: var(--oki-encre-doux);
+		font-size: 0.92rem;
+	}
+
+	/* Panneau latéral desktop */
+	@media (min-width: 768px) {
+		.fiche {
+			left: auto;
+			top: 0;
+			right: 0;
+			bottom: 0;
+			width: 380px;
+			max-height: none;
+			border-radius: var(--oki-radius) 0 0 var(--oki-radius);
+			transform: translateX(calc(100% - 3.2rem));
+		}
+
+		.fiche.ouvert {
+			transform: translateX(0);
+		}
+	}
+
+	@media (prefers-reduced-motion: reduce) {
+		.fiche {
+			transition: none;
+		}
+	}
+</style>
@@ -0,0 +1,543 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import { page } from '$app/state';
+	import GameMap from '$lib/components/GameMap.svelte';
+	import PhotoPanel from '$lib/components/PhotoPanel.svelte';
+	import ResultPanel from '$lib/components/ResultPanel.svelte';
+	import TimerRing from '$lib/components/TimerRing.svelte';
+	import { t } from '$lib/i18n/store.svelte';
+	import { defi } from '$lib/stores/defi.svelte';
+	import type { Coordonnees, GuessResult, RoundPlace } from '$lib/types';
+
+	let { data } = $props();
+	const mode = $derived(data.mode);
+
+	const regionParam = $derived(page.url.searchParams.get('region'));
+	const timerActif = $derived(page.url.searchParams.get('timer') === '1');
+
+	let place = $state<RoundPlace | null>(null);
+	let guess = $state<Coordonnees | null>(null);
+	let result = $state<GuessResult | null>(null);
+	let indicesMontres = $state<string[]>([]);
+	let chargement = $state(true);
+	let erreur = $state(false);
+	let enCours = $state(false); // requête guess en vol
+
+	let timerRef: ReturnType<typeof TimerRing> | undefined = $state();
+	let joues = $state<string[]>([]); // ids déjà joués (évite les répétitions)
+	let bilan = $state(false); // écran final du défi
+
+	const estDefi = $derived(mode === 'defi');
+	const mancheCourante = $derived(defi.manches.length + 1);
+	const defiTermine = $derived(estDefi && defi.termine);
+	const paires = $derived(
+		defi.manches
+			.filter((m) => m.guess !== null)
+			.map((m) => ({ from: m.guess!, to: m.result.coordonnees, label: m.result.nom }))
+	);
+
+	async function chargerRound(): Promise<void> {
+		chargement = true;
+		erreur = false;
+		place = null;
+		guess = null;
+		result = null;
+		indicesMontres = [];
+		try {
+			const params = new URLSearchParams();
+			if (regionParam) params.set('region', regionParam);
+			if (mode === 'monument') params.set('categorie', 'MONUMENT');
+			if (mode === 'lieu') params.set('categorie', 'LIEU');
+			if (joues.length > 0) params.set('exclude', joues.join(','));
+			const res = await fetch(`/api/round?${params}`);
+			if (!res.ok) throw new Error(String(res.status));
+			place = (await res.json()) as RoundPlace;
+		} catch {
+			erreur = true;
+		} finally {
+			chargement = false;
+		}
+	}
+
+	async function soumettre(skip: boolean): Promise<void> {
+		if (!place || result || enCours) return;
+		if (!skip && !guess) return;
+		enCours = true;
+		try {
+			const body: Record<string, unknown> = { id: place.id };
+			if (skip) {
+				body.skip = true;
+			} else {
+				body.lat = guess!.lat;
+				body.lon = guess!.lon;
+				body.hintsUsed = indicesMontres.length;
+				if (timerActif && timerRef) body.timeMs = timerRef.tempsMs();
+			}
+			const res = await fetch('/api/guess', {
+				method: 'POST',
+				headers: { 'Content-Type': 'application/json' },
+				body: JSON.stringify(body)
+			});
+			if (!res.ok) throw new Error(String(res.status));
+			result = (await res.json()) as GuessResult;
+			joues = [...joues, place.id];
+			if (estDefi) {
+				defi.ajouter({ place, guess: skip ? null : guess, result });
+			}
+		} catch {
+			erreur = true;
+		} finally {
+			enCours = false;
+		}
+	}
+
+	function montrerIndice(): void {
+		if (!place) return;
+		const prochain = place.indices.find((i) => !indicesMontres.includes(i.texte));
+		if (prochain) indicesMontres = [...indicesMontres, prochain.texte];
+	}
+
+	function suivant(): void {
+		void chargerRound();
+	}
+
+	function montrerBilan(): void {
+		bilan = true;
+	}
+
+	function rejouerDefi(): void {
+		defi.reinitialiser();
+		joues = [];
+		bilan = false;
+		void chargerRound();
+	}
+
+	/** Génère une image canvas téléchargeable : score total + régions jouées. */
+	function partager(): void {
+		const canvas = document.createElement('canvas');
+		canvas.width = 1080;
+		canvas.height = 1080;
+		const ctx = canvas.getContext('2d');
+		if (!ctx) return;
+
+		// Fond sable + bandeau vert profond
+		ctx.fillStyle = '#f5efe2';
+		ctx.fillRect(0, 0, 1080, 1080);
+		ctx.fillStyle = '#0b3d2e';
+		ctx.fillRect(0, 0, 1080, 240);
+
+		ctx.fillStyle = '#fffdf8';
+		ctx.textAlign = 'center';
+		ctx.font = '800 96px system-ui, sans-serif';
+		ctx.fillText('JWE', 540, 130);
+		ctx.font = '600 44px system-ui, sans-serif';
+		ctx.fillText(t().modes.defi, 540, 200);
+
+		// Score total
+		ctx.fillStyle = '#0b3d2e';
+		ctx.font = '800 150px system-ui, sans-serif';
+		ctx.fillText(`${defi.total}`, 540, 420);
+		ctx.fillStyle = '#5a6b62';
+		ctx.font = '500 40px system-ui, sans-serif';
+		ctx.fillText(t().defi.scoreTotal, 540, 480);
+
+		// Manches : lieu, région, score
+		let y = 580;
+		for (const [i, m] of defi.manches.entries()) {
+			ctx.fillStyle = i % 2 === 0 ? '#e3efe7' : '#f5efe2';
+			ctx.fillRect(90, y - 44, 900, 74);
+			ctx.fillStyle = '#22302a';
+			ctx.textAlign = 'left';
+			ctx.font = '600 34px system-ui, sans-serif';
+			ctx.fillText(`${i + 1}. ${m.result.nom}`, 120, y);
+			ctx.fillStyle = '#17624a';
+			ctx.font = '500 30px system-ui, sans-serif';
+			ctx.fillText(t().regions[m.result.region], 120, y + 34);
+			ctx.textAlign = 'right';
+			ctx.fillStyle = '#0b3d2e';
+			ctx.font = '800 40px system-ui, sans-serif';
+			ctx.fillText(`${m.result.score}`, 960, y + 8);
+			y += 92;
+		}
+
+		ctx.fillStyle = '#5a6b62';
+		ctx.textAlign = 'center';
+		ctx.font = '500 30px system-ui, sans-serif';
+		ctx.fillText('labola.o-k-i.net', 540, 1010);
+
+		const a = document.createElement('a');
+		a.href = canvas.toDataURL('image/png');
+		a.download = 'jwe-defi.png';
+		a.click();
+	}
+
+	onMount(() => {
+		// Nouveau défi : on repart de zéro quand on arrive sur la première manche.
+		if (estDefi && defi.termine) defi.reinitialiser();
+		void chargerRound();
+	});
+</script>
+
+<svelte:head>
+	<title>{t().app.titre} — {t().modes[mode]}</title>
+</svelte:head>
+
+<div class="jeu">
+	{#if bilan}
+		<div class="bilan">
+			<h1>{t().defi.bilan}</h1>
+			<p class="total">
+				<span class="valeur">{defi.total}</span>
+				<span class="unite">{t().defi.scoreTotal}</span>
+			</p>
+			<div class="bilan-carte">
+				<GameMap interactive={false} pairs={paires} />
+			</div>
+			<ol class="recap">
+				{#each defi.manches as m, i (m.place.id)}
+					<li>
+						<span class="r-nom">{i + 1}. {m.result.nom}</span>
+						<span class="r-region">{t().regions[m.result.region]}</span>
+						<span class="r-score">{m.result.score} {t().resultat.points}</span>
+					</li>
+				{/each}
+			</ol>
+			<div class="bilan-actions">
+				<button type="button" class="btn btn-primaire" onclick={partager}>
+					{t().defi.partager}
+				</button>
+				<button type="button" class="btn btn-secondaire" onclick={rejouerDefi}>
+					{t().resultat.rejouer}
+				</button>
+				<a href="/" class="btn btn-tertiaire">{t().resultat.retourAccueil}</a>
+			</div>
+			<p class="legende">
+				<span class="puce joueur" aria-hidden="true">●</span> {t().defi.taPosition} —
+				<span class="puce reelle" aria-hidden="true">●</span> {t().defi.positionReelle}
+			</p>
+		</div>
+	{:else if chargement}
+		<div class="etat"><p>{t().jeu.charger}</p></div>
+	{:else if erreur}
+		<div class="etat">
+			<p>{t().jeu.erreur}</p>
+			<button type="button" class="btn btn-secondaire" onclick={() => void chargerRound()}>
+				{t().jeu.reessayer}
+			</button>
+		</div>
+	{:else if place}
+		<div class="split" class:resultat={!!result}>
+			<section class="panneau-photo">
+				{#if result}
+					<div class="resultat-scroll">
+						<ResultPanel
+							{result}
+							creditPhoto={place.photo.credit}
+							labelBouton={estDefi && defiTermine ? t().resultat.voirBilan : t().resultat.suivant}
+							onsuivant={estDefi && defiTermine ? montrerBilan : suivant}
+						/>
+					</div>
+				{:else}
+					<PhotoPanel photo={place.photo} />
+				{/if}
+			</section>
+
+			<section class="panneau-carte">
+				<GameMap
+					bind:guess
+					real={result ? result.coordonnees : null}
+					interactive={!result}
+					onvalidate={() => void soumettre(false)}
+				/>
+				{#if estDefi && !defiTermine}
+					<span class="badge-manche">{t().jeu.round} {Math.min(mancheCourante, 5)} {t().jeu.sur} 5</span>
+				{/if}
+				{#if timerActif && !result}
+					<div class="badge-timer">
+						<TimerRing bind:this={timerRef} actif={!result} />
+					</div>
+				{/if}
+			</section>
+		</div>
+
+		{#if !result}
+			<div class="barre-actions">
+				<div class="actions-secondaires">
+					<button
+						type="button"
+						class="btn btn-tertiaire"
+						onclick={montrerIndice}
+						disabled={indicesMontres.length >= place.indices.length}
+					>
+						{t().jeu.indice}
+						<span class="penalite">{t().jeu.indicePenalite}</span>
+					</button>
+					<button type="button" class="btn btn-secondaire" onclick={() => void soumettre(true)}>
+						{t().jeu.passer}
+					</button>
+				</div>
+				<button
+					type="button"
+					class="btn btn-primaire valider"
+					disabled={!guess || enCours}
+					onclick={() => void soumettre(false)}
+				>
+					{t().jeu.valider}
+				</button>
+			</div>
+			{#if indicesMontres.length > 0}
+				<aside class="indices" aria-live="polite">
+					{#each indicesMontres as texte, i (texte)}
+						<p class="indice"><strong>{t().jeu.indice} {i + 1}</strong> — {texte}</p>
+					{/each}
+				</aside>
+			{/if}
+			{#if !guess}
+				<p class="aide-carte">{t().jeu.poserMarqueur}</p>
+			{/if}
+		{/if}
+	{/if}
+</div>
+
+<style>
+	.jeu {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		min-height: 0;
+	}
+
+	.etat {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		gap: 1rem;
+		color: var(--oki-encre-doux);
+	}
+
+	.split {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		gap: 0.6rem;
+		padding: 0.6rem;
+		min-height: 0;
+	}
+
+	/* Mobile : photo 60 % haut, carte 40 % bas */
+	.panneau-photo {
+		flex: 0 0 58%;
+		min-height: 0;
+	}
+
+	.split.resultat .panneau-photo {
+		flex: 1 1 55%;
+		overflow-y: auto;
+	}
+
+	.panneau-carte {
+		position: relative;
+		flex: 1;
+		min-height: 220px;
+	}
+
+	.resultat-scroll {
+		height: 100%;
+		overflow-y: auto;
+		background: var(--oki-blanc);
+		border-radius: var(--oki-radius);
+		box-shadow: var(--oki-ombre);
+		padding: 1rem;
+	}
+
+	.badge-manche {
+		position: absolute;
+		top: 0.6rem;
+		right: 0.6rem;
+		background: rgba(255, 253, 248, 0.94);
+		color: var(--oki-vert);
+		border-radius: 999px;
+		padding: 0.25rem 0.8rem;
+		font-size: 0.82rem;
+		font-weight: 700;
+		box-shadow: var(--oki-ombre);
+	}
+
+	.badge-timer {
+		position: absolute;
+		top: 0.6rem;
+		left: 3.4rem; /* à droite des boutons zoom */
+	}
+
+	/* Barre d'actions : fixe en zone du pouce (tiers inférieur) */
+	.barre-actions {
+		position: sticky;
+		bottom: 0;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		gap: 0.6rem;
+		padding: 0.7rem 0.8rem calc(0.7rem + env(safe-area-inset-bottom));
+		background: var(--oki-blanc);
+		border-top: 1px solid var(--oki-sable-fonce);
+	}
+
+	.actions-secondaires {
+		display: flex;
+		gap: 0.5rem;
+	}
+
+	.actions-secondaires .btn {
+		padding: 0.7rem 1rem;
+		font-size: 0.92rem;
+	}
+
+	.penalite {
+		font-size: 0.75rem;
+		font-weight: 500;
+		opacity: 0.8;
+	}
+
+	.valider {
+		flex: 0 0 auto;
+		padding: 0.9rem 1.4rem;
+	}
+
+	.indices {
+		padding: 0 1rem 0.5rem;
+	}
+
+	.indice {
+		margin: 0.25rem 0;
+		background: var(--oki-bleu-doux);
+		border-left: 4px solid var(--oki-bleu);
+		border-radius: var(--oki-radius-petit);
+		padding: 0.5rem 0.8rem;
+		font-size: 0.95rem;
+	}
+
+	.aide-carte {
+		margin: 0;
+		padding: 0 1rem 0.6rem;
+		text-align: center;
+		font-size: 0.88rem;
+		color: var(--oki-encre-doux);
+	}
+
+	/* Desktop : 50/50 */
+	@media (min-width: 768px) {
+		.split {
+			flex-direction: row;
+		}
+
+		.panneau-photo,
+		.split.resultat .panneau-photo {
+			flex: 1 1 50%;
+		}
+
+		.panneau-carte {
+			flex: 1 1 50%;
+		}
+
+		.barre-actions {
+			justify-content: center;
+			gap: 1.5rem;
+		}
+	}
+
+	/* — Écran bilan du défi — */
+	.bilan {
+		flex: 1;
+		width: 100%;
+		max-width: 860px;
+		margin: 0 auto;
+		padding: 1.2rem 1rem 2rem;
+		display: flex;
+		flex-direction: column;
+		gap: 1rem;
+	}
+
+	.bilan h1 {
+		margin: 0;
+		text-align: center;
+		color: var(--oki-vert);
+	}
+
+	.total {
+		margin: 0;
+		text-align: center;
+	}
+
+	.total .valeur {
+		font-size: 2.8rem;
+		font-weight: 800;
+		color: var(--oki-vert);
+	}
+
+	.total .unite {
+		margin-left: 0.4rem;
+		color: var(--oki-encre-doux);
+	}
+
+	.bilan-carte {
+		height: min(46vh, 420px);
+	}
+
+	.recap {
+		list-style: none;
+		margin: 0;
+		padding: 0;
+		display: flex;
+		flex-direction: column;
+		gap: 0.4rem;
+	}
+
+	.recap li {
+		display: flex;
+		align-items: baseline;
+		gap: 0.6rem;
+		background: var(--oki-blanc);
+		border-radius: var(--oki-radius-petit);
+		box-shadow: var(--oki-ombre);
+		padding: 0.55rem 0.9rem;
+	}
+
+	.r-nom {
+		font-weight: 700;
+		color: var(--oki-vert);
+	}
+
+	.r-region {
+		flex: 1;
+		color: var(--oki-encre-doux);
+		font-size: 0.9rem;
+	}
+
+	.r-score {
+		font-weight: 800;
+	}
+
+	.bilan-actions {
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: center;
+		gap: 0.7rem;
+	}
+
+	.legende {
+		margin: 0;
+		text-align: center;
+		font-size: 0.85rem;
+		color: var(--oki-encre-doux);
+	}
+
+	.puce.joueur {
+		color: var(--oki-corail);
+	}
+
+	.puce.reelle {
+		color: var(--oki-vert);
+	}
+</style>
@@ -0,0 +1,12 @@
+import { error } from '@sveltejs/kit';
+import type { GameMode } from '$lib/types';
+import type { PageLoad } from './$types';
+
+const MODES: GameMode[] = ['monument', 'lieu', 'defi'];
+
+export const load: PageLoad = ({ params }) => {
+	if (!MODES.includes(params.mode as GameMode)) {
+		error(404, 'Mode inconnu');
+	}
+	return { mode: params.mode as GameMode };
+};
@@ -0,0 +1,64 @@
+/// <reference types="@sveltejs/kit" />
+/// <reference no-default-lib="true"/>
+/// <reference lib="esnext" />
+/// <reference lib="webworker" />
+
+import { build, files, version } from '$service-worker';
+
+const sw = self as unknown as ServiceWorkerGlobalScope;
+
+const APP_SHELL = `jwe-shell-${version}`; // immuable, recréé à chaque build
+const PHOTOS = 'jwe-photos'; // stale-while-revalidate
+
+const ASSETS = [...build, ...files];
+
+sw.addEventListener('install', (event) => {
+	event.waitUntil(caches.open(APP_SHELL).then((cache) => cache.addAll(ASSETS)));
+});
+
+sw.addEventListener('activate', (event) => {
+	event.waitUntil(
+		caches.keys().then((keys) =>
+			Promise.all(
+				keys
+					.filter((key) => key !== APP_SHELL && key !== PHOTOS)
+					.map((key) => caches.delete(key))
+			)
+		)
+	);
+});
+
+function isPhoto(url: URL): boolean {
+	return (
+		url.hostname === 'upload.wikimedia.org' ||
+		(url.hostname === 'commons.wikimedia.org' && url.pathname.startsWith('/wiki/Special:FilePath'))
+	);
+}
+
+sw.addEventListener('fetch', (event) => {
+	const url = new URL(event.request.url);
+	if (event.request.method !== 'GET') return;
+
+	// App shell : cache d'abord
+	if (ASSETS.includes(url.pathname)) {
+		event.respondWith(caches.match(event.request).then((r) => r ?? fetch(event.request)));
+		return;
+	}
+
+	// Photos Wikimedia : stale-while-revalidate
+	if (isPhoto(url)) {
+		event.respondWith(
+			caches.open(PHOTOS).then(async (cache) => {
+				const cached = await cache.match(event.request);
+				const frais = fetch(event.request)
+					.then((res) => {
+						if (res.ok) void cache.put(event.request, res.clone());
+						return res;
+					})
+					.catch(() => cached as Response);
+				return cached ?? frais;
+			})
+		);
+		return;
+	}
+});
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+	<rect width="512" height="512" fill="#0b3d2e"/>
+	<circle cx="256" cy="256" r="130" fill="none" stroke="#f5efe2" stroke-width="22"/>
+	<path d="M256 148 L312 330 L256 292 L200 330 Z" fill="#e4572e"/>
+</svg>
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+	<rect width="512" height="512" rx="96" fill="#0b3d2e"/>
+	<circle cx="256" cy="256" r="150" fill="none" stroke="#f5efe2" stroke-width="26"/>
+	<path d="M256 130 L322 344 L256 300 L190 344 Z" fill="#e4572e"/>
+</svg>
@@ -0,0 +1,25 @@
+{
+	"name": "JWE — Jeu de géolocalisation OKI",
+	"short_name": "JWE",
+	"description": "Devine la commune à partir d'une photo — Guadeloupe, Martinique, Guyane, La Réunion.",
+	"start_url": "/",
+	"scope": "/",
+	"display": "standalone",
+	"background_color": "#f5efe2",
+	"theme_color": "#0b3d2e",
+	"lang": "fr",
+	"icons": [
+		{
+			"src": "/icon.svg",
+			"sizes": "any",
+			"type": "image/svg+xml",
+			"purpose": "any"
+		},
+		{
+			"src": "/icon-maskable.svg",
+			"sizes": "any",
+			"type": "image/svg+xml",
+			"purpose": "maskable"
+		}
+	]
+}
@@ -0,0 +1,12 @@
+import adapter from '@sveltejs/adapter-node';
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	preprocess: vitePreprocess(),
+	kit: {
+		adapter: adapter()
+	}
+};
+
+export default config;
@@ -0,0 +1,14 @@
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"allowJs": true,
+		"checkJs": true,
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true,
+		"moduleResolution": "bundler"
+	}
+}
@@ -0,0 +1,6 @@
+import { sveltekit } from '@sveltejs/kit/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+	plugins: [sveltekit()]
+});
@@ -0,0 +1,55 @@
+# Crédits photos — JWE
+
+Les 40 photos du corpus `app/src/lib/server/data/lieux.json` proviennent de Wikimedia Commons.
+Chaque fichier est sous licence libre (Creative Commons, CC0 ou domaine public) — vérifiée via l'API Commons
+(`LicenseShortName`) et l'URL `Special:FilePath` testée en HTTP 200.
+
+| # | Lieu | Région | Fichier Commons | Auteur | Licence | Page de description |
+|---|------|--------|-----------------|--------|---------|---------------------|
+| 1 | Fort Delgrès | GUADELOUPE | Entrée du Fort Delgrès.JPG | LPLT | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Entr%C3%A9e_du_Fort_Delgr%C3%A8s.JPG |
+| 2 | Mémorial ACTe | GUADELOUPE | Photographie de haut du mémorial acte.jpg | Bjrmoicorla | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Photographie_de_haut_du_m%C3%A9morial_acte.jpg |
+| 3 | Fort Napoléon des Saintes | GUADELOUPE | Fort Napoléon dans l'archipel des Saintes.jpg | Gauthier Geoffroy | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Fort_Napol%C3%A9on_dans_l'archipel_des_Saintes.jpg |
+| 4 | Cathédrale Notre-Dame-de-Guadeloupe | GUADELOUPE | Cathédrale Notre-Dame-de-Guadeloupe - Sept. 2013 (1).JPG | Aristoi | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Cath%C3%A9drale_Notre-Dame-de-Guadeloupe_-_Sept._2013_(1).JPG |
+| 5 | Habitation La Grivelière | GUADELOUPE | Habitation La Grivelière 2.JPG | LPLT | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Habitation_La_Griveli%C3%A8re_2.JPG |
+| 6 | Soufrière | GUADELOUPE | Guadeloupe 114 - Sommet de la Soufrière 1467m - Guadeloupe.jpg | Ofol | CC-BY-2.5 | https://commons.wikimedia.org/wiki/File:Guadeloupe_114_-_Sommet_de_la_Soufri%C3%A8re_1467m_-_Guadeloupe.jpg |
+| 7 | Pointe des Châteaux | GUADELOUPE | Pointedeschateaux.jpg | bobyfume | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Pointedeschateaux.jpg |
+| 8 | Jardin botanique de Deshaies | GUADELOUPE | Jardin Botanique - étang aux nénuphars.JPG | Grook Da Oger | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Jardin_Botanique_-_%C3%A9tang_aux_n%C3%A9nuphars.JPG |
+| 9 | Plage de Bois Jolan | GUADELOUPE | Plage de St Anne (bois jolan).jpg | Filo gèn' | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Plage_de_St_Anne_(bois_jolan).jpg |
+| 10 | Marché de la Darse | GUADELOUPE | Marché de la Darse (épices).jpg | Filo gèn' | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:March%C3%A9_de_la_Darse_(%C3%A9pices).jpg |
+| 11 | Fort Saint-Louis | MARTINIQUE | Fort Saint-Louis vu du Carénage 02.jpg | UHF | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Fort_Saint-Louis_vu_du_Car%C3%A9nage_02.jpg |
+| 12 | Bibliothèque Schœlcher | MARTINIQUE | Fort-de-France - 2014 - Bibliothèque Schœlcher (1).jpg | Aristoi | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Fort-de-France_-_2014_-_Biblioth%C3%A8que_Sch%C5%93lcher_(1).jpg |
+| 13 | Cathédrale Saint-Louis de Fort-de-France | MARTINIQUE | Cathédrale Saint Louis.jpg | Pierre PONCHEL | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Cath%C3%A9drale_Saint_Louis.jpg |
+| 14 | Habitation Clément | MARTINIQUE | Habitation Clément 001.jpg | Tux-Man | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Habitation_Cl%C3%A9ment_001.jpg |
+| 15 | Église du Sacré-Cœur de Balata | MARTINIQUE | Sacré-coeur-balata-FdF.JPG | Jean-Louis Lascoux | CC-BY-3.0 | https://commons.wikimedia.org/wiki/File:Sacr%C3%A9-coeur-balata-FdF.JPG |
+| 16 | Montagne Pelée | MARTINIQUE | La Pelée vue du Carbet.jpg | Jurassi | Domaine public | https://commons.wikimedia.org/wiki/File:La_Pel%C3%A9e_vue_du_Carbet.jpg |
+| 17 | Presqu'île de la Caravelle | MARTINIQUE | Anse non nommée à la pointe de la presqu'île de la Caravelle.jpg | Enrevseluj | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Anse_non_nomm%C3%A9e_%C3%A0_la_pointe_de_la_presqu'%C3%AEle_de_la_Caravelle.jpg |
+| 18 | Anse-Dufour | MARTINIQUE | Anse Dufour (Les Anses-d'Arlet, Martinique) - 01.jpg | Thérèse Gaigé | CC0-1.0 | https://commons.wikimedia.org/wiki/File:Anse_Dufour_(Les_Anses-d'Arlet%2C_Martinique)_-_01.jpg |
+| 19 | Anse Noire | MARTINIQUE | Anse Noire (Les Anses-d'Arlet, Martinique) - 01.jpg | Thérèse Gaigé | CC0-1.0 | https://commons.wikimedia.org/wiki/File:Anse_Noire_(Les_Anses-d'Arlet%2C_Martinique)_-_01.jpg |
+| 20 | Savane des Pétrifications | MARTINIQUE | Martinique savane des pétrifications 1.jpg | Esam335 | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Martinique_savane_des_p%C3%A9trifications_1.jpg |
+| 21 | Centre spatial guyanais | GUYANE | Ariane 5ECA on its launch platform on its way to lauch pad ELA-3.jpg | elisabetta_monaco | CC-BY-2.0 | https://commons.wikimedia.org/wiki/File:Ariane_5ECA_on_its_launch_platform_on_its_way_to_lauch_pad_ELA-3.jpg |
+| 22 | Îles du Salut | GUYANE | ILES et BAGNE 037.JPG | davric | Domaine public | https://commons.wikimedia.org/wiki/File:ILES_et_BAGNE_037.JPG |
+| 23 | Cathédrale Saint-Sauveur de Cayenne | GUYANE | Cathédrale Saint-Sauveur de Cayenne.jpg | Don-vip | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Cath%C3%A9drale_Saint-Sauveur_de_Cayenne.jpg |
+| 24 | Fort Cépérou | GUYANE | Cayenne Fort Cépérou 2013.jpg | Cayambe | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Cayenne_Fort_C%C3%A9p%C3%A9rou_2013.jpg |
+| 25 | Camp de la Transportation (bagne) | GUYANE | Camp de la Transportation-13.jpg | Psu973 | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Camp_de_la_Transportation-13.jpg |
+| 26 | Marais de Kaw-Roura | GUYANE | Marais de Kaw - Guyane 1.jpg | Jacques MARTIN 97311 | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Marais_de_Kaw_-_Guyane_1.jpg |
+| 27 | Place des Palmistes | GUYANE | Cayenne Place des palmistes.jpg | Cayambe | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Cayenne_Place_des_palmistes.jpg |
+| 28 | Crique Cacao | GUYANE | Crique Cacao.jpg | Aandrem | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Crique_Cacao.jpg |
+| 29 | Plage de Montjoly | GUYANE | Plages de Rémire-Montjoly - Guyane.JPG | Lebrouillard | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Plages_de_R%C3%A9mire-Montjoly_-_Guyane.JPG |
+| 30 | Îlet la Mère | GUYANE | Ilet la Mère débarcadère 2013.jpg | Cayambe | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:Ilet_la_M%C3%A8re_d%C3%A9barcad%C3%A8re_2013.jpg |
+| 31 | Église Notre-Dame des Laves | REUNION | Église Notre-Dame-des-Laves @ Piton Sainte-Rose 05.jpg | Rémih | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:%C3%89glise_Notre-Dame-des-Laves_%40_Piton_Sainte-Rose_05.jpg |
+| 32 | Cimetière marin de Saint-Paul | REUNION | Marine Cemetery of Saint-Paul (Réunion Island).jpg | dalbera | CC-BY-2.0 | https://commons.wikimedia.org/wiki/File:Marine_Cemetery_of_Saint-Paul_(R%C3%A9union_Island).jpg |
+| 33 | Villa Folio | REUNION | Maison Folio.jpg | Nanère | CC-BY-2.5 | https://commons.wikimedia.org/wiki/File:Maison_Folio.jpg |
+| 34 | Domaine du Grand Hazier | REUNION | GrandHazierEntree.jpg | David Rofas | CC-BY-3.0 | https://commons.wikimedia.org/wiki/File:GrandHazierEntree.jpg |
+| 35 | Temple du Colosse | REUNION | Temple-du-Colosse.JPG | Thierry Caro | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Temple-du-Colosse.JPG |
+| 36 | Piton de la Fournaise | REUNION | Piton de La Fournaise - Paysage de l'île de La Réunion.jpg | Alexandre Péribé | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Piton_de_La_Fournaise_-_Paysage_de_l'%C3%AEle_de_La_R%C3%A9union.jpg |
+| 37 | Piton des Neiges | REUNION | Piton des Neiges1.JPG | Dunog | Domaine public | https://commons.wikimedia.org/wiki/File:Piton_des_Neiges1.JPG |
+| 38 | Cirque de Mafate | REUNION | 14-07-2011 Grand Bénare (26) Mafate (version améliorée).jpg | Mamphi | CC-BY-SA-3.0 | https://commons.wikimedia.org/wiki/File:14-07-2011_Grand_B%C3%A9nare_(26)_Mafate_(version_am%C3%A9lior%C3%A9e).jpg |
+| 39 | Marché forain de Saint-Paul | REUNION | Combava en vente sur le marché forain de Saint Paul (La Réunion).jpg | Marie-angele.joly | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:Combava_en_vente_sur_le_march%C3%A9_forain_de_Saint_Paul_(La_R%C3%A9union).jpg |
+| 40 | Plage de Ti Sable | REUNION | La plage de Ti Sable à Saint-Joseph.jpg | Clémenceau Lauret | CC-BY-SA-4.0 | https://commons.wikimedia.org/wiki/File:La_plage_de_Ti_Sable_%C3%A0_Saint-Joseph.jpg |
+
+## Notes
+
+- Les URLs utilisées dans `lieux.json` sont de la forme `https://commons.wikimedia.org/wiki/Special:FilePath/<FICHIER>?width=1200`
+  (redimensionnement à 1200 px de large assuré par Wikimedia).
+- Photos « domaine public » : *La Pelée vue du Carbet.jpg* (Jurassi), *ILES et BAGNE 037.JPG* (davric), *Piton des Neiges1.JPG* (Dunog).
+- Photos CC0 (pas d'attribution requise, auteur crédité par courtoisie) : les deux clichés de Thérèse Gaigé (Anse Dufour, Anse Noire).
@@ -0,0 +1,94 @@
+# JWE v2 — Décisions d'architecture (Agent Architecte)
+
+Date : 2026-07-16 · Mission : refonte GeoGuessr souverain (voir `projet_geoguessr_97x.md`)
+
+## 1. Décision back-end : SvelteKit seul (pas de Strapi)
+
+**Décision : SvelteKit seul, avec les lieux dans un fichier JSON versionné dans Git.**
+
+Arguments :
+
+- **Frugalité OKI** : un seul processus Node à héberger, pas de CMS + admin + DB à maintenir, pas de surface d'attaque supplémentaire. SQLite serait de toute façon peu utile pour un corpus de ~40 lieux statiques.
+- **Critère du prompt** (« qui ajoute les lieux ? ») : le corpus est éditorial, produit par l'Agent Contenu et relu. Le workflow Git (pull request = relecture + crédits photos vérifiés) est la modération. Le `docs/contribution.md` documente l'ajout d'un lieu par PR.
+- **Livrables finaux** : le guide de déploiement demandé est « SvelteKit + Tile Server » — Strapi n'y figure pas.
+- **Anti-triche** : le JSON reste côté serveur (`src/lib/server/`), jamais importé par le client ; les endpoints filtrent les champs. Impossible de faire plus simple.
+
+Si un jour des contributeurs non-dev doivent saisir des lieux en masse, la porte vers Strapi reste ouverte (le schéma JSON est le content-type tout désigné), mais ce n'est pas le besoin actuel.
+
+## 2. Architecture des tiles MapLibre
+
+- **Rendu** : MapLibre GL JS (verrouillé), chargé en lazy (import dynamique uniquement sur les écrans de jeu / exploration).
+- **Dev / démo** : tiles vectorielles [OpenFreeMap](https://openfreemap.org) — libres, basées OpenStreetMap, sans clé API. Style **custom OKI** (JSON de style propre, dérivé du style Positron, re-teinté : mer bleu profond caraïbe, terre sable, végétation verte dense, labels sobres — pas le « bleu Google »).
+- **Prod auto-hébergée** : `tileserver-gl` + extraits `.mbtiles` OpenStreetMap des 4 régions (Guadeloupe, Martinique, Guyane, La Réunion — quelques dizaines de Mo au total). Procédure dans `docs/deploiement.md`. Le style OKI accepte l'URL des tiles par variable d'environnement (`PUBLIC_TILES_URL`), bascule sans changement de code.
+- **Contrainte géographique** : `maxBounds` = enveloppe union des 4 régions (≈ lon −63…57, lat −23…18) + `minZoom`, donc impossible de scroller en Europe/Amérique du Nord. 4 boutons « saut de région » (GUADELOUPE / MARTINIQUE / GUYANE / RÉUNION) replacent la vue sur la région. Limite connue : l'enveloppe rectangulaire inclut l'Atlantique tropical et le Brésil — inoffensif (aucun indice sur le lieu), documenté.
+- Attribution © OpenStreetMap contributors affichée.
+
+## 3. Stratégie Wikipedia / Wikidata
+
+Principe : **rien de stocké en base**, interroge l'API en temps réel avec cache court, côté serveur uniquement.
+
+Endpoint serveur : `GET /api/wiki/[qid]` (ex. `Q3077840` = Fort Delgrès — l'exemple `Q2216838` du prompt initial était erroné, corrigé par l'Agent Contenu)
+
+1. `wbgetentities` sur `www.wikidata.org` → récupère le `sitelink` frwiki (et le libellé fr en fallback).
+2. `GET https://fr.wikipedia.org/api/rest_v1/page/summary/{titre}` → `title`, `extract`, `content_urls`, `thumbnail`.
+3. Réponse normalisée : `{ qid, title, extract, url, thumbnail, description }`.
+4. Pas de sitelink fr ou erreur → `404` : le front bascule sur l'écran **Cas B « Pwen blindé »**.
+5. **Cache** : `Map` en mémoire, TTL 24 h (+ `Cache-Control: max-age=3600`). User-Agent explicite (`JWE-OKI/x.y (contact)`) comme demandé par la politique Wikimédia.
+
+## 4. Arborescence du projet
+
+```
+JWE/                          (dépôt existant — l'ancien PHP est conservé tel quel)
+├── app/                      ← nouvelle application SvelteKit 2 / Svelte 5
+│   ├── src/
+│   │   ├── lib/
+│   │   │   ├── server/
+│   │   │   │   ├── lieux.ts        (accès données + sélection aléatoire + scoring)
+│   │   │   │   └── data/lieux.json (corpus 40 lieux — serveur uniquement)
+│   │   │   ├── components/         (GameMap, PhotoPanel, ResultPanel, ScoreCard…)
+│   │   │   ├── i18n/               (fr.ts, gcf.ts, store)
+│   │   │   ├── styles/oki.css      (tokens couleurs OKI)
+│   │   │   └── utils/              (score.ts, geo.ts)
+│   │   ├── routes/
+│   │   │   ├── +layout.svelte      (header, switch langue FR/CR)
+│   │   │   ├── +page.svelte        (accueil : 4 régions, modes, Jouer)
+│   │   │   ├── jeu/[mode]/         (écran de jeu split photo/carte)
+│   │   │   ├── explorer/           (mode Aprann : carte pleine page)
+│   │   │   └── api/
+│   │   │       ├── round/+server.ts      (GET : lieu aléatoire SANITISÉ)
+│   │   │       ├── guess/+server.ts      (POST : {placeId, lat, lon, hints, timeMs} → score + vérité)
+│   │   │       ├── lieux/+server.ts      (GET : catalogue sanitise pour Explorer)
+│   │   │       └── wiki/[qid]/+server.ts (GET : extrait Wikipedia, cache 24 h)
+│   │   ├── app.html / app.d.ts
+│   │   └── service-worker.ts       (PWA)
+│   ├── static/                     (manifest.webmanifest, icônes, photos éventuelles)
+│   └── package.json / svelte.config.js / vite.config.ts
+├── docs/                         (architecture, déploiement, contribution, audit)
+├── content/                      (sources de travail de l'Agent Contenu : crédits photos)
+└── projet_geoguessr_97x.md
+```
+
+## 5. Spécifications API REST (anti-triche)
+
+| Endpoint | Méthode | Payload | Réponse |
+|---|---|---|---|
+| `/api/round?region=&mode=&exclude=` | GET | — | `{ id, nom, nom_creole, categorie, difficulte, photo{url,credit,alt}, indices[] }` — **jamais** `coordonnees`, `commune`, `region`, `wikidata_id` |
+| `/api/guess` | POST | `{ id, lat, lon, hintsUsed, timeMs? }` | `{ distanceKm, score, coordonnees, commune, region, nom, wikidata_id }` |
+| `/api/lieux` | GET | — | Catalogue sanitise (sans coordonnées précises : coords arrondies à 0.05° pour l'affichage Explorer uniquement — mode sans score) |
+| `/api/wiki/[qid]` | GET | — | `{ title, extract, url, thumbnail }` ou `404` |
+
+Règles :
+
+- Le scoring est **recalculé côté serveur** : `score = round(5000 × e^(−d/r))`, `r` selon difficulté du lieu (50/15/5/1 km), pénalité −10 %/indice, bonus temps ≤ +20 % plafonné à 5000.
+- Distance : haversine.
+- Le client ne reçoit la vérité (coordonnées, commune, wikidata_id) **qu'après** la soumission du marqueur.
+- `exclude` : liste d'ids déjà joués (mode Défi 5 rounds, stateless — pas de session serveur nécessaire, pas de leaderboard).
+
+## 6. Décisions annexes
+
+- **Adapter** : `adapter-node` (auto-hébergement sobre derrière nginx/caddy).
+- **PWA** : manifest + service worker minimal (cache app shell, photos en stale-while-revalidate).
+- **i18n** : dictionnaires maison `fr` / `gcf` (créole), store Svelte, `lang` persistée en localStorage.
+- **Photos** : URLs Wikimedia Commons (Special:FilePath, `?width=1200`) vérifiées CC par l'Agent Contenu ; `<img loading="lazy">` + `srcset`.
+- **A11y / calm tech** : `prefers-reduced-motion` respecté (pas de vol de marqueur), timer informatif non anxiogène, navigation clavier (carte : flèches déplacent le marqueur, Entrée valide).
+- **Licence code** : MIT (le dépôt historique était AGPL — la refonte est un nouveau module `app/` sous MIT comme exigé par le prompt ; le `LICENSE` racine reste l'historique, un `app/LICENSE` MIT est ajouté).
@@ -0,0 +1,176 @@
+# Audit OKI — JWE v2 (Agent Intégration & QA)
+
+Date : 2026-07-17 · Périmètre : `app/` (SvelteKit 2 + Svelte 5 + MapLibre GL 5)
+Méthode : tests **réellement exécutés** sur le build de production (`node build`, PORT=4173) + revue de code. Chaque point est accompagné de sa preuve (commande, extrait).
+
+Légende : ✅ conforme · ⚠️ conforme avec réserve / point d'amélioration · ❌ non conforme
+
+---
+
+## 1. Build et vérifications statiques
+
+| Test | Résultat | Preuve |
+|---|---|---|
+| `npm run check` | ✅ | `svelte-check found 0 errors and 0 warnings` |
+| `npm run build` | ✅ | `✓ built in 5.05s` + `adapter-node ✔ done` |
+
+### Isolation de MapLibre (bundle initial)
+
+- Le chunk MapLibre `xnoNZPIh.js` (**1031 KB brut / 277,8 KB gzip**) n'est chargé que par `import("./xnoNZPIh.js")` **dynamique** depuis le chunk de `GameMap` — vérifié par `grep` dans `build/client/_app/immutable/`.
+- Le HTML SSR de `/` (5,6 KB) ne contient **0 occurrence** de « maplibre » et ne bootstrap que `entry/app.js` + `entry/start.js`.
+- Le CSS MapLibre (`maplibre-gl.*.css`, 68,3 KB / 9,8 KB gz) est un asset séparé, chargé par le même import dynamique (`GameMap.svelte:279`).
+
+**✅ Le bundle initial ne contient pas MapLibre.**
+
+---
+
+## 2. API — tests fonctionnels (serveur `node build`, PORT=4173)
+
+### 2.1 Anti-triche `/api/round` ✅
+
+15 tirages variés (sans filtre, `region`, `region+categorie`, `categorie`, `region+categorie+exclude` avec 2 ids exclus) :
+
+```
+15/15 tirages : AUCUNE fuite (clés coordonnees/commune/region/wikidata_id absentes)
+```
+
+Payload conforme à `docs/architecture.md` §5 : `{ id, nom, nom_creole, categorie, difficulte, photo{url,credit,alt}, indices[] }`. `Cache-Control: no-store` présent. Les filtres sont respectés (ex. `region=REUNION&categorie=LIEU` → Piton de la Fournaise).
+
+*Note : le `nom` du lieu est dans le payload — c'est le choix de la spec (§5), pas une fuite : le jeu nomme le monument à reconnaître.*
+
+### 2.2 Partie complète + cohérence du score ✅
+
+Scénario réel : `GET /api/round?region=GUADELOUPE` → Jardin botanique de Deshaies (DIFFICILE, r=5 km) → `POST /api/guess` avec coords fausses :
+
+- Réponse : `distanceKm: 38.5, score: 2` — recalcul indépendant haversine + `round(5000·e^(−38.5/5))` = **2** → écart 0.
+- Second test (Fort Delgrès, MOYEN, guess à 10,0 km, `hintsUsed: 1`, `timeMs: 30000`) : serveur **2540**, recalcul `min(5000, 2572×0,9 + 2572×0,9×0,2×0,5)` = **2540** → écart 0. Pénalité −10 %/indice et bonus temps ≤ +20 % conformes.
+- `skip: true` → `score: 0, distanceKm: null`, vérité révélée (extension documentée, cohérente avec le bouton « Passer »).
+- Erreurs : id inconnu → **404**, coords invalides → **400**, id manquant → **400**, JSON invalide → **400**.
+
+### 2.3 Cas A — lieu avec `wikidata_id` ✅
+
+| Lieu | `/api/guess` | `/api/wiki/{qid}` |
+|---|---|---|
+| Fort Delgrès | `wikidata_id: "Q3077840"` | 200, `title: "Fort Delgrès"`, extrait FR **422 car.**, `url: https://fr.wikipedia.org/wiki/Fort_Delgr%C3%A8s` |
+| Centre spatial guyanais | `wikidata_id: "Q308987"` | 200, extrait FR **447 car.**, url fr.wikipedia |
+
+Cache : `cache-control: public, max-age=3600` vérifié par `curl -I` ; cache mémoire TTL 24 h + User-Agent Wikimédia explicite dans `routes/api/wiki/[qid]/+server.ts`.
+
+### 2.4 Cas B — lacune documentaire (CRUCIAL) ✅
+
+Corpus : **9 lieux `wikidata_id: null`** (2 GP, 2 MQ, 3 GUY, 2 REU) — intentionnels, conformes au piège de la spec §Agent Contenu.
+
+- `POST /api/guess` sur **Plage de Bois Jolan** (`ff00fd1d…`) et **Anse Noire** (`cd652fb7…`) → `wikidata_id: null` dans les deux réponses. ✅
+- Rendu (`WikiFiche.svelte:64-78`) : `wikidataId` null → panneau **`.cas-b`** visuellement distinct (fond `--oki-lacune-fond` #fdf3e3, bordure 2px `--oki-lacune-bord` #d9a441, icône ◌ en pointillés) vs `.cas-a` vert doux. ✅
+- Titre exact de la spec : **« Pwen blindé — Sa pa dokimanté »** (`fr.ts:68`, `gcf.ts:70`). ✅
+- Texte FR conforme à §4.3 (« Ce lieu existe, mais il n'a pas de page sur Wikipédia ni de fiche sur Wikidata… qui alimentent même l'intelligence artificielle). ») + équivalent créole complet dans `gcf.ts:71-72`. ✅
+- CTA **« Kontribyé sou Wikipédia »** → `https://fr.wikipedia.org/w/index.php?search={nom du lieu}&title=Spécial:Recherche` — titre du lieu pré-rempli dans la recherche (`WikiFiche.svelte:38-40`) + lien secondaire vers le guide « Premiers pas ». ✅
+- **Chemin « qid non null mais wiki 404 »** : `/api/wiki/Q15646372` (entité sans sitelink fr) → **404** ; dans `WikiFiche.svelte:28`, `res.ok ? … : null` → **bascule bien sur le panneau Cas B** (même comportement sur erreur réseau, ligne 29-30). ✅
+- Chaîne « Pwen blindé » présente dans le bundle client livré (`grep` dans `build/`). ✅
+
+### 2.5 `/api/lieux` ✅
+
+40 lieux ; toutes les coords sont des **multiples exacts de 0,05** (vérifié par script, ex. Fort Delgrès → `{lat: 16, lon: -61.7}`). `Cache-Control: public, max-age=300`.
+
+### 2.6 Pages ✅
+
+`/` 200 · `/jeu/monument` 200 · `/jeu/lieu` 200 · `/jeu/defi` 200 · `/explorer` 200 · `/manifest.webmanifest` 200 · `/service-worker.js` 200 · `/icon.svg` 200 · `/jeu/triche` → **404** (mode invalide rejeté).
+
+SSR vérifié : le HTML de `/` contient `<h1>JWE</h1>` rendu serveur (contenu visible avant hydratation).
+
+---
+
+## 3. Parité i18n FR / créole ✅
+
+Script Node comparant les clés aplaties de `fr.ts` et `gcf.ts` :
+
+```
+clés fr : 77 | clés gcf : 77
+manquantes dans gcf : aucune — manquantes dans fr : aucune
+```
+
+Le message de lacune existe dans les DEUX langues (titre, texte, CTA, guide). Double garantie : `gcf` est typé `Dict` (`gcf.ts:3`), donc toute clé manquante casserait `npm run check`. L'attribut `<html lang>` est mis à jour au changement de langue (`store.svelte.ts:25`).
+
+---
+
+## 4. A11y / doctrine OKI (revue de code)
+
+| Point | Verdict | Preuve |
+|---|---|---|
+| `prefers-reduced-motion` | ✅ | Règle globale `oki.css:111-117` ; vol du marqueur désactivé (`GameMap.svelte:56-57,116-117`) et transitions cartes à `duration: 0` ; transition du bottom-sheet coupée (`explorer/+page.svelte:256-260`) |
+| Navigation clavier carte | ✅ | Zone carte `role="application"`, `tabindex="0"`, `aria-label` i18n ; flèches = déplacer le marqueur (pas constant en pixels), Entrée = valider (`GameMap.svelte:246-273`) ; focus-visible visible (`oki.css:67-72`) |
+| Une seule action primaire / écran | ⚠️ | Accueil : « Jouer » seul corail. Jeu : « Valider » seul corail (Passer = secondaire, Indice = tertiaire). Bilan : « Partager » seul. **Réserve** : écran résultat Cas B = bouton corail « Lieu suivant » **+** CTA orange « Kontribyé sou Wikipédia » — deux éléments fortement colorés. Cohérent avec Peak-End (§5), mais en tension avec « une seule action primaire ». À trancher en design review. |
+| Bouton Valider en zone pouce | ✅ | `.barre-actions` sticky en bas + `env(safe-area-inset-bottom)` (`jeu/[mode]/+page.svelte:374-384`) ; accueil : `.zone-pouce` fixe bas |
+| Timer non anxiogène | ✅ | `TimerRing` : cercle qui se vide, couleur douce `--oki-vert-clair`, **aucun chiffre**, **aucune échéance** (à 0 le tour continue, le bonus s'arrête juste) ; timer désactivé par défaut |
+| Pas de mécanique dopaminergique | ✅ | `grep -i 'streak|leaderboard|classement|loot|confetti'` → 0 résultat ; pas de session serveur, pas de compte, « Passer » = 0 point sans pénalité, ton encourageant (« Kité sa ye ? ») |
+| Zoom contraint aux 4 régions | ✅ | `maxBounds` [-63,-23,57,18] + `minZoom: 4` (`regions.ts`) + 4 boutons « saut de région » avec `aria-label` groupe |
+| Photos | ✅ | `loading="lazy" decoding="async"` partout (`PhotoPanel`, `explorer`, `WikiFiche`) ; `alt` descriptif du corpus ; crédit affiché sous chaque photo |
+
+---
+
+## 5. Performance 4G (mesures build + estimation)
+
+Pas de Lighthouse disponible dans l'environnement → mesures réelles des artefacts + estimation argumentée.
+
+### Poids mesuré (sur fil, gzip — les `.gz` sont pré-générés dans le build)
+
+| Écran | Détail | Poids |
+|---|---|---|
+| **Premier écran `/`** | HTML 5,6 KB + JS initial 38,7 KB gz + CSS 1,8 KB gz | **≈ 43 KB** |
+| `/jeu/*` (supplément) | code page + GameMap | +12,9 KB gz |
+| MapLibre (lazy, uniquement écrans carte) | JS 277,8 KB gz + CSS 9,8 KB gz | 287,6 KB gz |
+| Photos | Wikimedia `?width=1200`, lazy | ~150-400 KB/photo |
+
+### Estimation 4G caribéen (≈ 10 Mbps, RTT 150 ms ; et slow 4G 1,6 Mbps)
+
+- **Premier écran < 3 s : ✅ large.** ~43 KB → < 0,5 s de transfert même en slow 4G ; SSR → `<h1>` et grille des régions visibles avant hydratation ; police système (aucune webfont) ; zéro requête tierce.
+- Écran de jeu : +300 KB gz (MapLibre) ≈ 1,5-2 s en slow 4G, chargé **après** l'affichage de la photo (lazy) — le joueur peut déjà observer la photo.
+- PWA : app shell pré-caché par le service worker → 2e visite quasi instantanée, photos en stale-while-revalidate.
+
+---
+
+## 6. Checklist d'audit OKI (spec §Agent Intégration & QA)
+
+- [x] **Une seule action primaire par écran** — ✅ (⚠️ réserve Cas B, voir §4)
+- [x] **Mobile : bouton Valider en zone du pouce, carte utilisable au doigt** — ✅ (sticky bottom, marqueur draggable, boutons zoom +/- visibles)
+- [x] **Performance : premier écran < 3 s, MapLibre lazy-loadé** — ✅ (~43 KB gz initial, chunk MapLibre dynamique)
+- [x] **Éthique : pas de mécanique dopaminergique, score non punitif** — ✅
+- [x] **Éducation : les deux cas (Wiki OK / Wiki manquant) fonctionnent et sont distincts visuellement** — ✅ (tests §2.3/§2.4, panneaux `.cas-a` vert / `.cas-b` sable-orangé)
+- [x] **Bilinguisme FR/créole présent (y compris message de lacune)** — ✅ (77/77 clés)
+- [x] **PWA installable** — ✅ avec réserve : manifest + SW + icônes SVG `any`/`maskable` valides, **mais aucun PNG 192/512** — Chrome desktop peut refuser l'invite d'installation sans PNG (⚠️).
+
+Intégration MapLibre + API Lieux + API Wikipedia : ✅. Partie complète jouée : ✅ (§2.2).
+
+---
+
+## 7. Bugs corrigés pendant l'audit
+
+1. **Libellés des boutons zoom MapLibre en anglais** — Les clés i18n `carte.zoomIn`/`zoomOut` existaient mais n'étaient jamais utilisées : le `NavigationControl` natif affichait les tooltips/aria-labels anglais « Zoom in / Zoom out » sur une UI FR/créole (a11y lecteur d'écran).
+   - **Correctif** : `app/src/lib/components/GameMap.svelte` — option `locale` ajoutée au constructeur `new mod.Map({…})` avec `'NavigationControl.ZoomIn': t().carte.zoomIn` et `'NavigationControl.ZoomOut': t().carte.zoomOut`.
+   - **Vérifié** : `npm run check` 0 erreur, rebuild OK, chaîne présente dans le chunk GameMap reconstruit, serveur relancé et endpoints re-testés (200).
+
+Aucun bug structurel trouvé.
+
+---
+
+## 8. Points d'amélioration restants (non bloquants)
+
+1. ⚠️ **Icônes PWA** : ajouter des PNG 192×192 et 512×512 (certains navigateurs n'acceptent pas le SVG seul pour l'invite d'installation).
+2. ⚠️ **Contraste du corail** `--oki-corail` #e4572e sur texte blanc ≈ **3,7:1** : conforme AA pour texte large et composants d'interface, juste sous les 4,5:1 du texte courant. Envisager `--oki-corail-fonce` au repos si on veut du AA strict.
+3. ⚠️ **Bonus temps basé sur `timeMs` fourni par le client** (`/api/guess`) : un client modifié peut s'accorder +20 %. Sans leaderboard ni enjeu, c'est acceptable — à documenter si un mode compétitif arrive un jour.
+4. ⚠️ **Deux accents forts sur l'écran résultat Cas B** (corail « Lieu suivant » + orange « Kontribyé ») : Peak-End assumé, mais à valider contre la règle « une seule action primaire ».
+5. **Clés i18n inutilisées** : `resultat.bravo`, `resultat.score`, `micro.pwenBlinde`, `defi.manche` — cosmétique, à nettoyer ou brancher.
+6. **Pas de tests automatisés** dans le dépôt (ni unitaires ni e2e) — les vérifications de cet audit sont manuelles ; un `vitest` sur `scoreGuess`/`sanitizeRound` + un test e2e du Cas B sécuriseraient les régressions.
+7. **Limite connue** (déjà documentée dans `architecture.md`) : l'enveloppe `maxBounds` rectangulaire inclut l'Atlantique tropical et le Brésil — inoffensif.
+
+---
+
+## Verdict
+
+**✅ Conforme à la spec.** Build propre, anti-triche étanche sur 15 tirages, scoring recalculé serveur et vérifié au point près, Cas A et Cas B fonctionnels (y compris le fallback 404 → Cas B), i18n FR/créole complet, doctrine OKI respectée (calm tech, zone pouce, reduced-motion, zéro dark pattern). 1 bug mineur corrigé (locale des contrôles zoom). 7 points d'amélioration non bloquants listés ci-dessus.
+
+---
+
+## Addendum post-audit (vérification finale orchestrateur)
+
+- **Fix anti-spoiler** : le crédit photo (`photo.credit`, souvent explicite sur le lieu) était affiché pendant la phase de devinette. Désormais masqué pendant la devinette (`PhotoPanel`, prop `revealed`) et affiché après validation dans `ResultPanel` — attribution CC conservée, indice supprimé. Re-vérifié : `npm run check` 0 erreur, `npm run build` OK.
@@ -0,0 +1,87 @@
+# JWE — Guide de contribution : ajouter un lieu
+
+Le corpus de lieux vit dans `app/src/lib/server/data/lieux.json`, versionné dans Git. Ajouter un lieu = une pull request. La revue de PR sert de modération éditoriale (exactitude, crédits photo, licence).
+
+## 1. Règles d'or d'un bon lieu
+
+- **Photographiable et identifiable** : le lieu doit avoir une photo libre de qualité (Wikimedia Commons de préférence).
+- **Localisé précisément** : coordonnées GPS au lieu près (le score Expert se joue à 1 km).
+- **Éditorialement pertinent** : monument, paysage, lieu culturel, rue ordinaire… Le jeu mélange volontairement lieux célèbres et lieux du quotidien.
+- **Lacunes assumées** : il est VOLONTAIRE d'inclure des lieux sans page Wikipédia (`wikidata_id: null`) — le jeu affiche alors un écran pédagogique « Pwen blindé » appelant à documenter le territoire. Mais c'est un choix, pas une négligence : vérifiez d'abord qu'aucune page/frwiki ni entité Wikidata n'existe.
+
+## 2. Schéma du lieu
+
+```json
+{
+  "id": "générez un uuid (uuidgen)",
+  "nom": "Fort Delgrès",
+  "nom_creole": "Fò Delgrès",
+  "region": "GUADELOUPE | MARTINIQUE | GUYANE | REUNION",
+  "commune": "Basse-Terre",
+  "coordonnees": { "lat": 16.0036, "lon": -61.7319 },
+  "categorie": "MONUMENT | LIEU",
+  "difficulte": "FACILE | MOYEN | DIFFICILE | EXPERT",
+  "wikidata_id": "Q3077840",
+  "photo": {
+    "url": "https://commons.wikimedia.org/wiki/Special:FilePath/FICHIER?width=1200",
+    "credit": "© Auteur / Wikimedia Commons CC-BY-SA-4.0",
+    "alt": "Description précise (sert d'alternative textuelle)"
+  },
+  "indices": [
+    { "niveau": 1, "texte": "Indice doux" },
+    { "niveau": 2, "texte": "Indice précis" }
+  ]
+}
+```
+
+## 3. Trouver et lier l'identifiant Wikidata
+
+1. Cherchez le lieu sur https://www.wikidata.org
+2. L'identifiant ressemble à `Q3077840`.
+3. Vérifiez que l'entité a un lien vers une page **fr.wikipedia** (sitelink) — c'est ce qui permet au jeu d'afficher l'extrait de l'article :
+
+```bash
+curl -s "https://www.wikidata.org/w/api.php?action=wbgetentities&ids=Q3077840&props=sitelinks&format=json" | grep frwiki
+```
+
+4. **Si le lieu n'a ni page Wikipédia ni entité Wikidata** : mettez `"wikidata_id": null`. C'est une contribution précieuse : le jeu transforme la lacune en appel à contribution. Mieux encore : créez l'entité Wikidata vous-même, puis revenez renseigner l'ID !
+
+## 4. Choisir la photo (licence obligatoire)
+
+1. Cherchez sur https://commons.wikimedia.org une photo nette, paysage de préférence.
+2. Licences acceptées : CC BY, CC BY-SA, CC0, domaine public. **Jamais** de « fair use ».
+3. Vérifiez la licence et l'auteur via l'API :
+
+```bash
+curl -s "https://commons.wikimedia.org/w/api.php?action=query&titles=File:NOM_DU_FICHIER&prop=imageinfo&iiprop=url|extmetadata&format=json"
+```
+
+4. L'URL dans le JSON utilise `Special:FilePath` avec `?width=1200` (redimensionnement à la volée côté Wikimedia — pas besoin d'héberger l'image). Testez qu'elle renvoie bien 200.
+5. Reportez le crédit exact (auteur + licence) dans `photo.credit` ET dans `content/credits.md`.
+
+## 5. Valider avant la PR
+
+```bash
+cd app
+node -e "const l=require('./src/lib/server/data/lieux.json');console.log(l.length,'lieux')"
+npm run check
+```
+
+Checklist de revue :
+
+- [ ] coordonnées cohérentes avec la commune déclarée
+- [ ] `wikidata_id` vérifié (ou `null` justifié)
+- [ ] licence photo CC vérifiée + crédit complet
+- [ ] `alt` descriptif (accessibilité)
+- [ ] 2 indices progressifs, sans donner la réponse
+- [ ] `nom_creole` renseigné quand la forme créole est attestée (sinon, reprendre le nom français — ne pas inventer)
+
+## 6. Contribuer à Wikipédia / Wikidata (au-delà du jeu)
+
+Si vous ajoutez un lieu « Pwen blindé », envisagez de documenter le lieu vous-même :
+
+- Créer un compte et un brouillon d'article : https://fr.wikipedia.org/wiki/Aide:Brouillon
+- Créer une entité Wikidata : https://www.wikidata.org/wiki/Wikidata:Main_Page
+- Contacter les groupes Wikimédia locaux (Wikimédia France, groupes antillais/guyanais/réunionnais).
+
+Chaque entité créée enrichit Wikipédia, les cartes libres… et les futurs jeux comme JWE.
@@ -0,0 +1,111 @@
+# JWE v2 — Guide de déploiement auto-hébergé
+
+Cible : un petit VPS (1 vCPU / 1 Go RAM suffit) sous Debian/Ubuntu, derrière nginx ou Caddy. Aucun service propriétaire, aucune clé API.
+
+## 1. Application SvelteKit
+
+```bash
+# Prérequis : Node.js >= 20 (via nodesource ou nvm)
+git clone https://codeberg.org/OKI/jwe.git
+cd jwe/app
+npm ci
+npm run build          # produit app/build (adapter-node)
+```
+
+Lancer en production (port 3000 par défaut) :
+
+```bash
+PORT=3000 node build
+```
+
+Service systemd `/etc/systemd/system/jwe.service` :
+
+```ini
+[Unit]
+Description=JWE — jeu de géolocalisation OKI
+After=network.target
+
+[Service]
+Type=simple
+User=jwe
+WorkingDirectory=/srv/jwe/app
+Environment=PORT=3000
+Environment=ORIGIN=https://jwe.o-k-i.net
+Environment=PUBLIC_TILES_URL=https://tiles.o-k-i.net/styles/oki/style.json
+ExecStart=/usr/bin/node build
+Restart=on-failure
+
+[Install]
+WantedBy=multi-user.target
+```
+
+## 2. Reverse proxy (exemple nginx)
+
+```nginx
+server {
+    server_name jwe.o-k-i.net;
+    location / {
+        proxy_pass http://127.0.0.1:3000;
+        proxy_set_header Host $host;
+        proxy_set_header X-Forwarded-Proto $scheme;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    }
+}
+# + TLS via certbot
+```
+
+## 3. Tiles cartographiques auto-hébergées (tileserver-gl)
+
+Par défaut l'application utilise OpenFreeMap (libre, sans clé). Pour une souveraineté complète, hébergez vos propres tiles OSM des 4 régions.
+
+### 3.1 Récupérer les extraits OpenStreetMap
+
+```bash
+mkdir -p /srv/tiles && cd /srv/tiles
+# Guadeloupe, Martinique, Guyane : extraits Geofabrik
+wget https://download.geofabrik.de/north-america/guadeloupe-latest.osm.pbf
+wget https://download.geofabrik.de/north-america/martinique-latest.osm.pbf
+wget https://download.geofabrik.de/south-america/french-guiana-latest.osm.pbf
+# La Réunion
+wget https://download.geofabrik.de/africa/reunion-latest.osm.pbf
+```
+
+### 3.2 Générer les .mbtiles
+
+Avec [openmaptiles](https://github.com/openmaptiles/openmaptiles) (Docker requis) : générez un `.mbtiles` par région puis fusionnez-les avec `tile-join` (paquet `tippecanoe`) :
+
+```bash
+tile-join -o dom-tom.mbtiles guadeloupe.mbtiles martinique.mbtiles guyane.mbtiles reunion.mbtiles
+```
+
+(Alternative plus légère : extraire les 4 régions d'un `.mbtiles` Monde basse-résolution `tile-join --bbox=…` par région, puisque la carte de devinette n'a pas besoin d'un zoom très fin partout.)
+
+### 3.3 Servir avec tileserver-gl
+
+```bash
+docker run --rm -d --name tiles -v /srv/tiles:/data -p 8080:8080 \
+  maptiler/tileserver-gl dom-tom.mbtiles
+```
+
+Copiez le style OKI de l'application (`app/src/lib/map/style-oki.json`) dans `/srv/tiles/styles/oki/`, adaptez son URL de source vers votre `dom-tom.mbtiles`, puis :
+
+```bash
+Environment=PUBLIC_TILES_URL=https://tiles.o-k-i.net/styles/oki/style.json
+```
+
+### 3.4 Fontes et sprites
+
+tileserver-gl sert aussi les fontes (glyphs) et sprites référencés par le style. Les fontes open-source utilisées par le style OKI (ex. Noto Sans) se récupèrent via `openmaptiles/fonts` ou `klokantech/tileserver-gl-fonts`.
+
+## 4. Cache Wikipedia
+
+Le endpoint `/api/wiki/[qid]` met en cache les extraits 24 h en mémoire. Aucune configuration requise ; pour un cache partagé entre instances, placez nginx en cache proxy devant `/api/wiki/` (respecte déjà `Cache-Control`).
+
+## 5. Mise à jour
+
+```bash
+cd jwe && git pull && cd app && npm ci && npm run build
+systemctl restart jwe
+```
+
+L'ajout de lieux (voir `docs/contribution.md`) ne demande qu'un rebuild + restart : le corpus est embarqué dans le build.
@@ -0,0 +1,254 @@
+Voici le prompt mis à jour. Les hésitations sur les librairies et les panoramas sont supprimées, et la dimension éducative/Wikipedia est intégrée comme un mécanisme de jeu à part entière (et non plus comme un simple fallback).
+
+---
+
+```
+# Mission : JWE — Jeu de géolocalisation souverain type GeoGuessr
+## Refonte complète · Svelte + Strapi/SvelteKit · MapLibre · Photos uniques · Éducation Wikipedia
+
+---
+
+## 1. Contexte et ambition
+
+### 1.1 Projet source
+- **URL actuelle** : https://labola.o-k-i.net/ORGANISATION-KA-INTERNATIONALE/JWE
+- **Objet** : refonte complète pour en faire un jeu de géolocalisation dans l'esprit de GeoGuessr, centré sur 4 régions : **Guadeloupe, Martinique, Guyane, La Réunion**.
+
+### 1.2 Mécanique de jeu verrouillée
+- **Pas de Street View, pas de panoramas, pas de 3D.**
+- Le joueur voit une **photo unique** d'un lieu (monument, paysage, rue, lieu culturel).
+- Il doit placer un marqueur sur une carte pour deviner **la commune** (et par déduction la région).
+- Le score est calculé selon la distance entre le marqueur et les coordonnées réelles.
+- Après le score : phase éducative basée sur **Wikipedia/Wikidata** (voir §1.3).
+
+### 1.3 Le pivot éducatif : Wikipedia/Wikidata comme cœur du jeu
+JWE n'est pas qu'un jeu de score, c'est un outil de **souveraineté documentaire**.
+- Si le lieu photographié possède une page Wikipedia : afficher un extrait de l'article, ses coordonnées Wikidata, et un lien "Lire plus sur Wikipédia".
+- **Si le lieu n'a PAS de page Wikipedia ou de données Wikidata** : c'est intentionnel et pédagogique. Le jeu doit afficher un écran spécifique expliquant :
+  1. Pourquoi ce lieu n'est pas sur Wikipedia (lacune documentaire).
+  2. Pourquoi il est vital que les populations locales documentent leurs propres territoires (représentation numérique, décolonisation du savoir, importance pour les modèles d'IA qui s'entraînent sur ces données, tourisme, transmission).
+  3. Un appel à l'action : "Contribuer sur Wikipédia" avec un lien vers l'éditeur Wikipédia pré-rempli (ou des liens vers des tutos OKI/Wikimédiens locaux).
+- **L'Agent Contenu doit intentionnellement inclure des lieux sans page Wikipedia** pour tester et démontrer cette fonctionnalité.
+
+### 1.4 Cible OKI
+- **Souverain** : zéro Google, zéro Mapbox. Carte MapLibre + tiles libres.
+- **Éthique** : pas de loot boxes, pas de leaderboard forcé, pas d'anxiété.
+- **Performant** : jouable sur téléphone en 4G caribéen.
+- **Bilingue** : français / créole pour l'interface.
+
+---
+
+## 2. Stack technique (Verrouillée)
+
+### 2.1 Front-end : Svelte 5 + SvelteKit 2
+- Obligatoire. Compilateur léger, CSS scopé natif, SSR, MIT, PWA.
+
+### 2.2 Cartographie : MapLibre GL JS (Verrouillé)
+- **Obligatoire.** Pas d'évaluation de Cesium, iTowns ou Three.js à faire.
+- MapLibre pour la carte de devinette (placement du marqueur) et la carte récapitulative.
+- Style cartographique custom OKI (couleurs, fonts, labels) basé sur des tiles OpenStreetMap auto-hébergées ou libres.
+- Zoom contraint aux 4 régions (le joueur ne peut pas scroller la carte en Europe ou aux US, ce qui donnerait un indice).
+
+### 2.3 Back-end : Strapi ou SvelteKit seul (L'Architecte décide)
+- **Critère** : qui ajoute les lieux ? Si contributeurs non-devs → Strapi. Si devs uniquement → SvelteKit avec fichiers JSON locaux.
+- **Contrainte Wikipedia** : Ne **pas** stocker le texte Wikipedia en base. Le back-end (Strapi ou SvelteKit) doit interroger l'API Wikipedia/Wikidata en temps réel (ou avec un cache court) lors de l'affichage du résultat, à partir de l'ID Wikidata lié au lieu.
+
+### 2.4 Base de données
+- SQLite (frugalité OKI).
+
+---
+
+## 3. Design du jeu
+
+### 3.1 Types de parties (Modes)
+
+#### Mode 1 : « Konnèt moniman » (Reconnaître le monument)
+- Photo d'un monument. Deviner la commune.
+- Pas de limite de temps par défaut. Option timer activable.
+- Indices progressifs optionnels (Région → Département → "C'est un fort colonial") avec pénalité de score.
+
+#### Mode 2 : « Kote mwen ye ? » (Où suis-je ?)
+- Photo d'un lieu ordinaire (rue, carrefour, bord de mer, forêt guyanaise).
+- Deviner la commune. Timer optionnel.
+
+#### Mode 3 : « Défi 5 rounds »
+- 5 tours consécutifs mélangeant monuments et lieux.
+- Résumé final avec la carte montrant les 5 marqueurs vs positions réelles.
+
+#### Mode 4 : « Aprann » (Explorer)
+- Pas de score. Parcourir la carte, cliquer sur les marqueurs, voir les photos et lire les fiches Wikipedia / les appels à contribution.
+
+### 3.2 Système de score
+
+#### Formule (adaptée à la taille des communes)
+Les communes DOM sont petites. Un écart de 2 km peut signifier "à côté" ou "dans la commune d'à côté".
+```
+score = MAX_POINTS × e^(-distance / radius)
+```
+- `MAX_POINTS` = 5000.
+- `radius` par difficulté :
+  - Facile : 50 km (tu peux te tromper de commune voisine)
+  - Moyen : 15 km (tu dois être dans la bonne commune)
+  - Difficile : 5 km (tu dois être dans le bon quartier)
+  - Expert : 1 km (précision rue)
+
+#### Bonus / Pénalités
+- Bonus temps (si activé) : max 20%.
+- Pénalité indice : -10% par indice utilisé.
+
+### 3.3 Schéma de données d'un lieu
+
+```json
+{
+  "id": "uuid",
+  "nom": "Fort Delgrès",
+  "nom_creole": "Fò Delgrès",
+  "region": "GUADELOUPE",
+  "commune": "Basse-Terre",
+  "coordonnees": { "lat": 16.0036, "lon": -61.7319 },
+  "categorie": "MONUMENT",
+  "difficulte": "MOYEN",
+  "wikidata_id": "Q2216838",
+  "photo": {
+    "url": "/assets/fort-delgres.webp",
+    "credit": "© Collectif OKI / Wikimedia Commons CC-BY-SA",
+    "alt": "Vue de face du Fort Delgrès en pierre grise surplombant la mer"
+  },
+  "indices": [
+    { "niveau": 1, "texte": "Situé dans une capitale régionale" },
+    { "niveau": 2, "texte": "C'est un fort historique face à la mer" }
+  ]
+}
+```
+*Note : Le texte éducatif vient de l'API Wikipedia via `wikidata_id`. Si `wikidata_id` est null, le front déclenche le mode "Lacune documentaire".*
+
+---
+
+## 4. Répartition des tâches par agent
+
+### Agent Architecte (exécute en premier)
+**Sorties attendues** :
+1. **Décision Strapi vs SvelteKit seul** (argumentée).
+2. **Architecture des tiles** : Source des tiles MapLibre (style OKI, auto-hébergé via tileserver-gl).
+3. **Stratégie Wikipedia/Wikidata** : Comment le front/back récupère l'extrait Wikipedia en français à partir du `wikidata_id`. Endpoints API MWAPI à utiliser, stratégie de cache.
+4. **Arborescence du projet** complète.
+5. **Spécifications API REST** (sécurité anti-triche : ne jamais envoyer les coordonnées au client avant la soumission du marqueur).
+
+### Agent Back-end (si Strapi retenu)
+**Tâches** :
+1. Strapi sur SQLite, zéro telemetry.
+2. Content Type `Lieu` (schéma ci-dessus).
+3. Endpoints custom sécurisés (random sans coordonnées, soumission guess).
+4. Mise en place d'un proxy/cache léger pour les requêtes Wikipedia (pour ne pas se faire bloquer par l'API Wikimédia et accélérer l'affichage).
+
+### Agent Front-end (SvelteKit) — Le cœur du projet
+**Tâches** :
+
+#### 4.1 Carte MapLibre
+- Intégration de MapLibre GL JS.
+- Style custom OKI (couleurs, typographie).
+- Zoom contraint aux 4 régions (bounds géographiques stricts).
+- Marqueur draggable pour la devinette.
+- Boutons zoom +/- visibles (pas de geste obligatoire).
+- Performance : lazy load de MapLibre (ne charger le JS que sur les écrans de jeu).
+
+#### 4.2 L'Écran de jeu (Layout split)
+- **Mobile** : Photo en haut (60%), Carte en bas (40%), Bouton "Valider" fixe en zone du pouce (tiers inférieur).
+- **Desktop** : Photo à gauche (50%), Carte à droite (50%).
+- Timer discret si activé (cercle qui se vide, couleurs douces).
+- Bouton "Valider ma position" (action primaire unique, effet Von Restorff).
+- Bouton "Passer" (secondaire).
+- Bouton "Indice" (tertiaire, affiche le texte et la pénalité).
+
+#### 4.3 L'Écran de résultat (CRUCIAL : Phase éducative)
+Après validation, le marqueur vole vers la position réelle (sauf si `prefers-reduced-motion`).
+
+**Cas A : Le lieu a un `wikidata_id` (Données existantes)**
+- Afficher le score et la distance.
+- Afficher un panneau éducatif contenant :
+  - Titre du lieu (lien vers la page Wikipedia).
+  - Extrait de l'article Wikipedia (récupéré via API).
+  - Commune et Région.
+- Ton : "Tu as trouvé ! Apprends-en plus sur ce lieu."
+
+**Cas B : Le lieu n'a PAS de `wikidata_id` (Lacune documentaire)**
+- Afficher le score et la distance.
+- Afficher un panneau **distinct visuellement** (couleur différente, iconographie spécifique) avec un message pédagogique fort :
+  - *Titre* : "Pwen blindé — Sa pa dokimanté" (Point aveugle — Ce n'est pas documenté).
+  - *Texte (FR)* : "Ce lieu existe, mais il n'a pas de page sur Wikipédia ni de fiche sur Wikidata. Pour nos régions, c'est un enjeu majeur : si nous ne documentons pas nos propres territoires, notre histoire et notre géographie disparaissent des cartes numériques et des bases de données mondiales (qui alimentent même l'intelligence artificielle)."
+  - *Texte (CRÉOLE)* : (Équivalent en créole, à intégrer via le système i18n).
+  - *Call to action* : Bouton "Kontribyé sou Wikipédia" (lien vers l'éditeur Wikipédia avec le titre du lieu pré-rempli dans la barre de recherche, ou lien vers un guide OKI "Comment contribuer à Wikipédia").
+- **Soigner particulièrement cet écran (Peak-End rule de la doctrine OKI)** : c'est ici que le jeu devient un outil politique et éducatif, pas juste un divertissement.
+
+#### 4.4 Écrans annexes
+- **Accueil** : Titre "JWE", 4 cartes régions, choix du mode, bouton "Jouer" en zone pouce.
+- **Résultat final** : Carte récapitulative, score total, bouton "Partager" (génère une image canvas à télécharger, pas de share API propriétaire).
+- **Explorer** : Carte pleine page avec marqueurs, filtres par région, panneau latéral/bottom sheet avec la fiche Wikipedia ou le message de lacune.
+
+#### 4.5 Technique
+- PWA installable.
+- Photos en WebP/AVIF, `srcset`, lazy loading.
+- Navigation clavier sur la carte.
+- i18n (FR / Créole) pour toute l'UI.
+
+### Agent Contenu (exécute en parallèle)
+**Tâches** :
+1. Produire un **JSON de test de 40 lieux** (10/region).
+2. **PIÈGE INTENTIONNEL** : Pour chaque région, inclure **2 à 3 lieux réels qui n'ont PAS de page Wikipedia française** (ex: une petite ravine en Guyane, un morne spécifique en Martinique, un calvaire ou une boutique historique en Guadeloupe, un site naturel à La Réunion). Laisser leur `wikidata_id` à `null` dans le JSON.
+3. Pour les 7-8 autres lieux par région : fournir le vrai `wikidata_id` (ex: Q2216838 pour Fort Delgrès).
+4. Fournir les URLs de photos Wikimedia Commons réelles (vérifier la licence CC).
+
+### Agent Intégration & QA
+**Tâches** :
+1. Vérifier l'intégration MapLibre + API Lieux + API Wikipedia.
+2. **Tester spécifiquement le Cas B (Lacune documentaire)** : vérifier que le message s'affiche correctement, que le ton est bon, que le lien de contribution fonctionne.
+3. Jouer une partie complète.
+4. **Checklist d'audit OKI** :
+   - [ ] Une seule action primaire par écran
+   - [ ] Mobile : bouton Valider en zone du pouce, carte utilisable au doigt
+   - [ ] Performance : premier écran < 3s, MapLibre lazy-loadé
+   - [ ] Éthique : pas de mécanique dopaminergique, score non punitif
+   - [ ] Éducation : les deux cas (Wiki OK / Wiki Manquant) fonctionnent et sont distincts visuellement
+   - [ ] Bilinguisme FR/créole présent (y compris dans le message de lacune)
+   - [ ] PWA installable
+5. Mesures Core Web Vuts mobile 4G.
+
+---
+
+## 5. Doctrine UI/UX OKI (Extraits applicables)
+
+- **Système 1** : L'écran de jeu est immédiatement lisible (Photo | Carte | Valider).
+- **Von Restorff** : Le bouton "Valider" est le seul élément fortement coloré.
+- **Peak-End** : L'écran de résultat (avec la fiche Wiki ou l'appel à contribution) doit laisser une impression forte et positive. C'est la fin du round, c'est ce dont le joueur se souviendra.
+- **Calm technology** : Le timer est informatif, pas anxiogène.
+- **Territoire** : Le créole est utilisé dans les micro-interactions ("Bravo !", "Kité sa ye ?", "Pwen blindé"). Les visuels de la carte ne sont pas le default bleu Google, mais un style OKI ancré dans le territoire.
+
+---
+
+## 6. Contraintes transversales
+
+- **Licence** : MIT pour le code. Crédits obligatoires pour les photos Wikimedia.
+- **Zéro dépendance propriétaire** : MapLibre (BSD), Svelte (MIT). Aucune clé API payante.
+- **Sécurité** : Les coordonnées réelles ne sont jamais dans le payload initial envoyé au client.
+- **Git** : Commits atomiques.
+
+---
+
+## 7. Ordre d'exécution
+
+1. **Agent Architecte** → Stack, Schema, Stratégie Wiki/MapLibre.
+2. **Agent Contenu** → JSON des 40 lieux (avec le piège Wiki manquant).
+3. **Agent Back-end** (si Strapi).
+4. **Agent Front-end** → SvelteKit, MapLibre, Mécanique de score, Écrans éducatifs (Cas A & B).
+5. **Agent QA** → Audit, test du message de lacune documentaire, rapport.
+
+---
+
+## 8. Livrables finaux
+
+1. Dépôt Git complet.
+2. JSON de 40 lieux (avec la structure `wikidata_id: null` pour tester la lacune).
+3. Rapport d'audit OKI.
+4. Guide de déploiement auto-hébergé (SvelteKit + Tile Server).
+5. Guide de contribution ("Comment ajouter un lieu et lier sa page Wikidata").
+```
Author	SHA1	Message	Date
sucupira	d9b07d6729	readme: section JWE v2	2026-07-16 21:05:22 -04:00
sucupira	f5312bb3b9	docs: audit OKI - conforme, fix anti-spoiler credit photo	2026-07-16 21:05:22 -04:00
sucupira	923fa2869f	app: refonte JWE v2 - SvelteKit 2 + Svelte 5 + MapLibre, 4 modes de jeu, API anti-triche, ecran Cas B 'Pwen blinde', i18n FR/GCF, PWA	2026-07-16 21:05:22 -04:00
sucupira	ee85a10e20	contenu: corpus de 40 lieux verifies (Wikidata + photos Commons CC), 9 lieux sans page Wikipedia (lacune documentaire)	2026-07-16 21:05:22 -04:00
sucupira	8a9bec0143	docs: mission, decisions d'architecture, guides de deploiement et contribution	2026-07-16 21:05:22 -04:00