fix

app/not-found.tsx

@@ -0,0 +1,40 @@
+import { Metadata, Viewport } from "next";
+import Link from "next/link";
+import { buttonVariants } from "@/components/ui/button";
+import { ArrowLeft } from "lucide-react";
+
+export const metadata: Metadata = {
+  title: "Page Not Found | Ember Market",
+  description: "The page you're looking for doesn't exist or has been moved.",
+};
+
+export const viewport: Viewport = {
+  width: "device-width",
+  initialScale: 1,
+  themeColor: [
+    { media: "(prefers-color-scheme: dark)", color: "#000000" },
+    { media: "(prefers-color-scheme: light)", color: "#D53F8C" },
+  ],
+};
+
+export default function NotFound() {
+  return (
+    <div className="h-screen w-full flex flex-col items-center justify-center gap-6 bg-background text-foreground">
+      <div className="flex flex-col items-center gap-2">
+        <h1 className="text-5xl font-bold">404</h1>
+        <h2 className="text-2xl font-semibold">Page Not Found</h2>
+        <p className="text-muted-foreground text-center max-w-md">
+          The page you're looking for doesn't exist or has been moved.
+        </p>
+      </div>
+      
+      <Link 
+        href="/" 
+        className={buttonVariants({ variant: "default" })}
+      >
+        <ArrowLeft className="mr-2 h-4 w-4" />
+        Back to Home
+      </Link>
+    </div>
+  );
+}