feat(ui): add vertical logo lockup splash screen on app load

Introduce a full-screen brand splash shown while the project store is
loading (status !== ready). Uses a new vertical logo lockup (P tile /
PubScript wordmark / S tile) matching the existing typewriter-tile
design, centered on the active theme background with a subtle
fade/appear animation and a graceful fade-out once the app is ready.

- apps/web/public/logo-lockup.svg: vertical lockup variant of the mark
- SplashScreen.tsx: overlay driven by the store's load status
- splash.css: full-screen overlay + keyframe animations
- wire into App.tsx and import splash.css in main.tsx

apps/web/public/logo-lockup.svg

@@ -0,0 +1,49 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 560" width="480" height="560" role="img" aria-label="PubScript">
+  <defs>
+    <linearGradient id="lk-gold" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#f9edc4"/>
+      <stop offset="0.27" stop-color="#e8c76a"/>
+      <stop offset="0.52" stop-color="#c9a23a"/>
+      <stop offset="0.72" stop-color="#f4d683"/>
+      <stop offset="1" stop-color="#937420"/>
+    </linearGradient>
+    <radialGradient id="lk-ivory" cx="45%" cy="38%" r="72%">
+      <stop offset="0" stop-color="#fffdf4"/>
+      <stop offset="0.72" stop-color="#f5ecd6"/>
+      <stop offset="1" stop-color="#e8dcbd"/>
+    </radialGradient>
+    <linearGradient id="lk-word" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0" stop-color="#f4d683"/>
+      <stop offset="0.5" stop-color="#d8b25a"/>
+      <stop offset="1" stop-color="#b8912f"/>
+    </linearGradient>
+    <filter id="lk-shadow" x="-35%" y="-35%" width="170%" height="170%">
+      <feDropShadow dx="0" dy="5" stdDeviation="8" flood-color="#000000" flood-opacity="0.4"/>
+    </filter>
+  </defs>
+
+  <!-- P tile -->
+  <g filter="url(#lk-shadow)">
+    <circle cx="240" cy="120" r="92" fill="url(#lk-gold)"/>
+    <circle cx="240" cy="120" r="78" fill="url(#lk-ivory)"/>
+    <circle cx="240" cy="120" r="78" fill="none" stroke="#8a6d1c" stroke-width="1.5" opacity="0.5"/>
+    <text x="240" y="120" text-anchor="middle" dominant-baseline="central"
+          font-family="Georgia, 'Times New Roman', serif" font-size="116" font-weight="600"
+          fill="#21242c">P</text>
+  </g>
+
+  <!-- Wordmark -->
+  <text x="240" y="300" text-anchor="middle" dominant-baseline="central"
+        font-family="Georgia, 'Times New Roman', serif" font-size="80" letter-spacing="1"
+        fill="url(#lk-word)">PubScript</text>
+
+  <!-- S tile -->
+  <g filter="url(#lk-shadow)">
+    <circle cx="240" cy="480" r="92" fill="url(#lk-gold)"/>
+    <circle cx="240" cy="480" r="78" fill="url(#lk-ivory)"/>
+    <circle cx="240" cy="480" r="78" fill="none" stroke="#8a6d1c" stroke-width="1.5" opacity="0.5"/>
+    <text x="240" y="480" text-anchor="middle" dominant-baseline="central"
+          font-family="Georgia, 'Times New Roman', serif" font-size="116" font-weight="600"
+          fill="#21242c">S</text>
+  </g>
+</svg>