docs: draw demo game art as genre scenes

Tiles and screenshots were abstract shapes. Each is now a small scene for
its genre, with several layouts per genre steered by the game's tags, so
no two games look alike. The screenshot script pins the browser's date so
the Game of the Day doesn't change between runs.

docs/08-development/demo-data.md

@@ -34,5 +34,10 @@ no real games. To retake them after a UI change:
 3. Run `node scripts/demo/take-screenshots.mjs http://localhost:3100`.
 
 The script creates the first account, plays a few games for "Jump back in",
-moves the Time Machine to the week the demo fills, and writes `home.png`,
-`game.png` and `playing.png`.
+fixes the browser's date so the Game of the Day is always the same, moves the
+Time Machine to the week the demo fills, and writes `home.png`, `game.png` and
+`playing.png`.
+
+Each game's tile and screenshot is a small scene drawn for its genre (a road
+for driving games, a block grid for puzzles, and so on), with layouts varied by
+the game's tags and seeded by its title, so every build draws the same art.

scripts/demo/take-screenshots.mjs

@@ -70,6 +70,9 @@ async function settle() {
   await page.waitForTimeout(500);
 }
 
+// The Game of the Day follows the browser's date; this one picks The Lost Floppy
+await page.clock.setFixedTime(new Date('2026-06-08T12:00:00'));
+
 await page.goto('/login');
 await page.getByPlaceholder('Enter your username').fill(user.username);
 await page.getByPlaceholder('Enter your password').fill(user.password);