2a:I[30972,["$2","$13","$14","$15","$16"],"LiveRun"] 2b:T7d0,git checkout -b sprint/33-b5c-ghost-3d && mkdir -p .crew/sprint/33 && cat > .crew/sprint/33/decisions.md <<'EOF' # Sprint 33 decisions (Atlas) 1. **Sprint 33 is B5c, beside #78.** The pre-flight (after #82 merged) found #78 (sprint 31, B4a, `/crew`) waiting for the owner, next 33, five of the day's six merged, nothing to update or remind, and no owner goal. Every B4 sprint builds on #78. B5c, the ghost hull in 3D on `/log`, reads the retros on main, and sprint 29's plan says it doesn't wait for B4 (`.crew/sprint/29/b5-plan.md`, "Which B5 sprint waits for B4"). It neither repeats nor builds on #78; both touch the bar (#78 re-lays it below 768, this adds the control to `/log`'s), so whichever merges second merges main and keeps both sides. B5c writes the model's mount on a second route, which B4d then reuses on `/crew`. Branch `sprint/33-b5c-ghost-3d`. 2. **Sprint 32's merge record is committed with this sprint**, as `.crew/STATE.md` says: `merge-record.mjs` wrote `.crew/sprint/32/merge.json` (#82, 2026-10-25T02:08:27Z, 4070914, 43 of 6,498 lines original). EOF cat > .crew/sprint/33/pr.md <<'EOF' ## Sprint 33: the ghost hull in 3D on `/log` (B5c) **Goal (roadmap):** B5c, the last sprint of B5, as sprint 29 planned it (`.crew/sprint/29/b5-plan.md`): on `/log` the card model stands in vellum, the 22 original planks numbered as the 2D drawing numbers them, under the Full/Calm/Off control in `/log`'s bar, and a plank opens the record of the sprint that took it out. Taken beside #78 (B4a), which waits for the owner; B5 reads the retros on main, so this neither repeats nor builds on #78. **Size:** M. Contract: `.crew/sprint/33/contract.md` (in progress). Decisions: `.crew/sprint/33/decisions.md`. This body is updated as the sprint lands. EOF git add .crew/sprint/32/merge.json .crew/sprint/33 && git commit -q -m "Sprint 33: start B5c, with sprint 32's merge record Co-Authored-By: Claude Opus 5.5 Claude-Session: https:/2c:T7d0,cat > .crew/sprint/33/brief-quill.md <<'EOF' # Brief: Quill, sprint 33 (B5c contract) **What it's for.** B5c is the last sprint of B5: on `/log` the card model stands in vellum, the 22 original planks numbered as the 2D ghost hull numbers them, under the Full/Calm/Off control in `/log`'s bar; a pointer on a plank opens the record of the sprint that took it out; the table stays the keyboard's way in. It is the archive moment the direction's novelty budget allows. The visitor is the hiring executive who follows "All N revisions in the Log" (seconds to "this crew has a record"), and the engineer who stays and shares a record. **Your job.** Write `.crew/sprint/33/contract.md`, one page or so, ready for Probe to turn into failing Playwright checks and for Pixel (3D) and Forge (the control in `/log`'s bar) to build. Start from `.crew/sprint/29/b5-plan.md` ("B5c") and ground every check in the current code and a measurement, not in the plan's words alone (`.crew/STATE.md`, "Contracts" and "Specs"). Read first: `.crew/STATE.md`; `.crew/sprint/29/b5-plan.md`; B3's contracts and decisions (`.crew/sprint/25`, `26`, `27`: the loft, the phone budgets, the control); `.crew/sprint/30` and `32` (`/log` today); `components/model.tsx`, `lib/model/*`, `components/log.tsx`, `components/bar.tsx`, `app/log/page.tsx`; the specs `e2e/model-*.spec.ts`, `e2e/log*.spec.ts`, `e2e/motion.spec.ts`, `e2e/invariants.spec.ts` (B2.10's script budget), `e2e/keyboard.spec.ts`. What the contract must settle: - The outcome in a sentence or two; numbered checks B5.17 onward (B5b ended at B5.16; confirm) that a visitor would notice: vellum planks and numbers equal the 2D rule (`e2e/retros.ts`'s oracle); Full opens with one camera move, Calm settled, Off is B5a's drawing with no WebGL; 0 frames at rest; Off and hidden never request the chunk; a pick lands on the right record; the control in `/log`'s bar, remembered on the device as on `/` (one storage key or two? say which and why). - Budgets2d:T464,cd /home/user/wt-quill-33; node node_modules/next/dist/bin/next start --port 4841 > /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/server2.log 2>&1 & echo $! > /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/server.pid; for i in 1 2 3 4 5 6 7 8 9 10; do curl -s -o /dev/null -w "%{http_code}\n" http://localhost:4841/log && break; sleep 1; done python3 - <<'EOF' p='/tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/bytes.mjs' s=open(p).read() s=s.replace('[["/no-such-page", false], ["/log", false], ["/log/13", false], ["/read", false], ["/", true], ["/", false]]','JSON.parse(process.argv[4] ?? \'[["/no-such-page", false], ["/log", false], ["/log/13", false], ["/read", false], ["/", true], ["/", false]]\')') open(p,'w').write(s) EOF node /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/bytes.mjs http://localhost:4841 v '[["/no-such-page",false],["/log",true],["/log/13",true],["/",true],["/log",false]]' 2>&1 | grep -v -i -E "warn|trace-warnings"2e:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' import re p='lib/model/hull.ts' s=open(p).read() s=s.replace('''/** One plank, both sides, into the card mesh with its slot. */ function plankMesh( card: Card, plank: Plank, slot: number, stations: number[], rows: number, ) { // Where a lift runs out against the stem, the counter or the keel its band closes to a point: // keep that point, or the card stops a station short and leaves a notch in the silhouette (S4). const band = (x: number): [number, number] | null => { const open = bandAt(plank, x); if (open || (x !== plank.x0 && x !== plank.x1)) return open; const y = Math.min(Math.max(plank.yTop, sheer(x)), profile(x)); return [y, y]; }; const xs = stationsIn(stations, plank.x0, plank.x1).filter((x) => band(x)); for (const side of [1, -1]) {''','''/** * A plank's band at each of its stations. Where a lift runs out against the stem, the counter or * the keel its band closes to a point: keep that point, or the card stops a station short and * leaves a notch in the silhouette (S4). */ function plankStations(plank: Plank, stations: number[]) { const band = (x: number): [number, number] | null => { const open = bandAt(plank, x); if (open || (x !== plank.x0 && x !== plank.x1)) return open; const y = Math.min(Math.max(plank.yTop, sheer(x)), profile(x)); return [y, y]; }; const xs = stationsIn(stations, plank.x0, plank.x1).filter((x) => band(x)); return { band, xs }; } /** One plank, on the sides given (both on the sheet), into the card mesh with its slot. */ function plankMesh( card: Card, plank: Plank, slot: number, stations: number[], rows: number, sides: readonly number[], ) { const { band, xs } = plankStations(plank, stations); for (const side of sides) {''') s=s.replace('''export type Hull = ReturnType;''','''/** * The ghost's ink (.crew/sprint/33/): each plank's own edge on the near side, as the 2D ghost strokes * ea2f:T7d4,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/calls.ts' s=open(p).read() s=s.replace('''/** The shadow's darkness:''','''/** * The Log's ghost hull (.crew/sprint/33/spike-pixel.md; Iris's call to come): its one camera move is * a turn in place on its own drawing, sprint 17's approved ghost turn (yaw −20°, pitch 12°), with * no lift. The ghost drawing hugs the profile with 4 units of margin, so the canvas lies on it as on * the sheet and the settled hull must fit it: dy 3.5 centres the pitched hull, and its framed height * may grow 3% (5 to 6% fits from 768 px, 3 to 4% at 320 and 390). */ export const SETTLE_GHOST = { dx: 0, dy: 3.5, yaw: -20, pitch: 12, lift: 0 }; export const G_GHOST = 0.03; /** The ghost's line weights in CSS px, the 2D ghost's own: each plank's pencil edge, the outline. */ export const GHOST_EDGE_PX = 0.75; export const GHOST_OUTLINE_PX = 1.4; /** The shadow's darkness:''') open(p,'w').write(s) p='lib/model/loft.ts' s=open(p).read() s=s.replace('''import { type Layout, NARROW } from "@/lib/hull-layouts"; import { G_NARROW, GROW, HOLD, LIFT, SETTLE, SETTLE_NARROW } from "./calls";''','''import { GHOST, type Layout, NARROW } from "@/lib/hull-layouts"; import { G_GHOST, G_NARROW, GROW, HOLD, LIFT, SETTLE, SETTLE_GHOST, SETTLE_NARROW, } from "./calls";''') s=s.replace('''type Settle = { dx: number; dy: number; yaw: number; pitch: number; grow: number;''','''type Settle = { dx: number; dy: number; yaw: number; pitch: number; /** How much further off the sheet it stands, in hull units (LIFT on the sheet). */ lift: number; grow: number;''') s=s.replace('''const settleOn = (layout: Layout): Settle => layout === NARROW ? { ...SETTLE_NARROW, grow: G_NARROW, curve: (e) => e * e } : { ...SETTLE, grow: GROW, curve: (e) => e };''','''const settleOn = (layout: Layout): Settle => layout === GHOST ? { ...SETTLE_GHOST, grow: G_GHOST, curve: (e) => e } : layout === NARROW ? { ..30:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/stage.ts' s=open(p).read() s=s.replace(''' PlaneGeometry, RGBAFormat,''',''' PlaneGeometry, Raycaster, RGBAFormat,''') s=s.replace(''' Vector4, WebGLRenderer,''',''' Vector3, Vector4, WebGLRenderer,''') s=s.replace('''import { DARK_GAIN, DARK_LIGHT, OUTLINE_PX,''','''import { DARK_GAIN, DARK_LIGHT, GHOST_EDGE_PX, GHOST_OUTLINE_PX, OUTLINE_PX,''') s=s.replace('''import { DECK, type Hull } from "./hull";''','''import { DECK, type Hull, type Vec3 } from "./hull";''') s=s.replace(''' pencil: string; dark: boolean; };''',''' pencil: string; /** The ghost's tokens (.crew/sprint/33/): the planks' vellum and the outline's graphite. */ vellum: string; muted: string; dark: boolean; };''') s=s.replace('''export function createStage(canvas: HTMLCanvasElement, hull: Hull) {''','''/** * The scene on `canvas`: the sheet's white card model, or with `ghost` the Log's ghost hull * (.crew/sprint/33/): the same card, lines and rig, in vellum, with no shadow. */ export function createStage( canvas: HTMLCanvasElement, hull: Hull, ghost = false, ) {''') s=s.replace(''' const ratio = buffer[0] / width; seams.material.linewidth = SEAM_PX * ratio; outline.material.linewidth = OUTLINE_PX * ratio;''',''' const ratio = buffer[0] / width; seams.material.linewidth = (ghost ? GHOST_EDGE_PX : SEAM_PX) * ratio; outline.material.linewidth = (ghost ? GHOST_OUTLINE_PX : OUTLINE_PX) * ratio;''') s=s.replace(''' tint.set(i === DECK || seated.has(id) ? palette.card : palette.old); state.set(tint.r, tint.g, tint.b, 1); }); card.uniforms.uPencil.value.set(palette.pencil); seams.material.color.set(palette.ink); outline.material.color.set(palette.ink);''',''' tint.set( ghost ? palette.vellum : i === DECK || seated.has(id) ? palette.card : palette.old,31:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/mount.ts' s=open(p).read() def rep(a,b): global s assert a in s, a[:80] s=s.replace(a,b) rep('''import { type Layout, NARROW, WIDE } from "@/lib/hull-layouts"; import { DURATION, ease } from "./calls"; import { buildHull, DESKTOP, type Hull, type Level, PHONE } from "./hull";''','''import { GHOST, type Layout, NARROW, PLANKS, WIDE } from "@/lib/hull-layouts"; import { DURATION, ease } from "./calls"; import { buildHull, DESKTOP, type Hull, type Level, nearSide, PHONE, type Vec3, } from "./hull";''') rep('''/** The once-a-visit flag in sessionStorage. */ const PLAYED = "theseus:model";''','''/** The once-a-visit flag in sessionStorage: the sheet's loft, and the Log's camera move. */ const PLAYED = "theseus:model"; const PLAYED_GHOST = "theseus:ghost";''') rep('''/** Each level's hull, built once a visit: a resize back across 768 px or a Back reuses it. */ const hulls = new Map(); const hullAt = (level: Level) => { const hull = hulls.get(level) ?? buildHull(level); hulls.set(level, hull); return hull; };''','''/** * Each level's hull, built once a visit: a resize back across 768 px or a Back reuses it. A page * has one kind, the sheet's card or the Log's ghost (its seats fixed by the page), so the level * keys it. */ const hulls = new Map(); const hullAt = (level: Level, ghost?: ReadonlySet) => { const hull = hulls.get(level) ?? buildHull(level, ghost); hulls.set(level, hull); return hull; };''') rep('''const played = () => { try { return sessionStorage.getItem(PLAYED) === "1"; } catch { return false; } }; const remember = () => { try { sessionStorage.setItem(PLAYED, "1"); } catch {''','''const played = (key: string) => { try { return sessionStorage.getItem(key) === "1"; } catch { return false; } }; const remember = (key: string) => { try { sessionStorage.setItem(key, "1"); } catch {''32:T7b5,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/mount.ts' s=open(p).read() def rep(a,b): global s assert a in s, a[:80] s=s.replace(a,b) rep(''' const spans: HTMLElement[] = []; const anchors: Vec3[] = [];''',''' const spans: HTMLElement[] = []; const anchors: Vec3[] = []; /** Each number's place in the drawing, as shares of its box: where frame 1 draws it. */ const shares: [number, number][] = [];''') rep(''' const x = (parseFloat(span.style.left) / 100) * bw + bx; const y = (parseFloat(span.style.top) / 100) * bh + by;''',''' const share: [number, number] = [ parseFloat(span.style.left) / 100, parseFloat(span.style.top) / 100, ]; shares.push(share); const x = share[0] * bw + bx; const y = share[1] * bh + by;''') rep(''' host.append(layer); let registered: (readonly [number, number])[] | null = null; return { layer, place(stage: { screen(points: readonly Vec3[]): (readonly [number, number])[] }) { const at = stage.screen(anchors); registered ??= at; const step = 1 / devicePixelRatio; at.forEach(([x, y], i) => { const [x0, y0] = registered?.[i] ?? [x, y]; const dx = Math.round((x - x0) / step) * step;''',''' host.append(layer); return { layer, /** Moves each number to its plank as the last frame drew it, in whole device pixels. */ place( stage: { screen(points: readonly Vec3[]): (readonly [number, number])[] }, [width, height]: readonly [number, number], ) { const step = 1 / devicePixelRatio; stage.screen(anchors).forEach(([x, y], i) => { const [sx, sy] = shares[i] ?? [0, 0]; const [x0, y0] = [sx * width, sy * height]; const dx = Math.round((x - x0) / step) * step;''') rep(''' stage.draw(e, loft); labels?.place(stage);''',''' stage.draw(e, loft); if (fit) labels?.place(stage, [fit.width, fit.height]);''') open(p,'w').write(s) EOF echo ok33:Tfa4,# Sprint 33 contract: the ghost hull in 3D on `/log` (B5c) Quill, 2026-10-25. The last sprint of B5, as sprint 29 planned it (`.crew/sprint/29/b5-plan.md`, "B5c"), on the model and the control as sprints 25 to 27 shipped them (their contracts' data rules hold word for word except where this one changes them) and on `/log` as B5a and B5b shipped it (`.crew/sprint/29/b5-first-contract.md`, `.crew/sprint/32/contract.md`). The approved frames are `log-1440.webp` and `log-390.webp` (`.crew/sprint/17/design/`): the ghost in 3D, a three-quarter view with the planks standing slightly apart, numbered on the planks, Full/Calm/Off in the bar at 1440. Iris's calls are in `.crew/sprint/33/notes-iris.md`, Pixel's spike in `spike-pixel.md`; where a rule below is theirs it says "Iris's call" or "Pixel's call". Every number here was measured on a build of main at a0f3efe in my worktree unless it says otherwise. GPU numbers are SwiftShader's floor; 30 fps on a phone is checked on the owner's phone at the demo. ## Outcome A hiring executive who follows "All 30 revisions in the Log" sees the ghost hull stand up off the sheet in vellum: the ship's 22 original planks, each numbered by the sprint that took it out, with one camera move, then still. A pointer on a plank opens that sprint's record, and the table under it stays the way in for the keyboard and the phone. Calm shows it settled, Off is today's drawing with no 3D downloaded, and the choice is the one they already made on `/`. ## The calls I made 1. **The model is on `/log` and on every record.** A record is the Log with the record open (B5a). A pick opens a record, and a record without the model would flatten the hull and drop the control from the bar on the very page the pick opened. On a record, the record's own seat is marked in 3D as the 2D drawing marks it (`path[data-current]`; how it looks is Iris's call). 2. **One storage key, `theseus:motion`, shared with `/`.** Motion is a preference about the site, not a page: a visitor who pressed Off on `/` and then watches the hull move on `/log` was ignored, and one who needs less motion shouldn't have to say so twice. It also costs 0 B, since the store is the module `/` already ships. 3. **The camera move plays once a visit, on its own flag.** It plays on the first Log page of a visit (a sessionStorage flag of its own, kept in the chunk, not `/`'s `theseus:model`), so a visitor who saw the loft on `/` still sees the archive's move once, and every later Log page of the visit, the record a pick opens included, opens settled. A press of Full replays it, as on `/` (sprint 27, decision 4). 4. **The loader doesn't grow for `/log`; the seam is in the chunk.** `components/model.tsx`'s module is 2,038 B decoded and B2.10 leaves `/` 10 B of headroom (measured below). In a scratch build that rendered the same `` and `` on `/log` unchanged, `/log` with WebGL refused requested exactly `/`'s six files (the same 2,038 B chunk), and with WebGL the same 3D chunk file as `/`. So `/log` renders those two components as they are, and the chunk tells the sheet from the ghost by the drawing beside its layer (`[data-plan]` or `[data-ghost]`, `host.previousElementSibling` today). The ghost's seats and numbers come from the 2D drawing in the page (`[data-ghost] path[data-plank]` and its `data-sprint`, which B5.4 already checks against the oracle), so the 3D can't disagree with the 2D. The 3D chunk stays one file for both routes, so a visitor from `/` downloads no second 3D. Lens's nit on #74 takes about 3 B of the 10. If the seam needs more loader bytes than that leaves, stop and say so: it reopens B2.10 with the owner, as sprint 27 said. 5. **The pick is the pointer's; the table is everyone's.** A plank is 10 px deep at 390, 21 at 768, 16 at 1024 and 25 at 1440 in the 2D drawing (7 lifts in the ghost's box: 358 × 71, 736 × 147, 568 × 113, 900 × 179 px). The canvas stays `34:T5d4,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='components/log.tsx' s=open(p).read() s=s.replace('''import { LogRecord } from "@/components/log-record";''','''import { LogRecord } from "@/components/log-record"; import { Model } from "@/components/model";''') a=''' className="log-ghost" /> ''' assert a in s s=s.replace(a,a+''' {/* Spike (sprint 33): the ghost in 3D, read off the drawing beside it. */} ''') open(p,'w').write(s) p='app/globals.css' s=open(p).read() a='''@media print { [data-model] { display: none; } }''' assert a in s s=s.replace(a,a+''' /* Spike (sprint 33): the ghost in 3D. From frame 1 the 3D numbers stand for the drawing's; from the first moving frame the whole 2D ghost goes, since the model turns in place over it. */ @media screen and (forced-colors: none) { [data-ghost]:has(+ [data-model][data-state]) .plan-plank, [data-ghost]:has(+ [data-model][data-state]) .ln-leader { visibility: hidden; } [data-ghost]:has( + [data-model]:is( [data-state="lofting"], [data-state="settled"], [data-state="still"] ) ) svg { visibility: hidden; } } [data-model] > .plan-view { position: absolute; } [data-model]:not([data-state]) > .plan-view { visibility: hidden; } @media (width < 48rem) { [data-model] > .plan-view > .plan-plank { display: none; } }''') open(p,'w').write(s) EOF pnpm exec tsc --noEmit 2>&1 | tail -2035:T498,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/mount.ts' s=open(p).read() s=s.replace('''open(href, "_blank");''','''window.open(href, "_blank");''') open(p,'w').write(s) p='lib/model/hull.ts' s=open(p).read() a=''' for (const [x, b] of [ [xs[0], bands[0]], [xs.at(-1), bands.at(-1)], ] as const) { if (x === undefined || !b || b[1] - b[0] < 0.05) continue; segments( Array.from({ length: rows + 1 }, (_, j) => on(x, b[0] + ((b[1] - b[0]) * j) / rows), ), out, ); }''' assert a in s s=s.replace(a,''' // The butts: the plank's two ends, where it has depth there. for (const i of [0, xs.length - 1]) { const x = xs[i]; const [top, bottom] = bands[i] ?? [0, 0]; if (x === undefined || bottom - top < 0.05) continue; segments( Array.from({ length: rows + 1 }, (_, j) => on(x, top + ((bottom - top) * j) / rows), ), out, ); }''') open(p,'w').write(s) EOF pnpm exec tsc --noEmit 2>&1 | grep -v Warning | grep -v trace-warnings; pnpm exec biome check --write lib/model components/log.tsx app/globals.css 2>&1 | tail -1536:T530,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && cat > crop.mjs <<'EOF' // node crop.mjs x y w h [scale] import { chromium } from "/home/user/theseus-portfolio/node_modules/@playwright/test/index.mjs"; import { readFileSync, writeFileSync } from "node:fs"; const [inp, out, x, y, w, h, sc = "1"] = process.argv.slice(2); const b64 = readFileSync(inp).toString("base64"); const browser = await chromium.launch({ args: ["--no-sandbox"] }); const page = await browser.newPage(); const data = await page.evaluate(async ({ b64, x, y, w, h, sc }) => { const img = new Image(); img.src = `data:image/png;base64,${b64}`; await img.decode(); const c = document.createElement("canvas"); c.width = w * sc; c.height = h * sc; const g = c.getContext("2d"); g.imageSmoothingEnabled = false; g.drawImage(img, x, y, w, h, 0, 0, w * sc, h * sc); return c.toDataURL("image/png").split(",")[1]; }, { b64, x: +x, y: +y, w: +w, h: +h, sc: +sc }); writeFileSync(out, Buffer.from(data, "base64")); await browser.close(); EOF node crop.mjs out/m0.5-1.35-1440-light.png out/crop-a.png 30 160 920 220 1 2>&1 | grep -v -E "UNDICI|trace-warn"; node crop.mjs out/m0.6-1.2-1440-dark.png out/crop-b.png 30 160 920 220 1 2>&1 | grep -v -E "UNDICI|trace-warn"; ls out | head -3037:T4ea,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && python3 - <<'EOF' p='ghost.js' s=open(p).read() s=s.replace('''window.__ghost = {''','''// Overlaps between the numbers' boxes, 1 px apart at least. const rects = spans.filter((sp) => getComputedStyle(sp).display !== "none").map((sp) => ({ t: sp.textContent, r: sp.getBoundingClientRect() })); const clashes = []; for (let i = 0; i < rects.length; i++) for (let j = i + 1; j < rects.length; j++) { const [A, B] = [rects[i].r, rects[j].r]; const gx = Math.max(A.left, B.left) - Math.min(A.right, B.right); const gy = Math.max(A.top, B.top) - Math.min(A.bottom, B.bottom); const gap = Math.max(gx, gy); if (gap < 1) clashes.push(`${rects[i].t}/${rects[j].t}:${gap.toFixed(1)}`); } window.__ghost = { clashes,''') open(p,'w').write(s) p='shoot.mjs' s=open(p).read() s=s.replace('tr: info.translucent }','tr: info.translucent, clashes: info.clashes }') open(p,'w').write(s) EOF for v in "-20 12" "-24 16" "-28 18" "-26 22" "-30 15"; do set -- $v; echo "pose $v"; timeout 300 node shoot.mjs q$1_$2 "{\"yaw\":$1,\"pitch\":$2,\"lit\":0.5,\"gain\":1.35}" 1024,1440 light 2>&1 | grep -v -E "UNDICI|trace-warn" | grep -o '"clashes":.*'; done38:T411,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/maths && python3 - <<'EOF' p='ghost.ts' s=open(p).read() s=s.replace(''' const navigations: string[] = []; await run.page.route(/\\/log\\/\\d+$/, async (route) => { if (route.request().isNavigationRequest()) {''',''' const navigations: string[] = []; let armed = false; await run.page.route(/\\/log\\/\\d+$/, async (route) => { if (armed && route.request().isNavigationRequest()) {''') s=s.replace(''' await run.goto(BASE + url); let end: string;''',''' await run.goto(BASE + url); armed = true; let end: string;''') open(p,'w').write(s) EOF grep -n "armed" ghost.ts | head; sh run.sh ghost.ts '[{"width":1440,"height":900,"dpr":2,"scheme":"dark"},{"width":1024,"height":768,"dpr":1},{"width":768,"height":1024,"dpr":2},{"width":390,"height":844,"dpr":2},{"width":390,"height":844,"dpr":3,"scheme":"dark"},{"width":1440,"height":900,"dpr":1,"url":"/log/13"}]' > ../ghost-sizes.txt 2>&1; cat ../ghost-sizes.txt | cut -c1-90039:T7d0,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && python3 - <<'EOF' p='ghost.js' s=open(p).read() start=s.index('// Numbers: the 2D spans moved') end=s.index('svg.style.visibility') new='''// Numbers: the 2D spans moved to their planks' projected points; with G.stagger, a number that // would touch one already placed slides along its own plank until it is 2 px clear. const spans = [...view.querySelectorAll(".plan-plank")]; const out = []; model.updateMatrixWorld(true); const vr = view.getBoundingClientRect(); const seatOf = new Map([...host.querySelectorAll("path[data-plank]")].map((p) => [p.dataset.sprint, p.dataset.plank])); const plankById = new Map(PLANKS.map((p) => [p.id, p])); const proj = (P) => { const w = P.clone().applyMatrix4(model.matrixWorld).project(camera); return [((w.x + 1) / 2) * W + cell.left, ((1 - w.y) / 2) * H + cell.top]; }; const placed = []; const order = spans .map((span) => ({ span, id: seatOf.get(span.textContent) })) .sort((a, b) => (a.id ?? "").localeCompare(b.id ?? "")); for (const { span, id } of order) { const lp = parseFloat(span.style.left), tp = parseFloat(span.style.top); const xh = (lp / 100) * 632 - 4, yh = (tp / 100) * 126 - 4; const inside = xh >= 0; const wpx = span.offsetWidth, hpx = span.offsetHeight; const end = span.className.includes("plan-end"); const rectAt = ([x, y]) => end ? { l: x - wpx, r: x, t: y - hpx / 2, b: y + hpx / 2 } : { l: x - wpx / 2, r: x + wpx / 2, t: y - hpx / 2, b: y + hpx / 2 }; const clear = (R) => placed.every((Q) => Math.max(R.l, Q.l) - Math.min(R.r, Q.r) >= 2 || Math.max(R.t, Q.t) - Math.min(R.b, Q.b) >= 2); let pt = proj(inside ? surf(xh, yh, 1, 1) : toLocal(xh, yh, halfBreadth(0, yh))); const plank = plankById.get(id); if (G.stagger && inside && plank && !clear(rectAt(pt))) { let best = null; for (let d = 2; d < 400 && !best; d += 2) { for (const x of [xh + d, xh - d]) { if (x < plank.x0 + 4 3a:T59b,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/stage.ts' s=open(p).read() def rep(a,b): global s assert a in s, a[:70] s=s.replace(a,b) rep(''' hull: Hull, ghost = false, ) {''',''' hull: Hull, ghost = false, /** A coarse hull to pick against instead of the drawn one (spike: ?proxy). */ pickHull?: Hull, ) {''') rep(''' const ray = new Raycaster();''',''' const ray = new Raycaster(); const proxy = pickHull ? new Mesh(cardGeometry(pickHull), new MeshBasicMaterial()) : null; if (proxy) { proxy.visible = false; model.add(proxy); }''') rep(''' ray.intersectObject(mesh, false, hits); const face = hits[0]?.face; const slot = mesh.geometry.getAttribute("slot");''',''' const target = proxy ?? mesh; ray.intersectObject(target, false, hits); const face = hits[0]?.face; const slot = target.geometry.getAttribute("slot");''') open(p,'w').write(s) p='lib/model/mount.ts' s=open(p).read() a=''' stage = createStage(canvas, hull, Boolean(ghost));''' assert a in s s=s.replace(a,''' stage = createStage( canvas, hull, Boolean(ghost), ghost && location.search.includes("proxy") ? buildHull({ stations: 24, rows: 2 }, ghost.seats) : undefined, );''') open(p,'w').write(s) EOF pnpm exec tsc --noEmit 2>&1 | grep -E "error" ; pnpm exec biome check --write lib/model 2>&1 | grep -E "error|Checked"3b:T7ce,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/maths && python3 - <<'EOF' p='ghost.ts' s=open(p).read() a=''' const times: number[] = []; for (let i = 0; i < 400; i++) {''' assert a in s s=s.replace(a,''' const times: number[] = []; const w = globalThis as unknown as { __pick?: number[] }; w.__pick = []; for (let i = 0; i < 400; i++) {''') a=''' times.sort((a, b) => a - b); const q = (p: number) => times[Math.floor(p * (times.length - 1))] ?? Number.NaN; return { median: q(0.5), p95: q(0.95), max: q(1) };''' assert a in s s=s.replace(a,''' const picks = [...(w.__pick ?? [])].sort((a, b) => a - b); times.sort((a, b) => a - b); const q = (list: number[], p: number) => list[Math.floor(p * (list.length - 1))] ?? Number.NaN; return { median: q(times, 0.5), p95: q(times, 0.95), max: q(times, 1), picks: picks.length, rayMedian: q(picks, 0.5), rayP95: q(picks, 0.95), rayMax: q(picks, 1) };''') a='''pointermove handler ms median ${cost.median.toFixed(3)} p95 ${cost.p95.toFixed(3)} max ${cost.max.toFixed(3)};''' assert a in s s=s.replace(a,a+''' raycast alone (${cost.picks} picks) ms median ${cost.rayMedian.toFixed(3)} p95 ${cost.rayP95.toFixed(3)} max ${cost.rayMax.toFixed(3)};''') s=s.replace('''const OUT = process.env.OUT ?? "/tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/shots";''','''const OUT = process.env.OUT ?? "/tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/shots-pixel";''') open(p,'w').write(s) EOF mkdir -p ../shots-pixel; sh run.sh ghost.ts '[{"width":1440,"height":900,"dpr":1},{"width":1440,"height":900,"dpr":1,"url":"/log?proxy"},{"width":390,"height":844,"dpr":2},{"width":390,"height":844,"dpr":2,"url":"/log?proxy"},{"width":1440,"height":900,"dpr":1,"cpu":4},{"width":1440,"height":900,"dpr":1,"cpu":4,"url":"/log?proxy"}]' 2>&1 | grep "at rest" | sed 's/.*picks wrong/picks wrong/'3c:T48b,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && python3 - <<'EOF' p='ghost.js' s=open(p).read() s=s.replace('''const ids = new Set(''','''const matBack = mat.clone(); matBack.side = THREE.BackSide; matBack.onBeforeCompile = mat.onBeforeCompile; const matFront = mat.clone(); matFront.side = G.sides === 2 ? THREE.FrontSide : THREE.DoubleSide; matFront.onBeforeCompile = mat.onBeforeCompile; const ids = new Set(''') s=s.replace(''' const m = new THREE.Mesh(g, mat);''',''' const m = new THREE.Mesh(g, side === 1 ? matFront : matBack); m.renderOrder = side === 1 ? 2 : 1;''') open(p,'w').write(s) EOF grep -n "matFront\|matBack\|renderOrder" ghost.js | head; timeout 300 node shoot.mjs two '{"yaw":-20,"pitch":12,"lit":0.5,"gain":1.35,"dgain":0.8,"stagger":true,"sides":2}' 1440,390 light,dark 2>&1 | grep -v -E "UNDICI|trace-warn" | grep -o '"clashes":.*\|pageerror.*'; node crop.mjs out/two-1440-light.png out/crop-two-1440-l.png 20 90 940 360 1 2>&1 | grep -v -E "UNDICI|trace"; node crop.mjs out/two-1440-dark.png out/crop-two-1440-d.png 20 90 940 360 1 2>&1 | grep -v -E "UNDICI|trace"; echo ok3d:T7d0,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && python3 - <<'EOF' p='ghost.js' s=open(p).read() s=s.replace("window.__ghost = { clashes,","if (G.hideNumbers) for (const sp of spans) sp.style.visibility = 'hidden';\nwindow.__ghost = { labels: out.map((o) => [o.text, Math.round(o.x), Math.round(o.y)]), clashes,") open(p,'w').write(s) p='shoot.mjs' s=open(p).read() s=s.replace("clashes: info.clashes }","clashes: info.clashes, labels: info.labels }") open(p,'w').write(s) EOF cat > bgmax.mjs <<'EOF' // Max luminance in a 16 x 10 box around each label point of a PNG: node bgmax.mjs '' import { chromium } from "/home/user/theseus-portfolio/node_modules/@playwright/test/index.mjs"; import { readFileSync } from "node:fs"; const [file, json] = process.argv.slice(2); const labels = JSON.parse(json); const b64 = readFileSync(file).toString("base64"); const browser = await chromium.launch({ args: ["--no-sandbox"] }); const page = await browser.newPage(); const res = await page.evaluate(async ({ b64, labels }) => { const img = new Image(); img.src = `data:image/png;base64,${b64}`; await img.decode(); const c = document.createElement("canvas"); c.width = img.width; c.height = img.height; const g = c.getContext("2d"); g.drawImage(img, 0, 0); const f = (v) => { v /= 255; return v <= 0.04045 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4; }; return labels.map(([t, x, y]) => { const d = g.getImageData(x - 8, y - 5, 16, 10).data; let max = 0, min = 1; for (let i = 0; i < d.length; i += 4) { const L = 0.2126 * f(d[i]) + 0.7152 * f(d[i + 1]) + 0.0722 * f(d[i + 2]); max = Math.max(max, L); min = Math.min(min, L); } return [t, +max.toFixed(3), +min.toFixed(3)]; }); }, { b64, labels }); const worst = res.reduce((a, b) => (b[1] > a[1] ? b : a)); const worstMin = res.reduce((a, b) => (b[2] < a[2] ? b : a)); console.log("max", JSON.stringify(worst), "min", JSON.stringify(worstMin)); await browser.3e:T5e4,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && python3 - <<'EOF' p='bgmax.mjs' s=open(p).read() s=s.replace(''' let max = 0, min = 1; for (let i = 0; i < d.length; i += 4) { const L = 0.2126 * f(d[i]) + 0.7152 * f(d[i + 1]) + 0.0722 * f(d[i + 2]); max = Math.max(max, L); min = Math.min(min, L); } return [t, +max.toFixed(3), +min.toFixed(3)];''',''' const Ls = []; for (let i = 0; i < d.length; i += 4) Ls.push(0.2126 * f(d[i]) + 0.7152 * f(d[i + 1]) + 0.0722 * f(d[i + 2])); Ls.sort((a, b) => a - b); const q = (p) => Ls[Math.floor(p * (Ls.length - 1))]; return [t, +q(0.8).toFixed(3), +q(0.5).toFixed(3)];''') s=s.replace('''console.log("max",''','''console.log(JSON.stringify(res.sort((a,b)=>b[1]-a[1]).slice(0,4)), "max",''') open(p,'w').write(s) EOF for f in out/bg0.45-1440-dark.png out/bg0.45-1024-dark.png out/bg0.4-1440-dark.png; do labels=$(timeout 100 node -e "" ; echo); done; for d in 0.45 0.4; do out=$(timeout 200 node shoot.mjs bg$d "{\"yaw\":-20,\"pitch\":12,\"lit\":0.5,\"gain\":1.35,\"dgain\":$d,\"stagger\":true,\"sides\":2,\"seamDark\":\"--muted\",\"hideNumbers\":true}" 1440,1024 dark 2>&1 | grep -v -E "UNDICI|trace-warn"); echo "$out" | while read f j; do labels=$(echo "$j" | python3 -c "import json,sys; print(json.dumps([l for l in json.load(sys.stdin)['labels'] if l[0]!='20']))"); echo "dgain $d $(basename $f)"; node bgmax.mjs "$f" "$labels" 2>&1 | grep -v -E "UNDICI|trace-warn"; done; done3f:T684,python3 - <<'EOF' def lin(c): c/=255 return c/12.92 if c<=0.04045 else ((c+0.055)/1.055)**2.4 def oklab(h): r,g,b=[lin(int(h[i:i+2],16)) for i in (1,3,5)] l=0.4122214708*r+0.5363325363*g+0.0514459929*b m=0.2119034982*r+0.6806995451*g+0.1073969566*b s=0.0883024619*r+0.2817188376*g+0.6299787005*b l,m,s=[x**(1/3) for x in (l,m,s)] L=0.2104542553*l+0.7936177850*m-0.0040720468*s a=1.9779984951*l-2.4285922050*m+0.4505937099*s bb=0.0259040371*l+0.7827717662*m-0.8086757660*s return L,a,bb def Y(h): r,g,b=[lin(int(h[i:i+2],16)) for i in (1,3,5)] return 0.2126*r+0.7152*g+0.0722*b def cr(a,b): ya,yb=Y(a),Y(b) hi,lo=max(ya,yb),min(ya,yb) return (hi+0.05)/(lo+0.05) for h in ["#eaf1ee","#d7e2e1","#deeae9","#dbeae8","#c8d4d3","#c5d4d2","#cfdcdc","#fbfaf7","#10191c","#3f4d52","#53636a","#5b696b","#576568","#485557","#49565a","#58646a","#e2eae9","#111c22","#878d91","#555c61","#6a7377","#a3adb1"]: L,a,b=oklab(h); print(h, "L=%.3f a=%.3f b=%.3f Y=%.3f"%(L,a,b,Y(h))) print("ink on light upper", cr("#111c22","#deeae9"), "on bilge", cr("#111c22","#c5d4d2")) print("night ink on dark upper #5b696b", cr("#e2eae9","#5b696b"), "on #576568", cr("#e2eae9","#576568")) print("pencil on light upper", cr("#878d91","#deeae9"), "bilge", cr("#878d91","#c5d4d2")) print("graphite on dark upper", cr("#a3adb1","#5b696b"), "bilge", cr("#a3adb1","#485557"), "pencil dark", cr("#6a7377","#5b696b")) print("outline graphite light on film", cr("#555c61","#eaf1ee"), "dark on night", cr("#a3adb1","#10191c")) print("ghost vs film light", cr("#c5d4d2","#eaf1ee"), cr("#deeae9","#eaf1ee"), "dark", cr("#485557","#10191c")) EOF40:T5ec,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && python3 - <<'EOF' p='control.mjs' s=open(p).read() s=s.replace(''' } else { document.querySelector("[data-ghost]").after(slot);''',''' } else if (opt === "A" || opt === "A2") { const row = document.createElement("div"); Object.assign(row.style, { order: "4", display: "flex", justifyContent: opt === "A2" ? "space-between" : "flex-end", alignItems: "center", height: "44px", margin: "12px 0 0" }); if (opt === "A2") { const a = document.createElement("a"); a.href = "/read"; a.textContent = "Read as page"; a.className = "flex items-center text-step-base whitespace-nowrap font-semibold text-foreground underline decoration-1 underline-offset-[6px] max-[359px]:text-step-sm"; a.style.height = "44px"; row.append(a); } Object.assign(slot.style, { margin: "0", padding: "0", display: "flex", height: "44px" }); row.append(slot); document.querySelector(".log-head").after(row); } else { document.querySelector("[data-ghost]").after(slot);''') open(p,'w').write(s) EOF timeout 300 node control.mjs A 320,390 light 2>&1 | grep -v -E "UNDICI|trace-warn" | sed 's/"dbg":{[^}]*},//'; timeout 300 node control.mjs A2 320,390 light 2>&1 | grep -v -E "UNDICI|trace-warn" | sed 's/"dbg":{[^}]*},//'; timeout 300 node control.mjs A2 390 dark /log/13 2>&1 | grep -v -E "UNDICI|trace-warn" | sed 's/"dbg":{[^}]*},//'41:T715,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='app/globals.css' s=open(p).read() start=s.index('/* Spike (sprint 33): the ghost in 3D.') end=s.index('''@media (width < 48rem) { [data-model] > .plan-view > .plan-plank { display: none; } }''')+len('''@media (width < 48rem) { [data-model] > .plan-view > .plan-plank { display: none; } }''') new='''/* Spike (sprint 33): the ghost in 3D. The layer takes the ghost's flex and grid order, since items paint in order-modified document order: at order 0 it would paint under the drawing. Frame 1 changes nothing: the drawing's numbers and leader stay over the canvas, as on the sheet. From the first moving frame the whole 2D ghost goes, since the model turns in place over it, and the 3D numbers stand for the drawing's. */ .log-ghost + [data-model] { order: 2; } [data-ghost]:has(+ [data-model]) .plan-plank { z-index: 1; } @media screen and (forced-colors: none) { [data-ghost]:has( + [data-model]:is( [data-state="lofting"], [data-state="settled"], [data-state="still"] ) ) { & svg, & .plan-plank { visibility: hidden; } } } [data-model] > .plan-view { position: absolute; } [data-model]:not( [data-state="lofting"], [data-state="settled"], [data-state="still"] ) > .plan-view { visibility: hidden; } @media (width < 48rem) { [data-model] > .plan-view > .plan-plank { display: none; } }''' s=s[:start]+new+s[end:] open(p,'w').write(s) EOF pnpm exec biome check --write app/globals.css 2>&1 | grep -E "Checked|error"; kill 19783; sleep 1; lsof -nP -iTCP:4851 -sTCP:LISTEN | tail -1; pnpm build > /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/build-spike.log 2>&1; echo "build exit $?"42:T47a,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/maths && cat > heights.ts <<'EOF' // How far /log scrolls, and where the layer and the ghost's drawing end up at the bottom. import { chromium } from "/home/user/wt-pixel-33/node_modules/@playwright/test/index.mjs"; const browser = await chromium.launch(); for (const [w, h] of [[1440, 900], [1024, 768], [390, 844]]) { const page = await browser.newPage({ viewport: { width: w, height: h } }); await page.goto("http://localhost:4851/log"); await page.evaluate(() => scrollTo(0, document.documentElement.scrollHeight)); await page.waitForTimeout(200); console.log(w, h, JSON.stringify(await page.evaluate(() => { const m = document.querySelector("[data-model]")?.getBoundingClientRect(); const d = document.querySelector(".plan-ghost")?.getBoundingClientRect(); return { scrollHeight: document.documentElement.scrollHeight, layer: m && [Math.round(m.top), Math.round(m.bottom)], drawing: d && [Math.round(d.top), Math.round(d.bottom)], innerHeight }; }))); await page.close(); } await browser.close(); EOF sh run.sh heights.ts43:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/mount.ts' s=open(p).read() def rep(a,b): global s assert a in s, a[:80] s=s.replace(a,b) rep(''' /** The layer's box against the viewport. Under forced colours the layer has none. */ const box = () => host.getBoundingClientRect(); /** On screen now: the loft plays only to someone who can see it. */ const visible = () => { const r = box(); return r.width > 0 && r.bottom > 0 && r.top < innerHeight; }; /** Within a viewport of the screen, as the observer's margin is: a redraw waiting for that is * drawn before the model scrolls into view (Lens's nit on #72). */ const near = () => { const r = box(); return r.width > 0 && r.bottom > -innerHeight && r.top < 2 * innerHeight; };''',''' /** The layer's box against the viewport. Under forced colours the layer has none. */ const box = () => host.getBoundingClientRect(); /** * What must be on screen: the layer, which is the drawing's row on the sheet; on the Log, whose * main is a flex column below 1024 px, the layer is all of main, so the drawing (spike, sprint 33). */ const shownBox = () => box().width > 0 ? (ghost ? wide : host).getBoundingClientRect() : box(); /** On screen now: the loft plays only to someone who can see it. */ const visible = () => { const r = shownBox(); return r.width > 0 && r.bottom > 0 && r.top < innerHeight; }; /** Within a viewport of the screen, as the observer's margin is: a redraw waiting for that is * drawn before the model scrolls into view (Lens's nit on #72). */ const near = () => { const r = shownBox(); return r.width > 0 && r.bottom > -innerHeight && r.top < 2 * innerHeight; };''') rep(''' seen.observe(host);''',''' seen.observe(ghost ? wide : host);''') open(p,'w').write(s) EOF pnpm exec tsc --noEmit 2>&1 | grep error; kill 30437; sleep 1; lsof -nP -iTCP:4851 -sTCP:LISTEN | tail -1; pnpm build > /tmp/claude-0/-home-user-theseus-portfo44:Tfb2,# Sprint 33, notes from Iris: the ghost hull's five calls (B5c) The five "Iris's call" items in `contract.md`, as numbers Pixel and Forge can type and Probe can check. Each is inside the approved direction (`.crew/sprint/17/direction-iris.md`, `log-1440.webp`, `log-390.webp`); the departures from the frames are listed at the end, for the owner. **What I judged on.** Production is still B5a: Vercel refused #82's deploy ("Deployment rate limited — retry in 24 hours", the `Vercel` status on 4070914), so it has no Date column and no lines figure. So I judged main's build at a0f3efe (`next start` on 4820) and `/` on production, at 320, 390, 768, 1024 and 1440 in both schemes. Then I built a prototype of the ghost in three.js 0.186.1 over main's `/log`. It uses the real geometry from `lib/half-model.ts` and `lib/hull-layouts.ts` and the page's own tokens and spans, and every number below was measured on its SwiftShader frames. The frames and the prototype's code are in `.crew/screenshots/33-iris/` (`final-*`, `move*`, `record-*`, `oneside-*`, `ctl-*`; `proto/ghost.js`). The prototype is a reference for the look. It isn't the build: its stem has a dark notch that `lib/model/hull.ts`'s closed bands don't have. **One correction to the contract's reading of the frame.** `log-1440.webp`'s planks don't "stand slightly apart". Its gaps are the 7 originals that were still sailing when it was drawn (15 of 22 out on 21 Oct). Today all 22 are out, so the hull is whole. A gap shows only on a fixture with fewer than 22 merged sprints, and then it is nothing, on both sides. ## 1. The vellum in 3D **What it is.** The ghost is the 22 original seats on both sides of the hull, since a seat is port and starboard. It has no deck and no transom face, because neither was a plank, and it casts no shadow. So it is the original ship reassembled from what the crew took out, and it is hollow: from the settled view you see into it. **The material.** It is the card's lit standard material, made translucent: - **α 0.7 settled, in both schemes.** At each frame the colour is solved from the tokens the page computes, per sRGB channel: `C = (V − (1 − α) · B) / α`, where V is `--vellum` and B is `--background`. So the unlit composite over the film is `--vellum` exactly at every α. That gives light ≈ `#cfdcdc` (the token's own recipe) and dark `#536369`. Never hard-code either. - **Frame 1 is α 1 and uLit 0,** which is the 2D fill exactly, so the 3D's arrival changes no pixel. During the move α runs to 0.7 and uLit to 0.5 on the eased progress (`min(1, 1.25e) × 0.5`). - **Two passes:** the far side (back faces), then the near side (front faces), with depthWrite off and the lines drawn first. Through the near planks you then see the far side's seams faintly, as vellum shows the lines under it. That's the material's own look and nothing else does it. Draws: far, near, seams, outline, marks, so 5 of the 8. - **The light** is the card's rig unchanged in direction (sky, a frontal fill, the sun from the upper left), at half the card's lit mix (uLit 0.5). The rig runs × 1.35 in light. In dark it is the warm lamp at `DARK_GAIN` × 0.4 (1.6 in all). Settled composites I measured at 1440, clear of lines and numbers: | | Upper strakes | Bilge | Token | Bound | |---|---|---|---|---| | Light | `#dbeae8`, OKLab L 0.925 | `#c5d4d2`, L 0.858 | `--vellum` L 0.904 | never lighter than the film (L 0.952) | | Dark | `#576568`, L 0.496 | `#485557`, L 0.439 | `--vellum` L 0.410 | never lighter than `--card` (L 0.495) | The inside of the hull, seen above the near sheer, is a single layer facing the sky. In light it reaches about L 0.94, which is still under the film. **Lines.** | Line | Weight | Light | Dark | Why | |---|---|---|---|---| | Seams and butts | 0.75 px | `--pencil` | `--muted` | pencil reads 2.2 to 2.7:1 on the lit vellum in light, but 1.2:1 at night; graphite reads 2.5 to 3.4 | | Outline: both sheers, the stem and keel, the transom's edges | 1.4 px 45:T6b4,cd /home/user/theseus-portfolio/.crew/sprint/33; python3 - <<'EOF' p='contract.md' s=open(p).read() def rep(a,b): global s assert s.count(a)==1, a[:60] s=s.replace(a,b) rep("""`log-1440.webp` and `log-390.webp` (`.crew/sprint/17/design/`): the ghost in 3D, a three-quarter view with the planks standing slightly apart, numbered on the planks, Full/Calm/Off in the bar at 1440. Iris's calls are in `.crew/sprint/33/notes-iris.md`, Pixel's spike in `spike-pixel.md`; where a rule below is theirs it says "Iris's call" or "Pixel's call".""","""`log-1440.webp` and `log-390.webp` (`.crew/sprint/17/design/`): the ghost in 3D, a three-quarter view numbered on the planks, Full/Calm/Off in the bar at 1440. The frame's gaps are the 7 originals still sailing when it was drawn; today all 22 are out, so the hull is whole (Iris). Iris's calls are folded in from `.crew/sprint/33/notes-iris.md` and marked "Iris's call"; Pixel's spike is `spike-pixel.md`.""") rep(""" marked in 3D as the 2D drawing marks it (`path[data-current]`; how it looks is Iris's call).""", """ marked in 3D as the 2D drawing marks it: its four edges in ink at 1.4 px and its number at 700 (Iris's call).""") rep(""" `/log/`, so Back returns. Touch is Iris's call, inside two rules: a drag over the canvas scrolls the page as on `/` (B3.13), and a tap that moved past the slop never opens a record.""",""" `/log/`, so Back returns. Touch opens records too, at every width (Iris's call): a drag over the canvas scrolls the page as on `/` (B3.13), and a tap that moved past 10 CSS px, or that the browser turned into a scroll, never opens one.""") open(p,'w').write(s) EOF grep -n "Back$\|so Back" contract.md46:T5b7,cat >> .claude/agent-memory/design-director/MEMORY.md <<'EOF' - A translucent material keeps its token over the film if its colour is solved per sRGB channel, C = (V − (1 − α)·B)/α, at every α: frame 1 at α 1 equals the 2D fill and α can ramp with no pop; stacked layers lighten on a dark ground, so the night gain falls as layers add (the ghost's two sides needed the lamp at 1.6, not 1.8, to stay under `--card` and keep light ink at 4.8:1) (`.crew/sprint/33/notes-iris.md`, 1). - Fixed-px HTML numbers on a turned 3D hull crowd where the turn foreshortens a tapering end (the stern at 1024): count label-box clashes per pose at every width before picking a pose; only the frame's −20/12 cleared at 1024, with a slide-along-its-own-plank stagger (`.crew/sprint/33/notes-iris.md`, 2 and 3). - Prototype a 3D call over the real page: tsc the geometry modules from `lib/` to JS, serve them and three's files from a CORS static server that rewrites bare `from "three"`, inject the scene as a module with Playwright, and sample the PNG for composites and contrast (sprint 33; the code was in `.crew/screenshots/33-iris/proto/`, which git ignores). - A canvas pick borrows the site's link grammar, ink and a heavier line on hover with a pointer cursor, which is also the record mark's look; never copper (live only), a tooltip card or an accent (`.crew/sprint/33/notes-iris.md`, 4). EOF tail -5 .claude/agent-memory/design-director/MEMORY.md | cut -c1-12047:T7d2,I've written the notes with all five calls, each inside the approved direction. They differ visibly from the approved frames in three places, all listed for the owner at the end of the notes; only the first is a real choice. Notes: `/home/user/theseus-portfolio/.crew/sprint/33/notes-iris.md`. **How I made the calls.** Production is still B5a because Vercel refused #82's deploy, so I judged a local build of main at a0f3efe. I then built a three.js prototype of the ghost over that page, using the hull geometry from `lib/` and the page's own tokens and numbers. Every number in the notes comes from its frames. It's SwiftShader in headless Chromium, so colours are exact but the feel needs a GPU. **The five calls:** 1. **Vellum in 3D.** All 22 original planks on both sides of the hull, with no deck, no transom face and no shadow, so the hull is open and you see into it. - The material is see-through at 70% opacity. Its colour is solved from the tokens at every frame, so over the page it still comes out as `--vellum`: frame 1 equals the 2D drawing exactly and fading the opacity causes no pop. - Two passes, far side then near side: 5 of the 8 draws. - Lit with `/`'s lights at half strength, × 1.35 in light and × 1.6 at night. - Measured, the light ghost stays a shade darker than the page (never white). At night it never gets lighter than `--card`, which keeps the numbers at 4.8:1 at the worst. - Against `/`'s white card it reads as opaque, lit, shadowed against translucent, open, shadowless: the same ship, made of what was taken out. - B5.18's "within 8 levels of `--vellum`" fails the lit bilge, so the notes give lightness bands for Probe instead. 2. **Numbers.** They are the 2D drawing's own HTML spans, moved onto their planks. So they match the 2D rule by construction and the harness reads them directly. - Face and sizes are unchanged from B5a (Sofia Sans 600, ink; 13, 11 and 13 px by width), hidden below 768. - A number that would touch a neighb48:Tfa0,# Sprint 33 contract: the ghost hull in 3D on `/log` (B5c) Quill, 2026-10-25. The last sprint of B5, as sprint 29 planned it (`.crew/sprint/29/b5-plan.md`, "B5c"). It builds on the model and the control as sprints 25 to 27 shipped them, and their contracts' data rules hold word for word except where this one changes them. It builds on `/log` as B5a and B5b shipped it (`.crew/sprint/29/b5-first-contract.md`, `.crew/sprint/32/contract.md`). The approved frames are `log-1440.webp` and `log-390.webp` (`.crew/sprint/17/design/`): the ghost in 3D, a three-quarter view numbered on the planks, with Full/Calm/Off in the bar at 1440. The frame's gaps are the 7 originals that were still sailing when it was drawn. Today all 22 are out, so the hull is whole (Iris). Iris's calls are folded in from `.crew/sprint/33/notes-iris.md` and marked "Iris's call". Her prototype and frames are in `.crew/screenshots/33-iris/`. Pixel's spike (`spike-pixel.md`) is due to confirm the costs. Every number here was measured on a build of main at a0f3efe unless it says otherwise. GPU numbers are SwiftShader's floor, and 30 fps on a phone is checked on the owner's phone at the demo. ## Outcome A hiring executive follows "All 30 revisions in the Log". The ghost hull stands up off the sheet in vellum: the ship's 22 original planks, each numbered by the sprint that took it out, with one camera move, and then it is still. A pointer or a tap on a plank opens that sprint's record, and the table under it stays the way in for the keyboard. Calm shows the hull settled. Off is today's drawing, with no 3D downloaded. The choice is the one they already made on `/`. ## The calls I made 1. **The model is on `/log` and on every record.** A record is the Log with the record open (B5a). A pick opens a record. Without the model, the record would flatten the hull and drop the control from the bar on the very page the pick opened. On a record, the record's own seat is marked in 3D as the 2D drawing marks it: its four edges in ink at 1.4 px, and its number at weight 700 (Iris's call). 2. **One storage key, `theseus:motion`, shared with `/`.** Motion is a preference about the site, not about one page. A visitor who pressed Off on `/` and then watches the hull move on `/log` was ignored, and someone who needs less motion shouldn't have to say so twice. It also costs 0 B, since the store is a module `/` already ships. 3. **The camera move plays once a visit, on its own flag.** It plays on the first Log page of a visit. The flag is in sessionStorage, kept in the chunk, separate from `/`'s `theseus:model`. So a visitor who saw the loft on `/` still sees the archive's move once, and every later Log page of the visit opens settled, including the record a pick opens. A press of Full replays the move, as it does on `/` (sprint 27, decision 4). 4. **The loader doesn't grow for `/log`; the seam is in the chunk.** - `components/model.tsx`'s module is 2,038 B decoded, and B2.10 leaves `/` 10 B of headroom (measured below). - In a scratch build, `/log` rendered the same `` and `` unchanged. With WebGL refused, `/log` requested exactly `/`'s six files, the 2,038 B chunk among them. With WebGL, it requested the same 3D chunk file as `/`. - So `/log` renders those two components as they are. The chunk tells the sheet from the ghost by the drawing beside its layer (`[data-plan]` or `[data-ghost]`; `host.previousElementSibling` today). - The chunk takes the ghost's seats from the 2D drawing in the page (`[data-ghost] path[data-plank]` with its `data-sprint`, which B5.4 already checks against the oracle). It moves the drawing's own number spans. So the 3D can't disagree with the 2D. - The 3D chunk stays one file for both routes, so a visitor coming from `/` downloads no second 3D. - Lens's nit on #74 takes about 3 B of the 10. If the seam needs more loader bytes than that leaves49:Tfa1,# Sprint 33 spike (Pixel): the model's mount on `/log` Pixel, 2026-10-25. A scratch mount of the ghost hull on `/log` in my worktree (`/home/user/wt-pixel-33`, branch `pixel/33`, from c299b7d), measured with B3's own harness (`e2e/webgl.ts`'s `openModel`, the frame and draw recorder) and B2.10's and B3.6's byte methods against `next start` on 4850 (the base) and 4851 (the spike). The scratch ghost is one side, opaque, cursor-only hover, built before Iris's notes landed; section 2 adds her look as counted geometry. Every GPU number is SwiftShader's floor. The scripts are in my scratchpad (`maths/`). ## The answer - **The seam is the DOM, and the loader doesn't change by a byte.** `components/model.tsx` renders on `/log` as it is (`` right after the ghost). The chunk tells the routes apart by the drawing beside its layer (`[data-ghost]`, not `[data-plan]`) and reads the ghost's seats and numbers off that drawing (`path[data-plank][data-sprint]`, which the server drew with `ghostPlanks`, B5.4's oracle). So the 3D can't disagree with the 2D, and B2.10's 10 B stays untouched (Lens's #74 nit is the only loader change, about 3 B). - **One chunk, the same file on both routes:** 147,126 B gzip -9 with the spike's ghost code in it (`/`'s today: 145,277 B), at 1440 and 390, on `/` and `/log`. A visitor from `/` downloads no new 3D. - **Cheap:** 3 draws and 15,580 triangles from 768 px, 5,476 below, in the scratch ghost. Iris's both-sides ghost is 26,288 and 8,432 with two hover or record marks, **if** her two passes draw one side's index range each; as three's default two-pass `DoubleSide` it's 46,288 and 13,632, over both budgets (section 2). - **0 frames at rest** with the pointer across all 22 numbers. Off-screen and hidden hold once visibility is judged on the drawing's box, not the layer's (section 5, item 3). - **Pick by raycast at rest, against a coarse proxy:** 0.1 ms a move (0.5 to 0.7 ms against the drawn mesh, 2.9 ms at 4x CPU). The slot maps to `PLANKS[slot].id`, then to the drawing's `data-sprint`. In the scratch build, 21 of 22 numbers' centres opened their own record. "20" (seat 5.0, led out aft of the hull) opened nothing, which is why Iris tests that number's box first. An ID buffer is out: a pick render is a draw at rest. - **The numbers as HTML moved by a transform** (Iris's call, and sprint 17's own render did it). That costs 0 draws and 0 textures, frame 1 changes no number pixel, and the browser does about 0.7 ms of style work per moving frame at 768 on this CPU (from the trace). In dark, `/`'s ×4 lamp puts 8 to 9 numbers under 4.5:1; Iris's 1.6 fixes the cause (section 4). ## 1. What's shared and what's per route | | Shared, unchanged | Per route (the ghost's, in the chunk) | |---|---|---| | Loader, mode, control, storage | `components/model.tsx` byte for byte; `theseus:motion` | nothing | | Lifecycle | idle import, WebGL 2 probe, stepped build, rest, 0 frames at rest, resize and 768 crossing, scheme, forced colours, bfcache, lost context, quality net | the once-a-visit flag `theseus:ghost` beside `/`'s `theseus:model` (contract call 3); visibility judged on the drawing | | Geometry | `buildHull` at `DESKTOP` from 768, `PHONE` below; plank slots; the outline | `buildHull(level, seats)`: the ghost's seats only, no deck or transom; the ghost's own edges | | Scene | renderer, card material and its slot lookup, fat lines, rig, the hand-set dolly-zoom camera | `createStage(canvas, hull, ghost)`: vellum tints, ghost line tokens and weights, no shadow; `pick()` and `screen()` | | Loft | `makeLoft`, its solve, the 48-sample table, `ease()` | a `Settle` per layout: `GHOST` gets its own turn, lift, growth, and (for Iris) its `HOLD` and duration | | Drawing | the canvas on the drawing's box in whole buffer pixels | one drawing (`.plan-ghost`, `GHOST` layout) at every width, both `Sheet`s pointing at it | The smallest seam, as built on `pixel/33`: - `lib/model/moun4a:T750,cd /home/user/wt-pixel-33 && python3 - <<'EOF' def edit(p, pairs): s=open(p).read() for a,b in pairs: assert a in s, (p, a[:70]) s=s.replace(a,b) open(p,'w').write(s) edit('lib/model/mount.ts', [ (''' const t0 = performance.now(); const slot = stage.pick(x, y); ((globalThis as unknown as { __pick?: number[] }).__pick ??= []).push( performance.now() - t0, );''',''' const slot = stage.pick(x, y);'''), (''' ghost && location.search.includes("proxy") ? buildHull({ stations: 24, rows: 2 }, ghost.seats) : undefined,''',''' ghost ? buildHull(PICK, ghost.seats) : undefined,'''), (''' nearSide, PHONE,''',''' nearSide, PHONE, PICK,'''), ]) edit('lib/model/stage.ts', [ (''' /** A coarse hull to pick against instead of the drawn one (spike: ?proxy). */''',''' /** A coarse hull to pick against: a ray costs 0.1 ms on it, 0.5 to 0.7 on the drawn one. */'''), ]) edit('lib/model/hull.ts', [ ('''export const PHONE: Level = { stations: 56, rows: 4 };''','''export const PHONE: Level = { stations: 56, rows: 4 }; /** * The ghost's pick hull (.crew/sprint/33/spike-pixel.md, section 3): never drawn. Every level's * stations include each plank's ends and its rows its seams, so its plank edges are the drawn * hull's; only the curve between them is coarser. */ export const PICK: Level = { stations: 24, rows: 2 };'''), ]) edit('components/log.tsx', [ (''' {/* Spike (sprint 33): the ghost in 3D, read off the drawing beside it. */}''',''' {/* The ghost in 3D (sprint 33's spike), read off the drawing beside it by the chunk; the loader is /'s, unchanged. */}'''), ]) EOF grep -n "__pick\|proxy" lib/model/*.ts; pnpm exec tsc --noEmit 2>&1 | grep error; pnpm exec biome check --write lib/model components/log.tsx app/globals.css 2>&1 | grep -E "Checked|error|×"4b:T7d2,cd /home/user/theseus-portfolio/.crew/sprint/33; python3 - <<'EOF' import re p='contract.md' s=open(p).read() for n in range(25,16,-1): s=s.replace(f"B5.{n}", f"B5.{n+1}") def rep(a,b): global s assert s.count(a)==1, ("MISSING", a[:70]) s=s.replace(a,b) rep("""B5b ended at B5.16 (`e2e/log-dates.spec.ts`; confirmed with `playwright test --list`).""", """B5b's checks are B5.12 to B5.16, plus B5.17, "Nothing else moves", the B5a suite rewritten in place (`.crew/sprint/32/contract.md`; `e2e/log-dates.spec.ts`, line 36). So B5c starts at B5.18 (Pixel caught it: `playwright test --list` shows no B5.17 title).""") rep("""Pixel's spike (`spike-pixel.md`) is due to confirm the costs.""","""Pixel's spike is folded in from `spike-pixel.md` (his scratch mount on `pixel/33` is the start of the build).""") rep(""" today).""",""" today). Pixel's spike built it that way, and `components/model.tsx` changed by 0 bytes.""") rep("""- It plays once a visit across the Log (call 3), and a press of Full replays it. A hidden tab or an off-screen layer opens settled.""","""- It plays once a visit across the Log (call 3), and a press of Full replays it. A hidden tab, or a ghost drawing that is off-screen, opens settled. Visibility is judged on `[data-ghost]`'s box, not the layer's: below 1024 `main` is a flex column, so `[data-model]`'s box is all of `main` (Pixel measured −2,947 to +844 px at 390) and would always count as on screen.""") rep("""**Off.** B5a's drawing, exactly as today""","""**How it's built** (Pixel's spike, for the builders; not a visitor rule): - Draw each side's index range once, the far pass and then the near pass: two geometries sharing the buffers, or groups with `BackSide` and `FrontSide` materials. Three's default two-pass transparent `DoubleSide` draws the card twice: 46,288 triangles from 768 and 13,632 below, over both budgets. Per-side ranges with the shared lift seams give 26,288 and 8,432 in 5 draws. - Pick by raycast at re4c:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='.claude/agent-memory/creative-engineer/MEMORY.md' s=open(p).read() old='''- Check loft maths in node before a browser: `lib/model`'s loft, hull and calls transpile with the repo's own typescript (no three.js), and `makeLoft`'s poses compared at full precision prove another width unchanged bit for bit (`.crew/sprint/26/`).''' assert old in s s=s.replace(old,'''- Check loft maths in node before a browser: `lib/model`'s loft, hull and calls have no three.js, so node's own type stripping runs them with a small `module.register` resolve hook (`@/` to the repo, extensionless imports to `.ts`), and `makeLoft`'s poses compared at full precision prove another width unchanged bit for bit (sprints 26 and 33).''') s=s.rstrip('\n')+''' - The model's loader (`components/model.tsx`) can't grow: B2.10 leaves `/` 10 B. A second route's differences live in the chunk, which reads the page's own DOM (the drawing beside `[data-model]` and its `data-plank`/`data-sprint`), so `/log` renders `` unchanged (sprint 33). - Flex and grid items paint in order-modified document order: an absolute layer after an item with `order: 2` paints under it unless it shares the order. On `/log`, `[data-model]` painted under the ghost until it got `order: 2` (sprint 33). - `[data-model]`'s `inset: 0` is the drawing's row only where `main` is a grid; on `/log` below 1024 `main` is flex and the layer is the whole page, so "on screen" must be judged on the drawing's box (sprint 33). - Picking: three's `Mesh.raycast` walks every triangle (0.5 to 0.7 ms a ray on 10,000, 2.9 at 4x CPU); a coarse never-drawn hull (24 stations x 2 rows) costs 0.1 ms with exact plank edges. A style write on `main` per pointermove costs more than the ray (it restyles the table): write the cursor on change, on the canvas (sprint 33). - three's transparent `DoubleSide` draws two full passes by default, doubling submitted triangles (the ghost both sides: 46,288 against 30k); split4d:T7d0,The B5c contract is ready for Probe, Pixel and Forge: `/home/user/theseus-portfolio/.crew/sprint/33/contract.md`. It weakens and retires no test, so the PR shouldn't need to wait for the owner. Iris's notes and Pixel's spike are both folded in. Nothing is committed. **Numbering.** B5c's checks start at B5.18, not B5.17. Pixel caught it: sprint 32's contract has a B5.17 ("Nothing else moves", the B5a suite rewritten in place) that has no test title of its own. Both their notes cite my draft's numbers, one lower than the final ones; the contract says so. **The checks, one line each** - **B5.18 It stands on the Log.** `[data-model]` sits right after `[data-ghost]` and reaches rest. Frame 1 is registered on the 2D ghost with the Off page's fills. The canvas lies on the ghost's box at 320 to 1440. No model or WebGL context on `/read` or the 404. - **B5.19 Vellum, numbered by the 2D rule, nothing copper.** Iris's colour bands per plank in both schemes. The 22 number spans read the oracle's `GHOST`, each at least 10 px, 4.5:1 and 2 px clear of the others. No pixel near `--accent`. Exactly one marked seat on `/log/13`. - **B5.20 Full.** One 1.8 s camera move, length held within 1%, once a visit across the Log. Any input settles it within 2 frames and opens nothing. Pressing Full replays it. - **B5.21 Calm and reduced motion.** Settled with no moving state, 0 frames at rest, 1 on a scheme switch, and the fade ends within 300 ms. - **B5.22 Off downloads nothing.** On every Off path (stored, pressed, WebGL refused, forced colours, Save-Data, print, scripts off): no chunk, no context beyond the probe, the B5a drawing with no number moved. - **B5.23 Cheap and still.** At most 8 draws a frame, 30,000 triangles from 768 px and 12,000 below. 0 frames at rest, off-screen and hidden; 1 frame per hovered-plank change. The chunk is at most 250,000 B gzip and is the same file `/` loads. - **B5.24 A plank opens its record.** A click at each number's centre opens that record; a click of4e:T7d2,cat > .crew/sprint/33/brief-probe.md <<'EOF' # Brief: Probe, sprint 33 (B5c's checks, red first) **What it's for.** B5c puts the card model on `/log` and every `/log/` as the ghost hull in vellum, under the Full/Calm/Off control, with a plank opening its record. Your checks are how the team, Lens and the owner know it does what the contract says, on every path a visitor takes. **Your job.** Turn `.crew/sprint/33/contract.md` into Playwright checks in `e2e/`: B5.18 to B5.26, and the rewrites its "The live checks" table lists (same assertions; none loosened, none retired, no `test.skip(`). The data rules are in the contract word for word: your oracle (`e2e/retros.ts` and friends) implements the same rule the page does. Read Iris's notes (`.crew/sprint/33/notes-iris.md`, the colour bands and the pick) and Pixel's spike (`.crew/sprint/33/spike-pixel.md`, the hooks a harness can read). Reuse the B3 harness (`e2e/model.ts`, `e2e/webgl.ts`, `e2e/pixels.ts`, `e2e/pose.ts`) and `.crew/STATE.md`'s "Specs" and "The browser" lessons (ratio-dependent reads at rest, `preserveDrawingBuffer`, text over WebGL asserted by what it must do, not by its pixels). Every new check must be red on today's code (or, if a check could pass on main, say which and why). Push the specs first, before the build lands, so the builders can run them. A hook a check needs from the page (a data attribute, a test switch) is named in your report for Pixel and Forge; prefer hooks the B3 harness already reads. **Setup:** `git worktree add -b probe/33 /home/user/wt-probe-33 origin/sprint/33-b5c-ghost-3d`; `pnpm install --frozen-lockfile`; ports 4810 to 4819 (`PLAYWRIGHT_PORT=4811 pnpm test:e2e …`); servers with node, killed by PID. Commit to `probe/33` and push after every commit (`git push -u origin probe/33`); Atlas cherry-picks onto the sprint branch. **Files you own:** `e2e/` and your memory. Not product code. **Report:** the commits, each check's title with its red-on-main result, the hooks the b4f:T7a2,cd /home/user/theseus-portfolio/.crew/sprint/33 && python3 - <<'EOF' p='spike-pixel.md' s=open(p).read() def rep(a,b): global s assert a in s, a[:70] s=s.replace(a,b) rep('''- **One chunk, the same file on both routes:** 147,126 B gzip -9 with the spike's ghost code in it (`/`'s today: 145,277 B), at 1440 and 390, on `/` and `/log`. A visitor from `/` downloads no new 3D.''','''- **One chunk, the same file on both routes:** 147,094 B gzip -9 with the spike's ghost code in it (`/`'s today: 145,277 B, so +1,817 B), at 1440 and 390, on `/` and `/log`. A visitor from `/` downloads no new 3D. - **`/` is untouched:** - `/` with WebGL refused is still 460,920 B decoded in 6 files. - `/log` with WebGL refused loads exactly those files (the 404: 458,882 B in 5). - Against the spike's build, `/`'s B3.1, B3.6, the rest of `model-landing`, and `motion.spec.ts` all pass (see item 6 of section 5).''') rep('''6. **The default path turns two Log checks red,** run against the spike (the full list is in the report): B5.10's "load the 404's script files and bytes" and B5.4's "every plank filled with `--vellum`" (the ghost goes hollow under the model). The contract's plan, the Log specs on the WebGL-refused path with B5.10 rewritten against `/`'s files, covers both.''','''6. **The default path turns two Log checks red.** I ran `model-landing`, `model-cost`, `motion`, `log`, `log-record`, `log-dates` and `log-entry` against the spike's build: 69 passed and 2 failed, both as expected. - B5.10's "load the 404's script files and bytes": `/log` requests two more files, the loader and the 3D chunk. - B5.4's "ghost numbers at 1440 (dark)": 0 found, because the 2D numbers are hidden under the model. The contract's plan (the Log specs on the WebGL-refused path, with B5.10 rewritten against `/`'s files) covers both.''') open(p,'w').write(s) EOF grep -n "147,\|69 passed" spike-pixel.md50:T54f,cd /home/user/wt-pixel-33 && git add app/globals.css components/log.tsx lib/model/calls.ts lib/model/hull.ts lib/model/loft.ts lib/model/mount.ts lib/model/stage.ts && git commit -q -F - <<'EOF' Sprint 33 spike: the model's mount on /log, the start of B5c's build The chunk tells the Log from the sheet by the drawing beside its layer ([data-ghost]) and reads the ghost's seats and numbers off it, so components/model.tsx renders on /log unchanged and B2.10 keeps its 10 B. One chunk for both routes (147,094 B gzip -9). The ghost is one side, opaque, in vellum, numbered by the drawing's own lettering moved with its plank, picked by a raycast against a coarse hull at rest; visibility is judged on the drawing, and the layer takes the ghost's flex order so it paints over it. Iris's look (notes-iris.md) is not in yet. Measurements: .crew/sprint/33/spike-pixel.md. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01Yaev4dLzNtwRXcCAUtDg5D EOF git add .claude/agent-memory/creative-engineer/MEMORY.md && git commit -q -F - <<'EOF' Pixel's memory: the loader can't grow, paint order, the layer's box, picking, two-pass DoubleSide Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01Yaev4dLzNtwRXcCAUtDg5D EOF git log --oneline -3; git status --short51:T7d1,The model mounts on `/log` without changing `components/model.tsx` by a byte, as one 3D chunk shared with `/`; Iris's both-sides ghost fits the budgets only if each of her two passes draws one side's triangles. The notes are in `/home/user/theseus-portfolio/.crew/sprint/33/spike-pixel.md`, uncommitted for you to commit. I read Iris's notes and Quill's contract as they landed; Quill has already moved B5c's checks to start at B5.18. **The seam I recommend.** - `/log` renders `` right after `[data-ghost]`. The 3D chunk tells the routes apart by the drawing next to its layer (`[data-ghost]` against `[data-plan]`). - It reads the ghost's seats and numbers off that drawing (`path[data-plank][data-sprint]`, which the server drew from the same rule as the 2D). So the 3D can't disagree with the 2D, and B2.10's last 10 B on `/` stay untouched. - Inside the chunk the changes are small: - `start()` points both sheets at `.plan-ghost`; the level still steps at 768. - `buildHull` takes the ghost's seats. - `createStage` takes a ghost flag. - `Settle` gains a per-route lift, with a ghost branch. - The move plays once a visit on its own flag, `theseus:ghost`. - For Iris's look, the build also needs the hold and the duration per route; both are global constants today. - `/`'s geometry and loft are unchanged bit for bit (node comparison against the base: both levels, 8 drawing widths × 101 steps). **Numbers and how I measured them.** I used B3's harness (`openModel`, its draw and frame recorder) and B2.10's and B3.6's byte methods, on `next start` of the base and of the spike. All GPU numbers are SwiftShader's floor. | Measure | Result | |---|---| | 3D chunk | 147,094 B gzip -9 against `/`'s 145,277 today; one file, the same on `/` and `/log` at 1440 and 390 | | Scripts, WebGL refused (decoded) | `/` still 460,920 B in 6 files; `/log` loads exactly those files; the 404 is 458,882 B in 5 | | Scratch ghost (one side, opaque) | 3 draws; 15,580 triangle52:T7d1,git push -q 2>&1 | grep -iv undici | grep -v trace; cat >> .crew/sprint/33/decisions.md <<'EOF' 3. **The build starts from Pixel's spike** (07e2a69, cherry-picked with his memory, 82c27f8): the seam is in the 3D chunk, which reads the ghost's seats off `[data-ghost]`'s paths, so `components/model.tsx`'s loader is unchanged and `/`'s geometry and loft are identical. Pixel's three open items are already in the contract: per-side index ranges for Iris's two passes (26,288 and 8,432 triangles in 5 draws; three's default `DoubleSide` would break both budgets), the rest window with the pointer off the hull, and the off-screen window at 1440 × 600, 1024 and 390. 4. **Two builders on written-down files.** Pixel owns the chunk (`lib/model/*`) and the model layer's CSS: Iris's look, the pick, the move, the hover and record marks, the number spans riding their planks. Forge owns the page side: `components/log.tsx`, `components/log-record.tsx`, `app/log/**`, `components/bar.tsx`, the control's place on `/log` (bar from 768, the row after the header below), Lens's nit on #74 in `components/model.tsx`'s `MotionControl`, and Iris's rule-width rider. `app/globals.css` is shared: Pixel's rules stay under the model layer's selectors, Forge's under the Log's header and the control's row, each in its own block. EOF cat > .crew/sprint/33/brief-pixel.md <<'EOF' # Brief: Pixel, sprint 33 (the build: the ghost in 3D) **What it's for.** As in your spike brief: the ghost hull in vellum on `/log` and every record, the archive moment of B5. Build it to `.crew/sprint/33/contract.md` (which folds in your spike) and Iris's look in `.crew/sprint/33/notes-iris.md`. Your spike's open list is the work: both sides and translucency with per-side index ranges in two passes; the drawing's own number spans riding their planks (not copies), with Iris's slide for the three 1024 pairs and plank 5.0's leader and box picking; the canvas taking pointer events at rest; hove53:T7d0,cd /home/user/wt-forge-33 && python3 - <<'EOF' import re p='/home/user/wt-forge-33/components/log.tsx' s=open(p).read() s=s.replace('import { Model } from "@/components/model";','import { Model, MotionControl } from "@/components/model";') s=s.replace('''// (.crew/sprint/32/contract.md). A record is the same page with the record open, at /log/, so // opening one is a document navigation and Back closes it with no script. The page loads the // framework's script and nothing else (B5.10), and nothing on it moves or is copper.''','''// (.crew/sprint/32/contract.md). A record is the same page with the record open, at /log/, so // opening one is a document navigation and Back closes it with no script. The ghost stands up in // 3D over its drawing under /'s Full, Calm and Off (.crew/sprint/33/contract.md): with the model // Off, the page loads /'s script and nothing else (B5.10), and nothing on it is copper.''') s=s.replace(''' ''',''' } />''') s=s.replace(''' {newest ? : null} ''',''' {newest ? : null} {/* Below 768 px the bar is full, so the motion control closes the header here, in a row under the lines figure (.crew/sprint/33/notes-iris.md, section 5): under the drawing it would part the hull from its caption, and in the DOM it precedes the record, so Tab meets it where the eye does. #78's Read as page takes the same place: whichever merges second makes this } />. */} ''') s=s.replace(''' {/* The ghost in 3D (sprint 33's spike), read off the drawing beside it by the chunk; the loader is /'s, unchanged. */}''',''' {/* The gh54:T705,cd /home/user/wt-forge-33 && python3 - <<'EOF' p='/home/user/wt-forge-33/components/bar.tsx' s=open(p).read() old='''// paper it is a strip of links nobody can follow. After the links, the sheet passes the motion // control into its slot, shown from 768 px: from 1024 at the bar's right end after Read as page, as // the approved frame draws it. Below 768 the bar is full, and the control sits at the drawing's foot // (app/page.tsx; .crew/sprint/27/). The control is a slot, not an import, so its client module // ships only where the sheet renders it. // // On the Log and its records (.crew/sprint/29/b5-first-contract.md, "The bar"), the wordmark is the // way home, Work and Contact point at the sheet's sections, and Log is current. No control: there is // no model on the Log to move.''' new='''// paper it is a strip of links nobody can follow. After the links, the page passes the motion // control into its slot, shown from 768 px: from 1024 at the bar's right end after Read as page, as // the approved frame draws it. Below 768 the bar is full, and the control sits in the page: at the // drawing's foot on the sheet (app/page.tsx; .crew/sprint/27/), at the header's end on the Log // (components/log.tsx; .crew/sprint/33/). The control is a slot, not an import, so its client // module ships only where a page with a model renders it. // // On the Log and its records (.crew/sprint/29/b5-first-contract.md, "The bar"), the wordmark is the // way home, Work and Contact point at the sheet's sections, and Log is current.''' assert old in s s=s.replace(old,new) s=s.replace(''' /** The motion control, from the sheet. */''',''' /** The motion control, from a page with a model: the sheet, the Log and its records. */''') open(p,'w').write(s) EOF git diff components/bar.tsx | head -4055:T436, line-height: 1.1; color: var(--foreground); } /* * Sprint 33, the header's end (.crew/sprint/33/contract.md, calls 7 and 9; notes-iris.md, * section 5). The lines figure's rule takes the header's whole column while its text keeps the * header's 66ch: from 640 to 1023 px the column is wider than the text, and a rule that stopped * with it read as cut short (Iris, on #82). Elsewhere the column is narrower than 66ch, and the * padding is 0. */ .log-head .log-lines { max-width: none; padding-right: max(0px, 100% - 66ch); } /* The motion control below 768 px (components/log.tsx): a 44 px row 12 px under the lines figure, the group at its right end, on the Log's own 16 px text edge. It takes the figure's order, which it follows in the DOM. The sheet's slot rule (`main > [data-motion]`) would add its 16 px of padding to the Log's gutter. When #78's `Foot` holds the control, `.log > .foot` takes this 12 px and this rule goes. */ .log > [data-motion] { order: 4; margin: 12px 0 0; padding: 0; } .record { order: 5; margin-top: 24px; }56:T7d0,import { expect, type Page } from "@playwright/test"; import { LENGTH } from "../lib/half-model"; import { GHOST as LAYOUT } from "../lib/hull-layouts"; import { type Box, MODEL, pause, whole } from "./model"; import { coverage, decodePng, deltaE, type Image, pixel } from "./pixels"; import { entryOf, RECORD } from "./log"; import { GHOST } from "./retros"; import type { ModelRun } from "./webgl"; // What the B5c checks share (.crew/sprint/33/contract.md): the ghost hull in 3D on /log and every // /log/. The page gives the harness `[data-model]` right after `[data-ghost]` in main, its // `data-state` and its one canvas (B3's hooks), `data-pick=""` on `[data-model]` while a // mouse or pen is over a plank at rest (the contract's one new hook), the canvas's own cursor, and // the drawing's own `.plan-plank` spans, which ride their planks by a `transform`. Nothing else, and // nothing on `window`. Every number the checks compare comes from the oracle (e2e/retros.ts's // GHOST) or the drawing the server rendered, never from the chunk. export const DRAWING = "[data-ghost]"; export const NUMBERS = "[data-ghost] .plan-plank"; /** The Log's two pages the checks run on: the Log, and a record (the contract's sample). */ export const PAGES = ["/log", "/log/13"] as const; /** The record whose seat the record page marks. */ export const MARKED = 13; /** The default sizes: a desktop and a phone (the contract, "The checks"). */ export const SIZES = [ { width: 1440, height: 900 }, { width: 390, height: 844 }, ] as const; /** Full's camera move, ms (Iris's call 3). */ export const MOVE = 1800; /** From this width the numbers show, the desktop mesh draws and the cap is 2. */ export const NUMBERS_FROM = 768; /** Each seat by the number the ghost gives it: GHOST inverted (each sprint takes one seat). */ export const SEAT_BY_NUMBER: ReadonlyMap = new Map( Object.entries(GHOST).map(([seat, n]) => [n, seat]), ); /** The seats in the oracle's order. */ exp57:T523,cd /home/user/wt-forge-33 && python3 - <<'EOF' p='/home/user/wt-forge-33/app/globals.css' s=open(p).read() old=''' * the h1, the drawing, the caption, the count line, the record when one is open, then Every * revision, its 2 px rule edge to edge as the facts' are. The drawing follows the count line in the * DOM and is set after the h1 here; it is hidden from assistive tech, so the reading order is the * DOM's. From 1024 the sheet's inset box as a two-column grid: the drawing beside the header, then * Every revision beside the record, or across both columns on /log. Nothing on it moves. */''' new=''' * the h1, the drawing, the caption, the count line, the lines figure, the motion control's row, * the record when one is open, then Every revision, its 2 px rule edge to edge as the facts' are. * The drawing follows the header in the DOM and is set after the h1 here; it is hidden from * assistive tech, so the reading order is the DOM's. From 1024 the sheet's inset box as a * two-column grid: the drawing beside the header, then Every revision beside the record, or across * both columns on /log. Nothing here moves: the ghost's 3D is the model layer's (above). */''' assert old in s s=s.replace(old,new) open(p,'w').write(s) EOF pnpm exec biome check app/globals.css components/ 2>&1 | tail -2058:T4bc,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/ghost.ts' s=open(p).read() old=''' const index = new Map(); for (const [j, y] of ys.entries()) for (const [i, x] of xs.entries()) index.set(`${x},${y}`, [i, j]); for (const [m, [x, y]] of moves.entries()) { while (p < picks.length && (picks[p]?.at ?? 0) <= m) { current = picks[p]?.pick ?? null; p++; } const at = index.get(`${x},${y}`); if (at && current) grid.set(key(at[0], at[1]), current); }''' new=''' // A move's grid cell by rounding: the event's coordinates may be fractional or coalesced. const [x0, y0] = [xs[0] ?? 0, ys[0] ?? 0]; for (const [m, [x, y]] of moves.entries()) { while (p < picks.length && (picks[p]?.at ?? 0) <= m) { current = picks[p]?.pick ?? null; p++; } const [i, j] = [Math.round((x - x0) / step), Math.round((y - y0) / step)]; const onGrid = i >= 0 && j >= 0 && i < xs.length && j < ys.length && Math.abs(x - (xs[i] ?? 0)) < 0.75 && Math.abs(y - (ys[j] ?? 0)) < 0.75; if (onGrid && current) grid.set(key(i, j), current); }''' assert old in s s=s.replace(old,new) open(p,'w').write(s) EOF59:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/hull.ts' s=open(p).read() def rep(a,b): global s assert a in s, a[:90] s=s.replace(a,b) rep('''const bandAt = (plank: Plank, x: number): [number, number] | null => {''','''/** A plank's depth at station x, top and bottom, or null where it has none. */ export const bandAt = (plank: Plank, x: number): [number, number] | null => {''') # seam lines filtered by the seats rep('''function seamLines(stations: number[], rows: number) { const out: number[] = []; const on = (x: number, y: number, side: number) => surface(x, y, side).p; for (let k = 1; k < BUTTS.length; k++) { const y = seamDepth(k); const [a, b] = ends(y); const xs = stationsIn(stations, a, b); for (const side of [1, -1]) segments( xs.map((x) => on(x, y, side)), out, ); } PLANKS.forEach((plank, i) => { const previous = PLANKS[i - 1]; if (!previous || lift(previous) !== lift(plank)) return;''','''function seamLines( stations: number[], rows: number, seats?: ReadonlySet, ) { const out: number[] = []; const on = (x: number, y: number, side: number) => surface(x, y, side).p; // The ghost's seats: a seam is drawn only beside a plank it has, so a gap leaves none. const beside = (k: number, x: number) => PLANKS.some( (plank) => seats?.has(plank.id) && lift(plank) === k && x >= plank.x0 && x <= plank.x1, ); for (let k = 1; k < BUTTS.length; k++) { const y = seamDepth(k); const [a, b] = ends(y); const xs = stationsIn(stations, a, b); for (const side of [1, -1]) { if (!seats) { segments( xs.map((x) => on(x, y, side)), out, ); continue; } for (let i = 0; i < xs.length - 1; i++) { const [x0, x1] = [xs[i] ?? 0, xs[i + 1] ?? 0]; const mid = (x0 + x1) / 2; if (beside(k - 1, mid) || beside(k, mid)) { segments([on(5a:T407,S=/tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad; cd $S/spike && python3 - <<'EOF' p='lib/model/mount.ts' s=open(p).read() old=''' const hover = (event: PointerEvent) => { const now = Boolean(point(event)); if (now === pointing || !cursor) return; pointing = now; cursor.style.cursor = now ? "pointer" : ""; };''' new=''' const hover = (event: PointerEvent) => { const href = point(event); const now = Boolean(href); // Probe's scratch mock: the contract's data-pick hook and the canvas's cursor. const n = href ? Number(href.slice(5)) : undefined; const seat = n === undefined ? undefined : [...ghost!.numbers].find(([, v]) => v === n)?.[0]; if (seat) host.dataset.pick = seat; else delete host.dataset.pick; canvas.style.cursor = now ? "pointer" : ""; if (now === pointing || !cursor) return; pointing = now; };''' assert old in s s=s.replace(old,new) open(p,'w').write(s) EOF grep -n "numbers" lib/model/mount.ts | head -55b:T7d7,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/calls.ts' s=open(p).read() start=s.index('/**\n * The Log\'s ghost hull') end=s.index('export const GHOST_OUTLINE_PX = 1.4;')+len('export const GHOST_OUTLINE_PX = 1.4;') s=s[:start]+'''// The Log's ghost hull (.crew/sprint/33/notes-iris.md, Iris's calls 1 to 4; contract.md, "What it // shows" and "The view"). One constant a call, as the loft's are. /** * Its one camera move, in ms: the loft's ease over a shorter span, the archive's quieter echo of * the sheet's 2.4 s (call 3). */ export const GHOST_DURATION = 1800; /** * Its settled view at every width (call 3): sprint 17's ghost turn, yaw −20° and pitch 12°, with * the sheet's lift and lens. Its framed length holds at its drawing's, centred on the drawing's * box, so the settled hull stays inside the box the canvas lies on. */ export const SETTLE_GHOST = { dx: 0, dy: 0, yaw: -20, pitch: 12, lift: LIFT }; /** * The vellum (call 1): the card's lit material made translucent, at α 0.7 settled, its colour * solved so the unlit composite over the film is `--vellum`; at half the card's lit mix, under the * rig at × 1.35 in light and the warm lamp at 1.6 in dark (`/`'s × 4 put 8 to 9 numbers under * 4.5:1: spike-pixel.md, section 4). */ export const GHOST_ALPHA = 0.7; export const GHOST_LIT = 0.5; export const GHOST_GAIN = 1.35; export const GHOST_DARK_GAIN = 1.6; /** The ghost's line weights in CSS px: the seams and butts, the outline, and the ink mark of a * record's plank or the hovered one (calls 1 and 4). */ export const GHOST_EDGE_PX = 0.75; export const GHOST_OUTLINE_PX = 1.4; export const MARK_PX = 1.4;'''+s[end:] open(p,'w').write(s) p='lib/model/loft.ts' s=open(p).read() def rep(a,b): global s assert a in s, a[:90] s=s.replace(a,b) rep('''import { G_GHOST, G_NARROW, GROW, HOLD, LIFT, SETTLE, SETTLE_GHOST, SETTLE_NARROW, } from "./calls";''','''import { DURATION, G_NARROW, GHOST_DURATION, GROW, HOLD,5c:T435,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/ghost.ts' s=open(p).read() s=s.replace('''export type SeatPoints = Map;''','''export type SeatPoints = Map; /** A scan: each seat's verified point, and the seat every grid point read, by its CSS px. */ export type Scan = { points: SeatPoints; /** Each grid point that read a seat: [x, y, seat]. */ grid: [number, number, string][]; };''') s=s.replace('''export async function scanSeats(run: ModelRun, step: number) {''','''export async function scanSeats(run: ModelRun, step: number): Promise {''') s=s.replace(''' await page.mouse.move(c.x - 20, c.y - 20); await twoFrames(page); return found; }''',''' await page.mouse.move(c.x - 20, c.y - 20); await twoFrames(page); return { points: found, grid: [...grid.entries()].map(([k, seat]) => { const [i = 0, j = 0] = k.split(",").map(Number); return [xs[i] ?? 0, ys[j] ?? 0, seat]; }), }; }''') open(p,'w').write(s) EOF grep -n "return {$" e2e/ghost.ts | head5d:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/stage.ts' s=open(p).read() def rep(a,b,count=1): global s assert s.count(a)>=1, a[:90] s=s.replace(a,b) rep('''// ported; contract, "Stack"). Three draws a frame at most four: the card (every plank, the deck // and the transom, one merged mesh), the seams and the outline (two fat-line batches), and the // shadow once the model lifts. Nothing loops here: `draw` draws one frame.''','''// ported; contract, "Stack"). Three draws a frame at most four: the card (every plank, the deck // and the transom, one merged mesh), the seams and the outline (two fat-line batches), and the // shadow once the model lifts. Nothing loops here: `draw` draws one frame. The Log's ghost hull // (.crew/sprint/33/contract.md, "How it's built") draws at most five: the card's far and near // sides, each its own index range once, translucent; the seams, the outline, and the ink marks.''') rep('''import { BufferAttribute, BufferGeometry, Color,''','''import { BackSide, BufferAttribute, BufferGeometry, Color,''') rep(''' DirectionalLight, Group,''',''' DirectionalLight, DoubleSide, FrontSide, Group,''') rep(''' SrcAlphaFactor, Vector3,''',''' type Side, SrcAlphaFactor, Vector3,''') rep(''' DARK_GAIN, DARK_LIGHT, GHOST_EDGE_PX, GHOST_OUTLINE_PX, OUTLINE_PX,''',''' DARK_GAIN, DARK_LIGHT, GHOST_ALPHA, GHOST_DARK_GAIN, GHOST_EDGE_PX, GHOST_GAIN, GHOST_LIT, GHOST_OUTLINE_PX, MARK_PX, OUTLINE_PX,''') rep('''import { DECK, type Hull, type Vec3 } from "./hull";''','''import { DECK, type Hull } from "./hull";''') rep('''function cardMaterial() { const uniforms = { uLit: { value: 0 }, uPencil: { value: new Color() }, uStates: { value: Array.from({ length: SLOTS }, () => new Vector4(1, 1, 1, 1)), }, }; const material = new MeshStandardMaterial({ roughness: 1, metalness: 0, // The ink lies on the card: the card steps back a hair so a line5e:T7d0,import { type Browser, expect, type Page, test } from "@playwright/test"; import { bareView, canvasAlone, centreOf, copper, DRAWING, drawnLength, ghostBox, ghostDrawing, ghostFit, ghostNumbers, hullBox, landedOn, MARKED, markedSeat, markVisit, MOVE, medianIn, NUMBERS_FROM, oklab, onEdge, PAGES, pickOf, rgbOf, SEAT_BY_NUMBER, SEATS, SIZES, scanSeats, sinceMark, token, } from "./ghost"; import { contrast, MOTION } from "./helpers"; import { attach, type Box, CANVAS, ease, FIRST, FRAME, MODEL, note, pause, REST, runTo, SHOWN, whole, } from "./model"; import { channelDelta, coverage, crop, extent, hausdorff, edges, pixel } from "./pixels"; import { GHOST } from "./retros"; import { type ModelOptions, type ModelRun, openModel } from "./webgl"; // Sprint 33, B5c (.crew/sprint/33/contract.md): the ghost hull in 3D on /log and /log/13. B5.18 is // where it stands and how it lands, B5.19 its look and its numbers, B5.20 Full's one camera move, // B5.21 Calm and reduced motion. The hooks are B3's (`[data-model]` after `[data-ghost]`, its // `data-state`, its canvas) and the contract's one new one, `data-pick` (e2e/ghost.ts). Moving // frames are held on Playwright's clock, as B3's checks hold them: on SwiftShader at 1440 the // quality net ends a real-time move `still` (Pixel's spike, 5.8). Every GPU number is a floor. const SWIFTSHADER = "SwiftShader, headless Chromium's software WebGL: a floor, not a GPU's number"; /** Layout's precision: Chromium keeps lengths in 1/64 CSS px. */ const LAYOUT = 1 / 64; /** Two animation frames on the clock: "within 2 frames". */ const TWO_FRAMES = Math.ceil(2 * FRAME); /** Past load, the idle callback's 2,000 ms timeout and a margin. */ const IDLE = 3500; /** The scan's grid per width: a lift is 25 px deep at 1440, 16 at 1024, 10 at 390. */ const stepAt = (width: number) => (width >= 1280 ? 6 : width >= 768 ? 4 : 2); /** The pixel-ratio cap at a width (sp5f:T7d0,// The Log's ghost hull in the page (.crew/sprint/33/contract.md, "The numbers" and "The pick"; // notes-iris.md, sections 2 and 4): what the chunk reads off the 2D ghost the server drew, and its // numbers riding their planks. The drawing is the record: the seats, their numbers, the record's // own seat and the leaders all come from it, so the 3D can't disagree with the 2D. No three.js. import { GHOST, PLANKS } from "@/lib/hull-layouts"; import { bandAt, type Ghost, nearSide, type Vec3 } from "./hull"; import type { Loft } from "./loft"; /** One of the drawing's numbers: its span, its seat, and where the drawing sets it. */ type Label = { span: HTMLElement; seat: string | undefined; /** Its anchor, as shares of the drawing's box (the span's own left and top). */ share: [number, number]; /** The same point in hull units. */ anchor: [number, number]; /** Set aft of the hull at its leader's end, right-aligned (only 5.0's today). */ led: boolean; }; /** A leader from a number set aft of the hull to its plank, in the model's frame. */ type Leader = { seat: string; points: Vec3[] }; const [BX, BY, BW, BH] = GHOST.box; /** Hull units from the ghost drawing's own (its viewBox's). */ const toHull = (x: number, y: number): [number, number] => [ (x - GHOST.ox) / GHOST.s, (y - GHOST.oy) / GHOST.s, ]; /** A number's point in the model's frame: 1 unit off the near side, or on the transom's breadth. */ const pointOf = (label: Label, [x, y]: readonly [number, number]) => label.led ? nearSide(x, y) : nearSide(x, y, 1); export type GhostPage = ReturnType; /** The ghost as the server drew it, read off `drawing` (`.plan-ghost`). */ export function readGhost(drawing: Element) { /** Each seat's number, the sprint that took its original out. */ const numbers = new Map(); const seatOf = new Map(); for (const path of drawing.querySelectorAll( "path[data-plank][data-sprint]", )) { const seat = 60:T456,cd /home/user/wt-forge-33 && git status --short && git add components/log.tsx components/bar.tsx components/model.tsx app/globals.css && git commit -q -F - <<'EOF' Sprint 33: the Log carries the motion control, and the lines figure's rule takes its column The Log and every record pass /'s MotionControl into the bar's slot (from 768 px, after Read as page), and below 768 render it in a 44 px row 12 px under the lines figure, right after the header and before the record (contract call 7; notes-iris.md, section 5), where #78's Foot can take it. With WebGL refused, pressing the already-pressed Off stores nothing (Lens's nit on #74): the loader is 2,039 B decoded (+1 B), and /log, /log/13 and /log/32 load exactly /'s six files, 460,921 B. The lines figure's rule spans the header's column while its text keeps 66ch (Iris's rider on #82): 608, 736 and 991 px at 640, 768 and 1023, unchanged at 390 and 1440. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01Yaev4dLzNtwRXcCAUtDg5D EOF git push -u origin forge/33 2>&1 | tail -2; git log --oneline -161:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/mount.ts' s=open(p).read() def rep(a,b): global s assert a in s, a[:100] s=s.replace(a,b) rep('''import { buildHull, DESKTOP, type Hull, type Level, nearSide, PHONE, PICK, type Vec3, } from "./hull";''','''import { type GhostPage, near, readGhost, riders } from "./ghost"; import { buildHull, DESKTOP, type Ghost, type Hull, type Level, PHONE, PICK, plankEdges, } from "./hull";''') rep('''const hullAt = (level: Level, ghost?: ReadonlySet) => {''','''const hullAt = (level: Level, ghost?: Ghost) => {''') rep(''' const ghost = ghostDrawing ? ghostSeats(ghostDrawing) : undefined;''',''' const ghost: GhostPage | undefined = ghostDrawing ? readGhost(ghostDrawing) : undefined;''') rep(''' const labels = ghost && ghostDrawing ? ghostLabels(ghostDrawing, host) : null; ''',''' const numbers = ghost ? riders(ghost) : null; ''') rep(''' const level = hullAt(sheet.level, ghost?.seats);''',''' const level = hullAt(sheet.level, ghost?.hull);''') rep(''' if (level !== hull) stage.load(level); hull = level; fit = next; on = sheet; for (const element of [canvas, labels?.layer]) { if (!element) continue; Object.assign(element.style, { left: `${next.left}px`, top: `${next.top}px`, width: `${next.width}px`, height: `${next.height}px`, }); }''',''' const changed = level !== hull; if (changed) stage.load(level); hull = level; fit = next; on = sheet; Object.assign(canvas.style, { left: `${next.left}px`, top: `${next.top}px`, width: `${next.width}px`, height: `${next.height}px`, });''') rep(''' loft = makeLoft(next, hull.points, sheet.layout); if (reshade) stage.shade(shadowFor(hull, loft)); };''',''' loft = makeLoft(next, hull.points, sheet.layout); if (reshade) stage.shade(shadowFor(hull, loft)); numbers?.reset(); if62:T7d0,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='app/globals.css' s=open(p).read() start=s.index('/* Spike (sprint 33): the ghost in 3D.') endmark='''@media (width < 48rem) { [data-model] > .plan-view > .plan-plank { display: none; } }''' end=s.index(endmark, start)+len(endmark) new='''/* * The ghost hull in 3D on the Log (lib/model/; .crew/sprint/33/contract.md, "The numbers", "The * view" and "The pick"; notes-iris.md): the model's layer after `[data-ghost]`, under the rules * above. Frame 1 changes nothing: the drawing's numbers paint over the canvas, as the sheet's do. * From the first moving frame the 2D ghost's svg goes, since the model turns in place over it, * and each number rides its plank on an offset the chunk sets. */ /* The layer takes the ghost's flex and grid order: items paint in order-modified document order, so at order 0 it would paint under the drawing (spike-pixel.md, section 5). */ .log-ghost + [data-model] { order: 2; } [data-ghost]:has(+ [data-model]) .plan-plank { z-index: 1; } @media screen and (forced-colors: none) { /* Only while the model has a state, so Off, a lost context, print and forced colours set every number at its place in the drawing. */ [data-ghost]:has(+ [data-model][data-state]) .plan-plank { transform: translate(var(--ghost-x, 0px), var(--ghost-y, 0px)); } /* At rest the canvas takes the pointer and the finger: a plank opens its record, and a drag still scrolls the page. */ [data-ghost] + [data-model]:is([data-state="settled"], [data-state="still"]) canvas { pointer-events: auto; touch-action: manipulation; } } @media screen and (forced-colors: none) and (prefers-reduced-motion: no-preference) { [data-ghost]:has( + [data-model]:is( [data-state="lofting"], [data-state="settled"], [data-state="still"] ) ) svg { visibility: hidden; } } /* Under reduced motion the svg fades out as the canvas fades i63:T7d0,cd /home/user/wt-forge-33 && python3 - <<'EOF' p='/home/user/wt-forge-33/.claude/agent-memory/engineer/MEMORY.md' s=open(p).read() old="- B2.10 sums decoded script bodies (Playwright's `response.body()`), not gzip. On `/` the React Compiler's memo cache and runtime cost 633 B and each client module boundary about 165 B, so the model's client code (motion store, control, loader) is one `\"use no memo\"` module, `components/model.tsx`, at 2,038 of 2,048 B; any new client logic on `/` reopens that budget with the owner (`.crew/sprint/27/`).\n" new="- B2.10 sums decoded script bodies (Playwright's `response.body()`), not gzip, now over the 404's 5 files (458,882 B). The React Compiler's memo cache and runtime cost 633 B and each client module boundary about 165 B, so the model's client code (motion store, control, loader) is one `\"use no memo\"` module, `components/model.tsx`, shared by `/` and the Log: 2,039 of 2,048 B after sprint 33's `refused ||` (+1 B, not 3, since the minifier had wrapped the inlined `press` in parentheses). Measure a loader edit on the built chunk (`grep -l theseus:motion .next/static/chunks/*.js`), and any new client logic reopens the budget with the owner (`.crew/sprint/27/`, `.crew/sprint/33/`).\n" assert old in s s=s.replace(old,new) s+="- A block whose rule must span its column while its text keeps a measure: `max-width: none; padding-right: max(0px, 100% - 66ch)` keeps the content box at exactly 66ch, and the percentage resolves against the flex container even through a `display: contents` parent; `.log-head p`'s 66ch (0,1,1) outranks `.log-lines` (0,1,0), hence `.log-head .log-lines` (`.crew/sprint/33/`, Iris's rider on #82).\n" s+="- The Log's control row below 768 is `.log > [data-motion]` (0,2,0), which outranks the sheet's `main > [data-motion]` (0,1,1) and its under-360 `margin-top: 0`, so the row keeps its 12 px at 320 while `/`'s display, print and 768 rules still apply; with `order: 4` it follows the lines figure (`.log-head` is `64:T4b0,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/ghost.ts' s=open(p).read() old='''/** Covered pixels on a mask's outermost rows and columns: the frame runs into the canvas's edge. */ export function onEdge(alpha: Float32Array, w: number, h: number) {''' new='''/** * Pixels on a mask's outermost rows and columns covered at `threshold` or more: the frame runs into * the canvas's edge. At 50%, the silhouette as B3.1 reads it: the settled ghost has under half a * pixel to spare at the top and bottom at 320 and 390 (Iris's table), where its outline's * anti-aliasing may tint an edge row without the hull being cut. */ export function onEdge( alpha: Float32Array, w: number, h: number, threshold = 0.5, ) {''' assert old in s s=s.replace(old,new) s=s.replace(''' (alpha[y * w + x] ?? 0) > 0.02 ) n++;''',''' (alpha[y * w + x] ?? 0) >= threshold ) n++;''') open(p,'w').write(s) EOF grep -n "threshold" e2e/ghost.ts | head; sed -i 's/`settled pixels on the canvas'"'"'s edge rows and columns, /`settled pixels covered 50% or more on the canvas'"'"'s edge rows and columns, /' e2e/log-model.spec.ts; grep -n "edge rows" e2e/log-model.spec.ts65:T535,cd /home/user/wt-pixel-33 && git add lib/model app/globals.css && git commit -q -F - <<'EOF' B5c: the ghost hull in 3D, both sides in vellum, its numbers riding their planks The Log's ghost as Iris called it (.crew/sprint/33/notes-iris.md) and the contract builds it: the 22 originals on both sides, no deck or transom face, translucent at alpha 0.7 with its colour solved from --vellum and --background, at half the card's lit mix (x 1.35 light, 1.6 dark). Each side's index range is drawn once, far then near, so it stays 4 draws and 25,016 triangles from 768 px (7,784 below), 5 with a record's ink mark. One move, 1.8 s on the loft's ease, the framed length held and centred on the drawing's box. The drawing's own number spans ride their planks on custom properties CSS applies only while the model has a state, staggered 2 px clear; plank 5.0's leader is in the outline. At rest the canvas takes the pointer: hover inks the plank and sets data-pick with one frame per plank crossed, a click or a tap within 10 px opens the record, the middle button and Cmd or Ctrl open it in a new tab. /'s hull and loft are unchanged bit for bit. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01Yaev4dLzNtwRXcCAUtDg5D EOF git log --oneline -1; git push origin pixel/33 2>&1 | tail -266:T4e8,Pixel: the ghost now stands with both sides and its numbers riding, ready for Iris's early look: a90a395 on origin/pixel/33-r2 (force-pushing pixel/33 was denied; the r2 branch is the sprint branch plus this one commit). - What's in: both sides in translucent vellum, the per-side index ranges, 1.8 s, length held and centred; the drawing's own spans ride on custom properties, staggered; 5.0's leader; hover inks with data-pick and the canvas cursor; click, tap, middle and Ctrl-click; the record mark. - Measured on SwiftShader: 4 draws and 25,016 triangles from 768 (5 draws and 25,436 on /log/13 with the mark), 7,784 below. Hover picks all 22 numbers' seats at 1440, 1024, 768 and dark 1440 (the run that also clicks, at 1440 and 1024, opened all 22 records). 1 frame per plank crossed, 0 within one. Numbers at least 3.2 px apart. - /'s hull and loft are identical bit for bit; pnpm verify passes. - To run it: build pixel/33-r2 and open /log, /log/13 at 1440 or 768 in both schemes. Frames are in my scratchpad: /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/shots-pixel/build-_log-1440@1.png, build-_log-1440@2-dark.png, build-_log_13-1440@1.png. - Next: Probe's checks as they land, then the full suite.67:T516,cd /home/user/wt-pixel-33 && python3 - <<'EOF' p='lib/model/loft.ts' s=open(p).read() a=''' s *= want / box[settle.hold]; // The ghost turns in place: its framed box keeps the registered centre, the drawing's. if (settle.centre) {''' assert a in s s=s.replace(a,''' s *= want / box[settle.hold]; // The ghost turns in place inside the box its canvas lies on: never taller than the canvas // less ROOM, so the outline's ink isn't clipped (at most 0.6% of its length at 1440 × 900), // and its framed box keeps the registered centre, the drawing's. if (settle.centre) { const tall = (box.height * want) / box[settle.hold]; if (tall > height - ROOM) s *= (height - ROOM) / tall;''') a='''/** Samples of the solved loft; the frame loop interpolates between them. */''' assert a in s s=s.replace(a,'''/** CSS px a turn in place keeps clear inside its canvas: the 1.4 px outline, and rounding. */ const ROOM = 2; '''+a) open(p,'w').write(s) EOF pnpm exec biome check --write lib/model/loft.ts 2>&1 | grep -E "×"; pnpm exec tsc --noEmit 2>&1 | grep error; cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/maths && sh run.sh hold.ts && REPO_ROOT=/home/user/wt-pixel-33 sh run.sh same.ts 2>&1 | head -368:T610,Forge, sprint 33: the Log's control is on forge/33 at 6cb0428, and two live Log checks will stay red even on the Off path. Details for your rewrites: 1. log-record.spec.ts:282, B5.6 (C5.2), counts main's "details, summary, button, [aria-expanded]" and expects 0. The control's row lives in main (contract call 7). Its 3 buttons are in the DOM at every width once scripts run (display:none from 768), so the count is 3 at 320 and 1440, WebGL refused or not. 2. log.spec.ts:1439, B5.9 (C9.2), composites each text colour on --background. The pressed button is --background text on a --foreground fill, so it reads 1:1 ("Full" by default, "Off" with WebGL refused). I've told Atlas both. Facts your checks may need, all measured on my build: - Below 768 the slot is `.log > [data-motion]`, after .log-head in the DOM and before the record and [data-ghost]. From 768 it's `nav > [data-motion]`. - At 390 the row is 462.5 to 506.5 px and Every revision's h2 starts at 546.5. At 320 the row is 494.9 to 538.9. - Buttons are 44 px tall below 1024 and 32 from 1024. - With scripts off, the main slot is 358 × 44 at 390 and the bar's is 186 × 44 at 768, 142 × 32 at 1440, both empty. - With WebGL refused, only Off is a Tab stop: the bar's links, then Off, then the record. - The lines figure's .log-lines box is 608, 736 and 991 px wide at 640, 768 and 1023, which is the h1's width. It's 358 at 390 and 396 at 1440, the same as before. - With WebGL refused, /, /log, /log/13 and /log/32 load the same 6 files, 460,921 B. The 404 loads 5 files, 458,882 B.69:T6f5,Forge, sprint 33: two live Log checks fail on any path with scripts, and the contract's rewrite table doesn't list them. Both are e2e/, so they're yours and Probe's to call. Context: forge/33 is pushed at 6cb0428. It has the control on /log and the records (in the bar from 768, a row after .log-head below 768), Lens's nit (loader 2,039 B, +1 B) and the rule rider. I ran the existing log, log-record, log-dates, log-entry, read, motion, keyboard and invariants specs on it: 90 passed, 9 failed. Seven of the nine are the contract's planned rewrites or the Off path: B5.1 C1.1, B5.4 vellum, B5.9 C10 in both schemes, B5.9 C11.2 and B5.10. The two that refusing WebGL won't fix: 1. log-record.spec.ts:282, B5.6 (C5.2). It expects 0 for main.querySelectorAll("details, summary, button, [aria-expanded]"). Call 7 puts the control in main, so there are 3 buttons in the DOM at every width once scripts run. They're display:none from 768 but still counted, so it's 3 at 320 and 1440, WebGL refused included. It needs [data-motion] excluded, or the count limited to the record and the table. 2. log.spec.ts:1439, B5.9 (C9.2), both schemes. It composites every text colour on --background. The pressed button's label is --background on its own --foreground fill, so it reads 1:1: "Full" by default, "Off" with WebGL refused. On / the control's contrast is read by pixels in motion.spec.ts (around line 1534). It needs the pressed button measured on its own fill, or [data-motion] left to B5.25 and motion's check. Also for C10 on the Off path: with WebGL refused, Full and Calm are disabled, so Off is the only extra Tab stop. Measured on /log/13: the bar's links, then Off, then the record. "Presses three more times" only holds with WebGL. I'm passing the same facts to Probe now.6a:T412,cat >> .crew/sprint/33/decisions.md <<'EOF' 5. **Amendment 1: three live Log checks rewritten for the control in `main`** (Forge's run of the live suites on 6cb0428). The contract's rewrite table missed them. B5.6's C5.2 counts no disclosure widgets: it now counts within the record and the table, since the control is a button group, not a disclosure. B5.9's C9.2 composites every label on `--background`: the pressed button's label is now read on its own fill, still at 4.5:1. C10's added Tab stops are 3 with WebGL and 1 (Off) with it refused, since Full and Calm are disabled then. Each is rewritten with assertions no weaker than before; Probe's report lists the before and after. EOF git add .crew/sprint/33/decisions.md && git commit -q -m "Sprint 33: amendment 1, three Log checks the control's place rewrites Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01Yaev4dLzNtwRXcCAUtDg5D" && git push -q 2>&1 | grep -iv undici | grep -v trace; git log --oneline -16b:T7d0,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/early && cat > lines.mjs <<'EOF' // Line pixels inside each number's box on the bare (numbers hidden) frame: node lines.mjs '' import { chromium } from "/home/user/theseus-portfolio/node_modules/@playwright/test/index.mjs"; import { readFileSync } from "node:fs"; const [file, json] = process.argv.slice(2); const boxes = JSON.parse(json); const b64 = readFileSync(file).toString("base64"); const browser = await chromium.launch({ args: ["--no-sandbox"] }); const page = await browser.newPage(); const res = await page.evaluate(async ({ b64, boxes }) => { const img = new Image(); img.src = `data:image/png;base64,${b64}`; await img.decode(); const c = document.createElement("canvas"); c.width = img.width; c.height = img.height; const g = c.getContext("2d"); g.drawImage(img, 0, 0); const f = (v) => { v /= 255; return v <= 0.04045 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4; }; return boxes.map(([t, l, tp, r, b]) => { const [x0, y0, x1, y1] = [Math.floor(l), Math.floor(tp), Math.ceil(r), Math.ceil(b)]; const d = g.getImageData(x0, y0, x1 - x0, y1 - y0).data; const Ls = []; for (let i = 0; i < d.length; i += 4) Ls.push(0.2126 * f(d[i]) + 0.7152 * f(d[i + 1]) + 0.0722 * f(d[i + 2])); const sorted = [...Ls].sort((a, b) => a - b); const med = sorted[Math.floor(sorted.length / 2)]; const lines = Ls.filter((L) => Math.abs(L - med) > 0.12 * Math.max(med, 0.1) + 0.03).length; return [t, lines]; }).filter(([, n]) => n > 0); }, { b64, boxes }); console.log(JSON.stringify(res)); await browser.close(); EOF cat > boxes.mjs <<'EOF' // Prints each shown number's box at a width and scheme after settling: node boxes.mjs w scheme route import { chromium } from "/home/user/theseus-portfolio/node_modules/@playwright/test/index.mjs"; const [w, scheme, route] = process.argv.slice(2); const browser = await chromium.launch({ args:6c:T60f,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/early && cat > off2d.mjs <<'EOF' // The Off page's 2D ghost: bare screenshot and number boxes. node off2d.mjs w scheme import { chromium } from "/home/user/theseus-portfolio/node_modules/@playwright/test/index.mjs"; const [w, scheme] = process.argv.slice(2); const browser = await chromium.launch({ args: ["--no-sandbox"] }); const ctx = await browser.newContext({ viewport: { width: +w, height: 900 }, colorScheme: scheme }); await ctx.addInitScript(() => { try { localStorage.setItem("theseus:motion", "off"); } catch {} }); const page = await ctx.newPage(); await page.goto(`http://localhost:4822/log`, { waitUntil: "networkidle" }); await page.reload({ waitUntil: "networkidle" }); await page.waitForTimeout(300); await page.screenshot({ path: `off-${w}-${scheme}.png` }); const boxes = await page.evaluate(() => [...document.querySelectorAll("[data-ghost] .plan-plank")].filter((s) => getComputedStyle(s).display !== "none").map((s) => { const r = s.getBoundingClientRect(); return [s.textContent, r.left, r.top, r.right, r.bottom]; })); await page.addStyleTag({ content: "[data-ghost] .plan-plank{visibility:hidden!important}" }); await page.screenshot({ path: `off-${w}-${scheme}-bare.png` }); console.log(JSON.stringify(boxes)); await browser.close(); EOF for w in 1024 1440; do b=$(node off2d.mjs $w light 2>&1 | grep -v -E "UNDICI|trace-warn"); echo "2D $w: $(node lines.mjs off-$w-light-bare.png "$b" 2>&1 | grep -v -E "UNDICI|trace-warn")"; done6d:T60e,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/proto && python3 - <<'EOF' p='ghost.js' s=open(p).read() s=s.replace("if (G.hideNumbers)","""const depthsOut = {}; for (const p of PLANKS) { if (!ids.has(p.id)) continue; let best = [0, 0], anchor = null; for (let i = 0; i <= 60; i++) { const x = p.x0 + ((p.x1 - p.x0) * i) / 60; const band = bandAt(p, x); if (!band) continue; const a = proj(surf(x, band[0], 1, 0)), b = proj(surf(x, band[1], 1, 0)); const d = Math.hypot(a[0] - b[0], a[1] - b[1]); if (d > best[0]) best = [d, x]; } depthsOut[p.id] = [+best[0].toFixed(1), Math.round(best[1]), Math.round(p.x0), Math.round(p.x1)]; } if (G.hideNumbers)""") s=s.replace("window.__ghost = { labels:","window.__ghost = { depths: depthsOut, labels:") open(p,'w').write(s) p='shoot.mjs' s=open(p).read() s=s.replace("labels: info.labels }","labels: info.labels, depths: info.depths }") open(p,'w').write(s) EOF (node serve.mjs > serve.log 2>&1 & echo $! > serve.pid); sleep 1; sed -i 's#http://localhost:4820#http://localhost:4822#' shoot.mjs; timeout 300 node shoot.mjs dep '{"yaw":-20,"pitch":12,"lit":0.5,"gain":1.35,"dgain":0.4,"stagger":true,"sides":2,"seamDark":"--muted","numbers":false}' 1024,1440 light 2>&1 | grep -v -E "UNDICI|trace-warn" | python3 -c " import sys,json for line in sys.stdin: f,j=line.split(' ',1); d=json.loads(j) dep=d['depths']; print(f.split('/')[-1], ' '.join('%s:%s@%s[%s-%s]'%(k,v[0],v[1],v[2],v[3]) for k,v in sorted(dep.items()))) "6e:T7d0,cd /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/early && cat > band.mjs <<'EOF' // OKLab L (median of a 6 x 4 box) at each number's centre on a bare frame, and the ink contrast there. import { chromium } from "/home/user/theseus-portfolio/node_modules/@playwright/test/index.mjs"; import { readFileSync } from "node:fs"; const [file, json, ink] = process.argv.slice(2); const boxes = JSON.parse(json); const b64 = readFileSync(file).toString("base64"); const browser = await chromium.launch({ args: ["--no-sandbox"] }); const page = await browser.newPage(); const res = await page.evaluate(async ({ b64, boxes, ink }) => { const img = new Image(); img.src = `data:image/png;base64,${b64}`; await img.decode(); const c = document.createElement("canvas"); c.width = img.width; c.height = img.height; const g = c.getContext("2d"); g.drawImage(img, 0, 0); const lin = (v) => { v /= 255; return v <= 0.04045 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4; }; const okL = ([r, gg, b]) => { const [R, G, B] = [lin(r), lin(gg), lin(b)]; const l = Math.cbrt(0.4122214708 * R + 0.5363325363 * G + 0.0514459929 * B), m = Math.cbrt(0.2119034982 * R + 0.6806995451 * G + 0.1073969566 * B), s = Math.cbrt(0.0883024619 * R + 0.2817188376 * G + 0.6299787005 * B); return 0.2104542553 * l + 0.793617785 * m - 0.0040720468 * s; }; const Y = ([r, gg, b]) => 0.2126 * lin(r) + 0.7152 * lin(gg) + 0.0722 * lin(b); const inkRGB = [1, 3, 5].map((i) => parseInt(ink.slice(i, i + 2), 16)); return boxes.map(([t, l, tp, r, b]) => { const cx = Math.round((l + r) / 2), cy = Math.round((tp + b) / 2); const d = g.getImageData(cx - 3, cy - 2, 6, 4).data; const px = []; for (let i = 0; i < d.length; i += 4) px.push([d[i], d[i + 1], d[i + 2]]); px.sort((a, b2) => Y(a) - Y(b2)); const m = px[Math.floor(px.length / 2)]; const [ya, yb] = [Y(m), Y(inkRGB)]; const cr = (Math.max(ya, yb) + 0.05) / (Math.min(ya, yb) + 0.05); return [t, +o6f:T68a,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/log.spec.ts' s=open(p).read() old=''' // And the colours this route's text really has, not only the tokens. const { texts } = await textStyles(page); for (const { element, color } of texts) { const parsed = parseColor(color); const ratio = parsed ? contrast(composite(parsed, background), background) : 0;''' new=''' // And the colours this route's text really has, not only the tokens. Sprint 33's // amendment 1: a motion button's label is read on its own fill (the pressed one's is // --foreground), composited on --background; every other text on --background. const { texts } = await textStyles(page); const fills = new Map( await page.evaluate((slot) => { const label = (el: Element) => `<${el.tagName.toLowerCase()}> "${(el.textContent ?? "").trim().slice(0, 40)}"`; return [...document.querySelectorAll(`${slot} button`)] .filter((el) => el.getClientRects().length > 0) .map((el) => [label(el), getComputedStyle(el).backgroundColor]); }, MOTION), ); for (const { element, color } of texts) { const parsed = parseColor(color); const fill = fills.has(element) ? parseColor(fills.get(element) ?? "") : null; const ground: Rgb = fill ? composite(fill, background) : background; const ratio = parsed ? contrast(composite(parsed, ground), ground) : 0;''' assert old in s s=s.replace(old,new) open(p,'w').write(s) EOF sed -n 16,30p e2e/log.spec.ts70:T595,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/log.spec.ts' s=open(p).read() s=s.replace('''} from "./retros"; // Sprint 30, B5a''','''} from "./retros"; import { refuseWebGl } from "./webgl"; // Sprint 30, B5a''',1) s=s.replace('''// A led-out number is read as on / (plan.spec.ts): a `path.ln-leader` from the number into its plank. ''','''// A led-out number is read as on / (plan.spec.ts): a `path.ln-leader` from the number into its plank. // // Sprint 33 (B5c, .crew/sprint/33/contract.md, "The live checks") puts the ghost hull in 3D on /log // and every record, and it restyles the 2D ghost this suite reads. So every context here refuses // WebGL (the Off path, as B3 kept `/`'s guards): the beforeEach for `page`, and `refuseWebGl` in // each context a test opens itself. The model's own checks are log-model.spec.ts and its siblings. // B5.1, B5.9 (C10) and B5.10 are rewritten for the motion control in the bar, with the same // assertions; B5.9 (C9.2) reads the control's labels on their own fill (amendment 1). ''',1) s=s.replace('''test.beforeEach(async ({ context }) => { await context.addInitScript(installRgba); });''','''test.beforeEach(async ({ context }) => { await context.addInitScript(installRgba); await context.addInitScript(refuseWebGl); });''',1) open(p,'w').write(s) p='e2e/log-record.spec.ts' s=open(p).read() print(s[s.find('test.beforeEach')-600:s.find('test.beforeEach')+120]) EOF71:T402,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/log-record.spec.ts' s=open(p).read() s=s.replace('''} from "./retros"; // Sprint 30, B5a: a record''','''} from "./retros"; import { refuseWebGl } from "./webgl"; // Sprint 30, B5a: a record''',1) s=s.replace('''// e2e/retros.ts; the contract's three plank examples are typed in below as anchors on it. test.beforeEach(async ({ context }) => { await context.addInitScript(installRgba); });''','''// e2e/retros.ts; the contract's three plank examples are typed in below as anchors on it. Sprint 33 // (.crew/sprint/33/contract.md, "The live checks"): every context refuses WebGL, since the ghost in // 3D restyles the drawing these checks read; C5.2 counts main without the motion control // (amendment 1). test.beforeEach(async ({ context }) => { await context.addInitScript(installRgba); await context.addInitScript(refuseWebGl); });''',1) open(p,'w').write(s) EOF grep -n "newContext\|browser" e2e/log-record.spec.ts | head; sed -n 30,60p e2e/log-dates.spec.ts72:T43a,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/log-dates.spec.ts' s=open(p).read() s=s.replace('''// `th[scope="rowgroup"]`; the Date as the column under the head "Date"; the lines line found by its // words in the page's text. ''','''// `th[scope="rowgroup"]`; the Date as the column under the head "Date"; the lines line found by its // words in the page's text. // // Sprint 33 (.crew/sprint/33/contract.md, "The live checks"): every context refuses WebGL, the Off // path, since the ghost in 3D restyles the drawing on the page. Its riders are B5.26 at the foot. test.beforeEach(async ({ context }) => { await context.addInitScript(refuseWebGl); }); ''',1) s=s.replace('''import { expect, type Page, test } from "@playwright/test";''','''import { readdirSync } from "node:fs"; import { join } from "node:path"; import { expect, type Page, test } from "@playwright/test";''',1) i=s.find('} from "./retros";') s=s[:i]+'} from "./retros";\nimport { refuseWebGl } from "./webgl";'+s[i+len('} from "./retros";'):] open(p,'w').write(s) EOF sed -n 1,35p e2e/log-dates.spec.ts73:Tfa4,# Sprint 33, Iris's early look at the ghost (Pixel, 0352b23) Built at 0352b23 in `/home/user/wt-iris-33` (`next start` on 4822). I looked at `/log` and `/log/13` at 390, 768, 1024 and 1440, in both schemes: - Calm, settled; - Full's move on Playwright's clock at 1440 and 390; - reduced motion at 1024; - a mouse over all 22 numbers from 768; - a touch drag and a tap at 390. The control's place is Forge's and isn't in yet. The frames are in `.crew/screenshots/33-iris/early/`. **Verdict for now: two musts, then it's the ghost I asked for.** The material, the colours, the view, the move, the marks, the hover and the touch all match `notes-iris.md`. The two musts are both about lines: one is drawn where it shouldn't be, and some cross the numbers. ## Must 1. **Below 768 the 5.0 leader is drawn with no number** (`c-log-390-light.png` and `c-log_13-390-light.png`: a 20 px graphite stub off the stern at 390, in both schemes). The numbers are hidden below 768, so this is a stray line. The 2D hides it there for the same reason (`[data-ghost] .ln-leader { display: none }` under 48rem). Draw the leader from 768 only, and drop it, with the drawing's level, when the page crosses 768. 2. **Numbers sit on lines at the stern and the keel, where the 2D's don't.** - **How I counted:** strong line pixels (seams, butts, the outline) inside each number's box, on a frame with the numbers hidden (`scratchpad/early/lines.mjs`): | Width | 3D | 2D, same count | |---|---|---| | 1440 | "23" 26, "4" 21, "8" 18, "13" 17 | none | | 1024 | "23" 31, "11" 19, "4" 18, "8" 17, "17" 17, "14" 15, "13" 15 | only "4", 15 | On `/log/13` the record mark's ink butt runs through "4" at 768 and 1024 (`z-stern-1024.png`, `c-log_13-768-dark.png`). "8" sits on the stern's outline at both widths (`z-stern-1440.png`). - **The cause** is in `riders()`: a number goes to the projection of the hull point at its band's middle. On the turned hull the band's projected middle isn't there, because the lower lifts face down and away, so the number drifts onto a seam. The stagger only tests numbers against numbers. - **The change:** - Centre each number between its own plank's projected top and bottom edges at its x (the screen midpoint). - Take the x, inside the stretch the 2D's `plankBody` allows, where that projected depth is greatest. - Extend the stagger's `clear()` test to the plank's own edges, the outline and the record mark, at 1 px. - Where no x clears (lifts are 11 to 13 px deep at 1024 against an 11 px box), keep the deepest point. - **Done when:** the same count is no worse than the 2D's at 768, 1024 and 1440 in both schemes, and no number crosses the record mark on `/log/13`. ## Recheck after must 2 (should) - **Dark, 1024:** the median under "15" is OKLab L 0.503. That's 0.008 over `--card` (0.495), and my notes' band allows 0.005. The contrast holds at 4.81:1. "15" may be reading its own seam, so measure again after must 2. If it's still over 0.500, take `GHOST_DARK_GAIN` to 1.5. - **Light, 1440:** under "23" it reads L 0.837, under the 0.85 floor. That's the same seam, so recheck after must 2. ## What's right; keep it - **The look:** both sides in vellum, the hull's inside showing above the near sheer, the far seams faint through the near planks, no shadow. - Pencil seams in light, graphite at night. - Light planks L 0.84 to 0.93; dark L 0.44 to 0.49 at 1440, where the worst number is 5.0:1. - It matches my prototype frame for frame (`log-1440-light.png` against my `final-1440-light.png`). - **The canvas** lies on `[data-ghost]`'s box at every width: 358 × 71, 736 × 147, 568 × 113 and 900 × 179, with buffers equal at DPR 1. The svg is hidden once the model is up. - **The numbers:** 13 px at 768 and 1440, 11 px at 1024, hidden at 390. The record's "13" is 700. No two are closer than 2 px. - **Full on the clock:** fram74:T7d0,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='e2e/log.spec.ts' s=open(p).read() old='''/** The script files a fresh visit to `url` fetches, by path, and their decoded bytes. */ async function scripts(browser: Browser, url: string) { const context = await browser.newContext(); const page = await context.newPage();''' new='''/** * The script files a fresh visit to `url` fetches with WebGL refused, by path, and their decoded * bytes: past load and the loader's idle probe (2,000 ms at most), so a late request counts. */ async function scripts(browser: Browser, url: string) { const context = await browser.newContext(); await context.addInitScript(refuseWebGl); const page = await context.newPage();''' assert old in s; s=s.replace(old,new) old=''' await page.goto(url); await page.evaluate(() => new Promise((done) => setTimeout(done, 1500))); const files = await Promise.all(bodies); await context.close(); return { paths: files.map((f) => f.path).sort(),''' new=''' const response = await page.goto(url); await page.evaluate(() => new Promise((done) => setTimeout(done, 3500))); const files = await Promise.all(bodies); await context.close(); return { status: response?.status(), paths: files.map((f) => f.path).sort(),''' assert old in s; s=s.replace(old,new) old=''' test("B5.10 (B1.10's /sprints block) /log, /log/13 and the newest record load the 404's script files and bytes; /log loads two woff2 within 86,016 B, the display face preloaded, its text in Sofia Sans and Sofia Sans Extra Condensed only", async ({ browser, }, testInfo) => { test.setTimeout(120_000); const missing = await scripts(browser, "/no-such-page"); expect( missing.paths.length, "script files the 404 requests", ).toBeGreaterThan(0); for (const url of [...new Set([LOG, recordOf(13), recordOf(NEWEST)])]) { const found = await scripts(browser, url); testInfo.annotations.push({ type: "script-bytes", des75:T7d0,Pixel's ghost at 0352b23 needs two fixes. Both are about lines: one drawn where it shouldn't be, and some crossing the numbers. Everything else matches my notes. Written up in `/home/user/theseus-portfolio/.crew/sprint/33/early-look-iris.md`. **Must 1: a stray leader line on phones.** Below 768, plank 5.0's leader is still drawn even though the numbers are hidden. It leaves a 20 px graphite stub off the stern at 390, on `/log` and `/log/13`, in both schemes. The 2D hides the leader below 768; the 3D should draw it from 768 only. **Must 2: numbers sit on lines at the stern and keel, where the 2D's don't.** I counted strong line pixels inside each number's box, with the numbers hidden: | Width | 3D | 2D | |---|---|---| | 1440 | "23" 26, "4" 21, "8" 18, "13" 17 | none | | 1024 | seven numbers, 15 to 31 each | only "4" | - On `/log/13` the record mark's ink butt runs through "4" at 768 and 1024. - The cause is in `riders()`: each number goes to the projection of the hull point at its band's middle, which drifts onto a seam on the turned hull. The stagger only checks numbers against other numbers. - The fix: - centre each number between its plank's projected top and bottom edges; - put it where that projected depth is greatest along the plank; - extend the stagger's clearance test to the plank's edges, the outline and the record mark at 1 px. - Done when the count is no worse than the 2D's at 768, 1024 and 1440 in both schemes. **Recheck after must 2.** Two colour readings sit just outside my bands, both likely skewed by the seam each number sits on: - Dark at 1024 under "15": lightness 0.503 against a 0.500 ceiling. Contrast still passes at 4.81:1. If it stays over after the fix, take the dark gain from 1.6 to 1.5. - Light at 1440 under "23": 0.837 against a 0.85 floor. **What holds:** - **Look:** both sides in vellum, the colours within my bands. - **Fit:** the canvas sits exactly on the drawing's box at all four widths. - **Numbers:** sizes and the bold re76:T480,Pixel, Iris took her early look at 0352b23 and has two musts. They're in /home/user/theseus-portfolio/.crew/sprint/33/early-look-iris.md (on the sprint branch); read it. (1) Below 768, plank 5.0's leader still draws while the numbers are hidden. Draw it from 768 only. (2) Numbers sit on seams and lines at the stern and keel. At 1440 "23", "4", "8" and "13" do; at 1024 seven numbers do, where the 2D has only "4"; and on /log/13 the record mark's butt runs through "4". The fix: - centre each number between its plank's projected top and bottom edges, where the projected depth is greatest; - extend the stagger's clearance test to the plank's edges, the outline and the record mark, at 1 px. It's done when her line count (/tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/early/lines.mjs) is no worse than the 2D's at 768, 1024 and 1440 in both schemes. After that, recheck her two colour readings: dark at 1024 under "15", and light at 1440 under "23". If the dark one is still over 0.500, take the dark gain to 1.5. Forge's control is on the sprint branch now (c7e7b12). Bring the branch into yours.77:T7d0,cd /home/user/wt-probe-33 && cat > /tmp/claude-0/-home-user-theseus-portfolio/8aafa3b5-8a13-5598-8d2a-d279d25d943a/scratchpad/bands.ts <<'EOF' // The bands, settled, in both schemes, at 1440 and 390: one scan per size (the pose is the // same in both schemes), read in light and again after a switch to dark. On a record, the same // scan places the mark: the canvas against /log's at that size. for (const size of SIZES) { const at = `${url} at ${size.width} x ${size.height}`; let plain: Image | null = null; if (record) { const log = await settledOn(browser, PAGES[0], size); await log.page.mouse.move(1, 1); await pause(200); plain = (await canvasAlone(log.page, whole((await canvasBox(log.page)) as Box))).image; await log.close(); } const run = await settledOn(browser, url, size); const scan = await scanSeats(run, stepAt(size.width)); expect .soft( SEATS.filter((s) => !scan.points.has(s)), `seats a mouse scan found no point on, ${at}`, ) .toEqual([]); const box = whole((await canvasBox(run.page)) as Box); for (const scheme of ["light", "dark"] as const) { const where = `${at}, ${scheme}`; await run.page.emulateMedia({ colorScheme: scheme }); await pause(600); const image = await bareView(run.page); const [vellum, film, card] = [ oklab(await token(run.page, "--vellum")), oklab(await token(run.page, "--background")), oklab(await token(run.page, "--card")), ]; const off: string[] = []; const reads: string[] = []; for (const [seat, p] of scan.points) { const lab = oklab( medianIn(image, { x: p.x - 1, y: p.y - 1, width: 2, height: 2 }), ); reads.push(`${seat} L ${lab.L.toFixed(3)}`); const why = [ scheme === "light" ? lab.L >= 0.85 && lab.L <= 0.978:T7d0,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='/home/user/wt-probe-33/e2e/log.spec.ts' s=open(p).read() old=''' buttons: header?.querySelectorAll("button").length ?? -1, motion: header?.querySelectorAll("[data-motion]").length ?? -1,''' new=''' buttons: header?.querySelectorAll("button").length ?? -1, motion: header?.querySelectorAll("[data-motion]").length ?? -1, groups: [...(header?.querySelectorAll("fieldset, [role='group']") ?? [])].map( (g) => g.getAttribute("aria-label"), ),''' assert old in s; s=s.replace(old,new) old='''function expectSkeleton(found: Skeleton, how: string, current: string) {''' new='''/** * Sprint 33 (B5c): with scripts the bar's nav also holds the motion control's group, Motion, with * Full, Calm and Off after Read as page; without them its slot is there, empty, and no button. */ function expectSkeleton( found: Skeleton, how: string, current: string, scripts = true, ) {''' assert old in s; s=s.replace(old,new) old=''' current: link.href === LOG ? current : null, })), ]); expect.soft(found.buttons, `buttons in the bar (${how})`).toBe(0); expect.soft(found.motion, `[data-motion] in the bar (${how})`).toBe(0);''' new=''' current: link.href === LOG ? current : null, })), ...(scripts ? MODES.map((mode) => ({ tag: "button", text: mode, href: null, inNav: true, current: null, })) : []), ]); expect .soft(found.buttons, `buttons in the bar (${how})`) .toBe(scripts ? MODES.length : 0); expect.soft(found.motion, `[data-motion] slots in the bar (${how})`).toBe(1); expect .soft(found.groups, `groups in the bar (${how})`) .toEqual(scripts ? ["Motion"] : []);''' assert old in s; s=s.replace(old,new) old=''' test("B5.1 (C1.1) /log is 200 with scripts on and off: one main#main, the skip link first, one h1 Log, and the bar's wordmark and four links with79:T7d0,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='/home/user/wt-probe-33/e2e/log.spec.ts' s=open(p).read() old='''/** The bar's five targets at the current width: boxes, and each label's lines of text. */''' new='''/** * The bar's targets at the current width: its five links and, from 768 px, the motion control's * three buttons (sprint 33); boxes, and each label's lines of text. */''' assert old in s; s=s.replace(old,new) old=''' const targets = [ ...(header?.querySelectorAll('a[href]:not([href="#main"])') ?? []), ];''' new=''' const targets = [ ...(header?.querySelectorAll( 'a[href]:not([href="#main"]), [data-motion] button', ) ?? []), ].filter((el) => el.getClientRects().length > 0);''' assert old in s; s=s.replace(old,new) old=''' test("B5.1 at 320, 390, 768, 1024 and 1440 the bar is one line of targets inside the viewport (44 px tall below 1024, 24 from it), and the wordmark, Work, Contact and Read as page land", async ({ page, }) => { test.setTimeout(150_000); for (const width of WIDTHS) { await open(page, LOG, width); const targets = await readBarTargets(page); const at = `at ${width} px`; expect .soft( targets.map((t) => t.text), `the bar's targets ${at}`, ) .toEqual(["Theseus", ...BAR.map((link) => link.text)]);''' new=''' test("B5.1 at 320, 390, 768, 1024 and 1440 the bar is one line of targets inside the viewport (44 px tall below 1024, 24 from it), Full, Calm and Off among them from 768, and the wordmark, Work, Contact and Read as page land", async ({ page, }) => { test.setTimeout(150_000); for (const width of WIDTHS) { await open(page, LOG, width); await motionReady(page); const targets = await readBarTargets(page); const at = `at ${width} px`; expect .soft( targets.map((t) => t.text), `the bar's targets ${at}`, ) .toEqual([ "Theseu7a:T7d0,cd /home/user/wt-probe-33 && python3 - <<'EOF' p='/home/user/wt-probe-33/e2e/log.spec.ts' s=open(p).read() old=''' test(`B5.9 (C10) on /log/13: the skip link first, Enter lands on main; Tab visits the bar's five links, the record's links, then each Rev link, each with one ring of 2 px ink, 2 px out (${scheme})`, async ({ page, }) => { test.setTimeout(120_000); await open(page, recordOf(13), 1440, scheme); const order = await page.evaluate( ({ record, rows }) => { const hrefs = (selector: string) => [...document.querySelectorAll(selector)] .filter((a) => a.checkVisibility()) .map((a) => a.getAttribute("href") ?? ""); return { all: hrefs("a[href]"),''' new=''' test(`B5.9 (C10) on /log/13: the skip link first, Enter lands on main; Tab visits the bar's five links, the motion control's enabled buttons (Off alone with WebGL refused), the record's links, then each Rev link, each with one ring of 2 px ink, 2 px out (${scheme})`, async ({ page, }) => { test.setTimeout(120_000); await open(page, recordOf(13), 1440, scheme); // Sprint 33 (amendment 1): this suite refuses WebGL, so once the loader's probe is answered // Full and Calm are disabled and Off is the one stop the control adds (3 with WebGL: B5.25). await page.waitForFunction( (slot) => [...document.querySelectorAll(`${slot} button`)].filter( (b) => b.getClientRects().length > 0 && b.matches(":disabled"), ).length === 2, MOTION, { timeout: 10_000 }, ); const order = await page.evaluate( ({ record, rows }) => { const hrefs = (selector: string) => [...document.querySelectorAll(selector)] .filter((a) => a.checkVisibility()) .map((a) => a.tagName === "BUTTON" ? `