@a2f0/skyline 0.0.0-stage → 0.1.2

package/site/models/two-prudential-geographic.js

@@ -0,0 +1,47 @@
+import { polygonOf } from "./building-kit.js";
+import { chainsOf } from "./facade-grid.js";
+import { buildTwoPrudentialTower, twoPrudentialCore, twoPrudentialLevels } from "./two-prudential-tower.js";
+// Two Prudential Plaza: the geographic layout's model, on the mapped outline 64388666. The
+// tower is the shared generator in two-prudential-tower.ts, the same one the original
+// layout's copy uses. Its core stands on the outline's area centroid, square to the mapped
+// south wall; the lobby fills the mapped outline to the first office floor, and the tiers
+// fill the depth between the core and the mapped north and south walls. See
+// docs/two-prudential-reference.md. Units are meters; +x is east, +z is south.
+export const twoPrudentialGeographicLevels = twoPrudentialLevels;
+// The area centroid, not the mean of the traced vertices: this outline carries three extra
+// points down its west wall, which would pull a vertex mean 4.9 m west and 2.7 m south.
+export function areaCentroid(outline) {
+    let twice = 0, x = 0, z = 0;
+    outline.forEach((a, i) => {
+        const b = outline[(i + 1) % outline.length], cross = a[0] * b[1] - b[0] * a[1];
+        twice += cross;
+        x += (a[0] + b[0]) * cross;
+        z += (a[1] + b[1]) * cross;
+    });
+    return [x / (3 * twice), z / (3 * twice)];
+}
+// The core's frame on the mapped outline: its centre, the unit vector along the mapped south
+// wall, and how far the mapped south and north walls stand from the centre along its normal.
+export function twoPrudentialFrame(ground) {
+    const outline = polygonOf(ground), centre = areaCentroid(outline);
+    const chains = chainsOf(ground).map((chain) => ({ chain, normal: ground[chain.runs[0]].normal(0) }));
+    const wall = (sign) => chains.find(({ normal }) => normal[1] * sign > 0.9).chain;
+    const ends = (chain) => chain.runs.flatMap((index) => [ground[index].at(0), ground[index].at(ground[index].length)]);
+    const [start, end] = [ends(wall(1))[0], ends(wall(1)).at(-1)];
+    const length = Math.hypot(end[0] - start[0], end[1] - start[1]);
+    const along = [(end[0] - start[0]) / length, (end[1] - start[1]) / length], south = [-along[1], along[0]];
+    const depth = (p) => (p[0] - centre[0]) * south[0] + (p[1] - centre[1]) * south[1];
+    // The nearest point of each wall, less 2 cm, so each lower tier's front stays within the
+    // mapped outline across the whole of its width.
+    const fronts = [Math.min(...ends(wall(1)).map(depth)) - 0.02, Math.min(...ends(wall(-1)).map((p) => -depth(p))) - 0.02];
+    return { centre, along, fronts };
+}
+export function createTwoPrudentialGeographicBuilding(record, projectPlan, offset) {
+    const ground = projectPlan(record.footprint.coordinates);
+    const { centre, along, fronts } = twoPrudentialFrame(ground);
+    const model = buildTwoPrudentialTower({ name: record.name, id: record.id, centre, along, fronts, base: 0, lobby: ground });
+    model.building.position.set(offset[0], 0, offset[1]);
+    model.building.userData["geography"] = record;
+    model.building.userData["geographicDetail"] = { levels: twoPrudentialGeographicLevels, core: twoPrudentialCore, floors: twoPrudentialLevels.floors, source: "docs/two-prudential-reference.md" };
+    return model;
+}

package/site/models/two-prudential-plaza.js

