portfolio : fix gallery loading and optimize image sizes refs #59

- Remove GalleryAnimation preloading (was downloading full-size originals
  via new Image(), causing 5MB+ redundant downloads on top of WebP srcset)
- Gallery now shows immediately, images load lazily via DOM
- Force eager loading on mockup img when slide becomes active (fixes
  first-project gallery never showing — lazy img off-screen on bg slide)
- Resize all direct ->url() calls to appropriate display dimensions:
  gallery src 600px, mockup src 960px, backgrounds 1920px,
  play lettering 500px, play preview 1000px, team photos 400px

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

src/components/ui/GalleryAnimation.svelte

@@ -15,25 +15,10 @@
   let allLoaded = $state(false)
   let needsFade = $state(false)
 
-  // Wait for all unique source images to load before revealing
+  // Show immediately — the DOM images load via lazy loading when visible.
+  // No explicit preloading: it was forcing full-size originals to download.
   onMount(() => {
-    const uniqueSrcs = new Set(images.map(img => img.src).filter(Boolean))
-    if (uniqueSrcs.size === 0) { allLoaded = true; return }
-
-    let remaining = uniqueSrcs.size
-    const done = () => { if (--remaining <= 0) allLoaded = true }
-
-    for (const src of uniqueSrcs) {
-      const img = new Image()
-      img.src = src
-      if (img.complete) {
-        done()
-      } else {
-        needsFade = true
-        img.onload = done
-        img.onerror = done
-      }
-    }
+    allLoaded = true
   })
 
   const columns = $derived.by(() => {

src/views/Portfolio.svelte

@@ -145,6 +145,16 @@
     return () => img.removeEventListener('load', onLoad)
   })
 
+  // Force le chargement du mockup quand la slide devient active :
+  // Si l'image est lazy et a été rendue off-screen (slide en arrière-plan),
+  // le browser ne la charge pas → mockupReady reste false → galerie jamais affichée.
+  $effect(() => {
+    if (!isActive || mockupReady || !mockupEl) return
+    const img = mockupEl.querySelector('img')
+    if (!img || img.complete) return
+    img.loading = 'eager'
+  })
+
   // --- Effect: reset when slide deactivated ---
   // wasActive évite que clearAnchor() s'exécute au montage initial
   // (isActive est false avant l'initialisation des slides)