debug(lightbox): trace IIFE init, partial-fetch contents, tile clicks

Lightbox still not opening on the user's side after the style.display
switch. Wire console.log() at every checkpoint so we can read off
DevTools where the chain breaks:

- partial fetch logs how many .flat-gallery-tile / a.flat-gallery-tile
  elements arrived and the first 200 chars of HTML — catches stale
  partial caches and template regressions.
- IIFE init logs whether the overlay element and each child were found.
- The delegated click handler logs every tile click, the gallery
  tile/url counts, and the open() call. A sibling branch logs clicks
  *inside* the gallery that don't match a tile (catches markup drift).
- open() logs the final computed display value so we can tell whether
  CSS still hides the overlay after the style change.
- A window.error listener catches any uncaught exception that would
  abort app.js before our IIFE registers its handlers.

All log lines are prefixed `[lazyflat.lightbox]` and tagged
`DEBUG(lightbox):` in source for easy removal once it's confirmed
working.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

web/static/app.js

@@ -90,6 +90,11 @@ document.addEventListener("click", (ev) => {
     .then((html) => {
       pane.innerHTML = html;
       pane.dataset.loaded = "1";
+      // DEBUG(lightbox): confirm fetched partial actually contains <button class="flat-gallery-tile">
+      const tileCount = pane.querySelectorAll(".flat-gallery-tile").length;
+      const aTagCount = pane.querySelectorAll("a.flat-gallery-tile").length;
+      console.log("[lazyflat.lightbox] partial loaded flat=%s tiles=%d (a-tags=%d, html-snippet=%o)",
+                  flatId, tileCount, aTagCount, html.slice(0, 200));
     })
     .catch(() => {
       pane.innerHTML = '<div class="px-4 py-5 text-sm text-slate-500">Detail konnte nicht geladen werden.</div>';
@@ -136,7 +141,10 @@ document.addEventListener("DOMContentLoaded", openDeepLinkedFlat);
 // at runtime, which conflicted with our class toggle and kept the modal
 // invisible after open().
 (function () {
+  // DEBUG(lightbox): start-up trace, remove once the viewer is confirmed working.
+  console.log("[lazyflat.lightbox] IIFE start");
   const overlay = document.getElementById("lazyflat-lightbox");
+  console.log("[lazyflat.lightbox] overlay element:", overlay);
   if (!overlay) {
     console.warn("[lazyflat.lightbox] #lazyflat-lightbox not in DOM; viewer disabled");
     return;
@@ -146,6 +154,9 @@ document.addEventListener("DOMContentLoaded", openDeepLinkedFlat);
   const prevBtn = overlay.querySelector("[data-lightbox-prev]");
   const nextBtn = overlay.querySelector("[data-lightbox-next]");
   const closeBtn = overlay.querySelector("[data-lightbox-close]");
+  console.log("[lazyflat.lightbox] children:",
+              { imgEl: !!imgEl, counterEl: !!counterEl, prevBtn: !!prevBtn,
+                nextBtn: !!nextBtn, closeBtn: !!closeBtn });
   let urls = [];
   let idx = 0;
 
@@ -158,13 +169,19 @@ document.addEventListener("DOMContentLoaded", openDeepLinkedFlat);
   }
 
   function open(list, startIdx) {
-    if (!list.length) return;
+    console.log("[lazyflat.lightbox] open() called", { count: list && list.length, startIdx, list });
+    if (!list.length) {
+      console.warn("[lazyflat.lightbox] open() bailed — empty url list");
+      return;
+    }
     urls = list;
     idx = Math.max(0, Math.min(startIdx | 0, urls.length - 1));
     overlay.style.display = "flex";
     overlay.setAttribute("aria-hidden", "false");
     document.body.classList.add("lightbox-open");
     render();
+    console.log("[lazyflat.lightbox] open() done — overlay computed display:",
+                getComputedStyle(overlay).display, "src:", imgEl.src);
   }
 
   function close() {
@@ -197,14 +214,34 @@ document.addEventListener("DOMContentLoaded", openDeepLinkedFlat);
 
   document.addEventListener("click", (ev) => {
     const tile = ev.target.closest(".flat-gallery-tile");
-    if (!tile) return;
+    if (!tile) {
+      // DEBUG(lightbox): only log clicks somewhere INSIDE a gallery so we don't spam.
+      if (ev.target.closest && ev.target.closest(".flat-gallery")) {
+        console.log("[lazyflat.lightbox] click inside gallery but no .flat-gallery-tile ancestor",
+                    { target: ev.target, tagName: ev.target.tagName });
+      }
+      return;
+    }
+    console.log("[lazyflat.lightbox] tile clicked", { tile, target: ev.target,
+                tagName: tile.tagName, fullSrc: tile.dataset.fullSrc });
     const gallery = tile.closest(".flat-gallery");
-    if (!gallery) return;
+    if (!gallery) {
+      console.warn("[lazyflat.lightbox] tile has no .flat-gallery ancestor");
+      return;
+    }
     ev.preventDefault();
     const tiles = Array.from(gallery.querySelectorAll(".flat-gallery-tile"));
     const list = tiles
       .map((t) => t.dataset.fullSrc || (t.querySelector("img") || {}).src || "")
       .filter(Boolean);
+    console.log("[lazyflat.lightbox] gallery has", tiles.length, "tiles,", list.length, "valid urls");
     open(list, tiles.indexOf(tile));
   });
+  console.log("[lazyflat.lightbox] click delegate attached");
 })();
+
+// DEBUG(lightbox): catch any uncaught error so we know if app.js stopped
+// running before the IIFE attached its handlers.
+window.addEventListener("error", (ev) => {
+  console.error("[lazyflat.lightbox] window error:", ev.message, ev.filename + ":" + ev.lineno);
+});