feat(mockups): slot 17 voyage with real content

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/index.html

@@ -29,6 +29,7 @@
       <li class="card"><a href="/mockups/14-voyage-panel/"><span class="card__num">14</span><h2>Voyage with side panel</h2><p>The curtain-call voyage with stylised models and a side panel that stays open: about, paths, lyrics, fan works.</p><p class="card__try">Try this: Play the voyage and watch the panel follow; open Lyrics and Fan works; switch the look (2/3).</p></a></li>
       <li class="card"><a href="/mockups/15-voyage-look2/"><span class="card__num">15</span><h2>Voyage, look 2</h2><p>14 in look 2, with the frieze, panel and world tied together, and the motif paths out in the open.</p><p class="card__try">Try this: Step through the voyage and switch where the paths live (A strip, B in the sea, C timeline).</p></a></li>
       <li class="card"><a href="/mockups/16-voyage-readable/"><span class="card__num">16</span><h2>Voyage, readable</h2><p>15 with readable type, listening folded into the lyrics, and all three motif paths working together.</p><p class="card__try">Try this: Press play in the panel header, follow the lyrics, collapse the timeline, and turn on threads on the sea.</p></a></li>
+      <li class="card"><a href="/mockups/17-voyage-real/"><span class="card__num">17</span><h2>Voyage with real content</h2><p>16 with the real songs, line-by-line synced lyrics and the actual Odyssey passage (needs the content folder).</p><p class="card__try">Try this: Press play on Polyphemus, watch the lyrics follow the song, then open the Odyssey passage.</p></a></li>
     </ul>
   </main>
   <footer data-fan-credits></footer>

src/mockups/17-voyage-real/index.html

@@ -0,0 +1,15 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Voyage with real content — EPIC Timeline mockup</title>
+  <link rel="stylesheet" href="../../shared/credits.css" />
+  <link rel="stylesheet" href="./style.css" />
+</head>
+<body>
+  <main id="app"></main>
+  <footer data-fan-credits></footer>
+  <script type="module" src="./main.ts"></script>
+</body>
+</html>

src/mockups/17-voyage-real/main.ts

@@ -0,0 +1,3 @@
+import { mountCredits } from "../../shared/credits";
+
+mountCredits();

src/mockups/17-voyage-real/style.css

@@ -0,0 +1 @@
+body { margin: 0; --stub-17: 1; }

src/mockups/registry.ts

@@ -49,4 +49,7 @@ export const mockups: MockupInfo[] = [
   { slug: "16-voyage-readable", number: 16, name: "Voyage, readable",
     pitch: "15 with readable type, listening folded into the lyrics, and all three motif paths working together.",
     tryThis: "Press play in the panel header, follow the lyrics, collapse the timeline, and turn on threads on the sea." },
+  { slug: "17-voyage-real", number: 17, name: "Voyage with real content",
+    pitch: "16 with the real songs, line-by-line synced lyrics and the actual Odyssey passage (needs the content folder).",
+    tryThis: "Press play on Polyphemus, watch the lyrics follow the song, then open the Odyssey passage." },
 ];

src/server.ts

@@ -17,6 +17,7 @@ import m12 from "./mockups/13-curtain-call/index.html";
 import m13 from "./mockups/14-voyage-panel/index.html";
 import m14 from "./mockups/15-voyage-look2/index.html";
 import m15 from "./mockups/16-voyage-readable/index.html";
+import m16 from "./mockups/17-voyage-real/index.html";
 
 export interface ServerOptions {
   /** Folder with the real content (audio, lyrics, Homer); defaults to CONTENT_DIR. See spec 003. */
@@ -61,6 +62,8 @@ export function startServer(port: number, opts: ServerOptions = {}): Server<unde
       "/mockups/15-voyage-look2": Response.redirect("/mockups/15-voyage-look2/", 302),
       "/mockups/16-voyage-readable/": m15,
       "/mockups/16-voyage-readable": Response.redirect("/mockups/16-voyage-readable/", 302),
+      "/mockups/17-voyage-real/": m16,
+      "/mockups/17-voyage-real": Response.redirect("/mockups/17-voyage-real/", 302),
     },
     development: process.env.NODE_ENV !== "production",
     fetch(req) {