Add state management, WebSocket polling, html.js templating, and refactor pages

- lib/state.py: per-subsystem collectors with versioned state store
- daemon/server.py: state refresh on request, batch routing updates
- webui/static/hoover/html.js: new html tag template helper via htm.js
- webui/static/hoover/websocket.js: real-time state change notifications
- webui/static/hoover/vdom.js: VDOM improvements for keyed diff
- All frontend pages refactored to use html templates
- Add tests for state management and polling
- Update docs and AGENTS.md

webui/static/pages/logs.js

@@ -1,4 +1,4 @@
-import { h, PageHeader, Tabs, esc, definePage, renderGuard, modelFetch, getModel } from '/static/hoover/index.js?v=7';
+import { html, PageHeader, Tabs, esc, definePage, renderGuard, modelFetch, getModel } from '/static/hoover/index.js?v=7';
 
 const logTabs = [
     { key: 'journal', label: 'Journal' },
@@ -24,7 +24,7 @@ export default definePage({
         const lines = logData.data || [];
         const tab = logTabs.find(t => t.key === state.activeTab) || logTabs[0];
         const lineVnodes = lines.map((line, i) =>
-            h('div', { class: 'log-line', key: i }, esc(line))
+            html`<div class="log-line" key=${i}>${esc(line)}</div>`
         );
 
         const tabsBody = Tabs({
@@ -39,20 +39,17 @@ export default definePage({
 
         return [
             PageHeader({ title: 'Logs', subtitle: 'System and service logs' }),
-            h('div', { class: 'card', key: 'log-card' },
-                tabsBody,
-                h('div', { class: 'card-header' },
-                    h('span', null, tab.label),
-                    h('button', {
-                        class: 'btn btn-sm btn-outline',
-                        style: 'float:right;',
-                        'on:click': () => modelFetch('logs', state.activeTab),
-                     }, '\u21BB'),
-                ),
-                h('div', { class: 'card-body log-body' },
-                    h('pre', null, lineVnodes),
-                ),
-            ),
+            html`<div class="card" key="log-card">
+                ${tabsBody}
+                <div class="card-header">
+                    <span>${tab.label}</span>
+                    <button class="btn btn-sm btn-outline" style="float:right"
+                        onClick=${() => modelFetch('logs', state.activeTab)}>\u21BB</button>
+                </div>
+                <div class="card-body log-body">
+                    <pre>${lineVnodes}</pre>
+                </div>
+            </div>`,
         ];
     },
 });