The masonry becomes files: first-person textures join the paintable art

The six materials move out of the renderer into public/textures/*.png —
repaint any of them (any size; the sampler reads each file's own scale)
and refresh, exactly as the token SVGs work. fpv/textures.ts keeps the
procedural bake as the shipped default and the stand-in while files
load, and the /?tokens gallery grows a masonry section showing the set
beside the tokens they will someday match.

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

packages/web/src/TokenGallery.svelte

@@ -86,6 +86,22 @@
     </div>
   {/each}
 
+  <h2>The masonry — first-person wall textures</h2>
+  <p class="sub">
+    The materials the raycaster (<code>/?fpv</code>) wraps its walls in.
+    Each lives at <code>public/textures/&lt;name&gt;.png</code> — repaint the
+    file (any size) and refresh; the built-in procedural bake stands in
+    wherever a file is missing.
+  </p>
+  <div class="grid">
+    {#each ["wall", "rim", "stone", "door", "firewall", "warp"] as name (name)}
+      <figure>
+        <img class="masonry" src={`/textures/${name}.png`} alt={`${name} texture`} />
+        <figcaption>{name}</figcaption>
+      </figure>
+    {/each}
+  </div>
+
   <h2>Walls &amp; doors — as the maze draws them</h2>
   <p class="sub">
     Wall-segment effects have never been tokens: locks picked, jammed, and
@@ -172,4 +188,11 @@
     text-align: center;
     padding-top: 0.35rem;
   }
+  .masonry {
+    width: 128px;
+    height: 128px;
+    image-rendering: pixelated;
+    border: 1px solid #3a3428;
+    background: #101318;
+  }
 </style>