feat: add SPA, serve at /app/, update Dockerfile and README

- React + TanStack Router + shadcn/ui SPA under spa/
- serve spa/dist at /app/ with index.html fallback for client routing
- Dockerfile: node build stage for SPA, copy dist into runtime image
- README: document SPA, CORS_ORIGINS env var, architecture entry
- vite base set to /app/, manifest.json paths fixed

spa/src/components/pull-to-refresh.tsx

@@ -0,0 +1,57 @@
+import { useRef, useState } from "react"
+import { useDrag } from "@use-gesture/react"
+import { Spinner } from "@/components/ui/spinner"
+
+type PullToRefreshProps = {
+  onRefresh: () => Promise<unknown>
+  children: React.ReactNode
+}
+
+export function PullToRefresh({ onRefresh, children }: PullToRefreshProps) {
+  const [pullY, setPullY] = useState(0)
+  const [refreshing, setRefreshing] = useState(false)
+  const containerRef = useRef<HTMLDivElement>(null)
+
+  const bind = useDrag(
+    ({ movement: [, my], active, first, memo }) => {
+      if (first) {
+        const scrollTop = containerRef.current?.closest("[data-scroll]")?.scrollTop
+          ?? document.documentElement.scrollTop
+          ?? 0
+        memo = scrollTop <= 0
+      }
+      if (!memo) return memo
+
+      if (active) {
+        setPullY(Math.max(0, Math.min(my * 0.4, 80)))
+      } else {
+        if (my > 80 && !refreshing) {
+          setRefreshing(true)
+          setPullY(40)
+          onRefresh().finally(() => {
+            setRefreshing(false)
+            setPullY(0)
+          })
+        } else {
+          setPullY(0)
+        }
+      }
+      return memo
+    },
+    { axis: "y", filterTaps: true },
+  )
+
+  return (
+    <div ref={containerRef} {...bind()} className="touch-pan-y">
+      <div
+        className="flex items-center justify-center overflow-hidden transition-[height] duration-200"
+        style={{ height: pullY }}
+      >
+        {(pullY > 0 || refreshing) && (
+          <Spinner className="size-5" />
+        )}
+      </div>
+      {children}
+    </div>
+  )
+}