@popcraft/kit 0.35.1 → 0.35.2

package/dist/chunks/chunk-2R2EBR6F.js

@@ -0,0 +1,1574 @@
+import { createRequire as __popcraftRequire } from 'node:module';
+import { fileURLToPath as __popcraftPath } from 'node:url';
+import { dirname as __popcraftDirname } from 'node:path';
+const require = __popcraftRequire(import.meta.url);
+const __filename = __popcraftPath(import.meta.url);
+const __dirname = __popcraftDirname(__filename);
+import {
+  H,
+  W,
+  arcPoints,
+  back,
+  bar,
+  box,
+  close,
+  drift,
+  focusColumn,
+  focusRow,
+  gameKit,
+  gameVar,
+  glow,
+  go,
+  keybind,
+  keys,
+  label,
+  menu,
+  onAll,
+  oneShot,
+  overlay,
+  poly,
+  readout,
+  rebindListener,
+  screen,
+  set,
+  slider,
+  spin,
+  toggle,
+  toggleComponent,
+  when
+} from "./chunk-J75SJQJ5.js";
+import {
+  defineTemplate
+} from "./chunk-76OE66SX.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-APZ7CG5P.js";
+
+// templates/src/game/hearthmoor-farm.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var FARMERS = ["Wren", "Juniper", "Rowan", "Hollis", "Tamsin", "Arlo"];
+var FARMS = ["Bramblewick", "Thistledown", "Puddlemere", "Honeyhollow", "Mossgate"];
+var PETS = [
+  { kind: "dog", name: "Biscuit", blurb: "A scruffy terrier who herds butterflies." },
+  { kind: "cat", name: "Pudding", blurb: "A grey mouser with opinions about rain." },
+  { kind: "bunny", name: "Clover", blurb: "A lop-eared rabbit, suspicious of turnips." }
+];
+var TOOLS = ["Hoe", "Watering can", "Axe", "Pickaxe", "Sickle"];
+var TOOL_ICONS = ["hoe", "wcan", "axe", "pick", "sickle"];
+var SEASONS = ["Spring", "Summer", "Autumn", "Winter"];
+var WEEKDAYS = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
+var WEATHER = ["Sunny", "Windy", "Drizzle"];
+var TEXT_SPEEDS = ["Leisurely", "Gentle", "Steady", "Brisk", "Quick"];
+var ENERGY_COST = 12;
+var TURNIP_PRICE = 35;
+var CLINIC_BILL = 40;
+var CREDITS = [
+  ["Direction", "Posy Halloran"],
+  ["Watercolours and art", "Ishbel Marrow"],
+  ["Farm systems", "Teodor Quill"],
+  ["Music", "The Hedgerow Quartet"],
+  ["Writing", "Ada Fenwick-Oyelaran"],
+  ["Animation", "Mirela Sorn"],
+  ["Engineering", "Kit Abernathy \xB7 Sol Ferrante"],
+  ["Companion consultant", "Biscuit, a very good dog"],
+  ["Special thanks", "Everyone who ever left a note in a neighbour's mailbox"]
+];
+function rng(seed) {
+  let s = Math.abs(Math.floor(seed * 7919 + 104729)) % 2147483646 + 1;
+  return () => {
+    s = s * 48271 % 2147483647;
+    return s / 2147483647;
+  };
+}
+function blobPts(cx, cy, rx, ry, seed = 1, wob = 0.06, n = 22) {
+  const r = rng(seed);
+  const out = [];
+  for (let i = 0; i < n; i++) {
+    const a = i / n * Math.PI * 2;
+    const j = 1 + (r() - 0.5) * 2 * wob;
+    out.push([cx + Math.cos(a) * rx * j, cy + Math.sin(a) * ry * j]);
+  }
+  return out;
+}
+function softRectPts(x, y, w, h, rad, seed = 1, wob = 2) {
+  const r = rng(seed);
+  const j = () => (r() - 0.5) * 2 * wob;
+  const out = [];
+  const corners = [[x + w - rad, y + rad, -Math.PI / 2], [x + w - rad, y + h - rad, 0], [x + rad, y + h - rad, Math.PI / 2], [x + rad, y + rad, Math.PI]];
+  corners.forEach(([cx, cy, a0], ci) => {
+    for (let i = 0; i <= 4; i++) {
+      const a = a0 + i / 4 * (Math.PI / 2);
+      out.push([cx + Math.cos(a) * rad, cy + Math.sin(a) * rad]);
+    }
+    const [nx, ny, na0] = corners[(ci + 1) % 4];
+    const ex = cx + Math.cos(a0 + Math.PI / 2) * rad, ey = cy + Math.sin(a0 + Math.PI / 2) * rad;
+    const sx = nx + Math.cos(na0) * rad, sy = ny + Math.sin(na0) * rad;
+    for (let t = 1; t <= 3; t++) out.push([ex + (sx - ex) * t / 4 + j(), ey + (sy - ey) * t / 4 + j()]);
+  });
+  return out;
+}
+function hillPts(x0, x1, base, amp, waves, seed, bottom = H) {
+  const r = rng(seed);
+  const ph = r() * Math.PI * 2;
+  const pts = [];
+  const n = 26;
+  for (let i = 0; i <= n; i++) {
+    const t = i / n;
+    pts.push([x0 + (x1 - x0) * t, base - Math.sin(t * Math.PI * waves + ph) * amp - (r() - 0.5) * amp * 0.2]);
+  }
+  pts.push([x1, bottom], [x0, bottom]);
+  return pts;
+}
+var rot = (cx, cy, pts, a) => pts.map(([x, y]) => [cx + (x - cx) * Math.cos(a) - (y - cy) * Math.sin(a), cy + (x - cx) * Math.sin(a) + (y - cy) * Math.cos(a)]);
+function dashed(k, id, pattern) {
+  const n = k.node(id);
+  k.patch(id, { strokes: (n.strokes ?? []).map((s) => ({ ...s, dashPattern: [...pattern] })) });
+}
+var pivot = (k, id, ax, ay) => k.patch(id, { anchorX: ax, anchorY: ay });
+function vec(k, parent, pts, fill, o = {}) {
+  const xs = pts.map((p) => p[0]), ys = pts.map((p) => p[1]);
+  const x0 = Math.min(...xs), y0 = Math.min(...ys);
+  const w = Math.max(1, Math.max(...xs) - x0), h = Math.max(1, Math.max(...ys) - y0);
+  const n = pts.length;
+  const points = pts.map(([x, y], i) => {
+    const p = { x: x - x0, y: y - y0 };
+    if (o.sharp) return p;
+    const [ax, ay] = pts[(i - 1 + n) % n], [bx, by] = pts[(i + 1) % n];
+    const tx = (bx - ax) / 6, ty = (by - ay) / 6;
+    return { ...p, handleIn: { x: p.x - tx, y: p.y - ty }, handleOut: { x: p.x + tx, y: p.y + ty } };
+  });
+  const id = k.vector(parent, w, h, [{ closed: true, points }], fill, {
+    name: o.name ?? "Shape",
+    absolute: { x: x0, y: y0 },
+    ...o.stroke ? { stroke: { color: o.stroke.color, width: o.stroke.width } } : {},
+    ...o.opacity !== void 0 ? { opacity: o.opacity } : {},
+    ...o.effects ? { effects: o.effects } : {}
+  });
+  if (o.dash) dashed(k, id, o.dash);
+  return id;
+}
+var blob = (k, parent, cx, cy, rx, ry, fill, o = {}) => vec(k, parent, blobPts(cx, cy, rx, ry, o.seed ?? cx + cy, o.wob ?? 0.05), fill, o);
+var soft = (k, blur = 26, y = 8, a = 0.16) => ({ id: `soft${blur}`, type: "DROP_SHADOW", color: k.color("bark", a), offset: { x: 0, y }, blur, spread: 0, visible: true, showBehindTransparent: false });
+function quilt(k, parent, x, y, w, h, o = {}) {
+  const b = box(k, parent, x, y, w, h, { name: o.name ?? "Quilt panel", ...o.clip ? { clip: true } : {} });
+  const r = o.radius ?? 30, s = o.seed ?? x * 3 + y;
+  vec(k, b, softRectPts(0, 0, w, h, r, s, 2.2), o.fill ?? "parchment", { name: "Patch", stroke: { color: "seam", width: 3 }, effects: [soft(k)] });
+  vec(k, b, softRectPts(13, 13, w - 26, h - 26, Math.max(8, r - 12), s + 5, 1.1), [], { name: "Stitching", stroke: { color: o.stitch ?? "stitch", width: 2.5 }, dash: [11, 8] });
+  return b;
+}
+var pickText = (v, list) => `(${list.map((w, i) => i < list.length - 1 ? `${v} == ${i} ? "${w}" : ` : `"${w}"`).join("")})`;
+var pickExpr = (v, list) => `(${list.map((e, i) => i < list.length - 1 ? `${v} == ${i} ? (${e}) : ` : `(${e})`).join("")})`;
+function cloud(k, parent, x, y, s, color = "cloud", seed = 1) {
+  const c = box(k, parent, x, y, 280 * s, 130 * s, { name: "Cloud" });
+  [[70, 82, 58, 38], [140, 58, 72, 52], [206, 84, 56, 36], [140, 96, 110, 30]].forEach(([cx, cy, rx, ry], i) => blob(k, c, cx * s, cy * s, rx * s, ry * s, color, { name: "Puff", seed: seed + i }));
+  return c;
+}
+function tree(k, parent, x, y, s, seed = 3) {
+  const t = box(k, parent, x, y, 240 * s, 380 * s, { name: "Tree" });
+  vec(k, t, [[104 * s, 180 * s], [136 * s, 180 * s], [146 * s, 380 * s], [94 * s, 380 * s]], "wood", { name: "Trunk", sharp: true });
+  const crown = box(k, t, 0, 0, 240 * s, 240 * s, { name: "Crown" });
+  blob(k, crown, 120 * s, 130 * s, 112 * s, 100 * s, "leafDeep", { name: "Crown shade", seed, wob: 0.08 });
+  blob(k, crown, 104 * s, 108 * s, 88 * s, 76 * s, "leaf", { name: "Crown light", seed: seed + 1, wob: 0.09 });
+  blob(k, crown, 150 * s, 86 * s, 40 * s, 30 * s, "hillFar", { name: "Crown glint", seed: seed + 2, opacity: 0.8 });
+  pivot(k, crown, 0.5, 0.95);
+  drift(k, crown, "rotation", 1.6, 0.22, seed * 0.1);
+  return t;
+}
+function windmill(k, parent, x, y, s, rate = 24) {
+  const m = box(k, parent, x, y, 340 * s, 480 * s, { name: "Windmill" });
+  const S = (pts) => pts.map(([a, b]) => [a * s, b * s]);
+  vec(k, m, S([[128, 170], [212, 170], [240, 480], [100, 480]]), "wall", { name: "Tower", stroke: { color: "woodDark", width: 3 }, sharp: true });
+  vec(k, m, S([[152, 400], [188, 400], [188, 480], [152, 480]]), "woodDark", { name: "Mill door", sharp: true });
+  blob(k, m, 170 * s, 290 * s, 16 * s, 20 * s, "butter", { name: "Mill window" });
+  vec(k, m, S([[112, 182], [170, 104], [228, 182]]), "clay", { name: "Mill roof", sharp: true });
+  const sails = box(k, m, 10 * s, 0, 320 * s, 320 * s, { name: "Sails" });
+  const hx = 160 * s, hy = 160 * s;
+  for (let i = 0; i < 4; i++) {
+    const a = i * Math.PI / 2;
+    vec(k, sails, rot(hx, hy, S([[178, 154], [312, 154], [312, 124], [178, 128]]), a), "cream", { name: "Sail", stroke: { color: "woodDark", width: 2 }, sharp: true });
+    poly(k, sails, rot(hx, hy, S([[160, 160], [316, 160]]), a), "woodDark", { name: "Spar", stroke: 4 * s + 1 });
+  }
+  k.ellipse(sails, 24 * s, "woodDark", { name: "Hub", absolute: { x: hx - 12 * s, y: hy - 12 * s } });
+  pivot(k, sails, 0.5, 0.5);
+  spin(k, sails, rate);
+  return m;
+}
+function house(k, parent, x, y, s) {
+  const h = box(k, parent, x, y, 400 * s, 320 * s, { name: "Farmhouse" });
+  const S = (pts) => pts.map(([a, b]) => [a * s, b * s]);
+  vec(k, h, S([[270, 30], [310, 30], [310, 120], [270, 120]]), "woodDark", { name: "Chimney", sharp: true });
+  vec(k, h, softRectPts(40 * s, 130 * s, 320 * s, 190 * s, 10 * s, 11, 1.5), "wall", { name: "Walls", stroke: { color: "woodDark", width: 3 } });
+  vec(k, h, S([[16, 146], [200, 50], [384, 146], [360, 160], [200, 80], [40, 160]]), "clay", { name: "Roof", sharp: true });
+  vec(k, h, S([[40, 150], [200, 70], [360, 150]]), "clay", { name: "Roof fill", sharp: true });
+  vec(k, h, softRectPts(170 * s, 220 * s, 64 * s, 100 * s, 30 * s, 12, 1), "woodDark", { name: "Front door" });
+  const win = (wx) => {
+    vec(k, h, softRectPts(wx * s, 180 * s, 70 * s, 64 * s, 8 * s, wx, 1), "butter", { name: "Window", stroke: { color: "woodDark", width: 3 } });
+    poly(k, h, S([[wx + 35, 180], [wx + 35, 244]]), "woodDark", { name: "Mullion", stroke: 3 });
+  };
+  win(76);
+  win(260);
+  [0, 1, 2].forEach((i) => {
+    const p = blob(k, h, 290 * s, 16 * s, (14 + i * 4) * s, (11 + i * 3) * s, "cloud", { name: "Smoke", seed: 40 + i, opacity: 0.85 });
+    k.behave(p, "translateY", [{ kind: "spin", rate: -(16 + i * 7) }, { kind: "mod", period: 90, offset: -90 }]);
+    drift(k, p, "translateX", 8, 0.3 + i * 0.1, i * 0.3);
+  });
+  return { id: h, window: [x + 76 * s, y + 180 * s] };
+}
+function mailbox(k, parent, x, y, s, flagUp) {
+  const m = box(k, parent, x, y, 180 * s, 240 * s, { name: "Mailbox" });
+  const S = (pts) => pts.map(([a, b]) => [a * s, b * s]);
+  vec(k, m, S([[78, 110], [100, 110], [104, 240], [74, 240]]), "woodDark", { name: "Post", sharp: true });
+  vec(k, m, softRectPts(18 * s, 50 * s, 130 * s, 76 * s, 34 * s, 5, 1.2), "terracotta", { name: "Box", stroke: { color: "clay", width: 3 } });
+  blob(k, m, 32 * s, 90 * s, 12 * s, 30 * s, "clay", { name: "Box door" });
+  const arm = box(k, m, 138 * s, 20 * s, 40 * s, 100 * s, { name: "Flag arm" });
+  const flag = box(k, arm, 0, 0, 40 * s, 100 * s, { name: "Flag" });
+  vec(k, flag, S([[4, 10], [10, 10], [10, 100], [4, 100]]), "woodDark", { name: "Flag pole", sharp: true });
+  vec(k, flag, S([[10, 10], [40, 18], [36, 34], [10, 40]]), "accent", { name: "Flag cloth" });
+  pivot(k, arm, 0.15, 0.95);
+  pivot(k, flag, 0.15, 0.95);
+  drift(k, flag, "rotation", 6, 0.7);
+  if (flagUp) k.bindExpression(arm, "rotation", `${flagUp} ? 0 : 80`);
+  return m;
+}
+function kettle(k, parent, x, y) {
+  const kt = box(k, parent, x, y, 420, 360, { name: "Kettle" });
+  blob(k, kt, 190, 330, 150, 18, "linen", { name: "Kettle shadow", wob: 0.02 });
+  const handle = arcPoints(190, 170, 108, Math.PI + 0.35, 2 * Math.PI - 0.35, 30);
+  poly(k, kt, handle, "woodDark", { name: "Kettle handle", stroke: 16 });
+  vec(k, kt, [[296, 214], [372, 128], [392, 136], [330, 254]], "terracotta", { name: "Spout" });
+  blob(k, kt, 190, 238, 136, 94, "terracotta", { name: "Kettle body", seed: 7, wob: 0.03, stroke: { color: "clay", width: 4 } });
+  blob(k, kt, 142, 206, 44, 26, "cream", { name: "Kettle shine", seed: 8, opacity: 0.55 });
+  blob(k, kt, 190, 150, 74, 22, "clay", { name: "Kettle lid", seed: 9, wob: 0.03 });
+  k.ellipse(kt, 28, "butter", { name: "Lid knob", absolute: { x: 176, y: 118 } });
+  [0, 1, 2].forEach((i) => {
+    const p = blob(k, kt, 384 - i * 10, 104, 18 + i * 6, 14 + i * 4, "steam", { name: "Steam", seed: 20 + i, opacity: 0.9 });
+    k.behave(p, "translateY", [{ kind: "spin", rate: -(34 + i * 13) }, { kind: "mod", period: 110, offset: -110 }]);
+    drift(k, p, "translateX", 10, 0.5 + i * 0.15, i * 0.33);
+    drift(k, p, "opacity", 0.3, 0.9, i * 0.2);
+  });
+  pivot(k, kt, 0.5, 0.95);
+  drift(k, kt, "rotation", 1.2, 0.5);
+  return kt;
+}
+function farmer(k, parent, x, y, s = 1) {
+  const f = box(k, parent, x, y, 170 * s, 250 * s, { name: "Farmer" });
+  const S = (pts) => pts.map(([a, b]) => [a * s, b * s]);
+  blob(k, f, 85 * s, 244 * s, 60 * s, 9 * s, k.tint("bark", 0.18), { name: "Farmer shadow", wob: 0.02 });
+  vec(k, f, S([[58, 180], [80, 180], [80, 240], [56, 240]]), "woodDark", { name: "Leg", sharp: true });
+  vec(k, f, S([[92, 180], [114, 180], [116, 240], [92, 240]]), "woodDark", { name: "Leg", sharp: true });
+  blob(k, f, 86 * s, 138 * s, 54 * s, 62 * s, "butter", { name: "Shirt", seed: 31 });
+  vec(k, f, S([[48, 136], [124, 136], [130, 196], [42, 196]]), "dusk", { name: "Dungarees" });
+  blob(k, f, 36 * s, 150 * s, 14 * s, 34 * s, "butter", { name: "Arm", seed: 32 });
+  blob(k, f, 138 * s, 146 * s, 14 * s, 34 * s, "butter", { name: "Arm", seed: 33 });
+  blob(k, f, 86 * s, 70 * s, 40 * s, 40 * s, "skin", { name: "Face", seed: 34, wob: 0.03 });
+  blob(k, f, 70 * s, 82 * s, 8 * s, 6 * s, "rose", { name: "Cheek", seed: 35 });
+  blob(k, f, 104 * s, 82 * s, 8 * s, 6 * s, "rose", { name: "Cheek", seed: 36 });
+  k.ellipse(f, 7 * s, "bark", { name: "Eye", absolute: { x: 72 * s, y: 66 * s } });
+  k.ellipse(f, 7 * s, "bark", { name: "Eye", absolute: { x: 96 * s, y: 66 * s } });
+  blob(k, f, 86 * s, 40 * s, 76 * s, 16 * s, "straw", { name: "Hat brim", seed: 37, wob: 0.04 });
+  blob(k, f, 86 * s, 26 * s, 40 * s, 24 * s, "straw", { name: "Hat crown", seed: 38, wob: 0.04 });
+  vec(k, f, S([[48, 32], [124, 32], [124, 42], [48, 42]]), "clay", { name: "Hat band", sharp: true });
+  drift(k, f, "translateY", 3, 0.6);
+  return f;
+}
+function petArt(k, parent, kind, x, y, s = 1) {
+  const p = box(k, parent, x, y, 150 * s, 130 * s, { name: `Companion ${kind}` });
+  const S = (pts) => pts.map(([a, b]) => [a * s, b * s]);
+  blob(k, p, 75 * s, 124 * s, 56 * s, 7 * s, k.tint("bark", 0.18), { name: "Pet shadow", wob: 0.02 });
+  if (kind === "dog") {
+    const tail = vec(k, p, S([[18, 70], [30, 40], [40, 44], [34, 76]]), "furDark", { name: "Tail" });
+    pivot(k, tail, 0.8, 1);
+    drift(k, tail, "rotation", 16, 1.6);
+    blob(k, p, 64 * s, 88 * s, 44 * s, 32 * s, "fur", { name: "Body", seed: 51 });
+    blob(k, p, 42 * s, 116 * s, 11 * s, 9 * s, "furDark", { name: "Paw", seed: 52 });
+    blob(k, p, 88 * s, 116 * s, 11 * s, 9 * s, "furDark", { name: "Paw", seed: 53 });
+    blob(k, p, 104 * s, 54 * s, 32 * s, 29 * s, "fur", { name: "Head", seed: 54 });
+    blob(k, p, 122 * s, 66 * s, 16 * s, 12 * s, "linen", { name: "Snout", seed: 55 });
+    k.ellipse(p, 10 * s, "bark", { name: "Nose", absolute: { x: 130 * s, y: 58 * s } });
+    k.ellipse(p, 7 * s, "bark", { name: "Eye", absolute: { x: 102 * s, y: 44 * s } });
+    const ear = blob(k, p, 86 * s, 50 * s, 11 * s, 22 * s, "furDark", { name: "Ear", seed: 56 });
+    pivot(k, ear, 0.5, 0.1);
+    drift(k, ear, "rotation", 5, 0.8);
+    vec(k, p, S([[80, 76], [118, 80], [116, 88], [80, 84]]), "terracotta", { name: "Collar", sharp: true });
+  } else if (kind === "cat") {
+    const tail = vec(k, p, S([[26, 104], [8, 70], [14, 34], [24, 36], [22, 70], [36, 100]]), "stone", { name: "Tail" });
+    pivot(k, tail, 0.9, 1);
+    drift(k, tail, "rotation", 10, 0.5);
+    blob(k, p, 66 * s, 90 * s, 40 * s, 32 * s, "stone", { name: "Body", seed: 61 });
+    blob(k, p, 48 * s, 118 * s, 10 * s, 8 * s, "stoneDark", { name: "Paw", seed: 62 });
+    blob(k, p, 86 * s, 118 * s, 10 * s, 8 * s, "stoneDark", { name: "Paw", seed: 63 });
+    vec(k, p, S([[80, 36], [88, 10], [100, 32]]), "stoneDark", { name: "Ear", sharp: true });
+    vec(k, p, S([[108, 32], [122, 8], [128, 36]]), "stoneDark", { name: "Ear", sharp: true });
+    blob(k, p, 104 * s, 54 * s, 30 * s, 27 * s, "stone", { name: "Head", seed: 64 });
+    k.ellipse(p, 7 * s, "bark", { name: "Eye", absolute: { x: 92 * s, y: 48 * s } });
+    k.ellipse(p, 7 * s, "bark", { name: "Eye", absolute: { x: 112 * s, y: 48 * s } });
+    blob(k, p, 104 * s, 64 * s, 5 * s, 4 * s, "rose", { name: "Nose", seed: 65 });
+    poly(k, p, S([[112, 66], [138, 62]]), "bark", { name: "Whisker", stroke: 1.5 });
+    poly(k, p, S([[112, 70], [138, 72]]), "bark", { name: "Whisker", stroke: 1.5 });
+  } else {
+    blob(k, p, 28 * s, 98 * s, 14 * s, 13 * s, "cloud", { name: "Tail puff", seed: 71 });
+    blob(k, p, 64 * s, 92 * s, 40 * s, 32 * s, "cream", { name: "Body", seed: 72, stroke: { color: "seam", width: 2 } });
+    const earA = blob(k, p, 92 * s, 42 * s, 9 * s, 30 * s, "cream", { name: "Ear", seed: 73, stroke: { color: "seam", width: 2 } });
+    const earB = blob(k, p, 112 * s, 44 * s, 9 * s, 30 * s, "cream", { name: "Ear", seed: 74, stroke: { color: "seam", width: 2 } });
+    blob(k, p, 92 * s, 44 * s, 4 * s, 20 * s, "rose", { name: "Inner ear", seed: 75 });
+    pivot(k, earA, 0.5, 1);
+    drift(k, earA, "rotation", 4, 0.6);
+    pivot(k, earB, 0.5, 1);
+    drift(k, earB, "rotation", 4, 0.6, 0.4);
+    blob(k, p, 104 * s, 72 * s, 28 * s, 24 * s, "cream", { name: "Head", seed: 76, stroke: { color: "seam", width: 2 } });
+    k.ellipse(p, 7 * s, "bark", { name: "Eye", absolute: { x: 108 * s, y: 64 * s } });
+    blob(k, p, 126 * s, 76 * s, 5 * s, 4 * s, "rose", { name: "Nose", seed: 77 });
+    blob(k, p, 50 * s, 120 * s, 12 * s, 7 * s, "linen", { name: "Paw", seed: 78 });
+    blob(k, p, 84 * s, 120 * s, 12 * s, 7 * s, "linen", { name: "Paw", seed: 79 });
+  }
+  return p;
+}
+function heart(k, parent, x, y, size, color, name = "Heart") {
+  const s = size / 100;
+  const pts = [];
+  for (let i = 0; i < 28; i++) {
+    const t = i / 28 * Math.PI * 2;
+    pts.push([x + (50 + 16 * Math.sin(t) ** 3 * 3) * s, y + (45 - (13 * Math.cos(t) - 5 * Math.cos(2 * t) - 2 * Math.cos(3 * t) - Math.cos(4 * t)) * 3) * s]);
+  }
+  return vec(k, parent, pts, color, { name, sharp: true });
+}
+function icon(k, parent, kind, x, y, s) {
+  const g = box(k, parent, x, y, 100 * s, 100 * s, { name: `${kind} icon` });
+  const S = (pts) => pts.map(([a, b]) => [a * s, b * s]);
+  const B = (cx, cy, rx, ry, c, n = "Part", seed = 1) => blob(k, g, cx * s, cy * s, rx * s, ry * s, c, { name: n, seed });
+  const L = (pts, c, w, n = "Line") => poly(k, g, S(pts), c, { name: n, stroke: w * s });
+  switch (kind) {
+    case "turnip":
+      B(38, 26, 8, 20, "leaf", "Leaf", 1);
+      B(50, 20, 8, 22, "leafDeep", "Leaf", 2);
+      B(62, 26, 8, 20, "leaf", "Leaf", 3);
+      B(50, 64, 28, 26, "turnip", "Bulb", 4);
+      B(50, 52, 26, 14, "turnipTop", "Shoulder", 5);
+      vec(k, g, S([[46, 86], [54, 86], [50, 98]]), "turnip", { name: "Root", sharp: true });
+      break;
+    case "seeds":
+      B(50, 62, 30, 32, "linen", "Pouch", 6);
+      vec(k, g, S([[32, 30], [68, 30], [64, 40], [36, 40]]), "clay", { name: "Tie", sharp: true });
+      B(42, 64, 4, 5, "soil", "Seed", 7);
+      B(56, 70, 4, 5, "soil", "Seed", 8);
+      B(50, 56, 4, 5, "soil", "Seed", 9);
+      break;
+    case "wood":
+      vec(k, g, softRectPts(14 * s, 50 * s, 72 * s, 26 * s, 12 * s, 10, 0.5), "wood", { name: "Log" });
+      vec(k, g, softRectPts(22 * s, 26 * s, 66 * s, 26 * s, 12 * s, 11, 0.5), "wood", { name: "Log" });
+      B(22, 63, 11, 12, "linen", "Ring", 12);
+      B(80, 39, 11, 12, "linen", "Ring", 13);
+      break;
+    case "stone":
+      B(50, 60, 36, 26, "stone", "Stone", 14);
+      B(40, 52, 12, 7, "cloud", "Glint", 15);
+      break;
+    case "fibre":
+      ;
+      [20, 34, 48, 62, 76].forEach((cx, i) => L([[cx, 90], [50 + (cx - 50) * 0.2, 50], [cx + (i - 2) * 4, 10]], i % 2 ? "leaf" : "leafDeep", 6, "Blade"));
+      vec(k, g, S([[34, 50], [66, 50], [66, 60], [34, 60]]), "butter", { name: "Band", sharp: true });
+      break;
+    case "fert":
+      B(50, 60, 32, 34, "soil", "Sack", 16);
+      vec(k, g, softRectPts(30 * s, 52 * s, 40 * s, 22 * s, 5 * s, 17, 0.4), "cream", { name: "Label" });
+      break;
+    case "fence":
+      ;
+      [14, 44, 74].forEach((px) => vec(k, g, S([[px, 26], [px + 7, 14], [px + 14, 26], [px + 14, 92], [px, 92]]), "wood", { name: "Picket", sharp: true }));
+      vec(k, g, S([[6, 40], [94, 40], [94, 50], [6, 50]]), "woodDark", { name: "Rail", sharp: true });
+      vec(k, g, S([[6, 68], [94, 68], [94, 78], [6, 78]]), "woodDark", { name: "Rail", sharp: true });
+      break;
+    case "scarecrow":
+      vec(k, g, S([[46, 30], [54, 30], [54, 98], [46, 98]]), "wood", { name: "Pole", sharp: true });
+      vec(k, g, S([[12, 46], [88, 46], [88, 54], [12, 54]]), "wood", { name: "Crossbar", sharp: true });
+      B(50, 62, 22, 18, "sage", "Shirt", 18);
+      B(50, 26, 15, 15, "linen", "Sack head", 19);
+      vec(k, g, S([[30, 16], [50, 0], [70, 16]]), "clay", { name: "Hat", sharp: true });
+      break;
+    case "path":
+      B(28, 70, 20, 12, "stone", "Flagstone", 20);
+      B(62, 58, 22, 13, "stone", "Flagstone", 21);
+      B(40, 38, 18, 10, "stone", "Flagstone", 22);
+      B(76, 84, 16, 9, "stone", "Flagstone", 23);
+      break;
+    case "jar":
+      vec(k, g, softRectPts(24 * s, 30 * s, 52 * s, 64 * s, 14 * s, 24, 0.5), "water", { name: "Glass" });
+      vec(k, g, softRectPts(30 * s, 44 * s, 40 * s, 44 * s, 10 * s, 25, 0.5), "turnipTop", { name: "Preserve" });
+      vec(k, g, softRectPts(20 * s, 18 * s, 60 * s, 14 * s, 5 * s, 26, 0.4), "clay", { name: "Lid" });
+      vec(k, g, softRectPts(34 * s, 58 * s, 32 * s, 16 * s, 3 * s, 27, 0.3), "cream", { name: "Jar label" });
+      break;
+    case "treat":
+      vec(k, g, S([[30, 44], [70, 44], [70, 56], [30, 56]]), "linen", { name: "Bone", sharp: true });
+      [[26, 40], [26, 60], [74, 40], [74, 60]].forEach(([cx, cy], i) => B(cx, cy, 11, 11, "linen", "Knuckle", 28 + i));
+      break;
+    case "can":
+    case "wcan": {
+      const body = kind === "can" ? "terracotta" : "water";
+      L([[34, 34], [50, 14], [70, 34]], "woodDark", 6, "Handle");
+      vec(k, g, S([[70, 56], [94, 30], [98, 36], [76, 72]]), body, { name: "Spout" });
+      vec(k, g, softRectPts(20 * s, 36 * s, 56 * s, 52 * s, 12 * s, 33, 0.5), body, { name: "Can body", stroke: { color: "woodDark", width: 2 } });
+      break;
+    }
+    case "hoe":
+      L([[24, 92], [74, 14]], "wood", 8, "Handle");
+      vec(k, g, S([[62, 10], [92, 20], [88, 32], [66, 24]]), "stone", { name: "Blade", sharp: true });
+      break;
+    case "axe":
+      L([[30, 92], [62, 14]], "wood", 8, "Handle");
+      vec(k, g, S([[50, 14], [84, 8], [90, 36], [60, 36]]), "stone", { name: "Axe head" });
+      break;
+    case "pick":
+      L([[50, 94], [50, 22]], "wood", 8, "Handle");
+      vec(k, g, S([[10, 30], [50, 12], [90, 30], [84, 36], [50, 24], [16, 36]]), "stone", { name: "Pick head" });
+      break;
+    case "sickle":
+      L([[40, 94], [50, 62]], "wood", 9, "Handle");
+      L(arcPoints(56, 40, 26, Math.PI * 0.6, Math.PI * 2.05, 16).map(([a, b]) => [a, b]), "stone", 7, "Blade");
+      break;
+    case "coin":
+      B(50, 50, 44, 44, "gold", "Coin", 34);
+      B(50, 50, 30, 30, "butter", "Coin face", 35);
+      vec(k, g, S([[44, 34], [56, 34], [56, 66], [44, 66]]), "gold", { name: "Coin mark" });
+      break;
+  }
+  return g;
+}
+function crop(k, parent, cx, base, stage, seed, sway) {
+  const c = box(k, parent, cx - 70, base - 140, 140, 150, { name: "Crop" });
+  const at = (st) => {
+    const g = box(k, c, 0, 0, 140, 150, { name: ["Seed", "Sprout", "Bloom"][st] });
+    k.bindExpression(g, "visible", `${stage} == ${st}`);
+    return g;
+  };
+  const seedG = at(0);
+  blob(k, seedG, 70, 134, 34, 11, "soilDark", { name: "Mound", seed });
+  k.ellipse(seedG, 8, "straw", { name: "Seed", absolute: { x: 60, y: 126 } });
+  k.ellipse(seedG, 7, "straw", { name: "Seed", absolute: { x: 76, y: 128 } });
+  const sp = at(1);
+  blob(k, sp, 70, 136, 30, 9, "soilDark", { name: "Mound", seed: seed + 1 });
+  poly(k, sp, [[70, 134], [70, 96]], "leafDeep", { name: "Stem", stroke: 5 });
+  blob(k, sp, 54, 96, 18, 9, "leaf", { name: "Leaf", seed: seed + 2 });
+  blob(k, sp, 86, 90, 18, 9, "leaf", { name: "Leaf", seed: seed + 3 });
+  const bl = at(2);
+  [[46, 58, -0.3], [70, 46, 0], [94, 58, 0.3]].forEach(([lx, ly, a], i) => vec(k, bl, rot(70, 110, blobPts(lx, ly, 14, 36, seed + 4 + i, 0.08), a), i === 1 ? "leafDeep" : "leaf", { name: "Leaf" }));
+  blob(k, bl, 70, 118, 30, 24, "turnip", { name: "Bulb", seed: seed + 8 });
+  blob(k, bl, 70, 106, 28, 13, "turnipTop", { name: "Shoulder", seed: seed + 9 });
+  blob(k, bl, 70, 138, 36, 9, "soilDark", { name: "Mound", seed: seed + 10 });
+  pivot(k, c, 0.5, 0.9);
+  drift(k, c, "rotation", sway[0], sway[1], seed % 7 / 7);
+  return c;
+}
+function rosette(k, parent, cx, cy, r, color, place, name) {
+  const g = box(k, parent, cx - r * 1.2, cy - r * 1.2, r * 2.4, r * 3.4, { name });
+  const ox = r * 1.2, oy = r * 1.2;
+  vec(k, g, [[ox - r * 0.5, oy], [ox - r * 0.1, oy], [ox - r * 0.3, oy + r * 2.1], [ox - r * 0.55, oy + r * 1.8], [ox - r * 0.85, oy + r * 2]], color, { name: "Tail", sharp: true });
+  vec(k, g, [[ox + r * 0.1, oy], [ox + r * 0.5, oy], [ox + r * 0.85, oy + r * 2], [ox + r * 0.55, oy + r * 1.8], [ox + r * 0.3, oy + r * 2.1]], color, { name: "Tail", sharp: true });
+  const sc = [];
+  for (let i = 0; i < 36; i++) {
+    const a = i / 36 * Math.PI * 2;
+    const rr = i % 2 ? r * 0.86 : r;
+    sc.push([ox + Math.cos(a) * rr, oy + Math.sin(a) * rr]);
+  }
+  vec(k, g, sc, color, { name: "Scallops", effects: [soft(k, 18, 6, 0.2)] });
+  blob(k, g, ox, oy, r * 0.66, r * 0.66, "parchment", { name: "Rosette disc", seed: Math.round(cx), wob: 0.02 });
+  const t = box(k, g, ox - r * 0.6, oy - 16, r * 1.2, 32, { name: "Rosette word", align: "CENTER", justify: "CENTER" });
+  k.text(t, place, { style: "Ribbon 20", color: "bark", autoWidth: true, name: "Place" });
+  pivot(k, g, 0.5, 0.2);
+  drift(k, g, "rotation", 2.5, 0.35, cx / 1e3);
+  return g;
+}
+var hearthmoor_farm_default = defineTemplate({
+  id: "game-hearthmoor-farm",
+  meta: {
+    name: "HEARTHMOOR \u2014 cozy farming life sim UI",
+    description: "A playable cozy farming game front end and HUD in a watercolour storybook style: a steaming kettle boot card, a valley title with a turning windmill, a menu your companion follows, a new-farm naming screen, working settings, and a farm HUD with a calendar, a clock that passes time, a sky that warms at dusk and cools at night, fireflies, weather, an energy bar, a hotbar, crops that grow by the day, harvesting and selling, crafting, a backpack, a shop, letters from villagers, pause, a clinic wake-up and a Harvest festival",
+    category: "game-ui",
+    tags: ["game", "game ui", "hud", "farming", "life sim", "cozy", "crafting", "watercolour", "interactive", "variables", "keyboard", "menus", "present mode"],
+    platforms: ["desktop"],
+    formats: ["screen"],
+    useCases: ["launch", "pitch"],
+    created: "2026-09-30",
+    updated: "2026-09-30"
+  },
+  build() {
+    const k = gameKit("HEARTHMOOR");
+    k.brand({
+      // Kit roles (a brand kit replaces these): decoration only, never behind words.
+      primary: "#5F8560",
+      onPrimary: "#FFFFFF",
+      secondary: "#9E4A2F",
+      accent: "#D8664A",
+      onAccent: "#1E120B",
+      background: "#FBF3E2",
+      text: "#3A2A1E",
+      // The storybook's own paints.
+      cream: "#FBF3E2",
+      parchment: "#FFF8EA",
+      linen: "#EFE0C2",
+      seam: "#E2CFA8",
+      stitch: "#C49A6C",
+      wall: "#F4E4C8",
+      steam: "#FFFFFF",
+      cloud: "#FFFDF6",
+      sage: "#9DBB8F",
+      moss: "#46663F",
+      onMoss: "#FFF8EA",
+      leaf: "#7FB069",
+      leafDeep: "#5B8C4A",
+      terracotta: "#D07A57",
+      clay: "#9E4A2F",
+      onClay: "#FFF6E8",
+      butter: "#F5D77E",
+      straw: "#E9C46A",
+      gold: "#D9A62E",
+      lavender: "#B7A8D6",
+      dusk: "#7A68A6",
+      night: "#2E2A4F",
+      onNight: "#FBF3E2",
+      nightHill: "#3E3A66",
+      rose: "#E7A1A6",
+      bark: "#3A2A1E",
+      soft: "#6A5242"
+    }, { title: "HEARTHMOOR", studio: "Little Kettle Studio", tagline: "Plant a little. Rest a lot. Belong somewhere." });
+    k.palette({
+      sky: "#CFE6E4",
+      skyWarm: "#F7DDB5",
+      hillFar: "#C7DDB0",
+      hill: "#A8C98F",
+      hillNear: "#8BB474",
+      field: "#9CC47F",
+      soil: "#8C5B3C",
+      soilDark: "#6B4128",
+      soilWet: "#4E2F1C",
+      wood: "#A8744F",
+      woodDark: "#6E4A30",
+      stone: "#A9A39A",
+      stoneDark: "#7C766E",
+      skin: "#F0C8A0",
+      fur: "#D9A066",
+      furDark: "#A8703E",
+      turnip: "#F1EAF6",
+      turnipTop: "#A65A9E",
+      water: "#8EC3D1",
+      warm: "#F29E4C",
+      cool: "#27306E",
+      haze: "#C9B8E8",
+      firefly: "#FFF3A6",
+      rain: "#6F9FB3",
+      blue: "#3F6FB0",
+      red: "#B8443A",
+      clinic: "#E6DDF0",
+      scrim: "#2A2140"
+    });
+    const farmerName = gameVar(k, "Farm", "farmer", "STRING", FARMERS[0]);
+    const farmName = gameVar(k, "Farm", "farmName", "STRING", FARMS[0]);
+    const petName = gameVar(k, "Farm", "petName", "STRING", PETS[0].name);
+    const farmerIdx = gameVar(k, "Farm", "farmerIndex", "FLOAT", 0);
+    const farmIdx = gameVar(k, "Farm", "farmIndex", "FLOAT", 0);
+    const petIdx = gameVar(k, "Farm", "petIndex", "FLOAT", 0);
+    const hour = gameVar(k, "Time", "hour", "FLOAT", 6);
+    const day = gameVar(k, "Time", "day", "FLOAT", 3);
+    const season = gameVar(k, "Time", "season", "FLOAT", 0);
+    const seasonLength = gameVar(k, "Time", "seasonLength", "FLOAT", 7);
+    const weather = gameVar(k, "Time", "weather", "FLOAT", 0);
+    const sleepNote = gameVar(k, "Time", "sleepNote", "STRING", "You tucked in early and slept like a log.");
+    const energy = gameVar(k, "Player", "energy", "FLOAT", 100);
+    const energyTrail = gameVar(k, "Player", "energyTrail", "FLOAT", 100);
+    const maxEnergy = gameVar(k, "Player", "maxEnergy", "FLOAT", 100);
+    const coins = gameVar(k, "Player", "coins", "FLOAT", 120);
+    const billed = gameVar(k, "Player", "clinicBill", "FLOAT", 0);
+    const tool = gameVar(k, "Player", "tool", "FLOAT", 0);
+    const growth = gameVar(k, "Plot", "growth", "FLOAT", 1);
+    const watered = gameVar(k, "Plot", "watered", "FLOAT", 0);
+    const turnips = gameVar(k, "Pack", "turnips", "FLOAT", 0);
+    const seeds = gameVar(k, "Pack", "seeds", "FLOAT", 5);
+    const wood = gameVar(k, "Pack", "wood", "FLOAT", 3);
+    const stone = gameVar(k, "Pack", "stone", "FLOAT", 1);
+    const fibre = gameVar(k, "Pack", "fibre", "FLOAT", 2);
+    const fert = gameVar(k, "Pack", "fertiliser", "FLOAT", 0);
+    const fences = gameVar(k, "Pack", "fences", "FLOAT", 0);
+    const scarecrows = gameVar(k, "Pack", "scarecrows", "FLOAT", 0);
+    const paths = gameVar(k, "Pack", "paths", "FLOAT", 0);
+    const jars = gameVar(k, "Pack", "preserves", "FLOAT", 0);
+    const treats = gameVar(k, "Pack", "treats", "FLOAT", 0);
+    const copper = gameVar(k, "Pack", "copperCan", "FLOAT", 0);
+    const harvested = gameVar(k, "Season", "harvested", "FLOAT", 0);
+    const earned = gameVar(k, "Season", "earned", "FLOAT", 0);
+    const unread = gameVar(k, "Mail", "unread", "FLOAT", 1);
+    const menuFocus = gameVar(k, "UI", "menuFocus", "FLOAT", 0);
+    const newFocus = gameVar(k, "UI", "newFarmFocus", "FLOAT", 0);
+    const setFocus = gameVar(k, "UI", "settingsFocus", "FLOAT", 0);
+    const pauseFocus = gameVar(k, "UI", "pauseFocus", "FLOAT", 0);
+    const endFocus = gameVar(k, "UI", "endFocus", "FLOAT", 0);
+    const craftFocus = gameVar(k, "UI", "craftFocus", "FLOAT", 0);
+    const shopFocus = gameVar(k, "UI", "shopFocus", "FLOAT", 0);
+    const packFocus = gameVar(k, "UI", "packFocus", "FLOAT", 0);
+    const letterFocus = gameVar(k, "UI", "letterFocus", "FLOAT", 0);
+    const rebind = gameVar(k, "UI", "rebinding", "STRING", "");
+    const music = gameVar(k, "Settings", "music", "FLOAT", 70);
+    const ambience = gameVar(k, "Settings", "ambience", "FLOAT", 60);
+    const textSpeed = gameVar(k, "Settings", "textSpeed", "FLOAT", 3);
+    const petFollow = gameVar(k, "Settings", "petFollows", "FLOAT", 1);
+    const clock24 = gameVar(k, "Settings", "clock24", "FLOAT", 0);
+    const keyUse = gameVar(k, "Keys", "useTool", "STRING", "SPACE");
+    const keySell = gameVar(k, "Keys", "sell", "STRING", "S");
+    const keyTime = gameVar(k, "Keys", "passTime", "STRING", "T");
+    const stage = `min(2, ${growth.n})`;
+    const K = `($key == " " ? "SPACE" : upper($key))`;
+    const seasonWord = pickText(season.n, SEASONS);
+    const weekday = pickText(`(${day.n} - 1) % 7`, WEEKDAYS);
+    const dateLine = `${seasonWord} + " " + ${day.n} + " \xB7 " + (${weekday})`;
+    const hh = `floor(${hour.n})`;
+    const mm = `pad(floor((${hour.n} - floor(${hour.n})) * 6) * 10, 2)`;
+    const clockLine = `${clock24.n} == 1 ? pad(${hh} % 24, 2) + ":" + ${mm} : (${hh} % 12 == 0 ? 12 : ${hh} % 12) + ":" + ${mm} + (${hh} % 24 < 12 ? " am" : " pm")`;
+    const weatherWord = pickText(weather.n, WEATHER);
+    const toolWord = pickText(tool.n, TOOLS);
+    const nightExpr = `${hour.n} >= 19.5`;
+    const serif = { fontFamily: "Source Serif 4" };
+    k.textStyle("Studio 34", { size: 34, fontWeight: 600, lineHeight: 44, fontStyle: "italic", ...serif });
+    k.textStyle("Presents 20", { size: 20, fontWeight: 600, letterSpacing: 6, lineHeight: 28, textCase: "UPPER" });
+    k.textStyle("Title 140", { size: 140, fontWeight: 700, letterSpacing: 2, lineHeight: 144, ...serif });
+    k.textStyle("Tagline 30", { size: 30, fontWeight: 400, lineHeight: 40, fontStyle: "italic", ...serif });
+    k.textStyle("Prompt 24", { size: 24, fontWeight: 700, letterSpacing: 5, lineHeight: 32, textCase: "UPPER" });
+    k.textStyle("Menu 40", { size: 40, fontWeight: 600, lineHeight: 48, ...serif });
+    k.textStyle("Hint 20", { size: 20, fontWeight: 500, lineHeight: 28 });
+    k.textStyle("Heading 60", { size: 60, fontWeight: 700, lineHeight: 68, ...serif });
+    k.textStyle("Label 26", { size: 26, fontWeight: 600, lineHeight: 34 });
+    k.textStyle("Value 26", { size: 26, fontWeight: 700, lineHeight: 34 });
+    k.textStyle("Cap 22", { size: 22, fontWeight: 700, letterSpacing: 1, lineHeight: 28, textAlign: "CENTER" });
+    k.textStyle("Small 18", { size: 18, fontWeight: 700, letterSpacing: 2, lineHeight: 24, textCase: "UPPER" });
+    k.textStyle("Body 24", { size: 24, fontWeight: 500, lineHeight: 34 });
+    k.textStyle("Letter 28", { size: 28, fontWeight: 400, lineHeight: 42, fontStyle: "italic", ...serif });
+    k.textStyle("Calendar 32", { size: 32, fontWeight: 700, lineHeight: 40, ...serif });
+    k.textStyle("Clock 44", { size: 44, fontWeight: 700, lineHeight: 50 });
+    k.textStyle("Coins 40", { size: 40, fontWeight: 700, lineHeight: 48 });
+    k.textStyle("Pop 28", { size: 28, fontWeight: 700, lineHeight: 36, fontStyle: "italic", textAlign: "CENTER", ...serif });
+    k.textStyle("Card 28", { size: 28, fontWeight: 700, lineHeight: 36, ...serif });
+    k.textStyle("Stat 64", { size: 64, fontWeight: 700, lineHeight: 72, ...serif });
+    k.textStyle("Ribbon 20", { size: 20, fontWeight: 700, letterSpacing: 2, lineHeight: 26, textCase: "UPPER", textAlign: "CENTER" });
+    k.textStyle("Credit role 20", { size: 20, fontWeight: 600, letterSpacing: 4, lineHeight: 28, textCase: "UPPER", textAlign: "CENTER" });
+    k.textStyle("Credit name 34", { size: 34, fontWeight: 600, lineHeight: 44, textAlign: "CENTER", ...serif });
+    k.textStyle("Key 18", { size: 18, fontWeight: 700, lineHeight: 22 });
+    k.variantSet(
+      "Cosy button",
+      "State",
+      ["Idle", "Hover", "Pressed"],
+      { direction: "HORIZONTAL", width: "HUG", gap: 12, align: "CENTER", padding: { top: 12, right: 26, bottom: 12, left: 26 }, radius: 26, props: { Label: "Back" }, description: "A soft stitched button: hover warms it butter-yellow, pressing sinks it into terracotta." },
+      (state, id) => {
+        k.propText(id, "Label", { style: "Hint 20", color: state === "Pressed" ? "onClay" : "bark", autoWidth: true });
+      },
+      (state) => ({ fill: state === "Idle" ? "parchment" : state === "Hover" ? "butter" : "clay", stroke: { color: "stitch", width: 2, align: "INSIDE" } })
+    );
+    k.changeTo("Cosy button/Idle", "ON_HOVER", "Cosy button/Hover", 140);
+    k.changeTo("Cosy button/Hover", "ON_PRESS", "Cosy button/Pressed", 60);
+    toggleComponent(k, { track: "linen", on: "moss", knob: "parchment", stateStyle: "Small 18", ink: "bark" });
+    const POP_IN = [{ t: 0, v: 0, ease: { kind: "ease", name: "back-out", param: 2 } }, { t: 160, v: 1, ease: { kind: "hold" } }, { t: 1500, v: 1, ease: { kind: "ease", name: "cubic-in" } }, { t: 1780, v: 0 }];
+    const SHAKE = [{ t: 0, v: -18 }, { t: 70, v: 16 }, { t: 140, v: -12 }, { t: 210, v: 9 }, { t: 280, v: -5 }, { t: 350, v: 0 }];
+    const bubbles = (name, w, h, bub, states, o) => k.variantSet(name, "State", ["Idle", ...states.map((s) => s.state)], { width: w, height: h, props: o.props, description: o.description }, (state, id) => {
+      if (o.hit) k.rect(id, w, h, k.tint("parchment", 0.01), { name: "Hit area", absolute: { x: 0, y: 0 } });
+      const s = states.find((x) => x.state === state);
+      if (!s) return;
+      const b = box(k, id, bub.x, bub.y, bub.w, bub.h, { name: "Bubble", fill: s.fill, radius: bub.h / 2, align: "CENTER", justify: "CENTER", stroke: { color: "bark", width: 2 }, effects: [soft(k, 16, 5, 0.2)] });
+      if (s.prop) k.propText(b, s.prop, { style: "Pop 28", color: s.ink, autoWidth: true });
+      else k.text(b, s.text ?? "", { style: "Pop 28", color: s.ink, autoWidth: true, name: "Bubble words" });
+      keys(k, b, "opacity", [...POP_IN]);
+      if (s.shake) keys(k, b, "translateX", [...SHAKE]);
+      else {
+        keys(k, b, "scaleX", [{ t: 0, v: 0.6, ease: { kind: "ease", name: "back-out", param: 2 } }, { t: 280, v: 1 }]);
+        keys(k, b, "scaleY", [{ t: 0, v: 0.6, ease: { kind: "ease", name: "back-out", param: 2 } }, { t: 280, v: 1 }]);
+        keys(k, b, "translateY", [{ t: 0, v: 20, ease: { kind: "ease", name: "expo-out" } }, { t: 300, v: 0, ease: { kind: "hold" } }, { t: 1400, v: 0, ease: { kind: "ease", name: "cubic-in" } }, { t: 1780, v: -36 }]);
+      }
+    }, (st) => st === "Idle" ? {} : { timeline: { duration: 1800 } });
+    bubbles("Harvest pop", 660, 300, { x: 180, y: 0, w: 300, h: 64 }, [
+      { state: "Pop", fill: "butter", ink: "bark", text: "+3 turnips" },
+      { state: "Nope", fill: "parchment", ink: "bark", text: "Not ready yet", shake: true },
+      { state: "Planted", fill: "sage", ink: "bark", text: "Seeds tucked in" }
+    ], { hit: true, description: 'The plot: click (or H) to harvest. Pops "+3 turnips", shakes when nothing is ripe, cheers a fresh sowing.' });
+    bubbles("Coin pop", 420, 72, { x: 0, y: 4, w: 420, h: 64 }, [
+      { state: "Sold", fill: "butter", ink: "bark", text: "Sold at Marigold's cart!" },
+      { state: "Empty", fill: "clay", ink: "onClay", text: "Your basket is empty", shake: true }
+    ], { description: "Selling: a cheerful receipt, or a shake when there is nothing to sell." });
+    bubbles("Craft pop", 340, 470, { x: 30, y: 96, w: 280, h: 68 }, [
+      { state: "Made", fill: "butter", ink: "bark", prop: "Label" },
+      { state: "Nope", fill: "clay", ink: "onClay", text: "Missing materials", shake: true }
+    ], { hit: true, props: { Label: "+1 made" }, description: 'A recipe card: crafting stamps "+1", a shake when the materials run short.' });
+    k.variantSet("Price tag", "State", ["Idle", "Paid", "Short"], { width: 300, height: 150, props: { Price: "20 coins" }, description: `A shop price tag: it pulses when you pay and shakes "Not enough coins" when you can't.` }, (state, id) => {
+      k.rect(id, 300, 150, k.tint("parchment", 0.01), { name: "Hit area", absolute: { x: 0, y: 0 } });
+      const tag = box(k, id, 60, 86, 180, 56, { name: "Tag", fill: "butter", radius: 28, align: "CENTER", justify: "CENTER", stroke: { color: "stitch", width: 2 } });
+      k.propText(tag, "Price", { style: "Value 26", color: "bark", autoWidth: true });
+      if (state === "Idle") return;
+      const b = box(k, id, 0, 6, 300, 60, { name: "Bubble", fill: state === "Paid" ? "moss" : "clay", radius: 30, align: "CENTER", justify: "CENTER", effects: [soft(k, 14, 4, 0.2)] });
+      k.text(b, state === "Paid" ? "Thank you kindly!" : "Not enough coins", { style: "Pop 28", color: state === "Paid" ? "onMoss" : "onClay", autoWidth: true, name: "Bubble words" });
+      keys(k, b, "opacity", [...POP_IN]);
+      if (state === "Short") {
+        keys(k, tag, "translateX", [...SHAKE]);
+        keys(k, b, "translateX", [...SHAKE]);
+      } else {
+        keys(k, tag, "scaleX", [{ t: 0, v: 1.18, ease: { kind: "ease", name: "back-out", param: 2 } }, { t: 320, v: 1 }]);
+        keys(k, tag, "scaleY", [{ t: 0, v: 1.18, ease: { kind: "ease", name: "back-out", param: 2 } }, { t: 320, v: 1 }]);
+        keys(k, b, "translateY", [{ t: 0, v: 16, ease: { kind: "ease", name: "expo-out" } }, { t: 300, v: 0 }]);
+      }
+    }, (st) => st === "Idle" ? {} : { timeline: { duration: 1800 } });
+    oneShot(k, "Tool puff", { width: 220, height: 220, state: "Use", duration: 700, description: "Dust puffs out where a tool lands." }, (state, id) => {
+      for (let i = 0; i < 6; i++) {
+        const a = i / 6 * Math.PI * 2;
+        const p = blob(k, id, 110, 150, 16, 12, i % 2 ? "cloud" : "linen", { name: "Dust", seed: 90 + i, opacity: 0 });
+        if (state === "Use") {
+          keys(k, p, "opacity", [{ t: 0, v: 0.95, ease: { kind: "ease", name: "cubic-out" } }, { t: 660, v: 0 }]);
+          keys(k, p, "translateX", [{ t: 0, v: 0, ease: { kind: "ease", name: "expo-out" } }, { t: 600, v: Math.cos(a) * 70 }]);
+          keys(k, p, "translateY", [{ t: 0, v: 0, ease: { kind: "ease", name: "expo-out" } }, { t: 600, v: Math.sin(a) * 40 - 20 }]);
+        }
+      }
+      const star = k.star(id, 60, "butter", { name: "Sparkle", absolute: { x: 80, y: 60 }, opacity: 0 });
+      if (state === "Use") {
+        keys(k, star, "opacity", [{ t: 0, v: 1, ease: { kind: "hold" } }, { t: 300, v: 1, ease: { kind: "ease", name: "cubic-in" } }, { t: 660, v: 0 }]);
+        keys(k, star, "rotation", [{ t: 0, v: 0, ease: { kind: "ease", name: "cubic-out" } }, { t: 660, v: 90 }]);
+      }
+    });
+    oneShot(k, "Energy flash", { width: 420, height: 30, duration: 600, description: "The energy bar glows as a tool swing drains it." }, (state, id) => {
+      const f = k.rect(id, 420, 30, "butter", { name: "Glow", radius: 15, absolute: { x: 0, y: 0 }, opacity: 0, effects: [glow(k, "butter", 20)] });
+      if (state === "Hit") keys(k, f, "opacity", [{ t: 0, v: 0.9 }, { t: 120, v: 0.2 }, { t: 240, v: 0.7 }, { t: 580, v: 0 }]);
+    });
+    oneShot(k, "Clock face", { width: 80, height: 80, state: "Tick", duration: 900, description: "A clock face whose minute hand whirls twice round as two hours pass." }, (state, id) => {
+      k.ellipse(id, 76, "cream", { name: "Face", stroke: { color: "bark", width: 3 }, absolute: { x: 2, y: 2 } });
+      for (let i = 0; i < 12; i++) {
+        const a = i / 12 * Math.PI * 2;
+        k.ellipse(id, 4, "stitch", { name: "Tick mark", absolute: { x: 38 + Math.cos(a) * 29, y: 38 + Math.sin(a) * 29 } });
+      }
+      poly(k, id, [[40, 40], [54, 30]], "bark", { name: "Hour hand", stroke: 5 });
+      const hand = poly(k, id, [[40, 14], [40, 40]], "clay", { name: "Minute hand", stroke: 3 });
+      pivot(k, hand, 0.5, 1);
+      k.ellipse(id, 8, "clay", { name: "Pin", absolute: { x: 36, y: 36 } });
+      if (state === "Tick") keys(k, hand, "rotation", [{ t: 0, v: 0, ease: { kind: "ease", name: "cubic-in-out" } }, { t: 880, v: 720 }]);
+    });
+    const boot = screen(k, "Boot", { ground: "cream", first: true, duration: 3800 });
+    const title = screen(k, "Title", { ground: "sky", duration: 6e3 });
+    const main = screen(k, "Main menu", { ground: "cream" });
+    const newFarm = screen(k, "New farm", { ground: "cream" });
+    const settings = screen(k, "Settings", { ground: "cream" });
+    const credits = screen(k, "Credits", { ground: "night", duration: 15e3 });
+    const hud = screen(k, "Farm", { ground: "sky" });
+    const craft = screen(k, "Crafting", { ground: "linen" });
+    const pack = screen(k, "Backpack", { ground: "cream", fills: k.tint("scrim", 0.5) });
+    const shop = screen(k, "Shop", { ground: "sky" });
+    const letters = screen(k, "Letters", { ground: "cream", fills: k.tint("scrim", 0.5) });
+    const pause = screen(k, "Pause", { ground: "cream", fills: k.tint("scrim", 0.62) });
+    const morning = screen(k, "Morning", { ground: "skyWarm", duration: 4e3 });
+    const passed = screen(k, "Passed out", { ground: "clinic" });
+    const festival = screen(k, "Harvest festival", { ground: "cream", duration: 5e3 });
+    k.flowStart(boot, "Play HEARTHMOOR");
+    const toFarm = go(hud, "DISSOLVE", { duration: 600 });
+    const toCraft = go(craft, "PUSH_FROM_BOTTOM", { duration: 450 });
+    const toShop = go(shop, "PUSH_FROM_BOTTOM", { duration: 450 });
+    const sleep = (forced) => [
+      set(sleepNote.id, { value: forced ? "Midnight caught you by the stove. You nodded off in the armchair and woke a little stiff." : "You tucked in early and slept like a log." }),
+      set(growth.id, { expression: `${growth.n} >= 0 ? ${growth.n} + 1 + ${watered.n} : ${growth.n}` }),
+      set(watered.id, { value: 0 }),
+      set(energy.id, { expression: forced ? `${maxEnergy.n} * 0.75` : maxEnergy.n }),
+      set(energyTrail.id, { expression: energy.n }),
+      set(hour.id, { value: 6 }),
+      when([
+        { if: `${day.n} >= ${seasonLength.n}`, then: [go(festival, "DISSOLVE", { duration: 900 })] },
+        { then: [set(day.id, { expression: `${day.n} + 1` }), set(weather.id, { expression: `(${weather.n} + 1) % 3` }), go(morning, "DISSOLVE", { duration: 800 })] }
+      ])
+    ];
+    const newRun = [
+      set(day.id, { value: 1 }),
+      set(season.id, { value: 0 }),
+      set(hour.id, { value: 6 }),
+      set(weather.id, { value: 0 }),
+      set(energy.id, { expression: maxEnergy.n }),
+      set(energyTrail.id, { expression: maxEnergy.n }),
+      set(coins.id, { value: 120 }),
+      set(growth.id, { value: 1 }),
+      set(watered.id, { value: 0 }),
+      set(turnips.id, { value: 0 }),
+      set(seeds.id, { value: 5 }),
+      set(wood.id, { value: 3 }),
+      set(stone.id, { value: 1 }),
+      set(fibre.id, { value: 2 }),
+      set(harvested.id, { value: 0 }),
+      set(earned.id, { value: 0 }),
+      set(unread.id, { value: 1 }),
+      set(tool.id, { value: 0 })
+    ];
+    const hint = (id, text, x, y, w, align) => label(k, id, text, "Hint 20", "soft", x, y, { name: "Hints", ...w ? { w } : {}, ...align ? { align } : {} });
+    const valley = (id, x, y, w, h, seed) => {
+      const v = box(k, id, x, y, w, h, { name: "Valley", clip: true });
+      k.rect(v, w, h, "sky", { name: "Valley sky", absolute: { x: 0, y: 0 } });
+      drift(k, cloud(k, v, w * 0.1, h * 0.08, 0.7, "cloud", seed), "translateX", 30, 0.05);
+      vec(k, v, hillPts(0, w, h * 0.6, 26, 2, seed + 1, h), "hillFar", { name: "Far hill" });
+      vec(k, v, hillPts(0, w, h * 0.72, 30, 1.6, seed + 2, h), "hill", { name: "Mid hill" });
+      vec(k, v, hillPts(0, w, h * 0.86, 18, 1.2, seed + 3, h), "hillNear", { name: "Near hill" });
+      return v;
+    };
+    {
+      k.rect(boot, W, H, [k.gradient({ from: "skyWarm", to: "cream", kind: "RADIAL", fromOpacity: 0.7, toOpacity: 0, handles: [{ x: 0.5, y: 0.4 }, { x: 1, y: 0.4 }, { x: 0.5, y: 0.95 }] })], { name: "Warm glow", absolute: { x: 0, y: 0 } });
+      kettle(k, boot, 750, 180);
+      k.logo(boot, 110, 110, { absolute: { x: 905, y: 590 }, placeholder: "tile" });
+      label(k, boot, "{{brand.studio}}", "Studio 34", "bark", 160, 730, { w: 1600, align: "CENTER", name: "Studio" });
+      label(k, boot, "presents", "Presents 20", "soft", 0, 790, { w: W, align: "CENTER", name: "Presents" });
+      const dots = box(k, boot, 900, 880, 120, 30, { name: "Loading dots" });
+      [0, 1, 2].forEach((i) => {
+        const d = blob(k, dots, 20 + i * 40, 15, 9, 9, ["terracotta", "butter", "sage"][i], { name: "Dot", seed: 100 + i });
+        drift(k, d, "translateY", 7, 1.2, i * 0.18);
+      });
+      hint(boot, "Warming the kettle\u2026", 0, 930, W, "CENTER");
+      k.cues(boot, [
+        { layer: "Kettle", preset: "pop-in", at: 0 },
+        { layer: "{{brand.logo}}", preset: "scale-in", at: 400 },
+        { layer: "Studio", preset: "rise-in", at: 700 },
+        { layer: "Presents", preset: "fade-in", at: 1100 }
+      ]);
+      k.link(boot, title, "DISSOLVE", { trigger: "AFTER_TIMEOUT", delay: 3500, duration: 700 });
+      k.link(boot, title, "DISSOLVE", { key: "*", duration: 500 });
+      k.link(boot, title, "DISSOLVE", { duration: 500 });
+    }
+    {
+      k.rect(title, W, H, [k.gradient({ from: "sky", to: "skyWarm", angle: 90, fromOpacity: 0, toOpacity: 0.9 })], { name: "Golden hour", absolute: { x: 0, y: 0 } });
+      const sun = blob(k, title, 1500, 560, 110, 110, "butter", { name: "Low sun", effects: [glow(k, "butter", 60, 0.8)], wob: 0.02 });
+      drift(k, sun, "translateY", 6, 0.1);
+      [[180, 120, 1, 1], [760, 70, 0.8, 5], [1320, 170, 1.1, 9]].forEach(([x, y, s, seed], i) => drift(k, cloud(k, title, x, y, s, "cloud", seed), "translateX", 40 + i * 10, 0.03 + i * 0.01, i * 0.3));
+      vec(k, title, hillPts(0, W, 640, 40, 2.4, 11), "hillFar", { name: "Far hills" });
+      windmill(k, title, 250, 380, 0.9, 28);
+      vec(k, title, hillPts(0, W, 760, 50, 1.8, 12), "hill", { name: "Mid hills" });
+      house(k, title, 1260, 540, 0.6);
+      vec(k, title, [[0, 860], [500, 820], [900, 850], [1300, 800], [1920, 830], [1920, 900], [1300, 870], [900, 920], [500, 890], [0, 930]], "water", { name: "Brook", opacity: 0.85 });
+      vec(k, title, hillPts(0, W, 920, 30, 1.2, 13), "hillNear", { name: "Near hills" });
+      tree(k, title, 60, 560, 1, 21);
+      tree(k, title, 1640, 600, 0.8, 23);
+      [[700, 200], [760, 230], [820, 190]].forEach(([x, y], i) => {
+        const b = poly(k, title, [[x, y], [x + 14, y + 10], [x + 28, y]], "bark", { name: "Bird", stroke: 3 });
+        drift(k, b, "translateX", 60, 0.05, i * 0.2);
+        drift(k, b, "translateY", 10, 0.4, i * 0.3);
+      });
+      const lock = box(k, title, 260, 150, 1400, 380, { name: "Title lockup", gap: 10, align: "CENTER" });
+      k.text(lock, "{{brand.title}}", { style: "Title 140", color: "bark", width: 1400, align: "CENTER", name: "Title" });
+      k.text(lock, "{{brand.tagline}}", { style: "Tagline 30", color: "bark", width: 1400, align: "CENTER", name: "Tagline" });
+      const pill = box(k, title, 700, 950, 520, 64, { name: "Prompt", fill: "parchment", radius: 32, align: "CENTER", justify: "CENTER", stroke: { color: "stitch", width: 2 }, effects: [soft(k)] });
+      k.text(pill, "Press any key", { style: "Prompt 24", color: "bark", autoWidth: true, name: "Prompt words" });
+      drift(k, pill, "translateY", 5, 0.5);
+      label(k, title, '\xA9 2026 {{brand.studio}}  \xB7  version 0.7, "Clover"', "Small 18", "bark", 0, 1036, { w: W, align: "CENTER", name: "Legal" });
+      k.cues(title, [{ layer: "Title lockup", preset: "rise-in", at: 200 }, { layer: "Prompt", preset: "fade-in", at: 1200 }]);
+      k.link(title, main, "DISSOLVE", { key: "*", duration: 450 });
+      k.link(title, main, "DISSOLVE", { duration: 450 });
+    }
+    {
+      k.rect(main, W, H, [k.gradient({ from: "linen", to: "cream", angle: 90, fromOpacity: 0.8, toOpacity: 0 })], { name: "Wash", absolute: { x: 0, y: 0 } });
+      label(k, main, "{{brand.title}}", "Heading 60", "bark", 140, 70, { w: 800, name: "Wordmark" });
+      const q = quilt(k, main, 100, 250, 840, 580, { name: "Menu quilt" });
+      menu(k, q, [
+        { label: "Continue", actions: [toFarm] },
+        { label: "New farm", actions: [set(newFocus.id, { value: 0 }), go(newFarm, "PUSH_FROM_RIGHT", { duration: 400 })] },
+        { label: "Settings", actions: [go(settings, "PUSH_FROM_RIGHT", { duration: 400 })] },
+        { label: "Credits", actions: [go(credits, "DISSOLVE", { duration: 500 })] },
+        { label: "Quit to title", actions: [go(title, "DISSOLVE", { duration: 500 })] }
+      ], { focus: menuFocus, x: 36, y: 44, width: 768, pitch: 100, itemHeight: 84, style: "Menu 40", color: "bark", plate: k.tint("butter", 0.75), marker: { color: "terracotta" }, radius: 24 });
+      const comp = box(k, main, 948, 272, 150, 130, { name: "Companion" });
+      PETS.forEach((p, i) => {
+        const a = petArt(k, comp, p.kind, 0, 0);
+        k.bindExpression(a, "visible", `${petIdx.n} == ${i}`);
+      });
+      k.bindExpression(comp, "translateY", `${petFollow.n} == 1 ? ${menuFocus.n} * 100 : 0`);
+      const art = quilt(k, main, 1110, 100, 730, 830, { name: "Farm picture", seed: 17 });
+      const v = valley(k.stack(art, { name: "Window", width: 670, height: 600, absolute: { x: 30, y: 30 }, clip: true, radius: 22 }), 0, 0, 670, 600, 31);
+      house(k, v, 60, 250, 0.72);
+      tree(k, v, 480, 190, 0.7, 33);
+      mailbox(k, v, 380, 340, 1.1, `${unread.n} > 0`);
+      readout(k, art, `${farmName.n} + " Farm"`, "Bramblewick Farm", "Card 28", "bark", 30, 660, { w: 670, align: "CENTER", name: "Farm name" });
+      const note = readout(k, art, `${unread.n} > 0 ? "A letter is waiting in the mailbox" : "The mailbox is empty for now"`, "A letter is waiting in the mailbox", "Hint 20", "soft", 30, 712, { w: 670, align: "CENTER", name: "Mail note" });
+      void note;
+      hint(main, "\u2191 \u2193  choose      ENTER  open      or point and click", 140, 870, 800);
+      k.cues(main, [{ layer: "Menu item", preset: "slide-in", at: 0, params: { direction: "left" }, stagger: { delay: 70 } }, { layer: "Farm picture", preset: "rise-in", at: 150 }]);
+    }
+    {
+      label(k, newFarm, "A new farm", "Heading 60", "bark", 140, 70, { name: "Screen title" });
+      label(k, newFarm, "Every valley needs a keeper. Who are you, and who is coming with you?", "Body 24", "soft", 142, 150, { w: 1e3, name: "Screen lead" });
+      const q = quilt(k, newFarm, 100, 210, 1020, 660, { name: "Choices" });
+      focusColumn(k, q, { focus: newFocus, count: 4, x: 24, y: 40, w: 972, pitch: 144, plate: k.tint("butter", 0.55), escape: [back()], radius: 22 });
+      const lists = [
+        { title: "Your name", v: farmerName, idx: farmerIdx, words: FARMERS },
+        { title: "Your farm", v: farmName, idx: farmIdx, words: FARMS },
+        { title: "Your companion", v: petName, idx: petIdx, words: PETS.map((p) => p.name) }
+      ];
+      const stepTo = (l, d) => [
+        set(l.idx.id, { expression: `(${l.idx.n} + ${d + l.words.length}) % ${l.words.length}` }),
+        set(l.v.id, { expression: pickText(l.idx.n, l.words) })
+      ];
+      lists.forEach((l, i) => {
+        const row = box(k, q, 40, 46 + i * 144, 940, 128, { name: `${l.title} row` });
+        label(k, row, l.title, "Small 18", "soft", 20, 14, { name: "Row title" });
+        const prev = box(k, row, 330, 44, 64, 64, { name: "Previous", radius: 32, fill: "linen", stroke: { color: "stitch", width: 2 } });
+        poly(k, prev, [[40, 18], [22, 32], [40, 46]], "bark", { name: "Chevron", stroke: 5 });
+        readout(k, row, l.v.n, l.words[0], "Menu 40", "bark", 400, 50, { w: 420, align: "CENTER", name: "Choice" });
+        const next = box(k, row, 830, 44, 64, 64, { name: "Next", radius: 32, fill: "linen", stroke: { color: "stitch", width: 2 } });
+        poly(k, next, [[24, 18], [42, 32], [24, 46]], "bark", { name: "Chevron", stroke: 5 });
+        onAll(k, prev, [set(newFocus.id, { value: i }), ...stepTo(l, -1)]);
+        onAll(k, next, [set(newFocus.id, { value: i }), ...stepTo(l, 1)]);
+        focusRow(k, row, newFocus, i);
+        for (const key of ["ArrowLeft", "a"]) k.on(row, when([{ if: `${newFocus.n} == ${i}`, then: stepTo(l, -1) }]), { key });
+        for (const key of ["ArrowRight", "d"]) k.on(row, when([{ if: `${newFocus.n} == ${i}`, then: stepTo(l, 1) }]), { key });
+      });
+      const begin = box(k, q, 40, 46 + 3 * 144, 940, 128, { name: "Begin row" });
+      const beginBtn = k.instance(begin, "Cosy button", { Label: "Begin your first spring  ENTER" }, { name: "Begin", absolute: { x: 20, y: 34 } });
+      onAll(k, beginBtn, [...newRun, toFarm]);
+      focusRow(k, begin, newFocus, 3);
+      k.on(q, when([{ if: `${newFocus.n} == 3`, then: [...newRun, toFarm] }, { then: [set(newFocus.id, { expression: `${newFocus.n} + 1`, glide: 140 })] }]), { key: "Enter" });
+      const pv = quilt(k, newFarm, 1200, 210, 620, 660, { name: "Preview", seed: 23 });
+      const scene = valley(k.stack(pv, { name: "Preview window", width: 560, height: 440, absolute: { x: 30, y: 30 }, clip: true, radius: 22 }), 0, 0, 560, 440, 41);
+      const sign = box(k, scene, 140, 24, 280, 120, { name: "Sign" });
+      vec(k, sign, [[130, 70], [150, 70], [150, 120], [130, 120]], "woodDark", { name: "Sign post", sharp: true });
+      const board = box(k, sign, 0, 0, 280, 76, { name: "Sign board", fill: "woodDark", radius: 14, align: "CENTER", justify: "CENTER", padding: 8 });
+      k.text(board, "Bramblewick Farm", { style: "Card 28", color: "onClay", width: 264, align: "CENTER", name: "Sign words" });
+      k.bindExpression(k.named(board, "Sign words")[0], "characters", `${farmName.n} + " Farm"`);
+      pivot(k, sign, 0.5, 1);
+      drift(k, sign, "rotation", 1.5, 0.3);
+      farmer(k, scene, 110, 170, 1);
+      PETS.forEach((p, i) => {
+        const a = petArt(k, scene, p.kind, 320, 290);
+        k.bindExpression(a, "visible", `${petIdx.n} == ${i}`);
+      });
+      readout(k, pv, `${farmerName.n} + " & " + ${petName.n}`, "Wren & Biscuit", "Card 28", "bark", 30, 500, { w: 560, align: "CENTER", name: "Pair" });
+      readout(k, pv, pickText(petIdx.n, PETS.map((p) => p.blurb)), PETS[0].blurb, "Hint 20", "soft", 30, 548, { w: 560, align: "CENTER", name: "Companion blurb" });
+      hint(newFarm, "\u2191 \u2193  row      LEFT RIGHT  choose      ENTER  next / begin      ESC  back", 140, 910, 1400);
+      k.cues(newFarm, [{ layer: "Choices", preset: "rise-in", at: 0 }, { layer: "Preview", preset: "rise-in", at: 160 }]);
+    }
+    {
+      label(k, settings, "Settings", "Heading 60", "bark", 140, 70, { name: "Screen title" });
+      const q = quilt(k, settings, 100, 170, 1160, 760, { name: "Settings quilt" });
+      focusColumn(k, q, { focus: setFocus, count: 8, x: 24, y: 32, w: 1112, pitch: 86, plate: k.tint("butter", 0.55), guard: `${rebind.n} == ""`, escape: [back()], radius: 20 });
+      const common = { labelStyle: "Label 26", ink: "bark" };
+      const sl = { ...common, valueStyle: "Value 26", track: "linen", fill: "moss", knob: "terracotta" };
+      const at = (i) => ({ x: 40, y: 42 + i * 86, width: 1080, focus: { n: setFocus.n, index: i } });
+      const rows = [
+        slider(k, q, { ...sl, ...at(0), label: "Music", variable: music, suffix: "%" }),
+        slider(k, q, { ...sl, ...at(1), label: "Ambience", variable: ambience, suffix: "%" }),
+        slider(k, q, { ...sl, ...at(2), label: "Text speed", variable: textSpeed, min: 1, max: 5, step: 1 }),
+        toggle(k, q, { ...common, ...at(3), label: "Pet follows cursor", variable: petFollow }),
+        toggle(k, q, { ...common, ...at(4), label: "24-hour clock", variable: clock24 })
+      ];
+      const kb = { ...common, capStyle: "Cap 22", cap: "linen", onCap: "bark", listening: "butter", rebind };
+      rows.push(keybind(k, q, { ...kb, ...at(5), action: "Use tool", slot: "use", variable: keyUse }));
+      rows.push(keybind(k, q, { ...kb, ...at(6), action: "Sell basket", slot: "sell", variable: keySell }));
+      rows.push(keybind(k, q, { ...kb, ...at(7), action: "Pass time", slot: "time", variable: keyTime }));
+      rows.forEach((r, i) => focusRow(k, r, setFocus, i));
+      rebindListener(k, settings, rebind, [{ slot: "use", variable: keyUse }, { slot: "sell", variable: keySell }, { slot: "time", variable: keyTime }]);
+      const pv = quilt(k, settings, 1320, 170, 500, 760, { name: "Settings preview", seed: 29 });
+      label(k, pv, "A taste of it", "Small 18", "soft", 40, 40, { name: "Preview title" });
+      const bars = box(k, pv, 40, 80, 420, 120, { name: "Music bars" });
+      for (let i = 0; i < 9; i++) {
+        const f = 0.4 + 0.6 * Math.abs(Math.sin(i * 1.7 + 0.4));
+        const b2 = k.rect(bars, 30, 100, ["sage", "butter", "terracotta"][i % 3], { name: "Music bar", radius: 12, absolute: { x: i * 46, y: 20 } });
+        k.bindExpression(b2, "height", `12 + ${music.n} * ${f.toFixed(2)}`);
+        k.bindExpression(b2, "y", `108 - ${music.n} * ${f.toFixed(2)}`);
+        drift(k, b2, "scaleY", 0.12, 0.8 + i * 0.1, i * 0.13);
+      }
+      readout(k, pv, `"Music  " + round(${music.n}) + "%   \xB7   Ambience  " + round(${ambience.n}) + "%"`, "Music  70%   \xB7   Ambience  60%", "Hint 20", "soft", 40, 212, { w: 420, name: "Levels" });
+      const bubble = box(k, pv, 40, 260, 420, 200, { name: "Dialogue", fill: "linen", radius: 26, padding: 22, gap: 6 });
+      k.text(bubble, "Marigold", { style: "Small 18", color: "clay", name: "Speaker" });
+      k.text(bubble, "\u201CMorning! Lovely day to get your hands in the soil.\u201D", { style: "Letter 28", color: "bark", name: "Dialogue line" });
+      readout(k, pv, `"Text speed: " + (${pickText(`round(${textSpeed.n}) - 1`, TEXT_SPEEDS)})`, "Text speed: Steady", "Label 26", "bark", 40, 480, { w: 420, name: "Speed word" });
+      readout(k, pv, `${clock24.n} == 1 ? "18:30" : "6:30 pm"`, "6:30 pm", "Clock 44", "bark", 40, 530, { w: 420, name: "Clock sample" });
+      readout(k, pv, `${petFollow.n} == 1 ? "Your companion trots after the cursor" : "Your companion naps by the fire"`, "Your companion trots after the cursor", "Hint 20", "soft", 40, 600, { w: 420, name: "Companion note" });
+      const b = k.instance(settings, "Cosy button", { Label: "Back  ESC" }, { name: "Back", absolute: { x: 1660, y: 960 } });
+      k.on(b, back());
+      hint(settings, "\u2191 \u2193  row      LEFT RIGHT  adjust      ENTER  toggle / rebind      ESC  back", 140, 966, 1300);
+    }
+    {
+      for (let i = 0; i < 24; i++) {
+        const r = rng(i + 300);
+        const s = k.ellipse(credits, 3 + Math.round(r() * 3), "onNight", { name: "Star", absolute: { x: r() * W, y: r() * 600 } });
+        drift(k, s, "opacity", 0.35, 0.3 + r(), r());
+      }
+      blob(k, credits, 1620, 170, 70, 70, "cream", { name: "Moon", effects: [glow(k, "cream", 50, 0.6)], wob: 0.02 });
+      vec(k, credits, hillPts(0, W, 860, 50, 1.8, 51), "nightHill", { name: "Night hills" });
+      for (let i = 0; i < 16; i++) {
+        const r = rng(i + 400);
+        const f = k.ellipse(credits, 10, "firefly", { name: "Firefly", absolute: { x: r() * W, y: 700 + r() * 340 }, effects: [glow(k, "firefly", 16)] });
+        drift(k, f, "translateX", 30, 0.1 + r() * 0.2, r());
+        drift(k, f, "translateY", 20, 0.2 + r() * 0.2, r());
+        drift(k, f, "opacity", 0.4, 0.6 + r(), r());
+      }
+      const roll = box(k, credits, 460, 50, 1e3, 980, { name: "Credits roll", gap: 22, align: "CENTER" });
+      k.text(roll, "With love, from the valley", { style: "Heading 60", color: "onNight", align: "CENTER", name: "Roll title" });
+      for (const [role, name] of CREDITS) {
+        const g = k.stack(roll, { gap: 4, align: "CENTER", name: "Credit" });
+        k.text(g, role, { style: "Credit role 20", color: "butter", align: "CENTER", name: "Role" });
+        k.text(g, name, { style: "Credit name 34", color: "onNight", align: "CENTER", name: "Name" });
+      }
+      k.text(roll, "Made at {{brand.studio}} with a great deal of tea", { style: "Credit role 20", color: "butter", align: "CENTER", name: "Sign-off" });
+      keys(k, roll, "translateY", [{ t: 0, v: 1080, ease: { kind: "linear" } }, { t: 14500, v: -1150 }]);
+      k.link(credits, main, "DISSOLVE", { key: "*", duration: 400 });
+      k.link(credits, main, "DISSOLVE", { duration: 400 });
+    }
+    {
+      k.rect(hud, W, H, [k.gradient({ from: "sky", to: "skyWarm", angle: 90, fromOpacity: 0, toOpacity: 0.8 })], { name: "Horizon glow", absolute: { x: 0, y: 0 } });
+      const stars = box(k, hud, 0, 0, W, 500, { name: "Stars" });
+      for (let i = 0; i < 18; i++) {
+        const r = rng(i + 500);
+        const s = k.ellipse(stars, 3 + Math.round(r() * 3), "onNight", { name: "Star", absolute: { x: r() * W, y: r() * 460 } });
+        drift(k, s, "opacity", 0.4, 0.3 + r(), r());
+      }
+      k.bindExpression(stars, "visible", nightExpr);
+      const sun = box(k, hud, 0, 0, 160, 160, { name: "Sun" });
+      const rays = k.star(sun, 160, k.tint("butter", 0.6), { name: "Sun rays" });
+      pivot(k, rays, 0.5, 0.5);
+      spin(k, rays, 8);
+      blob(k, sun, 80, 80, 52, 52, "butter", { name: "Sun disc", effects: [glow(k, "butter", 40, 0.8)], wob: 0.02 });
+      k.bindExpression(sun, "x", `100 + (${hour.n} - 6) / 14 * 1300`);
+      k.bindExpression(sun, "y", `80 + pow((${hour.n} - 13) / 7, 2) * 320`);
+      k.bindExpression(sun, "visible", `${hour.n} < 20`);
+      const moon = box(k, hud, 1040, 90, 140, 140, { name: "Moon" });
+      blob(k, moon, 70, 70, 50, 50, "cream", { name: "Moon disc", effects: [glow(k, "cream", 40, 0.7)], wob: 0.02 });
+      blob(k, moon, 54, 60, 10, 8, "linen", { name: "Crater", seed: 3 });
+      blob(k, moon, 86, 88, 7, 6, "linen", { name: "Crater", seed: 4 });
+      k.bindExpression(moon, "visible", `${hour.n} >= 19`);
+      drift(k, moon, "translateY", 6, 0.1);
+      const clouds = box(k, hud, 0, 0, W, 400, { name: "Clouds" });
+      [[260, 70, 0.9, 1], [980, 150, 0.7, 5], [1500, 40, 0.8, 9]].forEach(([x, y, s, seed], i) => drift(k, cloud(k, clouds, x, y, s, "cloud", seed), "translateX", 50, 0.03 + i * 0.01, i * 0.4));
+      const rainClouds = box(k, hud, 0, 0, W, 400, { name: "Rain clouds" });
+      [[140, 60, 1.2, 2], [760, 30, 1.3, 6], [1340, 70, 1.2, 10]].forEach(([x, y, s, seed], i) => drift(k, cloud(k, rainClouds, x, y, s, "stone", seed), "translateX", 30, 0.03 + i * 0.01, i * 0.4));
+      k.bindExpression(rainClouds, "visible", `${weather.n} == 2`);
+      vec(k, hud, hillPts(0, W, 470, 34, 2.2, 61), "hillFar", { name: "Far hills" });
+      windmill(k, hud, 640, 250, 0.5, 30);
+      vec(k, hud, hillPts(0, W, 560, 40, 1.6, 62), "hill", { name: "Mid hills" });
+      const home = house(k, hud, 1080, 250, 1);
+      tree(k, hud, 20, 180, 1.1, 63);
+      vec(k, hud, hillPts(0, W, 640, 22, 1.1, 64), "field", { name: "Home field" });
+      for (let i = 0; i < 8; i++) {
+        const px = 30 + i * 70;
+        vec(k, hud, [[px, 632], [px + 9, 620], [px + 18, 632], [px + 18, 700], [px, 700]], "wood", { name: "Fence post", sharp: true });
+      }
+      vec(k, hud, [[20, 648], [590, 648], [590, 658], [20, 658]], "woodDark", { name: "Fence rail", sharp: true });
+      vec(k, hud, [[20, 676], [590, 676], [590, 686], [20, 686]], "woodDark", { name: "Fence rail", sharp: true });
+      vec(k, hud, softRectPts(640, 630, 660, 214, 40, 71, 5), "soil", { name: "Plot", stroke: { color: "soilDark", width: 4 } });
+      const wet = vec(k, hud, softRectPts(652, 640, 636, 194, 34, 72, 4), "soilWet", { name: "Wet soil", opacity: 0.75 });
+      k.bindExpression(wet, "visible", `${watered.n} == 1`);
+      for (let r = 0; r < 2; r++) poly(k, hud, [[680, 700 + r * 90], [1260, 704 + r * 90]], "soilDark", { name: "Furrow", stroke: 4 });
+      const calm = box(k, hud, 0, 0, W, H, { name: "Crops calm" });
+      const windy = box(k, hud, 0, 0, W, H, { name: "Crops windy" });
+      for (let r = 0; r < 2; r++) for (let c = 0; c < 3; c++) {
+        crop(k, calm, 750 + c * 220, 720 + r * 92, stage, 200 + r * 3 + c, [2, 0.35]);
+        crop(k, windy, 750 + c * 220, 720 + r * 92, stage, 200 + r * 3 + c, [11, 0.9]);
+      }
+      k.bindExpression(calm, "visible", `${weather.n} != 1`);
+      k.bindExpression(windy, "visible", `${weather.n} == 1`);
+      const me = farmer(k, hud, 440, 500);
+      const sweat = blob(k, me, 138, 44, 7, 11, "water", { name: "Sweat drop" });
+      k.bindExpression(sweat, "visible", `${energy.n} < 30`);
+      drift(k, sweat, "translateY", 4, 1.4);
+      const buddy = box(k, hud, 290, 640, 150, 130, { name: "Companion" });
+      PETS.forEach((p, i) => {
+        const a = petArt(k, buddy, p.kind, 0, 0);
+        k.bindExpression(a, "visible", `${petIdx.n} == ${i}`);
+      });
+      const love = heart(k, buddy, 90, -30, 36, "rose", "Treat heart");
+      k.bindExpression(love, "visible", `${treats.n} > 0`);
+      drift(k, love, "translateY", 6, 0.9);
+      mailbox(k, hud, 1330, 470, 1, `${unread.n} > 0`);
+      const rain = box(k, hud, 0, 0, W, H, { name: "Drizzle" });
+      for (let i = 0; i < 26; i++) {
+        const r = rng(i + 600), x = r() * W, y = r() * 900;
+        const d = poly(k, rain, [[x, y], [x - 10, y + 34]], "rain", { name: "Raindrop", stroke: 3, opacity: 0.7 });
+        k.behave(d, "translateY", [{ kind: "spin", rate: 420 + r() * 200 }, { kind: "mod", period: 180, offset: 0 }]);
+      }
+      k.bindExpression(rain, "visible", `${weather.n} == 2`);
+      k.bindExpression(rain, "opacity", `0.4 + ${ambience.n} / 170`);
+      const gust = box(k, hud, 0, 0, W, H, { name: "Wind leaves" });
+      for (let i = 0; i < 12; i++) {
+        const r = rng(i + 700);
+        const l = blob(k, gust, 40 + r() * 1700, 120 + r() * 640, 12, 6, i % 2 ? "leaf" : "straw", { name: "Leaf", seed: 700 + i });
+        k.behave(l, "translateX", [{ kind: "spin", rate: 160 + r() * 120 }, { kind: "mod", period: 400, offset: 0 }]);
+        drift(k, l, "translateY", 24, 0.6 + r() * 0.4, r());
+        drift(k, l, "rotation", 50, 0.8, r());
+      }
+      k.bindExpression(gust, "visible", `${weather.n} == 1`);
+      const haze = k.rect(hud, W, H, "haze", { name: "Dawn haze", absolute: { x: 0, y: 0 } });
+      k.bindExpression(haze, "opacity", `clamp((8 - ${hour.n}) / 2, 0, 1) * 0.22`);
+      const dusk = k.rect(hud, W, H, "warm", { name: "Dusk warmth", absolute: { x: 0, y: 0 } });
+      k.bindExpression(dusk, "opacity", `max(0, 1 - abs(${hour.n} - 18) / 3) * 0.34`);
+      const nightTint = k.rect(hud, W, H, "cool", { name: "Night cool", absolute: { x: 0, y: 0 } });
+      k.bindExpression(nightTint, "opacity", `clamp((${hour.n} - 17.5) / 4, 0, 1) * 0.66`);
+      const lamp = k.ellipse(hud, 120, k.tint("butter", 0.55), { name: "Lamplight", absolute: { x: home.window[0] - 25, y: home.window[1] - 28 }, effects: [glow(k, "butter", 40, 0.9)] });
+      k.bindExpression(lamp, "visible", `${hour.n} >= 18`);
+      const flies = box(k, hud, 0, 0, W, H, { name: "Fireflies" });
+      for (let i = 0; i < 14; i++) {
+        const r = rng(i + 800);
+        const f = k.ellipse(flies, 10, "firefly", { name: "Firefly", absolute: { x: 80 + r() * 1300, y: 420 + r() * 380 }, effects: [glow(k, "firefly", 18)] });
+        drift(k, f, "translateX", 40, 0.08 + r() * 0.15, r());
+        drift(k, f, "translateY", 26, 0.15 + r() * 0.2, r());
+        drift(k, f, "opacity", 0.4, 0.5 + r(), r());
+      }
+      k.bindExpression(flies, "visible", `${hour.n} >= 20`);
+      const cal = quilt(k, hud, 36, 30, 600, 176, { name: "Calendar", seed: 81 });
+      const clockFace = k.instance(cal, "Clock face", {}, { name: "Clock face", absolute: { x: 30, y: 36 } });
+      readout(k, cal, dateLine, "Spring 3 \xB7 Wed", "Calendar 32", "bark", 128, 28, { w: 320, name: "Date" });
+      readout(k, cal, clockLine, "6:00 am", "Clock 44", "bark", 128, 70, { w: 300, name: "Clock" });
+      readout(k, cal, `${farmName.n} + " farm \xB7 year one"`, "Bramblewick farm \xB7 year one", "Small 18", "soft", 32, 134, { w: 400, name: "Farm line" });
+      const wx = box(k, cal, 462, 26, 110, 96, { name: "Weather icon" });
+      const sunny = box(k, wx, 0, 0, 110, 96, { name: "Sunny" });
+      const sr = k.star(sunny, 84, "straw", { name: "Rays", absolute: { x: 13, y: 6 } });
+      pivot(k, sr, 0.5, 0.5);
+      spin(k, sr, 20);
+      k.ellipse(sunny, 48, "butter", { name: "Disc", absolute: { x: 31, y: 24 } });
+      k.bindExpression(sunny, "visible", `${weather.n} == 0`);
+      const windyIc = box(k, wx, 0, 0, 110, 96, { name: "Windy" });
+      [0, 1, 2].forEach((i) => {
+        const w = poly(k, windyIc, [[14, 30 + i * 20], [60, 28 + i * 20], [80, 18 + i * 20], [70, 8 + i * 20]], "dusk", { name: "Gust line", stroke: 5 });
+        drift(k, w, "translateX", 6, 0.8, i * 0.2);
+      });
+      k.bindExpression(windyIc, "visible", `${weather.n} == 1`);
+      const rainy = box(k, wx, 0, 0, 110, 96, { name: "Drizzly" });
+      cloud(k, rainy, 4, 0, 0.36, "stone", 3);
+      [0, 1, 2].forEach((i) => {
+        const d = poly(k, rainy, [[30 + i * 22, 58], [24 + i * 22, 76]], "rain", { name: "Drop", stroke: 4 });
+        drift(k, d, "translateY", 4, 1.4, i * 0.3);
+      });
+      k.bindExpression(rainy, "visible", `${weather.n} == 2`);
+      readout(k, cal, weatherWord, "Sunny", "Small 18", "bark", 440, 132, { w: 150, align: "CENTER", name: "Weather word" });
+      const late = box(k, hud, 670, 40, 620, 56, { name: "Late note", fill: "clay", radius: 28, align: "CENTER", justify: "CENTER", effects: [soft(k)] });
+      k.text(late, "It's late \u2014 the bed is calling (Z)", { style: "Label 26", color: "onClay", autoWidth: true, name: "Late words" });
+      k.bindExpression(late, "visible", `${hour.n} >= 22`);
+      drift(k, late, "translateY", 3, 0.8);
+      const purse = quilt(k, hud, 1520, 110, 364, 100, { name: "Purse", seed: 83 });
+      icon(k, purse, "coin", 28, 24, 0.52);
+      readout(k, purse, `group(${coins.n})`, "120", "Coins 40", "bark", 96, 24, { w: 170, name: "Coins" });
+      label(k, purse, "coins", "Small 18", "soft", 272, 38, { name: "Coins label" });
+      const coinPop = k.instance(hud, "Coin pop", {}, { name: "Coin pop", absolute: { x: 1480, y: 216 } });
+      const acts = quilt(k, hud, 1520, 300, 364, 440, { name: "Around the farm", seed: 85 });
+      label(k, acts, "Around the farm", "Small 18", "soft", 34, 30, { name: "Actions title" });
+      const btn = (i, text, actions) => {
+        const b = k.instance(acts, "Cosy button", { Label: text }, { name: "Farm button", absolute: { x: 34, y: 68 + i * 70 } });
+        onAll(k, b, actions);
+        return b;
+      };
+      btn(0, "Crafting bench  C", [set(craftFocus.id, { value: 0 }), toCraft]);
+      btn(1, "Backpack  I", [overlay(pack)]);
+      btn(2, "Market stall  B", [toShop]);
+      btn(3, "Letters  M", [set(unread.id, { value: 0 }), overlay(letters)]);
+      const dot = k.ellipse(acts, 18, "accent", { name: "Unread dot", absolute: { x: 300, y: 292 } });
+      k.bindExpression(dot, "visible", `${unread.n} > 0`);
+      drift(k, dot, "scaleX", 0.15, 1.2);
+      drift(k, dot, "scaleY", 0.15, 1.2);
+      readout(k, acts, `"Basket: " + ${turnips.n} + " turnips, " + ${wood.n} + " wood, " + ${stone.n} + " stone, " + ${fibre.n} + " fibre"`, "Basket: 0 turnips, 3 wood, 1 stone, 2 fibre", "Hint 20", "soft", 34, 356, { w: 300, name: "Basket" });
+      const legend = quilt(k, hud, 1520, 760, 364, 260, { name: "Controls", seed: 87 });
+      [
+        [`${keyTime.n} + "   pass two hours"`, "T   pass two hours"],
+        ['"Z   sleep till morning"', "Z   sleep till morning"],
+        [`${keyUse.n} + "   use your tool"`, "SPACE   use your tool"],
+        [`"H   harvest   \xB7   " + ${keySell.n} + "   sell"`, "H   harvest   \xB7   S   sell"],
+        ['"1 \u2013 5   tools   \xB7   ESC   pause"', "1 \u2013 5   tools   \xB7   ESC   pause"]
+      ].forEach(([e, rest], i) => readout(k, legend, e, rest, "Hint 20", "bark", 34, 30 + i * 40, { w: 300, name: "Control line" }));
+      const vit = quilt(k, hud, 36, 870, 480, 150, { name: "Energy", seed: 89 });
+      label(k, vit, "Energy", "Small 18", "soft", 32, 26, { name: "Energy label" });
+      readout(k, vit, `round(${energy.n}) + " / " + ${maxEnergy.n}`, "100 / 100", "Value 26", "bark", 250, 20, { w: 200, align: "RIGHT", name: "Energy value" });
+      bar(k, vit, { x: 30, y: 62, w: 420, h: 30, value: energy.n, max: maxEnergy.n, back: "linen", fill: "leaf", chip: { expression: energyTrail.n, color: "straw" }, radius: 15, name: "Energy bar" });
+      const eFlash = k.instance(vit, "Energy flash", {}, { name: "Energy flash", absolute: { x: 30, y: 62 } });
+      readout(k, vit, `${energy.n} >= 60 ? "Feeling bright as a button" : ${energy.n} >= 30 ? "A little tuckered" : "Running on crumbs"`, "Feeling bright as a button", "Hint 20", "soft", 32, 104, { w: 420, name: "Mood" });
+      const tired = box(k, hud, 36, 806, 480, 52, { name: "Tired note", fill: "clay", radius: 26, align: "CENTER", justify: "CENTER", effects: [soft(k)] });
+      k.text(tired, "Rest soon \u2014 press Z to sleep", { style: "Label 26", color: "onClay", autoWidth: true, name: "Tired words" });
+      k.bindExpression(tired, "visible", `${energy.n} < 30 && ${energy.n} > 0`);
+      drift(k, tired, "translateY", 3, 1);
+      const hot = quilt(k, hud, 604, 846, 712, 140, { name: "Hotbar", seed: 91 });
+      TOOLS.forEach((t, i) => {
+        const slot = box(k, hot, 24 + i * 136, 15, 120, 110, { name: "Hotbar slot" });
+        vec(k, slot, softRectPts(0, 0, 120, 110, 22, 120 + i, 1.2), "linen", { name: "Slot plate" });
+        icon(k, slot, TOOL_ICONS[i], 22, 14, 0.78);
+        label(k, slot, String(i + 1), "Key 18", "bark", 12, 8, { name: "Slot number" });
+        onAll(k, slot, [set(tool.id, { value: i, glide: 160 })]);
+      });
+      const ring = k.rect(hot, 132, 122, [], { name: "Tool ring", radius: 26, stroke: { color: "terracotta", width: 5 }, absolute: { x: 18, y: 9 }, effects: [glow(k, "terracotta", 12, 0.6)] });
+      k.bindExpression(ring, "x", `18 + ${tool.n} * 136`);
+      drift(k, ring, "translateY", 2, 0.9);
+      const toolPill = box(k, hud, 780, 784, 360, 52, { name: "Tool name", fill: "parchment", radius: 26, align: "CENTER", justify: "CENTER", stroke: { color: "stitch", width: 2 } });
+      k.text(toolPill, "Hoe", { style: "Label 26", color: "bark", width: 340, align: "CENTER", name: "Tool word" });
+      k.bindExpression(k.named(toolPill, "Tool word")[0], "characters", toolWord);
+      const harvestPop = k.instance(hud, "Harvest pop", {}, { name: "Harvest pop", absolute: { x: 640, y: 560 } });
+      const puff = k.instance(hud, "Tool puff", {}, { name: "Tool puff", absolute: { x: 520, y: 560 } });
+      const harvest = [set(turnips.id, { expression: `${turnips.n} + 3` }), set(harvested.id, { expression: `${harvested.n} + 3` }), set(growth.id, { value: -1 })];
+      const ripe = `${stage} >= 2`;
+      const canUse = `${K} == ${keyUse.n} && ${energy.n} > 0`;
+      const canPlant = `${tool.n} == 0 && ${growth.n} < 0 && ${seeds.n} > 0`;
+      k.on(harvestPop, when([
+        { if: `upper($key) == "H" && ${ripe}`, then: [k.changeAction("Harvest pop/Pop", 0)] },
+        { if: 'upper($key) == "H"', then: [k.changeAction("Harvest pop/Nope", 0)] },
+        { if: `${canUse} && ${canPlant}`, then: [k.changeAction("Harvest pop/Planted", 0)] }
+      ]), { key: "*" });
+      k.on(harvestPop, when([{ if: ripe, then: [k.changeAction("Harvest pop/Pop", 0), ...harvest] }, { then: [k.changeAction("Harvest pop/Nope", 0)] }]));
+      k.on(coinPop, when([{ if: `${K} == ${keySell.n} && ${turnips.n} > 0`, then: [k.changeAction("Coin pop/Sold", 0)] }, { if: `${K} == ${keySell.n}`, then: [k.changeAction("Coin pop/Empty", 0)] }]), { key: "*" });
+      k.on(puff, when([{ if: canUse, then: [k.changeAction("Tool puff/Use", 0)] }]), { key: "*" });
+      k.on(eFlash, when([{ if: canUse, then: [k.changeAction("Energy flash/Hit", 0)] }]), { key: "*" });
+      k.on(clockFace, when([{ if: `${K} == ${keyTime.n} && ${hour.n} + 2 < 24`, then: [k.changeAction("Clock face/Tick", 0)] }]), { key: "*" });
+      const logic = box(k, hud, 0, 0, 1, 1, { name: "Game logic" });
+      k.on(logic, when([
+        ...[0, 1, 2, 3, 4].map((i) => ({ if: `$key == "${i + 1}"`, then: [set(tool.id, { value: i, glide: 160 })] })),
+        { if: canUse, then: [
+          set(energy.id, { expression: `max(0, ${energy.n} - ${ENERGY_COST})`, glide: 320 }),
+          set(energyTrail.id, { expression: energy.n, glide: 1100, easing: "EASE_IN_OUT" }),
+          when([
+            { if: canPlant, then: [set(seeds.id, { expression: `${seeds.n} - 1` }), set(growth.id, { value: 0 })] },
+            { if: `${tool.n} == 1`, then: [set(watered.id, { value: 1 })] },
+            { if: `${tool.n} == 2`, then: [set(wood.id, { expression: `${wood.n} + 1` })] },
+            { if: `${tool.n} == 3`, then: [set(stone.id, { expression: `${stone.n} + 1` })] },
+            { if: `${tool.n} == 4`, then: [set(fibre.id, { expression: `${fibre.n} + 1` })] }
+          ]),
+          when([{ if: `${energy.n} <= 0`, then: [
+            set(billed.id, { expression: `min(${coins.n}, ${CLINIC_BILL})` }),
+            set(coins.id, { expression: `${coins.n} - ${billed.n}`, glide: 1600, easing: "EASE_IN_OUT" }),
+            go(passed, "DISSOLVE", { duration: 1200 })
+          ] }])
+        ] },
+        { if: `${K} == ${keyTime.n} && ${hour.n} + 2 >= 24`, then: [set(hour.id, { value: 24 }), ...sleep(true)] },
+        { if: `${K} == ${keyTime.n}`, then: [set(hour.id, { expression: `${hour.n} + 2`, glide: 900, easing: "EASE_IN_OUT" })] },
+        { if: 'upper($key) == "Z"', then: sleep(false) },
+        { if: `upper($key) == "H" && ${ripe}`, then: harvest },
+        { if: `${K} == ${keySell.n} && ${turnips.n} > 0`, then: [
+          set(coins.id, { expression: `${coins.n} + ${turnips.n} * ${TURNIP_PRICE}`, glide: 1400, easing: "EASE_IN_OUT" }),
+          set(earned.id, { expression: `${earned.n} + ${turnips.n} * ${TURNIP_PRICE}` }),
+          set(turnips.id, { value: 0 })
+        ] },
+        { if: 'upper($key) == "C"', then: [set(craftFocus.id, { value: 0 }), toCraft] },
+        { if: 'upper($key) == "I"', then: [overlay(pack)] },
+        { if: 'upper($key) == "B"', then: [toShop] },
+        { if: 'upper($key) == "M"', then: [set(unread.id, { value: 0 }), overlay(letters)] }
+      ]), { key: "*" });
+      k.on(logic, overlay(pause), { key: "Escape" });
+      k.cues(hud, [{ layer: "Calendar", preset: "drop-in", at: 0 }, { layer: "Hotbar", preset: "rise-in", at: 120 }, { layer: "Energy", preset: "rise-in", at: 200 }, { layer: "Around the farm", preset: "slide-in", at: 260, params: { direction: "right" } }]);
+    }
+    const heading = (id, text, x, y, w) => label(k, id, text, "Heading 60", "bark", x, y, { name: "Screen title", ...w ? { w } : {} });
+    {
+      k.rect(craft, W, H, [k.gradient({ from: "seam", to: "linen", kind: "RADIAL", fromOpacity: 0, toOpacity: 0.9, handles: [{ x: 0.5, y: 0.5 }, { x: 1.1, y: 0.5 }, { x: 0.5, y: 1.2 }] })], { name: "Lamp glow", absolute: { x: 0, y: 0 } });
+      vec(k, craft, [[0, 0], [W, 0], [W, 70], [0, 84]], "woodDark", { name: "Beam", sharp: true });
+      ["hoe", "axe", "sickle"].forEach((t, i) => {
+        const g = icon(k, craft, t, 40 + i * 1760 / 2 - (i === 2 ? 40 : 0), 70, 0.9);
+        pivot(k, g, 0.5, 0);
+        drift(k, g, "rotation", 3, 0.3, i * 0.3);
+      });
+      const q = quilt(k, craft, 150, 110, 1620, 840, { name: "Crafting bench", seed: 101 });
+      heading(q, "Crafting bench", 60, 44);
+      readout(k, q, `"In your basket:  " + ${wood.n} + " wood  \xB7  " + ${stone.n} + " stone  \xB7  " + ${fibre.n} + " fibre  \xB7  " + ${turnips.n} + " turnips"`, "In your basket:  3 wood  \xB7  1 stone  \xB7  2 fibre  \xB7  0 turnips", "Label 26", "soft", 62, 126, { w: 1400, name: "Materials" });
+      const RECIPES = [
+        { name: "Wooden fence", cost: "2 wood", icon: "fence", can: `${wood.n} >= 2`, need: `"Needs " + (2 - ${wood.n}) + " more wood"`, use: [set(wood.id, { expression: `${wood.n} - 2` })], made: fences, pop: "+1 fence" },
+        { name: "Stone path", cost: "2 stone", icon: "path", can: `${stone.n} >= 2`, need: `"Needs " + (2 - ${stone.n}) + " more stone"`, use: [set(stone.id, { expression: `${stone.n} - 2` })], made: paths, pop: "+1 path" },
+        { name: "Scarecrow", cost: "3 fibre  \xB7  1 wood", icon: "scarecrow", can: `${fibre.n} >= 3 && ${wood.n} >= 1`, need: `${fibre.n} < 3 ? "Needs " + (3 - ${fibre.n}) + " more fibre" : "Needs 1 more wood"`, use: [set(fibre.id, { expression: `${fibre.n} - 3` }), set(wood.id, { expression: `${wood.n} - 1` })], made: scarecrows, pop: "+1 scarecrow" },
+        { name: "Turnip preserves", cost: "2 turnips", icon: "jar", can: `${turnips.n} >= 2`, need: `"Needs " + (2 - ${turnips.n}) + " more turnips"`, use: [set(turnips.id, { expression: `${turnips.n} - 2` })], made: jars, pop: "+1 jar" }
+      ];
+      const craftOf = (i) => [...RECIPES[i].use, set(RECIPES[i].made.id, { expression: `${RECIPES[i].made.n} + 1` })];
+      const ring = k.rect(q, 364, 494, [], { name: "Card ring", radius: 30, stroke: { color: "terracotta", width: 5 }, absolute: { x: 48, y: 196 }, effects: [glow(k, "terracotta", 14, 0.5)] });
+      k.bindExpression(ring, "x", `48 + ${craftFocus.n} * 382`);
+      const pops = [];
+      RECIPES.forEach((r, i) => {
+        const c = box(k, q, 60 + i * 382, 208, 340, 470, { name: "Recipe card" });
+        vec(k, c, softRectPts(0, 0, 340, 470, 26, 130 + i, 1.8), "cream", { name: "Card", stroke: { color: "seam", width: 3 } });
+        const grey = vec(k, c, softRectPts(0, 0, 340, 470, 26, 130 + i, 1.8), "linen", { name: "Card greyed" });
+        k.bindExpression(grey, "visible", `!(${r.can})`);
+        const art = icon(k, c, r.icon, 90, 30, 1.6);
+        k.bindExpression(art, "opacity", `${r.can} ? 1 : 0.35`);
+        drift(k, art, "translateY", 4, 0.5, i * 0.2);
+        label(k, c, r.name, "Card 28", "bark", 24, 212, { w: 292, align: "CENTER", name: "Recipe name" });
+        label(k, c, r.cost, "Body 24", "soft", 24, 256, { w: 292, align: "CENTER", name: "Recipe cost" });
+        readout(k, c, `"Made so far: " + ${r.made.n}`, "Made so far: 0", "Label 26", "bark", 24, 306, { w: 292, align: "CENTER", name: "Made count" });
+        const ok = box(k, c, 50, 384, 240, 56, { name: "Craft tag", fill: "butter", radius: 28, align: "CENTER", justify: "CENTER", stroke: { color: "stitch", width: 2 } });
+        k.text(ok, "Craft  ENTER", { style: "Cap 22", color: "bark", autoWidth: true, name: "Craft words" });
+        k.bindExpression(ok, "visible", r.can);
+        readout(k, c, r.need, "Needs more", "Hint 20", "soft", 24, 398, { w: 292, align: "CENTER", name: "Missing" });
+        k.bindExpression(k.named(c, "Missing")[0], "visible", `!(${r.can})`);
+        const pop = k.instance(c, "Craft pop", { Label: r.pop }, { name: "Craft pop", absolute: { x: 0, y: 0 } });
+        pops.push(pop);
+        k.on(pop, set(craftFocus.id, { value: i, glide: 160 }), { trigger: "MOUSE_ENTER" });
+        k.on(pop, when([{ if: r.can, then: [k.changeAction("Craft pop/Made", 0), ...craftOf(i)] }, { then: [k.changeAction("Craft pop/Nope", 0)] }]));
+        k.on(pop, when([{ if: `${craftFocus.n} == ${i} && ${r.can}`, then: [k.changeAction("Craft pop/Made", 0)] }, { if: `${craftFocus.n} == ${i}`, then: [k.changeAction("Craft pop/Nope", 0)] }]), { key: "Enter" });
+      });
+      hint(q, "LEFT RIGHT  choose      ENTER  craft      ESC or C  back to the farm", 62, 740, 1400);
+      const bench = box(k, craft, 0, 0, 1, 1, { name: "Bench logic" });
+      for (const key of ["ArrowRight", "d"]) k.on(bench, set(craftFocus.id, { expression: `(${craftFocus.n} + 1) % 4`, glide: 160 }), { key });
+      for (const key of ["ArrowLeft", "a"]) k.on(bench, set(craftFocus.id, { expression: `(${craftFocus.n} + 3) % 4`, glide: 160 }), { key });
+      k.on(bench, when(RECIPES.map((r, i) => ({ if: `${craftFocus.n} == ${i} && ${r.can}`, then: craftOf(i) }))), { key: "Enter" });
+      k.on(bench, back(), { key: "Escape" });
+      k.on(bench, when([{ if: 'upper($key) == "C"', then: [back()] }]), { key: "*" });
+      const leave = k.instance(craft, "Cosy button", { Label: "Back to the farm  ESC" }, { name: "Back", absolute: { x: 1560, y: 980 } });
+      k.on(leave, back());
+      k.cues(craft, [{ layer: "Recipe card", preset: "rise-in", at: 0, stagger: { delay: 70 } }]);
+    }
+    const PACK = [
+      { name: "Turnips", icon: "turnip", count: turnips.n, rest: "0", about: `Plump and purple-shouldered. Marigold pays ${TURNIP_PRICE} coins apiece.` },
+      { name: "Turnip seeds", icon: "seeds", count: seeds.n, rest: "5", about: "A paper twist of seeds. Clear the plot, then sow them with the hoe." },
+      { name: "Wood", icon: "wood", count: wood.n, rest: "3", about: "Fallen branches from the brook path, split with the axe." },
+      { name: "Stone", icon: "stone", count: stone.n, rest: "1", about: "Smooth river stones, just right for a garden path." },
+      { name: "Fibre", icon: "fibre", count: fibre.n, rest: "2", about: "Meadow grass cut with the sickle and twisted into twine." },
+      { name: "Fertiliser", icon: "fert", count: fert.n, rest: "0", about: "Bramble compost. Smells dreadful, works wonders." },
+      { name: "Fences", icon: "fence", count: fences.n, rest: "0", about: "Keeps the geese honest and the turnips safe." },
+      { name: "Stone paths", icon: "path", count: paths.n, rest: "0", about: "No more muddy boots on the way to the well." },
+      { name: "Scarecrows", icon: "scarecrow", count: scarecrows.n, rest: "0", about: "He is called Gerald. He is not very scary." },
+      { name: "Preserves", icon: "jar", count: jars.n, rest: "0", about: "Turnip and honey. An acquired taste, says Tobiah." },
+      { name: "Pet treats", icon: "treat", count: treats.n, rest: "0", about: "Crunchy little bones. Your companion knows exactly where they are." },
+      { name: "Copper can", icon: "can", count: `${copper.n} == 1 ? "owned" : "none"`, rest: "none", about: "Waters a whole row in one go. Marigold keeps one at her stall." }
+    ];
+    {
+      const q = quilt(k, pack, 240, 100, 1440, 860, { name: "Backpack panel", seed: 111 });
+      readout(k, q, `${farmerName.n} + "'s backpack"`, "Wren's backpack", "Heading 60", "bark", 60, 44, { w: 1100, name: "Screen title" });
+      const ring = k.rect(q, 196, 196, [], { name: "Slot ring", radius: 30, stroke: { color: "terracotta", width: 5 }, absolute: { x: 52, y: 152 }, effects: [glow(k, "terracotta", 12, 0.5)] });
+      k.bindExpression(ring, "x", `52 + (${packFocus.n} % 6) * 222`);
+      k.bindExpression(ring, "y", `152 + floor(${packFocus.n} / 6) * 222`);
+      PACK.forEach((it, i) => {
+        const x = 64 + i % 6 * 222, y = 164 + Math.floor(i / 6) * 222;
+        const s = box(k, q, x, y, 172, 172, { name: "Pack slot" });
+        vec(k, s, softRectPts(0, 0, 172, 172, 24, 150 + i, 1.5), "linen", { name: "Slot plate", stroke: { color: "seam", width: 2 } });
+        const ic = icon(k, s, it.icon, 26, 14, 1.2);
+        drift(k, ic, "translateY", 3, 0.5, i * 0.08);
+        const tag = box(k, s, 92, 124, 72, 38, { name: "Count tag", fill: "parchment", radius: 19, align: "CENTER", justify: "CENTER" });
+        k.text(tag, it.rest, { style: "Key 18", color: "bark", autoWidth: true, name: "Count" });
+        k.bindExpression(k.named(tag, "Count")[0], "characters", it.count);
+        k.on(s, set(packFocus.id, { value: i, glide: 140 }), { trigger: "MOUSE_ENTER" });
+        k.on(s, set(packFocus.id, { value: i, glide: 140 }));
+      });
+      const about = box(k, q, 60, 620, 1320, 150, { name: "Item story", fill: "cream", radius: 24, padding: 26, gap: 8 });
+      k.text(about, "Turnips", { style: "Card 28", color: "bark", name: "Item name" });
+      k.bindExpression(k.named(about, "Item name")[0], "characters", pickText(`round(${packFocus.n})`, PACK.map((p) => p.name)));
+      k.text(about, PACK[0].about, { style: "Body 24", color: "soft", name: "Item about" });
+      k.bindExpression(k.named(about, "Item about")[0], "characters", pickText(`round(${packFocus.n})`, PACK.map((p) => p.about)));
+      hint(q, "ARROWS  look through your things      ESC or I  back to the farm", 62, 796, 1300);
+      const logic = box(k, pack, 0, 0, 1, 1, { name: "Pack logic" });
+      const f = packFocus.n;
+      for (const key of ["ArrowRight", "d"]) k.on(logic, set(packFocus.id, { expression: `(${f} + 1) % 12`, glide: 140 }), { key });
+      for (const key of ["ArrowLeft", "a"]) k.on(logic, set(packFocus.id, { expression: `(${f} + 11) % 12`, glide: 140 }), { key });
+      for (const key of ["ArrowDown", "s"]) k.on(logic, set(packFocus.id, { expression: `(${f} + 6) % 12`, glide: 140 }), { key });
+      for (const key of ["ArrowUp", "w"]) k.on(logic, set(packFocus.id, { expression: `(${f} + 6) % 12`, glide: 140 }), { key });
+      k.on(logic, close(), { key: "Escape" });
+      k.on(logic, when([{ if: 'upper($key) == "I"', then: [close()] }]), { key: "*" });
+      k.cues(pack, [{ layer: "Pack slot", preset: "pop-in", at: 0, stagger: { delay: 35 } }]);
+    }
+    {
+      const SHOP = [
+        { name: "Turnip seeds", blurb: "A twist of five. Sprouts overnight.", price: 20, v: seeds, add: 5, icon: "seeds" },
+        { name: "Pet treats", blurb: "Three crunchy bones for your companion.", price: 15, v: treats, add: 3, icon: "treat" },
+        { name: "Bramble fertiliser", blurb: "Smells dreadful. Works wonders.", price: 60, v: fert, add: 1, icon: "fert" },
+        { name: "Copper watering can", blurb: "Waters a whole row in one go.", price: 250, v: copper, add: 1, icon: "can" }
+      ];
+      vec(k, shop, hillPts(0, W, 620, 40, 2, 131), "hillFar", { name: "Far hills" });
+      vec(k, shop, hillPts(0, W, 760, 30, 1.4, 132), "hill", { name: "Green" });
+      [[80, 60, 0.9, 4], [1560, 110, 0.8, 8]].forEach(([x, y, s2, seed], i) => drift(k, cloud(k, shop, x, y, s2, "cloud", seed), "translateX", 30, 0.04, i * 0.4));
+      tree(k, shop, 40, 560, 1, 133);
+      tree(k, shop, 1680, 600, 0.9, 134);
+      const q = quilt(k, shop, 300, 150, 1320, 800, { name: "Market stall", seed: 121 });
+      const awn = box(k, shop, 280, 70, 1360, 130, { name: "Awning" });
+      for (let i = 0; i < 12; i++) {
+        const x = i * (1360 / 12), w = 1360 / 12;
+        vec(k, awn, [[x, 0], [x + w, 0], [x + w, 80], [x + w / 2, 124], [x, 80]], i % 2 ? "cream" : "terracotta", { name: "Stripe" });
+      }
+      drift(k, awn, "translateY", 2, 0.4);
+      heading(q, "Marigold's market stall", 60, 80);
+      readout(k, q, `"Your purse: " + group(${coins.n}) + " coins"`, "Your purse: 120 coins", "Label 26", "soft", 62, 158, { w: 800, name: "Purse line" });
+      const plate = k.rect(q, 1200, 120, k.tint("butter", 0.55), { name: "Row focus", radius: 24, absolute: { x: 60, y: 214 } });
+      k.bindExpression(plate, "y", `214 + ${shopFocus.n} * 134`);
+      const buy = (i) => [set(coins.id, { expression: `${coins.n} - ${SHOP[i].price}`, glide: 700 }), set(SHOP[i].v.id, { expression: `${SHOP[i].v.n} + ${SHOP[i].add}` })];
+      const affordable = (i) => `${coins.n} >= ${SHOP[i].price}${SHOP[i].v === copper ? ` && ${copper.n} == 0` : ""}`;
+      SHOP.forEach((it, i) => {
+        const row = box(k, q, 60, 214 + i * 134, 1200, 120, { name: "Stall row" });
+        icon(k, row, it.icon, 30, 12, 0.96);
+        label(k, row, it.name, "Card 28", "bark", 150, 22, { name: "Ware name" });
+        label(k, row, it.blurb, "Hint 20", "soft", 150, 64, { w: 560, name: "Ware blurb" });
+        readout(k, row, it.v === copper ? `${copper.n} == 1 ? "Yours already" : "In stock: 1"` : `"You have " + ${it.v.n}`, it.v === copper ? "In stock: 1" : "You have 0", "Hint 20", "soft", 730, 44, { w: 200, name: "Owned" });
+        const tag = k.instance(row, "Price tag", { Price: `${it.price} coins` }, { name: "Price tag", absolute: { x: 900, y: -30 } });
+        k.on(row, set(shopFocus.id, { value: i, glide: 140 }), { trigger: "MOUSE_ENTER" });
+        k.on(tag, when([{ if: affordable(i), then: [k.changeAction("Price tag/Paid", 0), ...buy(i)] }, { then: [k.changeAction("Price tag/Short", 0)] }]));
+        k.on(tag, when([{ if: `${shopFocus.n} == ${i} && ${affordable(i)}`, then: [k.changeAction("Price tag/Paid", 0)] }, { if: `${shopFocus.n} == ${i}`, then: [k.changeAction("Price tag/Short", 0)] }]), { key: "Enter" });
+      });
+      hint(q, "\u2191 \u2193  choose      ENTER  buy      ESC or B  back to the farm", 62, 764 - 20, 1200);
+      const logic = box(k, shop, 0, 0, 1, 1, { name: "Stall logic" });
+      for (const key of ["ArrowDown", "s"]) k.on(logic, set(shopFocus.id, { expression: `(${shopFocus.n} + 1) % 4`, glide: 140 }), { key });
+      for (const key of ["ArrowUp", "w"]) k.on(logic, set(shopFocus.id, { expression: `(${shopFocus.n} + 3) % 4`, glide: 140 }), { key });
+      k.on(logic, when(SHOP.map((_, i) => ({ if: `${shopFocus.n} == ${i} && ${affordable(i)}`, then: buy(i) }))), { key: "Enter" });
+      k.on(logic, back(), { key: "Escape" });
+      k.on(logic, when([{ if: 'upper($key) == "B"', then: [back()] }]), { key: "*" });
+      const leave = k.instance(shop, "Cosy button", { Label: "Back to the farm  ESC" }, { name: "Back", absolute: { x: 1560, y: 980 } });
+      k.on(leave, back());
+      k.cues(shop, [{ layer: "Awning", preset: "drop-in", at: 0 }, { layer: "Stall row", preset: "slide-in", at: 150, params: { direction: "right" }, stagger: { delay: 70 } }]);
+    }
+    {
+      const F = farmerName.n, P = petName.n, FM = farmName.n;
+      const LETTERS = [
+        {
+          from: "Marigold Pennyworth",
+          where: "The bakery on Wick Lane",
+          subject: "Welcome, neighbour!",
+          body: `"Dear " + ${F} + ", welcome to the valley! I left a loaf of seed bread in your mailbox. Bring me your first turnips and I will pay a fair price, with a bun for " + ${P} + " besides. \u2014 Marigold"`
+        },
+        {
+          from: "Tobiah Fenn",
+          where: "The windmill on Hob's Ridge",
+          subject: "About the west wind",
+          body: `${F} + ", the sails turn faster when the west wind comes over the ridge. Your seedlings will sway on windy days. They bend, but they do not break. Come up for tea when the flour is ground. \u2014 T. Fenn"`
+        },
+        {
+          from: "Dr. Hazel Ostrander",
+          where: "The valley clinic",
+          subject: "A friendly reminder",
+          body: `"Dear keeper of " + ${FM} + ", farmers are not tractors. Work yourself to nothing and you will wake on my cot with a bill and a lecture. Rest when the lanterns come on. \u2014 Dr. H. Ostrander"`
+        }
+      ];
+      const q = quilt(k, letters, 180, 100, 1560, 860, { name: "Letters panel", seed: 131 });
+      heading(q, "Letters", 60, 44);
+      const plate = k.rect(q, 520, 150, k.tint("butter", 0.6), { name: "Row focus", radius: 24, absolute: { x: 44, y: 150 } });
+      k.bindExpression(plate, "y", `150 + ${letterFocus.n} * 170`);
+      LETTERS.forEach((l, i) => {
+        const row = box(k, q, 60, 160 + i * 170, 490, 130, { name: "Envelope" });
+        vec(k, row, softRectPts(0, 10, 110, 76, 8, 160 + i, 1), "linen", { name: "Envelope paper", stroke: { color: "seam", width: 2 } });
+        poly(k, row, [[4, 16], [55, 56], [106, 16]], "stitch", { name: "Envelope fold", stroke: 3 });
+        k.ellipse(row, 24, "clay", { name: "Wax seal", absolute: { x: 43, y: 44 } });
+        label(k, row, l.from, "Card 28", "bark", 134, 6, { w: 350, name: "Sender" });
+        label(k, row, l.where, "Hint 20", "soft", 134, 46, { w: 350, name: "Sender place" });
+        label(k, row, l.subject, "Small 18", "clay", 134, 82, { w: 350, name: "Subject" });
+        k.on(row, set(letterFocus.id, { value: i, glide: 140 }), { trigger: "MOUSE_ENTER" });
+        k.on(row, set(letterFocus.id, { value: i, glide: 140 }));
+      });
+      const paper = box(k, q, 620, 60, 880, 700, { name: "Letter paper" });
+      vec(k, paper, softRectPts(0, 0, 880, 700, 14, 171, 2.5), "cream", { name: "Paper", stroke: { color: "seam", width: 2 }, effects: [soft(k, 20, 6, 0.14)] });
+      for (let i = 0; i < 9; i++) poly(k, paper, [[60, 190 + i * 42 + 34], [820, 190 + i * 42 + 34]], "seam", { name: "Ruled line", stroke: 1.5 });
+      readout(k, paper, pickText(`round(${letterFocus.n})`, LETTERS.map((l) => l.subject)), LETTERS[0].subject, "Heading 60", "bark", 60, 50, { w: 760, name: "Letter subject" });
+      readout(k, paper, pickExpr(`round(${letterFocus.n})`, LETTERS.map((l) => l.body)), "Dear Wren, welcome to the valley! I left a loaf of seed bread in your mailbox. Bring me your first turnips and I will pay a fair price, with a bun for Biscuit besides. \u2014 Marigold", "Letter 28", "bark", 60, 190, { w: 760, name: "Letter body" });
+      k.ellipse(paper, 70, "clay", { name: "Seal", absolute: { x: 780, y: 610 }, effects: [soft(k, 10, 3, 0.2)] });
+      hint(q, "\u2191 \u2193  choose a letter      ESC or M  back to the farm", 62, 786, 1e3);
+      const logic = box(k, letters, 0, 0, 1, 1, { name: "Mail logic" });
+      for (const key of ["ArrowDown", "s"]) k.on(logic, set(letterFocus.id, { expression: `(${letterFocus.n} + 1) % 3`, glide: 140 }), { key });
+      for (const key of ["ArrowUp", "w"]) k.on(logic, set(letterFocus.id, { expression: `(${letterFocus.n} + 2) % 3`, glide: 140 }), { key });
+      k.on(logic, close(), { key: "Escape" });
+      k.on(logic, when([{ if: 'upper($key) == "M"', then: [close()] }]), { key: "*" });
+      k.cues(letters, [{ layer: "Letter paper", preset: "rise-in", at: 0 }, { layer: "Envelope", preset: "slide-in", at: 100, params: { direction: "left" }, stagger: { delay: 80 } }]);
+    }
+    {
+      const q = quilt(k, pause, 610, 220, 700, 620, { name: "Pause quilt", seed: 141 });
+      label(k, q, "Paused", "Heading 60", "bark", 0, 44, { w: 700, align: "CENTER", name: "Screen title" });
+      readout(k, q, `${dateLine} + "  \xB7  " + ${farmName.n}`, "Spring 3 \xB7 Wed  \xB7  Bramblewick", "Label 26", "soft", 0, 124, { w: 700, align: "CENTER", name: "Where" });
+      menu(k, q, [
+        { label: "Back to the farm", actions: [close()] },
+        { label: "Settings", actions: [go(settings, "DISSOLVE", { duration: 300 })] },
+        { label: "Save and quit to menu", actions: [go(main, "DISSOLVE", { duration: 500 })] }
+      ], { focus: pauseFocus, x: 50, y: 200, width: 600, pitch: 96, itemHeight: 84, style: "Menu 40", color: "bark", plate: k.tint("butter", 0.75), marker: { color: "terracotta" }, escape: [close()], radius: 24 });
+      const zz = box(k, q, 560, 500, 100, 80, { name: "Snooze" });
+      ["z", "z", "z"].forEach((z, i) => {
+        const t = label(k, zz, z, "Card 28", "dusk", i * 26, 44 - i * 20, { name: "Snooze z" });
+        drift(k, t, "translateY", 6, 0.6, i * 0.2);
+      });
+      hint(q, "ESC  back to the farm", 0, 548, 700, "CENTER");
+    }
+    {
+      const sun = blob(k, morning, 1400, 560, 120, 120, "butter", { name: "Rising sun", effects: [glow(k, "butter", 70, 0.8)], wob: 0.02 });
+      keys(k, sun, "translateY", [{ t: 0, v: 240, ease: { kind: "ease", name: "cubic-out" } }, { t: 2600, v: 0 }]);
+      [[1080, 120, 0.9, 3], [1540, 220, 0.7, 7]].forEach(([x, y, s, seed], i) => drift(k, cloud(k, morning, x, y, s, "cloud", seed), "translateX", 40, 0.04, i * 0.4));
+      vec(k, morning, hillPts(0, W, 640, 40, 2, 81), "hillFar", { name: "Far hills" });
+      vec(k, morning, hillPts(0, W, 760, 40, 1.4, 82), "hill", { name: "Mid hills" });
+      house(k, morning, 1180, 470, 0.9);
+      vec(k, morning, hillPts(0, W, 900, 24, 1.1, 83), "hillNear", { name: "Near hills" });
+      const q = quilt(k, morning, 110, 130, 860, 780, { name: "Morning news", seed: 151 });
+      readout(k, q, `"Good morning, " + ${farmerName.n}`, "Good morning, Wren", "Heading 60", "bark", 60, 50, { w: 740, name: "Greeting" });
+      readout(k, q, dateLine, "Spring 4 \xB7 Thu", "Calendar 32", "clay", 62, 196, { w: 740, name: "Date" });
+      readout(k, q, sleepNote.n, "You tucked in early and slept like a log.", "Body 24", "bark", 62, 256, { w: 740, name: "Sleep note" });
+      readout(k, q, `"Weather: " + ${weatherWord} + (${weather.n} == 1 ? " \u2014 the crops will sway today" : ${weather.n} == 2 ? " \u2014 the plot waters itself" : " \u2014 a fine day for it")`, "Weather: Sunny \u2014 a fine day for it", "Label 26", "bark", 62, 360, { w: 740, name: "Forecast" });
+      readout(k, q, `${stage} >= 2 ? "Your turnips are ready to pull (H)." : ${stage} == 1 ? "Green sprouts are poking through." : ${stage} == 0 ? "The seeds are tucked in, waiting." : "The plot lies bare. Sow seeds with the hoe."`, "Green sprouts are poking through.", "Label 26", "bark", 62, 420, { w: 740, name: "Crop news" });
+      readout(k, q, `"Energy restored to " + round(${energy.n})`, "Energy restored to 100", "Label 26", "moss", 62, 480, { w: 740, name: "Energy news" });
+      const pill = box(k, q, 60, 640, 560, 64, { name: "Wake prompt", fill: "butter", radius: 32, align: "CENTER", justify: "CENTER", stroke: { color: "stitch", width: 2 } });
+      k.text(pill, "Press any key to head out", { style: "Prompt 24", color: "bark", autoWidth: true, name: "Wake words" });
+      drift(k, pill, "translateY", 4, 0.6);
+      k.cues(morning, [{ layer: "Morning news", preset: "rise-in", at: 300 }, { layer: "Wake prompt", preset: "fade-in", at: 1200 }]);
+      k.link(morning, hud, "DISSOLVE", { key: "*", duration: 600 });
+      k.link(morning, hud, "DISSOLVE", { duration: 600 });
+    }
+    {
+      k.rect(passed, W, 260, "linen", { name: "Floor", absolute: { x: 0, y: 820 } });
+      const win = box(k, passed, 160, 140, 420, 340, { name: "Clinic window", fill: "night", radius: 20, stroke: { color: "woodDark", width: 10 }, clip: true });
+      blob(k, win, 300, 110, 46, 46, "cream", { name: "Moon", effects: [glow(k, "cream", 40, 0.7)], wob: 0.02 });
+      for (let i = 0; i < 10; i++) {
+        const r = rng(i + 900);
+        const s = k.ellipse(win, 4, "onNight", { name: "Star", absolute: { x: r() * 400, y: r() * 320 } });
+        drift(k, s, "opacity", 0.4, 0.4 + r(), r());
+      }
+      vec(k, win, hillPts(0, 420, 280, 20, 1.4, 91, 340), "nightHill", { name: "Night hills" });
+      poly(k, win, [[210, 0], [210, 340]], "woodDark", { name: "Sash", stroke: 8 });
+      const cot = box(k, passed, 120, 560, 720, 300, { name: "Cot" });
+      vec(k, cot, [[20, 110], [40, 110], [40, 300], [20, 300]], "woodDark", { name: "Cot leg", sharp: true });
+      vec(k, cot, [[680, 150], [700, 150], [700, 300], [680, 300]], "woodDark", { name: "Cot leg", sharp: true });
+      vec(k, cot, softRectPts(20, 150, 680, 90, 20, 92, 2), "cream", { name: "Mattress", stroke: { color: "seam", width: 3 } });
+      blob(k, cot, 120, 146, 90, 36, "parchment", { name: "Pillow", seed: 93 });
+      const blanket = vec(k, cot, softRectPts(200, 120, 480, 120, 40, 94, 4), "sage", { name: "Blanket", stroke: { color: "moss", width: 3 } });
+      drift(k, blanket, "scaleY", 0.03, 0.25);
+      const table = box(k, passed, 700, 600, 200, 260, { name: "Side table" });
+      vec(k, table, softRectPts(0, 60, 200, 26, 10, 95, 1), "wood", { name: "Table top" });
+      vec(k, table, [[20, 84], [36, 84], [36, 260], [20, 260]], "woodDark", { name: "Table leg", sharp: true });
+      vec(k, table, [[164, 84], [180, 84], [180, 260], [164, 260]], "woodDark", { name: "Table leg", sharp: true });
+      vec(k, table, softRectPts(40, 24, 56, 38, 12, 96, 0.6), "lavender", { name: "Teacup", stroke: { color: "dusk", width: 2 } });
+      poly(k, table, arcPoints(100, 42, 12, -Math.PI / 2, Math.PI / 2, 10), "dusk", { name: "Cup handle", stroke: 4 });
+      [0, 1].forEach((i) => {
+        const st = blob(k, table, 60 + i * 16, 10, 7, 9, "steam", { name: "Tea steam", seed: 97 + i, opacity: 0.9 });
+        k.behave(st, "translateY", [{ kind: "spin", rate: -(18 + i * 8) }, { kind: "mod", period: 40, offset: -40 }]);
+      });
+      vec(k, table, softRectPts(120, 40, 60, 22, 4, 98, 0.5), "parchment", { name: "Bill slip", stroke: { color: "seam", width: 2 } });
+      const plant = box(k, passed, 620, 160, 180, 300, { name: "Clinic plant" });
+      [[-0.5, 40], [0, 20], [0.5, 40], [-0.25, 60], [0.25, 60]].forEach(([a, y], i) => vec(k, plant, rot(90, 220, blobPts(90, 120 + y, 18, 70, 99 + i, 0.08), a), i % 2 ? "leaf" : "leafDeep", { name: "Frond" }));
+      vec(k, plant, [[50, 210], [130, 210], [118, 290], [62, 290]], "terracotta", { name: "Pot" });
+      pivot(k, plant, 0.5, 0.95);
+      drift(k, plant, "rotation", 1.5, 0.3);
+      const zz = box(k, passed, 260, 440, 200, 160, { name: "Snoring" });
+      ["z", "Z", "z"].forEach((z, i) => {
+        const t = label(k, zz, z, "Heading 60", "dusk", i * 50, 100 - i * 44, { name: "Snore" });
+        drift(k, t, "translateY", 10, 0.4, i * 0.25);
+        drift(k, t, "rotation", 8, 0.3, i * 0.2);
+      });
+      const q = quilt(k, passed, 1e3, 120, 820, 780, { name: "Clinic note", seed: 161 });
+      label(k, q, "You passed out", "Heading 60", "bark", 60, 50, { w: 700, name: "Screen title" });
+      readout(k, q, `"Dr. Hazel found " + ${farmerName.n} + " asleep in the turnip rows and wheeled you to the clinic in a barrow. " + ${petName.n} + " kept watch all night."`, "Dr. Hazel found Wren asleep in the turnip rows and wheeled you to the clinic in a barrow. Biscuit kept watch all night.", "Body 24", "bark", 62, 140, { w: 700, name: "What happened" });
+      const bill = box(k, q, 60, 330, 700, 170, { name: "Clinic bill", fill: "linen", radius: 20, padding: 24, gap: 4 });
+      k.text(bill, "Clinic bill", { style: "Small 18", color: "clay", name: "Bill label" });
+      k.text(bill, `\u2212${CLINIC_BILL} coins`, { style: "Stat 64", color: "bark", name: "Bill amount" });
+      k.bindExpression(k.named(bill, "Bill amount")[0], "characters", `"\u2212" + ${billed.n} + " coins"`);
+      k.text(bill, "One night on the cot \xB7 tea and toast \xB7 a stern talking-to", { style: "Hint 20", color: "soft", name: "Bill items" });
+      readout(k, q, `"Your purse: " + group(${coins.n}) + " coins"`, "Your purse: 80 coins", "Label 26", "soft", 62, 520, { w: 700, name: "Purse after" });
+      const home = [set(energy.id, { value: 60 }), set(energyTrail.id, { value: 60 }), set(hour.id, { value: 8 }), set(day.id, { expression: `min(${seasonLength.n}, ${day.n} + 1)` }), set(growth.id, { expression: `${growth.n} >= 0 ? ${growth.n} + 1 : ${growth.n}` }), set(watered.id, { value: 0 }), toFarm];
+      menu(k, q, [
+        { label: "Head home, gently", actions: home },
+        { label: "Main menu", actions: [go(main, "DISSOLVE", { duration: 500 })] }
+      ], { focus: endFocus, x: 50, y: 580, width: 720, pitch: 90, itemHeight: 80, style: "Menu 40", color: "bark", plate: k.tint("butter", 0.75), marker: { color: "terracotta" }, radius: 24 });
+      k.cues(passed, [{ layer: "Clinic note", preset: "rise-in", at: 400 }]);
+    }
+    {
+      const bunting = box(k, festival, 0, 0, W, 150, { name: "Bunting" });
+      poly(k, bunting, [[0, 30], [480, 60], [960, 40], [1440, 64], [1920, 30]], "woodDark", { name: "String", stroke: 3 });
+      for (let i = 0; i < 24; i++) {
+        const x = 20 + i * 80, y = 30 + Math.sin(i / 24 * Math.PI * 4) * 14 + 16;
+        const f = vec(k, bunting, [[x, y], [x + 56, y + 2], [x + 28, y + 70]], ["terracotta", "butter", "sage", "lavender"][i % 4], { name: "Pennant", sharp: true });
+        pivot(k, f, 0.5, 0);
+        drift(k, f, "rotation", 6, 0.5, i * 0.07);
+      }
+      label(k, festival, "Harvest festival", "Title 140", "bark", 160, 120, { w: 1600, align: "CENTER", name: "Screen title" });
+      readout(k, festival, `"The end of " + ${seasonWord} + " in " + ${farmName.n}`, "The end of Spring in Bramblewick", "Tagline 30", "soft", 160, 270, { w: 1600, align: "CENTER", name: "Season line" });
+      rosette(k, festival, 560, 420, 72, "red", "2nd", "Red ribbon");
+      rosette(k, festival, 960, 410, 96, "blue", "1st", "Blue ribbon");
+      rosette(k, festival, 1360, 420, 72, "gold", "3rd", "Gold ribbon");
+      label(k, festival, "Handiest crafter", "Ribbon 20", "bark", 400, 640, { w: 320, align: "CENTER", name: "Prize name" });
+      label(k, festival, "Best in show: turnips", "Ribbon 20", "bark", 760, 660, { w: 400, align: "CENTER", name: "Prize name" });
+      label(k, festival, "Friend of the valley", "Ribbon 20", "bark", 1200, 640, { w: 320, align: "CENTER", name: "Prize name" });
+      const q = quilt(k, festival, 360, 710, 1200, 190, { name: "Season totals", seed: 171 });
+      [["Turnips harvested", harvested.n, "0"], ["Coins earned", `group(${earned.n})`, "0"], ["Things crafted", `${fences.n} + ${paths.n} + ${scarecrows.n} + ${jars.n}`, "0"]].forEach(([name, e, rest], i) => {
+        label(k, q, name, "Small 18", "soft", 60 + i * 380, 36, { name: "Total name" });
+        readout(k, q, e, rest, "Stat 64", "bark", 60 + i * 380, 70, { w: 320, name: "Total value" });
+      });
+      readout(k, festival, `${harvested.n} >= 6 ? "Judge Pennyworth: The plumpest turnips this valley has seen in years." : ${harvested.n} >= 3 ? "Judge Pennyworth: A fine, honest crop. Next season, bigger." : "Judge Pennyworth: Everyone starts somewhere, dear."`, "Judge Pennyworth: Everyone starts somewhere, dear.", "Letter 28", "bark", 160, 920, { w: 1600, align: "CENTER", name: "Verdict" });
+      const nextSeason = [set(day.id, { value: 1 }), set(season.id, { expression: `(${season.n} + 1) % 4` }), set(weather.id, { value: 0 }), set(harvested.id, { value: 0 }), set(earned.id, { value: 0 }), go(morning, "DISSOLVE", { duration: 800 })];
+      const cont = k.instance(festival, "Cosy button", { Label: "On to the next season  ENTER" }, { name: "Next season", absolute: { x: 1480, y: 990 } });
+      onAll(k, cont, nextSeason);
+      onAll(k, festival, nextSeason, { key: "Enter" });
+      k.cues(festival, [
+        { layer: "Screen title", preset: "drop-in", at: 0 },
+        { layer: "Red ribbon", preset: "pop-in", at: 500 },
+        { layer: "Gold ribbon", preset: "pop-in", at: 700 },
+        { layer: "Blue ribbon", preset: "pop-in", at: 1e3 },
+        { layer: "Season totals", preset: "rise-in", at: 1300 }
+      ]);
+    }
+    return k.finish();
+  }
+});
+
+export {
+  hearthmoor_farm_default
+};