diff --git a/app/globals.css b/app/globals.css
index 571157b8..ed99aff4 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -1,87 +1,62 @@
-@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@300;400;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Permanent+Marker&family=Big+Shoulders+Display:wght@700;900&family=Roboto+Condensed:wght@400;700&family=Source+Sans+3:wght@400;600;700&display=swap');
 
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
 
 :root {
-  --background: #ffffff;
-  --foreground: #000000;
+  /* Pulp Noir Theme - Forced for entire site */
+  --background: #050505;
+  --foreground: #E5E5E5;
 
-  --card: #ffffff;
-  --card-foreground: #000000;
+  --card: #0a0a0a;
+  --card-foreground: #E5E5E5;
 
-  --popover: #ffffff;
-  --popover-foreground: #000000;
+  --popover: #0a0a0a;
+  --popover-foreground: #E5E5E5;
 
-  /* AA Compliant Pink (Contrast ~4.5:1 against white) */
-  --primary: #d60055;
-  /* Hot Pink - Gen-Z Fave */
-  --primary-foreground: #ffffff;
+  /* Pulp Noir Primary Color */
+  --primary: #8B0000;
+  --primary-foreground: #E5E5E5;
 
-  --secondary: #00ffff;
-  /* Cyan - Electric Vibes */
-  --secondary-foreground: #000000;
+  --secondary: #00cccc;
+  --secondary-foreground: #050505;
 
-  --muted: #f5f5f5;
-  --muted-foreground: #000000;
+  --muted: #1a1a1a;
+  --muted-foreground: #999999;
 
-  --accent: #7b2cbf;
-  /* Purple - Aesthetic */
-  --accent-foreground: #ffffff;
+  --accent: #8B0000;
+  --accent-foreground: #E5E5E5;
 
-  --destructive: #ff0000;
-  --destructive-foreground: #ffffff;
+  --destructive: #ef4444;
+  --destructive-foreground: #050505;
 
-  --border: #000000;
-  --input: #ffffff;
-  --ring: #ff0066;
+  --border: #1a1a1a;
+  --input: #0a0a0a;
+  --ring: #8B0000;
 
   --radius: 0px;
-  /* Sharp corners for comic look */
 
+  /* Pulp Noir Font Stack */
+  --font-display: 'Permanent Marker', cursive;
+  --font-impact: 'Big Shoulders Display', sans-serif;
+  --font-subheading: 'Roboto Condensed', sans-serif;
+  --font-body: 'Source Sans 3', sans-serif;
   --font-comic: 'Comic Neue', cursive;
 
+  /* Pulp Noir Color Palette */
+  --color-pulp-black: #050505;
+  --color-pulp-pure: #E5E5E5;
+  --color-pulp-dark: #0a0a0a;
+  --color-pulp-shadow: #1a0000;
+
   /* Gen-Z Accent Colors */
   --color-fire: #ff6600;
   --color-vibe: #00ff88;
   --color-slay: #ff0066;
   --color-lowkey: #9d4edd;
 
-  --shadow-color: #000000;
-}
-
-/* Dark Mode Variables */
-.dark {
-  --background: #0f172a;
-  --foreground: #f8fafc;
-
-  --card: #1e293b;
-  --card-foreground: #f8fafc;
-
-  --popover: #1e293b;
-  --popover-foreground: #f8fafc;
-
-  --primary: #ff0066;
-  --primary-foreground: #ffffff;
-
-  --secondary: #00cccc;
-  --secondary-foreground: #ffffff;
-
-  --muted: #334155;
-  --muted-foreground: #cbd5e1;
-
-  --accent: #9d4edd;
-  --accent-foreground: #ffffff;
-
-  --destructive: #ef4444;
-  --destructive-foreground: #f8fafc;
-
-  --border: #334155;
-  --input: #1e293b;
-  --ring: #ff0066;
-
-  --shadow-color: #f8fafc;
+  --shadow-color: #E5E5E5;
 }
 
 @layer base {
@@ -90,18 +65,17 @@
   }
 
   html {
-    font-family: var(--font-comic);
+    font-family: var(--font-body);
     scroll-behavior: smooth;
-    /* Smooth scrolling */
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
   }
 
   body {
-    @apply bg-background text-foreground;
-    font-family: var(--font-comic);
+    font-family: var(--font-body);
+    background-color: var(--background);
+    color: var(--foreground);
     overflow-x: hidden;
-    /* Prevent horizontal scroll */
     position: relative;
   }
 
@@ -111,15 +85,18 @@
   h4,
   h5,
   h6 {
-    font-family: var(--font-comic);
+    font-family: var(--font-display);
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 1px;
-    /* Gen-Z comic style - bold outline text */
-    color: var(--foreground);
-    text-shadow: 2px 2px 0px var(--background);
+    color: inherit;
     line-height: 1.2;
   }
+  
+  ::selection {
+    background-color: #8B0000;
+    color: #E5E5E5;
+  }
 
   /* Gen-Z comic text styles */
   p,
@@ -159,59 +136,6 @@
   textarea {
     transition: all 0.2s ease-in-out;
   }
-  :root {
-    --background: 0 0% 100%;
-    --foreground: 20 14.3% 4.1%;
-    --card: 0 0% 100%;
-    --card-foreground: 20 14.3% 4.1%;
-    --popover: 0 0% 100%;
-    --popover-foreground: 20 14.3% 4.1%;
-    --primary: 24 9.8% 10%;
-    --primary-foreground: 60 9.1% 97.8%;
-    --secondary: 60 4.8% 95.9%;
-    --secondary-foreground: 24 9.8% 10%;
-    --muted: 60 4.8% 95.9%;
-    --muted-foreground: 25 5.3% 44.7%;
-    --accent: 60 4.8% 95.9%;
-    --accent-foreground: 24 9.8% 10%;
-    --destructive: 0 84.2% 60.2%;
-    --destructive-foreground: 60 9.1% 97.8%;
-    --border: 20 5.9% 90%;
-    --input: 20 5.9% 90%;
-    --ring: 20 14.3% 4.1%;
-    --chart-1: 12 76% 61%;
-    --chart-2: 173 58% 39%;
-    --chart-3: 197 37% 24%;
-    --chart-4: 43 74% 66%;
-    --chart-5: 27 87% 67%;
-    --radius: 0.5rem;
-  }
-  .dark {
-    --background: 20 14.3% 4.1%;
-    --foreground: 60 9.1% 97.8%;
-    --card: 20 14.3% 4.1%;
-    --card-foreground: 60 9.1% 97.8%;
-    --popover: 20 14.3% 4.1%;
-    --popover-foreground: 60 9.1% 97.8%;
-    --primary: 60 9.1% 97.8%;
-    --primary-foreground: 24 9.8% 10%;
-    --secondary: 12 6.5% 15.1%;
-    --secondary-foreground: 60 9.1% 97.8%;
-    --muted: 12 6.5% 15.1%;
-    --muted-foreground: 24 5.4% 63.9%;
-    --accent: 12 6.5% 15.1%;
-    --accent-foreground: 60 9.1% 97.8%;
-    --destructive: 0 62.8% 30.6%;
-    --destructive-foreground: 60 9.1% 97.8%;
-    --border: 12 6.5% 15.1%;
-    --input: 12 6.5% 15.1%;
-    --ring: 24 5.7% 82.9%;
-    --chart-1: 220 70% 50%;
-    --chart-2: 160 60% 45%;
-    --chart-3: 30 80% 55%;
-    --chart-4: 280 65% 60%;
-    --chart-5: 340 75% 55%;
-  }
 }
 
 @layer components {
@@ -219,6 +143,53 @@
     @apply bg-card border-4 border-foreground p-6 shadow-[8px_8px_0px_0px_var(--foreground)];
   }
 
+  /* Pulp Noir - Action Button (from code.html) */
+  .action-button {
+    display: inline-block;
+    background-color: var(--primary);
+    color: white;
+    font-size: 2.25rem;
+    padding: 1rem 3rem;
+    border: 2px solid #050505;
+    transition: all 0.2s ease-in-out;
+    transform: scale(1);
+    box-shadow: 6px 6px 0px #000;
+    text-transform: uppercase;
+    cursor: pointer;
+    font-family: 'Permanent Marker', cursive;
+    font-weight: bold;
+  }
+
+  .action-button:hover {
+    background-color: white;
+    color: black;
+    transform: scale(1.05);
+  }
+
+  /* Pulp Noir - Comic Card (from code.html) */
+  .comic-card {
+    background-color: #E5E5E5;
+    color: #050505;
+    padding: 2rem;
+    border-right: 8px solid #050505;
+    border-bottom: 8px solid #050505;
+    position: relative;
+    box-shadow: 4px 4px 0px #8B0000;
+  }
+
+  /* Pulp Noir - Halftone Overlay */
+  .halftone {
+    background-image: radial-gradient(circle, #000 0.5px, transparent 0.5px);
+    background-size: 4px 4px;
+    @apply opacity-30 absolute inset-0 pointer-events-none;
+  }
+
+  /* Pulp Noir - Noir Overlay */
+  .noir-overlay {
+    background: linear-gradient(45deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.4) 50%, rgba(139,0,0,0.2) 100%);
+    @apply absolute inset-0 pointer-events-none;
+  }
+
   .comic-button {
     @apply px-6 py-3 bg-primary text-white font-bold border-4 border-foreground shadow-[4px_4px_0px_0px_var(--foreground)] hover:translate-x-[2px] hover:translate-y-[2px] hover:shadow-[2px_2px_0px_0px_var(--foreground)] transition-all active:translate-x-[4px] active:translate-y-[4px] active:shadow-none uppercase tracking-wider;
     will-change: transform, box-shadow;
@@ -238,13 +209,6 @@
     will-change: box-shadow;
   }
 
-  .comic-card {
-    @apply bg-card border-4 border-foreground p-4 shadow-[6px_6px_0px_0px_var(--foreground)] hover:-translate-y-1 hover:shadow-[8px_8px_0px_0px_var(--foreground)] transition-all;
-    will-change: transform, box-shadow;
-    transform: translateZ(0);
-    /* GPU acceleration */
-  }
-
   .comic-badge {
     @apply px-3 py-1 bg-accent text-accent-foreground font-bold border-2 border-foreground text-xs uppercase shadow-[2px_2px_0px_0px_var(--foreground)];
   }
@@ -274,6 +238,8 @@
     animation: comic-glow 2s infinite ease-in-out;
   }
 
+  /* Consolidated single hover behavior: animation only */
+
   /* Smooth scroll utilities */
   .smooth-scroll {
     scroll-behavior: smooth;
@@ -484,19 +450,8 @@
     box-shadow: none;
   }
 
