adventure: show the item, not just its name and price

Renders what gogobee now sends: descriptions, the engine's own effect
summary, slot and skill tags, and a Worn panel with the bond count. One row
template for all three panels — worn, backpack, vault show the same facts and
only the frame differs.

The one distinction worth the wrapper struct: "inert" is a real problem state
— the item is on you doing nothing because all three bonds are spoken for.
The same item in a backpack isn't inert, it's just not worn yet. Rendering
both the same would invent a problem the player doesn't have, on the exact
panel they'd go to to fix it. An ItemView can't tell you which panel it's in,
so itemRow carries it, and TestWhoInertOnlyWhenWorn pins it.

Effect arrives resolved and Pete renders it as given. If it ever disagrees
with what an item does in a fight, that's a gogobee bug — deriving it here
from tier and slot would just be a second opinion that drifts.

No migration: detail rides as a JSON blob.

internal/web/templates/who.html

@@ -1,5 +1,28 @@
 {{define "title"}}{{.Mark.Name}} — {{.SiteTitle}}{{end}}
 
+{{/* One item, wherever it's sitting. Worn, backpack, and vault all show the
+     same facts; only the panel around them differs. The description and the
+     effect line come from gogobee already resolved — Pete renders them, it does
+     not compute them. "inert" is the honest word for a worn item that wants a
+     bond and hasn't got one: it's on you and doing nothing. */}}
+{{define "itemrow"}}
+<li>
+  <div class="flex items-baseline justify-between gap-3">
+    <span class="flex-1 font-semibold">{{.Name}}{{if .Temper}} <span class="text-theme-adventure">+{{.Temper}}</span>{{end}}</span>
+    <span class="text-xs text-[color:var(--ink)]/50 shrink-0">{{if .Tier}}T{{.Tier}}{{end}}{{if .Value}}{{if .Tier}} · {{end}}{{.Value}}g{{end}}</span>
+  </div>
+  {{if or .Slot .SkillSource .Attunement}}
+  <div class="flex flex-wrap gap-1.5 mt-1">
+    {{if .Slot}}<span class="text-[11px] rounded-full bg-[color:var(--ink)]/5 px-2 py-0.5 text-[color:var(--ink)]/60">{{.Slot}}</span>{{end}}
+    {{if .SkillSource}}<span class="text-[11px] rounded-full bg-[color:var(--ink)]/5 px-2 py-0.5 text-[color:var(--ink)]/60">{{.SkillSource}}</span>{{end}}
+    {{if .Attunement}}{{if .Attuned}}<span class="text-[11px] rounded-full bg-theme-adventure/15 px-2 py-0.5 text-theme-adventure font-semibold">bonded</span>{{else if .Worn}}<span class="text-[11px] rounded-full bg-amber-400/20 px-2 py-0.5 text-amber-700 dark:text-amber-400 font-semibold">inert · no bond free</span>{{else}}<span class="text-[11px] rounded-full bg-[color:var(--ink)]/10 px-2 py-0.5 text-[color:var(--ink)]/60">needs a bond</span>{{end}}{{end}}
+  </div>
+  {{end}}
+  {{if .Desc}}<p class="text-xs text-[color:var(--ink)]/55 mt-1 leading-snug">{{.Desc}}</p>{{end}}
+  {{if .Effect}}<p class="text-xs text-theme-adventure/80 mt-0.5">{{.Effect}}</p>{{end}}
+</li>
+{{end}}
+
 {{define "main"}}
 <article class="mt-2 mb-10 max-w-3xl mx-auto" id="who" data-token="{{.Mark.Token}}">
   <nav class="mb-4">
@@ -215,29 +238,28 @@
       </div>
 
       <div class="rounded-3xl bg-[color:var(--card)] border-2 border-[color:var(--ink)]/10 p-6 shadow-pete">
+        {{if .Worn}}
+        <h2 class="font-display text-xl font-bold mb-1">Worn</h2>
+        <p class="text-xs text-[color:var(--ink)]/45 mb-3">{{.BondsUsed}} of 3 bonds in use</p>
+        <ul class="space-y-2.5 text-sm">
+          {{range .Worn}}{{template "itemrow" .}}{{end}}
+        </ul>
+        <h3 class="font-display text-lg font-bold mt-6 mb-3">Backpack</h3>
+        {{else}}
         <h2 class="font-display text-xl font-bold mb-4">Backpack</h2>
-        {{if .Self.Inventory}}
-        <ul class="space-y-1.5 text-sm max-h-72 overflow-y-auto pr-1">
-          {{range .Self.Inventory}}
-          <li class="flex items-baseline justify-between gap-3">
-            <span class="flex-1">{{.Name}}{{if .Temper}} <span class="text-theme-adventure">+{{.Temper}}</span>{{end}}</span>
-            <span class="text-xs text-[color:var(--ink)]/50 shrink-0">T{{.Tier}}{{if .Value}} · {{.Value}}g{{end}}</span>
-          </li>
-          {{end}}
+        {{end}}
+        {{if .Backpack}}
+        <ul class="space-y-2.5 text-sm max-h-72 overflow-y-auto pr-1">
+          {{range .Backpack}}{{template "itemrow" .}}{{end}}
         </ul>
         {{else}}
         <p class="text-sm text-[color:var(--ink)]/50">Backpack's empty.</p>
         {{end}}
 
-        {{if .Self.Vault}}
+        {{if .VaultRows}}
         <h3 class="font-display text-lg font-bold mt-6 mb-3">Vault</h3>
-        <ul class="space-y-1.5 text-sm max-h-52 overflow-y-auto pr-1">
-          {{range .Self.Vault}}
-          <li class="flex items-baseline justify-between gap-3">
-            <span class="flex-1">{{.Name}}{{if .Temper}} <span class="text-theme-adventure">+{{.Temper}}</span>{{end}}</span>
-            <span class="text-xs text-[color:var(--ink)]/50 shrink-0">T{{.Tier}}{{if .Value}} · {{.Value}}g{{end}}</span>
-          </li>
-          {{end}}
+        <ul class="space-y-2.5 text-sm max-h-52 overflow-y-auto pr-1">
+          {{range .VaultRows}}{{template "itemrow" .}}{{end}}
         </ul>
         {{end}}
       </div>