@@ -0,0 +1,55 @@
+import { buildTwoPrudentialTower, pierStations, twoPrudentialCore, twoPrudentialGables, twoPrudentialLevels } from "./two-prudential-tower.js";
+// Two Prudential Plaza on a clean version of its plan, in real meters, for the skyline
+// study's original layout, which places this copy in skyline-study.ts. two-prudential-tower.ts
+// builds it, and the geographic model on the mapped outline. The plan is the mapped one
+// squared: the 40.8 x 37.5 m core, with each pair of tiers 4.5 m deep, so the lower tiers'
+// fronts stand 27.75 m either side of its centre and the tower keeps the mapped 55.5 m
+// depth. See docs/two-prudential-reference.md. Units are meters; +x is east and +z is south.
+const front = 27.75;
+// The skyline drawing shows the tower above One Prudential's podium, so its platform datum
+// crosses the tower above the street: fitted with the placement in skyline-study.ts,
+// which scales, turns, and places this copy. Its y = 0 is that datum.
+export const twoPrudentialSkylineBase = 35.4;
+// The drawing draws each tier's gable as one slope from its shoulders to a point about 2 m
+// above the line its steps climb: in the night photograph it traces, each tier's dark glass
+// head runs on into the dark strip of the wall behind it. This copy keeps the drawn points.
+export const twoPrudentialDrawnTierPeaks = Object.freeze({ lower: 181.9, middle: 217.2 });
+export function createTwoPrudentialPlazaBuilding() {
+    return buildTwoPrudentialTower({ name: "Two Prudential Plaza", id: "building-two-prudential-plaza", centre: [0, 0], along: [1, 0], fronts: [front, front], base: twoPrudentialSkylineBase, tierPeaks: twoPrudentialDrawnTierPeaks });
+}
+// Features the skyline test projects against the drawing, in this copy's coordinates.
+const h = twoPrudentialLevels, g = twoPrudentialGables, [coreA, coreB] = twoPrudentialCore, drawn = twoPrudentialDrawnTierPeaks;
+const at = (x, real, z) => [x, real - twoPrudentialSkylineBase, z];
+const middleFront = coreB + (front - coreB) / 2;
+// A pier's point halfway out to its face, so a present pier is met a little before it.
+const halfPier = 0.175;
+// Every pier across a gabled face, west to east, from its middle.
+const across = (gable) => { const stations = pierStations(gable); return [...stations.map((r) => -r), ...[...stations].reverse()]; };
+export const twoPrudentialFeatures = {
+    // The core's corners at the eave, and the points of its south and east gables.
+    twoEaveWest: at(-coreA, h.eave, coreB),
+    twoEaveNear: at(coreA, h.eave, coreB),
+    twoEaveEast: at(coreA, h.eave, -coreB),
+    twoSouthChevron: at(0, h.peak, coreB + 0.03),
+    twoEastChevron: at(coreA + 0.03, h.peak, 0),
+    twoPyramid: at(0, h.apex, 0),
+    twoSpire: at(0, h.tip, 0),
+    // The tiers' points and their shoulders at their fronts' corners.
+    twoMiddleChevron: at(0, drawn.middle, middleFront),
+    twoLowerChevron: at(0, drawn.lower, front),
+    twoMiddleWest: at(-g.middle.half, h.middleShoulder, middleFront),
+    twoMiddleEast: at(g.middle.half, h.middleShoulder, middleFront),
+    twoLowerWest: at(-g.lower.half, h.lowerShoulder, front),
+    twoLowerEast: at(g.lower.half, h.lowerShoulder, front),
+    // The core's south piers above the middle tier, all twelve.
+    twoSouthPiers: across(g.front).map((x) => at(x, 222, coreB + halfPier)),
+    // The east face's piers from its north corner, where the face's x runs north to south
+    // as z does: every one but the first south of the strip, which the drawing leaves out.
+    twoEastPiers: across(g.side).filter((_, index) => index !== 6).map((z) => at(coreA + halfPier, 204, z)),
+    // The lower tier's eight piers.
+    twoLowerPiers: across(g.lower).map((x) => at(x, 135, front + halfPier)),
+    // A window on the east face, clear of every neighbour, for hover.
+    twoFacade: at(coreA + 0.02, 180, -10.7),
+    // On the lower tier's front below the podium roof, which hides it: for scene raycasts.
+    twoBehindPodium: at(-10, 45, front),
+};

package/site/models/two-prudential-tower.js

