feat: 세션, 세션 종료화면 생성

src/app/page.tsx

@@ -9,27 +9,20 @@ type Mode = "freeflow" | "sprint" | "deepwork";
 export default function HomePage() {
   const router = useRouter();
 
-  const startSession = useCallback(
-    (mode: Mode) => {
-      try {
-        localStorage.setItem("last_mode", mode);
-      } catch {}
-      router.push(`/session?mode=${mode}`);
-    },
+  const go = useCallback(
+    (mode: Mode) => router.push(`/session?mode=${mode}`),
     [router],
   );
 
   return (
     <main className="min-h-screen w-full bg-[#E9EEF6]">
-      {/* Top-left logo */}
       <header className="px-5 pt-6">
-        <div className="select-none text-lg font-bold tracking-tight leading-none text-slate-900">
+        <div className="select-none text-xl font-bold tracking-tight leading-none text-slate-800">
           hushroom
         </div>
       </header>
 
-      <section className="mx-auto flex min-h-[calc(100vh-56px)] max-w-lg flex-col justify-center px-5 pb-10">
-        {/* Section: Freeflow */}
+      <section className="mx-auto flex min-h-[calc(100vh-64px)] max-w-lg flex-col justify-center px-5 pb-10">
         <div className="mb-4">
           <div className="text-sm font-semibold text-slate-600">자유 세션</div>
           <div className="mt-1 text-base leading-relaxed text-slate-700">
@@ -39,15 +32,14 @@ export default function HomePage() {
 
         <button
           type="button"
-          onClick={() => startSession("freeflow")}
+          onClick={() => go("freeflow")}
           className="w-full rounded-3xl bg-[#2F6FED] px-8 py-6 text-left text-white shadow-sm transition active:scale-[0.99] hover:bg-[#295FD1]"
-          aria-label="프리플로우 세션"
+          aria-label="프리플로우"
         >
           <div className="text-2xl font-semibold">프리플로우</div>
           <div className="mt-2 text-lg opacity-90">무제한</div>
         </button>
 
-        {/* Divider + Section: Timed sessions */}
         <div className="my-8 flex items-center gap-3">
           <div className="h-px flex-1 bg-[#D7E0EE]" />
           <div className="text-sm font-semibold text-slate-600">
@@ -61,18 +53,8 @@ export default function HomePage() {
         </div>
 
         <div className="grid grid-cols-2 gap-4">
-          <ModeTile
-            title="스프린트"
-            meta="25분"
-            desc="짧게 한 번"
-            onClick={() => startSession("sprint")}
-          />
-          <ModeTile
-            title="딥워크"
-            meta="90분"
-            desc="길게 한 번"
-            onClick={() => startSession("deepwork")}
-          />
+          <ModeTile title="스프린트" meta="25분" onClick={() => go("sprint")} />
+          <ModeTile title="딥워크" meta="90분" onClick={() => go("deepwork")} />
         </div>
       </section>
     </main>
@@ -82,12 +64,10 @@ export default function HomePage() {
 function ModeTile({
   title,
   meta,
-  desc,
   onClick,
 }: {
   title: string;
   meta: string;
-  desc: string;
   onClick: () => void;
 }) {
   return (
@@ -101,7 +81,6 @@ function ModeTile({
         <div className="text-xl font-semibold text-slate-900">{title}</div>
         <div className="text-lg font-semibold text-blue-700">{meta}</div>
       </div>
-      <div className="mt-3 text-base text-slate-700">{desc}</div>
     </button>
   );
 }