import Link from 'next/link';

export default function NotFound() {
  return (
    <div className="mx-4 my-24 flex flex-col items-center gap-4 text-center sm:mx-6">
      <span className="chip !border-ember !text-ember">404</span>
      <h1 className="text-3xl font-bold sm:text-4xl">This page hasn&apos;t loaded yet</h1>
      <p className="prose-content max-w-md">
        Either this game hasn&apos;t been discovered by our pipeline yet, or its page hasn&apos;t cleared
        our quality checks. Try the directory to find what&apos;s live right now.
      </p>
      <Link href="/games" className="btn-primary">
        Browse the Directory
      </Link>
    </div>
  );
}
