azeroth-shell 0.2.0 → 0.3.0

package/src/cli/tuiPaperdoll.mjs

@@ -1,4 +1,4 @@
-// The Gear tab as a character sheet: you in your gear in the middle, the worn pieces' icons down both sides
+// The Character tab as a sheet: you in your gear in the middle, the worn pieces' icons down both sides
 // the way the client's paperdoll lays them out (head to wrists on the left, hands to trinkets on the right,
 // the weapons and the bag bar underneath), each framed in its quality colour. Arrows move between the
 // slots (Up and Down in order, Shift+arrows across the picture), the detail pane is the piece's tooltip, and Enter, x and r act on the slot as they do in the list.
@@ -35,7 +35,7 @@ function sheetSize(w, h, extras) {
   return null;
 }
 
-/** Will the Gear tab draw as the sheet right now? `extras` is how many rows follow the slots. */
+/** Will the Character tab draw as the sheet right now? `extras` is how many rows follow the slots. */
 export function paperdollPlan(app, extras) {
   if (!iconsOn()) return null;
   const L = app.layout();
@@ -44,9 +44,10 @@ export function paperdollPlan(app, extras) {
 
 /**
  * The sheet's lines for the gear view's `rows` in a `W` x `H` pane, with `body(cols, lines)` drawing the
- * character (playerArt), plus where the arrows go; null when it does not fit.
+ * character (playerArt) and `title` heading it, plus where the arrows go; null when it does not fit. `hint`
+ * replaces the keys line (a companion's sheet has no repair or outfits).
  */
-export function paperdollGrid(app, rows, W, H, body) {
+export function paperdollGrid(app, rows, W, H, body, title, hint) {
   const extraRows = rows.map((r, i) => ({ r, i })).filter(({ r }) => !r.cell && !r.header);
   const plan = iconsOn() ? sheetSize(W, H, extraRows.length) : null;
   if (!plan) return null;
@@ -58,7 +59,7 @@ export function paperdollGrid(app, rows, W, H, body) {
   const top = 2, colH = SIDE * ch;
 
   const ups = rows.filter((r) => r.cell?.up).length;
-  cv.text(1, 0, `${bold('Equipment')}   ${ups ? green(`▲ ${plural(ups, 'upgrade')} in your bags   u: put on all`) : dim(`Shift+arrows: move on the sheet   Enter: change${plan.extras ? '' : '   R: repair all   o: outfits'}`)}`);
+  cv.text(1, 0, `${title ?? bold('Equipment')}   ${ups ? green(`▲ ${plural(ups, 'upgrade')} in your bags   u: put on all`) : dim(hint ?? `s: stats   Shift+arrows: move   Enter: change${plan.extras ? '' : '   R: repair all   o: outfits'}`)}`);
 
   // Labels take a share of the width beside each column; the body gets the middle.
   const lw = Math.max(0, Math.min(22, Math.floor((W - 2 * cw) * 0.28)));

package/src/cli/tuiPartyStage.mjs

@@ -10,7 +10,7 @@ import { dim, gray, fit } from './text.mjs';
 import { SIZES, canvas, put, putLines, putRight, floorLine, narrowPlate, narrowState, auraRows, putMissiles, putPopsAbove, POP_MS, LUNGE_MS } from './tuiStage.mjs';
 import { creatureArt, artWidth } from './modelArt.mjs';
 import { paperdollArt } from './paperdoll.mjs';
-import { playerArt } from './tuiViews.mjs';
+import { playerArt, wornNow, wornArt } from './tuiViews.mjs';
 import { iconsOn } from './iconArt.mjs';
 import { allyIndexOfSide } from '../engine/core/events.ts';
 import { combatDistanceYd, DEFAULT_OPEN_YD, MELEE_CONTACT_YD } from '../engine/combat/combatGeometry.ts';
@@ -19,6 +19,7 @@ const GAP = 1;        // columns between two columns of the same side
 const LANE = 6;       // columns kept open between a party column and a foe column, for the glyphs that cross
 const PLATE_MIN = 9;  // a plate's narrowest: a 5-cell bar and "100%"
 const PLATE_FULL = 14; // and its widest when the stage has width to spare: a 10-cell bar, a 12-letter name
+const SWAP_YD = 2;    // how much clearer of a neighbour a unit must be, in yards, before the two trade places
 const SIZE_ORDER = ['xs', 's', 'm', 'l'];
 // Who stands nearest the foes among units on the same spot (the melee pile opens on one): the healer last.
 const ROLE_RANK = { healer: 0, damage: 2, tank: 3 };
@@ -31,12 +32,13 @@ function companionOf(app, v) {
   return byIndex?.name === v.name ? byIndex : squad.find((c) => c.name === v.name) ?? byIndex;
 }
 
-/** A unit's sprite in a box: you in your gear, a creature by its display id, a companion in its gear. */
+/** A unit's sprite in a box: you or a companion in your form or gear, a creature by its display id. */
 function spriteOf(app, u, cols, rows) {
-  if (u.isPlayer) return playerArt(app, cols, rows)?.lines ?? null;
+  if (u.isPlayer) return playerArt(app, cols, rows, u.v)?.lines ?? null;
   if (u.v.creatureEntry != null) return creatureArt(app.ds.creature(u.v.creatureEntry)?.displayId, cols, rows);
   const comp = u.friend ? companionOf(app, u.v) : null;
-  return comp ? paperdollArt(comp, cols, rows) : null;
+  if (!comp) return null;
+  return wornArt(wornNow(app.ds, comp, u.v), cols, rows) ?? paperdollArt(comp, cols, rows);
 }
 
 /** The box a unit gets when the big ones get `size`: pets a size under, a boss a size over. */
@@ -106,8 +108,10 @@ export function partyStage(app, ctl, W, H, { inline }) {
   // a mob that runs onto the healer crosses to the lane while the healer stays put, and a mage walking into
   // range slides in while its mob stands. Melee units park all round a mob, so this is read off distances, not
   // bearings: a rogue behind its target still stands on the party's side.
+  // A corpse, or a body with nobody living left to measure against (the last foe falls, the win holds), stays
+  // where it last stood: without this the whole party walks back to where it opened under the loot.
   const posOf = (u) => s.unitPosYd?.(u.key);
-  mem.openPos ??= new Map(); mem.openD ??= new Map();
+  mem.openPos ??= new Map(); mem.openD ??= new Map(); mem.lastC ??= new Map();
   const nearest = (u) => {
     let best = null;
     for (const o of units) {
@@ -131,7 +135,12 @@ export function partyStage(app, ctl, W, H, { inline }) {
     const c0 = 1 - frac(mem.openD.get(u.key));
     return Math.max(0, Math.min(1, c0 + (1 - frac(n.d) - c0) * share));
   };
-  for (const col of cols) col.c = closingOf(col);
+  for (const col of cols) {
+    const held = mem.lastC.get(col.key);
+    if (held != null && (col.v.hp <= 0 || !near.get(col.key))) { col.c = held; continue; }
+    col.c = closingOf(col);
+    mem.lastC.set(col.key, col.c);
+  }
   // The party's half and the pack's, the free width shared by head count, the lane between. In each half the
   // columns stand by their closing, the nearest to the lane innermost; on the same spot the healer, the
   // ranged, the melee, then the tank, and the foe you face before the rest. Then nobody overlaps: a column
@@ -145,6 +154,26 @@ export function partyStage(app, ctl, W, H, { inline }) {
   const q = (col) => Math.round(col.c * 50);
   friends.sort((a, b) => q(a) - q(b) || a.order - b.order);
   foes.sort((a, b) => q(b) - q(a) || a.order - b.order);
+  // The lineup holds: two neighbours trade places only when one is more than SWAP_YD clearer of the other, so a
+  // melee pile that jitters by a yard does not flicker. A newcomer takes its sorted slot; the rest keep last
+  // frame's order among theirs, then adjacent pairs out of order by more than the leeway swap until none are.
+  mem.lineup ??= new Map();
+  const leeway = SWAP_YD / Math.max(1, mem.openYd - MELEE_CONTACT_YD);
+  const hold = (list, key) => {
+    const known = list.filter((col) => mem.lineup.has(col.key)).sort((a, b) => mem.lineup.get(a.key) - mem.lineup.get(b.key));
+    let k = 0;
+    for (let i = 0; i < list.length; i++) if (mem.lineup.has(list[i].key)) list[i] = known[k++];
+    for (let swapped = true; swapped;) {
+      swapped = false;
+      for (let i = 0; i + 1 < list.length; i++) {
+        if (key(list[i]) - key(list[i + 1]) <= leeway) continue;
+        [list[i], list[i + 1]] = [list[i + 1], list[i]]; swapped = true;
+      }
+    }
+    list.forEach((col, i) => mem.lineup.set(col.key, i));
+  };
+  hold(friends, (col) => col.c);
+  hold(foes, (col) => -col.c);
   const place = (list, L, R) => {
     for (const col of list) col.x = col.friend ? L + col.c * (R - col.cw - L) : R - col.cw - col.c * (R - col.cw - L);
     for (let i = 1; i < list.length; i++) list[i].x = Math.max(list[i].x, list[i - 1].x + list[i - 1].cw + GAP);
@@ -164,7 +193,7 @@ export function partyStage(app, ctl, W, H, { inline }) {
       putLines(c, col.ax, col.top, col.art);
     }
     putLines(c, col.x, zone, narrowPlate(app, v, { ...col, dead, w: col.cw }));
-    const state = narrowState(v, now, col.cw);
+    const state = narrowState(v, now, col.cw, mem.casts?.get(col.key));
     if (state) put(c, col.x, stateRow, state);
     if (showAuras && !col.small && !dead) putLines(c, col.x, auraTop, auraRows(app, mem, v, col.key, col.cw, icons));
     putPopsAbove(c, col, (mem.pops.get(col.key) ?? []).filter((p) => now - p.t < POP_MS), now, zone);

package/src/cli/tuiPet.mjs

@@ -1,9 +1,8 @@
 // Your pet (hunter, warlock): the page with command, react, food and abilities; the stable; the pet trainer.
 // Ports phonecraft playChrome.ts's feed modal, render/petBar.ts, panels/stablePanel.ts and the pet trainer rows.
-import { bold, dim, cyan, yellow, green, red, itemText } from './text.mjs';
+import { bold, dim, cyan, yellow, green, red, itemText, coinText } from './text.mjs';
 import { itemLines, spellLines } from './tuiViews.mjs';
-import { moneyText } from '../domain/economy/money.ts';
-import { LOYALTY_NAMES, petHasHappiness, petKnownSpells, petAutocastOn } from '../domain/pet/pet.ts';
+import { LOYALTY_NAMES, HAPPINESS_MAX, petHasHappiness, petKnownSpells, petAutocastOn } from '../domain/pet/pet.ts';
 import { MAX_PET_STABLES, STABLE_SLOT_PRICES } from '../domain/pet/petStable.ts';
 import { zonePetTrainers } from '../world/world.ts';
 import { MAX_SOUL_SHARD_CAP } from '../autopilot/config.ts';
@@ -15,7 +14,7 @@ export const hasPetClass = (app) => app.ch.cls === HUNTER || app.ch.cls === WARL
 function petStatus(app, pet) {
   const cdef = app.ds.creature(pet.creature);
   const bits = [`${pet.health <= 0 ? red('dead') : `${pet.health} health`}`];
-  if (cdef && petHasHappiness(cdef)) bits.push(`happiness ${pet.happiness}%`, LOYALTY_NAMES[pet.loyalty ?? 1] ?? '');
+  if (cdef && petHasHappiness(cdef)) bits.push(`happiness ${Math.round((pet.happiness / HAPPINESS_MAX) * 100)}%`, LOYALTY_NAMES[pet.loyalty ?? 1] ?? '');
   if (pet.trainingPoints != null) bits.push(`${pet.trainingPoints} training points`);
   return bits.filter(Boolean).join(', ');
 }
@@ -81,7 +80,7 @@ function stableRows(app) {
     rows.push({ text: `  Slot ${i + 1}: ${p ? `${p.name} ${dim(app.ds.creature(p.creature)?.name ?? '')}` : dim('empty')}`, detail: () => [bold(`Stable slot ${i + 1}`), '', p ? `Enter: call ${p.name}${ch.pet ? `, stabling ${ch.pet.name} in its place` : ''}.` : 'Empty.'], act: () => { if (p) app.result(g.callStabledPet(i + 1), `${p.name} comes to you.`); } });
   }
   if (ch.pet || ch.storedPet) rows.push({ text: `Stable ${(ch.pet ?? ch.storedPet).name}`, act: () => { const r = g.stablePet(); app.result(r, r.ok ? `Stabled in slot ${r.slot}.` : ''); } });
-  if (slots < MAX_PET_STABLES) rows.push({ text: `Buy a stable slot ${yellow(moneyText(STABLE_SLOT_PRICES[slots] ?? 0))}`, act: () => { const r = g.buyStableSlot(); app.result(r, r.ok ? `A stable slot for ${moneyText(r.spent)}.` : ''); } });
+  if (slots < MAX_PET_STABLES) rows.push({ text: `Buy a stable slot ${coinText(STABLE_SLOT_PRICES[slots] ?? 0)}`, act: () => { const r = g.buyStableSlot(); app.result(r, r.ok ? `A stable slot for ${coinText(r.spent)}.` : ''); } });
   return rows;
 }
 
@@ -99,13 +98,22 @@ export function petTrainerDialog(app, trainer) {
     id: `pettrainer-${trainer.entry}`, title: trainer.name, hint: 'Enter: buy the rank',
     rows(a) {
       const known = new Set(a.ch.petSpells ?? []);
-      const rows = [H(`${bold(trainer.name)} ${dim('<Pet Trainer>')}   ${yellow(moneyText(a.ch.gold) || '0c')}`), H(dim('A rank bought here is yours for good; Beast Training teaches it to whichever pet is out.')), H('')];
+      const rows = [H(`${bold(trainer.name)} ${dim('<Pet Trainer>')}   ${coinText(a.ch.gold)}`), H(dim('A rank bought here is yours for good; Beast Training teaches it to whichever pet is out.')), H('')];
+      const pet = a.ch.pet, untrainCost = a.g.untrainPetCost();
+      if (pet && untrainCost != null) {
+        const taught = pet.taughtSpells?.length ?? 0;
+        rows.push({
+          text: `Untrain ${pet.name}  ${coinText(untrainCost)}${taught ? '' : dim('  nothing taught')}`,
+          detail: () => [bold('Untrain pet'), '', `${pet.name} forgets the ${taught} abilit${taught === 1 ? 'y' : 'ies'} you taught it and gets every training point back to spend again. Its innate abilities stay, and the ranks you bought stay in Beast Training.`, '', `Cost: ${coinText(untrainCost)}. It climbs with each untrain, up to 10 gold, and falls back to 10 silver a day later.`, '', dim('Enter: untrain')],
+          act: () => a.confirm(`Untrain ${pet.name} for ${coinText(untrainCost)}?`, () => { const r = a.g.untrainPet(trainer.entry); a.result(r, r.ok ? `${pet.name} forgets its training: ${a.ch.pet?.trainingPoints ?? 0} training points to spend.` : ''); }),
+        }, H(''));
+      }
       const list = trainer.spells.map((ts) => ({ ts, sp: a.ds.spell(ts.spell) })).filter((x) => x.sp).sort((x, y) => x.ts.reqLevel - y.ts.reqLevel || x.sp.name.localeCompare(y.sp.name));
       for (const { ts, sp } of list) {
         const have = known.has(sp.id), low = ts.reqLevel > a.ch.level;
         rows.push({
-          text: `${have ? green('✓ ') : '  '}${low || have ? dim(sp.name) : sp.name}${sp.rank ? dim(` (Rank ${sp.rank})`) : ''}  ${yellow(moneyText(ts.cost) || 'free')}${low ? red(`  level ${ts.reqLevel}`) : ''}`,
-          detail: () => spellLines(a, sp, ['', `Cost: ${yellow(moneyText(ts.cost) || 'free')}`]),
+          text: `${have ? green('✓ ') : '  '}${low || have ? dim(sp.name) : sp.name}${sp.rank ? dim(` (Rank ${sp.rank})`) : ''}  ${coinText(ts.cost, 'free')}${low ? red(`  level ${ts.reqLevel}`) : ''}`,
+          detail: () => spellLines(a, sp, ['', `Cost: ${coinText(ts.cost, 'free')}`]),
           act: () => { if (!have) a.result(a.g.buyPetSpell(trainer.entry, sp.id), `You learn ${sp.name} for your pets.`); },
         });
       }

package/src/cli/tuiProfessions.mjs

@@ -3,10 +3,10 @@
 // Send goods. Ported from phonecraft's professionsPanel.ts and the vendorPanel.ts send-goods overlay.
 // A craft buys short vendor reagents (vials, thread, flux) from your purse on the way: the buy-in phonecraft
 // shows as a coin chip on Create. Views only read; every change is a Game facade call.
-import { bold, dim, cyan, yellow, green, red, gray, orange, qualityPaint, fit, plural, secondsText, wrapLines, itemText } from './text.mjs';
+import { bold, dim, cyan, yellow, green, red, gray, orange, qualityPaint, fit, plural, secondsText, wrapLines, itemText, coinText } from './text.mjs';
 import { itemLines } from './tuiViews.mjs';
 import { missionDialog, companionDialog } from './tuiCompanions.mjs';
-import { moneyText, coinsText } from '../domain/economy/money.ts';
+import { coinsText } from '../domain/economy/money.ts';
 import { className } from '../domain/core/ids.ts';
 import { countItem, emptyInventory } from '../domain/items/inventory.ts';
 import { equippedEntry } from '../domain/items/itemInstance.ts';
@@ -102,7 +102,7 @@ function craftCheck(app, cr, r, env) {
   if (chk.reason !== 'Missing reagents') return { ok: false, reason: chk.reason, cost: 0, buys: [], max: 0 };
   const b = vendorBuyInReady(app.ds, app.ch, r.reagents, cr.inv);
   if (!b.ok) {
-    const reason = b.blocked.length ? `Missing ${b.blocked.map((i) => app.itemLabel(i)).join(', ')}` : `Need ${moneyText(b.cost)} for ${buyList(app, b.buys)}`;
+    const reason = b.blocked.length ? `Missing ${b.blocked.map((i) => app.itemLabel(i)).join(', ')}` : `Need ${coinText(b.cost)} for ${buyList(app, b.buys)}`;
     return { ok: false, short: true, reason, cost: b.cost, buys: b.buys, max: 0 };
   }
   const again = canCraft(cr.char, applyVendorBuys(app.ds, cr.inv, b.buys), r, env.focus, null, env.tools);
@@ -112,7 +112,7 @@ function craftEnv(app) { return { focus: zoneFocus(app), tools: sharedTools(app)
 
 /** One status chip for a recipe row: how many you can make, what the buy-in costs, or why not. */
 function craftChip(chk) {
-  if (chk.ok) return green(`${chk.max} ready`) + (chk.cost ? yellow(`  buys ${moneyText(chk.cost)}`) : '');
+  if (chk.ok) return green(`${chk.max} ready`) + (chk.cost ? yellow(`  buys ${coinText(chk.cost)}`) : '');
   return (chk.short ? dim : red)(chk.reason ?? 'cannot make');
 }
 
@@ -143,7 +143,7 @@ function craftMany(app, cr, r, want, all = false) {
   if (!made) { app.say(red(reason ?? 'Cannot make that.')); return; }
   const prod = app.ds.item(r.product.item);
   app.say(green(`${cr.id ? `${cr.name} creates` : 'You create'} ${itemText(prod, r.name)}${units > 1 ? ` x${units}` : ''}.`)
-    + (spent ? yellow(`  Vendor reagents ${moneyText(spent)}.`) : '')
+    + (spent ? yellow(`  Vendor reagents ${coinText(spent)}.`) : '')
     + (made < n && reason ? dim(`  Stopped after ${made}: ${reason}`) : ''));
   if (skill != null) app.say(cyan(`${whose(cr)} ${app.ds.profession(r.skill)?.name ?? r.skill} skill is now ${skill}.`));
   for (const l of other.reverse()) app.say(dim('· ' + coinsText(l)));
@@ -193,7 +193,7 @@ function reagentLines(app, reagents, tools, inv) {
     const vendor = !ok && it && unlimitedVendorFor(app.ds, rg.item, app.ch.race) != null;
     const lot = Math.max(1, it?.buyCount ?? 1);
     const cost = vendor ? Math.ceil((rg.count - have) / lot) * it.buyPrice : 0;
-    out.push(`  ${(ok ? green : vendor ? yellow : red)(`${have}/${rg.count}`)} ${app.itemLabel(rg.item)}${vendor ? dim(`  vendor ${moneyText(cost)}`) : ''}`);
+    out.push(`  ${(ok ? green : vendor ? yellow : red)(`${have}/${rg.count}`)} ${app.itemLabel(rg.item)}${vendor ? dim(`  vendor ${coinText(cost)}`) : ''}`);
   }
   for (const t of tools ?? []) {
     const ok = countItem(inv, t) > 0 || sharedTools(app).has(t);
@@ -214,7 +214,7 @@ function recipeDetail(app, cr, r, chk, who) {
   out.push(...wearerLines(app, r.product.item, who));
   out.push('');
   if (chk.ok) {
-    if (chk.cost) out.push(yellow(`Buys ${buyList(app, chk.buys)} for ${moneyText(chk.cost)} from your purse.`));
+    if (chk.cost) out.push(yellow(`Buys ${buyList(app, chk.buys)} for ${coinText(chk.cost)} from your purse.`));
     out.push(green(`Enter: make one   A: make ${chk.max}   N: a number`));
   } else out.push(red(chk.reason ?? 'Cannot make this.'));
   if (cr.id) out.push('', dim(`${cr.name} crafts from the whole party's bags and banks. What they make lands in their bags.`));
@@ -246,7 +246,7 @@ export function recipeBook(app, crafterId, skill) {
       const cr = current();
       const sk = cr.char.skills[skill];
       const env = craftEnv(a);
-      const rows = [H(`${bold(cr.name)}  ${prof?.name ?? skill} ${sk ? `${sk.current}/${sk.max}` : dim('untrained')}${sk && prof ? dim(`  ${currentRank(cr.char, prof)?.name ?? ''}`) : ''}   ${yellow(moneyText(a.ch.gold) || '0c')}`)];
+      const rows = [H(`${bold(cr.name)}  ${prof?.name ?? skill} ${sk ? `${sk.current}/${sk.max}` : dim('untrained')}${sk && prof ? dim(`  ${currentRank(cr.char, prof)?.name ?? ''}`) : ''}   ${coinText(a.ch.gold)}`)];
       const filters = [haveOnly && 'only what you can make', search && `matching "${search}"`].filter(Boolean);
       rows.push(H(dim(filters.length ? `Showing ${filters.join(', ')}.` : 'c: switch crafter   h: only what you can make   /: search')));
       if (GATHER_LINES.has(skill)) rows.push(...gatherRows(a, skill, cr));
@@ -359,7 +359,7 @@ function enchantCheck(app, cr, e, env) {
   if (e.reagents.every((rg) => countItem(cr.inv, rg.item) >= rg.count)) return { ok: true, cost: 0, buys: [] };
   const b = vendorBuyInReady(app.ds, app.ch, e.reagents, cr.inv);
   if (b.ok) return { ok: true, cost: b.cost, buys: b.buys };
-  return { ok: false, short: true, reason: b.blocked.length ? `Missing ${b.blocked.map((i) => app.itemLabel(i)).join(', ')}` : `Need ${moneyText(b.cost)}`, cost: b.cost, buys: b.buys };
+  return { ok: false, short: true, reason: b.blocked.length ? `Missing ${b.blocked.map((i) => app.itemLabel(i)).join(', ')}` : `Need ${coinText(b.cost)}`, cost: b.cost, buys: b.buys };
 }
 
 /** Whose worn piece can take this enchant: you and the party, one option per matching slot. */
@@ -406,7 +406,7 @@ function enchantBench(app, crafterId) {
       const cr = current(), ds = a.ds;
       const sk = cr.char.skills.enchanting;
       const env = craftEnv(a);
-      const rows = [H(`${bold(cr.name)}  Enchanting ${sk ? `${sk.current}/${sk.max}` : dim('untrained')}   ${dim(`rod: ${bestRodTier(cr.inv, ds, env.tools) ? rodNameForTier(bestRodTier(cr.inv, ds, env.tools), ds) : 'none'}`)}   ${yellow(moneyText(a.ch.gold) || '0c')}`), H(dim('c: switch enchanter'))];
+      const rows = [H(`${bold(cr.name)}  Enchanting ${sk ? `${sk.current}/${sk.max}` : dim('untrained')}   ${dim(`rod: ${bestRodTier(cr.inv, ds, env.tools) ? rodNameForTier(bestRodTier(cr.inv, ds, env.tools), ds) : 'none'}`)}   ${coinText(a.ch.gold)}`), H(dim('c: switch enchanter'))];
       const known = new Set(cr.char.knownEnchants ?? []);
       const formulas = ds.enchants().filter((e) => known.has(e.id)).sort((x, y) => y.orange - x.orange || x.name.localeCompare(y.name));
       const W = Math.max(20, Math.min(34, a.layout().listW - 31));
@@ -415,7 +415,7 @@ function enchantBench(app, crafterId) {
       for (const e of formulas) {
         const chk = enchantCheck(a, cr, e, env);
         rows.push({
-          text: `${fit(DIFF_PAINT[diffOf(cr, 'enchanting', e)](e.name.replace(/^Enchant\s+/, '')), W)} ${chk.ok ? green('ready') + (chk.cost ? yellow(`  buys ${moneyText(chk.cost)}`) : '') : (chk.short ? dim : red)(chk.reason)}`,
+          text: `${fit(DIFF_PAINT[diffOf(cr, 'enchanting', e)](e.name.replace(/^Enchant\s+/, '')), W)} ${chk.ok ? green('ready') + (chk.cost ? yellow(`  buys ${coinText(chk.cost)}`) : '') : (chk.short ? dim : red)(chk.reason)}`,
           detail: () => [bold(e.name), dim(`goes on: ${e.slots.join(', ')}   ${rodNameForTier(e.minRodTier, ds)}`), '', ...reagentLines(a, e.reagents, [], cr.inv), '',
             `${DIFF_PAINT[diffOf(cr, 'enchanting', e)](diffOf(cr, 'enchanting', e))}   ${upPct(cr, 'enchanting', e) ? `${upPct(cr, 'enchanting', e)}% skill-up` : dim('no skill-up')}`, '',
             chk.ok ? green('Enter: pick whose gear to enchant') : red(chk.reason)],
@@ -489,7 +489,7 @@ function partyBook(app) {
         groups.set(r.skill, g);
       }
       const ready = [...byRecipe.values()].filter((o) => o.some((x) => x.chk.ok)).length;
-      const rows = [H(`${plural(byRecipe.size, 'recipe')} known across ${plural(all.length, 'crafter')}, ${ready} ready   ${yellow(moneyText(a.ch.gold) || '0c')}`), H(dim(haveOnly ? 'Showing what someone can make now. h shows everything.' : 'Showing every known recipe. h shows only what someone can make.'))];
+      const rows = [H(`${plural(byRecipe.size, 'recipe')} known across ${plural(all.length, 'crafter')}, ${ready} ready   ${coinText(a.ch.gold)}`), H(dim(haveOnly ? 'Showing what someone can make now. h shows everything.' : 'Showing every known recipe. h shows only what someone can make.'))];
       if (!groups.size) rows.push(H(''), H(dim(byRecipe.size ? '  Nobody can make anything right now. h shows every recipe.' : '  Nobody in the party knows a recipe yet.')));
       const W = Math.max(20, Math.min(34, a.layout().listW - 34));
       for (const [skill, list] of [...groups].sort((x, y) => x[0].localeCompare(y[0]))) {
@@ -527,9 +527,9 @@ function specRows(app, trainer) {
     const name = sp?.name ?? it.kind.replace(/^(un)?learn_/, '');
     const cost = it.costCopper ?? 0;
     rows.push({
-      text: `${unlearn ? red(`Unlearn ${name}`) : green(`Become a specialist: ${name}`)}${cost ? `  ${yellow(moneyText(cost))}` : ''}`,
-      detail: () => [bold(name), '', unlearn ? 'Forget this specialisation and the recipes that go with it.' : 'A specialisation opens its own recipes. You can hold one at a time.', ...(cost ? ['', `Cost ${moneyText(cost)}`] : [])],
-      act: (a) => (unlearn ? a.confirm(`Unlearn ${name}${cost ? ` for ${moneyText(cost)}` : ''}? Its recipes are forgotten.`, () => applySpec(a, trainer, it, name, true)) : applySpec(a, trainer, it, name, false)),
+      text: `${unlearn ? red(`Unlearn ${name}`) : green(`Become a specialist: ${name}`)}${cost ? `  ${coinText(cost)}` : ''}`,
+      detail: () => [bold(name), '', unlearn ? 'Forget this specialisation and the recipes that go with it.' : 'A specialisation opens its own recipes. You can hold one at a time.', ...(cost ? ['', `Cost ${coinText(cost)}`] : [])],
+      act: (a) => (unlearn ? a.confirm(`Unlearn ${name}${cost ? ` for ${coinText(cost)}` : ''}? Its recipes are forgotten.`, () => applySpec(a, trainer, it, name, true)) : applySpec(a, trainer, it, name, false)),
     });
   }
   rows.push(H(''));
@@ -569,21 +569,21 @@ export function profTrainerDialog(app, trainer) {
           const before = a.ch.gold;
           if (learn(a, t).ok) { n++; spent += before - a.ch.gold; }
         }
-        a.say(n ? green(`You learn ${plural(n, 'recipe')}${spent ? ` for ${moneyText(spent)}` : ''}.`) : dim('Nothing you can learn yet.'));
+        a.say(n ? green(`You learn ${plural(n, 'recipe')}${spent ? ` for ${coinText(spent)}` : ''}.`) : dim('Nothing you can learn yet.'));
       } },
     },
     rows(a) {
       const ch = a.ch, sk = ch.skills[trainer.skill];
       const mod = vendorPriceMultiplierFor(ds, ch, trainer.entry);
-      const rows = [H(`${bold(trainer.name)} ${dim(`<${prof?.name ?? trainer.skill} Trainer>`)}   ${yellow(moneyText(ch.gold) || '0c')}`), H(dim(sk ? `Your ${prof?.name} skill: ${sk.current}/${sk.max}` : `You do not know ${prof?.name ?? trainer.skill} yet.`)), H('')];
+      const rows = [H(`${bold(trainer.name)} ${dim(`<${prof?.name ?? trainer.skill} Trainer>`)}   ${coinText(ch.gold)}`), H(dim(sk ? `Your ${prof?.name} skill: ${sk.current}/${sk.max}` : `You do not know ${prof?.name ?? trainer.skill} yet.`)), H('')];
       const nr = prof ? nextTrainerRank(ch, prof) : undefined;
       if (nr) {
         const cost = trainerSpellCost(nr.cost, mod);
         const need = nextRankReqSkill(nr, sk);
         const why = ch.level < nr.reqLevel ? `requires level ${nr.reqLevel}` : (sk?.current ?? 0) < need ? `requires ${prof.name} ${need}` : ch.gold < cost ? 'not enough money' : '';
         rows.push(H('Rank'), {
-          text: `${why ? dim(`${sk ? 'Train' : 'Learn'} ${nr.name} ${prof.name}`) : green(`${sk ? 'Train' : 'Learn'} ${nr.name} ${prof.name}`)}  ${yellow(moneyText(cost) || 'free')}${why ? red(`  ${why}`) : ''}`,
-          detail: () => [bold(`${nr.name} ${prof.name}`), `Raises your ${prof.name} cap to ${nr.cap}.`, '', `Requires level ${nr.reqLevel}${need ? `, ${prof.name} ${need}` : ''}`, `Cost ${moneyText(cost) || 'free'}`, '', prof.kind !== 'secondary' && !sk ? dim('You can hold two primary professions. Cooking, First Aid and Fishing do not count.') : ''],
+          text: `${why ? dim(`${sk ? 'Train' : 'Learn'} ${nr.name} ${prof.name}`) : green(`${sk ? 'Train' : 'Learn'} ${nr.name} ${prof.name}`)}  ${coinText(cost, 'free')}${why ? red(`  ${why}`) : ''}`,
+          detail: () => [bold(`${nr.name} ${prof.name}`), `Raises your ${prof.name} cap to ${nr.cap}.`, '', `Requires level ${nr.reqLevel}${need ? `, ${prof.name} ${need}` : ''}`, `Cost ${coinText(cost, 'free')}`, '', prof.kind !== 'secondary' && !sk ? dim('You can hold two primary professions. Cooking, First Aid and Fishing do not count.') : ''],
           act: () => a.result(a.g.learnProfession(trainer.entry), `You are now a${/^[AEIOU]/.test(nr.name) ? 'n' : ''} ${nr.name} ${prof.name}.`),
         }, H(''));
       } else if (sk) rows.push(H(dim(prof?.kind === 'secondary' && sk.max < 300 ? 'Expert and Artisan come from books, not trainers.' : 'You hold the highest rank they teach.')), H(''));
@@ -598,14 +598,14 @@ export function profTrainerDialog(app, trainer) {
         const cost = trainerSpellCost(t.def.cost ?? 0, mod);
         const prod = t.kind === 'recipe' ? ds.item(t.def.product.item) : null;
         rows.push({
-          text: `${fit(ch.gold >= cost ? t.def.name : dim(t.def.name), W)} ${yellow(moneyText(cost) || 'free')}`,
-          detail: () => [...(prod ? itemLines(a, prod).filter((l) => !/Sells for/.test(l)) : [bold(t.def.name), dim(`goes on: ${t.def.slots.join(', ')}`)]), '', ...reagentLines(a, t.def.reagents, t.def.requiredTools, a.g.state.inventory), '', dim(`Requires ${prof?.name} ${t.def.orange}   cost ${moneyText(cost) || 'free'}`)],
+          text: `${fit(ch.gold >= cost ? t.def.name : dim(t.def.name), W)} ${coinText(cost, 'free')}`,
+          detail: () => [...(prod ? itemLines(a, prod).filter((l) => !/Sells for/.test(l)) : [bold(t.def.name), dim(`goes on: ${t.def.slots.join(', ')}`)]), '', ...reagentLines(a, t.def.reagents, t.def.requiredTools, a.g.state.inventory), '', dim(`Requires ${prof?.name} ${t.def.orange}   cost ${coinText(cost, 'free')}`)],
           act: () => a.result(learn(a, t), `You learn ${t.def.name}.`),
         });
       }
       if (later.length) {
         rows.push(H(''), H('Coming up'));
-        for (const t of later) rows.push(H(dim(`  ${fit(t.def.name, W)} ${prof?.name} ${t.def.orange}${t.reqLevel > ch.level ? `, level ${t.reqLevel}` : ''}  ${moneyText(trainerSpellCost(t.def.cost ?? 0, mod))}`)));
+        for (const t of later) rows.push(H(dim(`  ${fit(t.def.name, W)} ${prof?.name} ${t.def.orange}${t.reqLevel > ch.level ? `, level ${t.reqLevel}` : ''}  ${coinText(trainerSpellCost(t.def.cost ?? 0, mod))}`)));
       }
       return rows;
     },
@@ -761,7 +761,7 @@ export function professionsView(app) {
       };
       const you = crafterOf(a, null);
       const mine = profRows(you);
-      const rows = [H(`Your professions   ${yellow(moneyText(a.ch.gold) || '0c')}`)];
+      const rows = [H(`Your professions   ${coinText(a.ch.gold)}`)];
       if (mine.length) rows.push(...mine);
       else rows.push(H(dim('  You have no professions yet. Profession trainers stand in towns and capitals (World tab).')));
       const comps = companionsOf(g);

package/src/cli/tuiSaves.mjs

@@ -22,10 +22,24 @@ export async function savePicker(app, { onPlay, onNew }) {
   // Each hero stands in their gear under their line: the saves are read once here for the character they hold.
   const chars = new Map();
   for (const m of saves) { try { chars.set(m.slot, (await repo.load(m.slot))?.state?.char ?? null); } catch { /* unreadable: no sprite */ } }
+  // A hero's first drawing unpacks their body's art and can take a moment, so paging past them draws only
+  // the text: the art waits until the cursor rests on them. One drawn once comes back at once.
+  const drawn = new Set();
+  let settle = null;
+  const restingOn = (m) => {
+    if (drawn.has(m.slot)) return true;
+    clearTimeout(settle);
+    settle = setTimeout(() => {
+      if (app.top() !== view || options[view.cursor]?.value.meta?.slot !== m.slot) return;
+      drawn.add(m.slot); app.render();
+    }, 250);
+    return false;
+  };
   const options = saves.map((m) => ({
     label: `${bold(m.name)}  ${dim(`L${m.level} ${className(m.cls)}`)}${busy(m) ? `  ${yellow('open in another terminal')}` : ''}`,
     detail: () => {
       const text = [bold(m.name), `Level ${m.level} ${className(m.cls)}`, dim(`last played ${when(m.updatedAt)}`), '', dim('Enter: play   m: back up, restore, export, delete')];
+      if (!restingOn(m)) return text;
       const ch = chars.get(m.slot), L = app.layout();
       const art = ch ? paperdollArt(ch, L.detailW - 2, L.mainH - text.length - 1) : null;
       return art ? [...text, '', ...art] : text;

package/src/cli/tuiSearch.mjs

@@ -5,7 +5,7 @@
 // zones it grows in; a zone, a quest, an object. Enter acts on the place: open it when you are already there
 // (the vendor, the fight, the portal, the node), travel there when you are not. The matching is the wiki's
 // (substring, then character subsequence), over the wiki's name index plus a gather-node index of our own.
-import { bold, dim, yellow, green, red, cyan, qualityPaint, secondsText, plural } from './text.mjs';
+import { bold, dim, yellow, green, red, cyan, qualityPaint, secondsText, plural, coinText } from './text.mjs';
 import { wikiIndex, wikiTokens, rowMatches } from './wikiIndex.ts';
 import { wikiSourceIndexSync } from './wikiSources.ts';
 import { wikiPage } from './tuiWiki.mjs';
@@ -13,7 +13,6 @@ import { itemLines, creatureLines, questLines, travelPreviewLines, travelTo, ven
 import { profTrainerDialog } from './tuiProfessions.mjs';
 import { entryDialog } from './tuiDungeon.mjs';
 import { startFight } from './tuiFight.mjs';
-import { moneyText } from '../domain/economy/money.ts';
 import { vendorPriceMultiplierFor } from '../engine/game/vendorOffers.ts';
 import { className } from '../domain/core/ids.ts';
 
@@ -162,7 +161,7 @@ function goTo(app, zoneId, here) {
   if (!dest) { app.flashMsg('No road leads there.'); return; }
   const pv = app.g.previewTravel(dest.id);
   if (!app.result(pv)) return;
-  app.confirm(`Travel to ${dest.name}? ${secondsText(pv.totalSeconds * 1000)}${pv.totalCopper ? `, ${moneyText(pv.totalCopper)} in fares` : ''}`, () => travelTo(app, dest));
+  app.confirm(`Travel to ${dest.name}? ${secondsText(pv.totalSeconds * 1000)}${pv.totalCopper ? `, ${coinText(pv.totalCopper)} in fares` : ''}`, () => travelTo(app, dest));
 }
 
 /** Enter on a place with several zones: travel to the one you pick, the current zone first. */
@@ -183,7 +182,7 @@ function travelHint(app, zones) {
   const dest = app.ds.zone(zones[0]);
   const pv = dest ? app.g.previewTravel(dest.id) : null;
   if (pv && !pv.ok) return red(pv.reason);
-  return dim(`Enter: travel to ${zoneName(app, zones[0])}${pv ? ` (${secondsText(pv.totalSeconds * 1000)}${pv.totalCopper ? `, ${moneyText(pv.totalCopper)}` : ''})` : ''}${zones.length > 1 ? ', or pick another zone' : ''}`);
+  return dim(`Enter: travel to ${zoneName(app, zones[0])}${pv ? ` (${secondsText(pv.totalSeconds * 1000)}${pv.totalCopper ? `, ${coinText(pv.totalCopper)}` : ''})` : ''}${zones.length > 1 ? ', or pick another zone' : ''}`);
 }
 
 // ---- rows per kind ------------------------------------------------------------------------------------------
@@ -328,7 +327,7 @@ function itemRows(app, entry, only) {
     if (s.kind === 'vendor') {
       const v = ds.vendor(s.ref);
       if (!v) continue;
-      const price = it.buyPrice ? dim(`  ${moneyText(Math.floor(it.buyPrice * vendorPriceMultiplierFor(ds, app.ch, v.entry)))}`) : '';
+      const price = it.buyPrice ? dim(`  ${coinText(Math.floor(it.buyPrice * vendorPriceMultiplierFor(ds, app.ch, v.entry)))}`) : '';
       rows.push(npcRow(app, s.ref, { indent: `${indent}${dim('sold by')} `, note: price }));
     } else if (s.kind === 'drop' || s.kind === 'skin' || s.kind === 'pickpocket') {
       if (!ds.creature(s.ref)) continue;

package/src/cli/tuiSettings.mjs

@@ -2,9 +2,8 @@
 // disenchanting, the junk rules (what gets sold or destroyed on its own) and which gathering nodes the autopilot
 // takes. Enter flips or cycles a row. "Every character" settings live in ~/.azsh/prefs.json through the
 // createGame hooks; "this character" settings live in the save.
-import { bold, dim, yellow, green, red, cyan, qualityPaint } from './text.mjs';
+import { bold, dim, yellow, green, red, cyan, qualityPaint, coinText } from './text.mjs';
 import { autoLootOn } from './tuiLoot.mjs';
-import { moneyText } from '../domain/economy/money.ts';
 import { JUNK_PROTECT_CATEGORIES } from '../domain/items/junkCategories.ts';
 import { autopilotSettingsDialog } from './tuiAutopilotSettings.mjs';
 import { paceLabel, nextPace } from './tuiWorld.mjs';
@@ -81,7 +80,7 @@ export function settingsDialog(app) {
       const eh = g.equipmentHelperConfig();
       rows.push(H(''), H(bold('Equipment helper')));
       rows.push({ text: `Helper                    ${onOff(eh.enabled)}`, detail: () => [bold('Equipment helper'), '', 'Scores what you pick up against what you wear and marks upgrades with ▲.'], act: (a2) => g.setEquipmentHelperConfig({ ...eh, enabled: !eh.enabled }) });
-      rows.push({ text: `Upgrades                  ${eh.mode === 'auto' ? green('put on as they drop') : cyan('suggest only')}`, detail: () => [bold('Upgrades'), '', 'Suggest: ▲ on the Gear and Bags tabs, u puts them on.', 'Put on: strict upgrades are worn the moment they land in your bags.'], act: () => g.setEquipmentHelperConfig({ ...eh, mode: eh.mode === 'auto' ? 'suggest' : 'auto' }) });
+      rows.push({ text: `Upgrades                  ${eh.mode === 'auto' ? green('put on as they drop') : cyan('suggest only')}`, detail: () => [bold('Upgrades'), '', 'Suggest: ▲ on the Character and Bags tabs, u puts them on.', 'Put on: strict upgrades are worn the moment they land in your bags.'], act: () => g.setEquipmentHelperConfig({ ...eh, mode: eh.mode === 'auto' ? 'suggest' : 'auto' }) });
 
       const deMine = g.characterAutoDisenchantConfig(), deAll = g.globalAutoDisenchantConfig();
       rows.push(H(''), H(bold('Disenchant on its own')));
@@ -110,7 +109,7 @@ export function settingsDialog(app) {
         const n = jf[key].length;
         rows.push({ text: `${label.padEnd(26)}${n ? `${n} item${n === 1 ? '' : 's'}` : dim('none')}`, detail: () => [bold(label), '', ...(n ? jf[key].map((e) => a.itemLabel(e)) : [dim('Empty. m on a bag item adds to it.')]), '', dim('Enter: edit')], act: (a2) => a2.push(junkListDialog(a2, key, label)) });
       }
-      rows.push({ text: green('Clear out junk now'), detail: () => [bold('Clear out junk now'), '', 'Sells (when a vendor is open or the rule allows) and destroys what the rules say, once.'], act: (a2) => { const r = g.runAutoJunk(); if (r.sold || r.destroyed) a2.say(green(`Junk: ${r.sold} sold${r.earned ? ` for ${moneyText(r.earned)}` : ''}, ${r.destroyed} destroyed.`)); else a2.flashMsg('Nothing in your bags is junk by these rules.'); } });
+      rows.push({ text: green('Clear out junk now'), detail: () => [bold('Clear out junk now'), '', 'Sells (when a vendor is open or the rule allows) and destroys what the rules say, once.'], act: (a2) => { const r = g.runAutoJunk(); if (r.sold || r.destroyed) a2.say(green(`Junk: ${r.sold} sold${r.earned ? ` for ${coinText(r.earned)}` : ''}, ${r.destroyed} destroyed.`)); else a2.flashMsg('Nothing in your bags is junk by these rules.'); } });
 
       const gf = g.gatherFilterConfig();
       rows.push(H(''), H(`${bold('Gathering')}   ${dim('which nodes the autopilot mines, picks and skins, by skill colour')}`));

package/src/cli/tuiStage.mjs

@@ -3,8 +3,7 @@
 // left and the foe down the right; the dungeon room and the pack are meant to be more actor lists through
 // the same canvas. Sizes come from the design page: a sprite's box says its rank, and the terminal's
 // width says which boxes it can afford.
-import { bold, dim, cyan, yellow, green, red, gray, inverse, fit, vis, cut, bar, brightBlue, orange, useColor, strip, itemText } from './text.mjs';
-import { moneyText } from '../domain/economy/money.ts';
+import { bold, dim, cyan, yellow, green, red, gray, inverse, fit, vis, cut, bar, brightBlue, orange, useColor, strip, itemText, coinText } from './text.mjs';
 import { className } from '../domain/core/ids.ts';
 import { iconArt, iconsOn } from './iconArt.mjs';
 import { sixelOn } from './sixel.mjs';
@@ -15,7 +14,7 @@ export const POWER_PAINT = { mana: brightBlue, rage: red, energy: yellow, focus:
 export const POP_MS = 1500;      // a hit or heal stays on screen this long (fight time)
 export const POP_RISE_MS = 400;  // a pop climbs one row every this long
 export const LUNGE_MS = 250;     // an auto-attack swing moves the sprite two columns toward its target this long
-export const SHORT_BUFF_MS = 60_000; // a frame shows only buffs about to run out; the long ones are on the Character tab
+export const SHORT_BUFF_MS = 60_000; // a frame shows only buffs about to run out; the long ones are under s on the Character tab
 export const ROLE_GLYPH = { tank: cyan('T'), healer: green('H'), damage: red('D') };
 
 /** Sprite boxes, columns x rows: a pack add or a pet, dungeon trash, a normal foe, you or an elite, a boss. */
@@ -135,19 +134,19 @@ export function narrowPlate(app, v, { isPlayer, focused, friend, dead, role, ran
 }
 
 /** The state row of a narrow plate, `w` wide: a cast bar that fills under the spell's name (a channel drains
- *  it), else crowd control, stealth, or "dead"; empty when idle. */
-export function narrowState(v, now, w) {
+ *  it), else crowd control, the cast just done (castSlot), stealth, or "dead"; empty when idle. */
+export function narrowState(v, now, w, recent) {
   if (v.hp <= 0) return gray('dead');
   if (v.casting) {
-    const total = Math.max(1, v.casting.endsAt - v.casting.startedAt);
-    const left = Math.max(0, v.casting.endsAt - now);
-    const prog = Math.max(0, Math.min(1, v.casting.channeled ? left / total : 1 - left / total));
+    const { prog, left } = castProgress(v.casting, now);
     const secs = w >= 14 ? ` ${(left / 1000).toFixed(1)}s` : '';
     const text = fit(cut(v.casting.name, w - secs.length), w - secs.length);
     const filled = Math.round(prog * vis(text));
     return `${inverse(yellow(text.slice(0, filled)))}${yellow(text.slice(filled))}${dim(secs)}`;
   }
   if (v.controlled) return red(cut(v.controlled.control, w));
+  const last = freshCast(recent, now);
+  if (last) return cyan(bold(cut(last.name, w)));
   if (v.stealthed) return dim('stealthed');
   return '';
 }
@@ -176,17 +175,74 @@ export function auraRows(app, mem, v, key, plateW, icons) {
   return rows;
 }
 
-/** The cast slot's text: a cast bar, else crowd control, else stealth; empty when idle. */
-export function castSlot(v, now) {
+export const CAST_NAME_MS = 2000;  // a cast just done keeps its name in the cast slot this long (fight time)
+export const CAST_TRAIL_MS = 8000; // and its icon in the trail beside it this long, greyed for the second half
+
+/** The cast bar's progress and seconds left, 0..1. */
+function castProgress(casting, now) {
+  const total = Math.max(1, casting.endsAt - casting.startedAt);
+  const left = Math.max(0, casting.endsAt - now);
+  return { prog: Math.max(0, Math.min(1, casting.channeled ? left / total : 1 - left / total)), left };
+}
+
+/** The last cast while its icon is still in the trail, with `fresh` set while it keeps its name lit. `recent`
+ *  is the unit's casts, newest first ({ t, spellId, name, instant }, noteCasts in tuiFight). */
+function lastCast(recent, now) {
+  const r = recent?.[0];
+  return r && now - r.t < CAST_TRAIL_MS ? { ...r, fresh: now - r.t < CAST_NAME_MS } : null;
+}
+const freshCast = (recent, now) => { const r = lastCast(recent, now); return r?.fresh ? r : null; };
+
+/** The cast slot's text: a cast bar, else crowd control, else the cast just done (an instant says so, the
+ *  casts before it trail after it), else stealth, else the last cast gone dim; empty when idle. */
+export function castSlot(v, now, recent) {
   if (v.casting) {
-    const total = v.casting.endsAt - v.casting.startedAt;
-    const left = Math.max(0, v.casting.endsAt - now);
-    const prog = v.casting.channeled ? left / total : 1 - left / total;
+    const { prog, left } = castProgress(v.casting, now);
     return `${fit(yellow(v.casting.name), 14)} ${bar(prog, 1, 10, yellow)} ${dim(`${(left / 1000).toFixed(1)}s`)}`;
   }
   if (v.controlled) return red(v.controlled.control);
-  if (v.stealthed) return dim('stealthed');
-  return '';
+  const last = lastCast(recent, now);
+  if (!last || (!last.fresh && v.stealthed)) return v.stealthed ? dim('stealthed') : '';
+  const before = recent.slice(1).filter((r) => now - r.t < CAST_TRAIL_MS).map((r) => r.name);
+  const trail = before.length ? dim(`  ‹ ${before.join(' ‹ ')}`) : '';
+  return last.fresh ? `${cyan(bold(last.name))}${last.instant ? dim(' instant') : ''}${trail}` : `${dim(last.name)}${trail}`;
+}
+
+/**
+ * The cast slot two rows tall and `w` wide, where icons draw: the spell's icon, its name beside it and under
+ * the name the cast bar (a cast in progress) or "instant" (one just gone off, for CAST_NAME_MS; after that the
+ * name stays dim). The icons of the casts before it trail off to the right, newest first, grey once they are
+ * half way out, like an aura strip of what you pressed. Crowd control and stealth take the lead as castSlot has them.
+ */
+export function castRows(app, v, recent, now, w) {
+  const spell = (id) => app.ds.spell(id);
+  let lead = null, top = '', under = '';
+  const last = lastCast(recent, now);
+  if (v.casting) {
+    const { prog, left } = castProgress(v.casting, now);
+    lead = { spellId: v.casting.spellId, since: v.casting.startedAt };
+    top = yellow(v.casting.name);
+    under = `${bar(prog, 1, 10, yellow)} ${dim(`${(left / 1000).toFixed(1)}s`)}`;
+  } else if (v.controlled) top = red(v.controlled.control);
+  else if (last && (last.fresh || !v.stealthed)) {
+    lead = { spellId: last.spellId, since: last.t, gray: now - last.t > CAST_TRAIL_MS / 2 };
+    top = !last.fresh ? dim(last.name) : now - last.t > CAST_NAME_MS / 2 ? cyan(last.name) : cyan(bold(last.name));
+    under = last.fresh && last.instant ? dim('instant') : '';
+  } else if (v.stealthed) top = dim('stealthed');
+  const nameW = Math.min(16, Math.max(8, w - 5));
+  const art = lead ? iconArt(spell(lead.spellId)?.icon, 4, lead.gray ? 'gray' : '') : null;
+  const rows = art ? [`${art[0]} ${fit(cut(top, nameW), nameW)}`, `${art[1]} ${fit(cut(under, nameW), nameW)}`] : [fit(cut(top, nameW + 5), nameW + 5), fit(cut(under, nameW + 5), nameW + 5)];
+  // The trail: what went off before the lead (a channel is in `recent` from its first tick, so it is the lead,
+  // not its own trail).
+  const room = Math.floor((w - vis(rows[0]) - 1) / 5);
+  const trail = (recent ?? []).filter((r) => now - r.t < CAST_TRAIL_MS && !(lead && r.spellId === lead.spellId && r.t >= lead.since)).slice(0, Math.max(0, room));
+  for (const r of trail) {
+    const old = now - r.t > CAST_TRAIL_MS / 2;
+    const ic = iconArt(spell(r.spellId)?.icon, 4, old ? 'gray' : '');
+    rows[0] += ` ${ic ? ic[0] : dim(fit(r.name, 4))}`;
+    rows[1] += ` ${ic ? ic[1] : dim(fit(r.name.slice(4), 4))}`;
+  }
+  return rows.every((l) => !strip(l).trim()) ? ['', ''] : rows;
 }
 
 /** Short buffs green then debuffs red, in the order they first showed up, so a refreshed one keeps its place. */
@@ -256,7 +312,7 @@ const coinIcon = (copper) => (copper < 100 ? 'inv_misc_coin_05' : copper < 10_00
 /** What the foe dropped, items then the coin: each with its icon name and its line in the quality colour. */
 export function lootToasts(app, hold) {
   const out = hold.loot.map((d) => { const it = app.ds.item(d.item); return { icon: it?.icon, text: `${itemText(it, String(d.item))}${d.count > 1 ? dim(` x${d.count}`) : ''}` }; });
-  if (hold.copper) out.push({ icon: coinIcon(hold.copper), coin: true, text: yellow(moneyText(hold.copper)) });
+  if (hold.copper) out.push({ icon: coinIcon(hold.copper), coin: true, text: coinText(hold.copper) });
   return out;
 }