@quo-systems/dock 0.2.2 → 0.2.4

package/harbor/edge/edge.ts

@@ -24,7 +24,8 @@ import { isSilence } from '@quo-systems/quo';
 import { User, Desk, Avatar } from '../../beings/index.ts';
 import { setup } from '../../beings/setup.ts';
 import { Harbor, Socket as Held, SUITE, type Line } from '@quo-systems/quo/harbor';
-import { DurableStorage, sealKey } from './storage.ts';
+import { DurableStorage } from './storage.ts';
+import { sealKey } from '../seal.ts';
 import type { State, Env } from './platform.d.ts';
 
 export const BUILT_IN: Record<string, BeingClass> = { User, Desk, Avatar };

package/harbor/edge/exercise.ts

@@ -13,7 +13,8 @@ import type { World, Handle, Census } from '@quo-systems/quo/conformance';
 import { Printer, Shop, Customer, Echo, Member } from '@quo-systems/quo/conformance';
 import type { BeingClass, Cells, Invitation, JsonObject } from '@quo-systems/quo';
 import { EdgeHarbor } from './edge.ts';
-import { DurableStorage, sealKey } from './storage.ts';
+import { DurableStorage } from './storage.ts';
+import { sealKey } from '../seal.ts';
 import type { Hosted } from '@quo-systems/quo/harbor';
 import type { State, Env } from './platform.d.ts';
 

package/harbor/edge/storage.ts

@@ -2,35 +2,16 @@
 // The store as Durable Object storage: one object per harbor, its storage
 // holding one row per ward under `ward:<name>`, seed, partition and record,
 // and one row per hint under `hint:<pk>`. The seed is kept sealed under a
-// key from the platform's secrets, `QUO_SEED_KEY`, so the storage holds
-// ciphertext and the secret store holds the one key, which is what the
-// harbor document's table says the edge does. Values cross as JSON, as
-// they do into a file, because the ward hands the partition out through a
-// guard that structured clone refuses.
-import { arithmetic } from '@quo-systems/quo/ward';
+// key from the platform's secrets, `QUO_SEED_KEY`, with the seal in
+// `../seal.ts`, so the storage holds ciphertext and the secret store holds
+// the one key, which is what the harbor document's table says the edge
+// does. Values cross as JSON, as they do into a file, because the ward
+// hands the partition out through a guard that structured clone refuses.
 import { values, type Kept, type Store, type WardRecord } from '@quo-systems/quo/harbor';
+import { seal, open } from '../seal.ts';
 import type { Storage } from './platform.d.ts';
 
 type Row = { seed: string; partition: Record<string, unknown>; record: WardRecord };
-// Bytes as the platform's crypto wants them: over a plain ArrayBuffer.
-const plain = (b: Uint8Array): Uint8Array<ArrayBuffer> => new Uint8Array(b);
-const { hex, unhex } = arithmetic;
-
-// The seal on a seed: AES-GCM under the platform key, a fresh nonce each
-// time, nonce and ciphertext together as hex.
-export async function sealKey(secret: string): Promise<CryptoKey> {
-  if (!/^[0-9a-f]{64}$/.test(secret)) throw new Error('QUO_SEED_KEY is 32 bytes as hex');
-  return crypto.subtle.importKey('raw', plain(unhex(secret)), 'AES-GCM', false, ['encrypt', 'decrypt']);
-}
-export async function seal(key: CryptoKey, seed: Uint8Array): Promise<string> {
-  const iv = crypto.getRandomValues(new Uint8Array(12));
-  const ct = new Uint8Array(await crypto.subtle.encrypt({ name: 'AES-GCM', iv }, key, plain(seed)));
-  return hex(iv) + hex(ct);
-}
-export async function open(key: CryptoKey, sealed: string): Promise<Uint8Array> {
-  const b = plain(unhex(sealed));
-  return new Uint8Array(await crypto.subtle.decrypt({ name: 'AES-GCM', iv: b.subarray(0, 12) }, key, b.subarray(12)));
-}
 
 // `prefix` keeps more than one harbor apart in one object's storage: the
 // exercise does that, a deployment never does.

