Serve images without PHP, add the 720 and 1280 steps, trim two hot paths

- Image widths are 480, 720, 960, 1280, 1600 and 2400. A phone needed
  721 pixels and got 960. Existing images receive the new steps from
  a task; stored pages pick them up at render time, so no document is
  rewritten. Mobile backgrounds use 720.
- A variant served once is mirrored to public/media, and a rewrite rule
  lets the web server deliver it from there. var/media stays the source.
- The hero preload follows the image each device really shows.
- The post navigation reads the order and then two posts instead of
  up to 500 documents.

Co-Authored-By: Claude Fable 5.2 <noreply@anthropic.com>

bin/dev-router.php

@@ -9,6 +9,17 @@
  * what public/.htaccess does. This script reproduces that behaviour for local development.
  */
 $path = parse_url($_SERVER['REQUEST_URI'] ?? '/', PHP_URL_PATH) ?: '/';
+// Wie die Regel in public/.htaccess: Ein Bild der Mediathek, das im Abbild public/media/ liegt,
+// geht ohne die Anwendung raus (ADR 129). Ohne das maesse man hier weiter den Weg ueber PHP.
+if (1 === preg_match('#^/media/[a-f0-9]{32}/[0-9]{1,4}$#D', $path) && is_file(__DIR__.'/../public'.$path.'.webp')) {
+    header('Content-Type: image/webp');
+    header('Cache-Control: public, max-age=31536000, immutable');
+    header('X-Content-Type-Options: nosniff');
+    header('Content-Length: '.filesize(__DIR__.'/../public'.$path.'.webp'));
+    readfile(__DIR__.'/../public'.$path.'.webp');
+
+    exit;
+}
 $file = __DIR__.'/../public'.$path;
 if ('/' !== $path && !str_contains($path, '..') && is_file($file)) {
     // Dieselben Antwortkoepfe wie public/.htaccess sie auf einem Webserver setzt: Stylesheets,