@@ -0,0 +1,441 @@
+import * as THREE from "../vendor/three-r186.js";
+import { createBuilder, line } from "./building-kit.js";
+import { mitredBox } from "./facade-grid.js";
+// Two Prudential Plaza as built, for both of the skyline study's layouts: the geographic
+// model stands it on the mapped outline, and the original layout's copy on a clean plan cut
+// at the drawing's datum. A 40.8 x 37.5 m limestone core rises to 229.3 m at its corners.
+// Each face ends in a gable that steps up floor by floor to a pointed glass strip at its
+// middle, 256 m, and a stepped pyramid turned 45° to the plan rises from those four points
+// to 280.2 m, where the spire takes over to the published 303.3 m. A broad rib runs up each
+// ridge from its strip's head to the apex, and the pyramid's steps end on the ribs. On the
+// north and south faces two gabled tiers stand forward of the core, the lower in front of
+// the middle one, and fill the rest of the mapped depth. Heights are measured on the
+// photographs, down from the published tip; the plan on the photograph against the mapped
+// outline. See docs/two-prudential-reference.md. Units are meters; +x is east and +z is south.
+const pitch = 3.96;
+// A tier's point stands on the line through its steps' corners: its glass head rises a floor
+// for every 3.16 m bay, as the steps beside it do, from its 4.6 m half-strip's shoulder.
+const tierPeak = (shoulder, bays) => shoulder + (bays + 4.6 / 3.16) * pitch;
+export const twoPrudentialLevels = Object.freeze({
+    pitch, // the photograph's window rows
+    lobbyTop: 11.52, // the first office floor, a whole number of floors below the tiers
+    sill: 0.9,
+    head: 2.9, // a window's sill and head above its floor
+    lowerShoulder: 162,
+    lowerPeak: tierPeak(162, 3), // 179.64
+    middleShoulder: 193.68,
+    middlePeak: tierPeak(193.68, 4), // 215.28
+    eave: 229.32, // the core's corners
+    peak: 256, // each face's gable
+    apex: 280.2, // the pyramid
+    shaftTop: 295.5, // the spire's shaft, under its needle
+    tip: 303.3, // published architectural height
+    floors: 64,
+});
+const h = twoPrudentialLevels;
+export const floorLine = (floor) => h.lobbyTop + floor * h.pitch;
+const gableOf = (strip, bays, bay, shoulder, peak) => ({ strip, bays, bay, half: strip + bays * bay, shoulder, peak });
+export const twoPrudentialGables = Object.freeze({
+    // The core's north and south faces, five bays either side of the strip.
+    front: gableOf(4.6, 5, 3.16, h.eave, h.peak),
+    // The east and west faces, four wider bays either side of a wider strip.
+    side: gableOf(5.7, 4, 3.2625, h.eave, h.peak),
+    // The tiers keep the front's bays, four and three either side of its strip.
+    middle: gableOf(4.6, 4, 3.16, h.middleShoulder, h.middlePeak),
+    lower: gableOf(4.6, 3, 3.16, h.lowerShoulder, h.lowerPeak),
+});
+const g = twoPrudentialGables;
+// The core's half-widths, east-west and north-south.
+export const twoPrudentialCore = [g.front.half, g.side.half];
+export const stripShoulder = (gable) => gable.shoulder + gable.bays * h.pitch;
+// A wall's top at x from its middle.
+export function wallTop(gable, x) {
+    const r = Math.abs(x);
+    if (r >= gable.strip)
+        return gable.shoulder + Math.min(gable.bays - 1, Math.floor((gable.half - r) / gable.bay + 1e-9)) * h.pitch;
+    return stripShoulder(gable) + (gable.peak - stripShoulder(gable)) * (1 - r / gable.strip);
+}
+// The half-width of the part of a wall that reaches a height.
+export function wallExtent(gable, y) {
+    if (y <= gable.shoulder + 1e-9)
+        return gable.half;
+    const steps = Math.ceil((y - gable.shoulder) / h.pitch - 1e-9);
+    if (steps < gable.bays)
+        return gable.half - steps * gable.bay;
+    if (y <= stripShoulder(gable) + 1e-9)
+        return gable.strip;
+    return Math.max(0, gable.strip * (gable.peak - y) / (gable.peak - stripShoulder(gable)));
+}
+// The piers stand on every bay's edges: its corner pier's centre, then the joints inward to
+// the strip's edge. Windows are centred in their bays.
+const pierWidth = 0.9, pierDepth = 0.35, windowHalf = 0.8;
+export const pierStations = (gable) => Array.from({ length: gable.bays + 1 }, (_, i) => (i ? gable.half - i * gable.bay : gable.half - pierWidth / 2));
+// Where a face's part of the pyramid ends at a height, as its half-width along the face and
+// its reach from the core's centre: the face's wall to where it reaches, up to its strip's
+// shoulder, and above that the inner edge of its ridge's rib, the straight line from the
+// shoulder to the apex, so each floor's step ends a fixed way further up that line.
+function crownEnd(gable, reach, y) {
+    const shoulder = stripShoulder(gable);
+    if (y <= shoulder + 1e-9)
+        return [wallExtent(gable, y), reach];
+    const s = (h.apex - y) / (h.apex - shoulder);
+    return [gable.strip * s, reach * s];
+}
+// The pyramid's horizontal section at a height above the eave, in the core's frame: each
+// face's end, joined across each corner by the step's riser.
+export function crownSection(y) {
+    const [a, b] = twoPrudentialCore, [front, south] = crownEnd(g.front, b, y), [side, east] = crownEnd(g.side, a, y);
+    return [[-front, south], [front, south], [east, side], [east, -side], [front, -south], [-front, -south], [-east, -side], [-east, side]];
+}
+// The crown's steps stop a floor under the apex, where a pointed cap and the spire take over.
+export const crownSteps = Math.floor((h.apex - h.eave) / h.pitch - 0.25);
+const color = (hex) => new THREE.Color(hex);
+const stone = color(0x8a8a8a), stripSpandrel = color(0x4a4a4a), riserGlass = color(0x565656), band = color(0xcdcdcd);
+const tread = color(0x7a7a7a), soffit = color(0x6a6a6a), roofGlass = color(0x3f3f3f);
+const glassTones = [0x3a3a3a, 0x404040, 0x353535, 0x454545].map(color);
+const litGlass = color(0x8e8e8e), dimGlass = color(0x5e5e5e);
+function paneColor(floor, bay, wall) {
+    const hash = (Math.imul(floor + 7, 0x9e3779b1) ^ Math.imul(bay + 43, 0x85ebca77) ^ Math.imul(wall + 2, 0xc2b2ae3d)) >>> 0;
+    const value = hash % 97;
+    if (value < 3)
+        return litGlass;
+    if (value < 6)
+        return dimGlass;
+    return glassTones[value % glassTones.length];
+}
+export function buildTwoPrudentialTower(form) {
+    const kit = createBuilder(form.name, form.id);
+    const body = kit.batch("Two Prudential · limestone, glass and crown", kit.material(0xffffff, { vertexColors: true }));
+    const piers = kit.batch("Two Prudential · piers", kit.material(0x9c9c9c));
+    const copings = kit.batch("Two Prudential · copings", kit.material(0xc6c6c6));
+    const mullions = kit.batch("Two Prudential · strip mullions", kit.material(0x707070));
+    const ribs = kit.batch("Two Prudential · crown ribs", kit.material(0xd8d8d8));
+    const spire = kit.batch("Two Prudential · spire", kit.material(0xe9e9e9));
+    const spirePanels = kit.batch("Two Prudential · spire inset panels", kit.material(0x575757));
+    const y = (real) => real - form.base;
+    const [coreA, coreB] = twoPrudentialCore;
+    const middle = form.tierPeaks ? { ...g.middle, peak: form.tierPeaks.middle } : g.middle;
+    const lower = form.tierPeaks ? { ...g.lower, peak: form.tierPeaks.lower } : g.lower;
+    // The core's frame, and the same turned half a turn: the north and west halves are the
+    // south and east ones seen from the other side, so one description builds both.
+    // Frames 2 and 3 face east and west: their south axis is the side face's outward normal.
+    const frames = [form.along, [-form.along[0], -form.along[1]]].map((a) => ({ a, s: [-a[1], a[0]] }));
+    frames.push(...frames.map(({ a, s }) => ({ a: [-s[0], -s[1]], s: a })));
+    const at = (frame, u, v) => {
+        const { a, s } = frames[frame];
+        return [form.centre[0] + a[0] * u + s[0] * v, form.centre[1] + a[1] * u + s[1] * v];
+    };
+    const lift = ([x, z], real) => [x, y(real), z];
+    // Heights a solid spans, cut at the datum: none when it lies wholly below.
+    const above = (rows) => {
+        if (rows.at(-1) <= form.base + 1e-6)
+            return null;
+        return rows[0] >= form.base ? rows : [form.base, ...rows.filter((r) => r > form.base + 1e-6)];
+    };
+    // Sills and heads strictly between two heights, plus any extra offsets within a floor:
+    // the floor lines themselves divide stone from stone, so they need no cut.
+    const rowsBetween = (lo, hi, extra = []) => {
+        const cuts = new Set([lo, hi]);
+        for (let floor = Math.floor((lo - h.lobbyTop) / h.pitch) - 1; floorLine(floor) < hi; floor += 1) {
+            for (const offset of [h.sill, h.head, ...extra]) {
+                const r = Math.round((floorLine(floor) + offset) * 1e6) / 1e6;
+                if (r > lo + 1e-6 && r < hi - 1e-6)
+                    cuts.add(r);
+            }
+        }
+        return [...cuts].sort((p, q) => p - q);
+    };
+    const floorOf = (real) => Math.floor((real - h.lobbyTop) / h.pitch + 1e-9);
+    const vision = (real) => { const o = real - floorLine(floorOf(real)); return o > h.sill && o < h.head; };
+    // A gabled wall's cuts: every window's edges and the strip's. A bay's edge divides stone
+    // from stone, under a pier.
+    const wallCuts = (gable) => {
+        const radii = [gable.strip];
+        for (let i = 0; i < gable.bays; i += 1) {
+            const centre = gable.half - (i + 0.5) * gable.bay;
+            radii.push(centre - windowHalf, centre + windowHalf);
+        }
+        return [...new Set(radii.flatMap((r) => [-r, r]))].sort((p, q) => p - q);
+    };
+    const paintWall = (wall, x, real) => {
+        const r = Math.abs(x), gable = wall.gable;
+        if (r < gable.strip)
+            return vision(real) ? paneColor(floorOf(real), Math.floor((x + gable.strip) / 1.8), wall.seed + 50) : stripSpandrel;
+        const bay = Math.min(gable.bays - 1, Math.floor((gable.half - r) / gable.bay));
+        const centre = gable.half - (bay + 0.5) * gable.bay;
+        return vision(real) && Math.abs(r - centre) < windowHalf ? paneColor(floorOf(real), Math.sign(x) * (bay + 1), wall.seed) : stone;
+    };
+    // A closed prism on a convex ring, counterclockwise from above, whose walls are cut into
+    // painted cells along each edge and at every row. Its top and bottom fan out from its
+    // centre through every cut, so each cell's edge meets its partner.
+    const prism = (ring, rowsIn, edges, top = tread, bottom = soffit) => {
+        const rows = above(rowsIn);
+        if (!rows)
+            return;
+        const loop = [];
+        ring.forEach((a, i) => {
+            const b = ring[(i + 1) % ring.length], length = Math.hypot(b[0] - a[0], b[1] - a[1]);
+            const t = [(b[0] - a[0]) / length, (b[1] - a[1]) / length], out = [-t[1], 0, t[0]], edge = edges[i];
+            let cuts = [];
+            if ("wall" in edge)
+                cuts = wallCuts(edge.wall.gable).map((x) => x - edge.from);
+            else if ("ribbon" in edge)
+                cuts = [pierWidth + 0.05, length - 0.35];
+            const stations = [0, ...cuts.filter((s) => s > 1e-3 && s < length - 1e-3), length];
+            const points = stations.map((s, k) => (k === 0 ? a : k === stations.length - 1 ? b : [a[0] + t[0] * s, a[1] + t[1] * s]));
+            loop.push(...points.slice(0, -1));
+            for (let k = 0; k + 1 < points.length; k += 1) {
+                const middle = (stations[k] + stations[k + 1]) / 2;
+                for (let r = 0; r + 1 < rows.length; r += 1) {
+                    const [lo, hi] = [rows[r], rows[r + 1]], real = (lo + hi) / 2;
+                    let paint = stone;
+                    if ("wall" in edge)
+                        paint = paintWall(edge.wall, edge.from + middle, real);
+                    else if ("ribbon" in edge)
+                        paint = k === 1 && vision(real) ? paneColor(floorOf(real), 90 + i, 7) : stone;
+                    else if ("riser" in edge)
+                        paint = real - floorLine(floorOf(real)) < 2.5 ? riserGlass : band;
+                    else
+                        paint = edge.plain;
+                    const [p, q] = [points[k], points[k + 1]];
+                    kit.quad(body, [lift(p, lo), lift(q, lo), lift(q, hi), lift(p, hi)], [out], paint);
+                }
+            }
+        });
+        const centre = [ring.reduce((sum, p) => sum + p[0], 0) / ring.length, ring.reduce((sum, p) => sum + p[1], 0) / ring.length];
+        const [lo, hi] = [rows[0], rows.at(-1)];
+        loop.forEach((p, i) => {
+            const q = loop[(i + 1) % loop.length];
+            kit.triangle(body, [lift(centre, hi), lift(p, hi), lift(q, hi)], [[0, 1, 0], [0, 1, 0], [0, 1, 0]], top);
+            kit.triangle(body, [lift(centre, lo), lift(p, lo), lift(q, lo)], [[0, -1, 0], [0, -1, 0], [0, -1, 0]], bottom);
+        });
+    };
+    const ringOf = (frame, corners) => corners.map(([u, v]) => at(frame, u, v));
+    // A closed solid extruded along a frame's south axis from a convex profile in (u, height):
+    // a strip's pointed head, or a tier's strip with its gabled roof.
+    const extrude = (target, frame, profile, v0, v1, front, sides) => {
+        const rows = profile.map(([, real]) => real);
+        if (Math.max(...rows) <= form.base)
+            return;
+        const cut = profile.map(([u, real]) => [u, Math.max(real, form.base)]);
+        const { a, s } = frames[frame], point = (u, real, v) => lift(at(frame, u, v), real);
+        const centroid = [cut.reduce((sum, p) => sum + p[0], 0) / cut.length, cut.reduce((sum, p) => sum + p[1], 0) / cut.length];
+        const fan = (v, normal, paint) => cut.forEach((p, i) => {
+            const q = cut[(i + 1) % cut.length];
+            kit.triangle(target, [point(centroid[0], centroid[1], v), point(p[0], p[1], v), point(q[0], q[1], v)], [normal, normal, normal], paint);
+        });
+        fan(v1, [s[0], 0, s[1]], front);
+        fan(v0, [-s[0], 0, -s[1]], sides);
+        cut.forEach((p, i) => {
+            const q = cut[(i + 1) % cut.length], du = q[0] - p[0], dy = q[1] - p[1], length = Math.hypot(du, dy);
+            if (length < 1e-6)
+                return;
+            let [nu, ny] = [dy / length, -du / length];
+            if (nu * ((p[0] + q[0]) / 2 - centroid[0]) + ny * ((p[1] + q[1]) / 2 - centroid[1]) < 0)
+                [nu, ny] = [-nu, -ny];
+            kit.quad(target, [point(p[0], p[1], v0), point(q[0], q[1], v0), point(q[0], q[1], v1), point(p[0], p[1], v1)], [[a[0] * nu, ny, a[1] * nu]], sides);
+        });
+    };
+    // The lobby: the mapped outline from grade to the first office floor.
+    if (form.lobby && form.base < h.lobbyTop)
+        kit.prism(kit.batch("Two Prudential · lobby", kit.material(0x5a5a5a)), form.lobby, [y(Math.max(0, form.base)), y(h.lobbyTop)]);
+    // The core: its shaft to the eave, in one piece, so no seam crosses its faces where the
+    // tiers stop covering them.
+    const walls = (frame) => ({ front: { gable: g.front, seed: frame * 4 }, side: { gable: g.side, seed: frame * 4 + 1 } });
+    prism(ringOf(0, [[-coreA, coreB], [coreA, coreB], [coreA, -coreB], [-coreA, -coreB]]), rowsBetween(h.lobbyTop, h.eave), [0, 1].flatMap((frame) => [{ wall: walls(frame).front, from: -coreA }, { wall: walls(frame).side, from: -coreB }]));
+    // The crown: one floor's step at a time, each on the pyramid's section at its top, so
+    // every step's nosing lies on the pyramid. Up to a strip's shoulder a face's end is its
+    // gable's stepped bays; above it the end stands back under the ridge's rib, plain stone.
+    let crownTop = h.eave;
+    for (let step = 1; step <= crownSteps; step += 1) {
+        const lo = h.eave + (step - 1) * h.pitch, hi = lo + h.pitch, section = crownSection(hi);
+        const end = (wall) => (hi <= stripShoulder(wall.gable) + 1e-9 ? { wall, from: -wallExtent(wall.gable, hi) } : { plain: stone });
+        const edges = [0, 1].flatMap((frame) => [end(walls(frame).front), { riser: true }, end(walls(frame).side), { riser: true }]);
+        prism(ringOf(0, section), rowsBetween(lo, hi, [2.5]), edges);
+        crownTop = hi;
+    }
+    // The cap: from the last step's section to the apex.
+    {
+        const section = ringOf(0, crownSection(crownTop)), apex = lift(form.centre, h.apex);
+        section.forEach((p, i) => {
+            const q = section[(i + 1) % section.length], [pp, qq] = [lift(p, crownTop), lift(q, crownTop)];
+            const u = pp.map((value, k) => value - apex[k]), w = qq.map((value, k) => value - apex[k]);
+            const n = [u[1] * w[2] - u[2] * w[1], u[2] * w[0] - u[0] * w[2], u[0] * w[1] - u[1] * w[0]];
+            kit.triangle(body, [apex, pp, qq], [n, n, n].map((v) => (v[1] < 0 ? v.map((c) => -c) : v)), band);
+        });
+        for (let i = 1; i + 1 < section.length; i += 1) {
+            kit.triangle(body, [lift(section[0], crownTop), lift(section[i], crownTop), lift(section[i + 1], crownTop)], [[0, -1, 0], [0, -1, 0], [0, -1, 0]], soffit);
+        }
+    }
+    // The tiers, on the north and south faces: each a block to its shoulder and a step per
+    // bay inward, with its strip's gabled head over the last.
+    const tiers = [0, 1].flatMap((frame) => {
+        const depth = (form.fronts[frame] - coreB) / 2;
+        return [
+            { frame, gable: middle, back: coreB, front: coreB + depth, seed: 10 + frame * 2 },
+            { frame, gable: lower, back: coreB + depth, front: form.fronts[frame], seed: 11 + frame * 2 },
+        ];
+    });
+    for (const tier of tiers) {
+        const { frame, gable, back, front } = tier, wall = { gable, seed: tier.seed };
+        const block = (half) => ringOf(frame, [[-half, front], [half, front], [half, back], [-half, back]]);
+        const sides = (half, ribbon = true) => [{ wall, from: -half }, ribbon ? { ribbon: front - back } : { plain: stone }, { plain: stone }, ribbon ? { ribbon: front - back } : { plain: stone }];
+        prism(block(gable.half), rowsBetween(h.lobbyTop, gable.shoulder), sides(gable.half));
+        for (let step = 1; step < gable.bays; step += 1) {
+            const half = gable.half - step * gable.bay, lo = gable.shoulder + (step - 1) * h.pitch;
+            prism(block(half), rowsBetween(lo, lo + h.pitch), sides(half, false));
+        }
+        const foot = gable.shoulder + (gable.bays - 1) * h.pitch;
+        extrude(body, frame, [[-gable.strip, foot], [gable.strip, foot], [gable.strip, stripShoulder(gable)], [0, gable.peak], [-gable.strip, stripShoulder(gable)]], back, front, roofGlass, stone);
+    }
+    // The core's strips' pointed heads, 3 cm proud of the stepped walls behind them. Each
+    // starts in the spandrel under its shoulder, so its underside shares no plane with a
+    // step's.
+    for (const frame of [0, 1]) {
+        for (const [gable, local, reach] of [[g.front, frame, coreB], [g.side, frame + 2, coreA]]) {
+            const shoulder = stripShoulder(gable);
+            extrude(body, local, [[-gable.strip, shoulder - 0.3], [gable.strip, shoulder - 0.3], [gable.strip, shoulder], [0, gable.peak], [-gable.strip, shoulder]], reach - 0.5, reach + 0.03, roofGlass, roofGlass);
+        }
+    }
+    // Every face's piers, copings and strip mullions. A face is a run along its wall with
+    // its outward normal, its gable, and what covers its foot.
+    const faces = [0, 1].flatMap((frame) => {
+        const depth = (form.fronts[frame] - coreB) / 2;
+        return [
+            { run: line(at(frame, -coreA, coreB), at(frame, coreA, coreB)), gable: g.front, cover: (x) => (Math.abs(x) <= middle.half ? wallTop(middle, x) : h.lobbyTop), tier: false },
+            { run: line(at(frame, coreA, coreB), at(frame, coreA, -coreB)), gable: g.side, cover: () => h.lobbyTop, tier: false },
+            { run: line(at(frame, -middle.half, coreB + depth), at(frame, middle.half, coreB + depth)), gable: middle, cover: (x) => (Math.abs(x) <= lower.half ? wallTop(lower, x) : h.lobbyTop), tier: true },
+            { run: line(at(frame, -lower.half, form.fronts[frame]), at(frame, lower.half, form.fronts[frame])), gable: lower, cover: () => h.lobbyTop, tier: true },
+        ];
+    });
+    const rightAngle = -Math.PI / 2;
+    const box = (target, run, x0, x1, before, after, width, lo, hi, half) => {
+        const bottom = Math.max(lo, form.base);
+        if (hi - bottom < 0.05)
+            return;
+        mitredBox(kit, target, run, x0 + half, x1 + half, before, after, width, bottom, hi, y);
+    };
+    for (const { run, gable, cover, tier } of faces) {
+        const half = gable.half, span = (x0, x1, f, pick) => pick(f(x0 + 1e-4), f(x1 - 1e-4));
+        for (const sign of [-1, 1]) {
+            pierStations(gable).forEach((r, i) => {
+                const [lo, hi] = i ? [r - pierWidth / 2, r + pierWidth / 2] : [half - pierWidth, half];
+                const [x0, x1] = sign < 0 ? [-hi, -lo] : [lo, hi];
+                // A pier over a tier stands on the coping along that tier's step: every step's edge
+                // falls on a joint of the wall behind it.
+                const covered = span(x0, x1, cover, Math.max), bottom = covered > h.lobbyTop + 1e-6 ? covered + 0.26 : covered;
+                const top = span(x0, x1, (x) => wallTop(gable, x), Math.min) - 0.7;
+                const corner = i === 0 ? rightAngle : undefined;
+                box(piers, run, x0, x1, sign < 0 ? corner : undefined, sign > 0 ? corner : undefined, pierDepth, bottom, top, half);
+            });
+            for (let bay = 0; bay < gable.bays; bay += 1) {
+                const top = gable.shoulder + bay * h.pitch, outer = half - bay * gable.bay, inner = outer - gable.bay;
+                const [x0, x1] = sign < 0 ? [-outer, -inner] : [inner, outer];
+                // Each coping meets the side's at a convex corner: the core's corner, and every step
+                // of a tier. The core's steps above its eave end against the pyramid's risers.
+                const corner = bay === 0 || tier ? rightAngle : undefined;
+                box(copings, run, x0, x1, sign < 0 ? corner : undefined, sign > 0 ? corner : undefined, 0.45, top - 0.7, top + 0.25, half);
+            }
+        }
+        // Mullions between the strip's lites, from what covers the strip to under its head.
+        const lites = Math.round(2 * gable.strip / 1.85), lite = 2 * gable.strip / lites, n = run.normal(0);
+        for (let k = 1; k < lites; k += 1) {
+            const x = -gable.strip + k * lite, bottom = Math.max(cover(x - 0.06), cover(x + 0.06), form.base) + 0.05;
+            const top = Math.min(wallTop(gable, x - 0.06), wallTop(gable, x + 0.06)) - 0.35;
+            if (top - bottom > 0.5)
+                kit.box(mullions, run.at(x + half), n, 0.06, -0.02, 0.14, y(bottom), y(top));
+        }
+    }
+    // The tiers' sides: a corner pier meeting the front's, and a coping along each step's
+    // top from the front back to the wall behind.
+    for (const tier of tiers) {
+        const { frame, gable, back, front } = tier;
+        for (let step = 0; step < gable.bays; step += 1) {
+            const half = gable.half - step * gable.bay, top = gable.shoulder + step * h.pitch;
+            const east = line(at(frame, half, front), at(frame, half, back)), west = line(at(frame, -half, back), at(frame, -half, front));
+            const length = front - back;
+            box(copings, east, -length / 2, length / 2, rightAngle, undefined, 0.45, top - 0.7, top + 0.25, length / 2);
+            box(copings, west, -length / 2, length / 2, undefined, rightAngle, 0.45, top - 0.7, top + 0.25, length / 2);
+            if (step === 0) {
+                const bottom = h.lobbyTop;
+                box(piers, east, -length / 2, -length / 2 + pierWidth, rightAngle, undefined, pierDepth, bottom, top - 0.7, length / 2);
+                box(piers, west, length / 2 - pierWidth, length / 2, undefined, rightAngle, pierDepth, bottom, top - 0.7, length / 2);
+            }
+        }
+    }
+    // A broad rib on each ridge: a hipped plate whose front edges follow its strip's pointed
+    // head, from the head's shoulders to its point, and whose ridge and inner edges run on
+    // straight to the apex. The pyramid's steps end on its inner edges, and under it each
+    // step stands back, so the rib stands proud of the steps beside it.
+    const ribDepth = 0.35;
+    for (const frame of [0, 1, 2, 3]) {
+        const gable = frame < 2 ? g.front : g.side, reach = frame < 2 ? coreB : coreA, shoulder = stripShoulder(gable);
+        const corner = (u, v, real) => lift(at(frame, u, v), real);
+        // Its left shoulder seen from outside, the head's point, its right shoulder and the apex,
+        // then the same raised.
+        const low = [corner(-gable.strip, reach, shoulder), corner(0, reach, gable.peak), corner(gable.strip, reach, shoulder), corner(0, 0, h.apex)];
+        const high = low.map(([x, real, z]) => [x, real + ribDepth, z]);
+        // A point inside each half of the plate, to turn every face's normal outward: the plate
+        // is folded along its ridge, so no one centre lies inside it.
+        const inside = (a, b, c) => [0, 1, 2].map((k) => (a[k] + b[k] + c[k]) / 3 + (k === 1 ? ribDepth / 2 : 0));
+        const left = inside(low[0], low[1], low[3]), right = inside(low[1], low[2], low[3]);
+        const face = (points, within) => {
+            const u = points[1].map((value, k) => value - points[0][k]), w = points[2].map((value, k) => value - points[0][k]);
+            let n = [u[1] * w[2] - u[2] * w[1], u[2] * w[0] - u[0] * w[2], u[0] * w[1] - u[1] * w[0]];
+            const centre = points.reduce((sum, p) => sum.map((value, k) => value + p[k] / points.length), [0, 0, 0]);
+            if (n[0] * (centre[0] - within[0]) + n[1] * (centre[1] - within[1]) + n[2] * (centre[2] - within[2]) < 0)
+                n = n.map((value) => -value);
+            if (points.length === 3)
+                kit.triangle(ribs, points, [n, n, n]);
+            else
+                kit.quad(ribs, points, [n]);
+        };
+        face([high[0], high[1], high[3]], left);
+        face([high[1], high[2], high[3]], right);
+        face([low[0], low[1], low[3]], left);
+        face([low[1], low[2], low[3]], right);
+        // Its front edges over the head, then its inner edges back from the apex.
+        for (const [i, j, within] of [[0, 1, left], [1, 2, right], [2, 3, right], [3, 0, left]])
+            face([low[i], low[j], high[j], high[i]], within);
+    }
+    // The spire: a shaft turned with the pyramid, its corners on the ridges, tapering from its
+    // foot in the cap to a needle.
+    const spireAt = (r, real) => [[0, r], [r, 0], [0, -r], [-r, 0]].map(([u, v]) => lift(at(0, u, v), real));
+    const faceNormal = (p, q, r) => {
+        const u = q.map((value, k) => value - p[k]), w = r.map((value, k) => value - p[k]);
+        const n = [u[1] * w[2] - u[2] * w[1], u[2] * w[0] - u[0] * w[2], u[0] * w[1] - u[1] * w[0]];
+        const centre = lift(form.centre, p[1] + form.base);
+        return (n[0] * (p[0] - centre[0]) + n[2] * (p[2] - centre[2]) < 0 ? n.map((value) => -value) : n);
+    };
+    const footY = h.apex - 3.9, foot = spireAt(1.6, footY), shaft = spireAt(0.85, h.shaftTop), needle = spireAt(0.32, h.shaftTop), tip = lift(form.centre, h.tip);
+    for (let i = 0; i < 4; i += 1) {
+        const j = (i + 1) % 4, n = faceNormal(foot[i], foot[j], shaft[i]);
+        kit.quad(spire, [foot[i], foot[j], shaft[j], shaft[i]], [n]);
+        const m = faceNormal(needle[i], needle[j], tip);
+        kit.triangle(spire, [needle[i], needle[j], tip], [m, m, m]);
+        // A dark inset panel down each face, in two lengths between bright folded edges.
+        const unit = n.map((value) => value / Math.hypot(...n));
+        const radius = (real) => 1.6 + (0.85 - 1.6) * (real - footY) / (h.shaftTop - footY);
+        for (const [lo, hi] of [[h.apex + 0.6, h.apex + 7.4], [h.apex + 7.9, h.shaftTop - 1.2]]) {
+            // Half the face's width, about its middle.
+            const corners = [[lo, -1], [lo, 1], [hi, 1], [hi, -1]].map(([real, side]) => {
+                const ring = spireAt(radius(real), real), [p, q] = [ring[i], ring[j]];
+                return p.map((value, k) => (value + q[k]) / 2 + (q[k] - value) / 4 * side);
+            });
+            const moved = (distance) => corners.map((p) => p.map((value, k) => value + unit[k] * distance));
+            const [outer, inner] = [moved(0.03), moved(-0.02)];
+            kit.quad(spirePanels, [outer[0], outer[1], outer[2], outer[3]], [unit]);
+            kit.quad(spirePanels, [inner[0], inner[1], inner[2], inner[3]], [unit.map((value) => -value)]);
+            for (let k = 0; k < 4; k += 1) {
+                const l = (k + 1) % 4, quad = [inner[k], inner[l], outer[l], outer[k]];
+                const edge = outer[l].map((value, c) => value - outer[k][c]), side = [edge[1] * unit[2] - edge[2] * unit[1], edge[2] * unit[0] - edge[0] * unit[2], edge[0] * unit[1] - edge[1] * unit[0]];
+                const centre = outer.reduce((sum, v) => sum.map((value, c) => value + v[c] / 4), [0, 0, 0]), mid = outer[k].map((value, c) => (value + outer[l][c]) / 2);
+                kit.quad(spirePanels, quad, [side[0] * (mid[0] - centre[0]) + side[1] * (mid[1] - centre[1]) + side[2] * (mid[2] - centre[2]) < 0 ? side.map((value) => -value) : side]);
+            }
+        }
+    }
+    kit.quad(spire, [foot[0], foot[1], foot[2], foot[3]], [[0, -1, 0]]);
+    kit.quad(spire, [shaft[0], shaft[1], shaft[2], shaft[3]], [[0, 1, 0]]);
+    kit.quad(spire, [needle[0], needle[1], needle[2], needle[3]], [[0, -1, 0]]);
+    return kit.finish({ height: y(h.tip), outlines: [body, spire], opacity: 0.18 });
+}