@homie-rocks/studio 0.21.0 → 0.23.0

package/lib/template-history.json

@@ -924,6 +924,82 @@
      }
     }
    }
+  },
+  "0.22.0": {
+   "files": {
+    "CLAUDE.md": "ddf2b2a0376202f6",
+    "README.md": "684b3cca8001673c",
+    "HANDOFF.md": "ce7a8fd91c6bbee2",
+    "games/README.md": "5ad32fe80c61f117",
+    "music/README.md": "a3dc042dadd39df8",
+    "videos/README.md": "16babc3437d5545b",
+    "posts/README.md": "37841aae476bd540",
+    "site/README.md": "ca131cd0472464fb",
+    "site/src/worker.mjs": "ca3f1630f2420ad3"
+   },
+   "sections": {
+    "AGENTS.md": {
+     "(intro)": "214aa46eb3a895d5",
+     "## Layout": "8baf49e4291e7e88",
+     "## Commands (all through the pinned CLI in node_modules)": "d80ec56e4b4fc4c6",
+     "## The site": "ab922bb6bde23293",
+     "## Making games": "a8a893eeada33bf5",
+     "## The Game Codex and progress": "0738ef719cef3a4c",
+     "## Art direction and models": "124772c374de7390",
+     "## Running live games (the back office)": "4aa5f513a7cd2c3b",
+     "## Servers and AI seats": "0a332b07e22d3fce",
+     "## Continuing a build from the Claude app": "0d68081e924ca419",
+     "## Rules": "7e8458adc1b81ece",
+     "## Beta": "9d02638207a26e73"
+    }
+   },
+   "named": {
+    "Homie Arcade": {
+     "sections": {
+      "AGENTS.md": {
+       "## Commands (all through the pinned CLI in node_modules)": "b35df2c19cd4b534"
+      }
+     }
+    }
+   }
+  },
+  "0.23.0": {
+   "files": {
+    "CLAUDE.md": "ddf2b2a0376202f6",
+    "README.md": "684b3cca8001673c",
+    "HANDOFF.md": "ce7a8fd91c6bbee2",
+    "games/README.md": "5ad32fe80c61f117",
+    "music/README.md": "a3dc042dadd39df8",
+    "videos/README.md": "16babc3437d5545b",
+    "posts/README.md": "37841aae476bd540",
+    "site/README.md": "ca131cd0472464fb",
+    "site/src/worker.mjs": "ca3f1630f2420ad3"
+   },
+   "sections": {
+    "AGENTS.md": {
+     "(intro)": "214aa46eb3a895d5",
+     "## Layout": "8baf49e4291e7e88",
+     "## Commands (all through the pinned CLI in node_modules)": "d80ec56e4b4fc4c6",
+     "## The site": "ab922bb6bde23293",
+     "## Making games": "a8a893eeada33bf5",
+     "## The Game Codex and progress": "0738ef719cef3a4c",
+     "## Art direction and models": "124772c374de7390",
+     "## Running live games (the back office)": "4aa5f513a7cd2c3b",
+     "## Servers and AI seats": "0a332b07e22d3fce",
+     "## Continuing a build from the Claude app": "0d68081e924ca419",
+     "## Rules": "7e8458adc1b81ece",
+     "## Beta": "9d02638207a26e73"
+    }
+   },
+   "named": {
+    "Homie Arcade": {
+     "sections": {
+      "AGENTS.md": {
+       "## Commands (all through the pinned CLI in node_modules)": "b35df2c19cd4b534"
+      }
+     }
+    }
+   }
   }
  }
 }

package/mcp/ui/card.css

