diff --git a/README.md b/README.md
index ef8173d..b373412 100644
--- a/README.md
+++ b/README.md
@@ -2,15 +2,15 @@
 
 <img alt="The 0-draft desk" src="public/og.png">
 
-Everything public in the [0-draft](https://github.com/0-draft) org, filed as dossiers on a lodge desk at <https://0-draft.github.io/>.
+Everything public in the [0-draft](https://github.com/0-draft) org, pulled as proofs and laid out on a print-shop desk at night: <https://0-draft.github.io/>.
 
-Drag the desk to look around and pinch (or press `+` and `-`) to zoom. Break the wax seal on a sheet and the real site opens right on the desk. Red string ties together sheets that belong together across piles. Blackjack, shogi and the guest book are read live from their READMEs, so you can make a move from here. Prefer a plain page? Press "List view".
+Drag the desk to look around and pinch (or press `+` and `-`) to zoom. Break the wax seal on a sheet and the real site opens right on the desk. Blackjack, shogi and the guest book are read live from their READMEs, so you can make a move from here. Prefer a plain page? Press "List view".
 
 ## How it works
 
 - `scripts/sync.ts` pulls the org's public repos (archived repos and forks are left out), the live region of each README game, and the latest dev.to articles into `src/data/`. A source that fails keeps its previous file.
 - `src/data/groups.ts` decides which pile a repo sits in. A new repo that isn't filed there shows up on its own pile on the next build.
-- `src/lib/desk.ts` holds where each sheet sits on the mat. `src/scripts/desk.ts` is the camera: pan, zoom, rulers, minimap and the live frame. It has no dependencies.
+- `src/lib/desk.ts` holds where each sheet sits on the desk. `src/scripts/desk.ts` is the camera: pan, zoom, the minimap and the live frame. It has no dependencies.
 - `src/assets/shots/` holds a screenshot per project, named after the repo.
 
 ## CI
diff --git a/astro.config.mjs b/astro.config.mjs
index daadc58..7a14a36 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -6,25 +6,17 @@ export default defineConfig({
   fonts: [
     {
       provider: fontProviders.google(),
-      name: "M PLUS Rounded 1c",
-      cssVariable: "--font-round",
-      weights: [500, 800, 900],
+      name: "Archivo",
+      cssVariable: "--font-sans",
+      weights: [400, 500, 700, 800, 900],
       subsets: ["latin"],
-      fallbacks: ["ui-rounded", "system-ui", "sans-serif"],
+      fallbacks: ["Helvetica Neue", "Arial", "sans-serif"],
     },
     {
       provider: fontProviders.google(),
-      name: "IM Fell English SC",
-      cssVariable: "--font-fell",
-      weights: [400],
-      subsets: ["latin"],
-      fallbacks: ["Georgia", "serif"],
-    },
-    {
-      provider: fontProviders.google(),
-      name: "DotGothic16",
-      cssVariable: "--font-dot",
-      weights: [400],
+      name: "Martian Mono",
+      cssVariable: "--font-mono",
+      weights: [400, 500],
       subsets: ["latin"],
       fallbacks: ["ui-monospace", "monospace"],
     },
diff --git a/public/og.png b/public/og.png
index e9401db..f7a622a 100644
Binary files a/public/og.png and b/public/og.png differ
diff --git a/public/tex/ink.webp b/public/tex/ink.webp
new file mode 100644
index 0000000..0e07b70
Binary files /dev/null and b/public/tex/ink.webp differ
diff --git a/public/tex/paper.webp b/public/tex/paper.webp
new file mode 100644
index 0000000..5ce89a2
Binary files /dev/null and b/public/tex/paper.webp differ
diff --git a/public/tex/stock.webp b/public/tex/stock.webp
new file mode 100644
index 0000000..c4f4bf5
Binary files /dev/null and b/public/tex/stock.webp differ
diff --git a/src/components/Sheet.astro b/src/components/Sheet.astro
index e4d1ba5..4816c81 100644
--- a/src/components/Sheet.astro
+++ b/src/components/Sheet.astro
@@ -1,6 +1,6 @@
 ---
 import { Image } from "astro:assets";
-// One project, printed and taped to the mat.
+// One project, pulled as a proof and laid on the desk.
 import type { ImageMetadata } from "astro";
 import wax from "../assets/wax.png";
 import { ago, framable, type Shelf } from "../lib/desk.ts";
@@ -29,17 +29,6 @@ const host = site?.replace(/^https:\/\//, "").replace(/\/$/, "");
   data-group={group}
   aria-labelledby={`${repo.name}-title`}
 >
-  {
-    repo.tape === 0 ? (
-      <Image class="fix fix-seal" src={wax} alt="" width={136} format="webp" />
-    ) : repo.tape === 1 ? (
-      <span class="fix tape" aria-hidden="true" />
-    ) : (
-      <svg class="fix fix-clip" viewBox="0 0 40 110" aria-hidden="true">
-        <use href="#clip" />
-      </svg>
-    )
-  }
   {
     kind === "screen" && (
       <div class="screen">
@@ -82,5 +71,5 @@ const host = site?.replace(/^https:\/\//, "").replace(/\/$/, "");
       <a class="btn" href={repo.url}>Source</a>
     </p>
   </div>
-  <svg class:list={["stamp", `stamp-${repo.tape}`]} viewBox="0 0 120 120" aria-hidden="true"><use href="#stamp"></use></svg>
+  <svg class:list={["stamp", `stamp-${repo.tape}`]} viewBox="0 0 172 76" aria-hidden="true"><use href="#stamp"></use></svg>
 </article>
diff --git a/src/lib/desk.ts b/src/lib/desk.ts
index 4a5367e..e7fa77d 100644
--- a/src/lib/desk.ts
+++ b/src/lib/desk.ts
@@ -1,4 +1,4 @@
-// Where everything sits on the mat, in world pixels. The home sheet is centred on (0, 0).
+// Where everything sits on the desk, in world pixels. The home sheet is centred on (0, 0).
 // Positions are top-left corners; sizes come from the rendered elements, so only placement lives here.
 import { fallback, groups } from "../data/groups.ts";
 import repos from "../data/repos.json";
@@ -36,17 +36,6 @@ export const labels: Record<string, Spot> = {
   fresh: { x: 900, y: 1500 },
 };
 
-// Red string between sheets that belong together across piles: the same subject,
-// or a project and the article written about it. Pairs naming a missing repo are skipped.
-export const threads: [string, string][] = [
-  ["caller-identity", "assume-role"],
-  ["assume-role", "identity-deep-dive"],
-  ["on-ramp", "cross-connect"],
-  ["authz-playground", "dev.to"],
-  ["identity-deep-dive", "dev.to"],
-  ["shogi", "dev.to"],
-];
-
 // Dossier numbers are primes, for anyone who notices.
 const PRIMES = [2, 3, 5, 7, 11, 13, 17, 19, 23, 29, 31];
 export const fileNo = (i: number) => `File ${String(PRIMES[i] ?? i + 1).padStart(2, "0")}`;
diff --git a/src/lib/guilloche.ts b/src/lib/guilloche.ts
deleted file mode 100644
index da01d9d..0000000
--- a/src/lib/guilloche.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-// Banknote-style guilloché: bands of phase-shifted wavy circles that cross into a lattice.
-// Generated once at build time as SVG path data, so the page ships no drawing code.
-
-export interface Band {
-  radius: number;
-  amplitude: number;
-  waves: number;
-  strands: number;
-}
-
-function ring(cx: number, cy: number, b: Band, phase: number, steps = 720): string {
-  const pts: string[] = [];
-  for (let i = 0; i <= steps; i++) {
-    const t = (i / steps) * Math.PI * 2;
-    const r = b.radius + b.amplitude * Math.sin(b.waves * t + phase);
-    pts.push(`${(cx + r * Math.cos(t)).toFixed(1)} ${(cy + r * Math.sin(t)).toFixed(1)}`);
-  }
-  return `M${pts.join("L")}Z`;
-}
-
-export function rosette(cx: number, cy: number, bands: Band[]): string {
-  return bands
-    .flatMap((b) =>
-      Array.from({ length: b.strands }, (_, i) => ring(cx, cy, b, (i / b.strands) * ((Math.PI * 2) / b.waves))),
-    )
-    .join("");
-}
diff --git a/src/pages/index.astro b/src/pages/index.astro
index c73143e..2cef9cb 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -4,8 +4,7 @@ import Blocks from "../components/Blocks.astro";
 import Sheet from "../components/Sheet.astro";
 import articles from "../data/articles.json";
 import games from "../data/games.json";
-import { fileNo, home, shelves, threads } from "../lib/desk.ts";
-import { rosette } from "../lib/guilloche.ts";
+import { fileNo, home, shelves } from "../lib/desk.ts";
 import type { Block } from "../lib/readme.ts";
 import "../styles/desk.css";
 
@@ -17,12 +16,6 @@ const shortDate = (iso: string) =>
   new Date(iso).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric", timeZone: "UTC" });
 const description = "Raw outputs, researches, and unpolished tools. Everything here is v0.";
 const count = all.reduce((n, s) => n + s.repos.length, 0);
-const onDesk = new Set(all.flatMap((s) => s.repos.map((r) => r.name)));
-const strings = threads.filter(([a, b]) => onDesk.has(a) && onDesk.has(b)).map((t) => t.join(":"));
-const crest = rosette(330, 330, [
-  { radius: 300, amplitude: 14, waves: 36, strands: 7 },
-  { radius: 252, amplitude: 9, waves: 48, strands: 5 },
-]);
 ---
 
 <!doctype html>
@@ -36,52 +29,18 @@ const crest = rosette(330, 330, [
     <meta property="og:description" content={description} />
     <meta property="og:image" content={new URL("/og.png", Astro.site)} />
     <meta name="twitter:card" content="summary_large_image" />
-    <meta name="theme-color" content="#1c3f33" />
+    <meta name="theme-color" content="#0f0e0d" />
     <link rel="icon" href="/favicon.png" type="image/png" />
-    <Font cssVariable="--font-round" preload />
-    <Font cssVariable="--font-dot" preload />
-    <Font cssVariable="--font-fell" preload />
+    <Font cssVariable="--font-sans" preload />
+    <Font cssVariable="--font-mono" preload />
   </head>
   <body>
     <svg width="0" height="0" class="sprite" aria-hidden="true">
-      <defs>
-        <radialGradient id="brass-fill" cx="35%" cy="30%" r="75%">
-          <stop offset="0" stop-color="#f3dfa6"></stop>
-          <stop offset="0.45" stop-color="#c9a45c"></stop>
-          <stop offset="1" stop-color="#7a5a2a"></stop>
-        </radialGradient>
-      </defs>
-      <symbol id="pin" viewBox="0 0 40 40">
-        <ellipse cx="22" cy="30" rx="11" ry="5" fill="rgb(0 0 0 / 0.35)"></ellipse>
-        <circle cx="20" cy="18" r="13" fill="url(#brass-fill)"></circle>
-        <circle cx="16" cy="13" r="4" fill="#fff6d8" opacity="0.7"></circle>
-      </symbol>
-      <symbol id="clip" viewBox="0 0 40 110">
-        <path
-          d="M12 96V22a8 8 0 0 1 16 0v66a13 13 0 0 1-26 0V14a12 12 0 0 1 24 0"
-          fill="none"
-          stroke="#8a6a3a"
-          stroke-width="5"
-          stroke-linecap="round"></path>
-        <path
-          d="M12 96V22a8 8 0 0 1 16 0v66a13 13 0 0 1-26 0V14a12 12 0 0 1 24 0"
-          fill="none"
-          stroke="#e3c98b"
-          stroke-width="2.2"
-          stroke-linecap="round"
-          transform="translate(-0.8 -0.8)"></path>
-      </symbol>
-      <symbol id="stamp" viewBox="0 0 120 120">
-        <path id="stamp-ring" d="M60 60m-45 0a45 45 0 1 1 90 0a45 45 0 1 1-90 0" fill="none"></path>
-        <circle cx="60" cy="60" r="57" fill="none" stroke="currentColor" stroke-width="4"></circle>
-        <circle cx="60" cy="60" r="35" fill="none" stroke="currentColor" stroke-width="2"></circle>
-        <text font-size="11.5" font-weight="900" letter-spacing="1.4" fill="currentColor">
-          <textPath href="#stamp-ring">raw output · unpolished · draft zero ·</textPath>
-        </text>
-        <path
-          d="M60 45.5s-5-3-5-6.4a2.6 2.6 0 0 1 5-1 2.6 2.6 0 0 1 5 1c0 3.4-5 6.4-5 6.4z"
-          fill="currentColor"></path>
-        <text x="60" y="78" text-anchor="middle" font-size="30" font-weight="900" fill="currentColor">v0</text>
+      <symbol id="stamp" viewBox="0 0 172 76">
+        <rect x="3" y="3" width="166" height="70" rx="5" fill="none" stroke="currentColor" stroke-width="4.5"></rect>
+        <rect x="10" y="10" width="152" height="56" rx="2" fill="none" stroke="currentColor" stroke-width="1.6"></rect>
+        <text x="86" y="44" text-anchor="middle" font-size="31" font-weight="900" letter-spacing="5" fill="currentColor">PROOF</text>
+        <text x="86" y="59" text-anchor="middle" font-size="9" font-weight="700" letter-spacing="1.6" fill="currentColor">v0 · not for release</text>
       </symbol>
     </svg>
     <a class="skip" href="#list" data-mode="list">Skip to the project list</a>
@@ -98,16 +57,13 @@ const crest = rosette(330, 330, [
     </header>
 
     <main class="desk" id="desk" aria-label="The 0-draft desk">
+      <div class="surface" aria-hidden="true"></div>
       <div class="world" id="world">
         <section class="item home" id="home" data-x={home.x} data-y={home.y} data-tilt="0" data-group="home">
-          <div class="crest">
-            <svg class="guilloche" viewBox="0 0 660 660" aria-hidden="true"><path d={crest}></path></svg>
-            <img class="home-seal" src="/seal.png" alt="The 0-draft seal: a robot face under a black beret with a red heart" width="900" height="860" fetchpriority="high" />
-          </div>
+          <img class="home-seal" src="/seal.png" alt="The 0-draft seal: a robot face under a black beret with a red heart" width="900" height="860" fetchpriority="high" />
           <div class="home-copy">
-            <p class="motto">Societas Draftorum Nulla</p>
             <h1>0-draft</h1>
-            <p class="bubble">Raw outputs, researches, and unpolished tools. Everything here is v0.</p>
+            <p class="lede">Raw outputs, researches, and unpolished tools. Everything here is v0.</p>
             <p class="hint">
               <span class="hint-desk">Drag the desk to look around and pinch to zoom. Break a seal and the project opens right here.</span>
               <span class="hint-list">{count} files on the desk right now, in {all.length} piles.</span>
@@ -119,12 +75,8 @@ const crest = rosette(330, 330, [
               </button>.
             </p>
           </div>
-          <img class="sticker sticker-avatar" src="/avatar.png" alt="" width="370" height="370" loading="lazy" />
         </section>
 
-        <svg class="strings" data-threads={strings.join(",")} aria-hidden="true"></svg>
-        <svg class="strings pins" aria-hidden="true"></svg>
-
         <div class="list-anchor" id="list" tabindex="-1"></div>
 
         {
@@ -134,7 +86,7 @@ const crest = rosette(330, 330, [
                 class="item label"
                 data-x={shelf.label.x}
                 data-y={shelf.label.y}
-                data-tilt="-1.2"
+                data-tilt="0"
                 data-group={shelf.id}
               >
                 <span class="file-no">{fileNo(i)}</span>
@@ -208,8 +160,6 @@ const crest = rosette(330, 330, [
       <div class="scrim" aria-hidden="true"></div>
     </main>
 
-    <canvas class="ruler ruler-x" aria-hidden="true"></canvas>
-    <canvas class="ruler ruler-y" aria-hidden="true"></canvas>
 
     <nav class="hud tray" aria-label="Move around the desk">
       <div class="tray-go">
diff --git a/src/scripts/desk.ts b/src/scripts/desk.ts
index a657b1c..da0de20 100644
--- a/src/scripts/desk.ts
+++ b/src/scripts/desk.ts
@@ -3,10 +3,9 @@
 
 const html = document.documentElement;
 const desk = document.getElementById("desk") as HTMLElement;
+const surface = document.querySelector<HTMLElement>(".surface") as HTMLElement;
 const world = document.getElementById("world") as HTMLElement;
 const items = [...world.querySelectorAll<HTMLElement>(".item")];
-const rulerX = document.querySelector<HTMLCanvasElement>(".ruler-x") as HTMLCanvasElement;
-const rulerY = document.querySelector<HTMLCanvasElement>(".ruler-y") as HTMLCanvasElement;
 const zoomRead = document.querySelector<HTMLOutputElement>(".zoom-read") as HTMLOutputElement;
 const minimap = document.querySelector<HTMLButtonElement>(".minimap") as HTMLButtonElement;
 const modeToggle = document.querySelector<HTMLButtonElement>("[data-mode-toggle]") as HTMLButtonElement;
@@ -14,7 +13,7 @@ const reduced = matchMedia("(prefers-reduced-motion: reduce)");
 
 const Z_MIN = 0.04;
 const Z_MAX = 2.5;
-const RULER = 22;
+const TILE = 512;
 const TOP_BAR = 64;
 const BOTTOM_BAR = 84;
 
@@ -82,10 +81,10 @@ const everything = () => union([...boxes.values()]);
 
 // Camera that shows `box` with `pad` screen pixels around it, clear of the HUD bars.
 function fitBox(box: Box, pad = 40, top = TOP_BAR, bottom = BOTTOM_BAR): Cam {
-  const availW = vw - RULER - pad * 2;
+  const availW = vw - pad * 2;
   const availH = vh - top - bottom - pad * 2;
   const z = clampZ(Math.min(availW / box.w, availH / box.h));
-  const cx = box.x + box.w / 2 - RULER / 2 / z;
+  const cx = box.x + box.w / 2;
   const cy = box.y + box.h / 2 - (top - bottom) / 2 / z;
   return { x: cx, y: cy, z };
 }
@@ -141,13 +140,11 @@ function apply() {
   const ty = vh / 2 - cam.y * cam.z;
   world.style.transform = `translate(${tx}px, ${ty}px) scale(${cam.z})`;
   world.style.setProperty("--z", cam.z.toFixed(4));
-  desk.style.setProperty("--gx", `${tx}px`);
-  desk.style.setProperty("--gy", `${ty}px`);
-  let cell = 40;
-  while (cell * cam.z < 14) cell *= 5;
-  desk.style.setProperty("--gs", `${cell * cam.z}px`);
+  // The stock is one tile-sized layer that only ever translates, so panning never repaints it.
+  const ox = (((tx % TILE) + TILE) % TILE) - TILE;
+  const oy = (((ty % TILE) + TILE) % TILE) - TILE;
+  surface.style.transform = `translate3d(${ox}px, ${oy}px, 0)`;
   zoomRead.value = `${Math.round(cam.z * 100)}%`;
-  drawRulers(tx, ty);
   drawViewport();
 }
 
@@ -165,64 +162,7 @@ function zoomAt(factor: number, sx: number, sy: number, animate = false) {
   }
 }
 
-// ---------- rulers and minimap ----------
-
-const dpr = () => Math.min(2, window.devicePixelRatio || 1);
-let dotFont = "monospace";
-
-function sizeRulers() {
-  for (const [c, w, h] of [
-    [rulerX, vw, RULER],
-    [rulerY, RULER, vh],
-  ] as const) {
-    c.width = Math.round(w * dpr());
-    c.height = Math.round(h * dpr());
-  }
-}
-
-function drawRulers(tx: number, ty: number) {
-  const steps = [10, 20, 50, 100, 200, 500, 1000, 2000];
-  const step = steps.find((s) => s * cam.z >= 9) ?? 2000;
-  for (const axis of ["x", "y"] as const) {
-    const c = axis === "x" ? rulerX : rulerY;
-    const ctx = c.getContext("2d");
-    if (!ctx) continue;
-    const r = dpr();
-    ctx.setTransform(r, 0, 0, r, 0, 0);
-    const len = axis === "x" ? vw : vh;
-    ctx.clearRect(0, 0, axis === "x" ? len : RULER, axis === "x" ? RULER : len);
-    // engraved into a brass rule
-    ctx.fillStyle = "rgb(46 32 10 / 0.9)";
-    ctx.strokeStyle = "rgb(46 32 10 / 0.75)";
-    ctx.lineWidth = 1;
-    ctx.font = `11px ${dotFont}`;
-    const offset = axis === "x" ? tx : ty;
-    const first = Math.floor(-offset / cam.z / step) * step;
-    const lastWorld = (len - offset) / cam.z;
-    ctx.beginPath();
-    for (let w = first; w <= lastWorld; w += step) {
-      const p = Math.round(offset + w * cam.z) + 0.5;
-      const major = w % (step * 5) === 0;
-      const tickLen = major ? 10 : w % ((step * 5) / 5) === 0 ? 5 : 4;
-      if (axis === "x") {
-        ctx.moveTo(p, RULER);
-        ctx.lineTo(p, RULER - tickLen);
-        if (major) ctx.fillText(String(w), p + 3, 10);
-      } else {
-        ctx.moveTo(RULER, p);
-        ctx.lineTo(RULER - tickLen, p);
-        if (major) {
-          ctx.save();
-          ctx.translate(10, p - 3);
-          ctx.rotate(-Math.PI / 2);
-          ctx.fillText(String(w), 0, 0);
-          ctx.restore();
-        }
-      }
-    }
-    ctx.stroke();
-  }
-}
+// ---------- minimap ----------
 
 const SVG = "http://www.w3.org/2000/svg";
 const mapSvg = minimap.querySelector("svg") as SVGSVGElement;
@@ -400,7 +340,7 @@ world.addEventListener("focusin", (e) => {
   const left = (b.x - cam.x) * cam.z + vw / 2;
   const top = (b.y - cam.y) * cam.z + vh / 2;
   const visible =
-    left >= RULER && top >= TOP_BAR && left + b.w * cam.z <= vw && top + b.h * cam.z <= vh - BOTTOM_BAR && cam.z > 0.45;
+    left >= 0 && top >= TOP_BAR && left + b.w * cam.z <= vw && top + b.h * cam.z <= vh - BOTTOM_BAR && cam.z > 0.45;
   if (!visible) go(fitBox(b, 56));
   desk.scrollTop = 0;
   desk.scrollLeft = 0;
@@ -508,53 +448,6 @@ for (const b of document.querySelectorAll<HTMLButtonElement>("button.try")) {
   b.addEventListener("click", () => openLive(b));
 }
 
-// ---------- red string ----------
-
-const SVG_NS = "http://www.w3.org/2000/svg";
-const strings = world.querySelector<SVGSVGElement>(".strings:not(.pins)");
-const pinLayer = world.querySelector<SVGSVGElement>(".strings.pins");
-
-// Where a string is pinned: near the top-right corner of the sheet.
-function pinAt(el: HTMLElement) {
-  const b = boxes.get(el) as Box;
-  return { x: b.x + b.w - 40, y: b.y + 30 };
-}
-
-function drawStrings() {
-  if (!strings) return;
-  const pairs = (strings.dataset.threads ?? "")
-    .split(",")
-    .filter(Boolean)
-    .map((p) => p.split(":").map((id) => document.getElementById(id)));
-  const parts: SVGElement[] = [];
-  const pins: SVGElement[] = [];
-  for (const [ea, eb] of pairs) {
-    if (!ea || !eb || !boxes.has(ea) || !boxes.has(eb)) continue;
-    const a = pinAt(ea);
-    const b = pinAt(eb);
-    // A string hangs: the control point sits below the midpoint, more for longer runs.
-    const sag = Math.min(280, Math.hypot(b.x - a.x, b.y - a.y) * 0.14);
-    const d = `M${a.x} ${a.y}Q${(a.x + b.x) / 2} ${(a.y + b.y) / 2 + sag * 2} ${b.x} ${b.y}`;
-    for (const cls of ["thread", "thread-shine"]) {
-      const path = document.createElementNS(SVG_NS, "path");
-      path.setAttribute("class", cls);
-      path.setAttribute("d", d);
-      parts.push(path);
-    }
-    for (const p of [a, b]) {
-      const use = document.createElementNS(SVG_NS, "use");
-      use.setAttribute("href", "#pin");
-      for (const [k, v] of Object.entries({ x: p.x - 20, y: p.y - 20, width: 40, height: 40 })) {
-        use.setAttribute(k, String(v));
-      }
-      pins.push(use);
-    }
-  }
-  // The string runs under the sheets; only the pins sit on top.
-  strings.replaceChildren(...parts);
-  pinLayer?.replaceChildren(...pins);
-}
-
 // ---------- the redacted password ----------
 
 for (const r of document.querySelectorAll<HTMLButtonElement>(".redacted")) {
@@ -588,9 +481,7 @@ function setMode(mode: "desk" | "list", intro = false) {
   }
   place();
   measure();
-  sizeRulers();
   drawMinimap();
-  drawStrings();
   const overview = narrow() ? shelfView("home") : fitBox(everything());
   if (intro && !reduced.matches) {
     // Start nose to nose with the seal, then pull back to show the whole desk.
@@ -629,7 +520,6 @@ window.addEventListener("resize", () => {
   resizeTimer = window.setTimeout(() => {
     vw = desk.clientWidth;
     vh = desk.clientHeight;
-    sizeRulers();
     if (liveFrom) {
       go(fitBox(screenBox(liveFrom.sheet), 12, TOP_BAR, 12), { instant: true }).then(positionLive);
     } else apply();
@@ -638,7 +528,6 @@ window.addEventListener("resize", () => {
 
 async function start() {
   await document.fonts.ready;
-  dotFont = getComputedStyle(html).getPropertyValue("--font-dot").trim() || "monospace";
   setMode(recalled() === "list" ? "list" : "desk", true);
   html.classList.add("ready");
 }
diff --git a/src/styles/desk.css b/src/styles/desk.css
index f06d545..c72c9f6 100644
--- a/src/styles/desk.css
+++ b/src/styles/desk.css
@@ -1,63 +1,32 @@
 @layer reset, base, things, desk, hud, list;
 
-/* ---------- tokens ---------- */
+/* ---------- tokens ----------
+   A print shop at night: proofs on black stock under one lamp.
+   Two values, paper and ink, and one colour, the red of the seal. */
 
 :root {
-  /* the lodge desk: bottle-green baize, gold tooling, brass fittings */
-  --desk: #1c3f33;
-  --desk-deep: #12291f;
-  --desk-line: rgb(201 164 92 / 0.09);
-  --desk-line-major: rgb(201 164 92 / 0.2);
-  --gilt: #c9a45c;
-  --gilt-deep: #8a6a3a;
-  --brass: #b08d57;
-  --paper: #f7f4ec;
-  --paper-cool: #ebe6d9;
-  --manila: #dcc79a;
-  --manila-deep: #c4ab76;
-  --ink: #14161c;
-  --ink-soft: #3a3e48;
-  --wax: #b3272a;
-  --wax-deep: #8e1c1f;
-  --wax-light: #d0484a;
-  --blush: #f2a9a1;
+  --night: #0f0e0d;
+  --paper: #f1ece1;
+  --paper-shade: #e2dbcc;
+  --ink: #141210;
+  --ink-soft: #4d4842;
+  --red: #b3272a;
+  --red-deep: #8e1c1f;
+  /* the seal red lifted for text on the black desk: 5:1 against --night */
+  --red-on-night: #e0575a;
   --felt: #1c5c43;
   --wood: #ecd6a6;
 
-  --round: var(--font-round), "M PLUS Rounded 1c", ui-rounded, system-ui, sans-serif;
-  --dot: var(--font-dot), "DotGothic16", ui-monospace, monospace;
-  --fell: var(--font-fell), "IM Fell English SC", Georgia, serif;
-  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .13 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
+  --on-night: rgb(241 236 225 / 0.92);
+  --on-night-soft: rgb(241 236 225 / 0.62);
+  --on-night-faint: rgb(241 236 225 / 0.18);
 
-  --shadow-paper:
-    0 1px 1px rgb(0 0 0 / 0.08), 0 12px 24px -10px rgb(4 16 12 / 0.5), 0 40px 70px -40px rgb(4 16 12 / 0.45);
-  --shadow-lift:
-    0 1px 1px rgb(0 0 0 / 0.08), 0 24px 40px -14px rgb(4 16 12 / 0.55), 0 70px 100px -50px rgb(4 16 12 / 0.5);
-  --hearts: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='22' viewBox='0 0 26 22'%3E%3Cpath d='M13 17s-5.4-3.3-5.4-6.9a2.8 2.8 0 0 1 5.4-1.1 2.8 2.8 0 0 1 5.4 1.1c0 3.6-5.4 6.9-5.4 6.9z' fill='%23fff' fill-opacity='.6'/%3E%3C/svg%3E");
-  --zigzag: polygon(
-    0 8%,
-    3% 0,
-    6% 9%,
-    9% 0,
-    12% 8%,
-    88% 6%,
-    91% 0,
-    94% 8%,
-    97% 0,
-    100% 7%,
-    100% 93%,
-    97% 100%,
-    94% 92%,
-    91% 100%,
-    88% 94%,
-    12% 92%,
-    9% 100%,
-    6% 91%,
-    3% 100%,
-    0 92%
-  );
+  --sans: var(--font-sans), "Archivo", "Helvetica Neue", Arial, sans-serif;
+  --mono: var(--font-mono), "Martian Mono", ui-monospace, monospace;
 
-  --ruler: 22px;
+  /* paper lies flat: a tight contact shadow and a soft one cast away from the lamp */
+  --shadow-sheet: 0 1px 1px rgb(0 0 0 / 0.55), 0 10px 18px -8px rgb(0 0 0 / 0.75), 0 36px 60px -26px rgb(0 0 0 / 0.7);
+  --shadow-lift: 0 1px 1px rgb(0 0 0 / 0.5), 0 22px 34px -12px rgb(0 0 0 / 0.8), 0 70px 90px -40px rgb(0 0 0 / 0.75);
 }
 
 @layer reset {
@@ -91,31 +60,29 @@
 
 @layer base {
   html {
-    color-scheme: light;
+    color-scheme: dark;
     -webkit-text-size-adjust: 100%;
   }
   body {
-    background: var(--desk);
-    color: var(--ink);
-    font-family: var(--round);
-    font-weight: 500;
+    background: var(--night) url("/tex/stock.webp") 0 0 / 512px;
+    color: var(--on-night);
+    font-family: var(--sans);
+    font-weight: 400;
     font-size: 16px;
     line-height: 1.5;
     -webkit-font-smoothing: antialiased;
   }
   a {
     color: inherit;
-    text-decoration-thickness: 2px;
-    text-underline-offset: 3px;
+    text-decoration-thickness: 1.5px;
+    text-underline-offset: 4px;
   }
   :focus-visible {
-    outline: 3px solid var(--gilt);
+    outline: 2px solid var(--paper);
     outline-offset: 3px;
-    border-radius: 4px;
   }
-  .sheet :focus-visible,
-  .label :focus-visible {
-    outline-color: var(--wax);
+  .sheet :focus-visible {
+    outline-color: var(--ink);
   }
   .skip {
     position: fixed;
@@ -124,13 +91,16 @@
     left: 8px;
     padding: 10px 16px;
     background: var(--paper);
-    border-radius: 999px;
-    font-weight: 800;
+    color: var(--ink);
+    font-weight: 700;
     translate: 0 -200%;
   }
   .skip:focus-visible {
     translate: 0 0;
   }
+  .sprite {
+    position: absolute;
+  }
 }
 
 /* ---------- things on the desk (same look in both views) ---------- */
@@ -138,184 +108,124 @@
 @layer things {
   .home {
     display: grid;
-    grid-template-columns: 560px 1fr;
+    grid-template-columns: 520px 1fr;
     align-items: center;
-    gap: 48px;
-    width: 1360px;
-    color: var(--paper);
-  }
-  .crest {
-    position: relative;
-    display: grid;
-    place-items: center;
-  }
-  .guilloche {
-    position: absolute;
-    inset: -70px;
-    width: calc(100% + 140px);
-    height: calc(100% + 140px);
-    fill: none;
-    stroke: var(--gilt);
-    stroke-width: 0.9;
-    opacity: 0.5;
-    pointer-events: none;
+    gap: 64px;
+    width: 1400px;
   }
   .home-seal {
-    position: relative;
-    width: 560px;
+    width: 520px;
     height: auto;
-    filter: drop-shadow(0 14px 18px rgb(4 16 12 / 0.55));
-  }
-  .motto {
-    font-family: var(--fell);
-    font-size: 34px;
-    letter-spacing: 0.06em;
-    color: var(--gilt);
+    filter: drop-shadow(0 4px 2px rgb(0 0 0 / 0.6)) drop-shadow(0 30px 40px rgb(0 0 0 / 0.7));
   }
   .home h1 {
     font-weight: 900;
-    font-size: 200px;
-    line-height: 0.88;
-    letter-spacing: -0.04em;
+    font-size: 232px;
+    line-height: 0.82;
+    letter-spacing: -0.055em;
+    color: var(--paper);
     white-space: nowrap;
-    /* gold foil: a bright band moving through darker gilt */
-    background: linear-gradient(172deg, #f6e3a8 8%, #c9a45c 34%, #8a6a3a 52%, #e8cf8a 70%, #a9853f 92%);
-    background-clip: text;
-    color: transparent;
-    filter: drop-shadow(0 3px 0 rgb(4 16 12 / 0.55));
   }
-  .bubble {
-    position: relative;
-    margin-top: 34px;
-    padding: 22px 30px 24px;
-    background: var(--paper);
-    color: var(--ink);
-    border-radius: 32px;
-    font-size: 30px;
-    font-weight: 800;
-    line-height: 1.35;
+  .lede {
+    max-width: 19em;
+    margin-top: 36px;
+    font-size: 36px;
+    font-weight: 500;
+    line-height: 1.2;
+    letter-spacing: -0.015em;
     text-wrap: balance;
-    box-shadow: var(--shadow-paper);
-  }
-  .bubble::before {
-    content: "";
-    position: absolute;
-    left: -22px;
-    top: 30px;
-    width: 34px;
-    height: 28px;
-    background: inherit;
-    clip-path: polygon(100% 0, 0 55%, 100% 100%);
   }
   .hint {
-    margin-top: 22px;
-    font-family: var(--dot);
-    font-size: 21px;
-    line-height: 1.6;
-    max-width: 30em;
-    color: rgb(247 244 236 / 0.86);
+    max-width: 44em;
+    margin-top: 28px;
+    font-family: var(--mono);
+    font-size: 15px;
+    line-height: 1.7;
+    color: var(--on-night-soft);
   }
   .password {
     margin-top: 14px;
-    font-size: 21px;
-    color: rgb(247 244 236 / 0.86);
+    font-size: 20px;
+    color: var(--on-night-soft);
   }
-  /* a redaction bar that lifts on hover, focus or press. The bar only goes on once
+  /* A redaction bar that lifts on hover, focus or press. The bar only goes on once
      the script is running (html.ready), so without JavaScript the answer is plain text. */
   .redacted {
     padding: 0 0.15em;
     border: 0;
-    border-radius: 2px;
     background: transparent;
-    color: var(--gilt);
-    font-weight: 800;
+    color: var(--paper);
+    font-weight: 700;
     cursor: pointer;
     transition:
-      background 0.25s,
-      color 0.25s;
+      background 0.2s,
+      color 0.2s;
   }
   html.ready .redacted:not(:hover, :focus-visible, [aria-pressed="true"]) {
-    background: var(--ink);
+    background: var(--paper);
     color: transparent;
   }
-  .sticker {
-    height: auto;
-    border: 8px solid var(--paper);
-    border-radius: 50%;
-    box-shadow: var(--shadow-paper);
-  }
-  .sticker-avatar {
-    position: absolute;
-    width: 200px;
-    right: 10px;
-    bottom: -190px;
-    rotate: 9deg;
-  }
 
-  /* group labels: a manila dossier folder with a numbered index tab */
+  /* a pile's heading is set in type straight onto the desk */
   .label {
-    position: relative;
     width: max-content;
-    max-width: 680px;
-    margin-top: 34px;
-    padding: 20px 36px 22px;
-    border-radius: 3px 12px 6px 6px;
-    background: linear-gradient(180deg, rgb(255 255 255 / 0.18), transparent 40%), var(--manila);
-    filter: drop-shadow(0 6px 8px rgb(4 16 12 / 0.4));
-  }
-  .label::before {
-    content: "";
-    position: absolute;
-    left: 0;
-    bottom: 100%;
-    width: 200px;
-    height: 34px;
-    border-radius: 10px 14px 0 0;
-    background: var(--manila);
+    max-width: 760px;
   }
   .file-no {
-    position: absolute;
-    left: 22px;
-    bottom: calc(100% + 6px);
-    font-family: var(--dot);
-    font-size: 18px;
-    color: var(--ink-soft);
+    display: block;
+    font-family: var(--mono);
+    font-size: 16px;
+    color: var(--red-on-night);
+    letter-spacing: 0.04em;
   }
   .label h2 {
-    font-family: var(--fell);
-    font-weight: 400;
-    font-size: 60px;
-    line-height: 1.05;
+    margin-top: 6px;
+    font-weight: 900;
+    font-size: 76px;
+    line-height: 0.95;
+    letter-spacing: -0.04em;
+    color: var(--paper);
   }
   .label p {
-    margin-top: 6px;
-    font-size: 19px;
-    color: var(--ink-soft);
-    max-width: 32em;
+    margin-top: 14px;
+    max-width: 30em;
+    font-size: 20px;
+    color: var(--on-night-soft);
     text-wrap: pretty;
   }
 
-  /* a printed sheet */
+  /* a proof: heavy uncoated stock, trimmed at the crop marks */
   .sheet {
+    --crop: var(--ink-soft);
     position: relative;
-    background: var(--paper);
-    border-radius: 5px;
-    padding: 14px 14px 20px;
-    box-shadow: var(--shadow-paper);
+    padding: 30px 30px 32px;
+    color: var(--ink);
+    background:
+      /* crop marks at each trim corner, 16px in from the edge */
+      linear-gradient(var(--crop), var(--crop)) 0 16px / 11px 1px no-repeat,
+      linear-gradient(var(--crop), var(--crop)) 16px 0 / 1px 11px no-repeat,
+      linear-gradient(var(--crop), var(--crop)) 100% 16px / 11px 1px no-repeat,
+      linear-gradient(var(--crop), var(--crop)) calc(100% - 16px) 0 / 1px 11px no-repeat,
+      linear-gradient(var(--crop), var(--crop)) 0 calc(100% - 16px) / 11px 1px no-repeat,
+      linear-gradient(var(--crop), var(--crop)) 16px 100% / 1px 11px no-repeat,
+      linear-gradient(var(--crop), var(--crop)) 100% calc(100% - 16px) / 11px 1px no-repeat,
+      linear-gradient(var(--crop), var(--crop)) calc(100% - 16px) 100% / 1px 11px no-repeat,
+      url("/tex/paper.webp") 0 0 / 512px,
+      var(--paper);
+    box-shadow: var(--shadow-sheet);
     transition:
       box-shadow 0.25s,
       transform 0.25s;
   }
   .sheet-screen {
-    width: 600px;
+    width: 640px;
   }
   .screen {
     position: relative;
     aspect-ratio: 16 / 10;
-    border-radius: 3px;
     overflow: hidden;
-    background: var(--paper-cool);
-    outline: 1px solid rgb(0 0 0 / 0.08);
+    background: var(--paper-shade);
+    outline: 1px solid rgb(0 0 0 / 0.14);
   }
   .screen img {
     width: 100%;
@@ -329,14 +239,15 @@
     height: 100%;
     font-weight: 900;
     font-size: 48px;
-    color: var(--desk);
+    color: var(--ink-soft);
   }
+
   /* a wax seal over the screenshot; breaking it opens the live site */
   .try {
     position: absolute;
-    right: 22px;
-    bottom: 34px;
-    width: 116px;
+    right: 24px;
+    bottom: 36px;
+    width: 112px;
     aspect-ratio: 1;
     padding: 0;
     border: 0;
@@ -344,7 +255,7 @@
     background: none;
     rotate: -10deg;
     cursor: pointer;
-    filter: drop-shadow(0 8px 8px rgb(60 6 8 / 0.5));
+    filter: drop-shadow(0 2px 1px rgb(40 4 6 / 0.55)) drop-shadow(0 10px 10px rgb(0 0 0 / 0.45));
     transition:
       scale 0.2s,
       rotate 0.2s;
@@ -374,18 +285,16 @@
   }
   .seal-text {
     position: absolute;
-    top: 92%;
+    top: 94%;
     left: 50%;
     translate: -50% 0;
-    rotate: 8deg;
-    padding: 3px 10px 4px;
-    border-radius: 3px;
-    background: var(--manila);
+    padding: 3px 8px 4px;
+    background: var(--paper);
     color: var(--ink);
-    font-family: var(--dot);
-    font-size: 14px;
+    font-family: var(--mono);
+    font-size: 11px;
     white-space: nowrap;
-    box-shadow: 0 3px 6px -2px rgb(4 16 12 / 0.5);
+    box-shadow: 0 2px 4px -1px rgb(0 0 0 / 0.5);
     transition: opacity 0.2s;
   }
   .try.broken .seal-l {
@@ -403,13 +312,13 @@
   }
 
   .caption {
-    padding: 16px 6px 0;
+    padding: 22px 2px 0;
   }
   .caption h3 {
-    font-weight: 900;
-    font-size: 30px;
-    line-height: 1.1;
-    letter-spacing: -0.015em;
+    font-weight: 800;
+    font-size: 34px;
+    line-height: 1.05;
+    letter-spacing: -0.03em;
   }
   .caption h3 a {
     text-decoration: none;
@@ -418,7 +327,8 @@
     text-decoration: underline;
   }
   .desc {
-    margin-top: 8px;
+    margin-top: 10px;
+    max-width: 34em;
     font-size: 17px;
     color: var(--ink-soft);
     text-wrap: pretty;
@@ -426,158 +336,81 @@
   .meta {
     display: flex;
     flex-wrap: wrap;
-    gap: 4px 18px;
-    margin-top: 12px;
-    font-family: var(--dot);
-    font-size: 14px;
-    color: var(--desk-deep);
+    gap: 4px 20px;
+    margin-top: 14px;
+    font-family: var(--mono);
+    font-size: 12px;
+    color: var(--ink-soft);
   }
   .actions {
     display: flex;
     flex-wrap: wrap;
-    gap: 8px;
+    gap: 6px 22px;
     margin-top: 16px;
   }
+  /* links on a printed sheet are set as type, not as buttons */
   .btn {
     display: inline-flex;
     align-items: center;
-    min-height: 40px;
-    padding: 6px 16px;
-    border: 2px solid var(--ink);
-    border-radius: 999px;
-    background: var(--paper);
-    font-weight: 800;
+    min-height: 28px;
+    font-weight: 700;
     font-size: 15px;
-    text-decoration: none;
-    transition:
-      background 0.15s,
-      color 0.15s;
+    text-decoration: underline;
+    text-decoration-thickness: 1.5px;
+    text-underline-offset: 5px;
   }
   .btn:hover {
-    background: var(--ink);
-    color: var(--paper);
-  }
-  .btn-ink {
-    background: var(--ink);
-    color: var(--paper);
-  }
-  .btn-ink:hover {
-    background: var(--wax);
-    border-color: var(--wax);
+    color: var(--red);
   }
   .btn-wax {
-    background: var(--wax);
-    border-color: var(--wax);
-    color: var(--paper);
-  }
-  .btn-wax:hover {
-    background: var(--wax-deep);
-    border-color: var(--wax-deep);
+    color: var(--red);
   }
 
-  /* the v0 rubber stamp, inked on every sheet */
-  .sprite {
-    position: absolute;
-  }
+  /* the PROOF stamp: red ink, pressed unevenly */
   .stamp {
     position: absolute;
-    right: 18px;
-    bottom: 16px;
-    width: 104px;
-    height: 104px;
-    color: var(--wax);
-    opacity: 0.82;
+    right: 30px;
+    bottom: 28px;
+    width: 150px;
+    height: 66px;
+    color: var(--red);
+    opacity: 0.86;
     mix-blend-mode: multiply;
-    font-family: var(--round);
+    font-family: var(--sans);
     pointer-events: none;
+    mask-image: url("/tex/ink.webp");
+    mask-size: 100% 100%;
   }
   .stamp-0 {
-    rotate: -14deg;
+    rotate: -9deg;
   }
   .stamp-1 {
-    rotate: 9deg;
+    rotate: 6deg;
+    right: 44px;
   }
   .stamp-2 {
-    rotate: -4deg;
-    right: 30px;
+    rotate: -3deg;
+    bottom: 36px;
+  }
+  /* on a screenshot sheet the stamp lands across the bottom-left edge of the print,
+     clear of the caption and its links at any width */
+  .sheet-screen {
+    --pad: 30px;
+    container-type: inline-size;
+  }
+  .sheet-screen .stamp {
+    left: calc(var(--pad) - 10px);
+    right: auto;
+    top: calc(var(--pad) + (100cqi - 2 * var(--pad)) * 0.625 - 40px);
+    bottom: auto;
   }
   .sheet-board .stamp,
   .sheet-book .stamp {
     bottom: auto;
-    top: calc(100% - 120px);
+    top: calc(100% - 104px);
   }
   .sheet-receipt .stamp {
-    bottom: 64px;
-  }
-
-  /* what holds each sheet down: a wax seal, washi tape with hearts, or a brass clip */
-  .fix {
-    position: absolute;
-    z-index: 2;
-    pointer-events: none;
-  }
-  .fix-seal {
-    top: -28px;
-    left: calc(50% - 34px);
-    width: 68px;
-    height: 68px;
-    rotate: 12deg;
-    filter: drop-shadow(0 3px 3px rgb(40 4 6 / 0.45));
-  }
-  .tape {
-    top: -6px;
-    left: -40px;
-    width: 132px;
-    height: 34px;
-    background:
-      var(--hearts) 4px 6px / 26px 22px,
-      var(--blush);
-    opacity: 0.92;
-    rotate: -38deg;
-    clip-path: var(--zigzag);
-  }
-  .fix-clip {
-    top: -30px;
-    left: 40px;
-    width: 30px;
-    height: 82px;
-    rotate: -5deg;
-    filter: drop-shadow(1px 3px 2px rgb(4 16 12 / 0.45));
-  }
-
-  /* red string between related sheets, pinned with brass */
-  .strings {
-    display: none;
-  }
-  html.desk .strings {
-    display: block;
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 0;
-    width: 1px;
-    height: 1px;
-    overflow: visible;
-    pointer-events: none;
-  }
-  html.desk .strings.pins {
-    z-index: 4;
-  }
-  html.desk .sheet {
-    z-index: 1;
-  }
-  .strings .thread {
-    fill: none;
-    stroke: var(--wax);
-    stroke-width: 3.5;
-    stroke-linecap: round;
-    filter: drop-shadow(0 6px 3px rgb(4 16 12 / 0.45));
-  }
-  .strings .thread-shine {
-    fill: none;
-    stroke: var(--wax-light);
-    stroke-width: 1;
-    opacity: 0.7;
+    bottom: 70px;
   }
 
   /* README games, drawn from the live README */
@@ -585,7 +418,6 @@
     width: min-content;
   }
   .board {
-    border-radius: 3px;
     padding: 20px;
     container-type: inline-size;
   }
@@ -608,7 +440,6 @@
     display: flex;
     justify-content: center;
     flex-wrap: wrap;
-    gap: 0;
   }
   .b-row a,
   .b-row img {
@@ -627,19 +458,18 @@
   .b-text {
     margin-top: 8px;
     font-size: 14px;
-    line-height: 1.5;
     text-align: center;
     text-wrap: balance;
   }
   .b-text a {
-    font-weight: 800;
+    font-weight: 700;
   }
   .b-table {
     width: 100%;
     margin-top: 12px;
     border-collapse: collapse;
-    font-family: var(--dot);
-    font-size: 13px;
+    font-family: var(--mono);
+    font-size: 11.5px;
   }
   .b-table td {
     padding: 4px 6px;
@@ -649,17 +479,15 @@
     text-align: right;
   }
 
-  /* guestbook: a ruled notebook page */
+  /* guestbook: a ruled ledger page */
   .sheet-book {
-    width: 540px;
+    width: 560px;
   }
   .book {
     padding: 22px 22px 24px 64px;
-    border-radius: 3px;
     background:
-      linear-gradient(90deg, transparent 46px, rgb(179 39 42 / 0.5) 46px 48px, transparent 48px),
-      repeating-linear-gradient(transparent 0 35px, #b9d0dc 35px 36px) 0 22px / 100% 36px repeat-y,
-      var(--paper);
+      linear-gradient(90deg, transparent 46px, rgb(179 39 42 / 0.55) 46px 47px, transparent 47px),
+      repeating-linear-gradient(transparent 0 35px, rgb(20 18 16 / 0.16) 35px 36px) 0 22px / 100% 36px repeat-y;
   }
   .book-lines li {
     display: grid;
@@ -669,12 +497,12 @@
     line-height: 36px;
   }
   .book-lines time {
-    font-family: var(--dot);
-    font-size: 13px;
-    color: var(--desk-deep);
+    font-family: var(--mono);
+    font-size: 11.5px;
+    color: var(--ink-soft);
   }
   .book-lines .who {
-    font-weight: 800;
+    font-weight: 700;
     text-decoration: none;
   }
   .book-lines .msg {
@@ -692,32 +520,31 @@
 
   /* dev.to: a till receipt */
   .sheet-receipt {
-    width: 420px;
-    padding-bottom: 14px;
+    width: 440px;
   }
   .receipt {
-    padding: 22px 18px 18px;
-    font-family: var(--dot);
-    font-size: 15px;
-    line-height: 1.45;
-    border-bottom: 2px dashed rgb(0 0 0 / 0.25);
+    padding: 8px 6px 18px;
+    font-family: var(--mono);
+    font-size: 13px;
+    line-height: 1.5;
+    border-bottom: 1.5px dashed rgb(20 18 16 / 0.3);
   }
   .r-head {
     display: grid;
     justify-items: center;
     padding-bottom: 14px;
-    border-bottom: 2px dashed rgb(0 0 0 / 0.25);
+    border-bottom: 1.5px dashed rgb(20 18 16 / 0.3);
   }
   .r-head strong {
-    font-size: 22px;
-    font-weight: 400;
+    font-size: 18px;
+    font-weight: 500;
   }
   .r-lines li {
     display: grid;
     grid-template-columns: 1fr auto;
     gap: 2px 14px;
     padding-block: 12px;
-    border-bottom: 1px dotted rgb(0 0 0 / 0.3);
+    border-bottom: 1px dotted rgb(20 18 16 / 0.3);
   }
   .r-lines a {
     text-decoration: none;
@@ -730,20 +557,20 @@
   }
   .r-date {
     grid-column: 1 / -1;
-    font-size: 12px;
-    color: var(--desk-deep);
+    font-size: 11px;
+    color: var(--ink-soft);
   }
   .r-total {
     display: flex;
     justify-content: space-between;
     padding-top: 14px;
-    font-size: 19px;
+    font-size: 16px;
   }
   .r-thanks {
     margin-top: 16px;
     text-align: center;
-    font-size: 13px;
-    color: var(--desk-deep);
+    font-size: 11px;
+    color: var(--ink-soft);
   }
 }
 
@@ -762,39 +589,45 @@
     overflow: hidden;
     touch-action: none;
     cursor: grab;
-    --gs: 40px;
-    background-color: var(--desk);
-    background-image:
-      linear-gradient(var(--desk-line-major) 1px, transparent 1px),
-      linear-gradient(90deg, var(--desk-line-major) 1px, transparent 1px),
-      linear-gradient(var(--desk-line) 1px, transparent 1px),
-      linear-gradient(90deg, var(--desk-line) 1px, transparent 1px), var(--grain);
-    background-size:
-      calc(var(--gs) * 5) calc(var(--gs) * 5),
-      calc(var(--gs) * 5) calc(var(--gs) * 5),
-      var(--gs) var(--gs),
-      var(--gs) var(--gs),
-      240px 240px;
-    background-position:
-      var(--gx, 0) var(--gy, 0),
-      var(--gx, 0) var(--gy, 0),
-      var(--gx, 0) var(--gy, 0),
-      var(--gx, 0) var(--gy, 0),
-      0 0;
-  }
-  /* a gold-tooled border and a vignette, like the edge of a lodge desk */
+    background: var(--night);
+  }
+  /* the black stock, one tile larger than the screen on every side, translated with the camera */
+  .surface {
+    display: none;
+  }
+  html.desk .surface {
+    display: block;
+    position: absolute;
+    z-index: -1;
+    top: 0;
+    left: 0;
+    width: calc(100% + 1024px);
+    height: calc(100% + 1024px);
+    background: url("/tex/stock.webp") 0 0 / 512px;
+    will-change: transform;
+    pointer-events: none;
+  }
+  /* the lamp: a warm pool on the surface under the world, and falloff over it.
+     Both are fixed and painted once, so panning never repaints them. */
+  html.desk .desk::before,
   html.desk .desk::after {
     content: "";
     position: fixed;
+    inset: 0;
     pointer-events: none;
+  }
+  html.desk .desk::before {
+    background: radial-gradient(ellipse 58% 62% at 50% 44%, rgb(255 214 160 / 0.1), transparent 70%);
+  }
+  html.desk .desk::after {
     z-index: 5;
-    inset: var(--ruler) 0 0 var(--ruler);
-    box-shadow:
-      inset 0 0 0 9px rgb(18 41 31 / 0.75),
-      inset 0 0 0 10px rgb(201 164 92 / 0.6),
-      inset 0 0 0 14px rgb(18 41 31 / 0.35),
-      inset 0 0 0 15px rgb(201 164 92 / 0.32),
-      inset 0 0 140px 20px rgb(2 10 7 / 0.5);
+    background: radial-gradient(
+      ellipse 72% 78% at 50% 44%,
+      rgb(255 220 170 / 0.05) 0%,
+      transparent 42%,
+      rgb(6 5 4 / 0.5) 72%,
+      rgb(6 5 4 / 0.86) 100%
+    );
   }
   html.desk .desk.dragging {
     cursor: grabbing;
@@ -810,7 +643,7 @@
     left: 0;
     transform-origin: 0 0;
     opacity: 0;
-    transition: opacity 0.5s;
+    transition: opacity 0.6s;
   }
   html.desk.ready .world {
     opacity: 1;
@@ -828,19 +661,16 @@
   }
   html.desk .sheet:hover:not(.lifted) {
     box-shadow: var(--shadow-lift);
-    transform: translateY(-6px);
-  }
-  html.desk .home {
-    pointer-events: auto;
+    transform: translateY(-4px);
   }
   html.desk .hint-list,
   html.list .hint-desk {
     display: none;
   }
-  /* zoomed far out, the group labels grow so the desk still reads like a map */
+  /* zoomed far out, the pile headings grow so the desk still reads like a map */
   html.desk .label {
     transform-origin: 0 100%;
-    scale: clamp(1, calc(0.42 / var(--z, 1)), 2.4);
+    scale: clamp(1, calc(0.4 / var(--z, 1)), 2.2);
     z-index: 3;
   }
   html.desk .sheet.lifted {
@@ -855,7 +685,7 @@
     position: absolute;
     inset: 0;
     z-index: 10;
-    background: rgb(6 18 13 / 0.68);
+    background: rgb(6 5 4 / 0.72);
     animation: fade 0.3s both;
   }
   @keyframes fade {
@@ -865,115 +695,15 @@
   }
 }
 
-/* ---------- list view (also what you get without JavaScript) ---------- */
-
-@layer list {
-  html.list body {
-    background:
-      var(--grain) 0 0 / 240px 240px,
-      radial-gradient(120% 80% at 50% 0%, #24503f, var(--desk) 60%, var(--desk-deep));
-    background-attachment: fixed;
-  }
-  html.list .world {
-    max-width: 1280px;
-    margin-inline: auto;
-    padding: 112px 24px 140px;
-  }
-  html.list .home {
-    position: relative;
-    width: auto;
-    grid-template-columns: minmax(180px, 360px) 1fr;
-  }
-  html.list .home-seal {
-    width: 100%;
-  }
-  html.list .sticker-avatar {
-    right: 0;
-    bottom: -100px;
-    width: 120px;
-  }
-  html.list .shelf {
-    margin-top: 120px;
-  }
-  html.list .pile {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr));
-    align-items: start;
-    gap: 48px 36px;
-    margin-top: 36px;
-  }
-  html.list .sheet {
-    width: auto;
-    max-width: 100%;
-  }
-  html.list .board-blackjack,
-  html.list .board-shogi {
-    width: auto;
-  }
-  html.list .try,
-  html.list .ruler,
-  html.list .tray,
-  html.list .minimap {
-    display: none;
-  }
-  html.list .label {
-    max-width: 100%;
-  }
-  @media (max-width: 760px) {
-    html.list .world {
-      padding-top: 88px;
-    }
-    html.list .home {
-      grid-template-columns: 1fr;
-      justify-items: start;
-      gap: 12px;
-    }
-    html.list .home-seal {
-      width: 100%;
-    }
-    html.list .home h1 {
-      font-size: clamp(64px, 20vw, 120px);
-    }
-    html.list .bubble {
-      font-size: 19px;
-    }
-    html.list .bubble::before {
-      left: 34px;
-      top: -20px;
-      clip-path: polygon(0 100%, 30% 0, 100% 100%);
-    }
-    html.list .sticker-avatar {
-      bottom: auto;
-      top: 0;
-      width: 96px;
-    }
-    html.list .label h2 {
-      font-size: 40px;
-    }
-    html.list .motto {
-      font-size: 22px;
-    }
-    html.list .crest {
-      width: min(240px, 60vw);
-    }
-    html.list .label {
-      padding-inline: 22px;
-    }
-    html.list .caption h3 {
-      font-size: 26px;
-    }
-  }
-}
-
-/* ---------- heads-up display ---------- */
+/* ---------- heads-up display: set in the same type, no chrome ---------- */
 
 @layer hud {
   .hud-top {
     position: fixed;
     z-index: 40;
-    top: calc(var(--ruler) + 8px + env(safe-area-inset-top, 0px));
-    left: calc(var(--ruler) + 12px);
-    right: 14px;
+    top: calc(18px + env(safe-area-inset-top, 0px));
+    left: 22px;
+    right: 22px;
     display: flex;
     align-items: center;
     justify-content: space-between;
@@ -983,106 +713,82 @@
   .hud-top > * {
     pointer-events: auto;
   }
-  html.list .hud-top {
-    top: calc(14px + env(safe-area-inset-top, 0px));
-    left: 18px;
-  }
   .brand {
     display: inline-flex;
     align-items: center;
-    gap: 10px;
+    gap: 12px;
     color: var(--paper);
-    font-weight: 900;
-    font-size: 22px;
+    font-weight: 800;
+    font-size: 20px;
     letter-spacing: -0.02em;
     text-decoration: none;
   }
   .brand img {
-    width: 44px;
+    width: 40px;
     height: auto;
-    filter: drop-shadow(0 2px 3px rgb(4 16 12 / 0.4));
   }
   .hud-links {
     display: flex;
-    gap: 8px;
+    gap: 22px;
   }
   .pill {
     display: inline-flex;
     align-items: center;
-    min-height: 38px;
-    padding: 6px 16px;
+    min-height: 32px;
+    padding: 0;
     border: 0;
-    border-radius: 999px;
-    background: var(--paper);
-    color: var(--ink);
-    font-weight: 800;
+    background: none;
+    color: var(--on-night);
+    font-weight: 600;
     font-size: 14px;
-    text-decoration: none;
+    text-decoration: underline;
+    text-decoration-color: var(--on-night-faint);
+    text-decoration-thickness: 1.5px;
+    text-underline-offset: 6px;
     cursor: pointer;
-    box-shadow: 0 4px 10px -4px rgb(4 16 12 / 0.5);
   }
   .pill:hover {
-    background: var(--ink);
     color: var(--paper);
+    text-decoration-color: var(--red);
   }
   .pill-wax {
-    background: var(--wax);
+    padding: 6px 14px;
+    background: var(--red);
     color: var(--paper);
+    text-decoration: none;
   }
-
-  .ruler {
-    position: fixed;
-    z-index: 30;
-    top: 0;
-    left: 0;
-    pointer-events: none;
-  }
-  .ruler-x {
-    width: 100%;
-    height: var(--ruler);
-    background: linear-gradient(180deg, #e3c98b, var(--brass) 55%, #8a6a3a);
-    border-bottom: 1px solid #5c4421;
-  }
-  .ruler-y {
-    width: var(--ruler);
-    height: 100%;
-    background: linear-gradient(90deg, #e3c98b, var(--brass) 55%, #8a6a3a);
-    border-right: 1px solid #5c4421;
+  .pill-wax:hover {
+    background: var(--red-deep);
   }
 
   .tray {
     position: fixed;
     z-index: 40;
     left: 50%;
-    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
+    bottom: calc(18px + env(safe-area-inset-bottom, 0px));
     translate: -50% 0;
     display: flex;
     align-items: center;
-    gap: 6px;
+    gap: 4px;
     max-width: calc(100vw - 24px);
-    padding: 6px;
-    border-radius: 999px;
-    background: var(--ink);
-    box-shadow:
-      inset 0 0 0 1px rgb(201 164 92 / 0.45),
-      0 14px 30px -10px rgb(0 0 0 / 0.55);
+    padding: 4px;
+    border: 1px solid var(--on-night-faint);
+    background: rgb(15 14 13 / 0.88);
   }
   .tray button {
     flex: none;
-    min-height: 40px;
+    min-height: 38px;
     padding: 6px 14px;
     border: 0;
-    border-radius: 999px;
     background: transparent;
-    color: var(--paper);
-    font-weight: 800;
+    color: var(--on-night-soft);
+    font-weight: 600;
     font-size: 14px;
     white-space: nowrap;
     cursor: pointer;
   }
   .tray button:hover {
-    background: rgb(201 164 92 / 0.18);
-    color: var(--gilt);
+    color: var(--paper);
   }
   .tray-go {
     display: flex;
@@ -1094,75 +800,68 @@
     display: flex;
     align-items: center;
     flex: none;
-    padding-left: 6px;
-    border-left: 1px solid rgb(255 255 255 / 0.25);
+    padding-left: 4px;
+    border-left: 1px solid var(--on-night-faint);
   }
   .tray-zoom button {
     display: grid;
     place-items: center;
-    width: 40px;
+    width: 38px;
     padding: 0;
   }
   .tray-zoom svg {
-    width: 16px;
-    height: 16px;
+    width: 14px;
+    height: 14px;
     fill: none;
     stroke: currentColor;
-    stroke-width: 2.4;
-    stroke-linecap: round;
+    stroke-width: 2;
   }
   .zoom-read {
-    min-width: 4.2ch;
-    color: var(--paper);
-    font-family: var(--dot);
-    font-size: 14px;
+    min-width: 5ch;
+    color: var(--on-night-soft);
+    font-family: var(--mono);
+    font-size: 11.5px;
     text-align: center;
   }
 
   .minimap {
     position: fixed;
     z-index: 40;
-    right: 16px;
-    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
-    width: 196px;
-    height: 132px;
+    right: 18px;
+    bottom: calc(18px + env(safe-area-inset-bottom, 0px));
+    width: 180px;
+    height: 120px;
     padding: 8px;
-    border: 0;
-    border-radius: 16px;
-    background: var(--desk-deep);
-    box-shadow:
-      inset 0 0 0 1px rgb(201 164 92 / 0.5),
-      0 10px 24px -10px rgb(0 0 0 / 0.5);
+    border: 1px solid var(--on-night-faint);
+    background: rgb(15 14 13 / 0.88);
     cursor: pointer;
   }
   .minimap svg {
     width: 100%;
     height: 100%;
     overflow: hidden;
-    border-radius: 10px;
   }
   .m-sheet {
-    fill: rgb(255 255 255 / 0.8);
+    fill: rgb(241 236 225 / 0.6);
   }
   .m-label {
-    fill: var(--manila);
+    fill: rgb(179 39 42 / 0.75);
   }
   .m-home {
-    fill: rgb(255 255 255 / 0.35);
+    fill: rgb(241 236 225 / 0.25);
   }
   .m-view {
-    fill: rgb(179 39 42 / 0.14);
-    stroke: var(--wax);
-    stroke-width: 2.5;
+    fill: none;
+    stroke: var(--paper);
+    stroke-width: 1.5;
     vector-effect: non-scaling-stroke;
   }
 
   .live {
     position: fixed;
     z-index: 60;
-    border-radius: 3px;
     background: var(--paper);
-    box-shadow: 0 30px 80px -20px rgb(0 0 0 / 0.6);
+    box-shadow: 0 30px 80px -20px rgb(0 0 0 / 0.8);
   }
   .live.growing {
     transition:
@@ -1170,10 +869,6 @@
       width 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
       height 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
   }
-  .live-bar .pill {
-    flex: none;
-    white-space: nowrap;
-  }
   .live-bar {
     position: absolute;
     left: 0;
@@ -1181,15 +876,19 @@
     bottom: 100%;
     display: flex;
     align-items: center;
-    gap: 8px;
-    padding-bottom: 10px;
+    gap: 22px;
+    padding-bottom: 12px;
+  }
+  .live-bar .pill {
+    flex: none;
+    white-space: nowrap;
   }
   .live-title {
     margin-right: auto;
     color: var(--paper);
-    font-weight: 900;
+    font-weight: 800;
     font-size: 22px;
-    letter-spacing: -0.01em;
+    letter-spacing: -0.02em;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -1199,7 +898,6 @@
     width: 100%;
     height: 100%;
     border: 0;
-    border-radius: inherit;
     opacity: 0;
     transition: opacity 0.35s;
   }
@@ -1233,12 +931,85 @@
   }
 }
 
-/* High-contrast modes drop author backgrounds, which would leave the gilt-foil title invisible. */
-@media (forced-colors: active) {
-  .home h1 {
-    background: none;
-    color: CanvasText;
+/* ---------- list view (also what you get without JavaScript) ---------- */
+
+@layer list {
+  html.list .hud-top {
+    position: absolute;
+  }
+  html.list .world {
+    max-width: 1320px;
+    margin-inline: auto;
+    padding: 120px 24px 140px;
+  }
+  html.list .home {
+    position: relative;
+    width: auto;
+    grid-template-columns: minmax(180px, 380px) 1fr;
+    gap: 48px;
+  }
+  html.list .home-seal {
+    width: 100%;
   }
+  html.list .home h1 {
+    font-size: clamp(88px, 15vw, 200px);
+  }
+  html.list .lede {
+    font-size: clamp(22px, 2.6vw, 34px);
+  }
+  html.list .shelf {
+    margin-top: 140px;
+  }
+  html.list .label h2 {
+    font-size: clamp(44px, 6vw, 72px);
+  }
+  html.list .pile {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(min(100%, 400px), 1fr));
+    align-items: start;
+    gap: 48px 36px;
+    margin-top: 40px;
+  }
+  html.list .sheet {
+    width: auto;
+    max-width: 100%;
+  }
+  html.list .board-blackjack,
+  html.list .board-shogi {
+    width: auto;
+  }
+  html.list .try,
+  html.list .tray,
+  html.list .minimap {
+    display: none;
+  }
+  html.list .label {
+    max-width: 100%;
+  }
+  @media (max-width: 760px) {
+    html.list .world {
+      padding-top: 96px;
+    }
+    html.list .home {
+      grid-template-columns: 1fr;
+      justify-items: start;
+      gap: 20px;
+    }
+    html.list .home-seal {
+      width: min(240px, 60vw);
+    }
+    html.list .sheet {
+      --pad: 20px;
+      padding: 22px 20px 24px;
+    }
+    html.list .caption h3 {
+      font-size: 28px;
+    }
+  }
+}
+
+/* High-contrast modes drop author backgrounds; keep the redaction readable. */
+@media (forced-colors: active) {
   .redacted {
     color: CanvasText;
   }