themes are installable, like plugins

`platform/themes/<id>/` — untracked, same rule as `plugins/`, only the instructions
tracked. Drop a directory in and the theme appears in the picker on the next page load.

  themes/my-theme/theme.css     required — `[data-theme='my-theme'] { … }`
  themes/my-theme/theme.json    required — { name, family, dark }
  themes/my-theme/assets/       optional — wallpaper, logo

── Why this is cheaper than installing a plugin ──

A plugin is code: it needs a manifest module, mounting, and a frontend rebuild to reach
the bundler. A theme is a block of CSS custom properties, so it needs none of that. The
server reads the directory at request time and the client adds a `<link>`. No install
step, no rebuild, no restart — which is the whole reason this is eighty lines of
discovery rather than four hundred.

The id is the DIRECTORY NAME, not a manifest field, for the same reason a plugin's
`appName` is not one: an id that can disagree with where its files sit eventually will.
Discovery checks that the CSS actually targets its own directory name, because the
failure is otherwise silent — the theme appears, is selected, and nothing changes.

── Problems are reported, not swallowed ──

A malformed theme returns a reason rather than vanishing:

  broken-probe: theme.css does not target [data-theme='broken-probe']

The client logs those, so an author has somewhere to look instead of wondering why
their theme never appeared.

── Boundaries kept ──

The `theme` package still performs no IO. It gained an `extraThemes` prop; Officer
fetches and injects, exactly as it supplies the panel registry to `workspaces`. A
failure to fetch is not an error — no server, no session, no directory all mean "you get
the built-in themes", which is a complete product.

`/api/themes` is a `core` capability: read-only, and not deniable, because an account
that cannot read the theme list renders unstyled. Installing remains a directory on
disk; an upload endpoint would be a way to write arbitrary CSS into the page from a
request.

Verified in-process: listing, the problem report, CSS served as text/css, and a
traversal attempt answered 404.

── Needs a restart ──

Server-side change. Until then the client's fetch 404s and silently keeps the built-ins,
so nothing breaks in the meantime.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/servers/api/themes/themes.ts

@@ -0,0 +1,41 @@
+import type { Context } from 'hono';
+import { createRouter } from '../../create-router';
+import { discoverThemes, readThemeCss } from '../../themes/discover';
+
+/**
+ * Installed themes — the ones in `platform/themes/`, not the ones the platform ships.
+ *
+ * The shipped themes are compiled into the bundle and need no server. These are read off disk at request
+ * time, so dropping a directory in makes a theme appear on the next page load. No install step, no
+ * rebuild, no restart — a theme is CSS custom properties, and none of that needs compiling.
+ *
+ * Read-only on purpose. Installing a theme is `git clone` into a directory, exactly as it is for plugins;
+ * an upload endpoint would be a way to write arbitrary CSS into the page from a request, which is a worse
+ * trade than a shell command.
+ */
+export const themesRouter = createRouter();
+
+// GET /themes — what is installed, and what is nearly installed.
+//
+// `problems` is returned rather than swallowed: a theme with a typo in its JSON otherwise just fails to
+// appear, and the author has nowhere to look. The app store can render these.
+themesRouter.get('/', async (ctx: Context) => {
+  const { themes, problems } = discoverThemes();
+  return ctx.json({ themes, problems });
+});
+
+// GET /themes/:id/theme.css — the stylesheet, injected by the client as a <link>.
+//
+// Served as CSS rather than embedded in the JSON above so the browser caches it, and so a theme with a
+// syntax error breaks only itself rather than the payload that lists every theme.
+themesRouter.get('/:id/theme.css', async (ctx: Context) => {
+  const css = readThemeCss(ctx.req.param('id'));
+  if (css === null) return ctx.text('/* no such theme */', 404, { 'content-type': 'text/css; charset=utf-8' });
+
+  return ctx.body(css, 200, {
+    'content-type': 'text/css; charset=utf-8',
+    // Short, because editing a theme and reloading is the whole authoring loop. Long enough that a page
+    // load does not refetch fourteen stylesheets.
+    'cache-control': 'public, max-age=60',
+  });
+});