-  /* Performance: CSS twinkle animation for stars (replaces framer-motion per-star animations) */
-  @keyframes twinkle {
-    0%, 100% { opacity: 0.2; transform: scale(1); }
-    50% { opacity: 1; transform: scale(1.5); }
-  }
-
-  .animate-twinkle {
-    animation: twinkle ease-in-out infinite;
-  }
-
   /* Respect reduced motion preferences */
   @media (prefers-reduced-motion: reduce) {
-    .animate-twinkle,
     .animate-pulse,
     .animate-spin {
       animation: none !important;
diff --git a/app/landing/page.tsx b/app/landing/page.tsx
index 0a17daca..b55bb32e 100644
--- a/app/landing/page.tsx
+++ b/app/landing/page.tsx
@@ -20,12 +20,12 @@ import React, { useState, useEffect } from 'react';
 
 import { LoadingAnimation } from '@/components/loading-animation';
 import { Button } from '@/components/ui/button';
+import { useWeb3 } from '@/components/providers/web3-provider';
 
 export default function LandingPage() {
   const router = useRouter();
+  const { connectWallet: web3Connect, connecting, connected, account: web3Account } = useWeb3();
   const [isLoading, setIsLoading] = useState(true);
-  const [account, setAccount] = useState<string | null>(null);
-  const [isConnecting, setIsConnecting] = useState(false);
 
   useEffect(() => {
     // Simulate loading
@@ -36,30 +36,15 @@ export default function LandingPage() {
     return () => clearTimeout(timer);
   }, []);
 
-  const connectWallet = async () => {
-    setIsConnecting(true);
-
+  const handleConnectWallet = async () => {
     try {
-      // Check if MetaMask is installed
-      if (typeof window.ethereum !== 'undefined') {
-        // Request account access
-        const accounts = await window.ethereum.request({
-          method: 'eth_requestAccounts',
-        });
-        setAccount(accounts[0]);
-
-        // Redirect to home page after successful login
-        setTimeout(() => {
-          router.push('/');
-        }, 1000);
-      } else {
-        alert('Please install MetaMask to use this feature!');
-      }
+      await web3Connect();
+      // Redirect to home page after successful login
+      setTimeout(() => {
+        router.push('/');
+      }, 1000);
     } catch (error) {
-      console.error('Error connecting to MetaMask', error);
-      alert('Failed to connect to MetaMask.');
-    } finally {
-      setIsConnecting(false);
+      console.error('Error connecting wallet:', error);
     }
   };
 
@@ -98,7 +83,7 @@ export default function LandingPage() {
             share, and monetize their content through NFTs.
           </p>
           <div className="flex flex-col sm:flex-row gap-4">
-            {account ? (
+            {web3Account ? (
               <Button
                 size="lg"
                 className="theme-gradient-bg text-white border-0 hover:opacity-90"
@@ -112,16 +97,16 @@ export default function LandingPage() {
             ) : (
               <Button
                 size="lg"
-                onClick={connectWallet}
-                disabled={isConnecting}
+                onClick={handleConnectWallet}
+                disabled={connecting}
                 className="theme-gradient-bg text-white border-0 hover:opacity-90"
               >
-                {isConnecting ? (
+                {connecting ? (
                   <LoadingAnimation message="Connecting..." />
                 ) : (
                   <>
                     <Wallet className="mr-2 h-5 w-5" />
-                    Connect with MetaMask
+                    Connect Wallet
                   </>
                 )}
               </Button>
diff --git a/app/page.tsx b/app/page.tsx
index 615b7ade..19c995d5 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,230 +1,16 @@
 'use client';
 
-import { motion } from 'framer-motion';
-import {
-  BookOpen,
-  Sparkles,
-  ArrowRight,
-  PenSquare,
-  Wallet,
-  Zap,
-  Star,
-  Rocket,
-} from 'lucide-react';
-import Image from 'next/image';
-import Link from 'next/link';
-import { useRouter } from 'next/navigation';
-import React from 'react';
-
-import { FeaturedCreators } from '@/components/featured-creators';
+import { HeroSection, TrendingSection, CTASection } from '@/components/home';
 import { useWeb3 } from '@/components/providers/web3-provider';
-import { TrendingStories } from '@/components/trending-stories';
-import { Button } from '@/components/ui/button';
 
 export default function Home() {
-  const { account, connectWallet } = useWeb3();
-  const router = useRouter();
+  const { connectWallet } = useWeb3();
 
   return (
-    <main className="flex min-h-screen flex-col relative bg-yellow-50 dark:dark-premium-bg overflow-hidden transition-colors duration-500">
-      {/* Premium Background Glows for Dark Mode */}
-      <div className="absolute inset-0 pointer-events-none overflow-hidden opacity-0 dark:opacity-100 transition-opacity duration-1000">
-        <div className="absolute top-[-10%] left-[-10%] w-[40%] h-[40%] bg-blue-600/10 blur-[120px] rounded-full" />
-        <div className="absolute top-[20%] right-[-10%] w-[35%] h-[35%] bg-purple-600/10 blur-[120px] rounded-full" />
-        <div className="absolute bottom-[-10%] left-[20%] w-[40%] h-[40%] bg-indigo-600/10 blur-[120px] rounded-full" />
-      </div>
-
-      {/* Comic Halftone Background Overlay */}
-      <div className="absolute inset-0 bg-[radial-gradient(#000_1px,transparent_1px)] dark:bg-[radial-gradient(#fff_1px,transparent_1px)] [background-size:20px_20px] opacity-[0.03] pointer-events-none" />
-
-      {/* Hero Section */}
-      <section className="relative py-24 border-b-8 border-foreground bg-yellow-400 dark:bg-slate-900/80 dark:backdrop-blur-sm overflow-hidden transition-colors duration-500">
-        <div className="container mx-auto px-4 relative z-10">
-          <div className="flex flex-col lg:flex-row items-center gap-12">
-            <div className="lg:w-1/2 space-y-8">
-              <motion.div
-                initial={false}
-                animate={{ opacity: 1, y: 0 }}
-                className="inline-block bg-card border-4 border-foreground px-6 py-3 shadow-[8px_8px_0px_0px_var(--shadow-color)] transform -rotate-2"
-              >
-                <span className="font-black text-xl md:text-2xl text-foreground uppercase tracking-widest">
-                  The Future of Storytelling
-                </span>
-              </motion.div>
-
-              <motion.h1
-                initial={false}
-                animate={{ opacity: 1, x: 0 }}
-                transition={{ delay: 0.2 }}
-                className="text-6xl md:text-8xl font-black text-foreground uppercase leading-none [text-shadow:4px_4px_0px_#fff,8px_8px_0px_#000] dark:[text-shadow:0_0_15px_rgba(59,130,246,0.4),0_0_30px_rgba(139,92,246,0.2)]"
-              >
-                Create <br />
-                <span className="text-white dark:bg-gradient-to-r dark:from-cyan-400 dark:to-blue-500 dark:bg-clip-text dark:text-transparent [text-shadow:4px_4px_0px_#000] dark:[text-shadow:none] dark:drop-shadow-[0_0_12px_rgba(34,211,238,0.6)]">
-                  Mint
-                </span>{' '}
-                <br />& Share
-              </motion.h1>
-
-              <motion.p
-                initial={false}
-                animate={{ opacity: 1 }}
-                transition={{ delay: 0.4 }}
-                className="text-2xl font-bold text-foreground border-l-8 border-foreground pl-6 py-4 bg-card/80 shadow-[4px_4px_0px_0px_var(--shadow-color)]"
-              >
-                Unleash your imagination with AI. Turn your stories into
-                valuable NFTs on the Monad blockchain.
-              </motion.p>
-
-              <motion.div
-                initial={false}
-                animate={{ opacity: 1, y: 0 }}
-                transition={{ delay: 0.6 }}
-                className="flex flex-wrap gap-6 pt-4"
-              >
-                <Link href="/create/ai-story">
-                  <Button
-                    size="lg"
-                    className="bg-red-500 text-white border-4 border-foreground shadow-[8px_8px_0px_0px_var(--shadow-color)] hover:shadow-[12px_12px_0px_0px_var(--shadow-color)] hover:-translate-y-1 transition-all text-xl font-black uppercase px-8 py-6 h-auto rounded-none"
-                  >
-                    <PenSquare className="mr-3 h-6 w-6" />
-                    Start Creating
-                  </Button>
-                </Link>
-
-                {!account && (
-                  <Button
-                    onClick={connectWallet}
-                    size="lg"
-                    className="bg-card text-foreground border-4 border-foreground shadow-[8px_8px_0px_0px_var(--shadow-color)] hover:shadow-[12px_12px_0px_0px_var(--shadow-color)] hover:-translate-y-1 transition-all text-xl font-black uppercase px-8 py-6 h-auto rounded-none"
-                  >
-                    <Wallet className="mr-3 h-6 w-6" />
-                    Connect Wallet
-                  </Button>
-                )}
-              </motion.div>
-            </div>
-
-            <div className="lg:w-1/2 relative">
-              <motion.div
-                animate={{ rotate: [2, -2, 2] }}
-                transition={{
-                  repeat: Infinity,
-                  duration: 5,
-                  ease: 'easeInOut',
-                }}
-                className="relative z-10"
-              >
-                <div className="bg-card border-8 border-foreground p-4 shadow-[20px_20px_0px_0px_var(--shadow-color)]">
-                  <div className="aspect-square relative overflow-hidden border-4 border-foreground bg-blue-400 dark:bg-blue-600">
-                    <div className="absolute inset-0 flex items-center justify-center">
-                      <Rocket className="w-32 h-32 text-white animate-bounce" />
-                    </div>
-                    {/* Comic Speech Bubble */}
-                    <div className="absolute -top-6 -right-6 bg-card border-4 border-foreground px-6 py-4 rounded-[50%] shadow-[8px_8px_0px_0px_var(--shadow-color)] z-20">
-                      <span className="font-black text-2xl text-foreground">
-                        BOOM!
-                      </span>
-                    </div>
-                  </div>
-                  <div className="mt-4 border-t-4 border-foreground pt-4">
-                    <h3 className="text-3xl font-black uppercase">
-                      AI Powered
-                    </h3>
-                    <p className="font-bold text-lg">
-                      Generate stories in seconds!
-                    </p>
-                  </div>
-                </div>
-              </motion.div>
-
-              {/* Decorative Elements */}
-              <Star className="absolute top-0 right-0 w-12 h-12 text-yellow-400 fill-current stroke-foreground stroke-2 animate-spin-slow" />
-              <Zap className="absolute bottom-0 left-0 w-16 h-16 text-blue-500 fill-current stroke-foreground stroke-2 animate-pulse" />
-            </div>
-          </div>
-        </div>
-      </section>
-
-      {/* Features Grid */}
-      <section className="py-20 bg-card dark:bg-slate-900/40 dark:backdrop-blur-md border-b-8 border-foreground transition-colors duration-500">
-        <div className="container mx-auto px-4">
-          <div className="text-center mb-16">
-            <h2 className="text-5xl md:text-7xl font-black uppercase mb-4 bg-gradient-to-r from-slate-900 via-slate-700 to-slate-900 dark:from-white dark:via-slate-300 dark:to-white bg-clip-text text-transparent [text-shadow:4px_4px_0px_rgba(0,0,0,0.05)] dark:[text-shadow:4px_4px_0px_rgba(255,255,255,0.05)]">
-              Why GroqTales?
-            </h2>
-          </div>
-
-          <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-            {[
-              {
-                title: 'AI Generation',
-                desc: 'Powered by Groq for lightning-fast story creation.',
-                icon: <Zap className="w-12 h-12" />,
-                color: 'bg-cyan-300 dark:bg-cyan-900/30',
-              },
-              {
-                title: 'NFT Ownership',
-                desc: 'Your stories are truly yours on the blockchain.',
-                icon: <Wallet className="w-12 h-12" />,
-                color: 'bg-pink-300 dark:bg-pink-900/30',
-              },
-              {
-                title: 'Community',
-                desc: 'Read, share, and trade with other creators.',
-                icon: <Sparkles className="w-12 h-12" />,
-                color: 'bg-green-300 dark:bg-green-900/30',
-              },
-            ].map((feature, i) => (
-              <motion.div
-                key={i}
-                whileHover={{ scale: 1.05, rotate: 1 }}
-                className={`${feature.color} border-4 border-foreground p-8 shadow-[12px_12px_0px_0px_var(--shadow-color)]`}
-              >
-                <div className="bg-card border-4 border-foreground w-20 h-20 flex items-center justify-center mb-6 shadow-[4px_4px_0px_0px_var(--shadow-color)]">
-                  {feature.icon}
-                </div>
-                <h3 className="text-3xl font-black uppercase mb-4">
-                  {feature.title}
-                </h3>
-                <p className="text-xl font-bold border-l-4 border-foreground pl-4 bg-card/50 py-2">
-                  {feature.desc}
-                </p>
-              </motion.div>
-            ))}
-          </div>
-        </div>
-      </section>
-
-      {/* Trending Section */}
-      <section className="py-20 bg-pink-100 dark:bg-slate-900/60 dark:backdrop-blur-sm border-b-8 border-foreground transition-colors duration-500">
-        <div className="container mx-auto px-4">
-          <div className="flex flex-col gap-4 items-start mb-12 md:flex-row md:items-center md:justify-between">
-            <h2 className="text-2xl md:text-4xl font-black uppercase bg-card border-4 border-foreground px-6 py-2 shadow-[6px_6px_0px_0px_var(--shadow-color)]">
-              Trending Now
-            </h2>
-            <Link href="/nft-gallery">
-              <Button className="w-full md:w-auto bg-black dark:bg-white dark:text-black text-white border-4 border-transparent hover:bg-gray-800 font-bold uppercase">
-                View All <ArrowRight className="ml-2 w-4 h-4" />
-              </Button>
-            </Link>
-          </div>
-          <TrendingStories />
-        </div>
-      </section>
-
-      {/* CTA */}
-      <section className="py-24 bg-blue-600 dark:bg-indigo-950/80 dark:backdrop-blur-md border-b-8 border-foreground text-center transition-colors duration-500">
-        <div className="container mx-auto px-4">
-          <h2 className="text-4xl md:text-6xl lg:text-8xl font-black text-white uppercase mb-8 [text-shadow:6px_6px_0px_#000]">
-            Ready to Start?
-          </h2>
-          <Link href="/create/ai-story">
-            <Button className="w-full md:w-auto bg-yellow-400 dark:bg-yellow-600 text-foreground border-4 border-foreground text-lg md:text-2xl font-black uppercase px-6 md:px-12 py-4 md:py-8 h-auto shadow-[12px_12px_0px_0px_#000] hover:shadow-[16px_16px_0px_0px_#000] hover:-translate-y-1 transition-all rounded-none">
-              Create Your Story
-            </Button>
-          </Link>
-        </div>
-      </section>
+    <main className="flex min-h-screen flex-col relative overflow-hidden">
+      <HeroSection connectWallet={connectWallet} isConnected={false} />
+      <TrendingSection />
+      <CTASection />
     </main>
   );
 }
diff --git a/components/connect-wallet-button.tsx b/components/connect-wallet-button.tsx
index 835ee80f..89c8ff11 100644
--- a/components/connect-wallet-button.tsx
+++ b/components/connect-wallet-button.tsx
@@ -1,47 +1,42 @@
-/*
- * WALLET CONNECTION FUNCTIONALITY TEMPORARILY DISABLED FOR PRODUCTION DEPLOYMENT
- * This component handles wallet connections for blockchain functionality.
- * It has been commented out to focus on core AI storytelling features.
- */
-
 'use client';
 
+import { Wallet } from 'lucide-react';
+import React from 'react';
 import { Button } from '@/components/ui/button';
+import { useWeb3 } from '@/components/providers/web3-provider';
 
+/**
+ * ConnectWalletButton Component
+ *
+ * Handles wallet connection functionality for the application.
+ * Displays:
+ * - "Connect Wallet" button when not connected
+ * - Connecting state with spinner during connection
+ * - Uses the Web3 provider context for connection logic
+ *
+ * @returns JSX.Element - The connect wallet button
+ */
 export function ConnectWalletButton() {
-  const handleDisabledClick = () => {
-    // Show a message that wallet functionality is disabled
-    console.log('Wallet functionality is temporarily disabled');
-  };
+  const { connecting, connectWallet } = useWeb3();
 
   return (
     <Button
-      variant="outline"
-      onClick={handleDisabledClick}
-      className="opacity-50 cursor-not-allowed"
-      disabled
+      onClick={connectWallet}
+      disabled={connecting}
+      aria-label={connecting ? 'Connecting to wallet' : 'Connect your wallet'}
+      className="flex items-center gap-2 px-3 sm:px-6 py-1.5 sm:py-2 rounded-none bg-white hover:text-white hover:border-white/50 text-black border-2 sm:border-4 border-black shadow-[2px_2px_0px_0px_rgba(0,0,0,1)] sm:shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] sm:hover:shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] hover:-translate-y-0.5 transition-all duration-200 font-black uppercase tracking-wider text-xs sm:text-sm"
     >
-      Wallet (Coming Soon)
+      {connecting ? (
+        <>
+          <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-black" />
+          <span>Connecting...</span>
+        </>
+      ) : (
+        <div className="flex items-center gap-2">
+          <Wallet className="h-5 w-5" />
+          <span>Connect Wallet</span>
+        </div>
+      )}
     </Button>
   );
 }
-
-/*
-// ORIGINAL WALLET CONNECTION CODE - COMMENTED OUT FOR PRODUCTION DEPLOYMENT
-// The complete original implementation is preserved below
-
-import { Loader2, Wallet, QrCode, Lock } from 'lucide-react';
-import React, { useState, useEffect } from 'react';
-import { Button } from '@/components/ui/button';
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from '@/components/ui/dialog';
-import { useToast } from '@/components/ui/use-toast';
-import { useWeb3Auth } from '@/hooks/use-web3-auth';
-
-// Original component implementation would be here - commented out for production
-*/
diff --git a/components/galaxy-background.tsx b/components/galaxy-background.tsx
index 8c163208..70398de1 100644
--- a/components/galaxy-background.tsx
+++ b/components/galaxy-background.tsx
@@ -148,11 +148,10 @@ export const GalaxyBackground = () => {
         </>
       )}
 
-      {/* Animated stars - use CSS animation instead of framer-motion for each star */}
-      {stars.map((star, i) => (
+      {/* Animated stars - use CSS animation instead of framer-motion for each star */}\n      {stars.map((star, i) => (
         <div
           key={i}
-          className="absolute rounded-full animate-twinkle"
+          className="absolute rounded-full"
           style={{
             left: `${star.x}%`,
             top: `${star.y}%`,
@@ -160,8 +159,7 @@ export const GalaxyBackground = () => {
             height: star.size,
             backgroundColor: star.color,
             boxShadow: `0 0 ${star.size * 2}px ${star.color}`,
-            animationDelay: `${star.delay}s`,
-            animationDuration: `${3 + (i % 4)}s`,
+            opacity: 0.6,
           }}
         />
       ))}
diff --git a/components/header.tsx b/components/header.tsx
index a69bfbf2..a14c7a90 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -1,362 +1,82 @@
 'use client';
 
-import { motion } from 'framer-motion';
-import {
-  PenSquare,
-  Users,
-  BookOpen,
-  FlaskConical,
-  ChevronDown,
-  Trophy,
-  Menu,
-  DollarSign,
-} from 'lucide-react';
-import Image from 'next/image';
+import { useState } from 'react';
 import Link from 'next/link';
-import { usePathname } from 'next/navigation';
-import React, { useState, useEffect } from 'react';
-
-import { useWeb3 } from '@/components/providers/web3-provider';
-import { Button } from '@/components/ui/button';
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from '@/components/ui/dropdown-menu';
-import {
-  Sheet,
-  SheetContent,
-  SheetHeader,
-  SheetTitle,
-  SheetTrigger,
-} from '@/components/ui/sheet';
-import { useToast } from '@/components/ui/use-toast';
-import { UserNav } from '@/components/user-nav';
-import WalletConnect from '@/components/wallet-connect';
-import { cn } from '@/lib/utils';
-
-import { CreateStoryDialog } from './create-story-dialog';
-import { ModeToggle } from './mode-toggle';
-
-// Type definitions for nav items
-type NavSubItem = {
-  href: string;
-  label: string;
-  icon?: React.ReactNode;
-};
-
-type NavItem = {
-  href?: string;
-  label: string;
-  icon?: React.ReactNode;
-  type?: 'link' | 'dropdown';
-  items?: NavSubItem[];
-};
+import { Menu, X } from 'lucide-react';
+import { ConnectWalletButton } from '@/components/connect-wallet-button';
 
 export function Header() {
-  const pathname = usePathname();
-  const { account } = useWeb3();
-  const { toast } = useToast();
-  const [showCreateDialog, setShowCreateDialog] = useState(false);
-  const [scrolled, setScrolled] = useState(false);
-  const [sheetOpen, setSheetOpen] = useState(false);
-
-  // Track scroll position for adding box shadow to header
-  useEffect(() => {
-    if (typeof window === 'undefined') return;
-
-    const handleScroll = () => {
-      setScrolled(window.scrollY > 10);
-    };
-
-    window.addEventListener('scroll', handleScroll, { passive: true });
-    return () => window.removeEventListener('scroll', handleScroll);
-  }, []);
-
-  // Define active class for navigation links
-  const isActive = (path: string) => {
-    if (path === '/community') {
-      return pathname === '/community' || pathname === '/community/creators'
-        ? 'bg-primary/10 text-primary font-medium'
-        : 'hover:bg-accent/20 text-muted-foreground';
-    }
-    return pathname === path
-      ? 'bg-primary/10 text-primary font-medium'
-      : 'hover:bg-accent/20 text-muted-foreground';
-  };
-
-  const handleCreateClick = () => {
-    // Check if user is authenticated
-    const isAdmin =
-      typeof window !== 'undefined' && window.localStorage
-        ? localStorage.getItem('adminSession')
-        : null;
-
-    if (!account && !isAdmin) {
-      toast({
-        title: 'Authentication Required',
-        description:
-          'Please connect your wallet or login as admin to create stories',
-        variant: 'destructive',
-      });
-      return;
-    }
-    setShowCreateDialog(true);
-  };
-
-  const navItems: NavItem[] = [
-    { type: 'link', href: '/genres', label: 'Genres' },
-    {
-      type: 'dropdown',
-      label: 'Community',
-      icon: <Users className="h-4 w-4 mr-1.5 colorful-icon" />,
-      items: [
-        { href: '/community', label: 'Community Hub' },
-        {
-          href: '/community/creators',
-          label: 'Top Creators',
-          icon: <Trophy className="h-4 w-4 mr-1.5 colorful-icon" />,
-        },
-      ],
-    },
-    { type: 'link', href: '/nft-gallery', label: 'NFT Gallery' },
-    { type: 'link', href: '/nft-marketplace', label: 'NFT Marketplace' },
-    ...(account
-      ? [
-          {
-            type: 'link' as const,
-            href: '/dashboard/royalties',
-            label: 'Earnings',
-            icon: <DollarSign className="h-4 w-4 mr-1.5 colorful-icon" />,
-          },
-        ]
-      : []),
+  const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
+
+  const navItems = [
+    { href: '/create/ai-story', label: 'CREATE' },
+    { href: '/genres', label: 'GENRES' },
+    { href: '/community', label: 'COMMUNITY' },
+    { href: '/nft-gallery', label: 'NFT GALLERY' },
+    { href: '/nft-marketplace', label: 'MARKETPLACE' },
   ];
 
   return (
-    <motion.header
-      initial={false}
-      animate={{ opacity: 1, y: 0 }}
-      transition={{ duration: 0.3 }}
-      className={cn(
-        'border-b-4 border-black dark:border-slate-800 sticky top-0 z-50 transition-all duration-300 bg-[#36454F] dark:bg-slate-950/80 dark:backdrop-blur-md',
-        scrolled && 'shadow-[0px_4px_0px_0px_rgba(255,255,255,0.2)]'
-      )}
-    >
-      <div className="container mx-auto px-4 h-16 flex items-center justify-between">
-        <div className="flex items-center">
-          <Link
-            href="/"
-            aria-label="GroqTales home"
-            className="flex items-center space-x-2 mr-2 sm:mr-6 group relative"
-          >
-            <motion.div
-              whileHover={{ scale: 1.1, rotate: 5 }}
-              transition={{ type: 'spring', stiffness: 400, damping: 10 }}
-              className="w-12 h-12 sm:w-16 sm:h-16 rounded-full bg-white/10 backdrop-blur-sm flex items-center justify-center doodle-wiggle overflow-hidden border-2 border-white/20"
+    <header className="sticky top-0 z-50 border-b-4 border-black" style={{ backgroundColor: '#000000' }}>
+      <div className="max-w-7xl mx-auto px-6 h-20 flex items-center justify-between">
+        {/* Logo */}
+        <Link href="/" className="flex items-center gap-1">
+          <span className="font-display text-4xl font-bold text-white uppercase tracking-tight">
+            GROQ
+            <span style={{ color: '#8B0000' }}>TALES</span>
+          </span>
+        </Link>
+
+        {/* Desktop Navigation Links */}
+        <nav className="hidden md:flex items-center gap-12">
+          {navItems.map((item) => (
+            <Link
+              key={item.href}
+              href={item.href}
+              className="font-subheading text-base font-black text-white uppercase tracking-wide hover:text-primary transition-colors"
             >
-              <div className="relative w-full h-full">
-                <Image
-                  src="/logo.png"
-                  alt="GroqTales Logo"
-                  fill
-                  className="object-cover"
-                  priority
-                />
-              </div>
-            </motion.div>
-          </Link>
+              {item.label}
+            </Link>
+          ))}
+        </nav>
+
+        {/* Desktop Connect Wallet Button */}
+        <ConnectWalletButton />
+
+        {/* Mobile Menu Button */}
+        <button
+          className="md:hidden text-white p-2 hover:opacity-80"
+          onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
+          aria-label="Toggle mobile menu"
+          aria-expanded={mobileMenuOpen}
+        >
+          {mobileMenuOpen ? <X size={32} /> : <Menu size={32} />}
+        </button>
+      </div>
 
-          <nav role="navigation" aria-label="Primary navigation" className="hidden xl:flex items-center space-x-2">
-            {navItems.map((item, index) => (
-              <motion.div
-                key={
-                  item.type === 'dropdown'
-                    ? `dropdown-${item.label}`
-                    : item.href || `item-${index}`
-                }
-                initial={false}
-                animate={{ opacity: 1, y: 0 }}
-                transition={{ delay: index * 0.05 + 0.1, duration: 0.2 }}
-                whileHover={{ scale: 1.03 }}
-                className="inline-flex items-center comic-text"
+      {/* Mobile Menu Dropdown */}
+      {mobileMenuOpen && (
+        <div
+          className="md:hidden absolute top-20 left-0 right-0 border-t-4 border-black z-50"
+          style={{ backgroundColor: '#000000' }}
+        >
+          <nav className="flex flex-col p-6 gap-4">
+            {navItems.map((item) => (
+              <Link
+                key={item.href}
+                href={item.href}
+                className="font-subheading text-base font-black text-white uppercase tracking-wide hover:text-primary transition-colors py-2 border-b-2 border-gray-800"
+                onClick={() => setMobileMenuOpen(false)}
               >
-                {item.type === 'dropdown' ? (
-                  <DropdownMenu>
-                    <DropdownMenuTrigger
-                      aria-haspopup="true"
-                      className={`px-4 py-2 text-sm rounded-md transition-all duration-200 flex items-center text-white hover:text-white/80 hover:bg-white/10 backdrop-blur-sm comic-pop comic-text`}
-                    >
-                      {item.icon}
-                      {item.label}
-                      <ChevronDown className="ml-1 h-3 w-3" />
-                    </DropdownMenuTrigger>
-                    <DropdownMenuContent
-                      side="bottom"
-                      align="start"
-                      sideOffset={8}
-                      collisionPadding={16}
-                      className="
-                        z-50
-                        w-[160px] sm:w-[180px]
-                        bg-white
-                        dark:bg-slate-950
-                        border-2 border-black
-                        shadow-[4px_4px_0px_0px_rgba(0,0,0,1)]
-                        dark:shadow-white/40
-                        rounded-md
-                        p-2
-                        comic-text font-bold
-                      "
-                    >
-                      {item.items?.map((subItem) => (
-                        <DropdownMenuItem key={subItem.href} asChild>
-                          <Link
-                            href={subItem.href}
-                            aria-current={pathname === subItem.href ? 'page' : undefined}
-                            className="flex items-center w-full text-foreground/90 hover:text-foreground hover:bg-white/5 comic-text"
-                          >
-                            {subItem.icon && subItem.icon}
-                            {subItem.label}
-                          </Link>
-                        </DropdownMenuItem>
-                      ))}
-                    </DropdownMenuContent>
-                  </DropdownMenu>
-                ) : item.href ? (
-                  <Link
-                    href={item.href}
-                    aria-current={pathname === item.href ? 'page' : undefined}
-                    className={`px-4 py-2 text-sm rounded-md transition-all duration-200 flex items-center text-white hover:text-white/80 hover:bg-white/10 backdrop-blur-sm comic-pop comic-text`}
-                  >
-                    {item.icon}
-                    {item.label}
-                  </Link>
-                ) : null}
-              </motion.div>
+                {item.label}
+              </Link>
             ))}
+            <div className="mt-4">
+              <ConnectWalletButton />
+            </div>
           </nav>
         </div>
-
-        <div className="flex items-center space-x-2">
-          <div className="hidden xl:block dark:hover:bg-gray-700">
-            <WalletConnect />
-          </div>
-          <Button
-            variant="outline"
-            size="sm"
-            className="hidden xl:flex items-center gap-2 px-3 sm:px-5 py-1.5 sm:py-2 rounded-none bg-white text-black border-2 sm:border-4 border-black shadow-[2px_2px_0px_0px_rgba(0,0,0,1)] sm:shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:bg-primary hover:text-white hover:border-black hover:shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] sm:hover:shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] hover:-translate-y-0.5 transition-all duration-200 comic-pop comic-text-bold dark:hover:border-white/50"
-            onClick={handleCreateClick}
-            aria-label="Create a new story"
-          >
-            <PenSquare className="h-4 w-4 mr-2" />
-            Create
-          </Button>
-          <ModeToggle />
-          <UserNav />
-
-          {/* Mobile Menu */}
-          <div className="xl:hidden">
-            <Sheet open={sheetOpen} onOpenChange={setSheetOpen}>
-              <SheetTrigger asChild>
-                <Button
-                  variant="ghost"
-                  size="icon"
-                  className="text-white hover:bg-white/10"
-                  aria-label="Open menu"
-                >
-                  <Menu className="h-6 w-6" />
-                </Button>
-              </SheetTrigger>
-              <SheetContent
-                side="right"
-                className="bg-[#36454F] border-l-4 border-black text-white p-0"
-              >
-                <SheetHeader className="p-6 border-b-4 border-black">
-                  <SheetTitle className="text-white comic-pop text-xl flex items-center gap-2 text-shadow-comic">
-                    <div className="w-8 h-8 relative">
-                      <Image
-                        src="/logo.png"
-                        alt="Logo"
-                        fill
-                        className="object-contain"
-                      />
-                    </div>
-                    GroqTales
-                  </SheetTitle>
-                </SheetHeader>
-                <div className="flex flex-col p-4 space-y-2">
-                  <div className="mb-4 md:hidden">
-                    <WalletConnect />
-                  </div>
-                  {navItems.map((item, index) => (
-                    <div
-                      key={
-                        item.type === 'dropdown'
-                          ? `dropdown-${item.label}`
-                          : item.href || `item-${index}`
-                      }
-                      className="flex flex-col"
-                    >
-                      {item.type === 'dropdown' ? (
-                        <>
-                          <div className="px-4 py-2 text-sm font-bold uppercase text-white/60 mt-2">
-                            {item.label}
-                          </div>
-                          {item.items?.map((subItem) => (
-                            <Link
-                              key={subItem.href}
-                              href={subItem.href}
-                              onClick={() => setSheetOpen(false)}
-                              className="px-6 py-3 text-lg hover:bg-white/10 rounded-md transition-colors comic-text flex items-center"
-                            >
-                              {subItem.icon}
-                              {subItem.label}
-                            </Link>
-                          ))}
-                        </>
-                      ) : (
-                        item.href && (
-                          <Link
-                            href={item.href}
-                            onClick={() => setSheetOpen(false)}
-                            className={cn(
-                              'px-4 py-3 text-lg hover:bg-white/10 rounded-md transition-colors comic-text flex items-center',
-                              'bg-primary/20 text-primary'
-                            )}
-                          >
-                            {item.icon}
-                            {item.label}
-                          </Link>
-                        )
-                      )}
-                    </div>
-                  ))}
-                  <div className="pt-4 mt-4 border-t-2 border-white/10">
-                    <Button
-                      variant="outline"
-                      className="w-full justify-start text-lg bg-primary/20 hover:bg-primary/30 text-primary border-white/10 comic-pop"
-                      onClick={() => {
-                        setSheetOpen(false);
-                        handleCreateClick();
-                      }}
-                    >
-                      <PenSquare className="h-5 w-5 mr-3" />
-                      Create Story
-                    </Button>
-                  </div>
-                </div>
-              </SheetContent>
-            </Sheet>
-          </div>
-        </div>
-      </div>
-
-      <CreateStoryDialog
-        isOpen={showCreateDialog}
-        onClose={() => setShowCreateDialog(false)}
-      />
-    </motion.header>
+      )}
+    </header>
   );
 }
diff --git a/components/home/boom-ai-powered.tsx b/components/home/boom-ai-powered.tsx
new file mode 100644
index 00000000..1a41a065
--- /dev/null
+++ b/components/home/boom-ai-powered.tsx
@@ -0,0 +1,48 @@
+'use client';
+
+export function BoomAIPowered() {
+  return (
+    <section
+      className="relative min-h-screen w-full flex items-center justify-center overflow-hidden border-b-[12px] border-pulp-black bg-pulp-dark"
+      aria-label="Boom AI Powered Section"
+    >
+      {/* Background Image with Overlays */}
+      <div className="absolute inset-0 z-0">
+        <img
+          alt="Gritty Urban Landscape"
+          src="https://lh3.googleusercontent.com/aida-public/AB6AXuBzHu79NVYgya5Cj8BACNCEvQU1WzneTRWADEYopkZtri6Df2onMzvLLhPRwhswLUGSfwLJocrlpjEgN0K_4fYns1eFJT1du1QBr7pJuM3N3CmaY6w-q-ACgCqIwV5xZrgPgoIBkhvldOntQdwEF6_ycFRWfor09_XNcxh2ZZiK7PX8_z2e1PI0E4TvDz4AiJU1YbcUjHyT4WTcYR8vtjm85TjaRt-2T6sdM71unJAvSKNXabOATDjHsz0W6rwF7pqT0uWF67u2US4"
+          className="w-full h-full object-cover grayscale brightness-[0.35] contrast-[1.8]"
+        />
+        <div className="absolute inset-0 bg-black/70" />
+        <div className="absolute inset-0 bg-[radial-gradient(#000_0.5px,transparent_0.5px)] [background-size:4px_4px] opacity-10 pointer-events-none" />
+      </div>
+
+      <div className="relative z-10 w-full max-w-7xl mx-auto px-6 py-24">
+        <div className="flex flex-col md:flex-row items-center gap-12">
+          {/* Left Column: BOOM! AI POWERED Content */}
+          <div className="md:w-1/2">
+            {/* BOOM! Heading */}
+            <h2 className="text-[10rem] text-primary leading-none filter drop-shadow-[5px_5px_0px_#fff]" style={{ transform: 'rotate(-12deg)' }}>
+              BOOM!
+            </h2>
+
+            {/* AI POWERED Subheading */}
+            <h3 className="text-5xl text-white font-impact mt-2 tracking-widest uppercase">
+              AI POWERED
+            </h3>
+
+            {/* Tagline */}
+            <p className="text-3xl font-subheading uppercase mt-6 bg-primary text-white p-3 inline-block font-black shadow-lg">
+              Generate stories in seconds!
+            </p>
+          </div>
+
+          {/* Right Column: Feature Cards Placeholder */}
+          <div className="md:w-1/2 grid grid-cols-1 gap-6">
+            {/* Feature cards will be rendered here */}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}
diff --git a/components/home/cta-section.tsx b/components/home/cta-section.tsx
new file mode 100644
index 00000000..3b5cc6e1
--- /dev/null
+++ b/components/home/cta-section.tsx
@@ -0,0 +1,104 @@
+// Component: CTASection
+// Purpose: "Ready to Start?" CTA section with JOIN THE REVOLUTION button
+// Based on: code.html CTA panel section
+
+'use client';
+
+export function CTASection() {
+  return (
+    <section
+      className="relative min-h-screen w-full flex items-center justify-center overflow-hidden border-b-[12px] border-pulp-black"
+      style={{
+        backgroundColor: '#8B0000',
+        clipPath: 'polygon(0 0, 100% 1%, 100% 99%, 0 100%)',
+      }}
+    >
+      {/* Background Image with Overlays */}
+      <div className="absolute inset-0 z-0">
+        <img
+          alt="Intense Shadowy Action"
+          src="https://lh3.googleusercontent.com/aida-public/AB6AXuBzHu79NVYgya5Cj8BACNCEvQU1WzneTRWADEYopkZtri6Df2onMzvLLhPRwhswLUGSfwLJocrlpjEgN0K_4fYns1eFJT1du1QBr7pJuM3N3CmaY6w-q-ACgCqIwV5xZrgPgoIBkhvldOntQdwEF6_ycFRWfor09_XNcxh2ZZiK7PX8_z2e1PI0E4TvDz4AiJU1YbcUjHyT4WTcYR8vtjm85TjaRt-2T6sdM71unJAvSKNXabOATDjHsz0W6rwF7pqT0uWF67u2US4"
+          className="w-full h-full object-cover"
+          style={{
+            filter: 'grayscale(1) brightness(0.35) contrast(1.8)',
+          }}
+        />
+        {/* Noir Overlay */}
+        <div
+          className="absolute inset-0"
+          style={{
+            background:
+              'linear-gradient(135deg, rgba(0,0,0,0.90) 0%, rgba(139,0,0,0.3) 100%)',
+          }}
+        />
+        {/* Halftone Pattern */}
+        <div
+          className="absolute inset-0"
+          style={{
+            backgroundImage:
+              'radial-gradient(circle, #000 0.5px, transparent 0.5px)',
+            backgroundSize: '4px 4px',
+            opacity: 0.3,
+          }}
+        />
+      </div>
+
+      {/* Content */}
+      <div className="relative z-10 w-full max-w-7xl mx-auto px-6 py-24 text-center">
+        {/* Ready to Start Badge */}
+        <div
+          className="inline-block px-10 py-4 mb-8"
+          style={{
+            backgroundColor: '#050505',
+            transform: 'rotate(1deg)',
+          }}
+        >
+          <h2 className="text-6xl font-display text-white uppercase">Ready to Start?</h2>
+        </div>
+
+        {/* Main Headline - EXACT text-9xl from code.html */}
+        <div className="max-w-4xl mx-auto mb-16">
+          <h3
+            className="text-9xl text-white tracking-tighter font-display uppercase leading-none"
+            style={{
+              filter: 'drop-shadow(6px 6px 0px #000)',
+              WebkitTextStroke: '1px rgba(255,255,255,0.1)',
+            }}
+          >
+            CREATE YOUR STORY
+          </h3>
+        </div>
+
+        {/* CTA Actions */}
+        <div className="flex flex-col md:flex-row gap-8 justify-center items-center">
+          {/* Primary Button */}
+          <a
+            href="/create/ai-story"
+            className="font-display text-5xl px-16 py-8 border-4 border-pulp-black uppercase cursor-pointer inline-block transition-all hover:scale-105"
+            style={{
+              backgroundColor: '#E5E5E5',
+              color: '#050505',
+              boxShadow: '12px 12px 0px #000',
+              transform: 'rotate(-1deg)',
+            }}
+          >
+            CREATE STORY
+          </a>
+
+          {/* Secondary Info Box */}
+          <div
+            className="p-4 border-l-8"
+            style={{
+              backgroundColor: '#050505',
+              borderColor: '#8B0000',
+            }}
+          >
+            <p className="font-subheading text-xl font-black uppercase tracking-[0.4em]" style={{ color: '#8B0000' }}>
+              TRANSMISSION_INITIATED
+            </p>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}
diff --git a/components/home/feature-pillar-card.tsx b/components/home/feature-pillar-card.tsx
new file mode 100644
index 00000000..e908f99b
--- /dev/null
+++ b/components/home/feature-pillar-card.tsx
@@ -0,0 +1,50 @@
+import React from 'react';
+import { cn } from '@/lib/utils';
+
+interface FeaturePillarCardProps {
+  title: string;
+  description: string;
+  icon: React.ReactNode;
+  backgroundColor: string;
+  darkModeBackgroundColor?: string;
+  index?: number;
+}
+
+/**
+ * FeaturePillarCard
+ * Individual feature pillar card component with icon, title, and description
+ * Used in the FeaturePillars section to showcase AI Generation, NFT Ownership, and Community features
+ */
+export function FeaturePillarCard({
+  title,
+  description,
+  icon,
+  backgroundColor,
+  darkModeBackgroundColor = 'dark:bg-slate-800/50',
+  index = 0,
+}: FeaturePillarCardProps) {
+  return (
+    <div
+      className={cn(
+        backgroundColor,
+        darkModeBackgroundColor,
+        'border-4 border-foreground p-8 shadow-[12px_12px_0px_0px_var(--shadow-color)] transition-all duration-300 hover:shadow-[16px_16px_0px_0px_var(--shadow-color)] hover:scale-105 hover:-translate-y-1'
+      )}
+    >
+      {/* Icon Box */}
+      <div className="bg-card border-4 border-foreground w-20 h-20 flex items-center justify-center mb-6 shadow-[4px_4px_0px_0px_var(--shadow-color)]">
+        {icon}
+      </div>
+
+      {/* Title */}
+      <h3 className="text-3xl font-black uppercase mb-4 text-foreground">
+        {title}
+      </h3>
+
+      {/* Description */}
+      <p className="text-xl font-bold border-l-4 border-foreground pl-4 bg-card/50 py-2 text-foreground">
+        {description}
+      </p>
+    </div>
+  );
+}
diff --git a/components/home/feature-pillars.tsx b/components/home/feature-pillars.tsx
new file mode 100644
index 00000000..9f23c216
--- /dev/null
+++ b/components/home/feature-pillars.tsx
@@ -0,0 +1,35 @@
+'use client';
+
+import { FeaturePillarCard } from './feature-pillar-card';
+
+export function FeaturePillars() {
+  const features = [
+    {
+      title: 'AI Generation',
+      description: 'Powered by Groq for lightning-fast story creation.',
+    },
+    {
+      title: 'NFT Ownership',
+      description: 'Your stories are truly yours on the blockchain.',
+    },
+    {
+      title: 'Community',
+      description: 'Read, share, and trade with other creators.',
+    },
+  ];
+
+  return (
+    <div className="grid grid-cols-1 gap-6">
+      {features.map((feature, index) => (
+        <FeaturePillarCard
+          key={index}
+          title={feature.title}
+          description={feature.description}
+          icon={null}
+          backgroundColor="bg-card"
+          darkModeBackgroundColor="dark:bg-slate-800/50"
+        />
+      ))}
+    </div>
+  );
+}
diff --git a/components/home/hero-section.tsx b/components/home/hero-section.tsx
new file mode 100644
index 00000000..90a4071c
--- /dev/null
+++ b/components/home/hero-section.tsx
@@ -0,0 +1,215 @@
+'use client';
+
+import { FeaturePillars } from './feature-pillars';
+
+interface HeroSectionProps {
+  connectWallet?: () => Promise<void>;
+  isConnected?: boolean;
+}
+
+export function HeroSection({
+  connectWallet,
+  isConnected = false,
+}: HeroSectionProps) {
+  return (
+    <>
+      {/* HERO SECTION - Panel 1 */}
+      <section
+        className="relative min-h-screen w-full flex items-center justify-center overflow-hidden border-b-[12px]"
+        style={{
+          backgroundColor: '#050505',
+          borderColor: '#050505',
+          clipPath: 'polygon(0 0, 100% 1%, 100% 99%, 0 100%)',
+        }}
+      >
+        {/* Background Image with Filters */}
+        <div className="absolute inset-0 z-0">
+          <img
+            alt="Noir Action Hero"
+            src="https://lh3.googleusercontent.com/aida-public/AB6AXuBzHu79NVYgya5Cj8BACNCEvQU1WzneTRWADEYopkZtri6Df2onMzvLLhPRwhswLUGSfwLJocrlpjEgN0K_4fYns1eFJT1du1QBr7pJuM3N3CmaY6w-q-ACgCqIwV5xZrgPgoIBkhvldOntQdwEF6_ycFRWfor09_XNcxh2ZZiK7PX8_z2e1PI0E4TvDz4AiJU1YbcUjHyT4WTcYR8vtjm85TjaRt-2T6sdM71unJAvSKNXabOATDjHsz0W6rwF7pqT0uWF67u2US4"
+            className="w-full h-full object-cover"
+            style={{
+              filter: 'grayscale(1) brightness(0.3) contrast(1.5) sepia(0.2)',
+            }}
+          />
+          {/* Noir Overlay Gradient - Right side red gradient */}
+          <div
+            className="absolute inset-0"
+            style={{
+              background:
+                'linear-gradient(90deg, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.7) 50%, rgba(139,0,0,0.3) 100%)',
+            }}
+          />
+          {/* Halftone Pattern Overlay */}
+          <div
+            className="absolute inset-0"
+            style={{
+              backgroundImage:
+                'radial-gradient(circle, #000 0.5px, transparent 0.5px)',
+              backgroundSize: '4px 4px',
+              opacity: 0.25,
+            }}
+          />
+        </div>
+
+        {/* Content */}
+        <div className="relative z-10 w-full px-6 py-32 text-center flex flex-col items-center justify-center">
+          {/* Subtitle */}
+          <p className="font-subheading text-primary text-xl mb-6 font-black tracking-widest uppercase">
+            The Future of Storytelling
+          </p>
+
+          {/* Main Headline - Explicit sizes for code.html exact match */}
+          <h1
+            className="text-[4rem] md:text-[7rem] lg:text-[10rem] leading-[0.9] mb-8 font-display text-white uppercase"
+            style={{
+              filter: 'drop-shadow(10px 10px 0px #050505)',
+              WebkitTextStroke: '1px rgba(255,255,255,0.1)',
+              transform: 'rotate(-2deg)',
+              lineHeight: '0.9',
+            }}
+          >
+            <span style={{ color: '#8B0000' }}>CREATE</span>
+            <br />
+            MINT &amp; SHARE
+          </h1>
+
+          {/* Supporting Copy */}
+          <div className="mb-16">
+            <p className="text-lg md:text-xl font-subheading leading-relaxed text-white uppercase font-bold border-l-4 border-primary pl-6 py-4 relative z-10"
+              style={{
+                backgroundColor: 'rgba(0, 0, 0, 0.6)',
+                borderColor: '#8B0000',
+              }}
+            >
+              Unleash your imagination with AI. Turn your stories into valuable
+              NFTs on the Monad blockchain.
+            </p>
+          </div>
+
+          {/* CTA Buttons */}
+          <div className="flex flex-col md:flex-row gap-6 mt-12 justify-center items-center">
+            <a
+              href="/create/ai-story"
+              className="font-display text-lg md:text-xl px-12 py-4 uppercase font-bold cursor-pointer transition-all"
+              style={{
+                backgroundColor: '#8B0000',
+                color: '#E5E5E5',
+                border: 'none',
+                boxShadow: '6px 6px 0px #000',
+              }}
+              onMouseEnter={(e) => {
+                e.currentTarget.style.backgroundColor = '#660000';
+                e.currentTarget.style.boxShadow = '8px 8px 0px #000';
+              }}
+              onMouseLeave={(e) => {
+                e.currentTarget.style.backgroundColor = '#8B0000';
+                e.currentTarget.style.boxShadow = '6px 6px 0px #000';
+              }}
+            >
+              CREATE STORY
+            </a>
+            <button
+              onClick={connectWallet}
+              disabled={!connectWallet}
+              className="font-display text-lg md:text-xl px-12 py-4 uppercase font-bold cursor-pointer transition-all disabled:opacity-50 disabled:cursor-not-allowed"
+              style={{
+                backgroundColor: '#E5E5E5',
+                color: '#050505',
+                border: 'none',
+                boxShadow: '6px 6px 0px #000',
+              }}
+              onMouseEnter={(e) => {
+                if (!connectWallet) return;
+                (e.currentTarget as HTMLButtonElement).style.backgroundColor = '#cccccc';
+                (e.currentTarget as HTMLButtonElement).style.boxShadow = '8px 8px 0px #000';
+              }}
+              onMouseLeave={(e) => {
+                if (!connectWallet) return;
+                (e.currentTarget as HTMLButtonElement).style.backgroundColor = '#E5E5E5';
+                (e.currentTarget as HTMLButtonElement).style.boxShadow = '6px 6px 0px #000';
+              }}
+            >
+              CONNECT WALLET
+            </button>
+          </div>
+        </div>
+      </section>
+
+      {/* BOOM SECTION - Panel 2 */}
+      <section
+        className="relative min-h-screen w-full flex items-center justify-center overflow-hidden border-b-[12px]"
+        style={{
+          backgroundColor: '#0a0a0a',
+          borderColor: '#050505',
+          clipPath: 'polygon(0 1%, 100% 0, 100% 100%, 0 99%)',
+          marginTop: '-3vh',
+        }}
+      >
+        {/* Background Image with Filters */}
+        <div className="absolute inset-0 z-0">
+          <img
+            alt="Gritty Urban Landscape"
+            src="https://lh3.googleusercontent.com/aida-public/AB6AXuBzHu79NVYgya5Cj8BACNCEvQU1WzneTRWADEYopkZtri6Df2onMzvLLhPRwhswLUGSfwLJocrlpjEgN0K_4fYns1eFJT1du1QBr7pJuM3N3CmaY6w-q-ACgCqIwV5xZrgPgoIBkhvldOntQdwEF6_ycFRWfor09_XNcxh2ZZiK7PX8_z2e1PI0E4TvDz4AiJU1YbcUjHyT4WTcYR8vtjm85TjaRt-2T6sdM71unJAvSKNXabOATDjHsz0W6rwF7pqT0uWF67u2US4"
+            className="w-full h-full object-cover"
+            style={{
+              filter: 'grayscale(1) brightness(0.3) contrast(1.5) sepia(0.2)',
+            }}
+          />
+          <div
+            className="absolute inset-0"
+            style={{
+              background:
+                'linear-gradient(135deg, rgba(0,0,0,0.95) 0%, rgba(139,0,0,0.3) 100%)',
+            }}
+          />
+          {/* Halftone Pattern */}
+          <div
+            className="absolute inset-0"
+            style={{
+              backgroundImage:
+                'radial-gradient(circle, #000 0.5px, transparent 0.5px)',
+              backgroundSize: '4px 4px',
+              opacity: 0.2,
+            }}
+          />
+        </div>
+
+        {/* Content */}
+        <div className="relative z-10 w-full px-6 py-32">
+          <div className="flex flex-col md:flex-row items-center gap-12">
+            {/* LEFT - BOOM Block */}
+            <div className="md:w-1/2">
+              <h2
+                className="text-[8rem] md:text-[9rem] lg:text-[10rem] leading-none font-display text-primary uppercase"
+                style={{
+                  color: '#8B0000',
+                  filter: 'drop-shadow(5px 5px 0px #E5E5E5)',
+                  transform: 'rotate(-3deg)',
+                }}
+              >
+                BOOM!
+              </h2>
+              <h3 className="text-4xl md:text-5xl text-white font-impact mt-4 tracking-widest uppercase">
+                AI POWERED
+              </h3>
+              <p className="text-2xl md:text-3xl font-subheading uppercase mt-8 text-white p-4 inline-block font-black"
+                style={{
+                  backgroundColor: '#8B0000',
+                  boxShadow: '4px 4px 0px #000',
+                }}
+              >
+                Generate stories in seconds!
+              </p>
+            </div>
+
+            {/* RIGHT - Feature Cards */}
+            <div className="md:w-1/2 grid grid-cols-1 gap-6">
+              <FeaturePillars />
+            </div>
+          </div>
+        </div>
+      </section>
+    </>
+  );
+}
diff --git a/components/home/index.ts b/components/home/index.ts
new file mode 100644
index 00000000..56c4f0de
--- /dev/null
+++ b/components/home/index.ts
@@ -0,0 +1,10 @@
+// Barrel exports for home page components
+
+// Primary homepage sections
+export { HeroSection } from './hero-section';
+export { TrendingSection } from './trending-section';
+export { CTASection } from './cta-section';
+
+// Sub-components (used within HeroSection)
+export { FeaturePillars } from './feature-pillars';
+export { FeaturePillarCard } from './feature-pillar-card';
diff --git a/components/home/trending-section.tsx b/components/home/trending-section.tsx
new file mode 100644
index 00000000..4a4e72ec
--- /dev/null
+++ b/components/home/trending-section.tsx
@@ -0,0 +1,185 @@
+// Component: TrendingSection
+// Purpose: Trending stories section with grid of story cards
+// Based on: code.html TRENDING STORIES panel section
+
+'use client';
+
+import Link from 'next/link';
+
+export function TrendingSection() {
+  const stories = [
+    {
+      id: 1,
+      title: 'The Last Memory Collector',
+      genre: 'SCIENCE FICTION',
+      author: 'Emily Johnson',
+      views: 180,
+      favorites: 1687,
+      tokens: 55,
+    },
+    {
+      id: 2,
+      title: 'Whispers of the Ancient Forest',
+      genre: 'SCIENCE FICTION',
+      author: 'Michael Chen',
+      views: 420,
+      favorites: 5261,
+      tokens: 26,
+    },
+    {
+      id: 3,
+      title: 'Neon Dreams in the Digital Age',
+      genre: 'HORROR',
+      author: 'Sarah Williams',
+      views: 510,
+      favorites: 4298,
+      tokens: 21,
+    },
+  ];
+
+  return (
+    <section
+      className="relative min-h-screen w-full flex items-center justify-center overflow-hidden border-b-[12px] border-pulp-black"
+      style={{
+        backgroundColor: '#050505',
+        clipPath: 'polygon(0 0, 100% 1%, 100% 99%, 0 100%)',
+      }}
+    >
+      {/* Background Image with Overlays */}
+      <div className="absolute inset-0 z-0">
+        <img
+          alt="Shadowy Character Portrait"
+          src="https://lh3.googleusercontent.com/aida-public/AB6AXuBzHu79NVYgya5Cj8BACNCEvQU1WzneTRWADEYopkZtri6Df2onMzvLLhPRwhswLUGSfwLJocrlpjEgN0K_4fYns1eFJT1du1QBr7pJuM3N3CmaY6w-q-ACgCqIwV5xZrgPgoIBkhvldOntQdwEF6_ycFRWfor09_XNcxh2ZZiK7PX8_z2e1PI0E4TvDz4AiJU1YbcUjHyT4WTcYR8vtjm85TjaRt-2T6sdM71unJAvSKNXabOATDjHsz0W6rwF7pqT0uWF67u2US4"
+          className="w-full h-full object-cover"
+          style={{
+            filter: 'grayscale(1) brightness(0.3) contrast(1.5) sepia(0.2)',
+          }}
+        />
+        {/* Noir Overlay */}
+        <div
+          className="absolute inset-0"
+          style={{
+            background:
+              'linear-gradient(135deg, rgba(0,0,0,0.95) 0%, rgba(139,0,0,0.2) 100%)',
+          }}
+        />
+        {/* Halftone Pattern */}
+        <div
+          className="absolute inset-0"
+          style={{
+            backgroundImage:
+              'radial-gradient(circle, #000 0.5px, transparent 0.5px)',
+            backgroundSize: '4px 4px',
+            opacity: 0.2,
+          }}
+        />
+      </div>
+
+      <div className="relative z-10 w-full max-w-7xl mx-auto px-6 py-24">
+        {/* Section Header */}
+        <div className="flex flex-col md:flex-row justify-between items-start md:items-end mb-16 border-b-4 border-primary pb-6">
+          <div>
+            <h2 className="text-4xl md:text-6xl lg:text-7xl text-white font-display uppercase mb-2">
+              TRENDING STORIES
+            </h2>
+            <p className="font-subheading font-bold text-xl text-primary uppercase tracking-wider">
+              Discover the most popular stories on GroqTales
+            </p>
+          </div>
+          <Link href="/nft-gallery" className="font-display text-3xl text-primary hover:text-white uppercase">
+            VIEW ALL
+          </Link>
+        </div>
+
+        {/* Story Grid */}
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10">
+          {stories.map((story) => (
+            <div
+              key={story.id}
+              className="overflow-hidden border-r-8 border-b-8 border-pulp-black"
+              style={{
+                backgroundColor: '#050505',
+                boxShadow: '4px 4px 0px #8B0000',
+              }}
+            >
+              {/* Image Container */}
+              <div className="h-80 bg-pulp-black relative group">
+                <img
+                  alt={story.title}
+                  src="https://lh3.googleusercontent.com/aida-public/AB6AXuBzHu79NVYgya5Cj8BACNCEvQU1WzneTRWADEYopkZtri6Df2onMzvLLhPRwhswLUGSfwLJocrlpjEgN0K_4fYns1eFJT1du1QBr7pJuM3N3CmaY6w-q-ACgCqIwV5xZrgPgoIBkhvldOntQdwEF6_ycFRWfor09_XNcxh2ZZiK7PX8_z2e1PI0E4TvDz4AiJU1YbcUjHyT4WTcYR8vtjm85TjaRt-2T6sdM71unJAvSKNXabOATDjHsz0W6rwF7pqT0uWF67u2US4"
+                  className="w-full h-full object-cover"
+                  style={{
+                    filter: 'grayscale(1) brightness(0.6) contrast(1.3)',
+                  }}
+                />
+                {/* Genre Tag */}
+                <div
+                  className="absolute top-0 left-0 text-white px-4 py-1 font-subheading font-black text-sm uppercase"
+                  style={{
+                    backgroundColor: '#8B0000',
+                  }}
+                >
+                  {story.genre}
+                </div>
+                {/* Title Overlay */}
+                <div className="absolute bottom-0 left-0 w-full p-6 bg-gradient-to-t from-black to-transparent">
+                  <h3 className="text-3xl text-white font-display leading-tight uppercase">
+                    {story.title}
+                  </h3>
+                </div>
+              </div>
+
+              {/* Card Content */}
+              <div
+                className="p-6"
+                style={{
+                  backgroundColor: '#E5E5E5',
+                }}
+              >
+                {/* Author Info */}
+                <div className="flex items-center gap-3 mb-4">
+                  <div
+                    className="w-10 h-10 border-2"
+                    style={{
+                      borderColor: '#8B0000',
+                      backgroundColor: '#050505',
+                    }}
+                  >
+                    <div className="w-full h-full" style={{ backgroundColor: '#8B0000', opacity: 0.5 }} />
+                  </div>
+                  <span className="font-subheading font-black text-lg uppercase text-pulp-black">
+                    {story.author}
+                  </span>
+                </div>
+
+                {/* Stats */}
+                <div
+                  className="flex justify-between font-subheading font-bold text-sm border-y-2 py-3 mb-4 text-pulp-black"
+                  style={{
+                    borderColor: 'rgba(0,0,0,0.1)',
+                  }}
+                >
+                  <span>Views: {story.views}</span>
+                  <span>Likes: {story.favorites}</span>
+                  <span>NFTs: {story.tokens}</span>
+                </div>
+
+                {/* View NFT Button */}
+                <Link
+                  href="/nft-gallery"
+                  className="block text-center py-3 font-display text-2xl uppercase cursor-pointer transition-all hover:opacity-80"
+                  style={{
+                    backgroundColor: '#050505',
+                    color: '#ffffff',
+                  }}
+                >
+                  VIEW NFT
+                </Link>
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}
diff --git a/components/user-nav.tsx b/components/user-nav.tsx
index 5332c8c2..5eb0da9a 100644
--- a/components/user-nav.tsx
+++ b/components/user-nav.tsx
@@ -62,10 +62,10 @@ export function UserNav() {
         variant="default"
         size="sm"
         onClick={handleConnect}
-        aria-label="Connect wallet to login"
+        aria-label="Connect wallet"
         className="flex items-center gap-2 px-3 sm:px-6 py-1.5 sm:py-2 rounded-none bg-white hover:text-white hover:border-white/50 text-black border-2 sm:border-4 border-black shadow-[2px_2px_0px_0px_rgba(0,0,0,1)] sm:shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] hover:shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] sm:hover:shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] hover:-translate-y-0.5 transition-all duration-200 font-black uppercase tracking-wider text-xs sm:text-sm"
       >
-        Login
+        CONNECT WALLET
       </Button>
     );
   }
diff --git a/package-lock.json b/package-lock.json
index f73bd9de..8a5ef70d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -89,6 +89,7 @@
         "siwe": "^2.1.4",
         "sonner": "^1.4.41",
         "swagger-jsdoc": "^6.2.8",
+        "swagger-ui-express": "^5.0.1",
         "tailwind-merge": "^2.6.0",
         "tailwindcss-animate": "^1.0.7",
         "uploadthing": "^7.4.4",
@@ -299,6 +300,7 @@
       "resolved": "https://registry.npmjs.org/preact/-/preact-10.24.3.tgz",
       "integrity": "sha512-Z2dPnBnMUfyQfSQ+GBdsGa16hz35YmLmtTLhM169uW944hYL6xzTYkJjC07j+Wosz733pMWx0fgON3JNw1jJQA==",
       "license": "MIT",
+      "peer": true,
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/preact"
@@ -344,6 +346,7 @@
       "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.5",
@@ -836,6 +839,7 @@
       "resolved": "https://registry.npmjs.org/@base-org/account/-/account-2.4.0.tgz",
       "integrity": "sha512-A4Umpi8B9/pqR78D1Yoze4xHyQaujioVRqqO3d6xuDFw9VRtjg6tK3bPlwE0aW+nVH/ntllCpPa2PbI8Rnjcug==",
       "license": "Apache-2.0",
+      "peer": true,
       "dependencies": {
         "@coinbase/cdp-sdk": "^1.0.0",
         "@noble/hashes": "1.4.0",
@@ -1128,6 +1132,7 @@
       "resolved": "https://registry.npmjs.org/@wagmi/core/-/core-2.22.1.tgz",
       "integrity": "sha512-cG/xwQWsBEcKgRTkQVhH29cbpbs/TdcUJVFXCyri3ZknxhMyGv0YEjTcrNpRgt2SaswL1KrvslSNYKKo+5YEAg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "eventemitter3": "5.0.1",
         "mipd": "0.0.7",
@@ -2184,6 +2189,7 @@
       "resolved": "https://registry.npmjs.org/@farcaster/miniapp-sdk/-/miniapp-sdk-0.2.1.tgz",
       "integrity": "sha512-2SnDeOtDdlN1lGQt7UyH2jkrZRQDOkmhcrlzNWazYChyPh9XfV8+9fMS+Lr/E2pEws9Q40Xl9POrCzdpUC19lg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@farcaster/miniapp-core": "0.4.1",
         "@farcaster/quick-auth": "^0.0.6",
@@ -2288,6 +2294,7 @@
       "resolved": "https://registry.npmjs.org/@gemini-wallet/core/-/core-0.3.2.tgz",
       "integrity": "sha512-Z4aHi3ECFf5oWYWM3F1rW83GJfB9OvhBYPTmb5q+VyK3uvzvS48lwo+jwh2eOoCRWEuT/crpb9Vwp2QaS5JqgQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@metamask/rpc-errors": "7.0.2",
         "eventemitter3": "5.0.1"
@@ -3936,7 +3943,6 @@
       "integrity": "sha512-ZMp1V8ZFcPG5dIWnQLr3NSI1MiCU7UETdS/A0G8V/XWHvJv3ZsFqutJn1Y5RPmAPX6F3BiE397OqveU/9NCuIA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.5",
         "@jridgewell/trace-mapping": "^0.3.25"
@@ -4607,6 +4613,7 @@
       "version": "0.33.1",
       "resolved": "https://registry.npmjs.org/@metamask/sdk/-/sdk-0.33.1.tgz",
       "integrity": "sha512-1mcOQVGr9rSrVcbKPNVzbZ8eCl1K0FATsYH3WJ/MH4WcZDWGECWrXJPNMZoEAkLxWiMe8jOQBumg2pmcDa9zpQ==",
+      "peer": true,
       "dependencies": {
         "@babel/runtime": "^7.26.0",
         "@metamask/onboarding": "^1.0.1",
@@ -4672,6 +4679,7 @@
       "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-4.1.0.tgz",
       "integrity": "sha512-uKm5PU+MHTootlWEY+mZ4vvXoCn4fLQxT9dSc1sXVMSFkINTJVN8cAQROpwcKm8bJ/c7rgZVIBWzH5T78sNZZw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "node-fetch": "^2.7.0"
       }
@@ -5262,6 +5270,7 @@
       "resolved": "https://registry.npmjs.org/@noble/ciphers/-/ciphers-1.3.0.tgz",
       "integrity": "sha512-2I0gnIVPtfnMw9ee9h1dJG7tp81+8Ob3OJb3Mv37rx5L40/b0i7djjCVvGOVqc9AEIQyvyu1i6ypKdFw8R8gQw==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": "^14.21.3 || >=16"
       },
@@ -8713,6 +8722,7 @@
       "resolved": "https://registry.npmjs.org/@safe-global/safe-apps-provider/-/safe-apps-provider-0.18.6.tgz",
       "integrity": "sha512-4LhMmjPWlIO8TTDC2AwLk44XKXaK6hfBTWyljDm0HQ6TWlOEijVWNrt2s3OCVMSxlXAcEzYfqyu1daHZooTC2Q==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@safe-global/safe-apps-sdk": "^9.1.0",
         "events": "^3.3.0"
@@ -8723,6 +8733,7 @@
       "resolved": "https://registry.npmjs.org/@safe-global/safe-apps-sdk/-/safe-apps-sdk-9.1.0.tgz",
       "integrity": "sha512-N5p/ulfnnA2Pi2M3YeWjULeWbjo7ei22JwU/IXnhoHzKq3pYCN6ynL9mJBOlvDVv892EgLPCWCOwQk/uBT2v0Q==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@safe-global/safe-gateway-typescript-sdk": "^3.5.3",
         "viem": "^2.1.1"
@@ -8737,6 +8748,13 @@
         "node": ">=16"
       }
     },
+    "node_modules/@scarf/scarf": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/@scarf/scarf/-/scarf-1.4.0.tgz",
+      "integrity": "sha512-xxeapPiUXdZAE3che6f3xogoJPeZgig6omHEy1rIY5WVsB3H2BHNnZH+gHG6x91SCWyQCzWGsuL2Hh3ClO5/qQ==",
+      "hasInstallScript": true,
+      "license": "Apache-2.0"
+    },
     "node_modules/@scure/base": {
       "version": "1.2.6",
       "resolved": "https://registry.npmjs.org/@scure/base/-/base-1.2.6.tgz",
@@ -8778,6 +8796,7 @@
       "resolved": "https://registry.npmjs.org/@simplewebauthn/browser/-/browser-9.0.1.tgz",
       "integrity": "sha512-wD2WpbkaEP4170s13/HUxPcAV5y4ZXaKo1TfNklS5zDefPinIgXOpgz1kpEvobAsaLPa2KeH7AKKX/od1mrBJw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@simplewebauthn/types": "^9.0.1"
       }
@@ -9132,6 +9151,7 @@
       "resolved": "https://registry.npmjs.org/@solana/kit/-/kit-3.0.3.tgz",
       "integrity": "sha512-CEEhCDmkvztd1zbgADsEQhmj9GyWOOGeW1hZD+gtwbBSF5YN1uofS/pex5MIh/VIqKRj+A2UnYWI1V+9+q/lyQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@solana/accounts": "3.0.3",
         "@solana/addresses": "3.0.3",
@@ -9851,6 +9871,7 @@
       "resolved": "https://registry.npmjs.org/@solana/web3.js/-/web3.js-1.98.4.tgz",
       "integrity": "sha512-vv9lfnvjUsRiq//+j5pBdXig0IQdtzA0BRZ3bXEP4KaIyF1CcaydWqgyzQgfZMNIsWNWmG+AUHwPy4AHOD6gpw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/runtime": "^7.25.0",
         "@noble/curves": "^1.4.2",
@@ -10127,6 +10148,7 @@
       "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.90.10.tgz",
       "integrity": "sha512-EhZVFu9rl7GfRNuJLJ3Y7wtbTnENsvzp+YpcAV7kCYiXni1v8qZh++lpw4ch4rrwC0u/EZRnBHIehzCGzwXDSQ==",
       "license": "MIT",
+      "peer": true,
       "funding": {
         "type": "github",
         "url": "https://github.com/sponsors/tannerlinsley"
@@ -10137,6 +10159,7 @@
       "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.90.10.tgz",
       "integrity": "sha512-BKLss9Y8PQ9IUjPYQiv3/Zmlx92uxffUOX8ZZNoQlCIZBJPT5M+GOMQj7xislvVQ6l1BstBjcX0XB/aHfFYVNw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@tanstack/query-core": "5.90.10"
       },
@@ -10356,7 +10379,6 @@
       "integrity": "sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/eslint": "*",
         "@types/estree": "*"
@@ -10367,8 +10389,7 @@
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
       "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@types/graceful-fs": {
       "version": "4.1.9",
@@ -10466,6 +10487,7 @@
       "resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.25.tgz",
       "integrity": "sha512-ZsJzA5thDQMSQO788d7IocwwQbI8B5OPzmqNvpf3NY/+MHDAS759Wo0gd2WQeXYt5AAAQjzcrTVC6SKCuYgoCQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "undici-types": "~6.21.0"
       }
@@ -10487,6 +10509,7 @@
       "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.27.tgz",
       "integrity": "sha512-cisd7gxkzjBKU2GgdYrTdtQx1SORymWyaAFhaxQPK9bYO9ot3Y5OikQRvY0VYQtvwjeQnizCINJAenh/V7MK2w==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/prop-types": "*",
         "csstype": "^3.2.2"
@@ -10498,6 +10521,7 @@
       "integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "peerDependencies": {
         "@types/react": "^18.0.0"
       }
@@ -10625,6 +10649,7 @@
       "integrity": "sha512-tbsV1jPne5CkFQCgPBcDOt30ItF7aJoZL997JSF7MhGQqOeT3svWRYxiqlfA5RUdlHN6Fi+EI9bxqbdyAUZjYQ==",
       "dev": true,
       "license": "BSD-2-Clause",
+      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "6.21.0",
         "@typescript-eslint/types": "6.21.0",
@@ -12272,7 +12297,6 @@
       "integrity": "sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/helper-numbers": "1.13.2",
         "@webassemblyjs/helper-wasm-bytecode": "1.13.2"
@@ -12283,24 +12307,21 @@
       "resolved": "https://registry.npmjs.org/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.13.2.tgz",
       "integrity": "sha512-6oXyTOzbKxGH4steLbLNOu71Oj+C8Lg34n6CqRvqfS2O71BxY6ByfMDRhBytzknj9yGUPVJ1qIKhRlAwO1AovA==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-api-error": {
       "version": "1.13.2",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-api-error/-/helper-api-error-1.13.2.tgz",
       "integrity": "sha512-U56GMYxy4ZQCbDZd6JuvvNV/WFildOjsaWD3Tzzvmw/mas3cXzRJPMjP83JqEsgSbyrmaGjBfDtV7KDXV9UzFQ==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-buffer": {
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.14.1.tgz",
       "integrity": "sha512-jyH7wtcHiKssDtFPRB+iQdxlDf96m0E39yb0k5uJVhFGleZFoNw1c4aeIcVUPPbXUVJ94wwnMOAqUHyzoEPVMA==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-numbers": {
       "version": "1.13.2",
@@ -12308,7 +12329,6 @@
       "integrity": "sha512-FE8aCmS5Q6eQYcV3gI35O4J789wlQA+7JrqTTpJqn5emA4U2hvwJmvFRC0HODS+3Ye6WioDklgd6scJ3+PLnEA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/floating-point-hex-parser": "1.13.2",
         "@webassemblyjs/helper-api-error": "1.13.2",
@@ -12320,8 +12340,7 @@
       "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.13.2.tgz",
       "integrity": "sha512-3QbLKy93F0EAIXLh0ogEVR6rOubA9AoZ+WRYhNbFyuB70j3dRdwH9g+qXhLAO0kiYGlg3TxDV+I4rQTr/YNXkA==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-wasm-section": {
       "version": "1.14.1",
@@ -12329,7 +12348,6 @@
       "integrity": "sha512-ds5mXEqTJ6oxRoqjhWDU83OgzAYjwsCV8Lo/N+oRsNDmx/ZDpqalmrtgOMkHwxsG0iI//3BwWAErYRHtgn0dZw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-buffer": "1.14.1",
@@ -12343,7 +12361,6 @@
       "integrity": "sha512-4LtOzh58S/5lX4ITKxnAK2USuNEvpdVV9AlgGQb8rJDHaLeHciwG4zlGr0j/SNWlr7x3vO1lDEsuePvtcDNCkw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@xtuc/ieee754": "^1.2.0"
       }
@@ -12354,7 +12371,6 @@
       "integrity": "sha512-Lde1oNoIdzVzdkNEAWZ1dZ5orIbff80YPdHx20mrHwHrVNNTjNr8E3xz9BdpcGqRQbAEa+fkrCb+fRFTl/6sQw==",
       "dev": true,
       "license": "Apache-2.0",
-      "peer": true,
       "dependencies": {
         "@xtuc/long": "4.2.2"
       }
@@ -12364,8 +12380,7 @@
       "resolved": "https://registry.npmjs.org/@webassemblyjs/utf8/-/utf8-1.13.2.tgz",
       "integrity": "sha512-3NQWGjKTASY1xV5m7Hr0iPeXD9+RDobLll3T9d2AO+g3my8xy5peVyjSag4I50mR1bBSN/Ct12lo+R9tJk0NZQ==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/@webassemblyjs/wasm-edit": {
       "version": "1.14.1",
@@ -12373,7 +12388,6 @@
       "integrity": "sha512-RNJUIQH/J8iA/1NzlE4N7KtyZNHi3w7at7hDjvRNm5rcUXa00z1vRz3glZoULfJ5mpvYhLybmVcwcjGrC1pRrQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-buffer": "1.14.1",
@@ -12391,7 +12405,6 @@
       "integrity": "sha512-AmomSIjP8ZbfGQhumkNvgC33AY7qtMCXnN6bL2u2Js4gVCg8fp735aEiMSBbDR7UQIj90n4wKAFUSEd0QN2Ukg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-wasm-bytecode": "1.13.2",
@@ -12406,7 +12419,6 @@
       "integrity": "sha512-PTcKLUNvBqnY2U6E5bdOQcSM+oVP/PmrDY9NzowJjislEjwP/C4an2303MCVS2Mg9d3AJpIGdUFIQQWbPds0Sw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-buffer": "1.14.1",
@@ -12420,7 +12432,6 @@
       "integrity": "sha512-JLBl+KZ0R5qB7mCnud/yyX08jWFw5MsoalJ1pQ4EdFlgj9VdXKGuENGsiCIjegI1W7p91rUlcB/LB5yRJKNTcQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@webassemblyjs/helper-api-error": "1.13.2",
@@ -12436,7 +12447,6 @@
       "integrity": "sha512-kPSSXE6De1XOR820C90RIo2ogvZG+c3KiHzqUoO/F34Y2shGzesfqv7o57xrxovZJH/MetF5UjroJ/R/3isoiw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@webassemblyjs/ast": "1.14.1",
         "@xtuc/long": "4.2.2"
@@ -12447,16 +12457,14 @@
       "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
       "integrity": "sha512-DX8nKgqcGwsc0eJSqYt5lwP4DH5FlHnmuWWBRy7X0NcaGR0ZtuyeESgMwTYVEtxmsNGY+qit4QYT/MIYTOTPeA==",
       "dev": true,
-      "license": "BSD-3-Clause",
-      "peer": true
+      "license": "BSD-3-Clause"
     },
     "node_modules/@xtuc/long": {
       "version": "4.2.2",
       "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
       "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
       "dev": true,
-      "license": "Apache-2.0",
-      "peer": true
+      "license": "Apache-2.0"
     },
     "node_modules/@zerodev/ecdsa-validator": {
       "version": "5.4.9",
@@ -12505,6 +12513,7 @@
       "resolved": "https://registry.npmjs.org/@zerodev/sdk/-/sdk-5.5.6.tgz",
       "integrity": "sha512-4syvV0qXQORBO0l0RRUwXDvBK8kzXdvHJpH1L6UGagXqPajyMM4D6r/ybZjZMI6hiurEkgblz0S6IfGznBTiWw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "semver": "^7.6.0"
       },
@@ -12517,7 +12526,6 @@
       "resolved": "https://registry.npmjs.org/@zerodev/webauthn-key/-/webauthn-key-5.4.4.tgz",
       "integrity": "sha512-LgBwViiGdOD5K6mP+ko/mPD82Be3yQBb+fSQwsz6YB7cwbcRXmYPWgL2ozvhHmEuR+fkpHscazPDGoCm1pii4Q==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@noble/curves": "^1.3.0",
         "@simplewebauthn/browser": "^8.3.4",
@@ -12532,7 +12540,6 @@
       "resolved": "https://registry.npmjs.org/@simplewebauthn/browser/-/browser-8.3.7.tgz",
       "integrity": "sha512-ZtRf+pUEgOCvjrYsbMsJfiHOdKcrSZt2zrAnIIpfmA06r0FxBovFYq0rJ171soZbe13KmWzAoLKjSxVW7KxCdQ==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@simplewebauthn/typescript-types": "^8.3.4"
       }
@@ -12600,6 +12607,7 @@
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -12624,7 +12632,6 @@
       "integrity": "sha512-wKmbr/DDiIXzEOiWrTTUcDm24kQ2vGfZQvM2fwg2vXqR5uW6aapr7ObPtj1th32b9u90/Pf4AItvdTh42fBmVQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=10.13.0"
       },
@@ -12709,7 +12716,6 @@
       "integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "ajv": "^8.0.0"
       },
@@ -12728,7 +12734,6 @@
       "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "fast-uri": "^3.0.1",
@@ -12745,8 +12750,7 @@
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/alchemy-sdk": {
       "version": "3.6.5",
@@ -13197,6 +13201,7 @@
       "resolved": "https://registry.npmjs.org/axios/-/axios-1.13.2.tgz",
       "integrity": "sha512-VPk9ebNqPcy5lRGuSlKx752IlDatOjT9paPlm8A7yOuW2Fbvp4X3JznJtT4f0GzGLLiWE9W8onz51SqLYwzGaA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "follow-redirects": "^1.15.6",
         "form-data": "^4.0.4",
@@ -13675,6 +13680,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.9.0",
         "caniuse-lite": "^1.0.30001759",
@@ -13789,6 +13795,7 @@
       "integrity": "sha512-WDtdLmJvAuNNPzByAYpRo2rF1Mmradw6gvWsQKf63476DDXmomT9zUiGypLcG4ibIM67vhAj8jJRdbmEws2Aqw==",
       "hasInstallScript": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "node-gyp-build": "^4.3.0"
       },
@@ -14035,7 +14042,6 @@
       "integrity": "sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=6.0"
       }
@@ -15539,6 +15545,7 @@
       "resolved": "https://registry.npmjs.org/eciesjs/-/eciesjs-0.4.16.tgz",
       "integrity": "sha512-dS5cbA9rA2VR4Ybuvhg6jvdmp46ubLn3E+px8cG/35aEDNclrqoCjg6mt0HYZ/M+OoESS3jSkCrqk1kWAEhWAw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@ecies/ciphers": "^0.2.4",
         "@noble/ciphers": "^1.3.0",
@@ -15571,6 +15578,7 @@
       "resolved": "https://registry.npmjs.org/effect/-/effect-3.17.7.tgz",
       "integrity": "sha512-dpt0ONUn3zzAuul6k4nC/coTTw27AL5nhkORXgTi6NfMPzqWYa1M05oKmOMTxpVSTKepqXVcW9vIwkuaaqx9zA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@standard-schema/spec": "^1.0.0",
         "fast-check": "^3.23.1"
@@ -15620,7 +15628,8 @@
       "version": "8.6.0",
       "resolved": "https://registry.npmjs.org/embla-carousel/-/embla-carousel-8.6.0.tgz",
       "integrity": "sha512-SjWyZBHJPbqxHOzckOfo8lHisEaJWmwd23XppYFYVh10bU66/Pn5tkVkbkCMZVdbUE5eTCI2nD8OyIP4Z+uwkA==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/embla-carousel-react": {
       "version": "8.6.0",
@@ -15791,7 +15800,6 @@
       "integrity": "sha512-phv3E1Xl4tQOShqSte26C7Fl84EwUdZsyOuSSk9qtAGyyQs2s3jJzComh+Abf4g187lUUAvH+H26omrqia2aGg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "graceful-fs": "^4.2.4",
         "tapable": "^2.3.0"
@@ -15962,8 +15970,7 @@
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-2.0.0.tgz",
       "integrity": "sha512-5POEcUuZybH7IdmGsD8wlf0AI55wMecM9rVBTI/qEAy2c1kTOm3DjFYjrBdI2K3BaJjJYfYFeRtM0t9ssnRuxw==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/es-object-atoms": {
       "version": "1.1.1",
@@ -16146,6 +16153,7 @@
       "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
@@ -16264,6 +16272,7 @@
       "integrity": "sha512-iI1f+D2ViGn+uvv5HuHVUamg8ll4tN+JRHGc6IJi4TP9Kl976C57fzPXgseXNs8v0iA8aSJpHsTWjDb9QJamGQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "eslint-config-prettier": "bin/cli.js"
       },
@@ -16387,6 +16396,7 @@
       "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@rtsao/scc": "^1.1.0",
         "array-includes": "^3.1.9",
@@ -17050,6 +17060,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@adraffy/ens-normalize": "1.10.1",
         "@noble/curves": "1.2.0",
@@ -17157,7 +17168,8 @@
       "version": "6.4.9",
       "resolved": "https://registry.npmjs.org/eventemitter2/-/eventemitter2-6.4.9.tgz",
       "integrity": "sha512-JEPTiaOt9f04oa6NOkc4aH+nVp5I3wEjpHbIPqfgCdD5v5bUzy7xQqwcVO2aDQgOWhI28da57HksMrzK9HlRxg==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/eventemitter3": {
       "version": "5.0.1",
@@ -17237,6 +17249,7 @@
       "resolved": "https://registry.npmjs.org/express/-/express-5.1.0.tgz",
       "integrity": "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "accepts": "^2.0.0",
         "body-parser": "^2.2.0",
@@ -17469,8 +17482,7 @@
           "url": "https://opencollective.com/fastify"
         }
       ],
-      "license": "BSD-3-Clause",
-      "peer": true
+      "license": "BSD-3-Clause"
     },
     "node_modules/fastestsmallesttextencoderdecoder": {
       "version": "1.0.22",
@@ -18056,8 +18068,7 @@
       "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz",
       "integrity": "sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==",
       "dev": true,
-      "license": "BSD-2-Clause",
-      "peer": true
+      "license": "BSD-2-Clause"
     },
     "node_modules/globals": {
       "version": "13.24.0",
@@ -18156,6 +18167,7 @@
       "resolved": "https://registry.npmjs.org/graphql/-/graphql-16.12.0.tgz",
       "integrity": "sha512-DKKrynuQRne0PNpEbzuEdHlYOMksHSUI8Zc9Unei5gTsMNA2/vMpoMz/yKba50pejK56qj98qM0SjYxAKi13gQ==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": "^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0"
       }
@@ -18178,6 +18190,7 @@
       "resolved": "https://registry.npmjs.org/h3/-/h3-1.15.5.tgz",
       "integrity": "sha512-xEyq3rSl+dhGX2Lm0+eFQIAzlDN6Fs0EcC4f7BNUmzaRX/PTzeuM+Tr2lHB8FoXggsQIeXLj8EDVgs5ywxyxmg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "cookie-es": "^1.2.2",
         "crossws": "^0.3.5",
@@ -18553,7 +18566,8 @@
       "version": "6.2.2",
       "resolved": "https://registry.npmjs.org/idb-keyval/-/idb-keyval-6.2.2.tgz",
       "integrity": "sha512-yjD9nARJ/jb1g+CvD0tlhUHOrJ9Sy0P8T9MF3YaLlHnSRpwPfpTX0XIvpmw3gAJUmEu3FiICLBDPXVwyEvrleg==",
-      "license": "Apache-2.0"
+      "license": "Apache-2.0",
+      "peer": true
     },
     "node_modules/ieee754": {
       "version": "1.2.1",
@@ -22380,6 +22394,7 @@
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz",
       "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==",
       "license": "MIT",
+      "peer": true,
       "bin": {
         "jiti": "bin/jiti.js"
       }
@@ -23046,7 +23061,6 @@
       "integrity": "sha512-IWqP2SCPhyVFTBtRcgMHdzlf9ul25NwaFx4wCEH/KjAXuuHY4yNjvPXsBokp8jCB936PyWRaPKUNh8NvylLp2Q==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=6.11.5"
       },
@@ -23685,6 +23699,7 @@
       "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-6.21.0.tgz",
       "integrity": "sha512-URyb/VXMjJ4da46OeSXg+puO39XH9DeQpWCslifrRn9JWugy0D+DvvBvkm2WxmHe61O/H19JM66p1z7RHVkZ6A==",
       "license": "Apache-2.0",
+      "peer": true,
       "dependencies": {
         "@mongodb-js/saslprep": "^1.3.0",
         "bson": "^6.10.4",
@@ -24170,6 +24185,7 @@
       "resolved": "https://registry.npmjs.org/next/-/next-14.1.0.tgz",
       "integrity": "sha512-wlzrsbfeSU48YQBjZhDzOwhWhGsy+uQycR8bHAOt1LY1bn3zZEcDyHQOEoN3aWzQ8LHCAJ1nqrWCc9XF2+O45Q==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@next/env": "14.1.0",
         "@swc/helpers": "0.5.2",
@@ -24366,6 +24382,7 @@
       "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.7.0.tgz",
       "integrity": "sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "whatwg-url": "^5.0.0"
       },
@@ -25481,6 +25498,7 @@
       "resolved": "https://registry.npmjs.org/porto/-/porto-0.2.35.tgz",
       "integrity": "sha512-gu9FfjjvvYBgQXUHWTp6n3wkTxVtEcqFotM7i3GEZeoQbvLGbssAicCz6hFZ8+xggrJWwi/RLmbwNra50SMmUQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "hono": "^4.10.3",
         "idb-keyval": "^6.2.1",
@@ -25593,6 +25611,7 @@
       "resolved": "https://registry.npmjs.org/zod/-/zod-4.1.13.tgz",
       "integrity": "sha512-AvvthqfqrAhNH9dnfmrfKzX5upOdjUVJYFqNSlkmGf64gRaTzlPwz99IHYnVs28qYAybvAlBV+H7pn0saFY4Ig==",
       "license": "MIT",
+      "peer": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }
@@ -25654,6 +25673,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.11",
         "picocolors": "^1.1.1",
@@ -25891,6 +25911,7 @@
       "resolved": "https://registry.npmjs.org/preact/-/preact-10.28.2.tgz",
       "integrity": "sha512-lbteaWGzGHdlIuiJ0l2Jq454m6kcpI1zNje6d8MlGAFlYvP2GO4ibnat7P74Esfz4sPTdM6UxtTwh/d3pwM9JA==",
       "license": "MIT",
+      "peer": true,
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/preact"
@@ -25930,6 +25951,7 @@
       "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "prettier": "bin/prettier.cjs"
       },
@@ -26440,6 +26462,7 @@
       "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
       "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0"
       },
@@ -26483,6 +26506,7 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
       "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0",
         "scheduler": "^0.23.2"
@@ -26535,6 +26559,7 @@
       "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.66.1.tgz",
       "integrity": "sha512-2KnjpgG2Rhbi+CIiIBQQ9Df6sMGH5ExNyFl4Hw9qO7pIqMBR8Bvu9RQyjl3JM4vehzCh9soiNUM/xYMswb2EiA==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18.0.0"
       },
@@ -26763,6 +26788,7 @@
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
       "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "inherits": "^2.0.3",
         "string_decoder": "^1.1.1",
@@ -26911,7 +26937,6 @@
       "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -27360,7 +27385,6 @@
       "integrity": "sha512-eflK8wEtyOE6+hsaRVPxvUKYCpRgzLqDTb8krvAsRIwOGlHoSgYLgBXoubGgLd2fT41/OUYdb48v4k4WWHQurA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/json-schema": "^7.0.9",
         "ajv": "^8.9.0",
@@ -27399,7 +27423,6 @@
       "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3"
       },
@@ -27412,8 +27435,7 @@
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/scroll": {
       "version": "3.0.1",
@@ -27488,7 +27510,6 @@
       "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==",
       "dev": true,
       "license": "BSD-3-Clause",
-      "peer": true,
       "dependencies": {
         "randombytes": "^2.1.0"
       }
@@ -27802,6 +27823,7 @@
       "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-4.8.1.tgz",
       "integrity": "sha512-hJVXfu3E28NmzGk8o1sHhN3om52tRvwYeidbj7xKy2eIIse5IoKX3USlS6Tqt3BHAtflLIkCQBkzVrEEfWUyYQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@socket.io/component-emitter": "~3.1.0",
         "debug": "~4.3.2",
@@ -28596,6 +28618,30 @@
         "node": ">=10"
       }
     },
+    "node_modules/swagger-ui-dist": {
+      "version": "5.31.0",
+      "resolved": "https://registry.npmjs.org/swagger-ui-dist/-/swagger-ui-dist-5.31.0.tgz",
+      "integrity": "sha512-zSUTIck02fSga6rc0RZP3b7J7wgHXwLea8ZjgLA3Vgnb8QeOl3Wou2/j5QkzSGeoz6HusP/coYuJl33aQxQZpg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@scarf/scarf": "=1.4.0"
+      }
+    },
+    "node_modules/swagger-ui-express": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/swagger-ui-express/-/swagger-ui-express-5.0.1.tgz",
+      "integrity": "sha512-SrNU3RiBGTLLmFU8GIJdOdanJTl4TOmT27tt3bWWHppqYmAZ6IDuEuBvMU6nZq0zLEe6b/1rACXCgLZqO6ZfrA==",
+      "license": "MIT",
+      "dependencies": {
+        "swagger-ui-dist": ">=5.0.0"
+      },
+      "engines": {
+        "node": ">= v0.10.32"
+      },
+      "peerDependencies": {
+        "express": ">=4.0.0 || >=5.0.0-beta"
+      }
+    },
     "node_modules/symbol-tree": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
@@ -28634,6 +28680,7 @@
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.18.tgz",
       "integrity": "sha512-6A2rnmW5xZMdw11LYjhcI5846rt9pbLSabY5XPxo+XWdxwZaFEn47Go4NzFiHu9sNNmr/kXivP1vStfvMaK1GQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@alloc/quick-lru": "^5.2.0",
         "arg": "^5.0.2",
@@ -28694,7 +28741,6 @@
       "integrity": "sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=6"
       },
@@ -28709,7 +28755,6 @@
       "integrity": "sha512-jTwoImyr/QbOWFFso3YoU3ik0jBBDJ6JTOQiy/J2YxVJdZCc+5u7skhNwiOR3FQIygFqVUPHl7qbbxtjW2K3Qg==",
       "dev": true,
       "license": "BSD-2-Clause",
-      "peer": true,
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
         "acorn": "^8.15.0",
@@ -28729,7 +28774,6 @@
       "integrity": "sha512-h9oBFCWrq78NyWWVcSwZarJkZ01c2AyGrzs1crmHZO3QUg9D61Wu4NPjBy69n7JqylFF5y+CsUZYmYEIZ3mR+Q==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@jridgewell/trace-mapping": "^0.3.25",
         "jest-worker": "^27.4.5",
@@ -28765,7 +28809,6 @@
       "integrity": "sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/node": "*",
         "merge-stream": "^2.0.0",
@@ -28780,8 +28823,7 @@
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
       "dev": true,
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/terser/node_modules/source-map-support": {
       "version": "0.5.21",
@@ -28789,7 +28831,6 @@
       "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "buffer-from": "^1.0.0",
         "source-map": "^0.6.0"
@@ -28957,6 +28998,7 @@
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -29180,6 +29222,7 @@
       "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@cspotcode/source-map-support": "^0.8.0",
         "@tsconfig/node10": "^1.0.7",
@@ -29437,6 +29480,7 @@
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
       "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
       "license": "Apache-2.0",
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -29593,6 +29637,7 @@
       "resolved": "https://registry.npmjs.org/undici/-/undici-5.29.0.tgz",
       "integrity": "sha512-raqeBD6NQK4SkWhQzeYKd1KmIG6dllBOTt55Rmkt4HtI9mwdWtJljnrXjAFUBLTSN67HWrOIZ3EPF4kjUw80Bg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@fastify/busboy": "^2.0.0"
       },
@@ -29832,6 +29877,7 @@
       "resolved": "https://registry.npmjs.org/uploadthing/-/uploadthing-7.7.4.tgz",
       "integrity": "sha512-rlK/4JWHW5jP30syzWGBFDDXv3WJDdT8gn9OoxRJmXLoXi94hBmyyjxihGlNrKhBc81czyv8TkzMioe/OuKGfA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@effect/platform": "0.90.3",
         "@standard-schema/spec": "1.0.0-beta.4",
@@ -29961,6 +30007,7 @@
       "integrity": "sha512-Z6czzLq4u8fPOyx7TU6X3dvUZVvoJmxSQ+IcrlmagKhilxlhZgxPK6C5Jqbkw1IDUmFTM+cz9QDnnLTwDz/2gQ==",
       "hasInstallScript": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "node-gyp-build": "^4.3.0"
       },
@@ -30133,6 +30180,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@noble/curves": "1.9.1",
         "@noble/hashes": "1.8.0",
@@ -30402,6 +30450,7 @@
       "resolved": "https://registry.npmjs.org/@wagmi/core/-/core-2.22.1.tgz",
       "integrity": "sha512-cG/xwQWsBEcKgRTkQVhH29cbpbs/TdcUJVFXCyri3ZknxhMyGv0YEjTcrNpRgt2SaswL1KrvslSNYKKo+5YEAg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "eventemitter3": "5.0.1",
         "mipd": "0.0.7",
@@ -30764,6 +30813,7 @@
       "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.4.0.tgz",
       "integrity": "sha512-9WXSPC5fMv61vaupRkCKCxsPxBocVnwakBEkMIHHpkTTg6icbJtg6jzgtLDm4bl3cSHAca52rYWih0k4K3PfHw==",
       "license": "MIT",
+      "peer": true,
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
       }
@@ -30784,7 +30834,6 @@
       "integrity": "sha512-Zn5uXdcFNIA1+1Ei5McRd+iRzfhENPCe7LeABkJtNulSxjma+l7ltNx55BWZkRlwRnpOgHqxnjyaDgJnNXnqzg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "glob-to-regexp": "^0.4.1",
         "graceful-fs": "^4.1.2"
@@ -30883,7 +30932,6 @@
       "integrity": "sha512-yd1RBzSGanHkitROoPFd6qsrxt+oFhg/129YzheDGqeustzX0vTZJZsSsQjVQC4yzBQ56K55XU8gaNCtIzOnTg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=10.13.0"
       }
@@ -30894,7 +30942,6 @@
       "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
       "dev": true,
       "license": "BSD-2-Clause",
-      "peer": true,
       "dependencies": {
         "esrecurse": "^4.3.0",
         "estraverse": "^4.1.1"
@@ -30909,7 +30956,6 @@
       "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
       "dev": true,
       "license": "BSD-2-Clause",
-      "peer": true,
       "engines": {
         "node": ">=4.0"
       }
@@ -30920,7 +30966,6 @@
       "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">= 0.6"
       }
@@ -30931,7 +30976,6 @@
       "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "mime-db": "1.52.0"
       },
@@ -31152,6 +31196,7 @@
       "resolved": "https://registry.npmjs.org/winston/-/winston-3.19.0.tgz",
       "integrity": "sha512-LZNJgPzfKR+/J3cHkxcpHKpKKvGfDZVPS4hfJCc4cCG0CgYzvlD6yE/S3CIL/Yt91ak327YCpiF/0MyeZHEHKA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@colors/colors": "^1.6.0",
         "@dabh/diagnostics": "^2.0.8",
@@ -31377,6 +31422,7 @@
       "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.3.tgz",
       "integrity": "sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=10.0.0"
       },
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 59674d1b..73179050 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -53,6 +53,12 @@ const config: Config = {
           DEFAULT: 'var(--card)',
           foreground: 'var(--card-foreground)',
         },
+        pulp: {
+          black: '#050505',
+          pure: '#E5E5E5',
+          dark: '#0a0a0a',
+          shadow: '#1a0000',
+        },
       },
       borderRadius: {
         lg: 'var(--radius)',
@@ -60,6 +66,10 @@ const config: Config = {
         sm: 'var(--radius)',
       },
       fontFamily: {
+        display: ['Permanent Marker', 'cursive'],
+        impact: ['Big Shoulders Display', 'sans-serif'],
+        subheading: ['Roboto Condensed', 'sans-serif'],
+        body: ['Source Sans 3', 'sans-serif'],
         comic: ['var(--font-comic)', 'cursive'],
       },
       boxShadow: {