import Link from "next/link";

export default function PlayPage() {
  return (
    <main className="flex min-h-screen items-center bg-white px-6 py-12 text-slate-950">
      <section className="mx-auto flex w-full max-w-3xl flex-col gap-8">
        <div className="space-y-4">
          <p className="text-sm font-semibold text-emerald-700">
            괄호 음수 분배
          </p>
          <h1 className="text-4xl font-bold tracking-normal sm:text-5xl">
            문제 풀이
          </h1>
          <p className="max-w-2xl text-lg leading-8 text-slate-700">
            다음 단계에서 괄호 앞 음수 분배 문제가 이 화면에 표시됩니다.
          </p>
        </div>

        <div>
          <Link
            href="/"
            className="inline-flex h-11 items-center justify-center rounded-md border border-slate-300 px-5 text-base font-semibold text-slate-800 transition hover:bg-slate-100 focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:ring-offset-2"
          >
            처음으로
          </Link>
        </div>
      </section>
    </main>
  );
}