@wenathlan/saddle 2.0.150 → 2.0.152

package/Dockerfile

@@ -13,7 +13,7 @@
 #      compute service published as ghcr.io/wenathlan/saddle:<version>
 #      across the four-arch family standard (amd64, arm64, ppc64le, s390x
 #      — the trixie slim base line; the stage also builds the web SPA so
-#      the image serves the self-hosted console via `node /app/web/server.ts`).
+#      the image serves the self-hosted console via `node /app/webserver.ts`).
 #
 # saddle v2 (grand merge) - virtual hardware engine, multi-stage, multi-arch image.
 #
@@ -641,17 +641,20 @@ ENTRYPOINT ["/usr/bin/tini", "--", "qemu-system-x86_64"]
 # ---------------------------------------------------------------------------
 # saddle-build: the node-engine build stage (defined here, before the
 # vhe runtime, so BOTH container surfaces can consume its output: the
-# vhe runtime copies the built web SPA for its /engine/web console and
-# the saddle-runtime stage copies the engine dist plus the same web
-# tree - one build, two consumers). The stage runs native (never under
-# QEMU): its outputs are platform-independent static/js payloads.
+# vhe runtime copies the built web SPA beside the console server at
+# /engine and the saddle-runtime stage copies the engine dist plus the
+# same staged SPA - one build, two consumers). The stage runs native
+# (never under QEMU): its outputs are platform-independent static/js
+# payloads.
 
 # the build stage pins to the native build platform ($BUILDPLATFORM): its
 # outputs (the engine dist, pure js, and the web SPA, static assets) are
 # architecture-independent, while the tailwind/lightningcss pipeline only
 # ships native bindings for the builder platforms - the per-arch legs never
-# run it under QEMU.
-FROM --platform=$BUILDPLATFORM node:26.8.1-slim@sha256:c0753125a3789977aefe869cbebccf70e3cfd7ea84ca48547458f02e4f1d7146 AS saddle-build
+# run it under QEMU. The base rides the family tag contract (tags only,
+# never a @sha256: digest - a single digest cannot serve the
+# four-architecture matrix the registry resolves per platform).
+FROM --platform=$BUILDPLATFORM node:26.8.1-slim AS saddle-build
 
 ARG SADDLE_VERSION
 WORKDIR /app
@@ -663,7 +666,16 @@ RUN npm ci --ignore-scripts --legacy-peer-deps
 COPY . .
 RUN npm run build:engine \
     && node --check dist/cli.js \
-    && npm run web:build:pages
+    && npm run web:build:pages \
+    # the theme build emits the hashed SPA bundles straight at the app
+    # root (the family static-first vite contract): stage them into a
+    # clean folder so the runtime stages copy exactly the console
+    # surface - the shell, the hashed js/css bundles and the icon and
+    # manifest assets the shell references. the extension popup
+    # stylesheet is the one root css that never belongs to the spa.
+    && mkdir -p /out/spa \
+    && cp index.html *.js *.css *.svg *.webmanifest /out/spa/ \
+    && rm -f /out/spa/popup.css
 
 FROM ${UBUNTU} AS runtime
 ARG TARGETARCH
@@ -895,19 +907,24 @@ COPY --from=python-bridge /bridge/qemubridge.py /engine/qemubridge.py
 # the engine sources and the specification files consumed at runtime
 # (docker.config "final" stage copies the whole tree; the flat layout
 # keeps that a single COPY layer).
-COPY *.ts package.json tsconfig.json biome.json jsdom.d.ts /engine/
+COPY *.ts package.json tsconfig.json biome.jsonc jsdom.d.ts /engine/
 COPY processors.json gpus.json cores.json boards.json vm.config.json virtualhardware.json /engine/
-COPY qemu.config mttg.config passage.config docker.config /engine/
+COPY qemu.config mttg.config passage.config docker.config mime.types /engine/
 
 # the web node ships inside the main container: the mesh edition (auth,
 # sqlite database, dashboard and the browser sandbox pages) runs from the
 # same image, so one container serves the engine AND the web surface.
-# run it with: docker run ghcr.io/wenathlan/saddle node /engine/web/server.ts
-COPY web /engine/web
-# the built web SPA (vite, from the saddle-build stage): the console
-# server (node /engine/web/server.ts) serves web/dist/public - the
-# unified React interface that absorbed the former static pages.
-COPY --from=saddle-build /app/web/dist /engine/web/dist
+# run it with: docker run ghcr.io/wenathlan/saddle node /engine/webserver.ts
+# (the console server is a root engine source - the COPY *.ts line above
+# already lands it at /engine together with its console stack, and the
+# extension denylist of its static resolver keeps every .ts/.json/.sql
+# source unreachable).
+# the built web SPA (vite, staged by saddle-build): the theme build emits
+# the hashed bundles straight at the app root, so the staged spa lands
+# beside the console server at /engine and webserver.ts serves it from
+# its own module directory - the unified React interface that absorbed
+# the former static pages.
+COPY --from=saddle-build /out/spa /engine/
 
 RUN set -eux; \
     chmod 0755 /usr/local/bin/nvidia-smi /usr/local/bin/aetherforge; \
