Feat: images responsives vignettes Play + composant ResponsivePicture

- Config: presets thumbnail + thumbnail-webp (170/255/355/510/710w)
- play.json.php: expose thumbnailSrcset + thumbnailWebp
- Nouveau composant ResponsivePicture.svelte (src, srcset, webp, sizes, alt, cls)
- Play.svelte: utilise ResponsivePicture dans le carousel
  sizes="clamp(170px, 18.41vw, 355px)"

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

site/config/config.php

@@ -108,6 +108,21 @@ return [
                 '600w' => ['width' => 600, 'format' => 'webp'],
                 '800w' => ['width' => 800, 'format' => 'webp'],
             ],
+            // Vignettes jeux — active: clamp(170px, 18.41vw, 355px), retina 2x → 710px
+            'thumbnail' => [
+                '170w' => ['width' => 170],
+                '255w' => ['width' => 255],
+                '355w' => ['width' => 355],
+                '510w' => ['width' => 510],
+                '710w' => ['width' => 710],
+            ],
+            'thumbnail-webp' => [
+                '170w' => ['width' => 170, 'format' => 'webp'],
+                '255w' => ['width' => 255, 'format' => 'webp'],
+                '355w' => ['width' => 355, 'format' => 'webp'],
+                '510w' => ['width' => 510, 'format' => 'webp'],
+                '710w' => ['width' => 710, 'format' => 'webp'],
+            ],
         ],
     ],
 ];

site/templates/play.json.php

@@ -8,6 +8,8 @@ $specificData = [
       'lettering'        => $game->lettering()->toFile()?->url(),
       'description'      => $game->description()->value(),
       'thumbnail'        => $game->thumbnail()->toFile()?->url(),
+      'thumbnailSrcset'  => $game->thumbnail()->toFile()?->srcset('thumbnail'),
+      'thumbnailWebp'    => $game->thumbnail()->toFile()?->srcset('thumbnail-webp'),
       'backgroundColor'  => $game->backgroundColor()->value() ?: null,
       'preview'          => $game->preview()->toFile()?->url(),
       'playLink'         => $game->playLink()->value() ?: null,