Add shader gradient background with halo effect

- Installed @shadergradient/react, three, and @types/three
- Created ShaderGradientBackground component with custom gradient settings
- Integrated background into root layout with blur effect (120px) and reduced opacity (0.5)
- Adjusted body background to work harmoniously with shader gradient
- Used sphere type with pink/orange gradient colors (#b01040, #b04a17, #e167c5)
- Configured animation, grain, and lighting for atmospheric effect

package.json

@@ -55,6 +55,7 @@
     "@next/bundle-analyzer": "^15.1.7",
     "@prisma/client": "^5.22.0",
     "@sentry/nextjs": "^10.36.0",
+    "@shadergradient/react": "^2.4.20",
     "@tiptap/extension-color": "^3.15.3",
     "@tiptap/extension-highlight": "^3.15.3",
     "@tiptap/extension-link": "^3.15.3",
@@ -63,6 +64,7 @@
     "@tiptap/html": "^3.15.3",
     "@tiptap/react": "^3.15.3",
     "@tiptap/starter-kit": "^3.15.3",
+    "@types/three": "^0.182.0",
     "@vercel/og": "^0.6.5",
     "clsx": "^2.1.1",
     "dotenv": "^16.6.1",
@@ -82,6 +84,7 @@
     "redis": "^5.8.2",
     "sanitize-html": "^2.17.0",
     "tailwind-merge": "^2.6.0",
+    "three": "^0.182.0",
     "zod": "^4.3.5"
   },
   "devDependencies": {