M3 plugin platform: frontend host, reference plugins, UI kit + docs

Completes M3 (SPEC §11 + §12 acceptance) on top of the backend platform (4e077f1).

Frontend host (§11.3):
- src/plugins/: manifest loader, runtime ESM bundle loader (framework-agnostic
  mount contract), PluginSlot, PluginPage (app.page at /p/*), plugin context
  (scoped api/events/i18n), capabilities hook. Wired slots into ThreadView
  (message.actions/message.banner), MailLayout sidebar (sidebar.section + page nav)
  and Settings→Accounts (settings.page); ws.ts fans out core + plugin.* events.
- plugin-ui.css: theme-aware .wm-* classes so bundles don't re-derive inline styles.

SDK additions:
- CurrentUserId + require_csrf (plugin-router auth), messages.envelope/header,
  actions.set_flags/trash, sdk.enqueue.

Reference plugins (plugins/, installed via webmail.plugins entry points):
- hello: skeleton page-plugin (app.page + plg_hello_note w/ RLS + cron job) —
  install→run→uninstall --drop-data leaves zero residue.
- labels: message.actions + sidebar.section slots, KV only, zero core diffs.
- filters: message.new hook -> match (subject/from/to) -> Mark read / Pin / Delete
  (delete = move thread to Trash via the core path).

docs/plugins.md: full authoring guide + a complete "Unsubscribe button" worked
example (the §12 "writable from docs alone" bar).

Also: conftest resets the arq pool between tests (loop-bound global, like engine/redis).

Gates: backend ruff + mypy --strict (107) + full suite 337; frontend tsc + eslint
+ vitest (11) + vite build.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Rcj3TpydMTzTSmU7kunzf8

frontend/src/plugins/PluginSlot.tsx

@@ -0,0 +1,63 @@
+// Renders every plugin bundle registered for a named UI slot (SPEC §11.3).
+//
+// The host owns a container <div> and delegates rendering to each bundle's mount
+// function (framework-agnostic contract), tearing it down on unmount. Slot-specific
+// data (e.g. the current messageId) is passed as `props` at mount time.
+
+import { useEffect, useRef } from "react";
+
+import { loadBundle } from "./bundleLoader";
+import { usePluginContext } from "./context";
+import { usePluginSlots } from "./manifest";
+import type { PluginUnmount } from "./types";
+
+function SlotMount({
+  pluginName,
+  bundle,
+  slotName,
+  props,
+}: {
+  pluginName: string;
+  bundle: string;
+  slotName: string;
+  props?: Record<string, unknown>;
+}) {
+  const ref = useRef<HTMLDivElement>(null);
+  const ctx = usePluginContext(pluginName);
+
+  useEffect(() => {
+    let cleanup: PluginUnmount | void;
+    let alive = true;
+    loadBundle(bundle)
+      .then((mount) => {
+        if (alive && ref.current) cleanup = mount(ref.current, ctx, props);
+      })
+      .catch((err) => console.error(`plugin slot ${slotName} (${pluginName}) failed`, err));
+    return () => {
+      alive = false;
+      if (typeof cleanup === "function") cleanup();
+    };
+    // props is read once at mount; plugins react to later changes via ctx.events.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [bundle, ctx]);
+
+  return <div ref={ref} data-plugin-slot={slotName} data-plugin={pluginName} />;
+}
+
+export function PluginSlot({ name, props }: { name: string; props?: Record<string, unknown> }) {
+  const bindings = usePluginSlots(name);
+  if (bindings.length === 0) return null;
+  return (
+    <>
+      {bindings.map((b) => (
+        <SlotMount
+          key={`${b.plugin}:${b.bundle}`}
+          pluginName={b.plugin}
+          bundle={b.bundle}
+          slotName={name}
+          props={props}
+        />
+      ))}
+    </>
+  );
+}