Initial scaffold: React+TS+Vite frontend, FastAPI backend, config system

frontend/src/components/grid/CameraGrid.tsx

@@ -0,0 +1,35 @@
+import { useConfigStore } from '@/stores/configStore';
+import { CameraGridCell } from './CameraGridCell';
+
+const STAGGER_MS = 200;
+
+export function CameraGrid() {
+  const cameras = useConfigStore((s) => s.enabledCameras());
+  const gridConfig = useConfigStore((s) => s.config?.grid);
+
+  const count = cameras.length;
+  const cols = gridConfig?.columns ?? (
+    count <= 4 ? 2 :
+    count <= 9 ? 3 :
+    4
+  );
+
+  const rows = Math.ceil(count / cols);
+  const gap = gridConfig?.gap ?? 4;
+
+  return (
+    <div
+      className="h-full p-2"
+      style={{
+        display: 'grid',
+        gridTemplateColumns: `repeat(${cols}, 1fr)`,
+        gridTemplateRows: `repeat(${rows}, 1fr)`,
+        gap: `${gap}px`,
+      }}
+    >
+      {cameras.map((cam, i) => (
+        <CameraGridCell key={cam.name} camera={cam} delayMs={i * STAGGER_MS} />
+      ))}
+    </div>
+  );
+}