@beltype/cicero 0.1.4 → 0.1.6

package/README.md

@@ -9,6 +9,8 @@ Cicero is a paged-media engine for the live browser. It cuts a document into pag
 | Import | What |
 | --- | --- |
 | `@beltype/cicero` | The host face: `ciceroEngine` (BelType's engine seam) and `rewriteDocumentSheets`. |
+| `@beltype/cicero/engine` | `ciceroEngine` alone, without the sheet rewriter and its css-tree: a host that only serves a page (BelType's CLI) loads this. |
+| `@beltype/cicero/flags` | `ciceroFlags` alone, the run-wide flags in common's shape. |
 | `@beltype/cicero/rewrite` | `rewriteDocumentSheets` alone, for a page: the host face also carries `ciceroEngine`, which imports node's `url` and so cannot load in a browser. |
 | `@beltype/cicero/client` | The page side: loading it sets `window.__beltypeCicero`, typed in `seam/handle.d.ts`. |
 | `@beltype/cicero/facsimile` | The embedded PDF page (`<object type="application/pdf">`). |

package/dist/seam/client.d.ts

@@ -110,6 +110,15 @@ export declare function run(opts?: {
         laid: number;
     } | null;
 }>;
+/**
+ * Let go of everything this client registered in the page, so a document that replaces it (`document.open()` keeps the `Window`, its `FontFaceSet` and its listeners) is not answered by this one's.
+ *
+ * It removes the `loadingdone` listener, stops the rim, drops the batch of late truth waiting to be answered and deletes the handle from the window, all before the first `await`. A run stopped at a page is let go and its pages stay on screen. A run under way with a pace (`until`) rejects with the let-go error at its next page, and a first run that has shown nothing puts the document back as it found it; one without a pace finishes and presents. When nothing is under way, the promise resolves, after the root's idle build, observer and window listeners and the facsimile's observer have been let go. A `run()` made afterwards is rejected by name. Calling it again is a no-op.
+ *
+ * @remarks **Host obligations.** The custom-element registry belongs to the window and is not released: the next document's `<beltype-root>`, `<beltype-page>` and PDF element are built from the classes this module defined, which keep no state about the document they were defined for. The handle is gone, and the next client module runs only under a URL the window has not imported (measured 2026-11-03: the same URL after `document.open()` does not run again, a keyed one does, and a second `customElements.define` of a name throws, which the three definitions guard against). The host keys the URL.
+ * @see SPEC.md Article XII.7
+ */
+export declare function release(): Promise<void>;
 /** THE HANDLE — `window.__beltypeCicero`, the host's one door onto the engine in the page. The calls are set at load; the doors onto the presentation are seated by every presentation ({@link seatDoors}), so they are absent before the first; `last` and `ledger` are the last run's. */
 export type Handle = {
     run: typeof run;
@@ -135,5 +144,6 @@ export type Handle = {
     addressOf?: (el: Element, word?: number) => Address | null;
     box?: (i: number) => Element | null;
     patch?: typeof patchBox;
+    release: typeof release;
 };
 export {};

package/dist/seam/client.js

@@ -65,8 +65,11 @@ let fontEpoch = 0;
 /** The document's face set, kept: it is the same object for the life of the document, and a test that watches how often the engine asks the document for it (progressive.test.js) counts the intake's and the driver's asks and no others. */
 const fonts = document.fonts;
 knowLoadedFaces(fonts);
-fonts.addEventListener('loadingdone', (event) => { if (bringsNewFace(event))
-    fontEpoch++; });
+const countFaces = (event) => { if (bringsNewFace(event))
+    fontEpoch++; };
+fonts.addEventListener('loadingdone', countFaces);
+/** Set by {@link release}: this module instance is finished with its document, and answers no more. A flag of this instance, never of the classes it defined, which the next document's module scripts inherit from the window. */
+let released = false;
 /**
  * The run's conditions, as one string (*a break decision is valid only under render-identical conditions* (I5), applied to the memo — Decision one of *the run resumes from an entry*): the measuring realm's media environment — the viewport, the device pixel ratio, the colour scheme — the text of the stylesheets the document wears, as the rewrite and the presentation left them (the document's own: a sheet inside an `<svg>` or inside a copy the engine made is a box's, and what it changes is that box's extent, which the rim hears — *the conditions are the sheets of the document*, 2026-10-22), and the font epoch the run began under, and how many presenters are registered (*a copy may be presented*: a presenter is a condition of every copy, and a registration after a run is seen here as the change it is). The delivered read values are the driver's to compare, not this string's. Taken after a presentation and again before the next run, so the two readings see the same engine litter (the press `<style>` is left out) and a difference between them is the host's own.
  * @param epoch - {@link fontEpoch} as the run began, which is not the count at the moment of asking: a face that arrived during the run must show at the next one.
@@ -152,15 +155,16 @@ function patchBox(index, path, el) {
         boxes[index] = el;
     }
     rim?.add(boxes[index], top); // the replacement may hold a picture still loading, or an element not yet defined
-    const address = window.__beltypeCicero.addressOf(el);
+    const address = handle.addressOf(el);
     if (address)
         edited.push(address);
     return address;
 }
 /** THE RIM, from the intake until the frame lets the run go (`rim.js`, *late truth is an edit*): the subscription to the facts that arrive after a measure. `null` before the intake. */
 let rim = null;
+function stopRim() { rim?.stop(); rim = null; }
 /**
- * The rim's default action (*late truth is an edit*, Decision four, 2026-10-13): what a signal the host did not cancel does. Signals are coalesced over one animation frame into one batch; a batch that holds a font is one whole run (a face is a condition of every box), and any other — an image, an element, a store's write, a box's size — is one `run({ resumeAt })` per box, the earliest in the document first and one at a time, since convergence is believed past one edited box. A signal that arrives while a run is under way waits for it; a run stopped at a page is let go and the answer stays within the pages it had cut, as an edit's does. The runs go through the host's own door, `window.__beltypeCicero.run`, so a host that wraps it sees the rim's runs as it sees its own.
+ * The rim's default action (*late truth is an edit*, Decision four, 2026-10-13): what a signal the host did not cancel does. Signals are coalesced over one animation frame into one batch; a batch that holds a font is one whole run (a face is a condition of every box), and any other — an image, an element, a store's write, a box's size — is one `run({ resumeAt })` per box, the earliest in the document first and one at a time, since convergence is believed past one edited box. A signal that arrives while a run is under way waits for it; a run stopped at a page is let go and the answer stays within the pages it had cut, as an edit's does. The runs go through the host's own door, the `run` property of the handle object this module put on the window, read at each call, so a host that replaces that property (the essay's init scripts and tests do) sees the rim's runs as it sees its own. A host that replaces the whole object `window.__beltypeCicero` does not: the rim keeps calling this module's own handle (so a client that was released, or one a newer client replaced, never reaches into the next document's), and nothing in the repositories searched does that.
  *
  * A box heard through a piece a page draws it with (*a fragment announces its own size*, 2026-10-22) carries the page it was heard on, and its resume is at the address that page begins at, the earliest such page; every other box carries `null` and is resumed at its own address.
  */
@@ -200,13 +204,13 @@ async function lateTruth() {
     while (batch) {
         const { font, boxes } = batch;
         batch = null;
-        const h = window.__beltypeCicero;
+        const h = handle;
         try {
             /** One step, after any run under way has ended; `null` where the run before left nothing to answer. */
             const ready = async () => {
                 while (live && !live.gate)
                     await live.finished;
-                return previous?.composed ?? null;
+                return released ? null : previous?.composed ?? null;
             };
             if (font) {
                 const composed = await ready();
@@ -269,6 +273,8 @@ function reached(session) {
 /** The driver's `pace`: called after every page of the first layout. It stops the run where the host asked it to stop — by returning a promise the next call releases — and otherwise lets it go on without a pause. */
 function pacer(session, progress) {
     session.progress = progress;
+    if (session.cancelled)
+        return Promise.reject(LET_GO); // a run released while it measures stops at its next page
     if (!reached(session))
         return undefined;
     return new Promise((resolve, reject) => {
@@ -324,8 +330,7 @@ async function takeIntake(relaxDpr) {
             for (const [el, parent, next] of moved.toReversed())
                 parent?.insertBefore(el, next);
             root.remove();
-            rim?.stop();
-            rim = null;
+            stopRim();
             presented = null;
         }
     };
@@ -354,7 +359,7 @@ async function cutTo(el) {
     if (!session)
         return;
     if (session.gate)
-        await window.__beltypeCicero.run({ composed: session.composed, until: el });
+        await handle.run({ composed: session.composed, until: el });
     else
         await session.finished;
 }
@@ -407,7 +412,7 @@ function show(session, { account, index, total, from, to, resume }) {
 /** The host's doors onto the presentation, seated on the handle after every presentation (*the engine answers the page*, 2026-09-04; beltype#19, beltype#20). A verb, never the index: the tokenization stays in the realm it is checked in, and a verb survives the parked horizon of the engine leaving this realm where an exposed index holding live DOM references would not. */
 function seatDoors(blocks) {
     const { root } = presented;
-    const h = window.__beltypeCicero;
+    const h = handle;
     h.pageOf = (el, charOffset = 0) => root.pageOf(el, charOffset);
     // The windowing's doors (*only the pages near the reader are built*, 2026-10-12): the pages near the reader are built with the presentation and the rest as the reader nears them or the browser is idle, so a host about to read a page asks for it first. `reveal` builds the page that begins a source element and scrolls its drawn copy into view; `buildPage` builds one page; `buildAll` builds every page and is awaited by whoever reads them all (the printer, a gate); `built` says how many pages have their content.
     h.reveal = (el, options) => root.reveal(el, options);
@@ -452,6 +457,8 @@ function seatDoors(blocks) {
  * @returns what the console line reports; the presented pages stay live in the DOM. `pages` is how many are cut; `complete` whether that is the document's end. `resumed` names the pages cut again, from 1: `from` through `to`, with `shift` the pages the run added (or, negative, removed) and `kept` the prior pages after `to` left standing. `why` is a plain sentence, set exactly when `resumed` is `null`: the first run on a frame, no `resumeAt`, another mode, conditions that moved (and which part), a block count that moved, or a reference whose page number sent the run round again. `composition` is the composed mode's count (`null` in the default): `misses` the paragraphs composed, `hits` the ones found already composed, `blocks` their sum, and `laid` the top-level blocks cloned and measured to read their widths (the rest were answered by the cache whole).
  */
 export function run(opts) {
+    if (released)
+        return Promise.reject(new Error('BelType/Cicero: this client was released; the next document loads its own'));
     const call = runOnce(opts);
     calls.add(call);
     const answered = () => calls.delete(call);
@@ -543,12 +550,14 @@ async function runOnce({ composed = false, resumeAt = null, until = null, layer
         ...(target != null ? { pace: (progress) => pacer(session, progress) } : {})
     });
     live = session;
+    if (released)
+        session.cancelled = true; // called before the release, so the first page it cuts is its last
     return settle(session, t0);
 }
 async function carryOn(session, until, t0) {
     session.target = until;
     if (reached(session))
-        return window.__beltypeCicero.last; // already cut as far as it is asked
+        return handle.last; // already cut as far as it is asked
     dress(false);
     presented.root.hold();
     const settled = settle(session, t0);
@@ -569,6 +578,8 @@ async function settle(session, t0) {
     catch (error) {
         if (live === session)
             live = null;
+        if (error === LET_GO && released && !session.partial && session.fresh)
+            presented?.undo(); // a first run released before it showed a page
         if (error !== LET_GO) {
             forcingMemo.clear(); // a run that threw filled it with reads no one vouched for
             if (!session.partial && session.fresh)
@@ -596,11 +607,11 @@ async function settle(session, t0) {
         edited.splice(0, session.taken);
         session.taken = 0;
         compositionCache.conditions = conditions;
-        window.__beltypeCicero.last = { ...answerOf(session, t0, progress, resumed), complete: false };
-        window.__beltypeCicero.ledger = progress.account;
+        handle.last = { ...answerOf(session, t0, progress, resumed), complete: false };
+        handle.ledger = progress.account;
         console.info(`BelType/Cicero: ${k} pages cut so far, in ${Math.round(performance.now() - t0)} ms — the run is stopped at a page and goes on when asked`);
         await reloadKnownFaces(); // the presentation re-created a layered frame's faces, and the next slice measures in them
-        return window.__beltypeCicero.last;
+        return handle.last;
     }
     // Complete: the run reached the document's end.
     const result0 = outcome.result;
@@ -633,9 +644,9 @@ async function settle(session, t0) {
     session.taken = 0;
     compositionCache.conditions = conditions; // the reading after the presentation, which is the one the next call sees (the first call's was taken before there was any litter to leave out)
     // A host embedding this document (the editing tools' preview iframe, same-origin) reads its own render condition here rather than the devtools console nobody opens — set before returning, on the same handle the bootstrap already holds.
-    window.__beltypeCicero.last = result;
+    handle.last = result;
     // The run's Ledger itself, beside the summary and not inside it: `last` is read across frames and serialised by hosts, and the account holds live `box` pointers that no host should be handed by accident. A venue test reads it in-page to compare two runs entry by entry (*the run resumes from an entry*).
-    window.__beltypeCicero.ledger = account;
+    handle.ledger = account;
     if (live === session)
         live = null;
     // The presentation re-created a layered frame's faces, and a host reads the pages next: their loads are STARTED here and not awaited, so they are `loading` (and `document.fonts.ready` waits for them) by the time the call answers. Awaiting them put a task between the presentation and the answer, and a host that puts the caret back when the run answers (the studio experiment) lost a keystroke typed in that gap: the browser had no caret to type at, and fired no beforeinput.
@@ -654,5 +665,36 @@ function answerOf(session, t0, progress, resumed) {
         composition: session.composed ? { blocks: compositionCache.hits + compositionCache.misses, hits: compositionCache.hits, misses: compositionCache.misses, laid: compositionCache.laid } : null
     };
 }
-window.__beltypeCicero = { run, present,
+// The shell's bootstrap reaches the engine through this handle. Setting it is the module's only load-time effect — rendering waits to be asked, because the bootstrap knows when the document has stopped changing and this module does not. `pageOf` is seated by `run()` rather than here: before a presentation there is no page to answer, and a stub that answered `null` for that reason would be indistinguishable from the refusals that mean something.
+// `compositionCache` is the harness's door and the product's none: a venue test clears it to ask for a cold composition in a frame that has composed before, which is the only way a resumed run can be compared with a fresh one that did not borrow its records.
+// `forcingMemo` and `forgetJudgedSheets` are the same kind of door, for the same comparison: a venue test empties them to ask what a run costs, and what it cuts, when it borrows nothing from the runs before it (*the forced-break index is kept across runs*).
+// `present` is the host's say over what a copy of an element is (*a copy may be presented*, `src/presenters.js`): `present(selector, make)`, registered before the first run. One registered after a run changes the conditions key, so the next call is a whole run on a presented frame — nothing a presenter touched is reused — and a run stopped at a page goes on under the presenters it began with, its pages already built keeping the elements they were built with.
+// `measured` is the same kind of door again (*a box announces its own size*): a venue test asks what height the last run measured for a top-level box, the number the `size` kind compares a presented box's observed size with.
+// `table` is the geometry the intake captured from the author's `@page` rules, margin boxes and their `content` included, or null before an intake: the root clears every margin box's `content` from the CSSOM when it presents, so a second host in the same document, whose pages are not the root's, cannot read a table of its own from the sheets and takes this one (see CHANGELOG 2026-10-28).
+/**
+ * Let go of everything this client registered in the page, so a document that replaces it (`document.open()` keeps the `Window`, its `FontFaceSet` and its listeners) is not answered by this one's.
+ *
+ * It removes the `loadingdone` listener, stops the rim, drops the batch of late truth waiting to be answered and deletes the handle from the window, all before the first `await`. A run stopped at a page is let go and its pages stay on screen. A run under way with a pace (`until`) rejects with the let-go error at its next page, and a first run that has shown nothing puts the document back as it found it; one without a pace finishes and presents. When nothing is under way, the promise resolves, after the root's idle build, observer and window listeners and the facsimile's observer have been let go. A `run()` made afterwards is rejected by name. Calling it again is a no-op.
+ *
+ * @remarks **Host obligations.** The custom-element registry belongs to the window and is not released: the next document's `<beltype-root>`, `<beltype-page>` and PDF element are built from the classes this module defined, which keep no state about the document they were defined for. The handle is gone, and the next client module runs only under a URL the window has not imported (measured 2026-11-03: the same URL after `document.open()` does not run again, a keyed one does, and a second `customElements.define` of a name throws, which the three definitions guard against). The host keys the URL.
+ * @see SPEC.md Article XII.7
+ */
+export async function release() {
+    if (released)
+        return;
+    released = true;
+    fonts.removeEventListener('loadingdone', countFaces);
+    stopRim();
+    batch = null;
+    if (window.__beltypeCicero === handle)
+        delete window.__beltypeCicero;
+    await Promise.allSettled([...calls]); // a call made before the release has no session yet: it gets one, cancelled, in `runOnce`
+    if (live)
+        await letGo();
+    stopRim(); // the intake of a call that was under way made one after the first stop
+    presented?.root.dispose(); // last, so a presentation that finished above does not arm what it just let go
+    facsimile?.dispose();
+}
+const handle = { run, present, release,
     settled, compositionCache, forcingMemo, forgetJudgedSheets: () => { judgedSheets = new WeakMap(); }, measured: (el) => previous?.result.heights?.get(el), get table() { return presented?.table ?? null; } };
+window.__beltypeCicero = handle;

package/dist/seam/facsimile.d.ts

@@ -38,6 +38,8 @@ export declare function locate(source: Element): {
  * @remarks The element has no child until {@link draw} gives it its canvas (*a facsimile's copy holds its box off screen*, CHANGELOG 2026-10-28). An `<object>` with a child and no `data` decides at its first layout to render the child, which is a reattach of its layout tree, and on a page the browser skips (`content-visibility: auto`, *a page is contained*) a read from script lays the subtree out for the length of the read, drops the reattach when it puts the subtree back, and leaves the copy with no box at all. Measured 2026-10-28: the same copy with no child keeps its box on every read.
  */
 export declare function make(source: Element): HTMLObjectElement;
+/** Let go of the observer, which the next element to connect makes again: the element's class is the window's and outlives the client that defined it. */
+export declare function dispose(): void;
 /**
  * Define the element, read the size of every page the document embeds and register the presenter — before the first run (the intake calls this first, and awaits it), because a presenter is a condition of every copy and a registration after a run is a whole run.
  *

package/dist/seam/facsimile.js

@@ -165,6 +165,8 @@ const watcher = () => seen ??= new IntersectionObserver((entries) => {
             draw(entry.target);
         }
 }, { rootMargin: '300px' });
+/** Let go of the observer, which the next element to connect makes again: the element's class is the window's and outlives the client that defined it. */
+export function dispose() { seen?.disconnect(); seen = null; }
 /** The drawn page, at the box's width. The canvas takes the page's own ratio and the CSS says how it sits (`object-fit: contain`, in the box the author sized). */
 async function draw(el) {
     if (!el.isConnected || el.closest('#__beltype-measure'))

package/dist/seam/flags.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Cicero's run-wide flags, in `@beltype/common`'s shape.
+ *
+ * @remarks
+ * One today: `composed`. The other options of a `run()` call — `until`, `resumeAt` and `layer` — belong to a single call, not to a run, and are not flags; nor is a constant someone may want to tune later, until someone asks.
+ *
+ * This is the node face's table. The client runs in a tab with no way to resolve `@beltype/common`, so `client.ts` keeps the literal `composed = false` as `run()`'s default, and `test/flags.test.ts` pins that literal to this table's default.
+ *
+ * @packageDocumentation
+ */
+export declare const ciceroFlags: {
+    readonly owner: string;
+    readonly table: {
+        /** Default `false`: the browser sets the lines and Cicero reads what it produced. `true` gives them to the Compositor (*the composed mode reaches the operator*, 2026-09-10). */
+        composed: {
+            values: boolean[];
+            default: boolean;
+        };
+    };
+    readonly defaults: import("@beltype/common/flags").FlagValues<{
+        /** Default `false`: the browser sets the lines and Cicero reads what it produced. `true` gives them to the Compositor (*the composed mode reaches the operator*, 2026-09-10). */
+        composed: {
+            values: boolean[];
+            default: boolean;
+        };
+    }>;
+    resolve(given?: Partial<import("@beltype/common/flags").FlagValues<{
+        /** Default `false`: the browser sets the lines and Cicero reads what it produced. `true` gives them to the Compositor (*the composed mode reaches the operator*, 2026-09-10). */
+        composed: {
+            values: boolean[];
+            default: boolean;
+        };
+    }>> | undefined): import("@beltype/common/flags").FlagValues<{
+        /** Default `false`: the browser sets the lines and Cicero reads what it produced. `true` gives them to the Compositor (*the composed mode reaches the operator*, 2026-09-10). */
+        composed: {
+            values: boolean[];
+            default: boolean;
+        };
+    }>;
+    parse(name: string, raw: string): unknown;
+};

package/dist/seam/flags.js

@@ -0,0 +1,15 @@
+/**
+ * Cicero's run-wide flags, in `@beltype/common`'s shape.
+ *
+ * @remarks
+ * One today: `composed`. The other options of a `run()` call — `until`, `resumeAt` and `layer` — belong to a single call, not to a run, and are not flags; nor is a constant someone may want to tune later, until someone asks.
+ *
+ * This is the node face's table. The client runs in a tab with no way to resolve `@beltype/common`, so `client.ts` keeps the literal `composed = false` as `run()`'s default, and `test/flags.test.ts` pins that literal to this table's default.
+ *
+ * @packageDocumentation
+ */
+import { defineFlags } from '@beltype/common/flags';
+export const ciceroFlags = defineFlags('cicero', {
+    /** Default `false`: the browser sets the lines and Cicero reads what it produced. `true` gives them to the Compositor (*the composed mode reaches the operator*, 2026-09-10). */
+    composed: { values: [false, true], default: false }
+});

package/dist/seam/host.d.ts

@@ -2,9 +2,10 @@
  * The host face, `@beltype/cicero`: what a host that is not BelType's CLI needs to paginate a document with Cicero.
  *
  * @remarks
- * `ciceroEngine` is the engine's side of BelType's engine seam (its head, its bootstrap, its vendored assets); `rewriteDocumentSheets` makes a document's sheets Cicero's (the `@page` world renamed, optionally under a layer the host names). The page-side API is the client handle, `window.__beltypeCicero`, typed in `seam/handle.d.ts`.
+ * `ciceroEngine` is the engine's side of BelType's engine seam (its head, its bootstrap, its vendored assets); `rewriteDocumentSheets` makes a document's sheets Cicero's (the `@page` world renamed, optionally under a layer the host names). A host that needs one of them alone imports the subpath (`@beltype/cicero/engine`, `@beltype/cicero/flags`, `@beltype/cicero/rewrite`), since this face loads all three and the sheet rewriter brings css-tree with it (about 24 ms in node). The page-side API is the client handle, `window.__beltypeCicero`, typed in `seam/handle.d.ts`.
  *
  * @packageDocumentation
  */
 export { ciceroEngine } from './index.ts';
 export { rewriteDocumentSheets } from './rewrite-document.ts';
+export { ciceroFlags } from './flags.ts';

package/dist/seam/host.js

@@ -2,9 +2,10 @@
  * The host face, `@beltype/cicero`: what a host that is not BelType's CLI needs to paginate a document with Cicero.
  *
  * @remarks
- * `ciceroEngine` is the engine's side of BelType's engine seam (its head, its bootstrap, its vendored assets); `rewriteDocumentSheets` makes a document's sheets Cicero's (the `@page` world renamed, optionally under a layer the host names). The page-side API is the client handle, `window.__beltypeCicero`, typed in `seam/handle.d.ts`.
+ * `ciceroEngine` is the engine's side of BelType's engine seam (its head, its bootstrap, its vendored assets); `rewriteDocumentSheets` makes a document's sheets Cicero's (the `@page` world renamed, optionally under a layer the host names). A host that needs one of them alone imports the subpath (`@beltype/cicero/engine`, `@beltype/cicero/flags`, `@beltype/cicero/rewrite`), since this face loads all three and the sheet rewriter brings css-tree with it (about 24 ms in node). The page-side API is the client handle, `window.__beltypeCicero`, typed in `seam/handle.d.ts`.
  *
  * @packageDocumentation
  */
 export { ciceroEngine } from './index.js';
 export { rewriteDocumentSheets } from './rewrite-document.js';
+export { ciceroFlags } from './flags.js';

package/dist/seam/rewrite-document.d.ts

@@ -9,6 +9,8 @@
  *
  * **With a layer named, every sheet of the document goes into it** (*the author's sheets in a layer the host names*, 2026-10-17): a `<style>` holds its text wrapped (`wrapInLayer`), and every `<link>` becomes a `<style>` of its wrapped text at the same position. **The address is not kept, on a measurement**: `<style>@import url(<the href>) layer(<name>)</style>` would keep it, and Chromium fetches an imported sheet once for every frame that imports it, but it parses it again in each (measured 2026-10-17 in the studio experiment, an 11 MB sheet in four same-origin frames: +9 MB a further frame linked, +61–74 MB imported), so an import buys a host no shared copy a `<style>` does not, and it hides the sheet from every walk that reads `document.styleSheets`' top level (`@page`, `@font-face` for a printer, `position: fixed`). A host that shared a linked sheet's parsed copy across frames loses that sharing under a layer, and the loss is the host's to weigh. **And the engine's root line-height provision moves into the engine's own layer**, the first one: unlayered, it would outrank every rule of the author's now-layered sheets, the author's own root line-height among them, where it was written to lose every tie. **And the order of the two layers is stated first in the head**, `@layer <the engine's>, <the host's>;` in the engine's own layers element (made where it is not there yet): a layer's place is where it is first named, and a host that seats the author's sheets before the engine's head (the HTML lane, the studio, its print frame) would otherwise name the author's layer before the engine's, putting the engine's `!important` trimming below an author's and its provision above the author's normal rules. Without a layer nothing here changes.
  *
+ * **A replaced `<link>`'s relative addresses are written against its href** (`rebaseUrls`), because a `<style>` resolves them against the document.
+ *
  * **The `<link>` is replaced, not merely disabled.** A disabled link leaves the browser's own copy of the rules out of the CSSOM but leaves the element in the document, and the next thing to walk `document.styleSheets` would meet two sheets where the author wrote one.
  *
  * @packageDocumentation

package/dist/seam/rewrite-document.js

@@ -9,11 +9,13 @@
  *
  * **With a layer named, every sheet of the document goes into it** (*the author's sheets in a layer the host names*, 2026-10-17): a `<style>` holds its text wrapped (`wrapInLayer`), and every `<link>` becomes a `<style>` of its wrapped text at the same position. **The address is not kept, on a measurement**: `<style>@import url(<the href>) layer(<name>)</style>` would keep it, and Chromium fetches an imported sheet once for every frame that imports it, but it parses it again in each (measured 2026-10-17 in the studio experiment, an 11 MB sheet in four same-origin frames: +9 MB a further frame linked, +61–74 MB imported), so an import buys a host no shared copy a `<style>` does not, and it hides the sheet from every walk that reads `document.styleSheets`' top level (`@page`, `@font-face` for a printer, `position: fixed`). A host that shared a linked sheet's parsed copy across frames loses that sharing under a layer, and the loss is the host's to weigh. **And the engine's root line-height provision moves into the engine's own layer**, the first one: unlayered, it would outrank every rule of the author's now-layered sheets, the author's own root line-height among them, where it was written to lose every tie. **And the order of the two layers is stated first in the head**, `@layer <the engine's>, <the host's>;` in the engine's own layers element (made where it is not there yet): a layer's place is where it is first named, and a host that seats the author's sheets before the engine's head (the HTML lane, the studio, its print frame) would otherwise name the author's layer before the engine's, putting the engine's `!important` trimming below an author's and its provision above the author's normal rules. Without a layer nothing here changes.
  *
+ * **A replaced `<link>`'s relative addresses are written against its href** (`rebaseUrls`), because a `<style>` resolves them against the document.
+ *
  * **The `<link>` is replaced, not merely disabled.** A disabled link leaves the browser's own copy of the rules out of the CSSOM but leaves the element in the document, and the next thing to walk `document.styleSheets` would meet two sheets where the author wrote one.
  *
  * @packageDocumentation
  */
-import { rewriteSheet, rewriteNote, isLayerName } from './rewrite.js';
+import { rewriteSheet, rewriteNote, isLayerName, rebaseUrls } from './rewrite.js';
 import { CICERO_INTERFACE, CICERO_PROVISION, LAYER as ENGINE_LAYER, WORDS_RULES, hasWord } from '../src/data-beltype.js';
 import { LAYERS_ID } from '../src/dressing.js';
 /** Is this URL on the document's own origin? A relative href resolves against the document, so the constructor answers both cases at once. */
@@ -112,10 +114,12 @@ export async function rewriteDocumentSheets(doc, judged = new WeakMap(), { layer
             judged.set(node, out.text); // the text the next run will find there
             return;
         }
+        // A `<style>` resolves its addresses against the document, so the sheet's own are written out first.
+        const text = rebaseUrls(out.text, new URL(node.getAttribute('href'), doc.baseURI).href);
         const style = doc.createElement('style');
-        style.textContent = out.text;
+        style.textContent = text;
         node.replaceWith(style); // in place, so the sheet keeps its seat in the cascade
-        judged.set(style, out.text);
+        judged.set(style, text);
     });
     const note = rewriteNote(counts);
     if (note)

package/dist/seam/rewrite.d.ts

@@ -74,5 +74,15 @@ export declare function wrapInLayer(source: string, layer: string): {
     text: string;
     wrapped: boolean;
 };
+/**
+ * A linked sheet's relative addresses, resolved against its own href, for the `<style>` that takes its place (`rewrite-document.js`).
+ *
+ * @remarks A `<style>` resolves `url()` against the document, a `<link>` against the sheet: once a sheet in `css/` is moved into a `<style>`, `url("./font.ttf")` asks for the document's `./font.ttf` (the tester's case, 2026-11-03: a font inside `@media print`, whose opening made the sheet a `<style>`). Paged.js resolves a sheet it inlines the same way. Every `url()` and every `@import "…"` string is written absolute, in place, so no line moves; a sheet css-tree cannot parse is returned as it is.
+ *
+ * ponytail: `url()` and the `@import` string only. A url in a custom property's value (kept raw) or a string in `image-set()` still resolves against the document; add them when a document needs them.
+ *
+ * @param base - the absolute href the sheet was fetched from.
+ */
+export declare function rebaseUrls(source: string, base: string): string;
 /** The console line a host says once per document it rewrote — what moved and why a reader of the sheet will meet two strange forms. */
 export declare function rewriteNote(counts: Partial<Record<string, number>>): string | null;

package/dist/seam/rewrite.js

@@ -522,6 +522,38 @@ function splitPageSelectorLists(source) {
     });
     return { text: applyEdits(source, edits), split: edits.length };
 }
+/** An address the sheet's own href is the base of: not one with a scheme (`data:`, `https:`), and not a fragment, which names the document (`clip-path: url(#c)`). */
+const isRelative = (url) => url !== '' && !url.startsWith('#') && !/^[a-z][a-z\d+.-]*:/i.test(url);
+/**
+ * A linked sheet's relative addresses, resolved against its own href, for the `<style>` that takes its place (`rewrite-document.js`).
+ *
+ * @remarks A `<style>` resolves `url()` against the document, a `<link>` against the sheet: once a sheet in `css/` is moved into a `<style>`, `url("./font.ttf")` asks for the document's `./font.ttf` (the tester's case, 2026-11-03: a font inside `@media print`, whose opening made the sheet a `<style>`). Paged.js resolves a sheet it inlines the same way. Every `url()` and every `@import "…"` string is written absolute, in place, so no line moves; a sheet css-tree cannot parse is returned as it is.
+ *
+ * ponytail: `url()` and the `@import` string only. A url in a custom property's value (kept raw) or a string in `image-set()` still resolves against the document; add them when a document needs them.
+ *
+ * @param base - the absolute href the sheet was fetched from.
+ */
+export function rebaseUrls(source, base) {
+    let ast;
+    try {
+        ast = parse(source, SHEET_OPTIONS);
+    }
+    catch {
+        return source;
+    }
+    const edits = [];
+    const absolute = (url) => `"${new URL(url, base).href}"`;
+    walkStyled(ast, source, SHEET_OPTIONS, {
+        enter(node) {
+            if (node.type === 'Url' && node.loc && isRelative(node.value))
+                edits.push({ start: node.loc.start.offset, end: node.loc.end.offset, text: `url(${absolute(node.value)})` });
+            const first = node.type === 'Atrule' && String(node.name).toLowerCase() === 'import' ? node.prelude?.children?.first : null;
+            if (first?.type === 'String' && first.loc && isRelative(first.value))
+                edits.push({ start: first.loc.start.offset, end: first.loc.end.offset, text: absolute(first.value) });
+        }
+    });
+    return applyEdits(source, edits);
+}
 /** The console line a host says once per document it rewrote — what moved and why a reader of the sheet will meet two strange forms. */
 export function rewriteNote(counts) {
     const parts = [];

package/dist/src/chase.js

@@ -15,7 +15,7 @@
  *
  * @packageDocumentation
  */
-import { MARGIN_CELLS, ALIGN_X, ALIGN_Y, HORIZONTAL_BANDS, bandWidths, translateAlignment } from './margin-boxes.js';
+import { MARGIN_CELLS, ALIGN_X, ALIGN_Y, HORIZONTAL_BANDS, bandTracks, bandWidths, translateAlignment } from './margin-boxes.js';
 import { counterLevels } from './document-state.js';
 import { encodeStringProp, STRING_KEYWORDS } from './gcpm-encoding.js';
 import { cssString } from './reads.js';
@@ -186,9 +186,9 @@ export class BeltypePage extends HTMLElement {
         this.style.containIntrinsicSize = `${pageW}px ${pageH - 1}px`;
         this.#bandWidth = pageW - margins.left - margins.right;
         this.#pageH = pageH;
-        const cw3 = this.#bandWidth / 3;
+        const [wa, wb, wc] = bandTracks(this.#bandWidth);
         const ch3 = (pageH - margins.top - margins.bottom) / 3;
-        this.style.gridTemplateColumns = `${margins.left}px ${cw3}px ${cw3}px ${cw3}px ${margins.right}px`;
+        this.style.gridTemplateColumns = `${margins.left}px ${wa}px ${wb}px ${wc}px ${margins.right}px`;
         this.style.gridTemplateRows = `${margins.top}px ${ch3}px ${ch3}px ${ch3}px ${Math.max(0, margins.bottom - 1)}px`;
     }
     /**

package/dist/src/margin-boxes.d.ts

@@ -35,6 +35,13 @@ export declare const MARGIN_BOXES: string[];
  */
 export declare const ALIGN_X: Record<string, string>;
 export declare const ALIGN_Y: Record<string, string>;
+/**
+ * The three tracks the page grid gives the band between its margins, in CSS px.
+ *
+ * @remarks
+ * Chromium lays a length out in 1/64 px and drops the remainder of every track on its own, so three thirds of 423.307 px are three tracks of 141.09375 and sum to 423.28125 px, while the measure container, one box of that width, floors the whole to 423.296875. A line that fits the one and not the other is measured on one line and shown on two (specimen `trattato`, page 111). The tracks are therefore whole 1/64 px units that sum to the floor of the band, the last one taking the remainder: no third of a unit is left for the grid to drop, and the content area is as wide as the container it was measured in.
+ */
+export declare function bandTracks(band: number): [number, number, number];
 /** The three boxes of each horizontal band, in band order — what `bandWidths` sizes, and the only membership test `chase.js` needs to know which cells leave the outer grid. */
 export declare const HORIZONTAL_BANDS: {
     top: string[];

package/dist/src/margin-boxes.js

@@ -41,6 +41,17 @@ export const MARGIN_BOXES = MARGIN_CELLS.map(([name]) => name);
  */
 export const ALIGN_X = { left: 'flex-start', start: 'flex-start', right: 'flex-end', end: 'flex-end', center: 'center', justify: 'flex-start' };
 export const ALIGN_Y = { top: 'flex-start', 'text-top': 'flex-start', middle: 'center', bottom: 'flex-end', 'text-bottom': 'flex-end' };
+/**
+ * The three tracks the page grid gives the band between its margins, in CSS px.
+ *
+ * @remarks
+ * Chromium lays a length out in 1/64 px and drops the remainder of every track on its own, so three thirds of 423.307 px are three tracks of 141.09375 and sum to 423.28125 px, while the measure container, one box of that width, floors the whole to 423.296875. A line that fits the one and not the other is measured on one line and shown on two (specimen `trattato`, page 111). The tracks are therefore whole 1/64 px units that sum to the floor of the band, the last one taking the remainder: no third of a unit is left for the grid to drop, and the content area is as wide as the container it was measured in.
+ */
+export function bandTracks(band) {
+    const units = Math.floor(band * 64);
+    const third = Math.floor(units / 3);
+    return [third / 64, third / 64, (units - 2 * third) / 64];
+}
 /** The three boxes of each horizontal band, in band order — what `bandWidths` sizes, and the only membership test `chase.js` needs to know which cells leave the outer grid. */
 export const HORIZONTAL_BANDS = {
     top: ['top-left', 'top-center', 'top-right'],

package/dist/src/root.d.ts

@@ -149,6 +149,8 @@ export declare class BeltypeRoot extends HTMLElement {
     startOf(k: number): Address | null;
     /** Pause the idle build while a run measures, and let it go when the run presents (or throws). A page that comes near still builds. */
     hold(): void;
+    /** Let go of what this root registered outside itself: the idle build, the observer and the window's listeners. The root is finished with after it; the class is not, since the window keeps it. */
+    dispose(): void;
     release(): void;
     /**
      * Show a source element: the page that begins it is built, and the copy of it that page shows — the original where it stands whole, a fragment's counterpart where the page divides its block — is scrolled into view. The one door every jump goes through (a link to `#x`, the editing tools' follow, a hash on the address); `scrollIntoView` on the source itself would find a box only when the source happens to be the thing drawn.

package/dist/src/root.js

@@ -93,6 +93,8 @@ export class BeltypeRoot extends HTMLElement {
     #idleIsRic = false;
     #held = false;
     #listening = false;
+    /** What undoes each window listener {@link dispose} must take off. */
+    #offs = [];
     #buildMs = 0;
     constructor() {
         super();
@@ -682,7 +684,7 @@ export class BeltypeRoot extends HTMLElement {
             this.#ensure(target);
         }, true);
         // And after it, the place is shown: a target that is no box of its own — a divided block, drawn on its pages through copies — is scrolled to where its copy is. An address typed into the bar while the document is still being cut asks for the cut the same way.
-        view.addEventListener('hashchange', () => {
+        const onHash = () => {
             const target = targetOf(view.location.hash);
             if (!target)
                 return;
@@ -690,8 +692,11 @@ export class BeltypeRoot extends HTMLElement {
                 void this.cutTo(target).then(() => this.reveal(target));
             else
                 this.reveal(target);
-        });
-        view.addEventListener('beforeprint', () => void this.buildAll());
+        };
+        const onPrint = () => void this.buildAll();
+        view.addEventListener('hashchange', onHash);
+        view.addEventListener('beforeprint', onPrint);
+        this.#offs.push(() => view.removeEventListener('hashchange', onHash), () => view.removeEventListener('beforeprint', onPrint));
     }
     /** Build the page that begins the element, when the engine can name it.@param [charOffset] @returns the page's index, or null. */
     #ensure(el, charOffset = 0) {
@@ -753,6 +758,16 @@ export class BeltypeRoot extends HTMLElement {
         this.#held = true;
         this.#unkick();
     }
+    /** Let go of what this root registered outside itself: the idle build, the observer and the window's listeners. The root is finished with after it; the class is not, since the window keeps it. */
+    dispose() {
+        this.#held = true;
+        this.#unkick();
+        this.#observer?.disconnect();
+        this.#observer = null;
+        for (const off of this.#offs.splice(0))
+            off();
+        this.#listening = false;
+    }
     release() {
         this.#held = false;
         this.#kick();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beltype/cicero",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "Cicero, a paged-media engine for the live browser: it cuts a document into pages under CSS Paged Media and presents them as real frames. Beta.",
   "type": "module",
   "license": "MIT",
@@ -20,6 +20,14 @@
       "types": "./dist/seam/host.d.ts",
       "import": "./dist/seam/host.js"
     },
+    "./engine": {
+      "types": "./dist/seam/index.d.ts",
+      "import": "./dist/seam/index.js"
+    },
+    "./flags": {
+      "types": "./dist/seam/flags.d.ts",
+      "import": "./dist/seam/flags.js"
+    },
     "./rewrite": {
       "types": "./dist/seam/rewrite-document.d.ts",
       "import": "./dist/seam/rewrite-document.js"
@@ -50,16 +58,18 @@
     "build": "tsc -p tsconfig.build.json && tsc -p tsconfig.facsimile.json && node scripts/copy-assets.js",
     "check": "tsc -p tsconfig.test.json",
     "test": "node --test 'test/*.test.ts'",
+    "test:browser": "node --test --test-concurrency=1 'test/browser/*.browser.ts'",
     "prepare": "npm run build"
   },
   "dependencies": {
-    "@beltype/common": "0.1.1",
+    "@beltype/common": "0.1.2",
     "css-tree": "^3.2.1",
     "pdfjs-dist": "6.2.108"
   },
   "devDependencies": {
     "@types/css-tree": "^3.2.0",
     "@types/node": "^22.20.4",
+    "playwright-core": "1.63.0",
     "typescript": "7.0.2"
   },
   "pnpm": {