feat(web): history of searches on the page

Each search is kept in IndexedDB with its covers and edits; the History list and
a shelf of recent series on the start screen reopen it instantly. Searching a
series again keeps the edits of covers that are still there.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/web/styles.css

@@ -226,11 +226,63 @@
 .mbseed-app .mbseed-warnings li { font-size: 12px; color: var(--mb-ink-2); padding-left: 12px; position: relative; overflow-wrap: anywhere; }
 .mbseed-app .mbseed-warnings li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 5px; height: 5px; background: var(--mb-kraft); }
 
+/* ---------- history: a ruled list on the left desk (spec 002 §3.4) ---------- */
+.mbseed-app .mbseed-recent { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
+.mbseed-app .mbseed-recent-list {
+  list-style: none; margin: 0; padding: 0; display: grid; max-height: 24rem; overflow: auto;
+  scrollbar-width: thin; scrollbar-color: var(--mb-kraft) transparent;
+}
+.mbseed-app .mbseed-recent-list li { display: flex; margin-top: -1px; border: 1px solid var(--mb-line); }
+.mbseed-app .mbseed-recent-open {
+  flex: 1; min-width: 0; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; align-items: center;
+  padding: 6px 8px; border: 0; background: transparent; color: var(--mb-ink-2); font: inherit; text-align: left; cursor: pointer;
+  transition: background-color 0.15s;
+}
+.mbseed-app .mbseed-recent-open:hover, .mbseed-app .mbseed-recent-open[aria-current="true"] { background: var(--mb-slip); }
+.mbseed-app .mbseed-recent-list .mbseed-recent-thumb {
+  display: block; width: 30px; height: 40px; object-fit: contain; background: var(--mb-page);
+  outline: 1px solid var(--mb-frame); outline-offset: -1px;
+}
+.mbseed-app .mbseed-recent-text { display: grid; gap: 1px; min-width: 0; }
+.mbseed-app .mbseed-recent-title { font-size: 13px; font-weight: 700; color: var(--mb-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.mbseed-app .mbseed-recent-meta { font-size: 11.5px; font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.mbseed-app .mbseed-recent-marks { font-size: 11.5px; font-weight: 600; color: var(--mb-teal); }
+.mbseed-app .mbseed-recent-remove {
+  flex: none; width: 28px; display: grid; place-items: center; padding: 0;
+  border: 0; border-left: 1px solid var(--mb-line); background: transparent; color: var(--mb-ink-2); cursor: pointer;
+  transition: background-color 0.15s, color 0.15s;
+}
+.mbseed-app .mbseed-recent-remove:hover { background: var(--mb-ink); color: var(--mb-page); }
+.mbseed-app .mbseed-recent .mbseed-line:empty { display: none; }
+.mbseed-app .mbseed-recent > .is-quiet { justify-self: start; width: auto; font-size: 12.5px; color: var(--mb-ink-2); }
+
 /* ---------- empty state ---------- */
 .mbseed-app .mbseed-empty { max-width: 46rem; }
 .mbseed-app .mbseed-empty h2 { font-size: clamp(22px, 3cqi, 30px); font-weight: 800; letter-spacing: -0.02em; margin: 24px 0 10px; text-wrap: balance; }
 .mbseed-app .mbseed-empty p { color: var(--mb-ink-2); max-width: 62ch; margin: 0 0 10px; font-size: 14px; }
 .mbseed-app .mbseed-empty strong { color: var(--mb-ink); }
+/* Recently searched: the same books on the same kraft rail, smaller, each opening its history entry. */
+.mbseed-app .mbseed-recent-shelf-wrap { display: grid; gap: 14px; margin-top: 34px; }
+.mbseed-app .mbseed-recent-shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); align-items: end; column-gap: 0; row-gap: 30px; }
+.mbseed-app .mbseed-recent-book {
+  display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; padding: 0 9px;
+  border: 0; border-bottom: 10px solid var(--mb-kraft); box-shadow: 0 2px 0 var(--mb-rail);
+  background: transparent; color: var(--mb-ink); font: inherit; text-align: left; cursor: pointer;
+}
+.mbseed-app .mbseed-recent-jacket { display: block; }
+.mbseed-app .mbseed-recent-book .mbseed-recent-thumb {
+  display: block; width: 100%; height: auto; max-height: 160px; object-fit: contain; object-position: bottom;
+  outline: 1px solid var(--mb-frame); outline-offset: -1px; box-shadow: 0 8px 14px -8px var(--mb-shadow);
+  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
+}
+.mbseed-app .mbseed-recent-book .mbseed-recent-thumb.is-blank { height: 120px; background: var(--mb-panel); box-shadow: none; }
+.mbseed-app .mbseed-recent-book:hover .mbseed-recent-thumb { transform: translateY(-4px); }
+.mbseed-app .mbseed-recent-band {
+  position: relative; margin-top: -12px; display: grid; gap: 1px; padding: 5px 7px 6px;
+  background: var(--mb-slip); border: 1px solid var(--mb-line); border-top: 3px solid var(--mb-ink);
+}
+.mbseed-app .mbseed-recent-band .mbseed-recent-title { font-size: 12px; }
+.mbseed-app .mbseed-recent-band .mbseed-recent-meta { color: var(--mb-ink-2); }
 
 /* ---------- review head ---------- */
 .mbseed-app .mbseed-review-head {
@@ -242,6 +294,8 @@
 .mbseed-app .mbseed-views { margin-left: auto; display: flex; border: 1.5px solid var(--mb-ink); }
 .mbseed-app .mbseed-view { border: 0; background: transparent; color: var(--mb-ink); padding: 4px 12px; font: 700 12.5px var(--mb-sans); cursor: pointer; }
 .mbseed-app .mbseed-view[aria-pressed="true"] { background: var(--mb-ink); color: var(--mb-page); }
+.mbseed-app .mbseed-found { margin: 8px 0 0; display: flex; align-items: baseline; gap: 4px 10px; flex-wrap: wrap; font-size: 13px; color: var(--mb-ink-2); }
+.mbseed-app .mbseed-found .is-quiet { width: auto; color: var(--mb-ink); }
 .mbseed-app .mbseed-notice {
   margin: 12px 0 0; padding: 8px 12px; font-size: 13px;
   background: color-mix(in srgb, var(--mb-obi) 12%, var(--mb-page)); border-top: 2px solid var(--mb-obi);