@@ -1310,7 +1327,7 @@ ENTRYPOINT ["/entrypoint.sh"]
 #   docker build --target saddle-runtime -t saddle:<version> .
 # ══════════════════════════════════════════════════════════════════════
 
-FROM node:26.8.1-slim@sha256:c0753125a3789977aefe869cbebccf70e3cfd7ea84ca48547458f02e4f1d7146 AS saddle-runtime
+FROM node:26.8.1-slim AS saddle-runtime
 
 ARG SADDLE_VERSION
 LABEL org.opencontainers.image.title="Saddle" \
@@ -1357,12 +1374,15 @@ RUN apt-get update \
     && rm -rf node_modules/cpu-features/deps \
     && find node_modules -type f -name Dockerfile -delete
 COPY --from=saddle-build /app/dist ./dist
-# the web service surface (self-hosted console): the built SPA
-# (web/dist/public from the saddle-build vite run) plus the pure-node
-# server stack (server.ts, db.ts, auth.ts, mesh.ts, sandbox.ts,
-# mime.types, init.sql, schema.prisma) - zero npm dependencies, the
-# node 26 runtime carries everything (node:sqlite, node:crypto).
-COPY --from=saddle-build /app/web ./web
+# the web service surface (self-hosted console): the staged spa plus the
+# pure-node server stack (webserver.ts, db.ts, labels.ts, auth.ts,
+# mesh.ts, sandbox.ts, sandboxprofile.ts, sandboxenvprofile.ts,
+# sandboxquota.ts, mime.types, init.sql, schema.prisma) - zero npm
+# dependencies, the node 26 runtime carries everything (node:sqlite,
+# node:crypto, native type stripping for the .ts sources).
+# run the console with: docker run saddle:<version> node webserver.ts
+COPY --from=saddle-build /app/webserver.ts /app/db.ts /app/labels.ts /app/auth.ts /app/mesh.ts /app/sandbox.ts /app/sandboxprofile.ts /app/sandboxenvprofile.ts /app/sandboxquota.ts /app/mime.types /app/init.sql /app/schema.prisma ./
+COPY --from=saddle-build /out/spa ./
 
 USER node
 

package/README.md

@@ -31,12 +31,12 @@ domain modules land beside the saddle domains:
 | `media.ts`, `render.ts`, `quantum.ts`, `tiers.ts` | media pipeline, GPU registry, quantum simulation, tier policy |
 | `security.ts`, `alternatives.ts` | hardening gates and the alternative-stack catalog |
 | `index.html`, `App.tsx`, `Sol/` | the single SPA shell and the Sol theme (one tsx app with one stylesheet per theme) |
-| `server.ts`, `sandbox.ts` | the zero-dependency self-hosted API of the 2.0.150 grand-merge envelope (`node server.ts`; the api answers its version at `/api/v1/health`) and the browser-pure engine port |
+| `server.ts`, `sandbox.ts` | the zero-dependency self-hosted API of the 2.0.152 grand-merge envelope (`node server.ts`; the api answers its version at `/api/v1/health`) and the browser-pure engine port |
 | `vercel.json`, `netlify.toml` | the platform deploy adapters beside the surface they publish (the caddy ghost stays out of the tree) |
 | `specs/*` package exports | processors, gpus, cores, boards and the qemu/mttg/passage/docker envelopes |
 
 The full pre-merge documentation of the engine lives in
-[docs/e2ugh-engine.md](docs/e2ugh-engine.md) and its release history in
+[docs/e2ugh.engine.md](docs/e2ugh.engine.md) and its release history in
 [CHANGELOG.md (the e2ugh lineage sections)](CHANGELOG.md (the e2ugh lineage sections)).
 
 ## Start here
@@ -223,7 +223,7 @@ Saddle is applying to the SignPath Foundation for open-source code signing. Unti
 
 The requested policy is: **Free code signing provided by SignPath.io, certificate by SignPath Foundation**. Committers and reviewers are maintainers with write access to the public repository. Approvers are repository owners or release approvers recorded in `governance.md`. Every signed release must be built from repository source, pass the security and packaging gates, and receive manual signing approval.
 
-The core program will not transfer information to other networked systems unless specifically requested by the user or the person installing or operating it. Browser sessions, storage adapters, runners and external services remain caller-configured and subject to their own policies. See [`privacy-policy.md`](privacy-policy.md) and [`SECURITY.md`](SECURITY.md).
+The core program will not transfer information to other networked systems unless specifically requested by the user or the person installing or operating it. Browser sessions, storage adapters, runners and external services remain caller-configured and subject to their own policies. See [`privacy.policy.md`](privacy.policy.md) and [`SECURITY.md`](SECURITY.md).
 
 ## GitHub Pages web surface
 
