Every card wears its FAQ seal; library cards enlarge above the booklet

The FAQ affordance moves onto the card itself: a small dark seal in
the corner of any card with official rulings, everywhere cards render
— hand, inspector, peek, final reveal, discard pile, card library —
opening the rulings modal on tap (the link, never the text: card
faces stay verbatim card text). The separate inspector buttons and
library chips retire in its favor.

And clicking a library card mid-game no longer summons the App-level
inspector beneath the help modal, greyed out and useless — the
library enlarges its card in its own overlay, centered above the
booklet, seal included.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

packages/web/src/Help.svelte

@@ -19,6 +19,7 @@
   // svelte-ignore state_referenced_locally -- the initial tab is intentionally a one-time value
   let tab = $state<"play" | "rules" | "cards" | "about" | "tally">(initialTab);
   let faqCardId = $state<string | null>(null);
+  let libPeek = $state<string | null>(null);
 
   function openTally() {
     tab = "tally";
@@ -50,6 +51,14 @@
 
 <svelte:window {onkeydown} />
 
+{#if libPeek}
+  <div class="lib-peek-scrim" role="button" tabindex="-1" onclick={() => (libPeek = null)} onkeydown={() => {}}>
+    <div class="lib-peek">
+      <Card card={{ instanceId: `peek-${libPeek}`, cardId: libPeek }} onfaq={(id) => (faqCardId = id)} />
+    </div>
+  </div>
+{/if}
+
 {#if faqCardId}
   <Faq cardId={faqCardId} onclose={() => (faqCardId = null)} />
 {/if}
@@ -174,13 +183,14 @@
         <div class="card-grid">
           {#each filtered as def (def.id)}
             <div class="card-slot">
-              <Card card={{ instanceId: `lib-${def.id}`, cardId: def.id }} />
+              <Card
+                card={{ instanceId: `lib-${def.id}`, cardId: def.id }}
+                onclick={() => (libPeek = def.id)}
+                onfaq={(id) => (faqCardId = id)}
+              />
               <span class="card-meta">
                 ×{def.quantity}{def.alsoIn?.length ? ` (+${def.alsoIn[0]!.quantity} exp)` : ""}
                 · {def.set === "basic" ? "base" : "exp 1"}
-                {#if def.faqRulings.length > 0}
-                  · <button class="faq-chip" onclick={() => (faqCardId = def.id)}>FAQ</button>
-                {/if}
               </span>
             </div>
           {/each}
@@ -305,16 +315,20 @@
   .card-slot { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; }
   .card-slot :global(.card) { cursor: default; }
   .card-slot :global(.card:hover) { transform: none; box-shadow: 0 3px 8px rgba(10, 8, 4, 0.45); }
-  .faq-chip {
-    background: none;
-    border: none;
-    padding: 0;
-    font: inherit;
-    color: #8a4a1f;
-    text-decoration: underline;
-    text-decoration-style: dotted;
-    cursor: pointer;
+  .lib-peek-scrim {
+    position: fixed;
+    inset: 0;
+    background: rgba(10, 12, 16, 0.55);
+    display: grid;
+    place-items: center;
+    z-index: 55;
   }
+  .lib-peek :global(.card) {
+    transform: scale(2.1);
+    cursor: default;
+    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.7);
+  }
+  .lib-peek :global(.card:hover) { transform: scale(2.1); }
   .card-meta {
     font-family: "Courier Prime", monospace;
     font-size: 0.68rem;