Add list styles: Podium, Spotlight, Grid, List

- Each list picks a style in List settings (new lists default to Podium);
  existing lists keep Grid or List
- Podium: top 3 on medal-colored steps (#1 center and raised), the rest
  behind a native <details> "Show N more"; stacks #1 over #2/#3 on phones
- Spotlight: #1 as a feature card (art, why-note or description, play
  button), the rest as a numbered list
- Visitors can switch styles on a list page (?style=), preserved across
  pages; later pages fall back to a plain list since they don't start at #1
- Entries' detail data now lives on a wrapper per list, so featured and
  collapsed entries all open the detail view

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

web/static/js/public.js

@@ -1,12 +1,13 @@
 // Public pages: item detail dialog and grid/list toggle.
-import { h, icon, openDialog, storageGet, storageSet } from "./common.js";
+import { h, icon, openDialog } from "./common.js";
 import { previewButton } from "./player.js";
 
 // Each ranked list on the page ships its items as JSON next to the markup.
-const lists = [...document.querySelectorAll("[data-items]")].map((ol) => {
-  const data = JSON.parse(ol.nextElementSibling?.textContent || "[]");
-  return { ol, items: data, title: ol.dataset.listTitle, square: ol.classList.contains("aspect-square") };
-});
+const lists = [...document.querySelectorAll("[data-items]")].map((el) => ({
+  items: JSON.parse(el.querySelector(":scope > .items-data")?.textContent || "[]"),
+  title: el.dataset.listTitle,
+  square: el.classList.contains("aspect-square"),
+}));
 
 function findItem(id) {
   for (const list of lists) {
@@ -78,23 +79,3 @@ document.addEventListener("click", (e) => {
   const found = findItem(Number(btn.dataset.item));
   if (found) show(found.list, found.idx);
 });
-
-// Grid / list toggle on list pages, remembered per list in this browser.
-const toggle = document.querySelector("[data-layout-toggle]");
-if (toggle) {
-  const key = "canon:layout:" + toggle.dataset.key;
-  const apply = (layout) => {
-    for (const { ol } of lists) {
-      ol.classList.toggle("items--grid", layout === "grid");
-      ol.classList.toggle("items--rows", layout === "rows");
-    }
-    for (const b of toggle.querySelectorAll("button")) b.setAttribute("aria-pressed", String(b.dataset.layout === layout));
-  };
-  apply(storageGet(key) || toggle.dataset.default);
-  toggle.addEventListener("click", (e) => {
-    const b = e.target.closest("button[data-layout]");
-    if (!b) return;
-    apply(b.dataset.layout);
-    storageSet(key, b.dataset.layout);
-  });
-}