Mobile LCP: render splash logo as <img> (valid LCP element); faster blended transition; recenter tracer

- Inline <svg> is not an LCP candidate; on mobile the tagline is hidden so the
  logo was the only large element -> NO_LCP. Serve the mark as
  /images/branding/splash-such.svg and render it via <img> (a valid LCP
  candidate, painted from SSR HTML).
- Transition: start the cross-fade on click (shimmer plays as the splash fades
  into the content) and shorten durations 1.2s -> 0.8s; snappier and blended.
- Tracer target back to the midpoint (computerX+0.5, computerY+0.5).

apps/web/public/images/branding/splash-such.svg

@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" role="img" aria-label="Such Software">
+  <defs>
+    <filter id="splash-glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="1.6" result="b"/>
+      <feMerge>
+        <feMergeNode in="b"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+  <rect x="14" y="14" width="172" height="172" rx="16" fill="none" stroke="#22d3ee" stroke-width="3.5" filter="url(#splash-glow)" opacity="0.45"/>
+  <g fill="none" stroke-width="14" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M 78,36 H 36 V 58 H 78 V 82 H 36" stroke="#35c98e"/>
+    <path d="m 118,36 v 34 c 0,12.15 9.85,14 22,14 12.15,0 22,-1.85 22,-14 V 36" stroke="#e8689e"/>
+    <path d="M 78,118 H 36 V 164 H 78" stroke="#4aade0"/>
+    <path d="M 118,118 V 164 M 162,118 V 164 M 118,141 H 162" stroke="#45c99e"/>
+  </g>
+</svg>