import Link from "next/link";

import { Button } from "@/components/ui/button";

import { BrandMark } from "@/components/layout/BrandMark";

export default function NotFound() {

  return (

    <div className="grid min-h-[60dvh] place-items-center px-4">

      <div className="flex max-w-md flex-col items-center gap-4 text-center">

        <BrandMark size={40} />

        <div className="space-y-1">

          <h2 className="font-mono text-2xl font-semibold tracking-[var(--tracking-tight)]">404</h2>

          <p className="text-sm text-[var(--color-fg-tertiary)]">That page flew the coop.</p>

        </div>

        <Button asChild variant="secondary">

          <Link href="/">Back to dashboard</Link>

        </Button>

      </div>

    </div>

  );

}