The peeked token joins its card — and stops hiding behind it

Clicking a board token now shows the thing itself, enlarged, above
its card in the peek modal — whichever art is active, photograph or
SVG. The art tables move to art.ts so the board renderer and the
modal share one source.

First cut overlapped: the card scales 2.1x out of its layout box, so
flow neighbors sat underneath its visual footprint (the note had been
compensating with a 6.8rem margin hack). A card-stage now reserves
the card's TRUE visual size; token above, note below, nothing buried.

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

packages/web/src/art.ts

@@ -15,3 +15,24 @@ const SVG_ART: Record<ArtCategory, boolean> = {
 export function tokenArt(file: string, cat: ArtCategory): string {
   return SVG_ART[cat] ? `/tokens-svg/${file}.svg` : `/tokens/${file}.png`;
 }
+
+// Which token file depicts each board thing (shared by the board renderer
+// and the card-peek modal). Anything without an entry has no token art.
+export const TERRAIN_ART: Record<string, string> = {
+  stone: "solid-stone", thornbush: "thorn-bush", rosebush: "rosebush",
+  ooze: "killer-ooze", dust: "dustcloud", slime: "slime",
+  tacks: "tacks", pit: "pit", safe: "safe",
+};
+export const CREATURE_ART: Record<string, string> = {
+  skeleton: "skeleton", troll: "troll", wraith: "wraith",
+  "fire-imp": "fire-imp", "democratic-monster": "democratic-monster",
+  shadow: "shadow", "alter-ego": "alter-ego",
+};
+export function objectArt(cardId: string): string | null {
+  if (cardId === "dagger") return "dagger";
+  if (cardId === "large-rock") return "rock";
+  if (cardId === "master-key") return "master-key";
+  if (cardId.endsWith("stone")) return "magic-stone";
+  if (cardId.endsWith("-wand")) return "magic-wand";
+  return null;
+}