Add Suspense fallback for loading states in multiple pages and layouts

app/(app)/(builder)/builder/page.tsx

@@ -1,6 +1,8 @@
 // app/(builder)/builder/page.tsx
 "use client";
 
+import { Suspense } from "react";
+
 /**
  * Battl Builder - Main builder page
  *
@@ -329,7 +331,7 @@ function buildAssemblyRows(params: {
   return rows;
 }
 
-export default function GunbuilderPage() {
+function GunbuilderPageContent() {
   const searchParams = useSearchParams();
   const router = useRouter();
 
@@ -1704,3 +1706,19 @@ export default function GunbuilderPage() {
     </main>
   );
 }
+
+export default function GunbuilderPage() {
+  return (
+    <Suspense fallback={
+      <main className="min-h-screen bg-white text-zinc-900 dark:bg-black dark:text-zinc-50">
+        <div className="mx-auto max-w-6xl px-4 py-6 lg:py-10">
+          <div className="rounded-lg border border-zinc-800 bg-zinc-950/80 p-4">
+            <div className="text-sm text-zinc-400">Loading builder…</div>
+          </div>
+        </div>
+      </main>
+    }>
+      <GunbuilderPageContent />
+    </Suspense>
+  );
+}