leeunduck · leeunduck · Nov 10, 2025 · Nov 10, 2025 · Nov 10, 2025 · Nov 10, 2025
diff --git a/src/app/(auth)/layout.tsx b/src/app/(auth)/layout.tsx
@@ -1,11 +1,15 @@
 import { makePageMetadata } from "@/seo/metadata";
+import type { AuthLayoutProps } from "@/types/auth";
 
 export const metadata = makePageMetadata({
-  title: "PlanMate — 로그인/회원가입",
-  description: "PlanMate 계정으로 로그인하거나 회원가입하세요.",
-  canonical: "/login",
+  title: "MyPlanMate — 인증",
+  description: "MyPlanMate 계정으로 로그인하고, 새 계정을 만들고, 비밀번호를 재설정하세요.",
 });
 
-export default function AuthLayout({ children }: { children: React.ReactNode }) {
-  return <>{children}</>;
+export default function AuthLayout({ children }: AuthLayoutProps) {
+  return (
+    <div className="flex items-center justify-center min-h-screen bg-background">
+      <div className="flex flex-col gap-20 w-full max-w-[500px]">{children}</div>
+    </div>
+  );
 }
diff --git a/src/app/(auth)/login/page.tsx b/src/app/(auth)/login/page.tsx
@@ -2,13 +2,31 @@ import { makePageMetadata } from "@/seo/metadata";
 
 export const metadata = {
   ...makePageMetadata({
-    title: "로그인",
-    description: "PlanMate 로그인 페이지",
+    title: "MyPlanMate — 로그인",
+    description: "MyPlanMate 계정으로 로그인하고 오늘의 플랜을 시작하세요.",
     canonical: "/login",
   }),
-  robots: { index: false, follow: false }, // 인증 화면은 보통 검색 제외
+  robots: { index: false, follow: false },
 };
 
 export default function LoginPage() {
-  return <div>로그인 페이지</div>;
+  return (
+    <>
+      <header className="text-center">
+        {/* TODO: 나중에 AppLogo + LoginPageTitle + LoginSubtitle로 교체 */}
+        <p className="t-14-m text-[var(--color-gray-500)]">PlanMate</p>
+        <h1 className="mt-2 t-24-b text-[var(--color-gray-900)]">로그인</h1>
+        <p className="mt-1 t-14-m text-[var(--color-gray-600)]">오늘도 만나서 반가워요!</p>
+      </header>
+
+      <main>
+        {/* TODO: 나중에 LoginMain + AuthCard + LoginForm 구조로 확장 */}
+        <div className="rounded-2xl bg-[var(--color-white)] px-6 py-8 shadow-[var(--shadow-md)]">
+          <p className="t-14-m text-[var(--color-gray-600)]">
+            여기에는 로그인 폼이 들어갈 예정입니다.
+          </p>
+        </div>
+      </main>
+    </>
+  );
 }
diff --git a/src/app/(marketing)/layout.tsx b/src/app/(marketing)/layout.tsx
@@ -12,14 +12,10 @@ export const metadata = makePageMetadata({
 
 export default function MarketingLayout({ children }: { children: React.ReactNode }) {
   return (
-    <html lang="ko">
-      <body>
-        <LandingWrapper>
-          <LandingHeader />
-          <LandingMainSection className="flex-1">{children}</LandingMainSection>
-          <LandingFooter />
-        </LandingWrapper>
-      </body>
-    </html>
+    <LandingWrapper>
+      <LandingHeader />
+      <LandingMainSection className="flex-1">{children}</LandingMainSection>
+      <LandingFooter />
+    </LandingWrapper>
   );
 }
diff --git a/src/types/auth.ts b/src/types/auth.ts
@@ -0,0 +1,5 @@
+import type { ReactNode } from "react";
+
+export interface AuthLayoutProps {
+  children: ReactNode;
+}