@vibecook/ice 0.16.0 → 0.17.0

package/dist/{chunk-REJTEK3V.js → chunk-M2HUDENL.js}

@@ -82,7 +82,7 @@ import {
   spring,
   themeFrom,
   tilted
-} from "./chunk-BH5AFWJX.js";
+} from "./chunk-VZEZ7CYW.js";
 import {
   BLEND_OVER,
   bindGroup,
@@ -169,7 +169,7 @@ import {
   trayTakeProps,
   widgetSpawnInits,
   widgetTypeFor
-} from "./chunk-Y7K6CHSF.js";
+} from "./chunk-LAZIY3J7.js";
 import {
   clientToScreen,
   cubicBezierEase,
@@ -626,13 +626,13 @@ var DRAWER = {
   /**
    * The HEADER (design-018 R4 — James, 2026-09-28: "make the fade stronger and more gap, and design the filters nicely at that empty
    * safe top space instead"): a CLEAR band this high under the face's top edge (inside the arris) where what hangs on the board — the
-   * specimens, their shadows, their accessories and their tags — and the holes are wholly gone: the plain face, on which the bar lays
+   * specimens, their shadows and their tags — and the holes are wholly gone: the plain face, on which the bar lays
    * its category chips as label tape (`<TrayBar>`, @ice/react — the handle's `anchor().drawer.header`). The face's portal clip starts
    * this far down, so nothing of the content is even drawn above it.
    */
   header: 48,
   /**
-   * The CONTENT's fade under the header (design-018 §4, R4): the specimens, their shadows, their accessories, their tags and the holes
+   * The CONTENT's fade under the header (design-018 §4, R4): the specimens, their shadows, their tags and the holes
    * fade in over this band (CSS px, 0.8 pitch) — `smoothstep(top + header, top + header + fade, y)`, `top` the face's top edge — the
    * feather on the face's portal clip (R1's 28 px band at the edge itself, stretched and moved down: D-R4.1). The board does not fade.
    */
@@ -783,22 +783,8 @@ var TrayUniforms = defineStruct("TrayUniforms", [
   // …its 210 (bump) · 42 · 105 (flecks)…
   ["keepEdge", "vec4f"],
   // …and the punched fibre's 9 · 18 · 36
-  ["accessory", "vec4f"],
-  // K5a: the accessories' powder coat, linear, and their shadows' strength on the board
   ["fade", "vec4f"]
-  // the content's fade under the header (design-018 §4, R4): its band F, the clear header H above it, CSS px; a host's foot inset (I21; 0 none); —
-]);
-var TrayAccessoryStruct = defineStruct("TrayAccessory", [
-  ["box", "vec4f"],
-  // the quad: x0, y0, x1, y1
-  ["kind", "vec4f"],
-  // the accessory (0 hook · 1 shelf · 2 clip · 3 rail), its pegs, how far it stands off the board (px), —
-  ["rect", "vec4f"],
-  // the specimen: x0, y0, x1, y1
-  ["pegs0", "vec4f"],
-  // pegs 0 and 1: x, y
-  ["pegs1", "vec4f"]
-  // pegs 2 and 3
+  // the content's fade under the header (design-018 §4, R4): its band F, the clear header H above it, CSS px; a host's foot inset (I21; 0 none); its fade band, CSS px
 ]);
 
 // ../desk/src/tray/shaders.ts
@@ -806,7 +792,7 @@ var TRAY_SHADER_FILES = { tray: "tray/tray.wgsl", trayPass: "tray/tray-pass.wgsl
 function trayShaders(text2) {
   const t = text2(TRAY_SHADER_FILES);
   return kitWgsl(["view", "sdf", "light"], {
-    structs: [TrayUniforms, TrayAccessoryStruct],
+    structs: [TrayUniforms],
     modules: [{ label: "tray/tray.wgsl", text: t.tray }],
     entry: { label: "tray/tray-pass.wgsl", text: t.trayPass }
   }, text2);
@@ -1386,6 +1372,40 @@ var HoldPass = class _HoldPass {
   }
 };
 
+// ../desk/src/mat/ruler-regions.ts
+function rulerRegions(view, ruler2, previous) {
+  const { width, height, dpr } = view;
+  const { margin, band: band2, line } = ruler2;
+  if (previous && previous.width === width && previous.height === height && previous.dpr === dpr && previous.margin === margin && previous.band === band2 && previous.line === line) return previous;
+  const w = Math.max(1, Math.round(width * dpr));
+  const h = Math.max(1, Math.round(height * dpr));
+  const pad = line * dpr / 2 + 0.5;
+  const clamp2 = (n, lo, hi) => Math.max(lo, Math.min(hi, n));
+  const left = clamp2(Math.floor(margin * dpr - pad), 0, w);
+  const top = clamp2(Math.floor(margin * dpr - pad), 0, h);
+  const right = clamp2(Math.ceil((width - margin) * dpr + pad), left, w);
+  const bottom = clamp2(Math.ceil((height - margin) * dpr + pad), top, h);
+  const innerLeft = clamp2(Math.ceil((margin + band2) * dpr + pad), left, right);
+  const innerTop = clamp2(Math.ceil((margin + band2) * dpr + pad), top, bottom);
+  const innerRight = clamp2(Math.floor((width - margin) * dpr - pad), innerLeft, right);
+  const innerBottom = clamp2(Math.floor((height - margin) * dpr - pad), innerTop, bottom);
+  const surface2 = [
+    [0, 0, w, top],
+    [0, bottom, w, h - bottom],
+    [0, top, left, bottom - top],
+    [right, top, w - right, bottom - top],
+    [innerLeft, innerTop, innerRight - innerLeft, innerBottom - innerTop]
+  ];
+  const edges = [
+    [left, top, right - left, innerTop - top],
+    [left, innerTop, innerLeft - left, innerBottom - innerTop],
+    [innerRight, innerTop, right - innerRight, innerBottom - innerTop],
+    [left, innerBottom, right - left, bottom - innerBottom]
+  ];
+  const nonempty = (r) => r[2] > 0 && r[3] > 0;
+  return { width, height, dpr, margin, band: band2, line, surface: surface2.filter(nonempty), edges: edges.filter(nonempty) };
+}
+
 // ../desk/src/mat/mat-pass.ts
 var PLATE_NAMES = ["c", "b"];
 var CuttingMat = class _CuttingMat {
@@ -1406,6 +1426,7 @@ var CuttingMat = class _CuttingMat {
   /** The view block as last uploaded (K7a: uploaded only when its bytes moved; a layered kind compares a layer's view by it). */
   sentView = new Uint8Array(MatUniforms.size);
   viewSent = false;
+  ruler = null;
   device;
   shared;
   constructor(device, shared) {
@@ -1585,6 +1606,7 @@ var CuttingMat = class _CuttingMat {
    * wind pass if the silhouette it holds is stale. Returns whether it ran.
    */
   prepare(encoder, view, fadeIn, cfg, frame, present, light = DAY_LIGHT, lit) {
+    this.ruler = cfg.ruler.on ? rulerRegions(view, cfg.ruler, this.ruler) : null;
     const plate = PLATE_NAMES.includes(cfg.gobo.plate) ? cfg.gobo.plate : "c";
     const strength = MAT_GRID.gobo.plates[plate].strength;
     this.uniforms.set(matUniformValues(view, fadeIn, { ...cfg, gobo: { ...cfg.gobo, plate } }, frame, strength, present, light, this.shared.glyphMeta, lit));
@@ -1625,6 +1647,37 @@ var CuttingMat = class _CuttingMat {
     pass.setBindGroup(0, this.matGroup);
     pass.draw(3);
   }
+  /** The mat beneath objects; enabled ruler strips are reserved for the foreground. */
+  drawSurface(pass, clip) {
+    if (!this.ruler) {
+      this.draw(pass);
+      return;
+    }
+    this.drawRegions(pass, this.ruler.surface, clip);
+  }
+  /** The edge bands and frame above every object in this slot, within its portal. */
+  drawRulers(pass, clip) {
+    if (this.ruler) this.drawRegions(pass, this.ruler.edges, clip);
+  }
+  drawRegions(pass, regions, clip) {
+    const [cx, cy, cw, ch] = clip;
+    let bound = false;
+    for (const [rx, ry, rw, rh] of regions) {
+      const x = Math.max(cx, rx);
+      const y = Math.max(cy, ry);
+      const right = Math.min(cx + cw, rx + rw);
+      const bottom = Math.min(cy + ch, ry + rh);
+      if (right <= x || bottom <= y) continue;
+      if (!bound) {
+        pass.setPipeline(this.shared.matPipeline);
+        pass.setBindGroup(0, this.matGroup);
+        bound = true;
+      }
+      pass.setScissorRect(x, y, right - x, bottom - y);
+      pass.draw(3);
+    }
+    if (bound) pass.setScissorRect(cx, cy, cw, ch);
+  }
   /** This slot's buffers; the shared plates go with the last slot standing. */
   dispose() {
     this.uniformBuf.destroy();
@@ -2143,14 +2196,212 @@ var TRAY_LOOK = {
   })(),
   /** The lamp's angular radius, rad. */
   lampSize: TRAY.lampSize,
-  /** K5a: the accessories' powder coat, linear; each accessory's standing-off (pitches); their shadows' strength. */
-  accessory: linear(rgb(TRAY.accessory.css)),
-  accessoryHeight: TRAY.accessory.height,
-  accessoryShadow: TRAY.accessory.shadow,
   /** K5a: a hovered specimen's lift — a share of its kind's hold. */
   hoverLift: TRAY.hoverLift
 };
 
+// ../desk/src/tray/pass.ts
+var BLEND_PREMUL5 = {
+  color: { srcFactor: "one", dstFactor: "one-minus-src-alpha", operation: "add" },
+  alpha: { srcFactor: "one", dstFactor: "one-minus-src-alpha", operation: "add" }
+};
+function pcg(v) {
+  const s = Math.imul(v >>> 0, 747796405) + 2891336453 >>> 0;
+  const w = Math.imul((s >>> (s >>> 28) + 4 ^ s) >>> 0, 277803737) >>> 0;
+  return (w >>> 22 ^ w) >>> 0;
+}
+var HASH_SIZE = 256;
+function hashTexels() {
+  const N = HASH_SIZE;
+  const h = new Uint8Array(N * N);
+  for (let j = 0; j < N; j++) {
+    const r = pcg(j);
+    for (let i = 0; i < N; i++) h[j * N + i] = pcg((i ^ r) >>> 0) >>> 24;
+  }
+  const out = new Uint8Array(N * N * 4);
+  for (let j = 0; j < N; j++) {
+    for (let i = 0; i < N; i++) {
+      const i1 = (i + 1) % N;
+      const j1 = (j + 1) % N;
+      const o = (j * N + i) * 4;
+      out[o] = h[j * N + i];
+      out[o + 1] = h[j * N + i1];
+      out[o + 2] = h[j1 * N + i];
+      out[o + 3] = h[j1 * N + i1];
+    }
+  }
+  return out;
+}
+function keep(fp, F) {
+  const x = Math.min(Math.max((fp * F - 0.25) / 0.25, 0), 1);
+  return 1 - x * x * (3 - 2 * x);
+}
+var TrayPass = class _TrayPass {
+  device;
+  mat;
+  pipeline;
+  /** The VEIL (design-018 rev 5): the plain board laid over everything the drawer holds at its top — its own entries on the same layout. */
+  veilPipeline;
+  layout;
+  sampler;
+  trayBuf;
+  lightBuf;
+  hash;
+  tray = TrayUniforms.alloc(1);
+  light = MatUniforms.alloc(1);
+  sentTray = new Uint8Array(TrayUniforms.size);
+  sentLight = new Uint8Array(MatUniforms.size);
+  sent = false;
+  /** The quads the last prepare laid: 0 while the drawer is shut (p 0) — then it draws nothing. */
+  quads = 0;
+  /** A host's foot inset this frame (I21): the veil lays a second quad, over the foot, in its one draw. */
+  foot = 0;
+  group = null;
+  boundAssets = -1;
+  last = null;
+  constructor(device, mat, pipelines, layout) {
+    this.device = device;
+    this.mat = mat;
+    [this.pipeline, this.veilPipeline] = pipelines;
+    this.layout = layout;
+    this.sampler = device.createSampler({ label: "tray/pegboard/noise", magFilter: "linear", minFilter: "linear", addressModeU: "repeat", addressModeV: "repeat" });
+    this.trayBuf = uniformBuffer(device, TrayUniforms.size, "tray/pegboard/uniforms");
+    this.lightBuf = uniformBuffer(device, MatUniforms.size, "tray/pegboard/light");
+    this.hash = device.createTexture({ label: "tray/pegboard/hash", size: [HASH_SIZE, HASH_SIZE], format: "rgba8unorm", usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST });
+    device.queue.writeTexture({ texture: this.hash }, hashTexels(), { bytesPerRow: HASH_SIZE * 4 }, [HASH_SIZE, HASH_SIZE]);
+  }
+  /** The pipeline on `format`, sampling `mat`'s blue noise (the root's: its assets are every slot's). */
+  static async create(device, format, src, mat) {
+    const module = await compile(device, compose(src));
+    const layout = bindLayout(device, [
+      { binding: 0, stages: ["fragment"], buffer: "uniform" },
+      { binding: 1, stages: ["vertex", "fragment"], buffer: "uniform" },
+      { binding: 2, stages: ["fragment"], texture: "float" },
+      { binding: 3, stages: ["fragment"], sampler: "filtering" },
+      { binding: 4, stages: ["fragment"], texture: "float" }
+    ], "tray/pegboard");
+    const pl = device.createPipelineLayout({ label: "tray/pegboard", bindGroupLayouts: [layout] });
+    const pipelines = await Promise.all([
+      renderPipeline(device, { label: "tray/pegboard", layout: pl, module, format, blend: BLEND_PREMUL5 }),
+      renderPipeline(device, { label: "tray/pegboard/veil", layout: pl, module, format, blend: BLEND_PREMUL5, vertex: "vs_veil", fragment: "fs_veil" })
+    ]);
+    return new _TrayPass(device, mat, pipelines, layout);
+  }
+  /**
+   * Lay the drawer out for this frame and upload what changed (before the frame's pass begins): the view, the theme's light, the
+   * root grid's grade, the frame's noise offset. Returns the quads that will draw: one (the view whole while it dims) — none while
+   * the drawer is shut (p 0: it and its shadows lie below the view — nothing is uploaded, nothing drawn; design-018 §5).
+   */
+  prepare(view, theme, grid, frame, inputs) {
+    const P = DRAWER.pitch;
+    const p = Math.min(Math.max(inputs.p, 0), 1);
+    const rect = drawerRect(view.width, view.height, p);
+    const { rowBase, frac } = carry(inputs.scroll, P);
+    const foot = inputs.foot !== void 0 && inputs.foot > 0 ? inputs.foot : 0;
+    this.foot = foot;
+    if (p <= 0) {
+      this.last = { rect, rowBase, frac, dim: 0, ...foot > 0 ? { foot } : {} };
+      this.quads = 0;
+      return 0;
+    }
+    const L = TRAY_LOOK.lamp;
+    const g = Math.hypot(L[0], L[1]) || 1;
+    const S = DRAWER.shadow.lamp;
+    const Rm = DRAWER.shadow.room;
+    const fp = 1 / (P * view.dpr);
+    const dim = (DRAWER.dim.day + (DRAWER.dim.night - DRAWER.dim.day) * Math.min(Math.max(theme.matLight.night, 0), 1)) * p;
+    const T = TRAY_LOOK;
+    const values = {
+      view: [view.width, view.height, view.dpr, P],
+      rect: [rect.x, rect.y, rect.w, rect.h],
+      rowBase,
+      frac,
+      fp,
+      dim,
+      shape: [DRAWER.radius, DRAWER.arris, DRAWER.inner.alpha, DRAWER.inner.width],
+      hole: [PEG.holeR, PEG.holeHalf, PEG.rimK, PEG.border],
+      depth: [PEG.thick, PEG.gap, PEG.colPhase, PEG.rowPhase],
+      lamp: [L[0], L[1], L[2], T.lampSize],
+      room: [Rm.sigma, Rm.alpha, 0, 0],
+      shadow: [S.sigma, S.alpha, -L[0] / g * S.push, -L[1] / g * S.push],
+      face: [...T.face, 0],
+      faceSrgb: [...T.faceSrgb, 0],
+      edge: [...T.edge, 0],
+      cavity: [T.cavity.edge, T.cavity.heart, T.cavity.width, 0],
+      keepFace: [keep(fp, 6 * Math.sqrt(10)), 0, keep(fp, 85), keep(fp, 190)],
+      // the flecks fade by their cell; their strokes are anti-aliased in the shader (tray.wgsl `peg_flecks`)
+      keepFine: [keep(fp, 210), keep(fp, 42), keep(fp, 105), 0],
+      keepEdge: [keep(fp, 9), keep(fp, 18), keep(fp, 36), 0],
+      fade: [DRAWER.fade, DRAWER.header, foot, Math.max(0, inputs.footFade ?? DRAWER.fade)]
+    };
+    this.tray.set(values);
+    const gobo = grid.mat.gobo;
+    const noise = frame?.noise ?? [0, 0];
+    const light = {
+      gobo: [gobo.opacity, gobo.blurTexels, gobo.shadeMix, gobo.darkFloor],
+      grade: [gobo.saturate, 0, 0, 0],
+      noise: [noise[0], noise[1], 1 / NOISE_SIZE, 0],
+      ...lightValues(theme.matLight)
+    };
+    this.light.set(light);
+    this.upload(this.trayBuf, this.tray.view(), this.sentTray);
+    this.upload(this.lightBuf, this.light.view(), this.sentLight);
+    this.sent = true;
+    this.last = { rect, rowBase, frac, dim, ...foot > 0 ? { foot } : {} };
+    this.quads = 1;
+    return 1;
+  }
+  /** A block to the GPU only when its bytes moved since the last upload (a drawer at rest costs no write). */
+  upload(buf, bytes, sent) {
+    let same = this.sent;
+    for (let i = 0; same && i < bytes.length; i++) if (bytes[i] !== sent[i]) same = false;
+    if (same) return;
+    sent.set(bytes);
+    this.device.queue.writeBuffer(buf, 0, bytes);
+  }
+  /** A pipeline and the group, bound (the group remade when the mat's assets change). */
+  bind(pass, pipeline) {
+    if (this.group === null || this.boundAssets !== this.mat.assetVersion) {
+      this.group = bindGroup(this.device, this.layout, [this.lightBuf, this.trayBuf, this.mat.noiseTexture.createView(), this.sampler, this.hash.createView()], "tray/pegboard");
+      this.boundAssets = this.mat.assetVersion;
+    }
+    pass.setPipeline(pipeline);
+    pass.setBindGroup(0, this.group);
+  }
+  /**
+   * The drawer UNDER its specimens into the open pass — over everything drawn so far (the caller left the scissor on the whole view):
+   * the dim, the drawer's shadows, and the board to its edge.
+   */
+  draw(pass) {
+    if (this.quads === 0) return;
+    pass.pushDebugGroup("tray/pegboard");
+    this.bind(pass, this.pipeline);
+    pass.draw(6, 1, 0, 0);
+    pass.popDebugGroup();
+  }
+  /**
+   * THE VEIL (design-018 rev 5) — LAST, over everything the drawer holds (the caller left the scissor on the whole view): the plain board
+   * whole in the header and fading out over its ramp, so what hangs there and the holes behind it fade into the board together — a
+   * specimen never turns see-through over a hole. One quad — and with a host's foot (I21) a second, over the foot, in the same draw.
+   */
+  drawVeil(pass) {
+    if (this.quads === 0) return;
+    pass.pushDebugGroup("tray/pegboard/veil");
+    this.bind(pass, this.veilPipeline);
+    pass.draw(this.foot > 0 ? 12 : 6, 1, 0, 0);
+    pass.popDebugGroup();
+  }
+  /** What the last prepare laid (a rig's witness). */
+  get laid() {
+    return this.last;
+  }
+  dispose() {
+    this.trayBuf.destroy();
+    this.lightBuf.destroy();
+    this.hash.destroy();
+  }
+};
+
 // ../desk/src/tray/carry.ts
 var CARRY = {
   /** The copy at its full lift is this much larger than its specimen, about the grab point. */
@@ -2385,8 +2636,6 @@ function specimenFrames(specimens, drawn, env) {
     };
     const record = recordOf(s.kind, ctx, env.faults);
     if (record === void 0) continue;
-    const hx = x0 + s.rect.w / 2;
-    const hy = s.accessory === "shelf" ? y0 + s.rect.h : y0;
     out.push({
       type: s.type,
       kind: s.kind.name,
@@ -2396,53 +2645,11 @@ function specimenFrames(specimens, drawn, env) {
       grid,
       screen: { x0, y0, x1: x0 + s.rect.w, y1: y0 + s.rect.h },
       object: { x0: drawn.rect.x + fit.x, y0: drawn.rect.y + fit.y - drawn.scroll, x1: drawn.rect.x + fit.x + fit.w, y1: drawn.rect.y + fit.y + fit.h - drawn.scroll },
-      pegs: s.pegs.map(([dx, dy]) => [hx + dx * P, hy + dy * P]),
-      accessory: s.accessory,
       label: s.label
     });
   }
   return out;
 }
-var ACCESSORY_INDEX = { hook: 0, shelf: 1, clip: 2, rail: 3 };
-function accessoryOf(f) {
-  const P = DRAWER.pitch;
-  const lift = TRAY_LOOK.accessoryHeight[f.accessory] * P;
-  const L = TRAY_LOOK.lamp;
-  const blur = TRAY_LOOK.lampSize * lift / L[2] + 2;
-  const pushX = Math.max(0, -L[0] / L[2] * lift);
-  const pushY = Math.max(0, -L[1] / L[2] * lift);
-  const r = f.screen;
-  let x0 = Number.POSITIVE_INFINITY;
-  let y0 = Number.POSITIVE_INFINITY;
-  let x1 = Number.NEGATIVE_INFINITY;
-  let y1 = Number.NEGATIVE_INFINITY;
-  const add = (a, b, c, d) => {
-    x0 = Math.min(x0, a);
-    y0 = Math.min(y0, b);
-    x1 = Math.max(x1, c);
-    y1 = Math.max(y1, d);
-  };
-  for (const [x, y] of f.pegs) {
-    add(x - 0.35 * P, y - 0.4 * P, x + 0.35 * P, y + 0.4 * P);
-    if (f.accessory === "hook") add(x - 0.15 * P, y, x + 0.15 * P, y + 0.7 * P);
-    if (f.accessory === "clip") add(x - 0.3 * P, y - 0.3 * P, x + 0.3 * P, Math.max(y, r.y0) + 0.6 * P);
-    if (f.accessory === "shelf") add(x - 0.15 * P, Math.min(y, r.y1), x + 0.15 * P, Math.max(y, r.y1) + 0.1 * P);
-  }
-  if (f.accessory === "shelf") add(r.x0 - 0.35 * P, r.y1 - 0.05 * P, r.x1 + 0.35 * P, r.y1 + 0.3 * P);
-  if (f.accessory === "rail" && f.pegs.length > 0) {
-    const xs = f.pegs.map((q) => q[0]);
-    const y = f.pegs[0][1];
-    add(Math.min(...xs) - 0.45 * P, y - 0.2 * P, Math.max(...xs) + 0.45 * P, y + 0.2 * P);
-  }
-  const peg = (i) => f.pegs[i] ?? [0, 0];
-  return {
-    box: [x0 - blur, y0 - blur, x1 + pushX + blur, y1 + pushY + blur],
-    kind: [ACCESSORY_INDEX[f.accessory], Math.min(f.pegs.length, 4), lift, 0],
-    rect: [r.x0, r.y0, r.x1, r.y1],
-    pegs0: [...peg(0), ...peg(1)],
-    pegs1: [...peg(2), ...peg(3)]
-  };
-}
 var carrySlot = (type) => `carry:${type}`;
 function carriedFrame(pose, src, env) {
   const v = carryView(pose, src.rect);
@@ -2611,247 +2818,6 @@ var TraySlots = class {
   }
 };
 
-// ../desk/src/tray/pass.ts
-var BLEND_PREMUL5 = {
-  color: { srcFactor: "one", dstFactor: "one-minus-src-alpha", operation: "add" },
-  alpha: { srcFactor: "one", dstFactor: "one-minus-src-alpha", operation: "add" }
-};
-function pcg(v) {
-  const s = Math.imul(v >>> 0, 747796405) + 2891336453 >>> 0;
-  const w = Math.imul((s >>> (s >>> 28) + 4 ^ s) >>> 0, 277803737) >>> 0;
-  return (w >>> 22 ^ w) >>> 0;
-}
-var HASH_SIZE = 256;
-function hashTexels() {
-  const N = HASH_SIZE;
-  const h = new Uint8Array(N * N);
-  for (let j = 0; j < N; j++) {
-    const r = pcg(j);
-    for (let i = 0; i < N; i++) h[j * N + i] = pcg((i ^ r) >>> 0) >>> 24;
-  }
-  const out = new Uint8Array(N * N * 4);
-  for (let j = 0; j < N; j++) {
-    for (let i = 0; i < N; i++) {
-      const i1 = (i + 1) % N;
-      const j1 = (j + 1) % N;
-      const o = (j * N + i) * 4;
-      out[o] = h[j * N + i];
-      out[o + 1] = h[j * N + i1];
-      out[o + 2] = h[j1 * N + i];
-      out[o + 3] = h[j1 * N + i1];
-    }
-  }
-  return out;
-}
-function keep(fp, F) {
-  const x = Math.min(Math.max((fp * F - 0.25) / 0.25, 0), 1);
-  return 1 - x * x * (3 - 2 * x);
-}
-var TrayPass = class _TrayPass {
-  device;
-  mat;
-  pipeline;
-  /** K5a: the accessories' own fragment entry on the same layout (a branch in one entry slowed the board). */
-  accPipeline;
-  /** The VEIL (design-018 rev 5): the plain board laid over everything the drawer holds at its top — its own entries on the same layout. */
-  veilPipeline;
-  layout;
-  sampler;
-  trayBuf;
-  lightBuf;
-  hash;
-  tray = TrayUniforms.alloc(1);
-  light = MatUniforms.alloc(1);
-  sentTray = new Uint8Array(TrayUniforms.size);
-  sentLight = new Uint8Array(MatUniforms.size);
-  sent = false;
-  /** The quads the last prepare laid: 0 while the drawer is shut (p 0) — then it draws nothing. */
-  quads = 0;
-  /** A host's foot inset this frame (I21): the veil lays a second quad, over the foot, in its one draw. */
-  foot = 0;
-  group = null;
-  boundAssets = -1;
-  last = null;
-  // the accessories (K5a): one record per specimen, grown by doubling; uploaded only when their bytes moved
-  acc = TrayAccessoryStruct.alloc(8);
-  accBuf;
-  accSent = new Uint8Array(0);
-  accCount = 0;
-  constructor(device, mat, pipelines, layout) {
-    this.device = device;
-    this.mat = mat;
-    [this.pipeline, this.accPipeline, this.veilPipeline] = pipelines;
-    this.layout = layout;
-    this.sampler = device.createSampler({ label: "tray/pegboard/noise", magFilter: "linear", minFilter: "linear", addressModeU: "repeat", addressModeV: "repeat" });
-    this.trayBuf = uniformBuffer(device, TrayUniforms.size, "tray/pegboard/uniforms");
-    this.lightBuf = uniformBuffer(device, MatUniforms.size, "tray/pegboard/light");
-    this.accBuf = storageBuffer(device, TrayAccessoryStruct.size * 8, "tray/pegboard/accessories");
-    this.hash = device.createTexture({ label: "tray/pegboard/hash", size: [HASH_SIZE, HASH_SIZE], format: "rgba8unorm", usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST });
-    device.queue.writeTexture({ texture: this.hash }, hashTexels(), { bytesPerRow: HASH_SIZE * 4 }, [HASH_SIZE, HASH_SIZE]);
-  }
-  /** The pipeline on `format`, sampling `mat`'s blue noise (the root's: its assets are every slot's). */
-  static async create(device, format, src, mat) {
-    const module = await compile(device, compose(src));
-    const layout = bindLayout(device, [
-      { binding: 0, stages: ["fragment"], buffer: "uniform" },
-      { binding: 1, stages: ["vertex", "fragment"], buffer: "uniform" },
-      { binding: 2, stages: ["fragment"], texture: "float" },
-      { binding: 3, stages: ["fragment"], sampler: "filtering" },
-      { binding: 4, stages: ["fragment"], texture: "float" },
-      { binding: 5, stages: ["vertex", "fragment"], buffer: "read-only-storage" }
-    ], "tray/pegboard");
-    const pl = device.createPipelineLayout({ label: "tray/pegboard", bindGroupLayouts: [layout] });
-    const pipelines = await Promise.all([
-      renderPipeline(device, { label: "tray/pegboard", layout: pl, module, format, blend: BLEND_PREMUL5 }),
-      renderPipeline(device, { label: "tray/pegboard/accessories", layout: pl, module, format, blend: BLEND_PREMUL5, fragment: "fs_accessory" }),
-      renderPipeline(device, { label: "tray/pegboard/veil", layout: pl, module, format, blend: BLEND_PREMUL5, vertex: "vs_veil", fragment: "fs_veil" })
-    ]);
-    return new _TrayPass(device, mat, pipelines, layout);
-  }
-  /**
-   * Lay the drawer out for this frame and upload what changed (before the frame's pass begins): the view, the theme's light, the
-   * root grid's grade, the frame's noise offset. Returns the quads that will draw: one (the view whole while it dims) — none while
-   * the drawer is shut (p 0: it and its shadows lie below the view — nothing is uploaded, nothing drawn; design-018 §5).
-   */
-  prepare(view, theme, grid, frame, inputs) {
-    const P = DRAWER.pitch;
-    const p = Math.min(Math.max(inputs.p, 0), 1);
-    const rect = drawerRect(view.width, view.height, p);
-    const { rowBase, frac } = carry(inputs.scroll, P);
-    const foot = inputs.foot !== void 0 && inputs.foot > 0 ? inputs.foot : 0;
-    this.foot = foot;
-    if (p <= 0) {
-      this.last = { rect, rowBase, frac, dim: 0, accessories: [], ...foot > 0 ? { foot } : {} };
-      this.quads = 0;
-      return 0;
-    }
-    const L = TRAY_LOOK.lamp;
-    const g = Math.hypot(L[0], L[1]) || 1;
-    const S = DRAWER.shadow.lamp;
-    const Rm = DRAWER.shadow.room;
-    const fp = 1 / (P * view.dpr);
-    const dim = (DRAWER.dim.day + (DRAWER.dim.night - DRAWER.dim.day) * Math.min(Math.max(theme.matLight.night, 0), 1)) * p;
-    const T = TRAY_LOOK;
-    const values = {
-      view: [view.width, view.height, view.dpr, P],
-      rect: [rect.x, rect.y, rect.w, rect.h],
-      rowBase,
-      frac,
-      fp,
-      dim,
-      shape: [DRAWER.radius, DRAWER.arris, DRAWER.inner.alpha, DRAWER.inner.width],
-      hole: [PEG.holeR, PEG.holeHalf, PEG.rimK, PEG.border],
-      depth: [PEG.thick, PEG.gap, PEG.colPhase, PEG.rowPhase],
-      lamp: [L[0], L[1], L[2], T.lampSize],
-      room: [Rm.sigma, Rm.alpha, 0, 0],
-      shadow: [S.sigma, S.alpha, -L[0] / g * S.push, -L[1] / g * S.push],
-      face: [...T.face, 0],
-      faceSrgb: [...T.faceSrgb, 0],
-      edge: [...T.edge, 0],
-      cavity: [T.cavity.edge, T.cavity.heart, T.cavity.width, 0],
-      keepFace: [keep(fp, 6 * Math.sqrt(10)), 0, keep(fp, 85), keep(fp, 190)],
-      // the flecks fade by their cell; their strokes are anti-aliased in the shader (tray.wgsl `peg_flecks`)
-      keepFine: [keep(fp, 210), keep(fp, 42), keep(fp, 105), 0],
-      keepEdge: [keep(fp, 9), keep(fp, 18), keep(fp, 36), 0],
-      accessory: [...T.accessory, T.accessoryShadow],
-      fade: [DRAWER.fade, DRAWER.header, foot, 0]
-    };
-    this.tray.set(values);
-    const gobo = grid.mat.gobo;
-    const noise = frame?.noise ?? [0, 0];
-    const light = {
-      gobo: [gobo.opacity, gobo.blurTexels, gobo.shadeMix, gobo.darkFloor],
-      grade: [gobo.saturate, 0, 0, 0],
-      noise: [noise[0], noise[1], 1 / NOISE_SIZE, 0],
-      ...lightValues(theme.matLight)
-    };
-    this.light.set(light);
-    this.upload(this.trayBuf, this.tray.view(), this.sentTray);
-    this.upload(this.lightBuf, this.light.view(), this.sentLight);
-    this.sent = true;
-    const accessories = (inputs.specimens ?? []).map(accessoryOf);
-    this.layAccessories(accessories);
-    this.last = { rect, rowBase, frac, dim, accessories, ...foot > 0 ? { foot } : {} };
-    this.quads = 1;
-    return 1;
-  }
-  /** The accessories' records to the GPU — grown by doubling, written only when their bytes moved (a drawer at rest costs no write). */
-  layAccessories(list) {
-    if (list.length > this.acc.count) {
-      let n = this.acc.count;
-      while (n < list.length) n *= 2;
-      this.acc = TrayAccessoryStruct.alloc(n);
-      this.accBuf.destroy();
-      this.accBuf = storageBuffer(this.device, TrayAccessoryStruct.size * n, "tray/pegboard/accessories");
-      this.accSent = new Uint8Array(0);
-      this.group = null;
-    }
-    for (let i = 0; i < list.length; i++) this.acc.set(list[i], i);
-    this.accCount = list.length;
-    if (list.length === 0) return;
-    const bytes = this.acc.view(list.length);
-    let same = bytes.length === this.accSent.length;
-    for (let i = 0; same && i < bytes.length; i++) if (bytes[i] !== this.accSent[i]) same = false;
-    if (same) return;
-    this.accSent = bytes.slice();
-    this.device.queue.writeBuffer(this.accBuf, 0, bytes);
-  }
-  /** A block to the GPU only when its bytes moved since the last upload (a drawer at rest costs no write). */
-  upload(buf, bytes, sent) {
-    let same = this.sent;
-    for (let i = 0; same && i < bytes.length; i++) if (bytes[i] !== sent[i]) same = false;
-    if (same) return;
-    sent.set(bytes);
-    this.device.queue.writeBuffer(buf, 0, bytes);
-  }
-  /** A pipeline and the group, bound (the group remade when the mat's assets or the accessories' buffer changed). */
-  bind(pass, pipeline) {
-    if (this.group === null || this.boundAssets !== this.mat.assetVersion) {
-      this.group = bindGroup(this.device, this.layout, [this.lightBuf, this.trayBuf, this.mat.noiseTexture.createView(), this.sampler, this.hash.createView(), this.accBuf], "tray/pegboard");
-      this.boundAssets = this.mat.assetVersion;
-    }
-    pass.setPipeline(pipeline);
-    pass.setBindGroup(0, this.group);
-  }
-  /**
-   * The drawer UNDER its specimens into the open pass — over everything drawn so far (the caller left the scissor on the whole view):
-   * the dim, the drawer's shadows, the board to its edge; then each specimen's accessory with its shadow on the board (K5a).
-   */
-  draw(pass) {
-    if (this.quads === 0) return;
-    pass.pushDebugGroup("tray/pegboard");
-    this.bind(pass, this.pipeline);
-    pass.draw(6, 1, 0, 0);
-    if (this.accCount > 0) {
-      pass.setPipeline(this.accPipeline);
-      pass.draw(6, this.accCount, 0, 1);
-    }
-    pass.popDebugGroup();
-  }
-  /**
-   * THE VEIL (design-018 rev 5) — LAST, over everything the drawer holds (the caller left the scissor on the whole view): the plain board
-   * whole in the header and fading out over its ramp, so what hangs there and the holes behind it fade into the board together — a
-   * specimen never turns see-through over a hole. One quad — and with a host's foot (I21) a second, over the foot, in the same draw.
-   */
-  drawVeil(pass) {
-    if (this.quads === 0) return;
-    pass.pushDebugGroup("tray/pegboard/veil");
-    this.bind(pass, this.veilPipeline);
-    pass.draw(this.foot > 0 ? 12 : 6, 1, 0, 0);
-    pass.popDebugGroup();
-  }
-  /** What the last prepare laid (a rig's witness). */
-  get laid() {
-    return this.last;
-  }
-  dispose() {
-    this.trayBuf.destroy();
-    this.lightBuf.destroy();
-    this.accBuf.destroy();
-    this.hash.destroy();
-  }
-};
-
 // ../desk/src/ground.ts
 function closeScope(b, kinds) {
   b.device.popErrorScope().then((e) => {
@@ -3021,10 +2987,11 @@ var SlotPool = class {
 };
 function drawSlot(pass, size, dpr, slot) {
   if (!visible(slot.present)) return false;
-  const [x, y, w, h] = scissorOf(slot.present, dpr, size);
+  const scissor = scissorOf(slot.present, dpr, size);
+  const [x, y, w, h] = scissor;
   if (w === 0 || h === 0) return false;
   pass.setScissorRect(x, y, w, h);
-  if (slot.bare !== true) slot.mat.draw(pass);
+  if (slot.bare !== true) slot.mat.drawSurface(pass, scissor);
   if (slot.underlays?.length) {
     for (const u of slot.underlays) u.draw(pass);
     pass.setScissorRect(x, y, w, h);
@@ -3123,6 +3090,7 @@ function drawSlot(pass, size, dpr, slot) {
     }
   }
   for (const children of insides.values()) for (const child of children) inside(child);
+  if (slot.bare !== true) slot.mat.drawRulers(pass, scissor);
   return true;
 }
 function drawFrame(pass, size, dpr, incoming, outgoing) {
@@ -3560,7 +3528,7 @@ var Ground = class _Ground {
 };
 function tagsOf(tray) {
   const P = DRAWER.pitch;
-  return (tray?.specimens ?? []).map((f) => ({ label: f.label, x: (f.screen.x0 + f.screen.x1) / 2, y: f.screen.y1 + (f.accessory === "shelf" ? 0.24 * P : 0) + 0.45 * P }));
+  return (tray?.specimens ?? []).map((f) => ({ label: f.label, x: (f.screen.x0 + f.screen.x1) / 2, y: f.screen.y1 + 0.45 * P }));
 }
 function renderHeldFrame(device, hold, root, pool, grid, into, inputs, held, cache, label = "hold") {
   const size = into.size();
@@ -5714,6 +5682,7 @@ function createPickSource(builder, opts = {}) {
 var EPS2 = 1e-4;
 function createTrayFlux(opts = {}) {
   const foot = opts.foot ?? 0;
+  const footFade = opts.footFade ?? DRAWER.fade;
   let facts = null;
   let p = 0;
   let from = 0;
@@ -5788,7 +5757,7 @@ function createTrayFlux(opts = {}) {
       const pb = P?.band ?? shown;
       const rect = drawerRect(vw, vh, pp);
       drawn = { x: rect.x, y: rect.y, w: rect.w, h: rect.h, p: pp, max: scrollRange(vw, vh, f.bottom ?? 0, foot), pitch: DRAWER.pitch, scroll: f.scroll + pb, face: rect.h, head: DRAWER.arris + DRAWER.header, ...foot > 0 ? { foot } : {} };
-      return { p: pp, scroll: f.scroll + pb, ...foot > 0 ? { foot } : {} };
+      return { p: pp, scroll: f.scroll + pb, ...foot > 0 ? { foot, footFade } : {} };
     },
     live: () => moving && pinned === null,
     frame: () => drawn,
@@ -5839,7 +5808,7 @@ function createDeskReflector(opts) {
   let gridGen = 0;
   let pinGen = 0;
   const wakes = { world: 0, removed: 0, reset: 0, order: 0, hover: 0, marks: 0, camera: 0, viewport: 0, nav: 0, theme: 0, grid: 0, pin: 0, ambient: 0, live: 0, ink: 0, tray: 0 };
-  const tray = createTrayFlux(opts.tray?.foot !== void 0 ? { foot: opts.tray.foot } : {});
+  const tray = createTrayFlux(opts.tray);
   let drawnSpecimens = [];
   const carry2 = createTrayCarry();
   let drawnCarried = [];
@@ -7613,6 +7582,7 @@ function deskLayer(opts) {
     looksOf(objectKinds, opts.palette, opts.theme);
     const hold = holdOf(opts.hold);
     const foot = hostNumber("tray.foot", opts.tray?.foot);
+    const footFade = hostNumber("tray.footFade", opts.tray?.footFade);
     const cursors = opts.cursors !== false;
     const canvas = doc.createElement("canvas");
     canvas.style.position = "absolute";
@@ -7843,7 +7813,7 @@ function deskLayer(opts) {
       grid,
       locals,
       ...opts.maxDpr !== void 0 ? { maxDpr: opts.maxDpr } : {},
-      ...foot !== void 0 ? { tray: { foot } } : {},
+      ...foot !== void 0 || footFade !== void 0 ? { tray: { ...foot !== void 0 ? { foot } : {}, ...footFade !== void 0 ? { footFade } : {} } } : {},
       ...opts.name !== void 0 ? { name: opts.name } : {},
       // a frame asked for outside the flush — a pin, an ink landing, the ground arriving, a theme: a sleeping loop wakes (K7a)
       onWake: (reason) => frame?.wake(`desk:${reason}`)
@@ -8369,8 +8339,8 @@ function deskLayer(opts) {
           ...compose2.tray.state(),
           frame: compose2.tray.frame(),
           laid: ground?.tray?.laid ?? null,
-          // K5a: the specimens as the last frame drew them — each on screen, its pegs on screen, the scale its kind drew it at — its tags, its slots
-          specimens: compose2.traySpecimens().map((f) => ({ type: f.type, kind: f.kind, label: f.label, accessory: f.accessory, screen: f.screen, pegs: f.pegs, zoom: f.view.zoom, object: f.object })),
+          // K5a: the specimens as the last frame drew them — each on screen, the scale its kind drew it at — its tags, its slots
+          specimens: compose2.traySpecimens().map((f) => ({ type: f.type, kind: f.kind, label: f.label, screen: f.screen, zoom: f.view.zoom, object: f.object })),
           tags: ground?.marks?.tagsLaid.length ?? 0,
           slots: ground?.traySlots?.size ?? 0,
           // K5b: what the tray carried last frame — the copy, a ghost growing or flying home — and the ghosts it drew for the desk
@@ -9112,4 +9082,4 @@ export {
   STILL_PALETTE,
   createStill
 };
-//# sourceMappingURL=chunk-REJTEK3V.js.map
+//# sourceMappingURL=chunk-M2HUDENL.js.map