fix(web): eliminate all Svelte 5 runes-mode warnings (R10)

5 warnings → 0:

1. ActivityTimeline.svelte:103 — replaced deprecated <svelte:component
   this={icon}> with direct dynamic component rendering ({@const IconComp
   = icon}<IconComp />). In Svelte 5 runes mode, components are dynamic by
   default; <svelte:component> is unnecessary.

2. DetailSection.svelte:18 — 'let open = (defaultOpen)' captured only
   the initial value. Changed to (false) +  to sync with
   defaultOpen prop changes.

3. EntitySheet.svelte:10 — 'let currentSlug = (slug)' had the same
   issue. Changed to <string|null>(null) +  (the  was
   already there, now the initial value doesn't reference the prop).

4. theme.svelte.ts:23 — 'applyClass(current)' at module level referenced a
    variable, capturing only the initial value. Changed to apply the
   plain storedTheme() result for initialization; setTheme() already calls
   applyClass() on changes.

5. Chat.svelte:326 — unused CSS selector '.prose-chat
   :global(:first-child):is(h1,h2,h3)' replaced with explicit
   :global(> h1:first-child) etc. (the :first-child pseudo wasn't matching
   because the scoped wrapper div is the actual first child).

Build is now warning-free.

plans/2026-07-17-codebase-review-and-cleanup.md

@@ -431,7 +431,7 @@ the gitignore comment); `build` target ensures `bin/` exists; `clean` removes `b
 | R7 | Add tests for `learning` (80% gate), `actuator`, `scheduler`, `domain`, `notifier`, `knowledge` | L | Low | ✅ partial — pure unit tests added for all 6 packages; remaining coverage needs integration tests (`make test-db`) |
 | R8 | Add `eslint`+`prettier`+`vitest` to `web/`; wire `svelte-check`+`tsc` into CI; add `web/` CI job | M | Low | ✅ done |
 | R9 | Define `OikosEvent` discriminated union; eliminate ~15 `any` sites in web | S | Low |
-| R10 | Replace `<svelte:component>` in `ActivityTimeline.svelte:103`; fix `state_referenced_locally` warnings | S | Low |
+| R10 | Replace `<svelte:component>` in `ActivityTimeline.svelte:103`; fix `state_referenced_locally` warnings | S | Low | ✅ done |
 | R11 | Add the 8 manually-registered `serve*` routes to `openapi.yaml` (or document the carve-out) | S | Low |
 | R12 | Add `docs/mbse/README.md` "Last verified" header + scheduled re-verification; normalize ADR 0013/0014 template | S | Low |
 | R13 | Reconcile on-client path (`/opt/homelab/` vs `/opt/homelab-context/`) across AGENTS.md + CLIENTS.md | S | Low |

web/src/lib/components/ActivityTimeline.svelte

@@ -100,7 +100,8 @@
                 {:else if entry.status === 'failed'}
                   <CircleXIcon class="size-3.5" />
                 {:else if icon}
-                  <svelte:component this={icon} class="size-3" />
+                  {@const IconComp = icon}
+                  <IconComp class="size-3" />
                 {:else}
                   <CircleDotIcon class="size-3" />
                 {/if}

web/src/lib/components/DetailSection.svelte

@@ -15,7 +15,10 @@
     children: Snippet
   } = $props()
 
-  let open = $state(defaultOpen)
+  let open = $state(false)
+  $effect(() => {
+    open = defaultOpen
+  })
 </script>
 
 <Collapsible.Root bind:open class="rounded-md border bg-card">

web/src/lib/components/EntitySheet.svelte

@@ -7,7 +7,7 @@
   // Lets a relation click inside the sheet drill into that entity in place,
   // without closing/reopening. Resets to the externally-requested slug
   // whenever the caller opens the sheet on a different entity.
-  let currentSlug = $state(slug)
+  let currentSlug = $state<string | null>(null)
   $effect(() => {
     currentSlug = slug
   })

web/src/lib/stores/theme.svelte.ts

@@ -18,9 +18,10 @@ function storedTheme(): Theme {
   return window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark'
 }
 
-let current: Theme = $state(storedTheme())
+const initialTheme = storedTheme()
+let current: Theme = $state(initialTheme)
 
-applyClass(current)
+applyClass(initialTheme)
 
 export function setTheme(t: Theme): void {
   current = t

web/src/pages/Chat.svelte

@@ -323,7 +323,9 @@
     position: relative;
     display: inline-block;
   }
-  .prose-chat :global(:first-child):is(h1, h2, h3) {
+  .prose-chat :global(> h1:first-child),
+  .prose-chat :global(> h2:first-child),
+  .prose-chat :global(> h3:first-child) {
     margin-top: 0;
   }
   .prose-chat :global(h1)::after,