@@ -234,7 +234,7 @@ npm run web:check
 VITE_BASE_PATH=/saddle npm run web:build:pages
 ```
 
-Small public configuration and visual assets live under `web/public/`. The development collector is TypeScript source at `web/debugcollector.ts`, injected only in development, and uses `/debuglogs`; it is not part of the production build. The obsolete `web/public/__manus__` directory is intentionally absent.
+Small public configuration and visual assets live under `web/public/`. The obsolete `web/public/__manus__` directory is intentionally absent; the development debug collector (the visitor-browser telemetry hook at the former `web/debugcollector.ts`) left the saddle together with the scrape lanes — the engine keeps no surface that watches the user's browser.
 
 ## Development
 

package/biome.jsonc

@@ -0,0 +1,134 @@
+// the family biome baseline: identical across the apps, the identity only names the app.
+{
+  "$schema": "https://biomejs.dev/schemas/2.6.4/schema.json",
+  "vcs": {
+    "enabled": true,
+    "clientKind": "git",
+    "useIgnoreFile": false
+  },
+  "files": {
+    "includes": [
+      "**/*.ts",
+      "**/*.tsx",
+      "**/*.js",
+      "**/*.mjs",
+      "**/*.cjs",
+      "**/*.json",
+      "!**/dist",
+      "!**/distpackage",
+      "!**/target",
+      "!**/node_modules",
+      "!**/bun.lock",
+      "!**/*.min.js",
+      "!**/docs",
+      "!**/tests/tmp",
+      "!**/tests/code",
+      "!**/Sol/dist",
+      "!**/Sol/.vite",
+      "!**/Sol/node_modules",
+      "!**/coverage",
+      "!**/android",
+      "!**/releasecheck",
+      "!**/build",
+      "!**/release",
+      "!index-*.js"
+    ]
+  },
+  "formatter": {
+    "enabled": true,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "lineWidth": 120,
+    "lineEnding": "lf"
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "preset": "recommended",
+      "correctness": {
+        "noUnusedVariables": "warn",
+        "noUnsafeOptionalChaining": "warn",
+        "useExhaustiveDependencies": "warn",
+        "noUnusedImports": "warn",
+        "noUnusedPrivateClassMembers": "warn",
+        "noUnusedFunctionParameters": "warn",
+        "noConstantCondition": "warn",
+        "noVoidTypeReturn": "warn"
+      },
+      "a11y": {
+        "useButtonType": "warn",
+        "noStaticElementInteractions": "warn",
+        "useSemanticElements": "warn",
+        "useAriaPropsSupportedByRole": "warn"
+      },
+      "suspicious": {
+        "noExplicitAny": "warn",
+        "noArrayIndexKey": "warn",
+        "noControlCharactersInRegex": "warn",
+        "noRedeclare": "warn",
+        "noAssignInExpressions": "warn",
+        "noShadowRestrictedNames": "warn",
+        "noDuplicateElseIf": "warn",
+        "noImplicitAnyLet": "warn",
+        "noTsIgnore": "warn",
+        "noGlobalIsNan": "warn"
+      },
+      "style": {
+        "noNonNullAssertion": "warn",
+        "useTemplate": "warn",
+        "useExponentiationOperator": "warn",
+        "useConst": "warn"
+      },
+      "complexity": {
+        "useLiteralKeys": "warn",
+        "useOptionalChain": "warn",
+        "noUselessContinue": "warn",
+        "noUselessUndefinedInitialization": "warn",
+        "noUselessEscapeInRegex": "warn"
+      }
+    }
+  },
+  "javascript": {
+    "formatter": {
+      "quoteStyle": "double",
+      "semicolons": "always",
+      "trailingCommas": "all",
+      "arrowParentheses": "always"
+    }
+  },
+  "css": {
+    "parser": {
+      "tailwindDirectives": true
+    }
+  },
+  "overrides": [
+    {
+      "includes": ["**/*"],
+      "linter": {
+        "rules": {
+          "suspicious": {
+            "noDebugger": "off"
+          }
+        }
+      }
+    },
+    {
+      "includes": ["tests/workflowcheck.ts", "tests/publishlanes.test.ts"],
+      "linter": {
+        "rules": {
+          "suspicious": {
+            "noTemplateCurlyInString": "off"
+          }
+        }
+      }
+    }
+  ],
+  "assist": {
+    "enabled": true,
+    "actions": {
+      "source": {
+        "useSortedKeys": "off"
+      }
+    }
+  }
+}

package/dist/App.d.ts

@@ -0,0 +1,3 @@
+import './Sol/sol.css';
+declare function App(): import("react").JSX.Element;
+export default App;

package/dist/App.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * App — the global anchor (layer 1 of the anchor architecture) and the only
+ * TSX outside the theme. The root manages the themes as single files: it
+ * imports only the theme anchor (Sol/Sol.tsx — the file named after the theme
+ * folder, beside Sol/sol.css) and the theme stylesheet, wraps the anchor in
+ * the global concerns it owns (the error boundary, the theme and tooltip
+ * providers, the toaster and the wouter router provider) and renders it. The
+ * whole route tree lives behind the theme anchor; no page or component of the
+ * theme is ever imported here.
+ */
+import { createRoot } from 'react-dom/client';
+import { Router as WouterRouter } from 'wouter';
+import Sol from './Sol/Sol';
+import { ErrorBoundary, ThemeProvider, Toaster, TooltipProvider } from './Sol/shell/Shell.tsx';
+import './Sol/sol.css';
+import { seedlabels } from './labels';
+// the copy law rides the boot: the seed refreshes the label store rows
+// (translated rows protected) before the first paint answers
+if (typeof window !== 'undefined')
+    void seedlabels().catch(() => { });
+// NOTE: About Theme
+// - First choose a default theme according to your design style (dark or light bg), than change color palette in Sol/sol.css
+//   to keep consistent foreground/background color across components
+// - If you want to make theme switchable, pass `switchable` ThemeProvider and use `useTheme` hook
+/** The router base derives from the declared base path so the same build serves
+ * every host. A relative base ("./") cannot name the folder it lands in, but the
+ * dispatcher always boots cold links at the application root first — so the
+ * folder prefix of the boot pathname is exactly the router base (absolute, so
+ * wouter never has to match against a relative prefix). The absolute bases
+ * carry through unchanged. */
+function routerBase() {
+    const declaredBase = import.meta.env.BASE_URL;
+    if (declaredBase !== '/' && declaredBase !== './')
+        return declaredBase.replace(/\/$/, '');
+    const bootPath = window.location.pathname.replace(/index\.html$/, '').replace(/\/$/, '');
+    return bootPath === '' ? '' : bootPath;
+}
+function App() {
+    return (_jsx(ErrorBoundary, { children: _jsx(ThemeProvider, { defaultTheme: "dark", children: _jsxs(TooltipProvider, { children: [_jsx(Toaster, {}), _jsx(WouterRouter, { base: routerBase(), children: _jsx(Sol, {}) })] }) }) }));
+}
+/* The self-mount: the app owns its bootstrap — the retired main.tsx
+ * wrapper is gone, so this module is the single entry the html loads
+ * (the doctrine of the 2.1.0 universal interface: one tsx app, the
+ * router and the mount live together). */
+const rootmount = typeof document !== 'undefined' ? document.getElementById('root') : null;
+if (rootmount) {
+    createRoot(rootmount).render(_jsx(App, {}));
+}
+export default App;

package/dist/Sol/Sol.d.ts

@@ -0,0 +1,3 @@
+/** The route tree of the theme: the entry flow (intro, onboarding) before
+ * the catch-all that mounts the window over every page route. */
+export default function Sol(): import("react").JSX.Element;

package/dist/Sol/Sol.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Sol theme anchor — layer 2 of the anchor architecture.
+ * The file carrying the theme folder's own name (Sol/Sol.tsx, beside
+ * Sol/sol.css) is the path manager of the pages: it imports one anchor per
+ * page folder (`folder/folder.tsx`, each beside the loose components its
+ * folder keeps) and mounts every route and subroute of the theme. App.tsx
+ * consumes only this file and the theme stylesheet; no page component is
+ * ever imported outside this layer. When a theme folder changes its name
+ * (Moon, Aqua), this file follows the new name and App.tsx keeps importing
+ * the anchor by the folder path. Since the family window conversion the
+ * theme is an APPLICATION: the entry flow opens the route table — /intro
+ * (the akash-floor splash) and /onboarding (the first-run frames) — and
+ * every other route renders as the content of the ONE application window
+ * (the page anchors carry no chrome of their own; the window rail is the
+ * only nav). The flow contract rides the home anchor's entry gate
+ * (Sol/home/entrygate.tsx): "/" consults the seen flags (onboardingstate.ts)
+ * before anything shows, the intro hands straight to /onboarding and the
+ * onboarding lands home.
+ */
+import { Route, Switch } from 'wouter';
+import AgentBrowserAnchor from './agentbrowser/agentbrowser';
+import ArchitectureAnchor from './architecture/architecture';
+import ComputeAnchor from './compute/compute';
+import ConsoleAnchor from './console/console';
+import DashboardAnchor from './dashboard/dashboard';
+import DocsAnchor from './docs/docs';
+import HomeAnchor from './home/home';
+import IntegrationsAnchor from './integrations/integrations';
+import IntroAnchor from './intro/intro';
+import LoginAnchor from './login/login';
+import NotFoundAnchor from './notfound/notfound';
+import OnboardingAnchor from './onboarding/onboarding';
+import PlaygroundAnchor from './playground/playground';
+import RegisterAnchor from './register/register';
+import { Shell } from './shell/Shell.tsx';
+/** The window stage: the ONE application window wrapping the whole page
+ * route table — every existing route stays alive inside the stage. */
+function WindowStage() {
+    return (_jsx(Shell, { children: _jsxs(Switch, { children: [_jsx(Route, { path: '/', component: HomeAnchor }), _jsx(Route, { path: '/architecture', component: ArchitectureAnchor }), _jsx(Route, { path: '/agent-browser', component: AgentBrowserAnchor }), _jsx(Route, { path: '/compute', component: ComputeAnchor }), _jsx(Route, { path: '/integrations', component: IntegrationsAnchor }), _jsx(Route, { path: '/playground', component: PlaygroundAnchor }), _jsx(Route, { path: '/console', component: ConsoleAnchor }), _jsx(Route, { path: '/login', component: LoginAnchor }), _jsx(Route, { path: '/register', component: RegisterAnchor }), _jsx(Route, { path: '/dashboard', component: DashboardAnchor }), _jsx(Route, { path: '/docs', component: DocsAnchor }), _jsx(Route, { path: '/404', component: NotFoundAnchor }), _jsx(Route, { component: NotFoundAnchor })] }) }));
+}
+/** The route tree of the theme: the entry flow (intro, onboarding) before
+ * the catch-all that mounts the window over every page route. */
+export default function Sol() {
+    return (_jsxs(Switch, { children: [_jsx(Route, { path: '/intro', component: IntroAnchor }), _jsx(Route, { path: '/onboarding', component: OnboardingAnchor }), _jsx(Route, { component: WindowStage })] }));
+}

package/dist/Sol/agentbrowser/agentbrowser.d.ts

@@ -0,0 +1,9 @@
+/**
+ * agent browser page anchor — layer 3 of the anchor architecture.
+ * The file carrying the folder's own name is the path manager of the page:
+ * it imports the loose components beside it, mounts the page and re-exports
+ * the public component surface. Only the theme anchor (Sol/Sol.tsx) consumes
+ * this file. This anchor carries the former main component of the folder,
+ * which now lives here as the page mount itself.
+ */
+export default function AgentBrowser(): import("react").JSX.Element;

package/dist/Sol/agentbrowser/agentbrowser.js

@@ -0,0 +1,121 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * agent browser page anchor — layer 3 of the anchor architecture.
+ * The file carrying the folder's own name is the path manager of the page:
+ * it imports the loose components beside it, mounts the page and re-exports
+ * the public component surface. Only the theme anchor (Sol/Sol.tsx) consumes
+ * this file. This anchor carries the former main component of the folder,
+ * which now lives here as the page mount itself.
+ */
+import { PulseRegular as Activity, ProhibitedRegular as Ban, CameraRegular as Camera, CheckmarkCircleRegular as CheckCircle2, KeyboardRegular as Keyboard, CursorRegular as MousePointer2, PlayRegular as Play, ArrowCounterclockwiseRegular as RotateCcw, DocumentTextRegular as ScrollText, WindowConsoleRegular as Terminal, } from '@fluentui/react-icons';
+// Signal & Ledger: agent browser as an event trail, evidence and deterministic replay.
+// The session console renders the rows the sessions catalog serves — the
+// documented example log of docs/logs/examplesession.json offline, the paired
+// database rows over HTTPS — never invented coordinates or counts. Every
+// word of the page itself rides the label store (labels.ts — the copy law).
+import { useEffect, useState } from 'react';
+import { PageShell } from '../shell/Shell.tsx';
+import { label, labelfill } from '../../labels.ts';
+import { agentsessions, mediaSlots, } from '../../catalog';
+/** the glyph of one event kind of the session trail. */
+function eventicon(type) {
+    if (type === 'scroll')
+        return ScrollText;
+    if (type === 'type')
+        return Keyboard;
+    return MousePointer2;
+}
+/** the value line of one event: exactly the fields the row carries. */
+function eventvalue(event) {
+    if (event.type === 'scroll')
+        return `dy ${event.dy ?? 0}`;
+    if (event.type === 'type')
+        return `key ${event.key ?? ''}`;
+    return `x ${event.x ?? 0} / y ${event.y ?? 0}`;
+}
+/** the elapsed label of one event from its relative time. */
+const eventtime = (event) => `+${event.t} ms`;
+/** one rendered event row: the glyph, the relative time, the kind and the fields. */
+function SessionEventRow({ event }) {
+    const Icon = eventicon(event.type);
+    return (_jsxs("div", { className: "console-row", children: [_jsx(Icon, { fontSize: 16 }), _jsx("span", { className: "console-time", children: eventtime(event) }), _jsx("strong", { children: event.type }), _jsx("span", { children: eventvalue(event) })] }));
+}
+/** the event trail of one session: one row per captured event. */
+function SessionTrail({ events }) {
+    return (_jsx(_Fragment, { children: events.map((event) => (_jsx(SessionEventRow, { event: event }, `${event.t}-${event.type}`))) }));
+}
+/** the captcha verdict badge of one session: the honest outcome of the run. */
+function CaptchaBadge({ verdict }) {
+    return (_jsxs("span", { className: verdict.passed ? 'console-pass' : 'console-denied', children: [verdict.passed ? _jsx(CheckCircle2, { fontSize: 14 }) : _jsx(Ban, { fontSize: 13 }), " ", verdict.kind, ' ', label(verdict.passed ? 'agentbrowser.captcha.passed' : 'agentbrowser.captcha.failed')] }));
+}
+/** the principle cards beside the console: the glyph is presentation code,
+ * the words ride the store (agentbrowser.principle.*). */
+const principles = [
+    { icon: Camera, titlekey: 'agentbrowser.principle.dom.title', bodykey: 'agentbrowser.principle.dom.body' },
+    {
+        icon: RotateCcw,
+        titlekey: 'agentbrowser.principle.replay.title',
+        bodykey: 'agentbrowser.principle.replay.body',
+    },
+    {
+        icon: Play,
+        titlekey: 'agentbrowser.principle.evidence.title',
+        bodykey: 'agentbrowser.principle.evidence.body',
+    },
+];
+export default function AgentBrowser() {
+    const [media, setMedia] = useState(undefined);
+    const [sessions, setSessions] = useState(null);
+    useEffect(() => {
+        void mediaSlots().then((rows) => setMedia(rows.find((slot) => slot.id === 'media.agentbrowser.trace')));
+    }, []);
+    useEffect(() => {
+        let live = true;
+        agentsessions()
+            .then((rows) => {
+            if (live)
+                setSessions(rows);
+        })
+            .catch(() => {
+            if (live)
+                setSessions([]);
+        });
+        return () => {
+            live = false;
+        };
+    }, []);
+    const session = sessions?.[0] ?? null;
+    const lastt = session ? session.events[session.events.length - 1]?.t ?? 0 : 0;
+    const sessionlabel = session ? session.session.id : label('agentbrowser.console.reading');
+    /** the trimmed json projection of the served row (the docs/logs shape). */
+    const sessionsummary = session
+        ? JSON.stringify({
+            version: session.version,
+            session: {
+                id: session.session.id,
+                browser: session.session.browser,
+            },
+            events: session.events.map((event) => event.type),
+            captcha: session.captcha,
+        }, null, 2)
+        : label('agentbrowser.console.waitingSession');
+    return (_jsxs(PageShell, { section: label('agentbrowser.shell.section'), label: label('agentbrowser.shell.label'), title: label('agentbrowser.shell.title'), intro: label('agentbrowser.shell.intro'), media: media, children: [_jsxs("section", { className: "content-section split-content", children: [_jsxs("div", { children: [_jsx("p", { className: "eyebrow", children: label('agentbrowser.split.eyebrow') }), _jsx("h2", { className: "section-title", children: label('agentbrowser.split.title') })] }), _jsxs("div", { className: "prose-copy", children: [_jsx("p", { children: label('agentbrowser.split.body1') }), _jsx("p", { children: label('agentbrowser.split.body2') })] })] }), _jsxs("section", { className: "content-section browser-grid", children: [_jsxs("div", { className: "session-console", children: [_jsxs("div", { className: "console-head", children: [_jsxs("span", { children: [_jsx(Terminal, { fontSize: 14 }), ' ', labelfill('agentbrowser.console.session', {
+                                                id: sessionlabel,
+                                            })] }), session ? _jsx(CaptchaBadge, { verdict: session.captcha }) : null] }), _jsx("div", { className: "console-rows", children: session === null ? (_jsxs("div", { className: "console-row", "aria-live": "polite", children: [_jsx(Activity, { fontSize: 16 }), _jsx("span", { className: "console-time" }), _jsx("strong", { children: label('agentbrowser.console.catalog') }), _jsx("span", { children: label('agentbrowser.console.waiting') })] })) : session.events.length === 0 ? (_jsxs("div", { className: "console-row", "aria-live": "polite", children: [_jsx(Activity, { fontSize: 16 }), _jsx("span", { className: "console-time" }), _jsx("strong", { children: label('agentbrowser.console.catalog') }), _jsx("span", { children: label('agentbrowser.console.empty') })] })) : (_jsxs(_Fragment, { children: [_jsx(SessionTrail, { events: session.events }), _jsxs("div", { className: "console-row", children: [_jsx(Activity, { fontSize: 16 }), _jsxs("span", { className: "console-time", children: ["+", lastt, " ms"] }), _jsx("strong", { children: label('agentbrowser.console.metrics') }), _jsx("span", { children: labelfill('agentbrowser.console.events', {
+                                                        n: String(session.events.length),
+                                                        s: (lastt / 1000).toFixed(1),
+                                                    }) })] })] })) }), _jsxs("div", { className: "console-footer", children: [_jsx("span", { children: labelfill('agentbrowser.console.seed', {
+                                            seed: session
+                                                ? session.session.seed
+                                                : label('agentbrowser.console.na'),
+                                        }) }), _jsx("span", { children: labelfill('agentbrowser.console.browser', {
+                                            browser: session
+                                                ? session.session.browser
+                                                : label('agentbrowser.console.na'),
+                                        }) })] })] }), _jsx("div", { className: "browser-principles", children: principles.map((principle) => {
+                            const Icon = principle.icon;
+                            return (_jsxs("div", { className: "principle-card", children: [_jsx(Icon, { fontSize: 19 }), _jsxs("div", { children: [_jsx("strong", { children: label(principle.titlekey) }), _jsx("span", { children: label(principle.bodykey) })] })] }, principle.titlekey));
+                        }) })] }), _jsxs("section", { className: "content-section", children: [_jsxs("div", { className: "content-section-heading", children: [_jsx("p", { className: "eyebrow", children: labelfill('agentbrowser.json.eyebrow', {
+                                    version: String(session ? session.version : 1),
+                                }) }), _jsx("span", { className: "mono-label", children: label('agentbrowser.json.mono') })] }), _jsx("pre", { className: "code-block", children: _jsx("code", { children: sessionsummary }) })] })] }));
+}

package/dist/Sol/architecture/architecture.d.ts

@@ -0,0 +1,9 @@
+/**
+ * architecture page anchor — layer 3 of the anchor architecture.
+ * The file carrying the folder's own name is the path manager of the page:
+ * it imports the loose components beside it, mounts the page and re-exports
+ * the public component surface. Only the theme anchor (Sol/Sol.tsx) consumes
+ * this file. This anchor carries the former main component of the folder,
+ * which now lives here as the page mount itself.
+ */
+export default function Architecture(): import("react").JSX.Element;

package/dist/Sol/architecture/architecture.js

@@ -0,0 +1,93 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * architecture page anchor — layer 3 of the anchor architecture.
+ * The file carrying the folder's own name is the path manager of the page:
+ * it imports the loose components beside it, mounts the page and re-exports
+ * the public component surface. Only the theme anchor (Sol/Sol.tsx) consumes
+ * this file. This anchor carries the former main component of the folder,
+ * which now lives here as the page mount itself.
+ */
+import { ArrowUpRightRegular as ArrowUpRight, BrainCircuitRegular as Cpu, DatabaseRegular as Database, BranchForkRegular as GitBranch, GlobeRegular as Globe2, ShieldTaskRegular as ShieldCheck, } from '@fluentui/react-icons';
+// Signal & Ledger: the architecture as a diagram-as-ledger — layered hairline
+// rows (the runtime forms of sandboxprofile: runtime/packages, full/docker,
+// published/registries) with mono annotations and connector dashes, then the
+// four layers, the provider chain and the physical limit band. No floating
+// boxes: every layer is a ruled row on the same spine. The page ships zero
+// fixed data of its own: the runtime forms ride the declared vocabulary of
+// sandboxprofile, the provider chain and the layer words ride the label
+// store (labels.ts — the seed mirrors the rows into the labels table), and
+// every word reads through the typed accessor — the copy law.
+import { useEffect, useState } from 'react';
+import { PageShell } from '../shell/Shell.tsx';
+import { mediaSlots } from '../../catalog';
+import { label } from '../../labels.ts';
+import { SANDBOXFORMS } from '../../sandboxprofile.ts';
+/** the ledger annotations of the three runtime forms: the copy rides the
+ * store under the architecture.form.* family, keyed by the declared form
+ * ids of sandboxprofile (the ids are data, the words are copy). */
+const formlabels = {
+    'runtime-node': {
+        name: label('architecture.form.runtimeNode.name'),
+        pkg: label('architecture.form.runtimeNode.pkg'),
+        note: label('architecture.form.runtimeNode.note'),
+    },
+    'full-docker': {
+        name: label('architecture.form.fullDocker.name'),
+        pkg: label('architecture.form.fullDocker.pkg'),
+        note: label('architecture.form.fullDocker.note'),
+    },
+    published: {
+        name: label('architecture.form.published.name'),
+        pkg: label('architecture.form.published.pkg'),
+        note: label('architecture.form.published.note'),
+    },
+};
+/** the four layers of the map: the glyph is presentation code, every word
+ * rides the store (the home surfaces() precedent). */
+function layers() {
+    return [
+        {
+            icon: GitBranch,
+            name: label('architecture.layer.repository.name'),
+            sub: label('architecture.layer.repository.sub'),
+            body: label('architecture.layer.repository.body'),
+        },
+        {
+            icon: Cpu,
+            name: label('architecture.layer.runner.name'),
+            sub: label('architecture.layer.runner.sub'),
+            body: label('architecture.layer.runner.body'),
+        },
+        {
+            icon: Database,
+            name: label('architecture.layer.memory.name'),
+            sub: label('architecture.layer.memory.sub'),
+            body: label('architecture.layer.memory.body'),
+        },
+        {
+            icon: Globe2,
+            name: label('architecture.layer.surface.name'),
+            sub: label('architecture.layer.surface.sub'),
+            body: label('architecture.layer.surface.body'),
+        },
+    ];
+}
+/** the provider chain as config: the ordered ids ride the label store
+ * (architecture.chain.providers — the seed ingests the row into the labels
+ * table like every other string) and the page only splits the row; no fixed
+ * provider array survives inside the component. */
+function providerchain() {
+    return label('architecture.chain.providers').split(' · ');
+}
+export default function Architecture() {
+    const [media, setMedia] = useState(undefined);
+    useEffect(() => {
+        void mediaSlots().then((rows) => setMedia(rows.find((slot) => slot.id === 'media.runtime.map')));
+    }, []);
+    return (_jsxs(PageShell, { section: label('architecture.shell.section'), label: label('architecture.shell.label'), title: label('architecture.shell.title'), intro: label('architecture.shell.intro'), media: media, children: [_jsxs("section", { className: "content-section split-content", children: [_jsxs("div", { children: [_jsx("p", { className: "eyebrow", children: label('architecture.model.eyebrow') }), _jsx("h2", { className: "section-title", children: label('architecture.model.title') })] }), _jsxs("div", { className: "prose-copy", children: [_jsx("p", { children: label('architecture.model.body1') }), _jsx("p", { children: label('architecture.model.body2') })] })] }), _jsxs("section", { className: "content-section", "aria-label": label('architecture.forms.aria'), children: [_jsxs("div", { className: "content-section-heading", children: [_jsx("p", { className: "eyebrow", children: label('architecture.forms.eyebrow') }), _jsx("span", { className: "mono-label", children: label('architecture.forms.mono') })] }), _jsx("ol", { className: "r3-forms", children: SANDBOXFORMS.map((form, index) => (_jsxs("li", { className: "r3-form-row", children: [_jsx("span", { className: "r3-form-index", children: `0${index + 1}` }), _jsx("span", { className: "r3-form-name", children: formlabels[form].name }), _jsx("span", { className: "r3-form-pkg", children: formlabels[form].pkg }), _jsx("span", { className: "r3-form-note", children: formlabels[form].note })] }, form))) })] }), _jsxs("section", { className: "content-section", children: [_jsxs("div", { className: "content-section-heading", children: [_jsx("p", { className: "eyebrow", children: label('architecture.layers.eyebrow') }), _jsx("span", { className: "mono-label", children: label('architecture.layers.mono') })] }), _jsx("div", { className: "layer-stack", children: layers().map((layer, index) => {
+                            const Icon = layer.icon;
+                            return (_jsxs("div", { className: "layer-row", children: [_jsxs("span", { className: "layer-index", children: ["0", index + 1] }), _jsx(Icon, { fontSize: 20, strokeWidth: 1.5, "aria-hidden": "true" }), _jsxs("div", { className: "layer-name", children: [_jsx("strong", { children: layer.name }), _jsx("span", { children: layer.sub })] }), _jsx("p", { children: layer.body }), _jsx(ArrowUpRight, { fontSize: 16, "aria-hidden": "true" })] }, layer.name));
+                        }) })] }), _jsxs("section", { className: "content-section", children: [_jsxs("div", { className: "content-section-heading", children: [_jsx("p", { className: "eyebrow", children: label('architecture.chain.eyebrow') }), _jsx("span", { className: "mono-label", children: label('architecture.chain.mono') })] }), _jsx("div", { className: "provider-grid", children: providerchain().map((name, index) => (_jsxs("div", { className: `provider-cell ${index === 0 ? 'is-active' : ''}`, children: [_jsxs("span", { className: "provider-index", children: ["0", index + 1] }), _jsx("strong", { children: name }), _jsx("small", { children: label(index === 0
+                                        ? 'architecture.chain.preferred'
+                                        : 'architecture.chain.fallback') })] }, name))) })] }), _jsxs("section", { className: "content-section architecture-note", children: [_jsx(ShieldCheck, { fontSize: 21, "aria-hidden": "true" }), _jsxs("div", { children: [_jsx("p", { className: "eyebrow", children: label('architecture.limit.eyebrow') }), _jsx("p", { children: label('architecture.limit.body') })] })] })] }));
+}