@@ -72,4 +72,19 @@ ol.list,ul.list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
 .ready{margin:0 0 8px;font-size:13px;color:var(--c-fg2)}.ready .ok{color:var(--c-ok);font-weight:600}
 .tabs{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
 .tabs span{padding:4px 9px;border-radius:var(--r-full);background:var(--c-bg2);font-size:12px;color:var(--c-fg2)}
+.dirs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:10px;margin:8px 0}
+.dir{display:grid;gap:6px;align-content:start;padding:8px;border-radius:var(--r-md);background:var(--c-bg2)}.dir.chosen{box-shadow:inset 0 0 0 2px var(--accent)}
+.dir img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-sm);display:block;background:var(--c-bg3)}
+.dirhead{display:flex;gap:8px;align-items:baseline}.dirhead b{font-size:15px}.dirhead span{font-size:13px;color:var(--c-fg2)}
+.dir .type{margin:0;font-size:20px;line-height:1.2;color:var(--c-fg)}.dir .fine{margin:0}
+.chips{display:inline-flex;flex-wrap:wrap;gap:4px;margin-top:4px}.swatch{width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1px var(--c-line2);display:inline-block}
+.list.decisions li{flex-wrap:wrap}.list.decisions li.locked{box-shadow:inset 3px 0 0 var(--c-ok)}.list li .actions{margin-left:auto}
+.steer{flex-basis:100%;display:flex;gap:8px;margin-top:6px}
+input[type=text]{flex:1;min-width:0;font:14px/1.2 var(--f-sans);padding:8px 10px;border-radius:var(--r-sm);border:1px solid var(--c-line2);background:var(--c-bg);color:var(--c-fg)}
+.mix{display:grid;gap:6px;margin:10px 0}.mixrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.mixname{min-width:84px;font:600 12px/1.2 var(--f-mono);color:var(--c-fg2)}
+.list.cast li{align-items:center}.thumb{flex:none;width:52px;height:52px;border-radius:var(--r-sm);background:var(--c-bg3);display:grid;place-items:center;overflow:hidden}.thumb img{width:100%;height:100%;object-fit:cover}
+.sil{display:block;max-width:100%;margin-top:8px;border-radius:var(--r-sm);background:#fff}
+.budget{display:grid;grid-template-columns:110px 1fr auto;gap:10px;align-items:center;font-size:13px;color:var(--c-fg2);margin:6px 0}.budget .n{font:12px/1 var(--f-mono)}
+.budget .track{height:8px;border-radius:4px;background:var(--c-bg3);overflow:hidden}.budget .track i{display:block;height:100%;background:var(--c-ok)}.budget .track i.over{background:var(--c-bad)}
+details summary{cursor:pointer;color:var(--c-fg2);font-size:13px;margin-top:10px}
 @media (max-width:420px){.card{padding:14px 12px 12px;border-radius:var(--r-md)}h1{font-size:18px}.stages{grid-auto-flow:row;grid-auto-columns:auto}.frame{height:520px}}

package/mcp/ui/cast.js

@@ -0,0 +1,62 @@
+/* The cast card: the assets a game needs with their route (the engine, the free CC0 starter library, generated, the
+ * person's own), a library match with its thumbnail or a price, against the art budget (assets_plan); or the starter
+ * library's matches for some words (assets_find), each with Add. Adding a library item is free; anything paid goes
+ * through the person's yes in the chat (asset_make prices it first). */
+(function () {
+  var C = Card;
+  var busy = {};
+  function thumb(src, alt) { var t = C.el('div', 'thumb'); var i = src ? C.img(src, alt) : null; if (i) t.appendChild(i); else t.appendChild(C.el('span', '', '·')); return t; }
+  function addItem(sc, item, extra) {
+    if (busy[item.id] || !sc.game) return;
+    busy[item.id] = 'Adding…'; C.render();
+    var a = { game: sc.game, item: item.id };
+    for (var k in (extra || {})) if (extra[k] !== null && extra[k] !== undefined) a[k] = extra[k];
+    C.call('asset_add', a).then(function (r) {
+      busy[item.id] = r && r.isError ? C.textOf(r) : 'Added';
+      if (!(r && r.isError)) C.tell('add:' + item.id, 'The person added ' + item.id + ' (CC0, free) from the starter library to ' + sc.game + ' on the cast card.');
+      if (sc.mode === 'plan') C.call('assets_plan', { game: sc.game }).then(C.take).catch(C.render); else C.render();
+    }).catch(function () { busy[item.id] = 'Not added'; C.render(); });
+  }
+  function plan(card, sc) {
+    var list = C.el('ul', 'list cast');
+    (sc.rows || []).forEach(function (r) {
+      var li = C.el('li', r.state === 'made' ? 'done' : r.state === 'stale' ? 'now' : 'todo');
+      li.appendChild(thumb(r.match && r.match.thumb, r.match ? r.match.name : r.id));
+      li.appendChild(C.add(C.el('div', 'cb'), C.el('b', '', r.id + (r.card ? ' · ' + r.card : '')), C.el('span', '', r.kind + ', ' + r.tier + ' · ' + (r.state === 'planned' ? (r.match ? 'library match: ' + r.match.name + ' (' + r.match.tris + ' triangles, CC0)' : r.route === 'procedural' ? 'drawn by the game\'s code (free)' : 'no library match: generated, about US$' + r.usd) : r.state + ' (' + r.route + ')'))));
+      var side = C.el('div', 'actions');
+      if (r.state === 'planned' && r.match) side.appendChild(C.btn(busy[r.match.id] || 'Use it (free)', 'small', function () { addItem(sc, r.match, { as: r.id, card: r.card, height: r.heightM || null }); }));
+      else if (r.state === 'planned' && r.usd) side.appendChild(C.btn('Generate', 'ghost small', function () { C.tell('gen:' + r.id, 'The person wants ' + r.id + ' (' + (r.card || r.kind) + ') generated: price it with asset_make (a dry run) and ask before paying.'); busy[r.id] = 'Asked your AI to price it'; C.render(); }));
+      else side.appendChild(C.pill(r.state === 'made' ? 'Made' : r.state === 'stale' ? 'Stale' : r.state, r.state === 'made' ? 'ok' : r.state === 'stale' ? 'warn' : ''));
+      if (busy[r.id]) side.appendChild(C.el('span', 'fine', busy[r.id]));
+      li.appendChild(side);
+      list.appendChild(li);
+    });
+    card.appendChild(list);
+    card.appendChild(C.el('p', 'fine', 'To generate what the library cannot cover: about US$' + (sc.total || 0) + (sc.budget !== null && sc.budget !== undefined ? ' against an art budget of US$' + sc.budget : ' (no art budget: free routes only until you set one)') + '. Spent so far: US$' + (sc.spend ? sc.spend.used.toFixed(2) : '0.00') + '.'));
+  }
+  function find(card, sc) {
+    var grid = C.el('div', 'games');
+    (sc.items || []).forEach(function (it) {
+      var g = C.el('div', 'game');
+      var art = C.el('div', 'art'); var i = it.thumb ? C.img(it.thumb, it.name) : null; if (i) art.appendChild(i); else art.appendChild(document.createTextNode(it.name.slice(0, 1)));
+      g.appendChild(art);
+      g.appendChild(C.el('b', '', it.name));
+      g.appendChild(C.el('span', '', it.kind + ' · ' + it.tris + ' triangles · ' + it.kb + ' KB · ' + it.family + (it.rigged ? ' · rigged' : '')));
+      if (sc.game) g.appendChild(C.btn(busy[it.id] || 'Add (free)', 'small', function () { addItem(sc, it); }));
+      grid.appendChild(g);
+    });
+    card.appendChild(grid);
+    card.appendChild(C.el('p', 'fine', 'Every item is CC0 (free for any use, no credit required), already phone-sized. Adding one copies it into the game: it never loads from anywhere else.'));
+  }
+  function render(sc) {
+    var card = C.el('main', 'card');
+    var title = sc.mode === 'find' ? 'Free models for “' + sc.query + '”' : sc.mode === 'added' ? 'Added ' + (sc.added && sc.added.asset) : 'The cast of ' + sc.game;
+    C.add(card, C.top('Cast', sc.mode === 'plan' ? C.pill((sc.rows || []).filter(function (r) { return r.state === 'made'; }).length + ' of ' + (sc.rows || []).length + ' made', '') : null), C.el('h1', '', title));
+    if (sc.library && sc.library.error) card.appendChild(C.el('p', 'note', 'Starter library: ' + sc.library.error));
+    if (sc.mode === 'plan') plan(card, sc);
+    else if (sc.mode === 'find') find(card, sc);
+    else if (sc.added) card.appendChild(C.el('p', 'sub', sc.added.asset + ' is in games/' + sc.game + (sc.added.after ? ': ' + sc.added.after.tris + ' triangles, ' + sc.added.after.kb + ' KB' : '') + '. Licence: ' + (sc.added.license || 'CC0') + '.'));
+    return card;
+  }
+  C.start({ kind: 'cast', label: 'Cast', fullscreen: true, render: render, poll: null });
+})();

package/mcp/ui/decision.js

@@ -0,0 +1,61 @@
+/* The look-decision card: what one decision_set did. For a LOCKED decision about to change, the blast radius first:
+ * every asset made under it that would go stale, what remaking each would cost, and what a free palette re-tint fixes.
+ * Nothing changes until the person presses "Change it"; nothing is ever remade by itself. */
+(function () {
+  var C = Card;
+  var STATE = { auto: 'Auto', steered: 'Steered', pinned: 'Pinned by use', locked: 'Locked' };
+  var done = null;
+  function chips(colours) {
+    var row = C.el('span', 'chips');
+    (colours || []).forEach(function (c) { var s = C.el('span', 'swatch'); s.style.background = c; s.title = c; row.appendChild(s); });
+    return row;
+  }
+  function blast(card, b) {
+    var list = C.el('ul', 'list');
+    (b.assets || []).forEach(function (a) {
+      var li = C.el('li', a.free ? 'done' : '');
+      li.appendChild(C.add(C.el('div', 'cb'), C.el('b', '', a.id + (a.card ? ' · ' + a.card : '')), C.el('span', '', a.route + ', made under its ' + a.why)));
+      li.appendChild(a.free ? C.pill('Free: ' + a.free.replace(/ \(.*\)$/, ''), 'ok') : a.remake.usd ? C.pill('US$' + a.remake.usd.toFixed(2) + ' to remake', 'warn') : C.pill(a.remake.how, ''));
+      list.appendChild(li);
+    });
+    card.appendChild(list);
+    card.appendChild(C.el('p', 'fine', (b.assets || []).length + ' asset' + ((b.assets || []).length === 1 ? '' : 's') + ' would go stale. Remaking those with no free fix: about US$' + (b.totals ? b.totals.usd.toFixed(2) : '0.00') + '. ' + (b.note || '')));
+  }
+  function render(sc) {
+    var card = C.el('main', 'card');
+    var r = sc.record;
+    var head = sc.pending ? C.pill('Not changed yet', 'warn') : sc.ok ? C.pill(r ? (STATE[r.state] || r.state) : 'Done', r && r.state === 'locked' ? 'ok' : '') : C.pill('Not done', 'bad');
+    C.add(card, C.top('Look decision', head), C.el('h1', '', sc.pending ? 'Change the locked ' + (sc.decision || '').replace('style.', '') + '?' : r ? r.id + ': ' + r.label : (sc.action === 'pick' ? 'Picked from the style board' : 'Done')));
+    if (r && r.colours) card.appendChild(chips(r.colours));
+    if (sc.why) card.appendChild(C.el('p', sc.ok ? 'sub' : 'note bad', sc.why));
+    if (sc.pending && sc.blast) {
+      card.appendChild(C.el('p', 'sub', 'From ' + (sc.blast.from || '?') + (sc.blast.to ? ' to ' + sc.blast.to : '') + '. This is what it would make stale:'));
+      blast(card, sc.blast);
+      if (done) card.appendChild(C.el('p', 'note ' + (done === 'changed' ? 'ok' : ''), done === 'changed' ? 'Changed. The stale assets are listed; nothing was remade.' : 'Kept as it was.'));
+      else {
+        var acts = C.el('div', 'actions');
+        acts.appendChild(C.btn('Change it', 'danger', function () {
+          var a = sc.ask || {};
+          C.call('decision_set', { game: sc.game, decision: a.decision, value: a.value, unlock: true, reason: a.reason || 'the person confirmed on the card', confirm: true, by: 'person' }).then(function (res) {
+            done = 'changed';
+            C.tell('changed:' + Date.now(), 'The person confirmed changing the locked ' + a.decision + ' on the card. ' + ((sc.blast.assets || []).length) + ' asset(s) are now stale; nothing was remade. Ask before remaking any.');
+            C.take(res);
+          });
+        }));
+        acts.appendChild(C.btn('Keep it', 'ghost', function () { done = 'kept'; C.tell('kept:' + Date.now(), 'The person kept the locked ' + (sc.ask && sc.ask.decision) + ' as it is.'); C.render(); }));
+        card.appendChild(acts);
+      }
+    } else if (sc.blast) {
+      card.appendChild(C.el('p', 'sub', 'Made under the old one (stale now, nothing remade):'));
+      blast(card, sc.blast);
+    }
+    if (sc.changed && sc.changed.length && sc.action !== 'set') card.appendChild(C.el('p', 'fine', 'Changed: ' + sc.changed.join(', ')));
+    if (sc.refused && sc.refused.length) card.appendChild(C.el('p', 'fine', 'Left as locked: ' + sc.refused.join(', ')));
+    if (!sc.pending && sc.stale && sc.stale.length) card.appendChild(C.el('p', 'note', 'Stale: ' + sc.stale.join(', ') + '. Remaking any is the person\'s call, priced first.'));
+    var foot = C.el('div', 'foot');
+    foot.appendChild(C.el('span', 'when', 'Spent US$' + (sc.spend ? sc.spend.used.toFixed(2) : '0.00') + (sc.spend && sc.spend.cap !== null ? ' of US$' + sc.spend.cap : '')));
+    card.appendChild(foot);
+    return card;
+  }
+  C.start({ kind: 'decision', label: 'Look decision', render: render, poll: null });
+})();

package/mcp/ui/lineup.js

@@ -0,0 +1,68 @@
+/* The lineup card: every made asset at true scale on a 1 m grid under the game's light, front and three-quarter, their
+ * silhouettes at phone size, each asset's flags (over budget, palette drift, an unreadable silhouette, another library
+ * family, stale) and the scene's budgets as bars (asset_lineup). Also a generated prop on its way (asset_make): the price
+ * before anything is paid, the concept to look at, then the model; each paid step only on the person's press. */
+(function () {
+  var C = Card;
+  var state = { busy: null };
+  function bar(label, value, budget, unit) {
+    if (value === null || value === undefined || !budget) return null;
+    var row = C.el('div', 'budget');
+    var pct = Math.min(100, Math.round((value / budget) * 100));
+    var b = C.el('div', 'track'); var f = C.el('i'); f.style.width = pct + '%'; if (value > budget) f.className = 'over'; b.appendChild(f);
+    C.add(row, C.el('span', '', label), b, C.el('span', 'n', (typeof value === 'number' ? value.toLocaleString('en-US') : value) + ' / ' + budget.toLocaleString('en-US') + (unit || '')));
+    return row;
+  }
+  function lineup(card, sc) {
+    var pics = C.el('div', 'preview');
+    [['front', 'Front, true scale on a 1 m grid'], ['quarter', 'Three-quarter, under the game\'s light']].forEach(function (p) { var i = sc.images && C.img(sc.images[p[0]], p[1]); if (i) { i.style.maxHeight = 'none'; i.style.objectFit = 'contain'; pics.appendChild(i); } });
+    card.appendChild(pics);
+    if (sc.images && sc.images.silhouettes) { var s = C.img(sc.images.silhouettes, 'Silhouettes at 64 px'); if (s) { s.className = 'sil'; card.appendChild(s); } }
+    var list = C.el('ul', 'list');
+    (sc.rows || []).forEach(function (r) {
+      var li = C.el('li', r.flags.length ? 'now' : 'done');
+      li.appendChild(C.add(C.el('div', 'cb'), C.el('b', '', r.label + (r.size ? ' · ' + r.size[1] + ' m' : '')), C.el('span', '', r.kind + ', ' + r.route + (r.drift ? (r.drift.repaint ? ' · repainted from style.json in the game' : ' · palette distance ' + r.drift.mean) : '')), r.flags.length ? C.el('span', 'fix', r.flags.join(' · ')) : null));
+      li.appendChild(C.pill(r.flags.length ? r.flags.length + ' flag' + (r.flags.length === 1 ? '' : 's') : 'Fits', r.flags.length ? 'warn' : 'ok'));
+      list.appendChild(li);
+    });
+    card.appendChild(list);
+    if (sc.totals && sc.budgets) {
+      card.appendChild(C.el('h2', '', 'Phone budgets, the whole scene'));
+      [bar('Draw calls', sc.totals.drawCalls, sc.budgets.drawCalls), bar('Triangles', sc.totals.triangles, sc.budgets.triangles), bar('Picture memory', sc.totals.textureMB, sc.budgets.textureMB, ' MB'), bar('First play', sc.totals.firstPlayMB, sc.budgets.firstPlayMB, ' MB')].forEach(function (b) { if (b) card.appendChild(b); });
+    }
+  }
+  function make(card, sc) {
+    var run = function (args, note) {
+      state.busy = note; C.render();
+      var a = { game: sc.game, asset: sc.asset };
+      for (var q in (sc.request || {})) a[q] = sc.request[q];
+      for (var k in args) a[k] = args[k];
+      C.call('asset_make', a).then(function (r) { state.busy = null; C.take(r); }).catch(function () { state.busy = 'That did not reach the studio.'; C.render(); });
+    };
+    if (sc.concept) { var i = C.img(sc.concept, 'The concept for ' + sc.asset); if (i) { i.style.maxHeight = '360px'; i.style.objectFit = 'contain'; card.appendChild(C.add(C.el('div', 'preview'), i)); } }
+    if (sc.dryRun) {
+      card.appendChild(C.el('p', 'sub', (sc.step === 'mesh' ? 'The 3D model' : 'The concept image') + ' costs about US$' + (sc.price ? sc.price.usd : '?') + (sc.total ? '; the whole prop about US$' + sc.total : '') + ', on your own fal account.'));
+      card.appendChild(C.add(C.el('div', 'actions'), C.btn('Make it (US$' + (sc.price ? sc.price.usd : '?') + ')', '', function () { C.tell('approve:' + sc.asset + sc.step, 'The person approved US$' + (sc.price && sc.price.usd) + ' for the ' + sc.step + ' of ' + sc.asset + ' on the card.'); run({ step: sc.step, approve: true }, 'Making it…'); })));
+    } else if (sc.needs === 'approval' || sc.why) card.appendChild(C.el('p', 'note', sc.why || 'Needs the person\'s yes.'));
+    else if ((sc.step === 'concept' || sc.step === 'look') && sc.concept) {
+      card.appendChild(C.el('p', 'sub', 'Look at it: the thing, whole, in the game\'s style, on a plain background? Then the 3D model (about US$' + (sc.then ? sc.then.usd : '0.50') + ').'));
+      card.appendChild(C.add(C.el('div', 'actions'), C.btn('Make the 3D model', '', function () { C.tell('mesh:' + sc.asset, 'The person approved the 3D model of ' + sc.asset + ' (about US$' + (sc.then ? sc.then.usd : '0.50') + ') on the card.'); run({ step: 'mesh', approve: true }, 'Making the model (1 to 3 minutes)…'); })));
+    } else if (sc.step === 'mesh' && sc.after) {
+      card.appendChild(C.el('p', 'note ok', sc.asset + ': ' + sc.before.tris + ' → ' + sc.after.tris + ' triangles, ' + sc.after.kb + ' KB, ' + sc.after.heightM + ' m. Recorded with its receipts and licence.'));
+      card.appendChild(C.add(C.el('div', 'actions'), C.btn('Show the lineup', 'ghost', function () { state.busy = 'Drawing the lineup…'; C.render(); C.call('asset_lineup', { game: sc.game }).then(function (r) { state.busy = null; C.take(r); }); })));
+    }
+  }
+  function render(sc) {
+    var card = C.el('main', 'card');
+    var flagged = sc.mode === 'lineup' ? sc.flagged : null;
+    C.add(card, C.top(sc.mode === 'make' ? 'Make a prop' : 'Lineup', C.add(C.el('div', 'actions'), flagged !== null && flagged !== undefined ? C.pill(flagged ? flagged + ' flagged' : 'One look', flagged ? 'warn' : 'ok') : null, C.fullscreenButton())),
+      C.el('h1', '', sc.mode === 'make' ? sc.asset : 'The cast of ' + sc.game + ', at true scale'));
+    if (state.busy) card.appendChild(C.el('p', 'note', state.busy));
+    if (sc.mode === 'make') make(card, sc); else lineup(card, sc);
+    var foot = C.el('div', 'foot');
+    foot.appendChild(C.el('span', 'when', 'Spent US$' + (sc.spend ? sc.spend.used.toFixed(2) : '0.00') + (sc.spend && sc.spend.cap !== null ? ' of US$' + sc.spend.cap : '') + ' · receipts in art/receipts.jsonl'));
+    card.appendChild(foot);
+    return card;
+  }
+  C.start({ kind: 'lineup', label: 'Lineup', fullscreen: true, render: render, poll: null });
+})();

package/mcp/ui/rights.js

@@ -0,0 +1,30 @@
+/* The rights card: every asset's licence in plain words (asset_rights): where it came from, its licence, the credit it
+ * owes, what a remixer gets; what would stop a public game from publishing, with its fix; and RIGHTS.md itself. */
+(function () {
+  var C = Card;
+  var REMIX = { include: 'A remix gets it', reference: 'A remix fetches it from its origin', none: 'A remix gets a placeholder' };
+  var LICENCE = { cc0: 'CC0 (public domain)', 'cc-by-4.0': 'CC BY 4.0', 'cc-by-3.0': 'CC BY 3.0', own: 'Your own work', generated: 'Generated on your account', qal: 'Quaternius licence', mixamo: 'Mixamo', other: 'Other' };
+  function render(sc) {
+    var card = C.el('main', 'card');
+    var refuse = (sc.problems || []).filter(function (p) { return p.level === 'refuse'; });
+    C.add(card, C.top('Rights', C.pill(refuse.length ? refuse.length + ' to fix' : 'Publishable', refuse.length ? 'bad' : 'ok')), C.el('h1', '', 'Who owns what in ' + sc.game));
+    var list = C.el('ul', 'list');
+    (sc.rows || []).forEach(function (r) {
+      var li = C.el('li', r.license ? 'done' : 'now');
+      li.appendChild(C.add(C.el('div', 'cb'), C.el('b', '', r.id + ' · ' + r.kind), C.el('span', '', (LICENCE[r.license] || r.license || 'NO LICENCE RECORDED') + ' · ' + r.route + (r.from ? ' (' + r.from + ')' : '') + (r.placeholder ? ' · a placeholder' : '')), r.attribution ? C.el('span', 'fix', 'Credit: ' + r.attribution) : null));
+      li.appendChild(C.pill(REMIX[r.remix] || 'No remix rule', r.remix === 'include' ? 'ok' : 'warn'));
+      list.appendChild(li);
+    });
+    card.appendChild(list);
+    (sc.problems || []).forEach(function (p) { card.appendChild(C.el('p', 'note' + (p.level === 'refuse' ? ' bad' : ''), p.asset + ': ' + p.problem + (p.fix ? ' (' + p.fix + ')' : ''))); });
+    if (sc.text) {
+      var d = C.el('details'); d.appendChild(C.el('summary', '', sc.file || 'RIGHTS.md'));
+      d.appendChild(C.el('pre', 'log', sc.text));
+      d.ontoggle = function () { C.size(); };
+      card.appendChild(d);
+    }
+    card.appendChild(C.el('p', 'fine', 'Terms change: read the providers\' live pages again before publishing anything commercial.'));
+    return card;
+  }
+  C.start({ kind: 'rights', label: 'Rights', render: render, poll: null });
+})();

package/mcp/ui/style.js

@@ -0,0 +1,154 @@
+/* The style board card: a game's three directions, each drawn by the game engine (a painted mood image beside it only as
+ * a labelled target), with Pick, Mix, Steer and Lock; and the style decisions with their state (auto, steered, pinned
+ * by use, locked). Every press is the person's: decision_set with by "person", then style_board redraws the card, and
+ * the model is told once what changed. */
+(function () {
+  var C = Card;
+  var STATE = { auto: 'Auto', steered: 'Steered', pinned: 'Pinned', locked: 'Locked' };
+  var STATE_CLS = { auto: '', steered: '', pinned: 'live', locked: 'ok' };
+  var ui = { mix: false, steer: null, busy: false, msg: null };
+  var fontsAsked = {};
+  function loadFont(f) {
+    if (!f || fontsAsked[f] || !/^[A-Za-z0-9 ]{1,40}$/.test(f)) return;
+    fontsAsked[f] = true;
+    var l = document.createElement('link'); l.rel = 'stylesheet';
+    l.href = 'https://fonts.googleapis.com/css2?family=' + encodeURIComponent(f).replace(/%20/g, '+') + ':wght@400;700&display=swap';
+    l.onload = function () { C.size(); };
+    document.head.appendChild(l);
+  }
+  function chips(colours) {
+    var row = C.el('span', 'chips');
+    (colours || []).forEach(function (c) { if (!/^#[0-9a-f]{3,8}$/i.test(c)) return; var s = C.el('span', 'swatch'); s.style.background = c; s.title = c; row.appendChild(s); });
+    return row;
+  }
+  function refresh(sc, note) {
+    return C.call('style_board', { game: sc.game }).then(function (r) { ui.busy = false; ui.msg = note || null; C.take(r); }).catch(function () { ui.busy = false; C.render(); });
+  }
+  function act(sc, args, tell, note) {
+    if (ui.busy) return;
+    ui.busy = true; ui.msg = 'Working…'; C.render();
+    var a = { game: sc.game, by: 'person' };
+    for (var k in args) a[k] = args[k];
+    C.call('decision_set', a).then(function (r) {
+      var why = r && r.isError ? C.textOf(r) : null;
+      if (!why && tell) C.tell(tell.key + ':' + Date.now(), tell.text);
+      refresh(sc, why || note);
+    }).catch(function () { ui.busy = false; ui.msg = 'That did not reach the studio.'; C.render(); });
+  }
+  function direction(sc, d) {
+    var box = C.el('div', 'dir' + (d.chosen ? ' chosen' : ''));
+    if (d.swatch) { var i = C.img(d.swatch, 'Direction ' + d.id.toUpperCase() + ', drawn by the game engine'); if (i) box.appendChild(i); }
+    if (d.mood && d.mood.image) {
+      var m = C.img(d.mood.image, 'A painted mood image (a target)');
+      if (m) { box.appendChild(m); box.appendChild(C.el('p', 'fine', 'Painted target, not what the game draws' + (d.mood.usd ? ' (US$' + d.mood.usd + ')' : ''))); }
+    }
+    var head = C.add(C.el('div', 'dirhead'), C.el('b', '', d.id.toUpperCase()), C.el('span', '', d.label));
+    box.appendChild(head);
+    box.appendChild(chips(d.colours));
+    if (d.fonts && d.fonts.display) {
+      loadFont(d.fonts.display); loadFont(d.fonts.body);
+      var t = C.el('p', 'type', sc.title);
+      t.style.fontFamily = '"' + d.fonts.display + '", var(--f-sans)';
+      var b = C.el('p', 'fine', d.fonts.display + ' and ' + d.fonts.body);
+      if (d.fonts.body) b.style.fontFamily = '"' + d.fonts.body + '", var(--f-sans)';
+      box.appendChild(t); box.appendChild(b);
+    }
+    var acts = C.el('div', 'actions');
+    acts.appendChild(C.btn(d.chosen ? 'Picked' : 'Pick ' + d.id.toUpperCase(), d.chosen ? 'ghost small' : 'small', function () {
+      act(sc, { pick: d.id }, { key: 'pick', text: 'The person picked direction ' + d.id.toUpperCase() + ' (' + d.label + ') on the style board.' }, 'Picked ' + d.id.toUpperCase() + '.');
+    }));
+    box.appendChild(acts);
+    return box;
+  }
+  function mixTable(sc) {
+    var rows = {};
+    sc.directions.forEach(function (d) { (d.rows || []).forEach(function (r) { (rows[r.decision] = rows[r.decision] || {})[d.id] = r; }); });
+    var t = C.el('div', 'mix');
+    Object.keys(rows).forEach(function (dec) {
+      var line = C.el('div', 'mixrow');
+      line.appendChild(C.el('span', 'mixname', dec.replace('style.', '')));
+      sc.directions.forEach(function (d) {
+        var r = rows[dec][d.id]; if (!r) return;
+        var b = C.btn(d.id.toUpperCase() + ' · ' + r.label, r.same ? 'small' : 'ghost small', function () {
+          var m = {}; m[dec] = d.id;
+          act(sc, { mix: m }, { key: 'mix', text: 'The person took the ' + dec + ' of direction ' + d.id.toUpperCase() + ' (' + r.label + ') on the style board.' }, 'Mixed in ' + dec + ' from ' + d.id.toUpperCase() + '.');
+        });
+        b.title = r.same ? 'the game has this now' : 'take this one';
+        line.appendChild(b);
+      });
+      t.appendChild(line);
+    });
+    return t;
+  }
+  function decisions(sc) {
+    var style = (sc.phases || []).filter(function (p) { return p.id === 'style'; })[0];
+    if (!style) return null;
+    var list = C.el('ul', 'list decisions');
+    style.rows.forEach(function (r) {
+      var li = C.el('li', r.state);
+      var body = C.add(C.el('div', 'cb'), C.add(C.el('b'), document.createTextNode(r.name + ' ')), C.el('span', '', r.label + (r.steer ? ' (“' + r.steer + '”)' : '')));
+      if (r.colours) body.appendChild(chips(r.colours));
+      li.appendChild(body);
+      var side = C.el('div', 'actions');
+      side.appendChild(C.pill(STATE[r.state] || r.state, STATE_CLS[r.state] || ''));
+      if (r.state !== 'locked') {
+        side.appendChild(C.btn('Steer', 'ghost small', function () { ui.steer = r.id; C.render(); }));
+        side.appendChild(C.btn('Lock', 'ghost small', function () {
+          act(sc, { decision: r.id, lock: true, words: 'tapped Lock on the style board' }, { key: 'lock', text: 'The person locked ' + r.id + ' (' + r.label + ') on the style board.' }, 'Locked ' + r.name + '.');
+        }));
+      }
+      li.appendChild(side);
+      if (ui.steer === r.id) {
+        var form = C.el('div', 'steer');
+        var input = C.el('input'); input.type = 'text'; input.placeholder = r.id === 'style.palette' ? 'warmer, less saturated, #ff8a3d accent…' : r.id === 'style.camera' ? 'closer, higher, top-down…' : r.id === 'style.light' ? 'golden hour, harder shadows…' : 'in your words';
+        input.maxLength = 100;
+        var go = function () { var w = input.value.trim(); if (!w) return; ui.steer = null; act(sc, { decision: r.id, steer: w }, { key: 'steer', text: 'The person steered ' + r.id + ': "' + w + '".' }, 'Steered ' + r.name + ': ' + w + '.'); };
+        input.onkeydown = function (e) { if (e.key === 'Enter') go(); if (e.key === 'Escape') { ui.steer = null; C.render(); } };
+        form.appendChild(input); form.appendChild(C.btn('Steer', 'small', go));
+        li.appendChild(form);
+        setTimeout(function () { input.focus(); }, 0);
+      }
+      list.appendChild(li);
+    });
+    return list;
+  }
+  function render(sc) {
+    var card = C.el('main', 'card');
+    var locked = 0; var total = 0;
+    (sc.phases || []).forEach(function (p) { if (p.id !== 'style') return; p.rows.forEach(function (r) { total++; if (r.state === 'locked') locked++; }); });
+    C.add(card, C.top('Style board', C.add(C.el('div', 'actions'), C.pill(locked === total && total ? 'Style locked' : locked + ' of ' + total + ' locked', locked === total && total ? 'ok' : ''), C.fullscreenButton())),
+      C.el('h1', '', sc.title), C.el('p', 'sub', sc.line || 'No decisions yet.'));
+    if (ui.msg) card.appendChild(C.el('p', 'note', ui.msg));
+    if (!sc.directions || !sc.directions.length) {
+      card.appendChild(C.el('p', 'note', 'No board yet: three directions, drawn by the game engine, free.'));
+      card.appendChild(C.add(C.el('div', 'actions'), C.btn('Draw the board', '', function () { ui.msg = 'Drawing (about 20 s)…'; C.render(); C.call('style_explore', { game: sc.game }).then(function (r) { ui.msg = null; C.take(r); }); })));
+    } else {
+      var grid = C.el('div', 'dirs');
+      sc.directions.forEach(function (d) { grid.appendChild(direction(sc, d)); });
+      card.appendChild(grid);
+      card.appendChild(C.el('p', 'fine', 'Each swatch is what the game will look like: drawn by its own engine, with the free starter library\'s pieces re-tinted into the palette.'));
+      var bar = C.el('div', 'actions');
+      bar.appendChild(C.btn(ui.mix ? 'Done mixing' : 'Mix', 'ghost small', function () { ui.mix = !ui.mix; C.render(); }));
+      bar.appendChild(C.btn('Lock the style', 'small', function () {
+        act(sc, { decision: 'style.render', lock: 'style', words: 'tapped Lock the style on the style board' }, { key: 'lockall', text: 'The person locked the whole style (every style decision) on the style board.' }, 'The style is locked.');
+      }));
+      if (!sc.directions.some(function (d) { return d.mood; })) {
+        bar.appendChild(C.btn(sc.quote && sc.quote.usd ? 'Paint mood images (US$' + sc.quote.usd + ')' : 'Price mood images', 'ghost small', function () {
+          if (sc.quote && sc.quote.usd) {
+            C.tell('mood:' + Date.now(), 'The person asked for the three painted mood images at about US$' + sc.quote.usd + ' on their own fal account (a target, labelled so). Make them with style_explore paid and approve.');
+            ui.msg = 'Asked your AI to paint them (about US$' + sc.quote.usd + ', your fal account).'; C.render();
+          } else { ui.msg = 'Pricing…'; C.render(); C.call('style_explore', { game: sc.game, paid: true }).then(function (r) { ui.msg = null; C.take(r); }); }
+        }));
+      }
+      card.appendChild(bar);
+      if (ui.mix) card.appendChild(mixTable(sc));
+    }
+    var dl = decisions(sc);
+    if (dl) { card.appendChild(C.el('h2', '', 'Style decisions')); card.appendChild(dl); }
+    var foot = C.el('div', 'foot');
+    foot.appendChild(C.el('span', 'when', (sc.stale && sc.stale.length ? sc.stale.length + ' stale asset' + (sc.stale.length === 1 ? '' : 's') + ' · ' : '') + 'Spent US$' + (sc.spend ? sc.spend.used.toFixed(2) : '0.00') + (sc.spend && sc.spend.cap !== null ? ' of US$' + sc.spend.cap : '')));
+    card.appendChild(foot);
+    return card;
+  }
+  C.start({ kind: 'style', label: 'Style board', fullscreen: true, render: render, poll: null });
+})();