feat: add 404 Not Found page with styled routing

frontend/src/App.jsx

@@ -5,6 +5,7 @@ import Signup from "./pages/Signup.jsx";
 import Dashboard from "./pages/Dashboard.jsx";
 import Transfer from "./pages/Transfer.jsx";
 import Transactions from "./pages/Transactions.jsx";
+import NotFound from "./pages/NotFound.jsx";
 
 function ProtectedRoute({ children }) {
   const token = localStorage.getItem("token");
@@ -33,15 +34,8 @@ export default function App() {
         <Route path="transfer" element={<Transfer />} />
         <Route path="transactions" element={<Transactions />} />
       </Route>
-      <Route
-        path="*"
-        element={
-          <Navigate
-            to={localStorage.getItem("token") ? "/dashboard" : "/login"}
-            replace
-          />
-        }
-      />
+
+      <Route path="*" element={<NotFound />} />
     </Routes>
   );
 }

frontend/src/pages/NotFound.jsx

@@ -0,0 +1,26 @@
+import { Home } from "lucide-react";
+import { Link } from "react-router-dom";
+
+export default function NotFound() {
+  return (
+    <div className="flex min-h-screen flex-col items-center justify-center bg-surface px-6 text-center">
+      <h1 className="text-6xl font-bold text-ink">404</h1>
+
+      <p className="mt-3 text-lg font-medium text-ink-muted">
+        Page not found
+      </p>
+
+      <p className="mt-1 text-sm text-ink-faint">
+        The page you are looking for doesn’t exist or has been moved.
+      </p>
+
+      <Link
+        to="/dashboard"
+        className="mt-6 inline-flex items-center gap-2 rounded-xl bg-lime px-5 py-3 text-sm font-bold text-black hover:opacity-90"
+      >
+        <Home className="h-4 w-4" />
+        Go to dashboard
+      </Link>
+    </div>
+  );
+}