From 8abb3899a66e688221945dfc97bd49d47563b9de Mon Sep 17 00:00:00 2001
From: Gabriel Kaszewski <gabrielkaszewski@gmail.com>
Date: Tue, 31 Mar 2026 02:31:30 +0200
Subject: [PATCH] feat: add Vista-style 404 page

---
 app/not-found.tsx             | 49 +++++++++++++++++++++++++++++++++++
 components/go-back-button.tsx | 15 +++++++++++
 2 files changed, 64 insertions(+)
 create mode 100644 app/not-found.tsx
 create mode 100644 components/go-back-button.tsx

diff --git a/app/not-found.tsx b/app/not-found.tsx
new file mode 100644
index 0000000..9ee4dbc
--- /dev/null
+++ b/app/not-found.tsx
@@ -0,0 +1,49 @@
+import Link from "next/link";
+import Window from "@/components/window";
+import GoBackButton from "@/components/go-back-button";
+
+export default function NotFound() {
+  return (
+    <div className="mx-auto max-w-md pt-16">
+      <Window title="Windows cannot find this page">
+        <div className="flex items-start gap-4 mb-6">
+          <div className="flex-shrink-0 flex h-10 w-10 items-center justify-center rounded-full bg-red-600 shadow-inner">
+            <svg
+              width="18"
+              height="18"
+              viewBox="0 0 18 18"
+              fill="none"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M3 3L15 15M3 15L15 3"
+                stroke="white"
+                strokeWidth="2.5"
+                strokeLinecap="round"
+              />
+            </svg>
+          </div>
+          <div>
+            <h2 className="font-bold text-gray-900 text-base mb-1">
+              404 — Not Found
+            </h2>
+            <p className="text-sm text-gray-600 leading-relaxed">
+              The page you're looking for doesn't exist. Check the address or
+              head back home.
+            </p>
+          </div>
+        </div>
+
+        <div className="border-t border-gray-200/60 pt-4 flex justify-end gap-2">
+          <GoBackButton />
+          <Link
+            href="/"
+            className="px-4 py-1.5 text-sm bg-gradient-to-b from-blue-100 to-blue-200 border border-blue-300 rounded hover:from-blue-200 hover:to-blue-300 transition-colors"
+          >
+            Home
+          </Link>
+        </div>
+      </Window>
+    </div>
+  );
+}
diff --git a/components/go-back-button.tsx b/components/go-back-button.tsx
new file mode 100644
index 0000000..224d7b1
--- /dev/null
+++ b/components/go-back-button.tsx
@@ -0,0 +1,15 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+
+export default function GoBackButton() {
+  const router = useRouter();
+  return (
+    <button
+      onClick={() => router.back()}
+      className="px-4 py-1.5 text-sm bg-gradient-to-b from-blue-100 to-blue-200 border border-blue-300 rounded hover:from-blue-200 hover:to-blue-300 transition-colors"
+    >
+      ← Go Back
+    </button>
+  );
+}