feat: Sample Tag Viewer — read-only tag browser for AKAI disk images

Backend:
- extract.go: listTags() navigates to volume, runs akaiutil lstags
- extract.go: parseTags() parses tag name/index from lstags output
- serve.go: GET /api/disk/partitions — list partitions on an ISO
- serve.go: GET /api/disk/volumes — list volumes on a partition
- serve.go: GET /api/volume/tags — list tags on a volume

Web UI:
- Tag Viewer section with ISO path input and Browse button
- Partition selector buttons
- Volume grid with click-to-select
- Tag chips with color-coded dots (20-color palette)

Tests:
- 6 parseTags tests (basic, spaces, defaults, no tags, empty, no-type)
- 1 listTags integration test
- 4 API endpoint tests (partitions, missing-ISO, missing-params, tags)

Karpathy: read-only view first — no write operations yet (settagi, clrtagi)

web/ui/app.js

@@ -380,6 +380,10 @@ document.addEventListener('click', function(e) {
     listItem(btn.dataset.identifier);
   } else if (action === 'play') {
     playWav(btn.dataset.wav);
+  } else if (action === 'tag-part') {
+    selectPartition(btn.dataset.iso, btn.dataset.part);
+  } else if (action === 'tag-vol') {
+    viewVolumeTags(btn.dataset.iso, btn.dataset.part, btn.dataset.vol);
   }
 });
 
@@ -396,3 +400,109 @@ document.querySelectorAll('.section-toggle').forEach(h => {
 document.getElementById('wav-collapse-all').addEventListener('click', function () {
   document.querySelectorAll('.library-card').forEach(c => c.classList.add('collapsed'));
 });
+
+// ─── Tag Viewer ─────────────────────────────────────────────────────
+
+const TAG_COLORS = [
+  '#e94560', '#4ecca3', '#f0c040', '#7c3aed', '#06b6d4',
+  '#f97316', '#84cc16', '#ec4899', '#3b82f6', '#14b8a6',
+  '#a855f7', '#ef4444', '#22c55e', '#eab308', '#6366f1',
+  '#10b981', '#f43f5e', '#8b5cf6', '#0ea5e9', '#d946ef'
+]
+
+document.getElementById('tag-browse-btn').addEventListener('click', browseISO)
+
+async function browseISO() {
+  const iso = document.getElementById('tag-iso-path').value
+  const results = document.getElementById('tag-results')
+  const status = document.getElementById('tag-status')
+  const partsEl = document.getElementById('tag-partitions')
+  const volsEl = document.getElementById('tag-volumes')
+  const detailEl = document.getElementById('tag-detail')
+
+  partsEl.innerHTML = ''
+  volsEl.innerHTML = ''
+  detailEl.innerHTML = ''
+  status.textContent = 'Loading partitions...'
+  results.style.display = 'block'
+
+  try {
+    const resp = await fetch(`${API}/disk/partitions?iso=${encodeURIComponent(iso)}`)
+    const data = await resp.json()
+    if (data.error) {
+      status.textContent = data.error
+      return
+    }
+    status.textContent = data.length + ' partition' + (data.length === 1 ? '' : 's')
+    partsEl.innerHTML = data.map(p => `
+      <button class="tag-part-btn" data-action="tag-part" data-iso="${esc(iso)}" data-part="${esc(p)}">Partition ${esc(p)}</button>
+    `).join('')
+  } catch (e) {
+    status.textContent = 'Failed: ' + e.message
+  }
+}
+
+async function selectPartition(iso, part) {
+  const volsEl = document.getElementById('tag-volumes')
+  const detailEl = document.getElementById('tag-detail')
+
+  document.querySelectorAll('.tag-part-btn').forEach(b => {
+    b.classList.toggle('active', b.dataset.part === part)
+  })
+  volsEl.innerHTML = 'Loading volumes...'
+  detailEl.innerHTML = ''
+
+  try {
+    const resp = await fetch(`${API}/disk/volumes?iso=${encodeURIComponent(iso)}&part=${encodeURIComponent(part)}`)
+    const data = await resp.json()
+    if (data.error) {
+      volsEl.innerHTML = '<span class="no-files">' + data.error + '</span>'
+      return
+    }
+    if (!Array.isArray(data) || data.length === 0) {
+      volsEl.innerHTML = '<span class="no-files">No volumes on Partition ' + part + '</span>'
+      return
+    }
+    volsEl.innerHTML = data.map(v => `
+      <div class="vol-item" data-action="tag-vol" data-iso="${esc(iso)}" data-part="${esc(part)}" data-vol="${esc(v.Name)}">${esc(v.Name)}</div>
+    `).join('')
+  } catch (e) {
+    volsEl.innerHTML = 'Failed: ' + e.message
+  }
+}
+
+async function viewVolumeTags(iso, part, vol) {
+  const detailEl = document.getElementById('tag-detail')
+  document.querySelectorAll('.vol-item').forEach(el => {
+    el.classList.toggle('selected', el.textContent === vol)
+  })
+  detailEl.innerHTML = 'Loading tags...'
+
+  try {
+    const resp = await fetch(`${API}/volume/tags?iso=${encodeURIComponent(iso)}&part=${encodeURIComponent(part)}&vol=${encodeURIComponent(vol)}`)
+    const data = await resp.json()
+    if (data.error) {
+      detailEl.innerHTML = '<span class="no-files">' + data.error + '</span>'
+      return
+    }
+    if (!Array.isArray(data) || data.length === 0) {
+      detailEl.innerHTML = '<span class="no-files">No tags on this volume</span>'
+      return
+    }
+
+    const colorKeys = TAG_COLORS
+    detailEl.innerHTML = `
+      <h4>Tags: ${esc(vol)}</h4>
+      <div class="tag-list">
+        ${data.map(t => {
+          const color = colorKeys[(t.index - 1) % colorKeys.length]
+          return `<span class="tag-chip">
+            <span class="tag-dot" style="background:${color}"></span>
+            ${esc(t.name)}
+          </span>`
+        }).join('')}
+      </div>`
+  } catch (e) {
+    detailEl.innerHTML = 'Failed: ' + e.message
+  }
+}