package/harbor/files.ts

@@ -1,39 +1,101 @@
 // SPDX-License-Identifier: Apache-2.0
-// The store as a folder on disk, one folder per ward:
+// The store as a folder on disk, one folder per ward, in one of two forms.
+//
+// Plain, when the store has no key, what the droplets run:
 //
 //   <dir>/wards/<name>/seed             32 bytes, hex, mode 0600
 //   <dir>/wards/<name>/partition.json
 //   <dir>/wards/<name>/ward.json        the ward record
+//
+// Sealed, when the store holds a key, what a device's daemon runs with the
+// key from its Keychain:
+//
+//   <dir>/wards/<name>/ward.sealed      seed, partition and record as one
+//                                       JSON, sealed under the key, hex
+//
+// and in both:
+//
 //   <dir>/reach.json                    the directory's hints
 //
-// Every write of the partition goes through a temp file and a rename, and
-// writes are queued per ward so two calls never race on one file.
+// A ward is whole in either form, and a store that meets the other form
+// refuses it by name: a daemon started without its key, or with one against
+// a plain folder, fails loudly instead of booting on what it cannot read.
+// Sealing a plain folder is a deliberate command, never a boot's doing.
+// Every write of a ward goes through a temp file and a rename, and writes
+// are queued per ward so two calls never race on one file.
 import { mkdir, readFile, writeFile, rename, readdir, rm, chmod } from 'node:fs/promises';
 import { existsSync } from 'node:fs';
 import { join } from 'node:path';
 import { arithmetic } from '@quo-systems/quo/ward';
 import type { Kept, Store, WardRecord } from '@quo-systems/quo/harbor';
+import { sealKey, seal, open } from './seal.ts';
 
 const { hex, unhex } = arithmetic;
