diff --git a/game.py b/game.py
index 90f5fc7..5e7202b 100644
--- a/game.py
+++ b/game.py
@@ -3562,7 +3562,7 @@ for _index, (_area, _level, _prefix, _races) in enumerate(AREAS):
         ACTION_GLYPHS[f"fight_{_slug(_race)}"] = (RACE_GLYPHS[_race], TIER_TINTS[_index])
 UI_GLYPHS = ["two-coins", "sparkles", "hearts", "prayer", "checked-shield", "magic-shield", "stopwatch", "swordman", "biceps", "cancel", "striking-diamonds",
              "archery-target", "dodging", "shield-reflect",
-             "cape", "gem-pendant", "gauntlet", "ring", "quiver", "leather-boot", "crystal-ball", "visored-helm", "breastplate",
+             "cape", "gem-pendant", "gauntlet", "ring", "quiver", "leather-boot", "crystal-ball", "hot-meal", "visored-helm", "breastplate",
              "leg-armor", "pointy-sword", "round-shield",
              *(kind["glyph"] for kind in DAMAGE_TYPES.values())]
 
diff --git a/static/app.js b/static/app.js
index dad265c..4ddd570 100644
--- a/static/app.js
+++ b/static/app.js
@@ -1237,10 +1237,11 @@ const DOLL = [
   ["cape", "Cape", "cape"], ["helmet", "Head", "visored-helm"], ["amulet", "Amulet", "gem-pendant"],
   ["weapon", "Main hand", "pointy-sword"], ["body", "Body", "breastplate"], ["shield", "Off hand", "round-shield"],
   ["gloves", "Gloves", "gauntlet"], ["legs", "Legs", "leg-armor"], ["ring", "Ring", "ring"],
-  ["ammo", "Ammo", "quiver"], ["boots", "Boots", "leather-boot"], ["trinket", "Trinket", "crystal-ball"],
+  ["ammo", "Ammo", "quiver"], ["boots", "Boots", "leather-boot"], ["food", "Food", "hot-meal"],
 ];
 
 function dollSlot(p, slot, label, outline, picked) {
+  if (slot === "food") return foodSlot(p, picked);
   const known = slot in p.equip, two = slot === "shield" && p.equip.weapon && item(p.equip.weapon).two_handed;
   const id = two ? p.equip.weapon : p.equip[slot];
   const tip = !known ? `${label}: not in the game yet` : id ? `${label}: ${item(id).name}` : `${label}: empty`;
@@ -1253,7 +1254,8 @@ function dollSlot(p, slot, label, outline, picked) {
 function paperDoll(p, mine) {
   const pick = dollPick && slot2(dollPick, p);
   let slot = "";
-  if (pick) {
+  if (pick === "food") slot = foodPanel(p);
+  else if (pick) {
     const label = DOLL.find(([s]) => s === pick)[1];
     const two = pick === "shield" && p.equip.weapon && item(p.equip.weapon).two_handed;
     const id = two ? p.equip.weapon : p.equip[pick], it = id && item(id);
@@ -1307,7 +1309,28 @@ function swapGrid(p, slot, two) {
 
 // A picked slot only counts if it's one this character has.
 function slot2(slot, p) {
-  return slot in p.equip ? slot : null;
+  return slot in p.equip || (slot === "food" && "food" in p) ? slot : null;
+}
+
+// Food for fights: one you picked to eat first, or the cheapest first. Only your own sheet shows it.
+function foodSlot(p, picked) {
+  if (!("food" in p)) return `<span class="doll-slot future" title="Food"></span>`;
+  const id = p.food && p.bank[p.food] ? p.food : null;
+  const tip = id ? `Food: ${item(id).name}, heals ${item(id).heal}` : "Food: cheapest first";
+  return `<button class="doll-slot ${picked ? "on" : ""} ${p.edible.length ? "" : "empty"}" data-doll="food" title="${esc(tip)}">
+    ${id ? item(id).icon : glyph("two-coins", "#e0b04a")}${id ? `<span class="swap-qty">${fmt(p.bank[id])}</span>` : ""}</button>`;
+}
+
+function foodPanel(p) {
+  const id = p.food && p.bank[p.food] ? p.food : null;
+  const head = id ? `<div class="worn-head"><span class="ico">${item(id).icon}</span><b>${esc(item(id).name)}</b>
+      <span class="muted small">${HEART} ${item(id).heal} · ${fmt(p.bank[id])} left</span></div>`
+    : `<div class="worn-head"><span class="ico">${glyph("two-coins", "#e0b04a")}</span><b>Cheapest first</b></div>`;
+  const tiles = [...p.edible].sort((a, b) => item(a).heal - item(b).heal).map((f) => `<button class="doll-slot swap ${f === id ? "on" : ""}" data-food="${f}"
+      title="${esc(`${item(f).name}: heals ${item(f).heal}`)}">${item(f).icon}<span class="swap-qty">${fmt(p.bank[f])}</span></button>`);
+  const cheap = `<button class="doll-slot swap ${id ? "" : "on"}" data-food="cheapest" title="Cheapest first">${glyph("two-coins", "#e0b04a")}</button>`;
+  return head + (p.edible.length ? `<div class="swap-head muted small">Eat first</div><div class="swap-grid">${cheap}${tiles.join("")}</div>`
+    : `<div class="small warn">No food in your bank.</div>`);
 }
 
 // The equipment panel, the same on the character sheet and the combat page (which leaves out tools).
@@ -1437,7 +1460,7 @@ document.addEventListener("click", (e) => {
   if (d.garrison) return act("/api/garrison", { join: d.garrison === "1" });
   if (d.perk) return act("/api/perk", { perk: d.perk });
   if (d.favour) return act("/api/favour", { kind: d.favour });
-  if (d.food) return act("/api/food", { item: d.food });
+  if (d.food) return act("/api/food", { item: d.food === "cheapest" ? null : d.food });
   if (d.potion) return act("/api/potion", { item: d.potion });
   if (d.unpost) {
     if (!confirm("Delete this message?")) return;