Fix M4 reactivity bugs: active border, Ctrl+K, diagnostics

- Drill activeLeafId as a separate prop through Pane -> SplitNode ->
  LeafPane instead of bundling it into the \$derived ops object.
  Passing activeLeafId via ops caused subsequent focus changes to
  not propagate to children (LeafPane's active = \$derived(...) wasn't
  re-evaluating when ops's identity changed). Drilling sidesteps any
  prop-as-derived-object reactivity quirks.
- Ctrl+K listener now uses capture phase so it wins over xterm.js's
  keydown handler inside the focused terminal.
- Bump active/broadcasting borders to 2px and brighter colors so the
  visual change is unmissable.
- Add a 🔔 test-toast button in the titlebar to verify the
  notification pipeline independently of idle detection.
- Sprinkle console.log diagnostics through the active/broadcast/
  idle/notify flows so we can pinpoint any remaining issues from
  devtools next time something looks off.

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

src/App.svelte

@@ -118,15 +118,18 @@
   });
 
   // ---- Ctrl+K palette toggle ----------------------------------------------
+  // Capture phase so we win over xterm.js's keystroke capture inside terminals.
   $effect(() => {
     function onKey(e: KeyboardEvent) {
       if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "k") {
+        console.log("[tiletopia] Ctrl+K caught, paletteOpen ->", !paletteOpen);
         e.preventDefault();
+        e.stopPropagation();
         paletteOpen = !paletteOpen;
       }
     }
-    window.addEventListener("keydown", onKey);
-    return () => window.removeEventListener("keydown", onKey);
+    window.addEventListener("keydown", onKey, true); // capture phase
+    return () => window.removeEventListener("keydown", onKey, true);
   });
 
   // ---- pane ops ------------------------------------------------------------
@@ -154,21 +157,30 @@
 
   function handleToggleBroadcast(leafId: NodeId) {
     tree = toggleBroadcastInTree(tree, leafId);
+    const updated = findLeaf(tree, leafId);
+    console.log("[tiletopia] toggleBroadcast:", leafId, "now:", updated?.broadcast);
   }
 
   function handleBroadcastFrom(originLeafId: NodeId, dataB64: string) {
+    let peers = 0;
     for (const leaf of walkLeaves(tree)) {
       if (leaf.id === originLeafId) continue;
       if (!leaf.broadcast) continue;
       const paneId = paneIdByLeaf.get(leaf.id);
-      if (paneId == null) continue;
+      if (paneId == null) {
+        console.warn("[tiletopia] broadcast peer has no paneId yet:", leaf.id);
+        continue;
+      }
+      peers++;
       writeToPane(paneId, dataB64).catch((e) =>
-        console.warn("broadcast write failed:", e),
+        console.warn("[tiletopia] broadcast write failed:", e),
       );
     }
+    console.log("[tiletopia] broadcastFrom", originLeafId, "→", peers, "peer(s)");
   }
 
   function handleSetActivePane(leafId: NodeId) {
+    console.log("[tiletopia] setActivePane:", leafId, "(was:", activeLeafId, ")");
     activeLeafId = leafId;
   }
 
@@ -179,6 +191,7 @@
 
   function handleNotify(message: string) {
     const id = nextNotifId++;
+    console.log("[tiletopia] notify:", message, "(id:", id, ")");
     notifications.push({ id, message });
     setTimeout(() => {
       notifications = notifications.filter((n) => n.id !== id);
@@ -189,6 +202,10 @@
     notifications = notifications.filter((n) => n.id !== id);
   }
 
+  // Note: activeLeafId is NOT in ops — it's drilled as a separate prop
+  // through Pane / SplitNode so each LeafPane reactively picks up changes.
+  // Bundling it in ops via $derived caused subsequent activeLeafId changes
+  // to not propagate to children (Svelte 5 prop-as-derived-object quirk).
   const ops: PaneOps = $derived({
     split: handleSplit,
     close: handleClose,
@@ -200,7 +217,6 @@
     registerPaneId: handleRegisterPaneId,
     notify: handleNotify,
     distros,
-    activeLeafId,
   });
 
   // ---- preset layouts ------------------------------------------------------
@@ -256,6 +272,9 @@
     <button class="palette-btn" onclick={() => (paletteOpen = true)} title="Jump to pane (Ctrl+K)">
       ⌘K
     </button>
+    <button class="palette-btn" onclick={() => handleNotify("test toast at " + new Date().toLocaleTimeString())} title="Fire a test toast">
+      🔔
+    </button>
 
     <span class="layout-info">
       {leafCount(tree)} pane{leafCount(tree) === 1 ? "" : "s"}
@@ -264,7 +283,7 @@
 
   <div class="pane-wrap">
     {#if ready}
-      <Pane node={tree} {ops} />
+      <Pane node={tree} {ops} {activeLeafId} />
     {/if}
   </div>