+type Blob = { seed: string; partition: Record<string, unknown>; record: WardRecord };
 
 export class Files implements Store {
   readonly dir: string;
+  readonly #key?: Promise<CryptoKey>;
   readonly #queues = new Map<string, Promise<void>>();
-  constructor(dir: string) {
+  constructor(dir: string, key?: string) {
     this.dir = dir;
+    if (key) this.#key = sealKey(key);
   }
   #ward(name: string) {
     return join(this.dir, 'wards', name);
   }
+  get sealed(): boolean {
+    return this.#key !== undefined;
+  }
+  // The form a folder holds, checked against the form this store speaks.
+  #form(name: string): 'plain' | 'sealed' | undefined {
+    const wd = this.#ward(name);
+    const form = existsSync(join(wd, 'ward.sealed')) ? 'sealed' : existsSync(join(wd, 'seed')) ? 'plain' : undefined;
+    if (form === 'sealed' && !this.sealed) throw new Error(`ward ${name} in ${this.dir} is sealed and this harbor has no key`);
+    if (form === 'plain' && this.sealed) throw new Error(`ward ${name} in ${this.dir} is plain and this harbor holds a key`);
+    return form;
+  }
+  // One write at a time per ward, through a temp file and a rename.
+  #write(name: string, file: string, body: string): Promise<void> {
+    const next = (this.#queues.get(name) ?? Promise.resolve()).then(async () => {
+      const tmp = join(this.#ward(name), `${file}.tmp`);
+      await writeFile(tmp, body, { mode: 0o600 });
+      await rename(tmp, join(this.#ward(name), file));
+    });
+    this.#queues.set(name, next.catch(() => {}));
+    return next;
+  }
+  async #read(name: string): Promise<Blob> {
+    const blob = (await readFile(join(this.#ward(name), 'ward.sealed'), 'utf8')).trim();
+    return JSON.parse(new TextDecoder().decode(await open(await this.#key!, blob))) as Blob;
+  }
+  // A sealed ward is rewritten whole, so the read sits inside the queue
+  // with the write: two changes to one ward never lose each other's part.
+  #keep(name: string, change: (b: Blob | undefined) => Blob): Promise<void> {
+    const next = (this.#queues.get(name) ?? Promise.resolve()).then(async () => {
+      const wd = this.#ward(name);
+      const blob = change(existsSync(join(wd, 'ward.sealed')) ? await this.#read(name) : undefined);
+      const sealed = await seal(await this.#key!, new TextEncoder().encode(JSON.stringify(blob)));
+      await writeFile(join(wd, 'ward.sealed.tmp'), sealed + '\n', { mode: 0o600 });
+      await rename(join(wd, 'ward.sealed.tmp'), join(wd, 'ward.sealed'));
+    });
+    this.#queues.set(name, next.catch(() => {}));
+    return next;
+  }
 
   async list(): Promise<string[]> {
     const wards = join(this.dir, 'wards');
-    return existsSync(wards) ? (await readdir(wards)).filter((n) => existsSync(join(wards, n, 'seed'))) : [];
+    return existsSync(wards) ? (await readdir(wards)).filter((n) => existsSync(join(wards, n, 'seed')) || existsSync(join(wards, n, 'ward.sealed'))) : [];
   }
 
   async load(name: string): Promise<Kept | undefined> {
+    const form = this.#form(name);
+    if (!form) return undefined;
+    if (form === 'sealed') {
+      const b = await this.#read(name);
+      return { seed: unhex(b.seed), partition: b.partition, record: b.record };
+    }
     const wd = this.#ward(name);
-    if (!existsSync(join(wd, 'seed'))) return undefined;
     return {
       seed: unhex((await readFile(join(wd, 'seed'), 'utf8')).trim()),
       partition: JSON.parse(await readFile(join(wd, 'partition.json'), 'utf8')) as Record<string, unknown>,
@@ -42,30 +104,28 @@ export class Files implements Store {
   }
 
   async put(name: string, kept: Kept): Promise<void> {
+    if (this.#form(name)) throw new Error(`ward ${name} already exists in ${this.dir}`);
     const wd = this.#ward(name);
-    if (existsSync(join(wd, 'seed'))) throw new Error(`ward ${name} already exists in ${this.dir}`);
     await mkdir(wd, { recursive: true, mode: 0o700 });
+    if (this.sealed) return this.#keep(name, () => ({ seed: hex(kept.seed), partition: kept.partition, record: kept.record }));
     await writeFile(join(wd, 'seed'), hex(kept.seed), { mode: 0o600 });
     await chmod(join(wd, 'seed'), 0o600);
     await writeFile(join(wd, 'partition.json'), JSON.stringify(kept.partition) + '\n', { mode: 0o600 });
     await writeFile(join(wd, 'ward.json'), JSON.stringify(kept.record, null, 2) + '\n', { mode: 0o600 });
   }
 
-  save(name: string, partition: Record<string, unknown>): Promise<void> {
-    const wd = this.#ward(name);
-    if (!existsSync(join(wd, 'seed'))) return Promise.resolve(); // a name not kept is nothing
-    const next = (this.#queues.get(name) ?? Promise.resolve()).then(async () => {
-      const tmp = join(wd, 'partition.json.tmp');
-      await writeFile(tmp, JSON.stringify(partition) + '\n', { mode: 0o600 });
-      await rename(tmp, join(wd, 'partition.json'));
-    });
-    this.#queues.set(name, next.catch(() => {}));
-    return next;
+  async save(name: string, partition: Record<string, unknown>): Promise<void> {
+    const form = this.#form(name);
+    if (!form) return; // a name not kept is nothing
+    if (form === 'sealed') return this.#keep(name, (b) => ({ ...b!, partition }));
+    return this.#write(name, 'partition.json', JSON.stringify(partition) + '\n');
   }
 
   async record(name: string, record: WardRecord): Promise<void> {
-    if (!existsSync(join(this.#ward(name), 'seed'))) return;
-    await writeFile(join(this.#ward(name), 'ward.json'), JSON.stringify(record, null, 2) + '\n', { mode: 0o600 });
+    const form = this.#form(name);
+    if (!form) return;
+    if (form === 'sealed') return this.#keep(name, (b) => ({ ...b!, record }));
+    return this.#write(name, 'ward.json', JSON.stringify(record, null, 2) + '\n');
   }
 
   async take(name: string): Promise<Kept | undefined> {

package/harbor/quo-harbor.md

@@ -38,8 +38,9 @@ needs:
 
 | a ward is   | Mac, iPhone           | droplet                    | edge                    | browser tab            |
 | ----------- | --------------------- | -------------------------- | ----------------------- | ---------------------- |
-| seed        | Keychain              | `.env` or a secrets file   | the platform's secrets  | IndexedDB, per origin  |
-| partition   | app data, SQLite      | a file on disk             | Durable Object storage  | IndexedDB, per origin  |
+| seed        | a file, sealed        | `.env` or a secrets file   | the platform's secrets  | IndexedDB, per origin  |
+| partition   | a file, sealed        | a file on disk             | Durable Object storage  | IndexedDB, per origin  |
+| the key     | Keychain              | the environment, if any    | the platform's secrets  | none                   |
 | code        | the app bundle        | a folder                   | the deployed worker     | a bundle URL           |
 
 Envoys read their own secrets from the same secret store as the seed. A
@@ -60,14 +61,27 @@ it likes, so it may keep the secret branch apart from the data, by terrain:
 - **Split.** The bind branch goes to the secret store beside the seed, the
   rest to the data store. Fits a phone with a few relations; keychain items
   are small and a being with a thousand standings has a thousand key pairs.
-- **Wrapped.** The secret store holds one key per ward; the data store holds
-  the whole partition encrypted under it. Any size, one secret. The droplet
-  and edge answer, and it works on the phone too.
+- **Wrapped.** The secret store holds one key per harbor; the data store
+  holds each ward whole, seed, partition and record as one blob encrypted
+  under it. Any size, one secret. The droplet and edge answer, and it
+  works on the phone too.
 
 The ward never knows. It hands values and gets values back. A heir given away
 as an invitation is a live credential until it speaks, and on a device other
 apps share that is the argument for the secret store.
 
+Wrapped is what is built, and it is one piece, `seal.ts`: AES-GCM under a
+32-byte key, a fresh nonce each time, nonce and ciphertext together as hex,
+on WebCrypto so it runs wherever a store does. The key is the one secret a
+harbor reads from its terrain's secret store, named `QUO_SEED_KEY` on every
+terrain: a platform secret on the edge, the environment of a daemon on a
+device, handed to it from the Keychain by the app that spawned it. A
+droplet gives no key and its folder stays plain under its file modes. A
+store speaks one form, the one its key decides, and refuses a ward kept in
+the other by name, so a daemon started without its key, or with one
+against a plain folder, fails loudly and boots nothing. Sealing a plain
+folder is a deliberate operator command, never a boot's doing.
+
 ### Custody is a lease
 
 `packages/quo/SPEC.md` makes custody the harbor's vouch: two harbors over one
@@ -168,7 +182,10 @@ Two kinds of harbor exist in the world, and every pair reduces to them:
 | browser tab  | no            | yes      | while open              | itself   |
 
 A ward on a dialer is reached only if its harbor dialed first and something
-holds that line open. A phone's ask must survive a push wake-up. A tab is a
+holds that line open. A phone's ask must survive a push wake-up, and a
+device that comes back from sleep tells its dialer so, `wake`, since the
+system closes a sleeping socket without a word; `packages/quo/SPEC.md` says
+what the dialer does with it. A tab is a
 device, and one seed never lives in two tabs.
 
 ## Transport by necessity
@@ -311,8 +328,10 @@ root as `/quo/`, with the trailing slash, which the door takes.
 The harbor core is the library's, `packages/quo/src/harbor/core.ts`, and so is
 the dialer, `packages/quo/src/harbor/dial.ts`; `packages/quo/SPEC.md` says what
 they are. Every harbor here extends the core and hands it three things: a
-**store**, the library's interface, with `files.ts` on a disk and `idb.ts` in a
-tab, each passing the library's store suite; a **loader**, the code half, a
+**store**, the library's interface, with `files.ts` on a disk, plain as three
+files per ward or sealed as one blob when the daemon holds `QUO_SEED_KEY`,
+and `idb.ts` in a tab, each passing the library's store suite, the files
+store in both forms; a **loader**, the code half, a
 module from a folder on a daemon and the bundle in a tab; and a **lease**, a pid
 file on disk and a web lock on the database name in a tab, so a second tab on
 one origin meets the lock and is a screen. The disk harbor, `disk.ts`, is the
@@ -349,13 +368,13 @@ second harbor over one database does not boot.
 is the harbor. The platform runs one instance of it at a time, which is
 the lease and the single writer every ward needs. Its storage is the
 store, `storage.ts`: one row per ward, seed, partition and record, with the
-seed sealed under a key from the platform's secrets, `QUO_SEED_KEY`, so the
-storage holds ciphertext and the secret store holds the one key, as the
-table above says. The deployed worker is the code, the built-in beings and
-whatever it hands in. It is a listener and never a dialer: reached by
-request at `<origin>/h/<name>/quo`, holding the sockets dialers open to it
-on the platform's own socket pair, the rendezvous for them, awake per
-request and kept awake by a held socket.
+seed sealed by `seal.ts` under a key from the platform's secrets,
+`QUO_SEED_KEY`, so the storage holds ciphertext and the secret store holds
+the one key, as the table above says. The deployed worker is the code, the
+built-in beings and whatever it hands in. It is a listener and never a
+dialer: reached by request at `<origin>/h/<name>/quo`, holding the sockets
+dialers open to it on the platform's own socket pair, the rendezvous for
+them, awake per request and kept awake by a held socket.
 
 Its owner door is a route, not a socket, because the platform has no local
 process: the root is whoever holds `QUO_ROOT`, a platform secret, and the
@@ -384,6 +403,30 @@ hold on every terrain; the listener half is the terrain's own, `ws` on
 Node and the socket pair on the edge, and stays where the terrain is. What
 the library takes, when it takes the reach, is the framing and the dialer.
 
+## The phone, as built
+
+`capacitor.ts` is the store on a phone, the wrapped form over Capacitor's
+Filesystem plugin and a secure-storage plugin: one key per harbor in the
+Keychain, marked this device only so it never travels in a backup, and one
+sealed file per ward, seed, partition and record as one blob, in the
+folder iCloud does not copy. The seal is `seal.ts`, the same piece the
+daemon and the edge use. Opening the store is where custody is decided,
+since a phone's backup is the one copy nobody makes on purpose: a key with
+no folder is a reinstall, and the stale key is deleted; a folder with no
+key is a restore to another device, and the unreadable files are deleted;
+either way the harbor starts fresh and there is never a twin. The app that
+holds the store is `packages/app/`, which the dock does not know.
+
+The proof is `packages/dock/test/terrain/ios.test.ts`, behind
+`npm run check:terrain`: the store suite, untouched, and the custody rule,
+run inside the real app in the iOS Simulator against a real Keychain and a
+real folder. The app is synced with the test's origin as its page, built
+with xcodebuild, installed fresh and launched with simctl; the page loads
+the bundled exercise, `native.ts`, runs it and posts the list back. Two
+things the plugins taught, held in the store: the secure store keeps JSON,
+so a value is read with the call that parses; and mkdir refuses a folder
+that exists, recursive or not.
+
 ## The link
 
 An invitation carries the ward pk of the world that minted it, and not where

package/harbor/seal.ts

@@ -0,0 +1,26 @@
+// SPDX-License-Identifier: Apache-2.0
+// The seal: what a store does to a ward's bytes before they rest on a data
+// store, under one key the secret store holds. One piece with three users,
+// the edge under the platform's secret, the daemon under a key from its
+// environment, the phone under a key from the Keychain. AES-GCM under a
+// 32-byte key, a fresh nonce each time, nonce and ciphertext together as
+// hex. WebCrypto only, so it runs wherever a store does.
+import { arithmetic } from '@quo-systems/quo/ward';
+
+const { hex, unhex } = arithmetic;
+// Bytes as the platform's crypto wants them: over a plain ArrayBuffer.
+const plain = (b: Uint8Array): Uint8Array<ArrayBuffer> => new Uint8Array(b);
+
+export async function sealKey(secret: string): Promise<CryptoKey> {
+  if (!/^[0-9a-f]{64}$/.test(secret)) throw new Error('a seal key is 32 bytes as hex');
+  return crypto.subtle.importKey('raw', plain(unhex(secret)), 'AES-GCM', false, ['encrypt', 'decrypt']);
+}
+export async function seal(key: CryptoKey, bytes: Uint8Array): Promise<string> {
+  const iv = crypto.getRandomValues(new Uint8Array(12));
+  const ct = new Uint8Array(await crypto.subtle.encrypt({ name: 'AES-GCM', iv }, key, plain(bytes)));
+  return hex(iv) + hex(ct);
+}
+export async function open(key: CryptoKey, sealed: string): Promise<Uint8Array> {
+  const b = plain(unhex(sealed));
+  return new Uint8Array(await crypto.subtle.decrypt({ name: 'AES-GCM', iv: b.subarray(0, 12) }, key, b.subarray(12)));
+}

package/human/door.ts

@@ -5,11 +5,11 @@
 // Quo's page and not the estate's: it says what this is and that a world
 // here is entered by a link someone sends you, and it asks for nothing,
 // since there is nothing a stranger could type that would let them in. A
-// world that wants a face of its own has a public being with a look, or
-// its own page on its own origin; this is the default and nothing more.
-// Pure, strings in and strings out, under the tab's policy: no script, no
-// image that is not a data URI, styles from the one stylesheet.
-import { escape } from './html.ts';
+// world that wants a face of its own has a public being with a page and a
+// look, or its own page on its own origin; this is the default and nothing
+// more. It is the first page written in the grammar, `tree.ts`, painted
+// with nobody behind it: no ask, no answer, no standing.
+import { paint, nobody, type Node } from './tree.ts';
 
 // The mark: a ring with a gap, one being's voice reaching another's door.
 const MARK =
@@ -20,7 +20,20 @@ const MARK =
 
 export type Door = { world?: string; host: string };
 
+export function doorTree(at: Door): Node {
+  return {
+    kind: 'stack',
+    of: [
+      { kind: 'image', src: MARK, alt: '' },
+      { kind: 'text', text: 'quo', role: 'title' },
+      { kind: 'text', text: at.world ? `${at.world} at ${at.host}` : at.host, role: 'label' },
+      { kind: 'text', text: at.world ? 'This world is entered by invitation.' : 'The worlds here are entered by invitation.', role: 'lead' },
+      { kind: 'text', text: 'An invitation is a link someone sends you. Open it here, and you are in: no account, no password, nothing to type. What you can do inside is what the world shows you, and it is yours to keep on this device.' },
+      { kind: 'text', text: 'Nothing on this page asks anything of you. If you were sent here without a link, ask the person who sent you for one.', role: 'quiet' },
+    ],
+  };
+}
+
 export function door(at: Door): string {
-  const where = at.world ? `<p class="where">${escape(at.world)} <span>at ${escape(at.host)}</span></p>` : `<p class="where">${escape(at.host)}</p>`;
-  return `<main class="door"><img class="mark" alt="" src="${MARK}"><h1>quo</h1>${where}<p class="lead">${at.world ? 'This world is entered by invitation.' : 'The worlds here are entered by invitation.'}</p><p>An invitation is a link someone sends you. Open it here, and you are in: no account, no password, nothing to type. What you can do inside is what the world shows you, and it is yours to keep on this device.</p><p class="quiet">Nothing on this page asks anything of you. If you were sent here without a link, ask the person who sent you for one.</p></main>`;
+  return `<main class="door">${paint(doorTree(at), nobody)}</main>`;
 }

package/human/html.ts

@@ -12,6 +12,7 @@
 import type { Ask, Blueprint, Json, JsonObject } from '@quo-systems/quo';
 import { SILENCE_TEXT, UNREACHED_TEXT, wordText, type Word } from '../beings/side.ts';
 import { hint, hintFor, sanitise, groups as grouped, type Look, type Hint } from '../beings/look.ts';
+import { paint, type Node, type Painter } from './tree.ts';
 
 // One property of an input schema, as the form needs it.
 export type Property = { type?: string; description?: string; enum?: Json[]; format?: string; default?: Json };
@@ -140,6 +141,7 @@ export function face(w: Word, schema?: JsonObject): string {
 export type Model = {
   blueprint: Blueprint | null; // her describe for this human, or nothing yet
   look: Look; // her own look, from her `look` ask, or nothing
+  tree: Node | null; // her page, from her `page` ask, or nothing: then her asks are painted as forms
   notice: string; // one line about where the human stands: in, not in, an error before an ask
   answers: Record<string, Word>; // the last answer per ask, shown under its form
   pushes: JsonObject[]; // every push from the world, newest last
@@ -179,6 +181,9 @@ export function ordered(asks: Ask[], l: Look | undefined): Ask[] {
 
 export { hintFor };
 
+// The asks that are presentation and never a form: her look and her page.
+const PRESENTATION = new Set(['look', 'page']);
+
 export function page(m: Model): string {
   const bp = m.blueprint;
   const one = (l: Look | undefined, prefix = '') => (a: Ask) => {
@@ -188,25 +193,44 @@ export function page(m: Model): string {
   };
   const groups = grouped(bp);
   const taken = new Set(Object.values(groups).flatMap((g) => g.asks ?? []));
-  const own = bp ? ordered(bp.asks.filter((a) => !taken.has(a.name) && a.name !== 'look'), m.look).map(one(m.look)).join('') : '';
-  const far = bp
-    ? Object.entries(groups)
-        .map(([id, g]) => {
-          const asks = bp.asks.filter((a) => g.asks?.includes(a.name));
-          if (!asks.length) return '';
-          const kept = sanitise(g.look);
-          const l = look(kept);
-          const prefix = `${id}-`;
-          const want = (kept.order ?? []).map((n) => prefix + n);
-          const inOrder = ordered(asks, { order: want });
-          return `<section class="standing" data-standing="${escape(id)}"${l.style}>${l.head || `<h2>${escape(id)}</h2>`}${inOrder.map(one(kept, prefix)).join('')}</section>`;
-        })
-        .join('')
-    : '';
-  const asks = own + far;
+  const section = (id: string): string => {
+    const g = groups[id];
+    const asks = bp && g ? bp.asks.filter((a) => g.asks?.includes(a.name)) : [];
+    if (!asks.length) return '';
+    const kept = sanitise(g!.look);
+    const l = look(kept);
+    const prefix = `${id}-`;
+    const want = (kept.order ?? []).map((n) => prefix + n);
+    const inOrder = ordered(asks, { order: want });
+    return `<section class="standing" data-standing="${escape(id)}"${l.style}>${l.head || `<h2>${escape(id)}</h2>`}${inOrder.map(one(kept, prefix)).join('')}</section>`;
+  };
+  const far = Object.keys(groups).map(section).join('');
+  // Her page, when she answered one: painted from her tree, each name it
+  // uses looked up in her describe, so a page shows nothing her gate hid.
+  const painter: Painter = {
+    form: (name) => {
+      const a = bp?.asks.find((x) => x.name === name && !taken.has(x.name) && !PRESENTATION.has(x.name));
+      return a ? one(m.look)(a) : '';
+    },
+    answer: (name, as) => {
+      const a = bp?.asks.find((x) => x.name === name);
+      const w = a ? m.answers[name] : undefined;
+      if (!a || !w) return '';
+      if (w.word === 'object' && as === 'text') return `<div class="answer">${view(w.value === null || typeof w.value !== 'object' ? w.value : JSON.stringify(w.value))}</div>`;
+      if (w.word === 'object' && as === 'cards' && Array.isArray(w.value)) return `<div class="cards">${w.value.map((v) => `<div class="card">${view(v)}</div>`).join('')}</div>`;
+      if (w.word === 'object' && as === 'list' && Array.isArray(w.value)) return `<ul class="answer">${w.value.map((v) => `<li>${view(v)}</li>`).join('')}</ul>`;
+      return face(w, a.output);
+    },
+    standing: section,
+    standings: () => far,
+  };
+  const own = bp ? ordered(bp.asks.filter((a) => !taken.has(a.name) && !PRESENTATION.has(a.name)), m.look).map(one(m.look)).join('') : '';
+  const asks = m.tree ? `<div class="page">${paint(m.tree, painter)}</div>` : own + far;
   const shown = bp && bp.notes !== null && typeof bp.notes === 'object' && !Array.isArray(bp.notes) ? Object.fromEntries(Object.entries(bp.notes).filter(([k]) => k !== 'standings' && k !== 'name')) : bp?.notes;
   const notes = bp && shown !== null && shown !== undefined && !(typeof shown === 'object' && !Array.isArray(shown) && !Object.keys(shown).length) ? `<aside class="notes">${view(shown as Json)}</aside>` : '';
   const pushes = m.pushes.length ? `<section class="pushes"><h2>pushes</h2><ol>${m.pushes.map((p) => `<li>${view(p)}</li>`).join('')}</ol></section>` : '';
   const mine = look(m.look);
-  return `<header${mine.style}>${m.look.logo ? `<img class="logo" alt="" src="${m.look.logo}">` : ''}<h1>${escape(title(bp, m.look))}</h1><p class="notice">${escape(m.notice)}</p></header>${notes}<main${mine.style}>${asks}</main>${pushes}`;
+  // a page carries its own title, so the header keeps only the notice; a being painted as forms is headed by her name
+  const head = m.tree ? '' : `${m.look.logo ? `<img class="logo" alt="" src="${m.look.logo}">` : ''}<h1>${escape(title(bp, m.look))}</h1>`;
+  return `<header${mine.style}>${head}<p class="notice">${escape(m.notice)}</p></header>${notes}<main${mine.style}>${asks}</main>${pushes}`;
 }

package/human/local.ts

@@ -0,0 +1,26 @@
+// SPDX-License-Identifier: Apache-2.0
+// A being in the tab's own ward, as a subject the screen renders: a world's
+// code running on the device, booted from the bundle that world serves on
+// its origin. The side holds the object, as every side does, and speaks to
+// her door in-process under the tab's own asker: no standing, no relation,
+// since the local ward is the human's and she is on it. Her cells are in
+// the tab's store and migrate with the ward; her asks are the forms; her
+// page is computed from her cells at every digest, the same painter and the
+// same side as a far being's, so one grammar has two sources and no second
+// verb. A push never reaches her: nothing outside the tab holds her.
+import type { Answer, Blueprint, JsonObject } from '@quo-systems/quo';
+import type { Subject } from '../beings/side.ts';
+
+// The asker the tab speaks under to its own beings.
+export const TAB = 'tab';
+
+type Door = { answer(asker: { id: string }, method?: string, args?: JsonObject): Promise<unknown> };
+
+export function local(being: Door): Subject {
+  const me = { id: TAB };
+  return {
+    tools: async () => (await being.answer(me)) as Blueprint,
+    call: (name: string, args: JsonObject = {}): Promise<Answer> => being.answer(me, name, args) as Promise<Answer>,
+    ears: new Set(),
+  };
+}