From 47c7677871fe6bd295e482caa6e48f70d96f7bd2 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Sun, 28 Dec 2025 19:53:43 +0900
Subject: [PATCH 01/32] =?UTF-8?q?home=20=E3=82=92=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Home.tsx | 201 +++++++++++++++++++++-----------------
 1 file changed, 111 insertions(+), 90 deletions(-)

diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index 0430380..291619d 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -1,6 +1,6 @@
 import { hc } from "hono/client";
 import { useEffect, useState } from "react";
-import { HiOutlineCalendar, HiOutlinePlus, HiOutlineUser, HiOutlineUsers } from "react-icons/hi";
+import { LuArrowRight, LuCalendar, LuLayoutDashboard, LuPlus, LuUser, LuUsers } from "react-icons/lu";
 import { NavLink } from "react-router";
 import type { AppType } from "../../../server/src/main";
 import Header from "../components/Header";
@@ -62,20 +62,24 @@ export default function HomePage() {
 
   return (
     <>
-      <Header />
-      {loading ? (
-        <div className="flex min-h-[calc(100dvh_-_64px)] items-center justify-center bg-blue-50">
-          <div className="py-4">
-            <span className="loading loading-dots loading-md text-gray-400" />
+      <div className="min-h-screen bg-slate-50 font-sans text-slate-900">
+        <Header />
+        <main className="mx-auto max-w-7xl px-4 py-8 sm:px-6 lg:px-8">
+          <div className="mb-10 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
+            <div>
+              <h1 className="font-bold text-2xl text-slate-900 tracking-tight sm:text-3xl">ホーム</h1>
+              <p className="mt-1 text-slate-500 text-sm">参加・主催しているイベントの管理</p>
+            </div>
           </div>
-        </div>
-      ) : involvedProjects ? (
-        <ProjectDashboard involvedProjects={involvedProjects} />
-      ) : (
-        <div className="flex min-h-[calc(100dvh_-_64px)] items-center justify-center bg-blue-50">
-          <EmptyState />
-        </div>
-      )}
+          {loading ? (
+            <ProjectsSkeleton />
+          ) : involvedProjects && involvedProjects.length > 0 ? (
+            <ProjectDashboard involvedProjects={involvedProjects} />
+          ) : (
+            <EmptyState />
+          )}
+        </main>
+      </div>
       {toast && (
         <div className="toast toast-top toast-center z-50">
           <div className={`alert ${toast.variant === "success" ? "alert-success" : "alert-error"}`}>
@@ -96,111 +100,128 @@ function ProjectDashboard({ involvedProjects }: { involvedProjects: BriefProject
   });
 
   return (
-    <div className="min-h-[calc(100dvh_-_64px)] bg-blue-50">
-      <div className="container mx-auto px-4 py-8">
-        {/* Hero Section */}
-        <div className="mb-12 text-center">
-          <div className="mt-2 mb-6 flex items-center justify-center">
-            <img src="/logo.svg" alt="logo" width={48} className="mr-4" />
-            <h1 className="font-mplus text-4xl text-primary">イツヒマ</h1>
+    <div className="space-y-8">
+      <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+        <NavLink
+          to="/new"
+          className="group relative flex min-h-[200px] flex-col items-center justify-center rounded-2xl border-2 border-slate-200 border-dashed bg-white/50 p-6 text-center transition-all hover:border-primary/50 hover:bg-primary/5"
+        >
+          <div className="mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-slate-100 transition-colors group-hover:bg-primary/10">
+            <LuPlus className="h-6 w-6 text-slate-400 group-hover:text-primary" />
           </div>
-          <p className="mb-8 text-gray-600 text-xl">「いつヒマ？」で日程調整しよう</p>
-          <NavLink
-            to="/new"
-            className="btn btn-primary btn-lg hover:-translate-y-1 transform px-8 py-4 text-lg shadow-lg transition-all duration-300 hover:shadow-xl"
-          >
-            <HiOutlinePlus className="mr-2" size={20} />
-            新しいイベントを作成
-          </NavLink>
-        </div>
+          <h3 className="font-semibold text-slate-900">新規作成</h3>
+          <p className="mt-1 text-slate-500 text-sm">新しい日程調整を始める</p>
+        </NavLink>
 
-        {involvedProjects.length > 0 && (
-          <div className="space-y-8">
-            {/* All Projects */}
-            <section>
-              <h2 className="mb-6 flex items-center font-bold text-2xl text-gray-800">
-                <HiOutlineCalendar className="mr-3 text-gray-700" size={28} />
-                あなたのイベント
-              </h2>
-              <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
-                {sortedProjects.map((project) => (
-                  <ProjectCard key={project.id} project={project} />
-                ))}
-              </div>
-            </section>
-          </div>
-        )}
+        {sortedProjects.map((project) => (
+          <ProjectCard key={project.id} project={project} />
+        ))}
       </div>
     </div>
   );
 }
 
 function ProjectCard({ project }: { project: BriefProject }) {
+  const formatDate = (date: Date) => {
+    return date.toLocaleDateString("ja-JP", { month: "short", day: "numeric" });
+  };
+
   return (
     <NavLink
       to={`/e/${project.id}`}
-      className={`group hover:-translate-y-1 relative block transform overflow-hidden rounded-xl border-l-4 bg-white shadow-lg transition-all duration-300 hover:shadow-xl ${project.isHost ? "border-primary" : "border-secondary"} focus:outline-none focus:ring-4 focus:ring-primary/20`}
-      aria-label={`「${project.name}」の詳細を見る`}
+      className="group hover:-translate-y-1 relative flex flex-col justify-between overflow-hidden rounded-2xl border border-slate-200 bg-white p-6 shadow-sm transition-all duration-300 hover:shadow-slate-200/60 hover:shadow-xl"
     >
-      <div className="p-6">
-        <div className="mb-4">
-          <h3 className="mb-2 break-words font-semibold text-gray-800 text-xl">{project.name}</h3>
-          <span className={`badge badge-sm ${project.isHost ? "badge-primary" : "badge-secondary"}`}>
-            {project.isHost ? (
-              <>
-                <HiOutlineUser size={12} />
-                <span>主催者</span>
-              </>
-            ) : (
-              <>
-                <HiOutlineUsers size={12} />
-                <span>参加者</span>
-              </>
-            )}
-          </span>
+      <div>
+        <div className="mb-4 flex items-start justify-between gap-4">
+          <div className="flex flex-col gap-2">
+            <span
+              className={`inline-flex w-fit items-center gap-1.5 rounded-full px-2.5 py-0.5 font-medium text-xs ring-1 ring-inset ${
+                project.isHost
+                  ? "bg-primary/10 text-primary ring-primary/20"
+                  : "bg-emerald-50 text-emerald-700 ring-emerald-600/20"
+              }`}
+            >
+              {project.isHost ? (
+                <>
+                  <LuUser className="h-3 w-3" />
+                  主催
+                </>
+              ) : (
+                <>
+                  <LuUsers className="h-3 w-3" />
+                  参加
+                </>
+              )}
+            </span>
+            <h3 className="line-clamp-2 font-bold text-lg text-slate-900 leading-tight transition-colors group-hover:text-primary">
+              {project.name}
+            </h3>
+          </div>
         </div>
 
-        <div className="mb-4 flex items-center text-gray-600">
-          <HiOutlineCalendar className="mr-2" size={16} />
-          <span className="text-sm">
-            {formatDate(project.startDate.toLocaleDateString())} ～{formatDate(project.endDate.toLocaleDateString())}
-          </span>
+        <div className="mb-6 flex items-center gap-3 rounded-lg bg-slate-50 p-3 text-slate-600 text-sm">
+          <LuCalendar className="h-4 w-4 shrink-0 text-slate-400" />
+          <div className="flex items-center gap-2 font-medium">
+            <span>{formatDate(project.startDate)}</span>
+            <span className="text-slate-300">/</span>
+            <span>{formatDate(project.endDate)}</span>
+          </div>
         </div>
       </div>
 
-      <span
-        className={`absolute right-4 bottom-4 ${project.isHost ? "text-primary" : "text-secondary"} pointer-events-none text-2xl transition-transform group-hover:translate-x-1`}
-        aria-hidden="true"
-      >
-        &rsaquo;
-      </span>
+      <div className="mt-auto flex items-center justify-between border-slate-100 border-t pt-4">
+        <span className="font-medium text-slate-500 text-xs transition-colors group-hover:text-primary">
+          詳細を見る
+        </span>
+        <div className="flex h-8 w-8 items-center justify-center rounded-full bg-slate-50 text-slate-400 transition-all group-hover:bg-primary group-hover:text-white">
+          <LuArrowRight className="h-4 w-4" />
+        </div>
+      </div>
     </NavLink>
   );
 }
 
 function EmptyState() {
   return (
-    <div className="py-16 text-center">
-      <div className="mb-8">
-        <div className="mx-auto mb-6 flex h-32 w-32 items-center justify-center rounded-full bg-gray-100">
-          <HiOutlineCalendar className="text-gray-400" size={64} />
-        </div>
-        <h3 className="mb-3 font-semibold text-2xl text-gray-800">まだイベントがありません</h3>
-        <p className="mx-auto mb-8 max-w-md text-gray-600">イベントを作成して、日程調整を始めましょう</p>
+    <div className="flex min-h-[400px] flex-col items-center justify-center rounded-3xl border border-slate-300 border-dashed bg-slate-50/50 p-8 text-center">
+      <div className="mb-6 flex h-20 w-20 items-center justify-center rounded-full bg-white shadow-sm ring-1 ring-slate-200">
+        <LuLayoutDashboard className="h-10 w-10 text-slate-400" />
       </div>
+      <h3 className="mb-2 font-bold text-slate-900 text-xl">まだイベントがありません</h3>
+      <p className="mb-8 max-w-sm text-slate-500">「イベント作成」ボタンから、新しい日程調整を始めましょう。</p>
       <NavLink
         to="/new"
-        className="btn btn-primary btn-lg px-8 py-4 text-lg shadow-lg transition-all duration-300 hover:shadow-xl"
+        className="hover:-translate-y-0.5 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-8 py-3.5 font-semibold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl"
       >
-        <HiOutlinePlus className="mr-2" size={20} />
-        イベントを作成する
+        <LuPlus className="h-5 w-5" />
+        イベント作成
       </NavLink>
     </div>
   );
 }
 
-// ---------- Utility ----------
-const formatDate = (isoDate: string) => {
-  const date = new Date(isoDate);
-  return date.toLocaleDateString("ja-JP");
-};
+function ProjectsSkeleton() {
+  return (
+    <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+      {Array.from({ length: 6 }, (_, i) => (
+        <div
+          // biome-ignore lint/suspicious/noArrayIndexKey: skeleton is static
+          key={`skeleton-${i}`}
+          className="flex flex-col justify-between rounded-2xl border border-slate-200 bg-white p-6 shadow-sm"
+        >
+          <div className="space-y-4">
+            <div className="flex gap-2">
+              <div className="h-6 w-16 animate-pulse rounded-full bg-slate-100" />
+            </div>
+            <div className="h-7 w-3/4 animate-pulse rounded-md bg-slate-100" />
+            <div className="h-12 w-full animate-pulse rounded-lg bg-slate-50" />
+          </div>
+          <div className="mt-6 flex items-center justify-between border-slate-100 border-t pt-4">
+            <div className="h-4 w-20 animate-pulse rounded bg-slate-100" />
+            <div className="h-8 w-8 animate-pulse rounded-full bg-slate-100" />
+          </div>
+        </div>
+      ))}
+    </div>
+  );
+}

From 8896bfc2ab5d1c5fd732e678116aae27575bfcc1 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Sun, 28 Dec 2025 20:04:42 +0900
Subject: [PATCH 02/32] =?UTF-8?q?home=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Home.tsx | 180 ++++++++++++++++++--------------------
 1 file changed, 83 insertions(+), 97 deletions(-)

diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index 291619d..335e180 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -1,6 +1,6 @@
 import { hc } from "hono/client";
 import { useEffect, useState } from "react";
-import { LuArrowRight, LuCalendar, LuLayoutDashboard, LuPlus, LuUser, LuUsers } from "react-icons/lu";
+import { LuCalendar, LuChevronRight, LuLayoutDashboard, LuPlus, LuUser, LuUsers } from "react-icons/lu";
 import { NavLink } from "react-router";
 import type { AppType } from "../../../server/src/main";
 import Header from "../components/Header";
@@ -64,12 +64,19 @@ export default function HomePage() {
     <>
       <div className="min-h-screen bg-slate-50 font-sans text-slate-900">
         <Header />
-        <main className="mx-auto max-w-7xl px-4 py-8 sm:px-6 lg:px-8">
-          <div className="mb-10 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
+        <main className="mx-auto max-w-4xl px-4 py-8 sm:px-6 lg:px-8">
+          <div className="mb-8 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
             <div>
               <h1 className="font-bold text-2xl text-slate-900 tracking-tight sm:text-3xl">ホーム</h1>
               <p className="mt-1 text-slate-500 text-sm">参加・主催しているイベントの管理</p>
             </div>
+            <NavLink
+              to="/new"
+              className="inline-flex items-center justify-center gap-2 rounded-lg bg-primary px-4 py-2.5 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md"
+            >
+              <LuPlus className="h-4 w-4" />
+              新規作成
+            </NavLink>
           </div>
           {loading ? (
             <ProjectsSkeleton />
@@ -92,36 +99,51 @@ export default function HomePage() {
 }
 
 function ProjectDashboard({ involvedProjects }: { involvedProjects: BriefProject[] }) {
-  const sortedProjects = [...involvedProjects].sort((a, b) => {
-    if (a.isHost !== b.isHost) {
-      return a.isHost ? -1 : 1;
-    }
-    return new Date(b.startDate).getTime() - new Date(a.startDate).getTime();
-  });
+  const hostedProjects = involvedProjects
+    .filter((p) => p.isHost)
+    .sort((a, b) => new Date(b.startDate).getTime() - new Date(a.startDate).getTime());
+
+  const participatingProjects = involvedProjects
+    .filter((p) => !p.isHost)
+    .sort((a, b) => new Date(b.startDate).getTime() - new Date(a.startDate).getTime());
 
   return (
     <div className="space-y-8">
-      <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
-        <NavLink
-          to="/new"
-          className="group relative flex min-h-[200px] flex-col items-center justify-center rounded-2xl border-2 border-slate-200 border-dashed bg-white/50 p-6 text-center transition-all hover:border-primary/50 hover:bg-primary/5"
-        >
-          <div className="mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-slate-100 transition-colors group-hover:bg-primary/10">
-            <LuPlus className="h-6 w-6 text-slate-400 group-hover:text-primary" />
-          </div>
-          <h3 className="font-semibold text-slate-900">新規作成</h3>
-          <p className="mt-1 text-slate-500 text-sm">新しい日程調整を始める</p>
-        </NavLink>
+      {hostedProjects.length > 0 && (
+        <ProjectSection title="主催しているイベント" icon={<LuUser className="h-5 w-5" />} projects={hostedProjects} />
+      )}
+
+      {participatingProjects.length > 0 && (
+        <ProjectSection
+          title="参加しているイベント"
+          icon={<LuUsers className="h-5 w-5" />}
+          projects={participatingProjects}
+        />
+      )}
+    </div>
+  );
+}
 
-        {sortedProjects.map((project) => (
-          <ProjectCard key={project.id} project={project} />
+function ProjectSection({ title, icon, projects }: { title: string; icon: React.ReactNode; projects: BriefProject[] }) {
+  return (
+    <section>
+      <div className="mb-4 flex items-center gap-2 text-slate-700">
+        {icon}
+        <h2 className="font-semibold text-lg">{title}</h2>
+        <span className="ml-1 rounded-full bg-slate-200 px-2 py-0.5 font-medium text-slate-600 text-xs">
+          {projects.length}
+        </span>
+      </div>
+      <div className="overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm">
+        {projects.map((project, index) => (
+          <ProjectRow key={project.id} project={project} isLast={index === projects.length - 1} />
         ))}
       </div>
-    </div>
+    </section>
   );
 }
 
-function ProjectCard({ project }: { project: BriefProject }) {
+function ProjectRow({ project, isLast }: { project: BriefProject; isLast: boolean }) {
   const formatDate = (date: Date) => {
     return date.toLocaleDateString("ja-JP", { month: "short", day: "numeric" });
   };
@@ -129,96 +151,60 @@ function ProjectCard({ project }: { project: BriefProject }) {
   return (
     <NavLink
       to={`/e/${project.id}`}
-      className="group hover:-translate-y-1 relative flex flex-col justify-between overflow-hidden rounded-2xl border border-slate-200 bg-white p-6 shadow-sm transition-all duration-300 hover:shadow-slate-200/60 hover:shadow-xl"
+      className={`group flex items-center justify-between gap-4 px-4 py-4 transition-colors hover:bg-slate-50 ${
+        !isLast ? "border-slate-100 border-b" : ""
+      }`}
     >
-      <div>
-        <div className="mb-4 flex items-start justify-between gap-4">
-          <div className="flex flex-col gap-2">
-            <span
-              className={`inline-flex w-fit items-center gap-1.5 rounded-full px-2.5 py-0.5 font-medium text-xs ring-1 ring-inset ${
-                project.isHost
-                  ? "bg-primary/10 text-primary ring-primary/20"
-                  : "bg-emerald-50 text-emerald-700 ring-emerald-600/20"
-              }`}
-            >
-              {project.isHost ? (
-                <>
-                  <LuUser className="h-3 w-3" />
-                  主催
-                </>
-              ) : (
-                <>
-                  <LuUsers className="h-3 w-3" />
-                  参加
-                </>
-              )}
-            </span>
-            <h3 className="line-clamp-2 font-bold text-lg text-slate-900 leading-tight transition-colors group-hover:text-primary">
-              {project.name}
-            </h3>
-          </div>
-        </div>
-
-        <div className="mb-6 flex items-center gap-3 rounded-lg bg-slate-50 p-3 text-slate-600 text-sm">
-          <LuCalendar className="h-4 w-4 shrink-0 text-slate-400" />
-          <div className="flex items-center gap-2 font-medium">
-            <span>{formatDate(project.startDate)}</span>
-            <span className="text-slate-300">/</span>
-            <span>{formatDate(project.endDate)}</span>
-          </div>
-        </div>
-      </div>
-
-      <div className="mt-auto flex items-center justify-between border-slate-100 border-t pt-4">
-        <span className="font-medium text-slate-500 text-xs transition-colors group-hover:text-primary">
-          詳細を見る
-        </span>
-        <div className="flex h-8 w-8 items-center justify-center rounded-full bg-slate-50 text-slate-400 transition-all group-hover:bg-primary group-hover:text-white">
-          <LuArrowRight className="h-4 w-4" />
+      <div className="min-w-0 flex-1">
+        <h3 className="truncate font-medium text-slate-900 transition-colors group-hover:text-primary">
+          {project.name}
+        </h3>
+        <div className="mt-1 flex items-center gap-1.5 text-slate-500 text-sm">
+          <LuCalendar className="h-3.5 w-3.5 shrink-0" />
+          <span>
+            {formatDate(project.startDate)} 〜 {formatDate(project.endDate)}
+          </span>
         </div>
       </div>
+      <LuChevronRight className="h-5 w-5 shrink-0 text-slate-400 transition-colors group-hover:text-primary" />
     </NavLink>
   );
 }
 
 function EmptyState() {
   return (
-    <div className="flex min-h-[400px] flex-col items-center justify-center rounded-3xl border border-slate-300 border-dashed bg-slate-50/50 p-8 text-center">
-      <div className="mb-6 flex h-20 w-20 items-center justify-center rounded-full bg-white shadow-sm ring-1 ring-slate-200">
-        <LuLayoutDashboard className="h-10 w-10 text-slate-400" />
+    <div className="flex min-h-[400px] flex-col items-center justify-center rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
+      <div className="mb-6 flex h-16 w-16 items-center justify-center rounded-full bg-slate-100">
+        <LuLayoutDashboard className="h-8 w-8 text-slate-400" />
       </div>
-      <h3 className="mb-2 font-bold text-slate-900 text-xl">まだイベントがありません</h3>
-      <p className="mb-8 max-w-sm text-slate-500">「イベント作成」ボタンから、新しい日程調整を始めましょう。</p>
-      <NavLink
-        to="/new"
-        className="hover:-translate-y-0.5 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-8 py-3.5 font-semibold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl"
-      >
-        <LuPlus className="h-5 w-5" />
-        イベント作成
-      </NavLink>
+      <h3 className="mb-2 font-semibold text-lg text-slate-900">まだイベントがありません</h3>
+      <p className="max-w-sm text-slate-500 text-sm">右上の「新規作成」ボタンから、新しい日程調整を始めましょう。</p>
     </div>
   );
 }
 
 function ProjectsSkeleton() {
   return (
-    <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
-      {Array.from({ length: 6 }, (_, i) => (
-        <div
-          // biome-ignore lint/suspicious/noArrayIndexKey: skeleton is static
-          key={`skeleton-${i}`}
-          className="flex flex-col justify-between rounded-2xl border border-slate-200 bg-white p-6 shadow-sm"
-        >
-          <div className="space-y-4">
-            <div className="flex gap-2">
-              <div className="h-6 w-16 animate-pulse rounded-full bg-slate-100" />
-            </div>
-            <div className="h-7 w-3/4 animate-pulse rounded-md bg-slate-100" />
-            <div className="h-12 w-full animate-pulse rounded-lg bg-slate-50" />
+    <div className="space-y-8">
+      {[1, 2].map((section) => (
+        <div key={`section-${section}`}>
+          <div className="mb-4 flex items-center gap-2">
+            <div className="h-5 w-5 animate-pulse rounded bg-slate-200" />
+            <div className="h-5 w-40 animate-pulse rounded bg-slate-200" />
           </div>
-          <div className="mt-6 flex items-center justify-between border-slate-100 border-t pt-4">
-            <div className="h-4 w-20 animate-pulse rounded bg-slate-100" />
-            <div className="h-8 w-8 animate-pulse rounded-full bg-slate-100" />
+          <div className="overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm">
+            {[1, 2, 3].map((row, index) => (
+              <div
+                key={`row-${section}-${row}`}
+                className={`flex items-center justify-between gap-4 px-4 py-4 ${index < 2 ? "border-slate-100 border-b" : ""}`}
+              >
+                <div className="min-w-0 flex-1 space-y-2">
+                  <div className="h-5 w-3/4 animate-pulse rounded bg-slate-100" />
+                  <div className="h-4 w-32 animate-pulse rounded bg-slate-100" />
+                </div>
+                <div className="h-5 w-5 animate-pulse rounded bg-slate-100" />
+              </div>
+            ))}
           </div>
         </div>
       ))}

From 2ab1327ba59e584d102c67022349e0b984388e19 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Mon, 29 Dec 2025 00:23:11 +0900
Subject: [PATCH 03/32] =?UTF-8?q?project=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx | 574 ++++++++++++++++++++---------------
 1 file changed, 327 insertions(+), 247 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index b7230a4..a42263d 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -23,6 +23,8 @@ import { API_ENDPOINT, FRONTEND_ORIGIN } from "../utils";
 
 const client = hc<AppType>(API_ENDPOINT);
 
+const GUIDE_URL = "https://utcode.notion.site/1e4ca5f557bc80f2b697ca7b9342dc89?pvs=4";
+
 export default function ProjectPage() {
   const { eventId } = useParams();
   const navigate = useNavigate();
@@ -271,122 +273,156 @@ export default function ProjectPage() {
 
   return (
     <>
-      <div className="flex h-full w-full flex-col">
+      <div className="min-h-screen bg-slate-50 font-sans text-slate-900">
         <Header />
         {loading ? (
-          <div className="flex flex-1 items-center justify-center">
-            <span className="loading loading-dots loading-md text-gray-400" />
+          <div className="flex min-h-[60vh] items-center justify-center">
+            <span className="loading loading-dots loading-md text-slate-400" />
           </div>
         ) : eventId !== undefined && !project ? (
-          <div className="flex flex-col items-center justify-center gap-4 py-4">
-            <p className="text-gray-600 text-xl">イベントが見つかりませんでした。</p>
-            <NavLink to={"/"} className="link">
-              ホームに戻る
-            </NavLink>
+          <div className="mx-auto max-w-4xl px-4 py-16 sm:px-6 lg:px-8">
+            <div className="flex min-h-[400px] flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
+              <p className="text-base text-slate-600 sm:text-xl">イベントが見つかりませんでした。</p>
+              <NavLink
+                to="/"
+                className="inline-flex items-center justify-center gap-2 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md sm:px-6 sm:py-2.5"
+              >
+                ホームに戻る
+              </NavLink>
+            </div>
           </div>
         ) : (
-          <div className="container mx-auto p-4">
-            <h1 className="mb-2 font-bold text-2xl text-gray-800">
-              {project ? `${project.name} の編集` : "イベントの作成"}
-            </h1>
-            <form onSubmit={handleSubmit(onSubmit)} className="space-y-4 pb-18">
-              <div>
-                <label className="text-gray-400 text-sm" htmlFor="input-name">
-                  イベント名
-                </label>
-                <input
-                  {...register("name")}
-                  id="input-name"
-                  className={`input w-full text-base ${errors.name ? "input-error border-red-500" : ""}`}
-                  placeholder="イベント名"
-                  onBlur={() => trigger("name")}
-                />
-                {errors.name && <p className="mt-1 text-red-500 text-sm">{errors.name.message}</p>}
-              </div>
-              <div>
-                <label className="text-gray-400 text-sm" htmlFor="input-description">
-                  イベントの説明（任意）
-                </label>
-                <textarea
-                  {...register("description")}
-                  id="input-description"
-                  className={`textarea w-full text-base ${errors.description ? "textarea-error border-red-500" : ""}`}
-                  placeholder="イベントの詳細や注意事項などを入力"
-                  rows={3}
-                />
-                {errors.description && <p className="mt-1 text-red-500 text-sm">{errors.description.message}</p>}
-              </div>
-              <div className="collapse-arrow collapse mb-4 border border-blue-200 bg-blue-50">
-                <input type="checkbox" checked={isInfoExpanded} onChange={(e) => setIsInfoExpanded(e.target.checked)} />
-                <div className="collapse-title flex items-center gap-2 font-medium text-primary text-sm">
-                  <HiInformationCircle className="h-5 w-5" />
-                  開始日・終了日／時間帯について
-                </div>
-                <div className="collapse-content text-primary text-sm">
-                  <p>
-                    イツヒマでは、<strong>主催者側で候補日程を設定せずに</strong>日程調整します。
-                    <br />
-                    ここでは、参加者の日程を知りたい日付の範囲と時間帯の範囲を設定してください。
-                    <br />
-                    詳しくは、
-                    <a
-                      href="https://utcode.notion.site/1e4ca5f557bc80f2b697ca7b9342dc89?pvs=4"
-                      target="_blank"
-                      rel="noreferrer noopener"
-                      className="link"
-                    >
-                      使い方ページ
-                    </a>
-                    をご覧ください。
-                  </p>
+          <main className="mx-auto max-w-4xl px-4 py-8 pb-24 sm:px-6 lg:px-8">
+            <div className="mb-6">
+              <h1 className="font-bold text-slate-900 text-xl tracking-tight sm:text-2xl">
+                {project ? `${project.name} の編集` : "イベントの作成"}
+              </h1>
+              <p className="mt-1.5 text-slate-500 text-sm">
+                {project ? "イベントの詳細を編集できます" : "新しい日程調整イベントを作成しましょう"}
+              </p>
+            </div>
+
+            <form id="project-form" onSubmit={handleSubmit(onSubmit)} className="space-y-6">
+              {/* 基本情報 */}
+              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+                <h2 className="mb-4 font-semibold text-base text-slate-900 sm:text-lg">基本情報</h2>
+                <div className="space-y-4">
+                  <div>
+                    <label className="mb-2 block font-medium text-slate-700 text-sm" htmlFor="input-name">
+                      イベント名 <span className="text-red-500">*</span>
+                    </label>
+                    <input
+                      {...register("name")}
+                      id="input-name"
+                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.name ? "border-red-500" : "border-slate-300"}`}
+                      placeholder="例: 3月度 同期飲み会"
+                      onBlur={() => trigger("name")}
+                    />
+                    {errors.name && <p className="mt-1.5 text-red-600 text-sm">{errors.name.message}</p>}
+                  </div>
+                  <div>
+                    <label className="mb-2 block font-medium text-slate-700 text-sm" htmlFor="input-description">
+                      イベントの説明（任意）
+                    </label>
+                    <textarea
+                      {...register("description")}
+                      id="input-description"
+                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.description ? "border-red-500" : "border-slate-300"}`}
+                      placeholder="イベントの詳細や注意事項などを入力"
+                      rows={3}
+                    />
+                    {errors.description && <p className="mt-1.5 text-red-600 text-sm">{errors.description.message}</p>}
+                  </div>
                 </div>
               </div>
-              <div className="flex gap-2">
-                <div
-                  className={project && project.guests.length > 0 ? "tooltip tooltip-top flex-1" : "flex-1"}
-                  data-tip={
-                    project && project.guests.length > 0
-                      ? "すでに日程を登録したユーザーがいるため、開始日の編集はできません"
-                      : ""
-                  }
-                >
-                  <label htmlFor="input-start" className="text-gray-400 text-sm">
-                    開始日
-                  </label>
-                  <input
-                    type="date"
-                    {...register("startDate")}
-                    id="input-start"
-                    className={`input w-full text-base ${errors.startDate ? "input-error border-red-500" : ""} ${project && project.guests.length > 0 ? "cursor-not-allowed opacity-60" : ""}`}
-                    onFocus={handleFieldFocus}
-                    disabled={!!(project && project.guests.length > 0)}
-                  />
-                  {errors.startDate && <p className="mt-1 text-red-500 text-sm">{errors.startDate.message}</p>}
-                </div>
-                <div
-                  className={project && project.guests.length > 0 ? "tooltip tooltip-top flex-1" : "flex-1"}
-                  data-tip={
-                    project && project.guests.length > 0
-                      ? "すでに日程を登録したユーザーがいるため、終了日の編集はできません"
-                      : ""
-                  }
+
+              {/* 情報ボックス */}
+              <div className="rounded-2xl border border-blue-200 bg-blue-50/50 p-5 text-primary shadow-sm">
+                <button
+                  type="button"
+                  className="flex w-full items-center justify-between text-left"
+                  onClick={() => setIsInfoExpanded(!isInfoExpanded)}
                 >
-                  <label htmlFor="input-end" className="text-gray-400 text-sm">
-                    終了日
-                  </label>
-                  <input
-                    type="date"
-                    {...register("endDate")}
-                    id="input-end"
-                    className={`input w-full text-base ${errors.endDate ? "input-error border-red-500" : ""} ${project && project.guests.length > 0 ? "cursor-not-allowed opacity-60" : ""}`}
-                    onFocus={handleFieldFocus}
-                    disabled={!!(project && project.guests.length > 0)}
-                  />
-                  {errors.endDate && <p className="mt-1 text-red-500 text-sm">{errors.endDate.message}</p>}
+                  <div className="flex items-center gap-2 font-medium text-sm">
+                    <HiInformationCircle className="h-5 w-5" />
+                    開始日・終了日／時間帯について
+                  </div>
+                  <span className={`transition-transform ${isInfoExpanded ? "rotate-180" : ""}`}>▼</span>
+                </button>
+                {isInfoExpanded && (
+                  <div className="mt-3 border-blue-200 border-t pt-3 text-sm">
+                    <p>
+                      イツヒマでは、<strong>主催者側で候補日程を設定せずに</strong>日程調整します。
+                      <br />
+                      ここでは、参加者の日程を知りたい日付の範囲と時間帯の範囲を設定してください。
+                      <br />
+                      詳しくは、
+                      <a
+                        href={GUIDE_URL}
+                        target="_blank"
+                        rel="noreferrer noopener"
+                        className="font-medium text-primary underline hover:text-primary/80"
+                      >
+                        使い方ページ
+                      </a>
+                      をご覧ください。
+                    </p>
+                  </div>
+                )}
+              </div>
+
+              {/* 日程の範囲 */}
+              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+                <h2 className="mb-4 font-semibold text-base text-slate-900 sm:text-lg">日程の範囲</h2>
+                <div className="grid gap-4 sm:grid-cols-2">
+                  <div
+                    className={project && project.guests.length > 0 ? "tooltip tooltip-top" : ""}
+                    data-tip={
+                      project && project.guests.length > 0
+                        ? "すでに日程を登録したユーザーがいるため、開始日の編集はできません"
+                        : ""
+                    }
+                  >
+                    <label htmlFor="input-start" className="mb-2 block font-medium text-slate-700 text-sm">
+                      開始日 <span className="text-red-500">*</span>
+                    </label>
+                    <input
+                      type="date"
+                      {...register("startDate")}
+                      id="input-start"
+                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.startDate ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                      onFocus={handleFieldFocus}
+                      disabled={!!(project && project.guests.length > 0)}
+                    />
+                    {errors.startDate && <p className="mt-1.5 text-red-600 text-sm">{errors.startDate.message}</p>}
+                  </div>
+                  <div
+                    className={project && project.guests.length > 0 ? "tooltip tooltip-top" : ""}
+                    data-tip={
+                      project && project.guests.length > 0
+                        ? "すでに日程を登録したユーザーがいるため、終了日の編集はできません"
+                        : ""
+                    }
+                  >
+                    <label htmlFor="input-end" className="mb-2 block font-medium text-slate-700 text-sm">
+                      終了日 <span className="text-red-500">*</span>
+                    </label>
+                    <input
+                      type="date"
+                      {...register("endDate")}
+                      id="input-end"
+                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.endDate ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                      onFocus={handleFieldFocus}
+                      disabled={!!(project && project.guests.length > 0)}
+                    />
+                    {errors.endDate && <p className="mt-1.5 text-red-600 text-sm">{errors.endDate.message}</p>}
+                  </div>
                 </div>
               </div>
-              <fieldset>
-                <legend className="text-gray-400 text-sm">時間帯</legend>
+
+              {/* 時間帯 */}
+              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+                <h2 className="mb-4 font-semibold text-base text-slate-900 sm:text-lg">時間帯</h2>
                 <div
                   className={project && project.guests.length > 0 ? "tooltip tooltip-top w-full" : "w-full"}
                   data-tip={
@@ -395,10 +431,10 @@ export default function ProjectPage() {
                       : ""
                   }
                 >
-                  <div className="flex items-center gap-2">
-                    <div className="flex flex-1 gap-1">
+                  <div className="flex items-center gap-2 sm:gap-3">
+                    <div className="flex flex-1 items-center gap-1.5 sm:gap-2">
                       <select
-                        className={`input flex-1 text-base ${errors.allowedRanges ? "input-error border-red-500" : ""} ${project && project.guests.length > 0 ? "cursor-not-allowed opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].startTime.split(":")[0]}
                         onChange={(e) => {
                           replace([
@@ -420,8 +456,9 @@ export default function ProjectPage() {
                           </option>
                         ))}
                       </select>
+                      <span className="font-medium text-slate-600 text-sm sm:text-base">:</span>
                       <select
-                        className={`input flex-1 text-base ${errors.allowedRanges ? "input-error border-red-500" : ""} ${project && project.guests.length > 0 ? "cursor-not-allowed opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].startTime.split(":")[1]}
                         onChange={(e) => {
                           replace([
@@ -444,10 +481,10 @@ export default function ProjectPage() {
                         ))}
                       </select>
                     </div>
-                    <span>〜</span>
-                    <div className="flex flex-1 gap-1">
+                    <span className="font-medium text-slate-600 text-sm sm:text-base">〜</span>
+                    <div className="flex flex-1 items-center gap-1.5 sm:gap-2">
                       <select
-                        className={`input flex-1 text-base ${errors.allowedRanges ? "input-error border-red-500" : ""} ${project && project.guests.length > 0 ? "cursor-not-allowed opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].endTime.split(":")[0]}
                         onChange={(e) => {
                           replace([
@@ -469,8 +506,9 @@ export default function ProjectPage() {
                           </option>
                         ))}
                       </select>
+                      <span className="font-medium text-slate-600 text-sm sm:text-base">:</span>
                       <select
-                        className={`input flex-1 text-base ${errors.allowedRanges ? "input-error border-red-500" : ""} ${project && project.guests.length > 0 ? "cursor-not-allowed opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].endTime.split(":")[1]}
                         onChange={(e) => {
                           replace([
@@ -496,78 +534,90 @@ export default function ProjectPage() {
                   </div>
                 </div>
                 {errors.allowedRanges && typeof errors.allowedRanges?.message === "string" && (
-                  <p className="mt-1 text-red-500 text-sm">{errors.allowedRanges.message}</p>
+                  <p className="mt-2 text-red-600 text-sm">{errors.allowedRanges.message}</p>
                 )}
-              </fieldset>
-              <div className="collapse-arrow collapse mb-4 border border-base-300 bg-base-200">
-                <input
-                  type="checkbox"
-                  checked={isParticipationExpanded}
-                  onChange={(e) => setIsParticipationExpanded(e.target.checked)}
-                />
-                <div className="collapse-title font-medium text-sm">参加形態の設定 (任意)</div>
-                <div className="collapse-content">
-                  <fieldset>
-                    <p className="mb-2 text-gray-500 text-xs">
+              </div>
+
+              {/* 参加形態 */}
+              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+                <button
+                  type="button"
+                  className="flex w-full items-center justify-between text-left"
+                  onClick={() => setIsParticipationExpanded(!isParticipationExpanded)}
+                >
+                  <h2 className="font-semibold text-base text-slate-900 sm:text-lg">参加形態の設定 (任意)</h2>
+                  <span
+                    className={`text-slate-600 transition-transform ${isParticipationExpanded ? "rotate-180" : ""}`}
+                  >
+                    ▼
+                  </span>
+                </button>
+                {isParticipationExpanded && (
+                  <div className="mt-4 border-slate-200 border-t pt-4">
+                    <p className="mb-4 text-slate-600 text-sm">
                       参加形態を設定すると、参加者は「対面」「オンライン」などの形態を選んで日程を登録できます。
                     </p>
 
-                    {participationFields.map((field, index) => {
-                      const hasSlots = project?.guests.some((guest) =>
-                        guest.slots.some((slot) => slot.participationOptionId === field.id),
-                      );
-                      const isLastOption = participationFields.length === 1;
-                      const cannotDelete = hasSlots || isLastOption;
-                      const tooltipMessage = hasSlots
-                        ? "すでにこの参加形態の日程が登録されているため、削除できません"
-                        : isLastOption
-                          ? "最低1つの参加形態が必要です"
-                          : "";
-                      return (
-                        <div key={field.id} className="mb-2 w-full">
-                          <div className="flex items-center gap-2">
-                            <input type="hidden" {...register(`participationOptions.${index}.id`)} value={field.id} />
-                            <input
-                              type="color"
-                              {...register(`participationOptions.${index}.color`)}
-                              defaultValue={field.color}
-                              className="h-10 w-10 cursor-pointer rounded border-0"
-                            />
-                            <input
-                              type="text"
-                              {...register(`participationOptions.${index}.label`)}
-                              defaultValue={field.label}
-                              placeholder="参加形態名（例：対面、オンライン）"
-                              className={`input input-bordered flex-1 text-base ${errors.participationOptions?.[index]?.label ? "input-error border-red-500" : ""}`}
-                              onBlur={() => {
-                                // 値を変更していない場合でも空ならエラー表示させるため手動で検証
-                                trigger(`participationOptions.${index}.label` as const);
-                              }}
-                            />
-                            <div className={cannotDelete ? "tooltip tooltip-left" : ""} data-tip={tooltipMessage}>
-                              <button
-                                type="button"
-                                onClick={() => removeParticipation(index)}
-                                className={`btn btn-ghost btn-sm text-error ${cannotDelete ? "cursor-not-allowed opacity-40" : ""}`}
-                                disabled={cannotDelete}
-                              >
-                                <HiOutlineTrash size={20} />
-                              </button>
+                    <div className="space-y-3">
+                      {participationFields.map((field, index) => {
+                        const hasSlots = project?.guests.some((guest) =>
+                          guest.slots.some((slot) => slot.participationOptionId === field.id),
+                        );
+                        const isLastOption = participationFields.length === 1;
+                        const cannotDelete = hasSlots || isLastOption;
+                        const tooltipMessage = hasSlots
+                          ? "すでにこの参加形態の日程が登録されているため、削除できません"
+                          : isLastOption
+                            ? "最低1つの参加形態が必要です"
+                            : "";
+                        return (
+                          <div key={field.id} className="w-full">
+                            <div className="flex items-center gap-2 sm:gap-3">
+                              <input type="hidden" {...register(`participationOptions.${index}.id`)} value={field.id} />
+                              <div className="relative h-10 w-10 shrink-0 sm:h-11 sm:w-11">
+                                <input
+                                  type="color"
+                                  {...register(`participationOptions.${index}.color`)}
+                                  defaultValue={field.color}
+                                  // カラーピッカーのスタイルはブラウザに依存した調整が必要
+                                  className="absolute inset-0 h-full w-full cursor-pointer appearance-none rounded-lg border-0 shadow-[0_0_0_2px_rgb(226_232_240),0_1px_2px_0_rgb(0_0_0/0.05)] [&::-moz-color-swatch]:rounded-lg [&::-moz-color-swatch]:border-0 [&::-webkit-color-swatch-wrapper]:p-0 [&::-webkit-color-swatch]:rounded-lg [&::-webkit-color-swatch]:border-0"
+                                />
+                              </div>
+                              <input
+                                type="text"
+                                {...register(`participationOptions.${index}.label`)}
+                                defaultValue={field.label}
+                                placeholder="参加形態名（例：対面、オンライン）"
+                                className={`flex-1 rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.participationOptions?.[index]?.label ? "border-red-500" : "border-slate-300"}`}
+                                onBlur={() => {
+                                  trigger(`participationOptions.${index}.label` as const);
+                                }}
+                              />
+                              <div className={cannotDelete ? "tooltip tooltip-left" : ""} data-tip={tooltipMessage}>
+                                <button
+                                  type="button"
+                                  onClick={() => removeParticipation(index)}
+                                  className={`rounded-lg p-2 text-red-600 transition-colors hover:bg-red-50 sm:p-2.5 ${cannotDelete ? "cursor-not-allowed opacity-40" : ""}`}
+                                  disabled={cannotDelete}
+                                >
+                                  <HiOutlineTrash size={18} className="sm:h-5 sm:w-5" />
+                                </button>
+                              </div>
                             </div>
+                            {errors.participationOptions?.[index]?.label && (
+                              <p className="mt-1.5 text-red-600 text-sm">
+                                {errors.participationOptions[index]?.label?.message as string}
+                              </p>
+                            )}
+                            {errors.participationOptions?.[index]?.color && (
+                              <p className="mt-1.5 text-red-600 text-sm">
+                                {errors.participationOptions[index]?.color?.message as string}
+                              </p>
+                            )}
                           </div>
-                          {errors.participationOptions?.[index]?.label && (
-                            <p className="mt-1 text-red-500 text-xs">
-                              {errors.participationOptions[index]?.label?.message as string}
-                            </p>
-                          )}
-                          {errors.participationOptions?.[index]?.color && (
-                            <p className="mt-1 text-red-500 text-xs">
-                              {errors.participationOptions[index]?.color?.message as string}
-                            </p>
-                          )}
-                        </div>
-                      );
-                    })}
+                        );
+                      })}
+                    </div>
 
                     <button
                       type="button"
@@ -579,87 +629,107 @@ export default function ProjectPage() {
                           color: generateDistinctColor(existingColors),
                         });
                       }}
-                      className="btn btn-outline btn-sm"
+                      className="mt-4 inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-medium text-slate-700 text-xs transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2 sm:text-sm"
                     >
                       + 参加形態を追加
                     </button>
-                  </fieldset>
-                </div>
+                  </div>
+                )}
               </div>
+
+              {/* イベントの削除 */}
               {project && (
-                <fieldset>
-                  <legend className="text-gray-400 text-sm">イベントの削除</legend>
-                  <div className="flex justify-end py-2">
-                    <button
-                      type="button"
-                      id="delete-button"
-                      className="btn btn-ghost text-error"
-                      onClick={async () => {
-                        if (confirm("本当にこのイベントを削除しますか？")) {
-                          try {
-                            const res = await client.projects[":projectId"].$delete(
-                              { param: { projectId: project.id } },
-                              { init: { credentials: "include" } },
-                            );
-                            if (!res.ok) {
-                              throw new Error("削除に失敗しました。");
-                            }
-                            // TODO: トーストをグローバルにする
-                            navigate("/home");
-                            setToast({
-                              message: "イベントを削除しました。",
-                              variant: "success",
-                            });
-                            setTimeout(() => {
-                              setToast(null);
-                            }, 3000);
-                          } catch (error) {
-                            console.error(error);
-                            setToast({
-                              message: "エラーが発生しました。もう一度お試しください。",
-                              variant: "error",
-                            });
-                            setTimeout(() => {
-                              setToast(null);
-                            }, 3000);
+                <div className="rounded-2xl border border-red-200 bg-red-50/50 p-6 shadow-sm">
+                  <h2 className="mb-2 font-semibold text-base text-slate-900 sm:text-lg">イベントの削除</h2>
+                  <p className="mb-4 text-slate-600 text-sm">この操作は取り消せません。慎重に行ってください。</p>
+                  <button
+                    type="button"
+                    id="delete-button"
+                    className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-red-600 px-3 py-2 font-semibold text-white text-xs transition-all hover:bg-red-700 sm:gap-2 sm:px-4 sm:py-2 sm:text-sm"
+                    onClick={async () => {
+                      if (confirm("本当にこのイベントを削除しますか？")) {
+                        try {
+                          const res = await client.projects[":projectId"].$delete(
+                            { param: { projectId: project.id } },
+                            { init: { credentials: "include" } },
+                          );
+                          if (!res.ok) {
+                            throw new Error("削除に失敗しました。");
                           }
+                          // TODO: トーストをグローバルにする
+                          navigate("/home");
+                          setToast({
+                            message: "イベントを削除しました。",
+                            variant: "success",
+                          });
+                          setTimeout(() => {
+                            setToast(null);
+                          }, 3000);
+                        } catch (error) {
+                          console.error(error);
+                          setToast({
+                            message: "エラーが発生しました。もう一度お試しください。",
+                            variant: "error",
+                          });
+                          setTimeout(() => {
+                            setToast(null);
+                          }, 3000);
                         }
-                      }}
-                    >
-                      <HiOutlineTrash size={20} />
-                      イベントを削除する
-                    </button>
-                  </div>
-                </fieldset>
+                      }
+                    }}
+                  >
+                    <HiOutlineTrash size={16} className="sm:h-5 sm:w-5" />
+                    イベントを削除する
+                  </button>
+                </div>
               )}
-              <div className="fixed bottom-0 left-0 flex max-h-18 w-full justify-between bg-white p-4 shadow-[0_-2px_8px_rgba(0,0,0,0.1)]">
+            </form>
+
+            {/* 固定フッター */}
+            <div className="fixed right-0 bottom-0 left-0 z-10 border-slate-200 border-t bg-white/95 px-4 py-3 shadow-lg backdrop-blur-sm sm:py-4">
+              <div className="mx-auto flex max-w-4xl items-center justify-between gap-2 sm:gap-4">
                 {eventId ? (
-                  <NavLink to={`/e/${eventId}`} className="btn btn-outline btn-primary">
+                  <NavLink
+                    to={`/e/${eventId}`}
+                    className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-4 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-6 sm:py-2.5"
+                  >
                     日程調整に戻る
                   </NavLink>
                 ) : (
-                  <NavLink to={"/home"} className="btn btn-outline btn-primary">
+                  <NavLink
+                    to="/home"
+                    className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-4 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-6 sm:py-2.5"
+                  >
                     ホームに戻る
                   </NavLink>
                 )}
-                <button type="submit" className="btn btn-primary" disabled={!isValid || !isDirty}>
+                <button
+                  type="submit"
+                  form="project-form"
+                  className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:gap-2 sm:px-6 sm:py-2.5"
+                  disabled={!isValid || !isDirty}
+                >
                   イベントを{project ? "更新" : "作成"}する
                 </button>
               </div>
-            </form>
-          </div>
+            </div>
+          </main>
         )}
       </div>
+
+      {/* 作成完了ダイアログ */}
       {dialogStatus !== null && (
-        <div className="modal modal-open">
-          <div className="modal-box flex flex-col gap-2">
-            <h3 className="text-xl">{dialogStatus.projectName}を作成しました</h3>
-            <p className="py-4">URL をコピーして共有しましょう！</p>
-            <div className="flex gap-1">
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/50 p-4 backdrop-blur-sm">
+          <div className="w-full max-w-md rounded-2xl border border-slate-200 bg-white p-5 shadow-2xl sm:p-6">
+            <h3 className="mb-1.5 font-bold text-lg text-slate-900 sm:mb-2 sm:text-2xl">
+              {dialogStatus.projectName}を作成しました
+            </h3>
+            <p className="mb-4 text-slate-600 text-xs sm:mb-6 sm:text-sm">URL をコピーして共有しましょう！</p>
+            <div className="mb-4 flex gap-2 sm:mb-6">
               <input
                 type="text"
                 disabled
-                className="input input-info w-full"
+                className="flex-1 rounded-lg border border-slate-300 bg-slate-50 px-3 py-2 text-slate-700 text-xs sm:px-4 sm:py-2.5 sm:text-sm"
                 value={`${FRONTEND_ORIGIN}/e/${dialogStatus.projectId}`}
               />
               <button
@@ -671,31 +741,41 @@ export default function ProjectPage() {
                     setCopied(false);
                   }, 2000);
                 }}
-                className="btn btn-outline btn-primary"
+                className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-primary bg-white px-3 py-2 font-semibold text-primary text-xs transition-all hover:bg-primary/5 sm:gap-2 sm:px-4 sm:py-2 sm:text-sm"
                 disabled={copied}
               >
-                {!copied ? <HiClipboardCopy size={20} /> : <HiClipboardCheck size={20} />} コピー
+                {!copied ? (
+                  <HiClipboardCopy size={16} className="sm:h-5 sm:w-5" />
+                ) : (
+                  <HiClipboardCheck size={16} className="sm:h-5 sm:w-5" />
+                )}{" "}
+                <span className="hidden sm:inline">コピー</span>
               </button>
             </div>
-            <div className="modal-action">
-              <NavLink className="btn btn-primary" to={`/e/${dialogStatus.projectId}`}>
+            <div className="flex justify-end">
+              <NavLink
+                className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl sm:gap-2 sm:px-6 sm:py-2.5"
+                to={`/e/${dialogStatus.projectId}`}
+              >
                 イベントへ
               </NavLink>
             </div>
           </div>
         </div>
       )}
+
+      {/* トースト */}
       {toast && (
-        <div className="toast toast-top toast-end z-50 mt-18">
+        <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
-            <div className="alert border-0 bg-gray-200">
-              <HiOutlineCheckCircle size={20} className="text-green-500" />
-              <span>{toast.message}</span>
+            <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
+              <HiOutlineCheckCircle size={24} className="shrink-0 text-emerald-600" />
+              <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
             </div>
           ) : (
-            <div className="alert border-0 bg-gray-200">
-              <HiOutlineExclamationCircle size={20} className="text-red-500" />
-              <span>{toast.message}</span>
+            <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
+              <HiOutlineExclamationCircle size={24} className="shrink-0 text-red-600" />
+              <span className="font-medium text-red-900 text-sm">{toast.message}</span>
             </div>
           )}
         </div>

From b36b0708026b75e06bc9c101427aec5520c24e21 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Mon, 29 Dec 2025 00:23:24 +0900
Subject: [PATCH 04/32] =?UTF-8?q?submission=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/eventId/Submission.tsx | 185 +++++++++++++-----------
 1 file changed, 101 insertions(+), 84 deletions(-)

diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index 628473b..9c9a343 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -228,42 +228,50 @@ export default function SubmissionPage() {
 
   return (
     <>
-      <div className="flex h-[100dvh] flex-col">
+      <div className="flex h-[100dvh] flex-col bg-slate-50">
         <Header />
         {loading ? (
           <div className="flex w-full flex-1 items-center justify-center">
-            <span className="loading loading-dots loading-md text-gray-400" />
+            <span className="loading loading-dots loading-md text-slate-400" />
           </div>
         ) : !project ? (
-          <div className="flex flex-col items-center justify-center gap-4 py-4">
-            <p className="text-gray-600 text-xl">イベントが見つかりませんでした。</p>
-            <NavLink to={"/"} className="link">
-              ホームに戻る
-            </NavLink>
+          <div className="mx-auto flex w-full max-w-7xl flex-col items-center justify-center gap-4 px-4 py-16 sm:px-6 lg:px-8">
+            <div className="flex min-h-[400px] w-full flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
+              <p className="text-slate-600 text-xl">イベントが見つかりませんでした。</p>
+              <NavLink
+                to="/"
+                className="inline-flex items-center justify-center gap-2 rounded-lg bg-primary px-6 py-3 font-semibold text-base text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md"
+              >
+                ホームに戻る
+              </NavLink>
+            </div>
           </div>
         ) : !selectedParticipationOptionId ? (
           <div className="flex w-full flex-1 items-center justify-center">
-            <span className="loading loading-dots loading-md text-gray-400" />
+            <span className="loading loading-dots loading-md text-slate-400" />
           </div>
         ) : (
-          <div className="flex h-full flex-1 flex-col overflow-y-auto p-4">
-            <div className="flex items-center justify-between">
-              <h1 className="mb-2 font-bold text-2xl text-gray-800">{project.name} の日程調整</h1>
-              {isHost && (
-                <NavLink to={`/e/${projectId}/edit`} className="btn btn-sm font-normal text-gray-600">
-                  <HiOutlineCog />
-                  イベント設定
-                </NavLink>
+          <div className="flex flex-1 flex-col overflow-y-auto">
+            <div className="mx-auto flex w-full max-w-7xl flex-1 flex-col px-4 pt-3 pb-3 sm:px-6 sm:pt-4 sm:pb-3 lg:px-8">
+              <div className="mb-2 flex items-center justify-between sm:mb-3">
+                <h1 className="truncate font-bold text-base text-slate-900 sm:text-lg">{project.name}</h1>
+                {isHost && (
+                  <NavLink
+                    to={`/e/${projectId}/edit`}
+                    className="ml-2 inline-flex shrink-0 items-center justify-center gap-1 rounded-lg border border-slate-200 bg-white px-2 py-1 font-medium text-slate-600 text-xs transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-1.5 sm:px-2.5 sm:py-1.5"
+                  >
+                    <HiOutlineCog size={14} />
+                    <span className="hidden sm:inline">設定</span>
+                  </NavLink>
+                )}
+              </div>
+
+              {project.description && (
+                <p className="mb-4 whitespace-pre-wrap text-slate-600 text-sm">{project.description}</p>
               )}
-            </div>
-            {project.description && (
-              <p className="mb-4 whitespace-pre-wrap text-gray-600 text-sm">{project.description}</p>
-            )}
 
-            {editMode && project.participationOptions.length > 1 && selectedParticipationOptionId !== null && (
-              <div className="mb-4">
-                <span className="label-text mb-2 block text-gray-400">参加形態を選択</span>
-                <div className="flex flex-wrap gap-2">
+              {editMode && project.participationOptions.length > 1 && selectedParticipationOptionId !== null && (
+                <div className="mb-2 flex flex-wrap items-center gap-1.5 sm:mb-3 sm:gap-2">
                   {project.participationOptions.map((opt) => {
                     const rgb = hexToRgb(opt.color);
                     const lightBg = rgb
@@ -274,52 +282,54 @@ export default function SubmissionPage() {
                       <button
                         key={opt.id}
                         type="button"
-                        className="btn btn-sm md:btn-md gap-1 px-2 sm:gap-2 sm:px-4"
+                        className="inline-flex items-center gap-1.5 rounded-lg px-2.5 py-1.5 font-medium text-xs transition-all sm:gap-2 sm:px-3 sm:py-2 sm:text-sm"
                         onClick={() => setSelectedParticipationOptionId(opt.id)}
                         style={
                           selectedParticipationOptionId === opt.id
-                            ? { backgroundColor: lightBg, borderColor: opt.color }
-                            : undefined
+                            ? { backgroundColor: lightBg, borderWidth: "2px", borderColor: opt.color }
+                            : { backgroundColor: "white", borderWidth: "2px", borderColor: "#e2e8f0" }
                         }
                       >
                         <span
-                          className="inline-block h-3 w-3 shrink-0 rounded-full sm:h-4 sm:w-4"
+                          className="inline-block h-2.5 w-2.5 shrink-0 rounded-full sm:h-3 sm:w-3"
                           style={{ backgroundColor: opt.color }}
                         />
-                        <span className="text-xs sm:text-sm">{opt.label}</span>
+                        <span>{opt.label}</span>
                       </button>
                     );
                   })}
                 </div>
-              </div>
-            )}
-            <Calendar
-              startDate={project.startDate}
-              endDate={project.endDate}
-              allowedRanges={project.allowedRanges}
-              editingSlots={editMode ? editingSlots : []}
-              viewingSlots={viewingSlots}
-              guestIdToName={guestIdToName}
-              participationOptions={project.participationOptions}
-              currentParticipationOptionId={selectedParticipationOptionId}
-              editMode={editMode}
-              onChangeEditingSlots={setEditingSlots}
-            />
-            <div className="flex w-full items-center justify-between gap-2 p-2">
-              {editMode ? (
-                <>
-                  <input
-                    type="text"
-                    placeholder="あなたの名前"
-                    value={guestName}
-                    onChange={(e) => setGuestName(e.target.value)}
-                    className="input flex-1 text-base"
-                  />
-                  <div className="flex flex-row gap-2">
+              )}
+
+              <Calendar
+                startDate={project.startDate}
+                endDate={project.endDate}
+                allowedRanges={project.allowedRanges}
+                editingSlots={editMode ? editingSlots : []}
+                viewingSlots={viewingSlots}
+                guestIdToName={guestIdToName}
+                participationOptions={project.participationOptions}
+                currentParticipationOptionId={selectedParticipationOptionId}
+                editMode={editMode}
+                onChangeEditingSlots={setEditingSlots}
+              />
+            </div>
+
+            <div className="sticky bottom-0 z-10 border-slate-200 border-t bg-white/95 backdrop-blur-sm">
+              <div className="mx-auto max-w-7xl px-4 py-2 sm:px-6 sm:py-3 lg:px-8">
+                {editMode ? (
+                  <div className="flex items-center gap-2">
+                    <input
+                      type="text"
+                      placeholder="名前"
+                      value={guestName}
+                      onChange={(e) => setGuestName(e.target.value)}
+                      className="min-w-0 flex-1 rounded-lg border border-slate-300 px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base"
+                    />
                     {!!myGuestId && (
                       <button
                         type="button"
-                        className="btn text-gray-500"
+                        className="shrink-0 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:px-4 sm:py-2.5"
                         disabled={loading}
                         onClick={async () => {
                           if (confirm("更新をキャンセルします。よろしいですか？")) {
@@ -328,12 +338,13 @@ export default function SubmissionPage() {
                           }
                         }}
                       >
-                        キャンセル
+                        <span className="hidden sm:inline">キャンセル</span>
+                        <span className="sm:hidden">×</span>
                       </button>
                     )}
                     <button
                       type="button"
-                      className="btn btn-primary"
+                      className="shrink-0 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:px-6 sm:py-2.5"
                       disabled={loading || !guestName}
                       onClick={() => {
                         if (!guestName) return;
@@ -350,41 +361,47 @@ export default function SubmissionPage() {
                       {meAsGuest ? "更新" : "提出"}
                     </button>
                   </div>
-                </>
-              ) : (
-                <>
-                  <NavLink to={"/home"} className="btn btn-outline btn-primary">
-                    <HiOutlineHome size={20} />
-                    ホームに戻る
-                  </NavLink>
-                  <button
-                    type="button"
-                    className="btn btn-primary"
-                    disabled={loading}
-                    onClick={() => {
-                      setEditMode(true);
-                    }}
-                  >
-                    <HiPencil size={20} />
-                    日程を更新する
-                  </button>
-                </>
-              )}
+                ) : (
+                  <div className="flex items-center justify-between gap-2">
+                    <NavLink
+                      to="/home"
+                      className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2.5"
+                    >
+                      <HiOutlineHome size={16} className="sm:h-5 sm:w-5" />
+                      <span className="hidden sm:inline">ホームに戻る</span>
+                      <span className="sm:hidden">ホーム</span>
+                    </NavLink>
+                    <button
+                      type="button"
+                      className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:gap-2 sm:px-6 sm:py-2.5"
+                      disabled={loading}
+                      onClick={() => {
+                        setEditMode(true);
+                      }}
+                    >
+                      <HiPencil size={16} className="sm:h-5 sm:w-5" />
+                      <span className="hidden sm:inline">日程を更新する</span>
+                      <span className="sm:hidden">更新</span>
+                    </button>
+                  </div>
+                )}
+              </div>
             </div>
           </div>
         )}
       </div>
+
       {toast && (
-        <div className="toast toast-top toast-end z-50 mt-18">
+        <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
-            <div className="alert border-0 bg-gray-200">
-              <HiOutlineCheckCircle size={20} className="text-green-500" />
-              <span>{toast.message}</span>
+            <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
+              <HiOutlineCheckCircle size={24} className="shrink-0 text-emerald-600" />
+              <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
             </div>
           ) : (
-            <div className="alert border-0 bg-gray-200">
-              <HiOutlineExclamationCircle size={20} className="text-red-500" />
-              <span>{toast.message}</span>
+            <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
+              <HiOutlineExclamationCircle size={24} className="shrink-0 text-red-600" />
+              <span className="font-medium text-red-900 text-sm">{toast.message}</span>
             </div>
           )}
         </div>

From 6ac15f2faa34ce9c51b85cb7022d1c117bad4ca5 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Mon, 29 Dec 2025 00:25:39 +0900
Subject: [PATCH 05/32] =?UTF-8?q?not=20found=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/NotFound.tsx | 38 ++++++++++++++++++++++++++++-------
 1 file changed, 31 insertions(+), 7 deletions(-)

diff --git a/client/src/pages/NotFound.tsx b/client/src/pages/NotFound.tsx
index b52bc62..e21e829 100644
--- a/client/src/pages/NotFound.tsx
+++ b/client/src/pages/NotFound.tsx
@@ -1,16 +1,40 @@
+import { LuArrowLeft, LuCircleAlert, LuHouse } from "react-icons/lu";
 import { NavLink } from "react-router";
 import Header from "../components/Header";
 
 export default function NotFoundPage() {
   return (
-    <div className="h-full w-full">
+    <div className="min-h-screen bg-slate-50 font-sans text-slate-900">
       <Header />
-      <div className="flex flex-col items-center justify-center gap-4 py-4">
-        <p className="text-gray-600 text-xl">このページは見つかりませんでした。</p>
-        <NavLink to={"/"} className="link">
-          ホームに戻る
-        </NavLink>
-      </div>
+      <main className="mx-auto max-w-7xl px-4 py-16 sm:px-6 sm:py-24 lg:px-8">
+        <div className="fade-in zoom-in-95 flex min-h-[500px] animate-in flex-col items-center justify-center rounded-3xl border border-slate-300 border-dashed bg-white/50 p-8 text-center duration-500">
+          <div className="mb-6 flex h-24 w-24 items-center justify-center rounded-full bg-slate-100 shadow-sm ring-1 ring-slate-200">
+            <LuCircleAlert className="h-12 w-12 text-slate-400" />
+          </div>
+          <h1 className="mb-3 font-bold text-4xl text-slate-900 tracking-tight">404</h1>
+          <h2 className="mb-2 font-bold text-slate-900 text-xl">ページが見つかりません</h2>
+          <p className="mb-8 max-w-md text-slate-600">
+            お探しのページは存在しないか、移動または削除された可能性があります。
+          </p>
+          <div className="flex flex-col gap-4 sm:flex-row">
+            <NavLink
+              to="/home"
+              className="hover:-translate-y-0.5 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-6 py-3 font-semibold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+            >
+              <LuHouse className="h-5 w-5" />
+              ホームに戻る
+            </NavLink>
+            <button
+              type="button"
+              onClick={() => window.history.back()}
+              className="inline-flex items-center justify-center gap-2 rounded-xl border-2 border-slate-200 bg-white px-6 py-3 font-semibold text-base text-slate-700 transition-all hover:border-slate-300 hover:bg-slate-50"
+            >
+              <LuArrowLeft className="h-5 w-5" />
+              前のページに戻る
+            </button>
+          </div>
+        </div>
+      </main>
     </div>
   );
 }

From a076038a730e7370f4785c97e4bbc5b8d03f8ad5 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Mon, 29 Dec 2025 01:08:39 +0900
Subject: [PATCH 06/32] =?UTF-8?q?header=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Header.tsx | 118 +++++++++++++++++++++----------
 client/src/constants/links.ts    |   4 ++
 2 files changed, 85 insertions(+), 37 deletions(-)
 create mode 100644 client/src/constants/links.ts

diff --git a/client/src/components/Header.tsx b/client/src/components/Header.tsx
index d28d52b..8757eea 100644
--- a/client/src/components/Header.tsx
+++ b/client/src/components/Header.tsx
@@ -1,47 +1,91 @@
-import { HiOutlineHome, HiOutlineQuestionMarkCircle } from "react-icons/hi";
+import { useState } from "react";
+import { LuMenu, LuX } from "react-icons/lu";
 import { NavLink } from "react-router";
+import { EXTERNAL_LINKS } from "../constants/links";
 
 export default function Header() {
+  const [isMenuOpen, setIsMenuOpen] = useState(false);
+
   return (
-    <div className="navbar sticky top-0 left-0 z-50 bg-primary shadow-sm">
-      <div className="px-2 font-mplus text-2xl text-white">
-        <NavLink className="flex items-center gap-1" to="/">
-          <img src="/logo-white.svg" alt="logo" width={24} />
-          <span className="px-2">イツヒマ</span>
-          <span className="text-xs">(アルファ版)</span>
-        </NavLink>
-      </div>
-      <div>
-        <div className="dropdown dropdown-end -translate-y-1/2 absolute top-1/2 right-3 transform text-gray-600">
-          <NavLink className="btn btn-primary" to="/home">
-            <HiOutlineHome size={24} className="text-white" />
-            <span className="hidden md:block">ホーム</span>
+    <header className="sticky top-0 z-50 w-full border-slate-200/60 border-b bg-white/80 backdrop-blur-md">
+      <div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
+        <div className="flex items-center gap-2">
+          <NavLink to="/" className="flex items-center gap-2 transition-opacity hover:opacity-80">
+            <img src="/logo.svg" alt="イツヒマ" className="h-8 w-8" />
+            <span className="font-bold font-mplus text-slate-800 text-xl tracking-tight">イツヒマ</span>
+            <span className="hidden rounded-full bg-slate-100 px-2 py-0.5 font-medium text-[10px] text-slate-500 sm:inline-block">
+              アルファ版
+            </span>
+          </NavLink>
+        </div>
+
+        <nav className="hidden items-center gap-6 md:flex">
+          <a
+            href={EXTERNAL_LINKS.GUIDE}
+            target="_blank"
+            rel="noreferrer noopener"
+            className="font-medium text-slate-600 text-sm transition-colors hover:text-primary"
+          >
+            使い方
+          </a>
+          <NavLink to="/home" className="font-medium text-slate-600 text-sm transition-colors hover:text-primary">
+            ホーム
+          </NavLink>
+          <div className="h-4 w-px bg-slate-200" />
+          <NavLink
+            to="/new"
+            className="inline-flex items-center justify-center rounded-full bg-primary px-4 py-2 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+          >
+            イベント作成
           </NavLink>
-          <button tabIndex={0} className="btn btn-circle btn-primary" type="button">
-            <HiOutlineQuestionMarkCircle size={28} className="text-white" />
+        </nav>
+
+        <div className="flex items-center gap-2 md:hidden">
+          <NavLink
+            to="/new"
+            className="inline-flex items-center justify-center rounded-full bg-primary px-3 py-1.5 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+          >
+            イベント作成
+          </NavLink>
+          <button
+            type="button"
+            className="rounded-md p-2 text-slate-600 hover:bg-slate-100"
+            onClick={() => setIsMenuOpen(!isMenuOpen)}
+          >
+            {isMenuOpen ? <LuX className="h-6 w-6" /> : <LuMenu className="h-6 w-6" />}
           </button>
-          <div className="dropdown-content z-[1] w-56 rounded-box bg-base-100 p-2 shadow">
-            <p className="p-2 text-xs">イツヒマは現在アルファ版です。</p>
-            {/* biome-ignore lint/a11y/noNoninteractiveTabindex: daisyUI の仕様。tabIndex を消すとモバイルで開かないなどの問題が起こる */}
-            <ul tabIndex={0} className="menu p-0">
-              <li>
-                <a
-                  href="https://utcode.notion.site/1e4ca5f557bc80f2b697ca7b9342dc89?pvs=4"
-                  target="_blank"
-                  rel="noreferrer noopener"
-                >
-                  使い方ページ (臨時)
-                </a>
-              </li>
-              <li>
-                <a href="https://forms.gle/AB6xbgKjnDv5m1nm6" target="_blank" rel="noreferrer noopener">
-                  ご意見・バグ報告
-                </a>
-              </li>
-            </ul>
-          </div>
         </div>
       </div>
-    </div>
+
+      {isMenuOpen && (
+        <div className="absolute top-16 left-0 w-full border-slate-100 border-b bg-white shadow-lg md:hidden">
+          <div className="space-y-1 px-4 pt-2 pb-4">
+            <NavLink
+              to="/home"
+              className="block rounded-md px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
+              onClick={() => setIsMenuOpen(false)}
+            >
+              ホーム
+            </NavLink>
+            <a
+              href={EXTERNAL_LINKS.GUIDE}
+              target="_blank"
+              rel="noreferrer noopener"
+              className="block rounded-md px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
+            >
+              使い方ページ
+            </a>
+            <a
+              href={EXTERNAL_LINKS.FEEDBACK}
+              target="_blank"
+              rel="noreferrer noopener"
+              className="block rounded-md px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
+            >
+              ご意見・バグ報告
+            </a>
+          </div>
+        </div>
+      )}
+    </header>
   );
 }
diff --git a/client/src/constants/links.ts b/client/src/constants/links.ts
new file mode 100644
index 0000000..8e84778
--- /dev/null
+++ b/client/src/constants/links.ts
@@ -0,0 +1,4 @@
+export const EXTERNAL_LINKS = {
+  GUIDE: "https://utcode.notion.site/1e4ca5f557bc80f2b697ca7b9342dc89?pvs=4",
+  FEEDBACK: "https://forms.gle/AB6xbgKjnDv5m1nm6",
+} as const;

From 68e5ec4a830b97dd80aae5dd1013d8191b92367b Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Mon, 29 Dec 2025 03:19:44 +0900
Subject: [PATCH 07/32] =?UTF-8?q?Landing=20=E3=82=92=E4=B8=AD=E5=BF=83?=
 =?UTF-8?q?=E3=81=AB=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Header.tsx |   2 +-
 client/src/pages/Landing.tsx     | 170 +++++++++++++++++--------------
 2 files changed, 94 insertions(+), 78 deletions(-)

diff --git a/client/src/components/Header.tsx b/client/src/components/Header.tsx
index 8757eea..5a2c409 100644
--- a/client/src/components/Header.tsx
+++ b/client/src/components/Header.tsx
@@ -11,7 +11,7 @@ export default function Header() {
       <div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
         <div className="flex items-center gap-2">
           <NavLink to="/" className="flex items-center gap-2 transition-opacity hover:opacity-80">
-            <img src="/logo.svg" alt="イツヒマ" className="h-8 w-8" />
+            <img src="/logo.svg" alt="イツヒマ" className="h-6 w-6" />
             <span className="font-bold font-mplus text-slate-800 text-xl tracking-tight">イツヒマ</span>
             <span className="hidden rounded-full bg-slate-100 px-2 py-0.5 font-medium text-[10px] text-slate-500 sm:inline-block">
               アルファ版
diff --git a/client/src/pages/Landing.tsx b/client/src/pages/Landing.tsx
index 814d42f..38d47f6 100644
--- a/client/src/pages/Landing.tsx
+++ b/client/src/pages/Landing.tsx
@@ -1,38 +1,35 @@
+import { LuChevronRight, LuCircleCheck, LuPalette, LuSmartphone } from "react-icons/lu";
 import { NavLink } from "react-router";
 import Header from "../components/Header";
-
-export default function LandingPage() {
-  return (
-    <>
-      <Header />
-      <div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100">
-        <HeroSection />
-        <FeaturesSection />
-        <Footer />
-      </div>
-    </>
-  );
-}
+import { EXTERNAL_LINKS } from "../constants/links";
 
 function HeroSection() {
   return (
-    <section className="relative overflow-hidden">
-      <div className="container relative z-10 mx-auto flex max-w-5xl flex-col items-center gap-12 px-6 py-16 sm:gap-14 md:py-20 lg:flex-row lg:gap-10 xl:gap-14 ">
-        <div className="max-w-lg grow text-center lg:text-left">
-          <h1 className="font-bold text-4xl text-gray-800 leading-snug md:text-5xl">
-            <span className="text-primary">「いつヒマ？」</span>で<br />
-            日程調整しよう
-          </h1>
-          <p className="mt-6 text-gray-600 text-md leading-relaxed md:text-xl">
-            とりあえずみんなの空いている時間を訊いてから、何を何時間やるか決めたい。そんな仲間うちでの日程調整に最適なツールです。
-          </p>
-          <NavLink to="/new" className="btn btn-primary btn-lg mt-10 px-8 shadow-lg duration-300 hover:shadow-xl">
-            今すぐイベントを作成
-          </NavLink>
-        </div>
-        <div className="relative w-60 shrink-0 sm:w-64 md:w-72 lg:w-80 xl:w-[22rem]">
-          <div aria-hidden className="-inset-8 absolute rounded-full bg-primary/10 blur-3xl" />
-          <img src="/mock-mobile.png" alt="イツヒマアプリの画面" className="relative h-auto w-72" />
+    <section id="hero">
+      <div className="overflow-hidden bg-slate-50">
+        <div className="container mx-auto max-w-7xl px-4 py-10 sm:px-6 lg:px-8 lg:py-14">
+          <div className="grid items-center gap-12 lg:grid-cols-2 lg:gap-8">
+            <div className="mx-auto max-w-2xl text-center lg:mx-0 lg:text-left">
+              <h1 className="mb-6 font-bold text-4xl text-slate-900 leading-[1.25] tracking-tight sm:text-5xl md:text-6xl">
+                <span className="text-primary">「いつヒマ？」</span>で<br />
+                日程調整しよう
+              </h1>
+              <p className="mx-auto max-w-lg text-lg text-slate-600 lg:mx-0">
+                とりあえずみんなの空いている時間を訊いてから、何を何時間やるか決めたい。そんな仲間うちでの調整に最適な、シンプルで直感的なツールです。
+              </p>
+              <NavLink
+                to="/new"
+                className="hover:-translate-y-0.5 mt-8 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-8 py-3.5 font-bold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+              >
+                イベントを作成
+                <LuChevronRight className="h-4 w-4" />
+              </NavLink>
+            </div>
+
+            <div className="mx-auto w-full max-w-[320px] lg:max-w-[400px]">
+              <img src="/mock-mobile.png" alt="App Screenshot" className="h-auto w-full object-cover" />
+            </div>
+          </div>
         </div>
       </div>
     </section>
@@ -42,41 +39,48 @@ function HeroSection() {
 function FeaturesSection() {
   const features = [
     {
-      icon: "🚫",
-      title: "候補日程の設定なし",
-      description: "みんなが空いている時間を選ぶだけなので、主催者が候補日程を設定する必要がありません。",
+      icon: <LuCircleCheck className="h-6 w-6 text-emerald-500" />,
+      title: "候補日程は不要",
+      description:
+        "参加者が各々の空いている日程を入力することで日程調整を行います。幹事が候補日程を大量に作成する必要はありません。",
+      color: "bg-emerald-50",
     },
     {
-      icon: "🔗",
-      title: "URLで簡単共有",
-      description: "作成したイベントのURLをコピーして友達に送れば、すぐに日程調整が可能です。",
+      icon: <LuPalette className="h-6 w-6 text-primary" />,
+      title: "複数の参加形態に対応",
+      description: "「対面」「オンライン」など、複数の参加形態を自由に設定可能です。",
+      color: "bg-primary/10",
     },
     {
-      icon: "📱",
-      title: "直感的な操作",
-      description: "複数日程も一気にドラッグで選択可能。スマホでも簡単に操作できます。",
+      icon: <LuSmartphone className="h-6 w-6 text-blue-500" />,
+      title: "スマホでも簡単に入力可能",
+      description: "スマホでも、複数の日程をドラッグで一気に選択可能です。",
+      color: "bg-blue-50",
     },
-  ];
+  ] as const;
 
   return (
-    <section className="bg-white px-4 py-16">
-      <div className="mx-auto max-w-6xl">
-        <div className="mb-16 text-center">
-          <h2 className="mb-4 font-bold text-3xl text-gray-800">イツヒマの特長</h2>
-          <p className="text-gray-600 text-md">仲間うちでのスムーズな日程調整に特化</p>
-        </div>
-
-        <div className="grid gap-8 md:grid-cols-2 lg:grid-cols-3">
-          {features.map((feature) => (
-            <div
-              key={feature.title}
-              className="rounded-xl bg-gray-50 p-6 transition-shadow duration-300 hover:shadow-lg"
-            >
-              <div className="mb-4 text-4xl">{feature.icon}</div>
-              <h3 className="mb-3 font-semibold text-gray-800 text-xl">{feature.title}</h3>
-              <p className="text-gray-600 leading-relaxed">{feature.description}</p>
-            </div>
-          ))}
+    <section id="features">
+      <div className="bg-white py-24">
+        <div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
+          <div className="mx-auto text-center">
+            <h2 className="font-bold text-3xl text-slate-900 sm:text-4xl">イツヒマの特徴</h2>
+            <p className="mt-4 text-lg text-slate-600">イツヒマは仲間うちでのスムーズな日程調整に特化しています。</p>
+          </div>
+          <div className="mt-16 grid gap-8 md:grid-cols-3">
+            {features.map((feature) => (
+              <div
+                key={feature.title}
+                className="flex flex-col rounded-2xl border border-slate-100 bg-white p-8 shadow-sm"
+              >
+                <div className={`inline-flex h-14 w-14 items-center justify-center rounded-xl ${feature.color}`}>
+                  {feature.icon}
+                </div>
+                <h3 className="mt-6 font-bold text-slate-900 text-xl">{feature.title}</h3>
+                <p className="mt-3 text-slate-600">{feature.description}</p>
+              </div>
+            ))}
+          </div>
         </div>
       </div>
     </section>
@@ -85,36 +89,35 @@ function FeaturesSection() {
 
 function Footer() {
   return (
-    <footer className="bg-primary px-4 py-12 text-white">
-      <div className="mx-auto max-w-6xl">
-        <div className="grid gap-8 md:grid-cols-2 md:gap-16">
+    <footer className="bg-slate-900 py-12 text-slate-300">
+      <div className="mx-auto max-w-7xl px-6 sm:px-8 lg:px-10">
+        <div className="grid gap-12 md:grid-cols-2 lg:gap-24">
           <div>
-            <h3 className="mb-4 font-bold text-xl">イツヒマについて</h3>
-            <p className="text-sm leading-relaxed opacity-90">
-              イツヒマは、「いつヒマ？」で日程調整できるツールです。
-              <br />
-              候補日程の設定なしで、仲間うちでの日程調整をスムーズに行うことができます。
-            </p>
+            <div className="flex items-center gap-2 text-white">
+              <img src="/logo-white.svg" alt="イツヒマ" className="h-6 w-6" />
+              <span className="font-bold font-mplus text-xl tracking-tight">イツヒマ</span>
+            </div>
+            <p className="mt-6 max-w-md text-slate-400 text-sm">「いつヒマ？」で日程調整しよう</p>
           </div>
           <div>
-            <h3 className="mb-4 font-bold text-xl">リンク</h3>
-            <ul className="space-y-2 text-sm">
+            <h3 className="font-bold text-sm text-white">サポート</h3>
+            <ul className="mt-4 text-sm">
               <li>
                 <a
-                  href="https://utcode.notion.site/1e4ca5f557bc80f2b697ca7b9342dc89?pvs=4"
+                  href={EXTERNAL_LINKS.GUIDE}
                   target="_blank"
                   rel="noreferrer noopener"
-                  className="block opacity-90 transition-opacity duration-200 hover:opacity-100"
+                  className="hover:text-slate-400"
                 >
-                  使い方ページ
+                  使い方
                 </a>
               </li>
-              <li>
+              <li className="mt-3">
                 <a
-                  href="https://forms.gle/AB6xbgKjnDv5m1nm6"
+                  href={EXTERNAL_LINKS.FEEDBACK}
                   target="_blank"
                   rel="noreferrer noopener"
-                  className="block opacity-90 transition-opacity duration-200 hover:opacity-100"
+                  className="hover:text-slate-400"
                 >
                   ご意見・バグ報告
                 </a>
@@ -122,10 +125,23 @@ function Footer() {
             </ul>
           </div>
         </div>
-        <div className="mt-8 border-white/20 border-t pt-8 text-center">
-          <p className="text-sm opacity-75">© 2024 イツヒマ (アルファ版)</p>
+        <div className="mt-12 border-slate-800 border-t pt-8 text-center text-slate-500 text-xs">
+          <p>&copy; {new Date().getFullYear()} イツヒマ All rights reserved.</p>
         </div>
       </div>
     </footer>
   );
 }
+
+export default function LandingPage() {
+  return (
+    <div className="min-h-screen bg-slate-50 text-slate-900">
+      <Header />
+      <main>
+        <HeroSection />
+        <FeaturesSection />
+      </main>
+      <Footer />
+    </div>
+  );
+}

From 0ddb3f16cdb3456decd36f063bfeea16ae916cb4 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 14:38:29 +0900
Subject: [PATCH 08/32] =?UTF-8?q?Header=20=E3=82=92=E5=BE=AE=E8=AA=BF?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Header.tsx | 46 +++++++++++++++-----------------
 1 file changed, 22 insertions(+), 24 deletions(-)

diff --git a/client/src/components/Header.tsx b/client/src/components/Header.tsx
index 5a2c409..e506999 100644
--- a/client/src/components/Header.tsx
+++ b/client/src/components/Header.tsx
@@ -7,19 +7,20 @@ export default function Header() {
   const [isMenuOpen, setIsMenuOpen] = useState(false);
 
   return (
-    <header className="sticky top-0 z-50 w-full border-slate-200/60 border-b bg-white/80 backdrop-blur-md">
-      <div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
-        <div className="flex items-center gap-2">
-          <NavLink to="/" className="flex items-center gap-2 transition-opacity hover:opacity-80">
-            <img src="/logo.svg" alt="イツヒマ" className="h-6 w-6" />
-            <span className="font-bold font-mplus text-slate-800 text-xl tracking-tight">イツヒマ</span>
-            <span className="hidden rounded-full bg-slate-100 px-2 py-0.5 font-medium text-[10px] text-slate-500 sm:inline-block">
-              アルファ版
-            </span>
-          </NavLink>
-        </div>
+    <header className="sticky top-0 z-50 w-full border-slate-200 border-b bg-white">
+      <div className="flex h-16 w-full max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
+        <NavLink to="/" className="flex items-center gap-2 transition-opacity hover:opacity-80">
+          <img src="/logo.svg" alt="イツヒマ" className="h-6 w-6" />
+          <span className="font-bold font-mplus text-slate-800 text-xl tracking-tight">イツヒマ</span>
+          <span className="rounded-full bg-slate-100 px-2 py-0.5 font-medium text-[10px] text-slate-500">
+            アルファ版
+          </span>
+        </NavLink>
 
         <nav className="hidden items-center gap-6 md:flex">
+          <NavLink to="/home" className="font-medium text-slate-600 text-sm transition-colors hover:text-primary">
+            ホーム
+          </NavLink>
           <a
             href={EXTERNAL_LINKS.GUIDE}
             target="_blank"
@@ -28,25 +29,16 @@ export default function Header() {
           >
             使い方
           </a>
-          <NavLink to="/home" className="font-medium text-slate-600 text-sm transition-colors hover:text-primary">
-            ホーム
-          </NavLink>
-          <div className="h-4 w-px bg-slate-200" />
+          <div className="h-4 w-[1px] bg-slate-200" />
           <NavLink
             to="/new"
-            className="inline-flex items-center justify-center rounded-full bg-primary px-4 py-2 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+            className="inline-flex items-center justify-center rounded-full bg-primary px-4 py-2 font-bold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
           >
             イベント作成
           </NavLink>
         </nav>
 
-        <div className="flex items-center gap-2 md:hidden">
-          <NavLink
-            to="/new"
-            className="inline-flex items-center justify-center rounded-full bg-primary px-3 py-1.5 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
-          >
-            イベント作成
-          </NavLink>
+        <div className="flex items-center md:hidden">
           <button
             type="button"
             className="rounded-md p-2 text-slate-600 hover:bg-slate-100"
@@ -59,7 +51,7 @@ export default function Header() {
 
       {isMenuOpen && (
         <div className="absolute top-16 left-0 w-full border-slate-100 border-b bg-white shadow-lg md:hidden">
-          <div className="space-y-1 px-4 pt-2 pb-4">
+          <div className="flex flex-col gap-1 px-4 pt-2 pb-4">
             <NavLink
               to="/home"
               className="block rounded-md px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
@@ -83,6 +75,12 @@ export default function Header() {
             >
               ご意見・バグ報告
             </a>
+            <NavLink
+              to="/new"
+              className="my-2 inline-flex items-center justify-center rounded-full bg-primary px-3 py-1.5 font-bold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+            >
+              イベント作成
+            </NavLink>
           </div>
         </div>
       )}

From 5037f49b5fa07cc29647063b767b54c67863a821 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 15:27:24 +0900
Subject: [PATCH 09/32] =?UTF-8?q?=E3=83=AA=E3=83=B3=E3=82=AF=E3=82=92?=
 =?UTF-8?q?=E7=B5=B1=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index a42263d..f36f146 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -20,11 +20,10 @@ import Header from "../components/Header";
 import { projectReviver } from "../revivers";
 import type { Project } from "../types";
 import { API_ENDPOINT, FRONTEND_ORIGIN } from "../utils";
+import { EXTERNAL_LINKS } from "../constants/links";
 
 const client = hc<AppType>(API_ENDPOINT);
 
-const GUIDE_URL = "https://utcode.notion.site/1e4ca5f557bc80f2b697ca7b9342dc89?pvs=4";
-
 export default function ProjectPage() {
   const { eventId } = useParams();
   const navigate = useNavigate();
@@ -358,7 +357,7 @@ export default function ProjectPage() {
                       <br />
                       詳しくは、
                       <a
-                        href={GUIDE_URL}
+                        href={EXTERNAL_LINKS.GUIDE}
                         target="_blank"
                         rel="noreferrer noopener"
                         className="font-medium text-primary underline hover:text-primary/80"

From ffed6b0bace9129f59d746bc385f073f66e95815 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 16:15:38 +0900
Subject: [PATCH 10/32] =?UTF-8?q?=E6=88=BB=E3=82=8B=E3=83=95=E3=83=AD?=
 =?UTF-8?q?=E3=83=BC=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/NotFound.tsx           | 26 ++++-------
 client/src/pages/Project.tsx            | 11 +++--
 client/src/pages/eventId/Submission.tsx | 61 ++++++++++++-------------
 3 files changed, 43 insertions(+), 55 deletions(-)

diff --git a/client/src/pages/NotFound.tsx b/client/src/pages/NotFound.tsx
index e21e829..7bd1b11 100644
--- a/client/src/pages/NotFound.tsx
+++ b/client/src/pages/NotFound.tsx
@@ -1,4 +1,4 @@
-import { LuArrowLeft, LuCircleAlert, LuHouse } from "react-icons/lu";
+import { LuCircleAlert, LuHouse } from "react-icons/lu";
 import { NavLink } from "react-router";
 import Header from "../components/Header";
 
@@ -16,23 +16,13 @@ export default function NotFoundPage() {
           <p className="mb-8 max-w-md text-slate-600">
             お探しのページは存在しないか、移動または削除された可能性があります。
           </p>
-          <div className="flex flex-col gap-4 sm:flex-row">
-            <NavLink
-              to="/home"
-              className="hover:-translate-y-0.5 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-6 py-3 font-semibold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
-            >
-              <LuHouse className="h-5 w-5" />
-              ホームに戻る
-            </NavLink>
-            <button
-              type="button"
-              onClick={() => window.history.back()}
-              className="inline-flex items-center justify-center gap-2 rounded-xl border-2 border-slate-200 bg-white px-6 py-3 font-semibold text-base text-slate-700 transition-all hover:border-slate-300 hover:bg-slate-50"
-            >
-              <LuArrowLeft className="h-5 w-5" />
-              前のページに戻る
-            </button>
-          </div>
+          <NavLink
+            to="/home"
+            className="hover:-translate-y-0.5 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-6 py-3 font-semibold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
+          >
+            <LuHouse className="h-5 w-5" />
+            ホームに戻る
+          </NavLink>
         </div>
       </main>
     </div>
diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index f36f146..e765abc 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -11,16 +11,17 @@ import {
   HiOutlineExclamationCircle,
   HiOutlineTrash,
 } from "react-icons/hi";
+import { LuChevronLeft } from "react-icons/lu";
 import { NavLink, useNavigate, useParams } from "react-router";
 import type { z } from "zod";
 import { DEFAULT_PARTICIPATION_OPTION, generateDistinctColor } from "../../../common/colors";
 import { editReqSchema, projectReqSchema } from "../../../common/validators";
 import type { AppType } from "../../../server/src/main";
 import Header from "../components/Header";
+import { EXTERNAL_LINKS } from "../constants/links";
 import { projectReviver } from "../revivers";
 import type { Project } from "../types";
 import { API_ENDPOINT, FRONTEND_ORIGIN } from "../utils";
-import { EXTERNAL_LINKS } from "../constants/links";
 
 const client = hc<AppType>(API_ENDPOINT);
 
@@ -279,6 +280,7 @@ export default function ProjectPage() {
             <span className="loading loading-dots loading-md text-slate-400" />
           </div>
         ) : eventId !== undefined && !project ? (
+          // TODO: NotFound に統一？
           <div className="mx-auto max-w-4xl px-4 py-16 sm:px-6 lg:px-8">
             <div className="flex min-h-[400px] flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
               <p className="text-base text-slate-600 sm:text-xl">イベントが見つかりませんでした。</p>
@@ -690,16 +692,17 @@ export default function ProjectPage() {
                 {eventId ? (
                   <NavLink
                     to={`/e/${eventId}`}
-                    className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-4 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-6 sm:py-2.5"
+                    className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2.5"
                   >
-                    日程調整に戻る
+                    <LuChevronLeft size={16} className="sm:h-5 sm:w-5" />
+                    <span>日程調整に戻る</span>
                   </NavLink>
                 ) : (
                   <NavLink
                     to="/home"
                     className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-4 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-6 sm:py-2.5"
                   >
-                    ホームに戻る
+                    キャンセル
                   </NavLink>
                 )}
                 <button
diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index 9c9a343..861a123 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -1,12 +1,7 @@
 import { hc } from "hono/client";
 import { useCallback, useEffect, useMemo, useState } from "react";
-import {
-  HiOutlineCheckCircle,
-  HiOutlineCog,
-  HiOutlineExclamationCircle,
-  HiOutlineHome,
-  HiPencil,
-} from "react-icons/hi";
+import { HiOutlineCheckCircle, HiOutlineExclamationCircle, HiPencil } from "react-icons/hi";
+import { LuChevronLeft, LuSettings } from "react-icons/lu";
 import { NavLink, useParams } from "react-router";
 import type { AppType } from "../../../../server/src/main";
 import { Calendar } from "../../components/Calendar";
@@ -255,15 +250,6 @@ export default function SubmissionPage() {
             <div className="mx-auto flex w-full max-w-7xl flex-1 flex-col px-4 pt-3 pb-3 sm:px-6 sm:pt-4 sm:pb-3 lg:px-8">
               <div className="mb-2 flex items-center justify-between sm:mb-3">
                 <h1 className="truncate font-bold text-base text-slate-900 sm:text-lg">{project.name}</h1>
-                {isHost && (
-                  <NavLink
-                    to={`/e/${projectId}/edit`}
-                    className="ml-2 inline-flex shrink-0 items-center justify-center gap-1 rounded-lg border border-slate-200 bg-white px-2 py-1 font-medium text-slate-600 text-xs transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-1.5 sm:px-2.5 sm:py-1.5"
-                  >
-                    <HiOutlineCog size={14} />
-                    <span className="hidden sm:inline">設定</span>
-                  </NavLink>
-                )}
               </div>
 
               {project.description && (
@@ -338,8 +324,7 @@ export default function SubmissionPage() {
                           }
                         }}
                       >
-                        <span className="hidden sm:inline">キャンセル</span>
-                        <span className="sm:hidden">×</span>
+                        <span>キャンセル</span>
                       </button>
                     )}
                     <button
@@ -367,22 +352,32 @@ export default function SubmissionPage() {
                       to="/home"
                       className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2.5"
                     >
-                      <HiOutlineHome size={16} className="sm:h-5 sm:w-5" />
-                      <span className="hidden sm:inline">ホームに戻る</span>
-                      <span className="sm:hidden">ホーム</span>
+                      <LuChevronLeft size={16} className="sm:h-5 sm:w-5" />
+                      <span>ホームに戻る</span>
                     </NavLink>
-                    <button
-                      type="button"
-                      className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:gap-2 sm:px-6 sm:py-2.5"
-                      disabled={loading}
-                      onClick={() => {
-                        setEditMode(true);
-                      }}
-                    >
-                      <HiPencil size={16} className="sm:h-5 sm:w-5" />
-                      <span className="hidden sm:inline">日程を更新する</span>
-                      <span className="sm:hidden">更新</span>
-                    </button>
+                    <div className="flex items-center gap-2">
+                      {isHost && (
+                        <NavLink
+                          to={`/e/${projectId}/edit`}
+                          className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-primary bg-white px-3 py-2 font-semibold text-primary text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2.5"
+                        >
+                          <LuSettings size={16} className="sm:h-5 sm:w-5" />
+                          <span>管理</span>
+                        </NavLink>
+                      )}
+                      <button
+                        type="button"
+                        className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:gap-2 sm:px-6 sm:py-2.5"
+                        disabled={loading}
+                        onClick={() => {
+                          setEditMode(true);
+                        }}
+                      >
+                        <HiPencil size={16} className="sm:h-5 sm:w-5" />
+                        <span className="hidden sm:inline">日程を更新する</span>
+                        <span className="sm:hidden">日程更新</span>
+                      </button>
+                    </div>
                   </div>
                 )}
               </div>

From c3252321c6bfbe2d14907e4c292114614218d214 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 16:29:24 +0900
Subject: [PATCH 11/32] =?UTF-8?q?=E3=82=A2=E3=82=A4=E3=82=B3=E3=83=B3?=
 =?UTF-8?q?=E3=82=92=20Lucide=20=E3=81=AB=E7=B5=B1=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx            | 30 ++++++++++++-------------
 client/src/pages/eventId/Submission.tsx |  9 ++++----
 2 files changed, 19 insertions(+), 20 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index e765abc..9937f83 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -4,14 +4,14 @@ import { hc } from "hono/client";
 import { useCallback, useEffect, useState } from "react";
 import { useFieldArray, useForm } from "react-hook-form";
 import {
-  HiClipboardCheck,
-  HiClipboardCopy,
-  HiInformationCircle,
-  HiOutlineCheckCircle,
-  HiOutlineExclamationCircle,
-  HiOutlineTrash,
-} from "react-icons/hi";
-import { LuChevronLeft } from "react-icons/lu";
+  LuChevronLeft,
+  LuCircleAlert,
+  LuCircleCheck,
+  LuClipboard,
+  LuClipboardCheck,
+  LuInfo,
+  LuTrash2,
+} from "react-icons/lu";
 import { NavLink, useNavigate, useParams } from "react-router";
 import type { z } from "zod";
 import { DEFAULT_PARTICIPATION_OPTION, generateDistinctColor } from "../../../common/colors";
@@ -345,7 +345,7 @@ export default function ProjectPage() {
                   onClick={() => setIsInfoExpanded(!isInfoExpanded)}
                 >
                   <div className="flex items-center gap-2 font-medium text-sm">
-                    <HiInformationCircle className="h-5 w-5" />
+                    <LuInfo className="h-5 w-5" />
                     開始日・終了日／時間帯について
                   </div>
                   <span className={`transition-transform ${isInfoExpanded ? "rotate-180" : ""}`}>▼</span>
@@ -601,7 +601,7 @@ export default function ProjectPage() {
                                   className={`rounded-lg p-2 text-red-600 transition-colors hover:bg-red-50 sm:p-2.5 ${cannotDelete ? "cursor-not-allowed opacity-40" : ""}`}
                                   disabled={cannotDelete}
                                 >
-                                  <HiOutlineTrash size={18} className="sm:h-5 sm:w-5" />
+                                  <LuTrash2 size={18} className="sm:h-5 sm:w-5" />
                                 </button>
                               </div>
                             </div>
@@ -679,7 +679,7 @@ export default function ProjectPage() {
                       }
                     }}
                   >
-                    <HiOutlineTrash size={16} className="sm:h-5 sm:w-5" />
+                    <LuTrash2 size={16} className="sm:h-5 sm:w-5" />
                     イベントを削除する
                   </button>
                 </div>
@@ -747,9 +747,9 @@ export default function ProjectPage() {
                 disabled={copied}
               >
                 {!copied ? (
-                  <HiClipboardCopy size={16} className="sm:h-5 sm:w-5" />
+                  <LuClipboard size={16} className="sm:h-5 sm:w-5" />
                 ) : (
-                  <HiClipboardCheck size={16} className="sm:h-5 sm:w-5" />
+                  <LuClipboardCheck size={16} className="sm:h-5 sm:w-5" />
                 )}{" "}
                 <span className="hidden sm:inline">コピー</span>
               </button>
@@ -771,12 +771,12 @@ export default function ProjectPage() {
         <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
             <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
-              <HiOutlineCheckCircle size={24} className="shrink-0 text-emerald-600" />
+              <LuCircleCheck size={24} className="shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
             </div>
           ) : (
             <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
-              <HiOutlineExclamationCircle size={24} className="shrink-0 text-red-600" />
+              <LuCircleAlert size={24} className="shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
             </div>
           )}
diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index 861a123..873dc38 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -1,7 +1,6 @@
 import { hc } from "hono/client";
 import { useCallback, useEffect, useMemo, useState } from "react";
-import { HiOutlineCheckCircle, HiOutlineExclamationCircle, HiPencil } from "react-icons/hi";
-import { LuChevronLeft, LuSettings } from "react-icons/lu";
+import { LuChevronLeft, LuCircleAlert, LuCircleCheck, LuPencil, LuSettings } from "react-icons/lu";
 import { NavLink, useParams } from "react-router";
 import type { AppType } from "../../../../server/src/main";
 import { Calendar } from "../../components/Calendar";
@@ -373,7 +372,7 @@ export default function SubmissionPage() {
                           setEditMode(true);
                         }}
                       >
-                        <HiPencil size={16} className="sm:h-5 sm:w-5" />
+                        <LuPencil size={16} className="sm:h-5 sm:w-5" />
                         <span className="hidden sm:inline">日程を更新する</span>
                         <span className="sm:hidden">日程更新</span>
                       </button>
@@ -390,12 +389,12 @@ export default function SubmissionPage() {
         <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
             <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
-              <HiOutlineCheckCircle size={24} className="shrink-0 text-emerald-600" />
+              <LuCircleCheck size={24} className="shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
             </div>
           ) : (
             <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
-              <HiOutlineExclamationCircle size={24} className="shrink-0 text-red-600" />
+              <LuCircleAlert size={24} className="shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
             </div>
           )}

From c60f0be20ae8e51615b9ffb8ae9f284f787e935b Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 17:09:33 +0900
Subject: [PATCH 12/32] =?UTF-8?q?description=20=E3=81=8C=E9=95=B7=E3=81=84?=
 =?UTF-8?q?=E5=A0=B4=E5=90=88=E3=81=AF=E7=9C=81=E7=95=A5=E8=A1=A8=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/eventId/Submission.tsx | 80 +++++++++++++++++++++++--
 1 file changed, 76 insertions(+), 4 deletions(-)

diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index 873dc38..b2662be 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -1,6 +1,14 @@
 import { hc } from "hono/client";
 import { useCallback, useEffect, useMemo, useState } from "react";
-import { LuChevronLeft, LuCircleAlert, LuCircleCheck, LuPencil, LuSettings } from "react-icons/lu";
+import {
+  LuChevronDown,
+  LuChevronLeft,
+  LuChevronUp,
+  LuCircleAlert,
+  LuCircleCheck,
+  LuPencil,
+  LuSettings,
+} from "react-icons/lu";
 import { NavLink, useParams } from "react-router";
 import type { AppType } from "../../../../server/src/main";
 import { Calendar } from "../../components/Calendar";
@@ -13,6 +21,41 @@ const client = hc<AppType>(API_ENDPOINT);
 
 export type EditingSlot = Pick<Slot, "from" | "to" | "participationOptionId">;
 
+/**
+ * テキストを簡易的に切り詰める。
+ * - ASCII なら 1, 非 ASCII なら 2。
+ * - 改行コード数も考慮。
+ */
+const truncateText = (text: string, maxWidth = 80, maxLines = 3): { text: string; truncated: boolean } => {
+  const lines = text.split("\n");
+  let width = 0;
+  let result = "";
+  let lineCount = 0;
+
+  for (const line of lines) {
+    if (lineCount >= maxLines) {
+      return { text: `${result.trimEnd()}…`, truncated: true };
+    }
+
+    if (lineCount > 0) {
+      result += "\n";
+    }
+
+    for (const char of line) {
+      const charWidth = char.charCodeAt(0) < 128 ? 1 : 2;
+      if (width + charWidth > maxWidth) {
+        return { text: `${result.trimEnd()}…`, truncated: true };
+      }
+      width += charWidth;
+      result += char;
+    }
+
+    lineCount++;
+  }
+
+  return { text: result, truncated: false };
+};
+
 const hexToRgb = (hex: string): { r: number; g: number; b: number } | null => {
   const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
   return result
@@ -96,6 +139,8 @@ export default function SubmissionPage() {
 
   const [selectedParticipationOptionId, setSelectedParticipationOptionId] = useState<string | null>(null);
 
+  const [descriptionExpanded, setDescriptionExpanded] = useState(false);
+
   const [toast, setToast] = useState<{
     message: string;
     variant: "success" | "error";
@@ -251,9 +296,36 @@ export default function SubmissionPage() {
                 <h1 className="truncate font-bold text-base text-slate-900 sm:text-lg">{project.name}</h1>
               </div>
 
-              {project.description && (
-                <p className="mb-4 whitespace-pre-wrap text-slate-600 text-sm">{project.description}</p>
-              )}
+              {project.description &&
+                (() => {
+                  const { text: truncatedText, truncated } = truncateText(project.description);
+                  return (
+                    <div className="mb-4">
+                      <p className="whitespace-pre-wrap text-slate-600 text-sm">
+                        {descriptionExpanded ? project.description : truncatedText}
+                      </p>
+                      {truncated && (
+                        <button
+                          type="button"
+                          onClick={() => setDescriptionExpanded(!descriptionExpanded)}
+                          className="mt-1 inline-flex items-center gap-0.5 text-primary text-sm hover:underline"
+                        >
+                          {descriptionExpanded ? (
+                            <>
+                              閉じる
+                              <LuChevronUp size={16} />
+                            </>
+                          ) : (
+                            <>
+                              もっと見る
+                              <LuChevronDown size={16} />
+                            </>
+                          )}
+                        </button>
+                      )}
+                    </div>
+                  );
+                })()}
 
               {editMode && project.participationOptions.length > 1 && selectedParticipationOptionId !== null && (
                 <div className="mb-2 flex flex-wrap items-center gap-1.5 sm:mb-3 sm:gap-2">

From 98ab2a890cb813152c8f223325ec2eaf4e5e08ce Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 18:12:12 +0900
Subject: [PATCH 13/32] =?UTF-8?q?=E3=83=9C=E3=82=BF=E3=83=B3=E3=82=92=20da?=
 =?UTF-8?q?isyUI=20=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Header.tsx        | 10 +----
 client/src/index.css                    | 15 +++++++-
 client/src/pages/Home.tsx               |  5 +--
 client/src/pages/Landing.tsx            |  7 +---
 client/src/pages/NotFound.tsx           |  5 +--
 client/src/pages/Project.tsx            | 43 +++++++---------------
 client/src/pages/eventId/Submission.tsx | 49 +++++++++++++------------
 7 files changed, 58 insertions(+), 76 deletions(-)

diff --git a/client/src/components/Header.tsx b/client/src/components/Header.tsx
index e506999..5a881a8 100644
--- a/client/src/components/Header.tsx
+++ b/client/src/components/Header.tsx
@@ -30,10 +30,7 @@ export default function Header() {
             使い方
           </a>
           <div className="h-4 w-[1px] bg-slate-200" />
-          <NavLink
-            to="/new"
-            className="inline-flex items-center justify-center rounded-full bg-primary px-4 py-2 font-bold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
-          >
+          <NavLink to="/new" className="btn btn-primary">
             イベント作成
           </NavLink>
         </nav>
@@ -75,10 +72,7 @@ export default function Header() {
             >
               ご意見・バグ報告
             </a>
-            <NavLink
-              to="/new"
-              className="my-2 inline-flex items-center justify-center rounded-full bg-primary px-3 py-1.5 font-bold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
-            >
+            <NavLink to="/new" className="btn btn-primary btn-sm my-3">
               イベント作成
             </NavLink>
           </div>
diff --git a/client/src/index.css b/client/src/index.css
index 4f1b301..8b21482 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -15,7 +15,20 @@
 }
 
 .btn {
-  font-weight: normal;
+  font-weight: bold;
+  @apply rounded-lg transition-all;
+}
+
+.btn-primary {
+  @apply bg-primary text-white shadow-sm hover:bg-primary/90 hover:shadow-md;
+}
+
+.btn-outline {
+  @apply border-2 border-slate-200 bg-white text-slate-700 hover:border-slate-300 hover:bg-slate-50;
+}
+
+.btn-ghost {
+  @apply bg-transparent hover:bg-slate-50;
 }
 
 :root {
diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index 335e180..7372fe2 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -70,10 +70,7 @@ export default function HomePage() {
               <h1 className="font-bold text-2xl text-slate-900 tracking-tight sm:text-3xl">ホーム</h1>
               <p className="mt-1 text-slate-500 text-sm">参加・主催しているイベントの管理</p>
             </div>
-            <NavLink
-              to="/new"
-              className="inline-flex items-center justify-center gap-2 rounded-lg bg-primary px-4 py-2.5 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md"
-            >
+            <NavLink to="/new" className="btn btn-primary w-full gap-2 sm:w-auto">
               <LuPlus className="h-4 w-4" />
               新規作成
             </NavLink>
diff --git a/client/src/pages/Landing.tsx b/client/src/pages/Landing.tsx
index 38d47f6..06d04fa 100644
--- a/client/src/pages/Landing.tsx
+++ b/client/src/pages/Landing.tsx
@@ -17,12 +17,9 @@ function HeroSection() {
               <p className="mx-auto max-w-lg text-lg text-slate-600 lg:mx-0">
                 とりあえずみんなの空いている時間を訊いてから、何を何時間やるか決めたい。そんな仲間うちでの調整に最適な、シンプルで直感的なツールです。
               </p>
-              <NavLink
-                to="/new"
-                className="hover:-translate-y-0.5 mt-8 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-8 py-3.5 font-bold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
-              >
+              <NavLink to="/new" className="btn btn-primary btn-lg hover:-translate-y-0.5 mt-8 gap-2 px-8 py-6">
                 イベントを作成
-                <LuChevronRight className="h-4 w-4" />
+                <LuChevronRight className="h-6 w-6" />
               </NavLink>
             </div>
 
diff --git a/client/src/pages/NotFound.tsx b/client/src/pages/NotFound.tsx
index 7bd1b11..1fa1fdf 100644
--- a/client/src/pages/NotFound.tsx
+++ b/client/src/pages/NotFound.tsx
@@ -16,10 +16,7 @@ export default function NotFoundPage() {
           <p className="mb-8 max-w-md text-slate-600">
             お探しのページは存在しないか、移動または削除された可能性があります。
           </p>
-          <NavLink
-            to="/home"
-            className="hover:-translate-y-0.5 inline-flex items-center justify-center gap-2 rounded-xl bg-primary px-6 py-3 font-semibold text-base text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2"
-          >
+          <NavLink to="/home" className="btn btn-primary btn-lg gap-2">
             <LuHouse className="h-5 w-5" />
             ホームに戻る
           </NavLink>
diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index 9937f83..f93da25 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -5,6 +5,7 @@ import { useCallback, useEffect, useState } from "react";
 import { useFieldArray, useForm } from "react-hook-form";
 import {
   LuChevronLeft,
+  LuChevronRight,
   LuCircleAlert,
   LuCircleCheck,
   LuClipboard,
@@ -284,10 +285,7 @@ export default function ProjectPage() {
           <div className="mx-auto max-w-4xl px-4 py-16 sm:px-6 lg:px-8">
             <div className="flex min-h-[400px] flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
               <p className="text-base text-slate-600 sm:text-xl">イベントが見つかりませんでした。</p>
-              <NavLink
-                to="/"
-                className="inline-flex items-center justify-center gap-2 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md sm:px-6 sm:py-2.5"
-              >
+              <NavLink to="/" className="btn btn-primary">
                 ホームに戻る
               </NavLink>
             </div>
@@ -630,7 +628,7 @@ export default function ProjectPage() {
                           color: generateDistinctColor(existingColors),
                         });
                       }}
-                      className="mt-4 inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-medium text-slate-700 text-xs transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2 sm:text-sm"
+                      className="btn btn-outline btn-sm sm:btn-md mt-4"
                     >
                       + 参加形態を追加
                     </button>
@@ -646,7 +644,7 @@ export default function ProjectPage() {
                   <button
                     type="button"
                     id="delete-button"
-                    className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-red-600 px-3 py-2 font-semibold text-white text-xs transition-all hover:bg-red-700 sm:gap-2 sm:px-4 sm:py-2 sm:text-sm"
+                    className="btn btn-sm sm:btn-md gap-1.5 bg-red-600 text-white hover:bg-red-700 sm:gap-2"
                     onClick={async () => {
                       if (confirm("本当にこのイベントを削除しますか？")) {
                         try {
@@ -690,27 +688,16 @@ export default function ProjectPage() {
             <div className="fixed right-0 bottom-0 left-0 z-10 border-slate-200 border-t bg-white/95 px-4 py-3 shadow-lg backdrop-blur-sm sm:py-4">
               <div className="mx-auto flex max-w-4xl items-center justify-between gap-2 sm:gap-4">
                 {eventId ? (
-                  <NavLink
-                    to={`/e/${eventId}`}
-                    className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2.5"
-                  >
+                  <NavLink to={`/e/${eventId}`} className="btn btn-outline gap-1.5 sm:gap-2">
                     <LuChevronLeft size={16} className="sm:h-5 sm:w-5" />
                     <span>日程調整に戻る</span>
                   </NavLink>
                 ) : (
-                  <NavLink
-                    to="/home"
-                    className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-4 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-6 sm:py-2.5"
-                  >
+                  <NavLink to="/home" className="btn btn-outline">
                     キャンセル
                   </NavLink>
                 )}
-                <button
-                  type="submit"
-                  form="project-form"
-                  className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:gap-2 sm:px-6 sm:py-2.5"
-                  disabled={!isValid || !isDirty}
-                >
+                <button type="submit" form="project-form" className="btn btn-primary" disabled={!isValid || !isDirty}>
                   イベントを{project ? "更新" : "作成"}する
                 </button>
               </div>
@@ -743,25 +730,21 @@ export default function ProjectPage() {
                     setCopied(false);
                   }, 2000);
                 }}
-                className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-primary bg-white px-3 py-2 font-semibold text-primary text-xs transition-all hover:bg-primary/5 sm:gap-2 sm:px-4 sm:py-2 sm:text-sm"
+                className="btn btn-outline btn-sm sm:btn-md gap-1.5"
                 disabled={copied}
               >
                 {!copied ? (
                   <LuClipboard size={16} className="sm:h-5 sm:w-5" />
                 ) : (
                   <LuClipboardCheck size={16} className="sm:h-5 sm:w-5" />
-                )}{" "}
+                )}
                 <span className="hidden sm:inline">コピー</span>
               </button>
             </div>
-            <div className="flex justify-end">
-              <NavLink
-                className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl sm:gap-2 sm:px-6 sm:py-2.5"
-                to={`/e/${dialogStatus.projectId}`}
-              >
-                イベントへ
-              </NavLink>
-            </div>
+            <NavLink className="btn btn-primary w-full" to={`/e/${dialogStatus.projectId}`}>
+              イベントへ
+              <LuChevronRight size={16} className="ml-1 sm:h-5 sm:w-5" />
+            </NavLink>
           </div>
         </div>
       )}
diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index b2662be..c6d2335 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -7,7 +7,9 @@ import {
   LuCircleAlert,
   LuCircleCheck,
   LuPencil,
+  LuSend,
   LuSettings,
+  LuSettings2,
 } from "react-icons/lu";
 import { NavLink, useParams } from "react-router";
 import type { AppType } from "../../../../server/src/main";
@@ -277,10 +279,7 @@ export default function SubmissionPage() {
           <div className="mx-auto flex w-full max-w-7xl flex-col items-center justify-center gap-4 px-4 py-16 sm:px-6 lg:px-8">
             <div className="flex min-h-[400px] w-full flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
               <p className="text-slate-600 text-xl">イベントが見つかりませんでした。</p>
-              <NavLink
-                to="/"
-                className="inline-flex items-center justify-center gap-2 rounded-lg bg-primary px-6 py-3 font-semibold text-base text-white shadow-sm transition-all hover:bg-primary/90 hover:shadow-md"
-              >
+              <NavLink to="/" className="btn btn-primary">
                 ホームに戻る
               </NavLink>
             </div>
@@ -339,7 +338,7 @@ export default function SubmissionPage() {
                       <button
                         key={opt.id}
                         type="button"
-                        className="inline-flex items-center gap-1.5 rounded-lg px-2.5 py-1.5 font-medium text-xs transition-all sm:gap-2 sm:px-3 sm:py-2 sm:text-sm"
+                        className="btn btn-sm sm:btn-md gap-1.5 sm:gap-2"
                         onClick={() => setSelectedParticipationOptionId(opt.id)}
                         style={
                           selectedParticipationOptionId === opt.id
@@ -386,7 +385,7 @@ export default function SubmissionPage() {
                     {!!myGuestId && (
                       <button
                         type="button"
-                        className="shrink-0 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:px-4 sm:py-2.5"
+                        className="btn btn-outline shrink-0"
                         disabled={loading}
                         onClick={async () => {
                           if (confirm("更新をキャンセルします。よろしいですか？")) {
@@ -400,7 +399,7 @@ export default function SubmissionPage() {
                     )}
                     <button
                       type="button"
-                      className="shrink-0 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:px-6 sm:py-2.5"
+                      className="btn btn-primary inline-flex shrink-0 gap-1.5 sm:gap-2"
                       disabled={loading || !guestName}
                       onClick={() => {
                         if (!guestName) return;
@@ -414,31 +413,27 @@ export default function SubmissionPage() {
                         );
                       }}
                     >
-                      {meAsGuest ? "更新" : "提出"}
+                      <LuSend className="sm:h-5 sm:w-5" />
+                      <span>{meAsGuest ? "更新" : "提出"}</span>
                     </button>
+                    {isHost && (
+                      <NavLink to={`/e/${projectId}/edit`} className="btn btn-outline gap-1.5 sm:gap-2">
+                        <LuSettings2 className="sm:h-5 sm:w-5" />
+                        <span>編集</span>
+                      </NavLink>
+                    )}
                   </div>
                 ) : (
-                  <div className="flex items-center justify-between gap-2">
-                    <NavLink
-                      to="/home"
-                      className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-slate-200 bg-white px-3 py-2 font-semibold text-slate-700 text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2.5"
-                    >
+                  <div className="flex items-center justify-between">
+                    <NavLink to="/home" className="btn btn-outline gap-1.5 sm:gap-2">
                       <LuChevronLeft size={16} className="sm:h-5 sm:w-5" />
-                      <span>ホームに戻る</span>
+                      <span className="hidden sm:inline">ホームに戻る</span>
+                      <span className="sm:hidden">ホーム</span>
                     </NavLink>
                     <div className="flex items-center gap-2">
-                      {isHost && (
-                        <NavLink
-                          to={`/e/${projectId}/edit`}
-                          className="inline-flex items-center justify-center gap-1.5 rounded-lg border-2 border-primary bg-white px-3 py-2 font-semibold text-primary text-sm transition-all hover:border-slate-300 hover:bg-slate-50 sm:gap-2 sm:px-4 sm:py-2.5"
-                        >
-                          <LuSettings size={16} className="sm:h-5 sm:w-5" />
-                          <span>管理</span>
-                        </NavLink>
-                      )}
                       <button
                         type="button"
-                        className="inline-flex items-center justify-center gap-1.5 rounded-lg bg-primary px-4 py-2 font-semibold text-sm text-white shadow-lg shadow-primary/30 transition-all hover:bg-primary/90 hover:shadow-xl disabled:cursor-not-allowed disabled:opacity-50 sm:gap-2 sm:px-6 sm:py-2.5"
+                        className="btn btn-primary gap-1.5 sm:gap-2"
                         disabled={loading}
                         onClick={() => {
                           setEditMode(true);
@@ -448,6 +443,12 @@ export default function SubmissionPage() {
                         <span className="hidden sm:inline">日程を更新する</span>
                         <span className="sm:hidden">日程更新</span>
                       </button>
+                      {isHost && (
+                        <NavLink to={`/e/${projectId}/edit`} className="btn btn-outline gap-1.5 sm:gap-2">
+                          <LuSettings size={16} className="sm:h-5 sm:w-5" />
+                          <span>管理</span>
+                        </NavLink>
+                      )}
                     </div>
                   </div>
                 )}

From ccd302f51247bc0c9655cf95c057978ea0cb049b Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 18:19:45 +0900
Subject: [PATCH 14/32] =?UTF-8?q?Submission=20=E3=81=AE=E3=83=9C=E3=82=BF?=
 =?UTF-8?q?=E3=83=B3=E3=82=92=E6=95=B4=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/eventId/Submission.tsx | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index c6d2335..8d78a0a 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -8,7 +8,6 @@ import {
   LuCircleCheck,
   LuPencil,
   LuSend,
-  LuSettings,
   LuSettings2,
 } from "react-icons/lu";
 import { NavLink, useParams } from "react-router";
@@ -426,7 +425,7 @@ export default function SubmissionPage() {
                 ) : (
                   <div className="flex items-center justify-between">
                     <NavLink to="/home" className="btn btn-outline gap-1.5 sm:gap-2">
-                      <LuChevronLeft size={16} className="sm:h-5 sm:w-5" />
+                      <LuChevronLeft className="sm:h-5 sm:w-5" />
                       <span className="hidden sm:inline">ホームに戻る</span>
                       <span className="sm:hidden">ホーム</span>
                     </NavLink>
@@ -445,8 +444,8 @@ export default function SubmissionPage() {
                       </button>
                       {isHost && (
                         <NavLink to={`/e/${projectId}/edit`} className="btn btn-outline gap-1.5 sm:gap-2">
-                          <LuSettings size={16} className="sm:h-5 sm:w-5" />
-                          <span>管理</span>
+                          <LuSettings2 className="sm:h-5 sm:w-5" />
+                          <span>編集</span>
                         </NavLink>
                       )}
                     </div>

From 6c0663a5c11e9ab0578c916100b0748ebb05dd5d Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 18:25:09 +0900
Subject: [PATCH 15/32] =?UTF-8?q?icon=20=E3=81=AE=E3=82=B5=E3=82=A4?=
 =?UTF-8?q?=E3=82=BA=E6=8C=87=E5=AE=9A=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx            | 16 ++++++++--------
 client/src/pages/eventId/Submission.tsx | 10 +++++-----
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index f93da25..f2fd043 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -599,7 +599,7 @@ export default function ProjectPage() {
                                   className={`rounded-lg p-2 text-red-600 transition-colors hover:bg-red-50 sm:p-2.5 ${cannotDelete ? "cursor-not-allowed opacity-40" : ""}`}
                                   disabled={cannotDelete}
                                 >
-                                  <LuTrash2 size={18} className="sm:h-5 sm:w-5" />
+                                  <LuTrash2 className="h-4 w-4 sm:h-5 sm:w-5" />
                                 </button>
                               </div>
                             </div>
@@ -677,7 +677,7 @@ export default function ProjectPage() {
                       }
                     }}
                   >
-                    <LuTrash2 size={16} className="sm:h-5 sm:w-5" />
+                    <LuTrash2 className="h-4 w-4 sm:h-5 sm:w-5" />
                     イベントを削除する
                   </button>
                 </div>
@@ -689,7 +689,7 @@ export default function ProjectPage() {
               <div className="mx-auto flex max-w-4xl items-center justify-between gap-2 sm:gap-4">
                 {eventId ? (
                   <NavLink to={`/e/${eventId}`} className="btn btn-outline gap-1.5 sm:gap-2">
-                    <LuChevronLeft size={16} className="sm:h-5 sm:w-5" />
+                    <LuChevronLeft className="h-4 w-4 sm:h-5 sm:w-5" />
                     <span>日程調整に戻る</span>
                   </NavLink>
                 ) : (
@@ -734,16 +734,16 @@ export default function ProjectPage() {
                 disabled={copied}
               >
                 {!copied ? (
-                  <LuClipboard size={16} className="sm:h-5 sm:w-5" />
+                  <LuClipboard className="h-4 w-4 sm:h-5 sm:w-5" />
                 ) : (
-                  <LuClipboardCheck size={16} className="sm:h-5 sm:w-5" />
+                  <LuClipboardCheck className="h-4 w-4 sm:h-5 sm:w-5" />
                 )}
                 <span className="hidden sm:inline">コピー</span>
               </button>
             </div>
             <NavLink className="btn btn-primary w-full" to={`/e/${dialogStatus.projectId}`}>
               イベントへ
-              <LuChevronRight size={16} className="ml-1 sm:h-5 sm:w-5" />
+              <LuChevronRight className="ml-1 h-4 w-4 sm:h-5 sm:w-5" />
             </NavLink>
           </div>
         </div>
@@ -754,12 +754,12 @@ export default function ProjectPage() {
         <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
             <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
-              <LuCircleCheck size={24} className="shrink-0 text-emerald-600" />
+              <LuCircleCheck className="h-6 w-6 shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
             </div>
           ) : (
             <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
-              <LuCircleAlert size={24} className="shrink-0 text-red-600" />
+              <LuCircleAlert className="h-6 w-6 shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
             </div>
           )}
diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index 8d78a0a..71a17a3 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -311,12 +311,12 @@ export default function SubmissionPage() {
                           {descriptionExpanded ? (
                             <>
                               閉じる
-                              <LuChevronUp size={16} />
+                              <LuChevronUp className="h-4 w-4" />
                             </>
                           ) : (
                             <>
                               もっと見る
-                              <LuChevronDown size={16} />
+                              <LuChevronDown className="h-4 w-4" />
                             </>
                           )}
                         </button>
@@ -438,7 +438,7 @@ export default function SubmissionPage() {
                           setEditMode(true);
                         }}
                       >
-                        <LuPencil size={16} className="sm:h-5 sm:w-5" />
+                        <LuPencil className="h-4 w-4 sm:h-5 sm:w-5" />
                         <span className="hidden sm:inline">日程を更新する</span>
                         <span className="sm:hidden">日程更新</span>
                       </button>
@@ -461,12 +461,12 @@ export default function SubmissionPage() {
         <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
             <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
-              <LuCircleCheck size={24} className="shrink-0 text-emerald-600" />
+              <LuCircleCheck className="h-6 w-6 shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
             </div>
           ) : (
             <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
-              <LuCircleAlert size={24} className="shrink-0 text-red-600" />
+              <LuCircleAlert className="h-6 w-6 shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
             </div>
           )}

From 4ef2267dae2d010847bc4fdd33e820785cd3bf49 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 18:36:34 +0900
Subject: [PATCH 16/32] =?UTF-8?q?collapse=20=E3=82=92=20daisyUI=20?=
 =?UTF-8?q?=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx | 232 ++++++++++++++++-------------------
 1 file changed, 109 insertions(+), 123 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index f2fd043..0a4a138 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -336,38 +336,30 @@ export default function ProjectPage() {
               </div>
 
               {/* 情報ボックス */}
-              <div className="rounded-2xl border border-blue-200 bg-blue-50/50 p-5 text-primary shadow-sm">
-                <button
-                  type="button"
-                  className="flex w-full items-center justify-between text-left"
-                  onClick={() => setIsInfoExpanded(!isInfoExpanded)}
-                >
-                  <div className="flex items-center gap-2 font-medium text-sm">
-                    <LuInfo className="h-5 w-5" />
-                    開始日・終了日／時間帯について
-                  </div>
-                  <span className={`transition-transform ${isInfoExpanded ? "rotate-180" : ""}`}>▼</span>
-                </button>
-                {isInfoExpanded && (
-                  <div className="mt-3 border-blue-200 border-t pt-3 text-sm">
-                    <p>
-                      イツヒマでは、<strong>主催者側で候補日程を設定せずに</strong>日程調整します。
-                      <br />
-                      ここでは、参加者の日程を知りたい日付の範囲と時間帯の範囲を設定してください。
-                      <br />
-                      詳しくは、
-                      <a
-                        href={EXTERNAL_LINKS.GUIDE}
-                        target="_blank"
-                        rel="noreferrer noopener"
-                        className="font-medium text-primary underline hover:text-primary/80"
-                      >
-                        使い方ページ
-                      </a>
-                      をご覧ください。
-                    </p>
-                  </div>
-                )}
+              <div className="collapse-arrow collapse rounded-2xl border border-blue-200 bg-blue-50/50 p-1 text-primary shadow-sm">
+                <input type="checkbox" checked={isInfoExpanded} onChange={(e) => setIsInfoExpanded(e.target.checked)} />
+                <div className="collapse-title flex items-center gap-2 font-medium text-sm">
+                  <LuInfo className="h-5 w-5" />
+                  開始日・終了日／時間帯について
+                </div>
+                <div className="collapse-content px-6 text-sm">
+                  <p>
+                    イツヒマでは、<strong>主催者側で候補日程を設定せずに</strong>日程調整します。
+                    <br />
+                    ここでは、参加者の日程を知りたい日付の範囲と時間帯の範囲を設定してください。
+                    <br />
+                    詳しくは、
+                    <a
+                      href={EXTERNAL_LINKS.GUIDE}
+                      target="_blank"
+                      rel="noreferrer noopener"
+                      className="font-medium text-primary underline hover:text-primary/80"
+                    >
+                      使い方ページ
+                    </a>
+                    をご覧ください。
+                  </p>
+                </div>
               </div>
 
               {/* 日程の範囲 */}
@@ -538,102 +530,96 @@ export default function ProjectPage() {
               </div>
 
               {/* 参加形態 */}
-              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
-                <button
-                  type="button"
-                  className="flex w-full items-center justify-between text-left"
-                  onClick={() => setIsParticipationExpanded(!isParticipationExpanded)}
-                >
-                  <h2 className="font-semibold text-base text-slate-900 sm:text-lg">参加形態の設定 (任意)</h2>
-                  <span
-                    className={`text-slate-600 transition-transform ${isParticipationExpanded ? "rotate-180" : ""}`}
-                  >
-                    ▼
-                  </span>
-                </button>
-                {isParticipationExpanded && (
-                  <div className="mt-4 border-slate-200 border-t pt-4">
-                    <p className="mb-4 text-slate-600 text-sm">
-                      参加形態を設定すると、参加者は「対面」「オンライン」などの形態を選んで日程を登録できます。
-                    </p>
-
-                    <div className="space-y-3">
-                      {participationFields.map((field, index) => {
-                        const hasSlots = project?.guests.some((guest) =>
-                          guest.slots.some((slot) => slot.participationOptionId === field.id),
-                        );
-                        const isLastOption = participationFields.length === 1;
-                        const cannotDelete = hasSlots || isLastOption;
-                        const tooltipMessage = hasSlots
-                          ? "すでにこの参加形態の日程が登録されているため、削除できません"
-                          : isLastOption
-                            ? "最低1つの参加形態が必要です"
-                            : "";
-                        return (
-                          <div key={field.id} className="w-full">
-                            <div className="flex items-center gap-2 sm:gap-3">
-                              <input type="hidden" {...register(`participationOptions.${index}.id`)} value={field.id} />
-                              <div className="relative h-10 w-10 shrink-0 sm:h-11 sm:w-11">
-                                <input
-                                  type="color"
-                                  {...register(`participationOptions.${index}.color`)}
-                                  defaultValue={field.color}
-                                  // カラーピッカーのスタイルはブラウザに依存した調整が必要
-                                  className="absolute inset-0 h-full w-full cursor-pointer appearance-none rounded-lg border-0 shadow-[0_0_0_2px_rgb(226_232_240),0_1px_2px_0_rgb(0_0_0/0.05)] [&::-moz-color-swatch]:rounded-lg [&::-moz-color-swatch]:border-0 [&::-webkit-color-swatch-wrapper]:p-0 [&::-webkit-color-swatch]:rounded-lg [&::-webkit-color-swatch]:border-0"
-                                />
-                              </div>
+              <div className="collapse-arrow collapse rounded-2xl border border-slate-200 bg-white p-3 shadow-sm">
+                <input
+                  type="checkbox"
+                  checked={isParticipationExpanded}
+                  onChange={(e) => setIsParticipationExpanded(e.target.checked)}
+                />
+                <div className="collapse-title font-semibold text-base text-slate-900 sm:text-lg">
+                  参加形態の設定 (任意)
+                </div>
+                <div className="collapse-content px-6">
+                  <p className="mb-4 text-slate-600 text-sm">
+                    参加形態を設定すると、参加者は「対面」「オンライン」などの形態を選んで日程を登録できます。
+                  </p>
+
+                  <div className="space-y-3">
+                    {participationFields.map((field, index) => {
+                      const hasSlots = project?.guests.some((guest) =>
+                        guest.slots.some((slot) => slot.participationOptionId === field.id),
+                      );
+                      const isLastOption = participationFields.length === 1;
+                      const cannotDelete = hasSlots || isLastOption;
+                      const tooltipMessage = hasSlots
+                        ? "すでにこの参加形態の日程が登録されているため、削除できません"
+                        : isLastOption
+                          ? "最低1つの参加形態が必要です"
+                          : "";
+                      return (
+                        <div key={field.id} className="w-full">
+                          <div className="flex items-center gap-2 sm:gap-3">
+                            <input type="hidden" {...register(`participationOptions.${index}.id`)} value={field.id} />
+                            <div className="relative h-10 w-10 shrink-0 sm:h-11 sm:w-11">
                               <input
-                                type="text"
-                                {...register(`participationOptions.${index}.label`)}
-                                defaultValue={field.label}
-                                placeholder="参加形態名（例：対面、オンライン）"
-                                className={`flex-1 rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.participationOptions?.[index]?.label ? "border-red-500" : "border-slate-300"}`}
-                                onBlur={() => {
-                                  trigger(`participationOptions.${index}.label` as const);
-                                }}
+                                type="color"
+                                {...register(`participationOptions.${index}.color`)}
+                                defaultValue={field.color}
+                                // カラーピッカーのスタイルはブラウザに依存した調整が必要
+                                className="absolute inset-0 h-full w-full cursor-pointer appearance-none rounded-lg border-0 shadow-[0_0_0_2px_rgb(226_232_240),0_1px_2px_0_rgb(0_0_0/0.05)] [&::-moz-color-swatch]:rounded-lg [&::-moz-color-swatch]:border-0 [&::-webkit-color-swatch-wrapper]:p-0 [&::-webkit-color-swatch]:rounded-lg [&::-webkit-color-swatch]:border-0"
                               />
-                              <div className={cannotDelete ? "tooltip tooltip-left" : ""} data-tip={tooltipMessage}>
-                                <button
-                                  type="button"
-                                  onClick={() => removeParticipation(index)}
-                                  className={`rounded-lg p-2 text-red-600 transition-colors hover:bg-red-50 sm:p-2.5 ${cannotDelete ? "cursor-not-allowed opacity-40" : ""}`}
-                                  disabled={cannotDelete}
-                                >
-                                  <LuTrash2 className="h-4 w-4 sm:h-5 sm:w-5" />
-                                </button>
-                              </div>
                             </div>
-                            {errors.participationOptions?.[index]?.label && (
-                              <p className="mt-1.5 text-red-600 text-sm">
-                                {errors.participationOptions[index]?.label?.message as string}
-                              </p>
-                            )}
-                            {errors.participationOptions?.[index]?.color && (
-                              <p className="mt-1.5 text-red-600 text-sm">
-                                {errors.participationOptions[index]?.color?.message as string}
-                              </p>
-                            )}
+                            <input
+                              type="text"
+                              {...register(`participationOptions.${index}.label`)}
+                              defaultValue={field.label}
+                              placeholder="参加形態名（例：対面、オンライン）"
+                              className={`flex-1 rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.participationOptions?.[index]?.label ? "border-red-500" : "border-slate-300"}`}
+                              onBlur={() => {
+                                trigger(`participationOptions.${index}.label` as const);
+                              }}
+                            />
+                            <div className={cannotDelete ? "tooltip tooltip-left" : ""} data-tip={tooltipMessage}>
+                              <button
+                                type="button"
+                                onClick={() => removeParticipation(index)}
+                                className={`rounded-lg p-2 text-red-600 transition-colors hover:bg-red-50 sm:p-2.5 ${cannotDelete ? "cursor-not-allowed opacity-40" : ""}`}
+                                disabled={cannotDelete}
+                              >
+                                <LuTrash2 className="h-4 w-4 sm:h-5 sm:w-5" />
+                              </button>
+                            </div>
                           </div>
-                        );
-                      })}
-                    </div>
-
-                    <button
-                      type="button"
-                      onClick={() => {
-                        const existingColors = participationFields.map((o) => o.color);
-                        appendParticipation({
-                          id: crypto.randomUUID(),
-                          label: "",
-                          color: generateDistinctColor(existingColors),
-                        });
-                      }}
-                      className="btn btn-outline btn-sm sm:btn-md mt-4"
-                    >
-                      + 参加形態を追加
-                    </button>
+                          {errors.participationOptions?.[index]?.label && (
+                            <p className="mt-1.5 text-red-600 text-sm">
+                              {errors.participationOptions[index]?.label?.message as string}
+                            </p>
+                          )}
+                          {errors.participationOptions?.[index]?.color && (
+                            <p className="mt-1.5 text-red-600 text-sm">
+                              {errors.participationOptions[index]?.color?.message as string}
+                            </p>
+                          )}
+                        </div>
+                      );
+                    })}
                   </div>
-                )}
+
+                  <button
+                    type="button"
+                    onClick={() => {
+                      const existingColors = participationFields.map((o) => o.color);
+                      appendParticipation({
+                        id: crypto.randomUUID(),
+                        label: "",
+                        color: generateDistinctColor(existingColors),
+                      });
+                    }}
+                    className="btn btn-outline btn-sm sm:btn-md mt-4"
+                  >
+                    + 参加形態を追加
+                  </button>
+                </div>
               </div>
 
               {/* イベントの削除 */}

From 64c8dcd9fbb223bdc5dbc2d1f4583cc3643aee23 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 19:01:23 +0900
Subject: [PATCH 17/32] =?UTF-8?q?toast=20=E3=82=92=E9=96=89=E3=81=98?=
 =?UTF-8?q?=E3=82=8B=E3=83=9C=E3=82=BF=E3=83=B3=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Home.tsx               | 5 ++++-
 client/src/pages/Project.tsx            | 7 +++++++
 client/src/pages/eventId/Submission.tsx | 7 +++++++
 3 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index 7372fe2..d41abc2 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -1,6 +1,6 @@
 import { hc } from "hono/client";
 import { useEffect, useState } from "react";
-import { LuCalendar, LuChevronRight, LuLayoutDashboard, LuPlus, LuUser, LuUsers } from "react-icons/lu";
+import { LuCalendar, LuChevronRight, LuLayoutDashboard, LuPlus, LuUser, LuUsers, LuX } from "react-icons/lu";
 import { NavLink } from "react-router";
 import type { AppType } from "../../../server/src/main";
 import Header from "../components/Header";
@@ -88,6 +88,9 @@ export default function HomePage() {
         <div className="toast toast-top toast-center z-50">
           <div className={`alert ${toast.variant === "success" ? "alert-success" : "alert-error"}`}>
             <span>{toast.message}</span>
+            <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
+              <LuX className="h-4 w-4" />
+            </button>
           </div>
         </div>
       )}
diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index 0a4a138..2fe8524 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -12,6 +12,7 @@ import {
   LuClipboardCheck,
   LuInfo,
   LuTrash2,
+  LuX,
 } from "react-icons/lu";
 import { NavLink, useNavigate, useParams } from "react-router";
 import type { z } from "zod";
@@ -742,11 +743,17 @@ export default function ProjectPage() {
             <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
               <LuCircleCheck className="h-6 w-6 shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
+              <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
+                <LuX className="h-4 w-4" />
+              </button>
             </div>
           ) : (
             <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
               <LuCircleAlert className="h-6 w-6 shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
+              <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
+                <LuX className="h-4 w-4" />
+              </button>
             </div>
           )}
         </div>
diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index 71a17a3..2b08945 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -9,6 +9,7 @@ import {
   LuPencil,
   LuSend,
   LuSettings2,
+  LuX,
 } from "react-icons/lu";
 import { NavLink, useParams } from "react-router";
 import type { AppType } from "../../../../server/src/main";
@@ -463,11 +464,17 @@ export default function SubmissionPage() {
             <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
               <LuCircleCheck className="h-6 w-6 shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
+              <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
+                <LuX className="h-4 w-4" />
+              </button>
             </div>
           ) : (
             <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
               <LuCircleAlert className="h-6 w-6 shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
+              <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
+                <LuX className="h-4 w-4" />
+              </button>
             </div>
           )}
         </div>

From fa19553e5405a27d45b1e3938890b1f6c418a988 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 19:15:57 +0900
Subject: [PATCH 18/32] =?UTF-8?q?header=20=E3=81=8B=E3=82=89=E4=BD=9C?=
 =?UTF-8?q?=E6=88=90=E3=83=9C=E3=82=BF=E3=83=B3=E3=82=92=E5=89=8A=E9=99=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Header.tsx | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/client/src/components/Header.tsx b/client/src/components/Header.tsx
index 5a881a8..1224c48 100644
--- a/client/src/components/Header.tsx
+++ b/client/src/components/Header.tsx
@@ -29,10 +29,6 @@ export default function Header() {
           >
             使い方
           </a>
-          <div className="h-4 w-[1px] bg-slate-200" />
-          <NavLink to="/new" className="btn btn-primary">
-            イベント作成
-          </NavLink>
         </nav>
 
         <div className="flex items-center md:hidden">
@@ -72,9 +68,6 @@ export default function Header() {
             >
               ご意見・バグ報告
             </a>
-            <NavLink to="/new" className="btn btn-primary btn-sm my-3">
-              イベント作成
-            </NavLink>
           </div>
         </div>
       )}

From 2a9c938a586df57d52002fb60c505797ec2574df Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 20:34:54 +0900
Subject: [PATCH 19/32] =?UTF-8?q?=E8=AA=AC=E6=98=8E=E3=83=86=E3=82=AD?=
 =?UTF-8?q?=E3=82=B9=E3=83=88=E3=82=92=E4=BF=AE=E6=AD=A3=E3=80=81Footer=20?=
 =?UTF-8?q?=E3=82=92=20Home=20=E3=81=A7=E4=BD=BF=E7=94=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Footer.tsx | 47 +++++++++++++++++++++++++++++++
 client/src/pages/Home.tsx        |  8 ++++--
 client/src/pages/Landing.tsx     | 48 +-------------------------------
 client/src/pages/Project.tsx     |  7 +----
 4 files changed, 54 insertions(+), 56 deletions(-)
 create mode 100644 client/src/components/Footer.tsx

diff --git a/client/src/components/Footer.tsx b/client/src/components/Footer.tsx
new file mode 100644
index 0000000..bc327a7
--- /dev/null
+++ b/client/src/components/Footer.tsx
@@ -0,0 +1,47 @@
+import { EXTERNAL_LINKS } from "../constants/links";
+
+export default function Footer() {
+  return (
+    <footer className="bg-slate-900 py-12 text-slate-300">
+      <div className="mx-auto max-w-7xl px-6 sm:px-8 lg:px-10">
+        <div className="grid gap-12 md:grid-cols-2 lg:gap-24">
+          <div>
+            <div className="flex items-center gap-2 text-white">
+              <img src="/logo-white.svg" alt="イツヒマ" className="h-6 w-6" />
+              <span className="font-bold font-mplus text-xl tracking-tight">イツヒマ</span>
+            </div>
+            <p className="mt-6 max-w-md text-slate-400 text-sm">「いつヒマ？」で日程調整しよう</p>
+          </div>
+          <div>
+            <h3 className="font-bold text-sm text-white">サポート</h3>
+            <ul className="mt-4 text-sm">
+              <li>
+                <a
+                  href={EXTERNAL_LINKS.GUIDE}
+                  target="_blank"
+                  rel="noreferrer noopener"
+                  className="hover:text-slate-400"
+                >
+                  使い方
+                </a>
+              </li>
+              <li className="mt-3">
+                <a
+                  href={EXTERNAL_LINKS.FEEDBACK}
+                  target="_blank"
+                  rel="noreferrer noopener"
+                  className="hover:text-slate-400"
+                >
+                  ご意見・バグ報告
+                </a>
+              </li>
+            </ul>
+          </div>
+        </div>
+        <div className="mt-12 border-slate-800 border-t pt-8 text-center text-slate-500 text-xs">
+          <p>&copy; {new Date().getFullYear()} イツヒマ All rights reserved.</p>
+        </div>
+      </div>
+    </footer>
+  );
+}
diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index d41abc2..e173f57 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -3,6 +3,7 @@ import { useEffect, useState } from "react";
 import { LuCalendar, LuChevronRight, LuLayoutDashboard, LuPlus, LuUser, LuUsers, LuX } from "react-icons/lu";
 import { NavLink } from "react-router";
 import type { AppType } from "../../../server/src/main";
+import Footer from "../components/Footer";
 import Header from "../components/Header";
 import { briefProjectReviver } from "../revivers";
 import type { BriefProject } from "../types";
@@ -62,13 +63,13 @@ export default function HomePage() {
 
   return (
     <>
-      <div className="min-h-screen bg-slate-50 font-sans text-slate-900">
+      <div className="flex min-h-screen flex-col bg-slate-50 font-sans text-slate-900">
         <Header />
-        <main className="mx-auto max-w-4xl px-4 py-8 sm:px-6 lg:px-8">
+        <main className="mx-auto w-full max-w-4xl flex-1 px-4 py-8 sm:px-6 lg:px-8">
           <div className="mb-8 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
             <div>
               <h1 className="font-bold text-2xl text-slate-900 tracking-tight sm:text-3xl">ホーム</h1>
-              <p className="mt-1 text-slate-500 text-sm">参加・主催しているイベントの管理</p>
+              <p className="mt-1 text-slate-500 text-sm">日程調整イベントの管理</p>
             </div>
             <NavLink to="/new" className="btn btn-primary w-full gap-2 sm:w-auto">
               <LuPlus className="h-4 w-4" />
@@ -83,6 +84,7 @@ export default function HomePage() {
             <EmptyState />
           )}
         </main>
+        <Footer />
       </div>
       {toast && (
         <div className="toast toast-top toast-center z-50">
diff --git a/client/src/pages/Landing.tsx b/client/src/pages/Landing.tsx
index 06d04fa..3393bcb 100644
--- a/client/src/pages/Landing.tsx
+++ b/client/src/pages/Landing.tsx
@@ -1,7 +1,7 @@
 import { LuChevronRight, LuCircleCheck, LuPalette, LuSmartphone } from "react-icons/lu";
 import { NavLink } from "react-router";
+import Footer from "../components/Footer";
 import Header from "../components/Header";
-import { EXTERNAL_LINKS } from "../constants/links";
 
 function HeroSection() {
   return (
@@ -84,52 +84,6 @@ function FeaturesSection() {
   );
 }
 
-function Footer() {
-  return (
-    <footer className="bg-slate-900 py-12 text-slate-300">
-      <div className="mx-auto max-w-7xl px-6 sm:px-8 lg:px-10">
-        <div className="grid gap-12 md:grid-cols-2 lg:gap-24">
-          <div>
-            <div className="flex items-center gap-2 text-white">
-              <img src="/logo-white.svg" alt="イツヒマ" className="h-6 w-6" />
-              <span className="font-bold font-mplus text-xl tracking-tight">イツヒマ</span>
-            </div>
-            <p className="mt-6 max-w-md text-slate-400 text-sm">「いつヒマ？」で日程調整しよう</p>
-          </div>
-          <div>
-            <h3 className="font-bold text-sm text-white">サポート</h3>
-            <ul className="mt-4 text-sm">
-              <li>
-                <a
-                  href={EXTERNAL_LINKS.GUIDE}
-                  target="_blank"
-                  rel="noreferrer noopener"
-                  className="hover:text-slate-400"
-                >
-                  使い方
-                </a>
-              </li>
-              <li className="mt-3">
-                <a
-                  href={EXTERNAL_LINKS.FEEDBACK}
-                  target="_blank"
-                  rel="noreferrer noopener"
-                  className="hover:text-slate-400"
-                >
-                  ご意見・バグ報告
-                </a>
-              </li>
-            </ul>
-          </div>
-        </div>
-        <div className="mt-12 border-slate-800 border-t pt-8 text-center text-slate-500 text-xs">
-          <p>&copy; {new Date().getFullYear()} イツヒマ All rights reserved.</p>
-        </div>
-      </div>
-    </footer>
-  );
-}
-
 export default function LandingPage() {
   return (
     <div className="min-h-screen bg-slate-50 text-slate-900">
diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index 2fe8524..df0b594 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -294,12 +294,7 @@ export default function ProjectPage() {
         ) : (
           <main className="mx-auto max-w-4xl px-4 py-8 pb-24 sm:px-6 lg:px-8">
             <div className="mb-6">
-              <h1 className="font-bold text-slate-900 text-xl tracking-tight sm:text-2xl">
-                {project ? `${project.name} の編集` : "イベントの作成"}
-              </h1>
-              <p className="mt-1.5 text-slate-500 text-sm">
-                {project ? "イベントの詳細を編集できます" : "新しい日程調整イベントを作成しましょう"}
-              </p>
+              <h1 className="font-bold text-2xl text-slate-900">{project ? `${project.name} の編集` : "新規作成"}</h1>
             </div>
 
             <form id="project-form" onSubmit={handleSubmit(onSubmit)} className="space-y-6">

From a20ee94461246ffc504f80c0688289daca4f7a3e Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 20:37:36 +0900
Subject: [PATCH 20/32] =?UTF-8?q?header=20=E3=81=AE=20mx-auto=20=E3=81=8C?=
 =?UTF-8?q?=E6=B6=88=E3=81=88=E3=81=A6=E3=81=84=E3=81=9F=E3=81=AE=E3=81=A7?=
 =?UTF-8?q?=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Header.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/Header.tsx b/client/src/components/Header.tsx
index 1224c48..ddb009f 100644
--- a/client/src/components/Header.tsx
+++ b/client/src/components/Header.tsx
@@ -8,7 +8,7 @@ export default function Header() {
 
   return (
     <header className="sticky top-0 z-50 w-full border-slate-200 border-b bg-white">
-      <div className="flex h-16 w-full max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
+      <div className="mx-auto flex h-16 w-full max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
         <NavLink to="/" className="flex items-center gap-2 transition-opacity hover:opacity-80">
           <img src="/logo.svg" alt="イツヒマ" className="h-6 w-6" />
           <span className="font-bold font-mplus text-slate-800 text-xl tracking-tight">イツヒマ</span>

From 9fa0931a8039e5e8d057ba4dac21c5e4f34b7e03 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Thu, 1 Jan 2026 20:40:35 +0900
Subject: [PATCH 21/32] =?UTF-8?q?Project=20=E3=81=AE=E5=B9=85=E3=82=92?=
 =?UTF-8?q?=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index df0b594..b75adaa 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -283,7 +283,7 @@ export default function ProjectPage() {
           </div>
         ) : eventId !== undefined && !project ? (
           // TODO: NotFound に統一？
-          <div className="mx-auto max-w-4xl px-4 py-16 sm:px-6 lg:px-8">
+          <div className="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
             <div className="flex min-h-[400px] flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
               <p className="text-base text-slate-600 sm:text-xl">イベントが見つかりませんでした。</p>
               <NavLink to="/" className="btn btn-primary">
@@ -292,7 +292,7 @@ export default function ProjectPage() {
             </div>
           </div>
         ) : (
-          <main className="mx-auto max-w-4xl px-4 py-8 pb-24 sm:px-6 lg:px-8">
+          <main className="mx-auto max-w-7xl px-4 py-8 pb-24 sm:px-6 lg:px-8">
             <div className="mb-6">
               <h1 className="font-bold text-2xl text-slate-900">{project ? `${project.name} の編集` : "新規作成"}</h1>
             </div>
@@ -668,7 +668,7 @@ export default function ProjectPage() {
 
             {/* 固定フッター */}
             <div className="fixed right-0 bottom-0 left-0 z-10 border-slate-200 border-t bg-white/95 px-4 py-3 shadow-lg backdrop-blur-sm sm:py-4">
-              <div className="mx-auto flex max-w-4xl items-center justify-between gap-2 sm:gap-4">
+              <div className="mx-auto flex max-w-7xl items-center justify-between gap-2 sm:gap-4">
                 {eventId ? (
                   <NavLink to={`/e/${eventId}`} className="btn btn-outline gap-1.5 sm:gap-2">
                     <LuChevronLeft className="h-4 w-4 sm:h-5 sm:w-5" />

From 06e7fe362e6c78c15466600ddcd07e721848bba9 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Fri, 2 Jan 2026 14:21:45 +0900
Subject: [PATCH 22/32] =?UTF-8?q?body=20=E3=81=AE=E8=83=8C=E6=99=AF?=
 =?UTF-8?q?=E8=89=B2=E3=81=AF=20header=20=E3=81=AB=E5=90=88=E3=82=8F?=
 =?UTF-8?q?=E3=81=9B=E3=81=A6=E7=99=BD=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/index.css | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/client/src/index.css b/client/src/index.css
index 8b21482..b9ba36c 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -101,10 +101,6 @@
   border: 1px solid var(--color-gray-200) !important;
 }
 
-body {
-  background-color: var(--color-primary);
-}
-
 #root {
   background-color: white;
 }

From e8432f45af66842c9ade4620e401098ae195b75f Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Fri, 2 Jan 2026 14:44:49 +0900
Subject: [PATCH 23/32] =?UTF-8?q?button=20=E3=81=AE=20variant=20=E3=82=92?=
 =?UTF-8?q?=E8=A8=AD=E5=AE=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/index.css | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/client/src/index.css b/client/src/index.css
index b9ba36c..505a373 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -23,14 +23,50 @@
   @apply bg-primary text-white shadow-sm hover:bg-primary/90 hover:shadow-md;
 }
 
+.btn-primary:disabled {
+  @apply bg-slate-300 text-slate-500 cursor-not-allowed opacity-60 hover:bg-slate-300 hover:shadow-sm;
+}
+
+.btn-primary:focus-visible {
+  @apply outline-none ring-2 ring-primary ring-offset-2;
+}
+
+.btn-primary:active:not(:disabled) {
+  @apply scale-95 shadow-none;
+}
+
 .btn-outline {
   @apply border-2 border-slate-200 bg-white text-slate-700 hover:border-slate-300 hover:bg-slate-50;
 }
 
+.btn-outline:disabled {
+  @apply border-slate-200 bg-slate-50 text-slate-400 cursor-not-allowed opacity-60 hover:border-slate-200 hover:bg-slate-50;
+}
+
+.btn-outline:focus-visible {
+  @apply outline-none ring-2 ring-slate-400 ring-offset-2;
+}
+
+.btn-outline:active:not(:disabled) {
+  @apply scale-95 bg-slate-100;
+}
+
 .btn-ghost {
   @apply bg-transparent hover:bg-slate-50;
 }
 
+.btn-ghost:disabled {
+  @apply text-slate-400 cursor-not-allowed opacity-60 hover:bg-transparent;
+}
+
+.btn-ghost:focus-visible {
+  @apply outline-none ring-2 ring-slate-300 ring-offset-2;
+}
+
+.btn-ghost:active:not(:disabled) {
+  @apply scale-95 bg-slate-100;
+}
+
 :root {
   --fc-today-bg-color: inherit; /* 今日の日付のハイライトを削除する https://github.com/fullcalendar/fullcalendar/issues/7150 */
   --ih-color-primary-transparent: rgb(15, 130, 177, 0.2);

From ec14b72c5677bc920eba360a5de2fe5c42a5f589 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Fri, 2 Jan 2026 14:55:36 +0900
Subject: [PATCH 24/32] =?UTF-8?q?input=20=E3=81=AE=E3=83=86=E3=82=AD?=
 =?UTF-8?q?=E3=82=B9=E3=83=88=E3=82=B5=E3=82=A4=E3=82=BA=E3=82=92=2016px?=
 =?UTF-8?q?=20=E4=BB=A5=E4=B8=8A=E3=81=AB=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx            | 20 ++++++++++----------
 client/src/pages/eventId/Submission.tsx |  2 +-
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index b75adaa..e493fbb 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -309,7 +309,7 @@ export default function ProjectPage() {
                     <input
                       {...register("name")}
                       id="input-name"
-                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.name ? "border-red-500" : "border-slate-300"}`}
+                      className={`w-full rounded-lg border px-3 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 ${errors.name ? "border-red-500" : "border-slate-300"}`}
                       placeholder="例: 3月度 同期飲み会"
                       onBlur={() => trigger("name")}
                     />
@@ -322,7 +322,7 @@ export default function ProjectPage() {
                     <textarea
                       {...register("description")}
                       id="input-description"
-                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.description ? "border-red-500" : "border-slate-300"}`}
+                      className={`w-full rounded-lg border px-3 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 ${errors.description ? "border-red-500" : "border-slate-300"}`}
                       placeholder="イベントの詳細や注意事項などを入力"
                       rows={3}
                     />
@@ -377,7 +377,7 @@ export default function ProjectPage() {
                       type="date"
                       {...register("startDate")}
                       id="input-start"
-                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.startDate ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                      className={`w-full rounded-lg border px-3 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 ${errors.startDate ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                       onFocus={handleFieldFocus}
                       disabled={!!(project && project.guests.length > 0)}
                     />
@@ -398,7 +398,7 @@ export default function ProjectPage() {
                       type="date"
                       {...register("endDate")}
                       id="input-end"
-                      className={`w-full rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.endDate ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                      className={`w-full rounded-lg border px-3 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 ${errors.endDate ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                       onFocus={handleFieldFocus}
                       disabled={!!(project && project.guests.length > 0)}
                     />
@@ -421,7 +421,7 @@ export default function ProjectPage() {
                   <div className="flex items-center gap-2 sm:gap-3">
                     <div className="flex flex-1 items-center gap-1.5 sm:gap-2">
                       <select
-                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].startTime.split(":")[0]}
                         onChange={(e) => {
                           replace([
@@ -445,7 +445,7 @@ export default function ProjectPage() {
                       </select>
                       <span className="font-medium text-slate-600 text-sm sm:text-base">:</span>
                       <select
-                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].startTime.split(":")[1]}
                         onChange={(e) => {
                           replace([
@@ -471,7 +471,7 @@ export default function ProjectPage() {
                     <span className="font-medium text-slate-600 text-sm sm:text-base">〜</span>
                     <div className="flex flex-1 items-center gap-1.5 sm:gap-2">
                       <select
-                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].endTime.split(":")[0]}
                         onChange={(e) => {
                           replace([
@@ -495,7 +495,7 @@ export default function ProjectPage() {
                       </select>
                       <span className="font-medium text-slate-600 text-sm sm:text-base">:</span>
                       <select
-                        className={`flex-1 rounded-lg border px-2 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 sm:text-base ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
+                        className={`flex-1 rounded-lg border px-2 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
                         value={allowedRangeFields[0].endTime.split(":")[1]}
                         onChange={(e) => {
                           replace([
@@ -570,7 +570,7 @@ export default function ProjectPage() {
                               {...register(`participationOptions.${index}.label`)}
                               defaultValue={field.label}
                               placeholder="参加形態名（例：対面、オンライン）"
-                              className={`flex-1 rounded-lg border px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base ${errors.participationOptions?.[index]?.label ? "border-red-500" : "border-slate-300"}`}
+                              className={`flex-1 rounded-lg border px-3 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 ${errors.participationOptions?.[index]?.label ? "border-red-500" : "border-slate-300"}`}
                               onBlur={() => {
                                 trigger(`participationOptions.${index}.label` as const);
                               }}
@@ -700,7 +700,7 @@ export default function ProjectPage() {
               <input
                 type="text"
                 disabled
-                className="flex-1 rounded-lg border border-slate-300 bg-slate-50 px-3 py-2 text-slate-700 text-xs sm:px-4 sm:py-2.5 sm:text-sm"
+                className="flex-1 rounded-lg border border-slate-300 bg-slate-50 px-3 py-2 text-base text-slate-700 sm:px-4 sm:py-2.5"
                 value={`${FRONTEND_ORIGIN}/e/${dialogStatus.projectId}`}
               />
               <button
diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index 2b08945..dcff9db 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -380,7 +380,7 @@ export default function SubmissionPage() {
                       placeholder="名前"
                       value={guestName}
                       onChange={(e) => setGuestName(e.target.value)}
-                      className="min-w-0 flex-1 rounded-lg border border-slate-300 px-3 py-2 text-sm transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 sm:text-base"
+                      className="min-w-0 flex-1 rounded-lg border border-slate-300 px-3 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5"
                     />
                     {!!myGuestId && (
                       <button

From d00f15738320339926f2efc2cae83a61ec075e16 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Fri, 2 Jan 2026 15:01:57 +0900
Subject: [PATCH 25/32] =?UTF-8?q?=E3=83=9B=E3=83=BC=E3=83=A0=E3=81=AE?=
 =?UTF-8?q?=E3=83=87=E3=83=95=E3=82=A9=E3=83=AB=E3=83=88=E8=A1=A8=E7=A4=BA?=
 =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Home.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index e173f57..9cfa31b 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -1,6 +1,6 @@
 import { hc } from "hono/client";
 import { useEffect, useState } from "react";
-import { LuCalendar, LuChevronRight, LuLayoutDashboard, LuPlus, LuUser, LuUsers, LuX } from "react-icons/lu";
+import { LuCalendar, LuChevronRight, LuLayoutList, LuPlus, LuUser, LuUsers, LuX } from "react-icons/lu";
 import { NavLink } from "react-router";
 import type { AppType } from "../../../server/src/main";
 import Footer from "../components/Footer";
@@ -177,10 +177,10 @@ function EmptyState() {
   return (
     <div className="flex min-h-[400px] flex-col items-center justify-center rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
       <div className="mb-6 flex h-16 w-16 items-center justify-center rounded-full bg-slate-100">
-        <LuLayoutDashboard className="h-8 w-8 text-slate-400" />
+        <LuLayoutList className="h-8 w-8 text-slate-400" />
       </div>
       <h3 className="mb-2 font-semibold text-lg text-slate-900">まだイベントがありません</h3>
-      <p className="max-w-sm text-slate-500 text-sm">右上の「新規作成」ボタンから、新しい日程調整を始めましょう。</p>
+      <p className="max-w-sm text-slate-500 text-sm">「新規作成」ボタンから、新しい日程調整を始めましょう。</p>
     </div>
   );
 }

From 11e41117682026436c64e4170f90828c34139feb Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Fri, 2 Jan 2026 15:22:41 +0900
Subject: [PATCH 26/32] =?UTF-8?q?collapse=20=E5=86=85=20padding=20?=
 =?UTF-8?q?=E3=82=92=E8=AA=BF=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index e493fbb..6d04bc9 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -338,7 +338,7 @@ export default function ProjectPage() {
                   <LuInfo className="h-5 w-5" />
                   開始日・終了日／時間帯について
                 </div>
-                <div className="collapse-content px-6 text-sm">
+                <div className="collapse-content px-4 text-sm">
                   <p>
                     イツヒマでは、<strong>主催者側で候補日程を設定せずに</strong>日程調整します。
                     <br />
@@ -535,7 +535,7 @@ export default function ProjectPage() {
                 <div className="collapse-title font-semibold text-base text-slate-900 sm:text-lg">
                   参加形態の設定 (任意)
                 </div>
-                <div className="collapse-content px-6">
+                <div className="collapse-content px-4">
                   <p className="mb-4 text-slate-600 text-sm">
                     参加形態を設定すると、参加者は「対面」「オンライン」などの形態を選んで日程を登録できます。
                   </p>

From 6095c1922a7373b6e4c884206f061171cdb991c1 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Fri, 2 Jan 2026 16:21:42 +0900
Subject: [PATCH 27/32] =?UTF-8?q?=E7=B7=A8=E9=9B=86=E3=83=9C=E3=82=BF?=
 =?UTF-8?q?=E3=83=B3=E3=81=AF=E4=B8=8A=E3=81=AB=E7=A7=BB=E5=8B=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/eventId/Submission.tsx | 46 ++++++++++---------------
 1 file changed, 19 insertions(+), 27 deletions(-)

diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index dcff9db..b1771db 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -291,8 +291,14 @@ export default function SubmissionPage() {
         ) : (
           <div className="flex flex-1 flex-col overflow-y-auto">
             <div className="mx-auto flex w-full max-w-7xl flex-1 flex-col px-4 pt-3 pb-3 sm:px-6 sm:pt-4 sm:pb-3 lg:px-8">
-              <div className="mb-2 flex items-center justify-between sm:mb-3">
+              <div className="mb-2 flex items-center justify-between gap-2 sm:mb-3">
                 <h1 className="truncate font-bold text-base text-slate-900 sm:text-lg">{project.name}</h1>
+                {isHost && (
+                  <NavLink to={`/e/${projectId}/edit`} className="btn btn-sm btn-outline shrink-0 gap-1.5">
+                    <LuSettings2 className="h-4 w-4" />
+                    <span>編集</span>
+                  </NavLink>
+                )}
               </div>
 
               {project.description &&
@@ -416,12 +422,6 @@ export default function SubmissionPage() {
                       <LuSend className="sm:h-5 sm:w-5" />
                       <span>{meAsGuest ? "更新" : "提出"}</span>
                     </button>
-                    {isHost && (
-                      <NavLink to={`/e/${projectId}/edit`} className="btn btn-outline gap-1.5 sm:gap-2">
-                        <LuSettings2 className="sm:h-5 sm:w-5" />
-                        <span>編集</span>
-                      </NavLink>
-                    )}
                   </div>
                 ) : (
                   <div className="flex items-center justify-between">
@@ -430,26 +430,18 @@ export default function SubmissionPage() {
                       <span className="hidden sm:inline">ホームに戻る</span>
                       <span className="sm:hidden">ホーム</span>
                     </NavLink>
-                    <div className="flex items-center gap-2">
-                      <button
-                        type="button"
-                        className="btn btn-primary gap-1.5 sm:gap-2"
-                        disabled={loading}
-                        onClick={() => {
-                          setEditMode(true);
-                        }}
-                      >
-                        <LuPencil className="h-4 w-4 sm:h-5 sm:w-5" />
-                        <span className="hidden sm:inline">日程を更新する</span>
-                        <span className="sm:hidden">日程更新</span>
-                      </button>
-                      {isHost && (
-                        <NavLink to={`/e/${projectId}/edit`} className="btn btn-outline gap-1.5 sm:gap-2">
-                          <LuSettings2 className="sm:h-5 sm:w-5" />
-                          <span>編集</span>
-                        </NavLink>
-                      )}
-                    </div>
+                    <button
+                      type="button"
+                      className="btn btn-primary gap-1.5 sm:gap-2"
+                      disabled={loading}
+                      onClick={() => {
+                        setEditMode(true);
+                      }}
+                    >
+                      <LuPencil className="h-4 w-4 sm:h-5 sm:w-5" />
+                      <span className="hidden sm:inline">日程を更新する</span>
+                      <span className="sm:hidden">日程更新</span>
+                    </button>
                   </div>
                 )}
               </div>

From 8a1f82d46518d0e76fb3b8fa69a35a838b6957a1 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Sat, 3 Jan 2026 17:23:38 +0900
Subject: [PATCH 28/32] =?UTF-8?q?submission=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/eventId/Submission.tsx | 89 +++++++++++++------------
 1 file changed, 46 insertions(+), 43 deletions(-)

diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index b1771db..da77fd9 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -290,50 +290,53 @@ export default function SubmissionPage() {
           </div>
         ) : (
           <div className="flex flex-1 flex-col overflow-y-auto">
-            <div className="mx-auto flex w-full max-w-7xl flex-1 flex-col px-4 pt-3 pb-3 sm:px-6 sm:pt-4 sm:pb-3 lg:px-8">
-              <div className="mb-2 flex items-center justify-between gap-2 sm:mb-3">
-                <h1 className="truncate font-bold text-base text-slate-900 sm:text-lg">{project.name}</h1>
-                {isHost && (
-                  <NavLink to={`/e/${projectId}/edit`} className="btn btn-sm btn-outline shrink-0 gap-1.5">
-                    <LuSettings2 className="h-4 w-4" />
-                    <span>編集</span>
-                  </NavLink>
-                )}
+            <div className="mx-auto flex w-full max-w-7xl flex-1 flex-col px-4 py-3 sm:px-6 sm:py-4 lg:px-8">
+              {/* プロジェクト情報 */}
+              <div>
+                <div className="flex items-center justify-between gap-2">
+                  <h1 className="truncate font-bold text-base text-slate-900 sm:text-lg">{project.name}</h1>
+                  {isHost && (
+                    <NavLink to={`/e/${projectId}/edit`} className="btn btn-sm btn-outline shrink-0 gap-1.5">
+                      <LuSettings2 className="h-4 w-4" />
+                      <span>編集</span>
+                    </NavLink>
+                  )}
+                </div>
+                {project.description &&
+                  (() => {
+                    const { text: truncatedText, truncated } = truncateText(project.description);
+                    return (
+                      <div className="mt-2 sm:mt-3">
+                        <p className="whitespace-pre-wrap text-slate-600 text-sm">
+                          {descriptionExpanded ? project.description : truncatedText}
+                        </p>
+                        {truncated && (
+                          <button
+                            type="button"
+                            onClick={() => setDescriptionExpanded(!descriptionExpanded)}
+                            className="mt-1 inline-flex items-center gap-0.5 text-primary text-sm hover:underline"
+                          >
+                            {descriptionExpanded ? (
+                              <>
+                                閉じる
+                                <LuChevronUp className="h-4 w-4" />
+                              </>
+                            ) : (
+                              <>
+                                もっと見る
+                                <LuChevronDown className="h-4 w-4" />
+                              </>
+                            )}
+                          </button>
+                        )}
+                      </div>
+                    );
+                  })()}
               </div>
 
-              {project.description &&
-                (() => {
-                  const { text: truncatedText, truncated } = truncateText(project.description);
-                  return (
-                    <div className="mb-4">
-                      <p className="whitespace-pre-wrap text-slate-600 text-sm">
-                        {descriptionExpanded ? project.description : truncatedText}
-                      </p>
-                      {truncated && (
-                        <button
-                          type="button"
-                          onClick={() => setDescriptionExpanded(!descriptionExpanded)}
-                          className="mt-1 inline-flex items-center gap-0.5 text-primary text-sm hover:underline"
-                        >
-                          {descriptionExpanded ? (
-                            <>
-                              閉じる
-                              <LuChevronUp className="h-4 w-4" />
-                            </>
-                          ) : (
-                            <>
-                              もっと見る
-                              <LuChevronDown className="h-4 w-4" />
-                            </>
-                          )}
-                        </button>
-                      )}
-                    </div>
-                  );
-                })()}
-
+              {/* 参加形態選択ボタン */}
               {editMode && project.participationOptions.length > 1 && selectedParticipationOptionId !== null && (
-                <div className="mb-2 flex flex-wrap items-center gap-1.5 sm:mb-3 sm:gap-2">
+                <div className="mt-3 mb-2 flex flex-wrap items-center gap-1.5">
                   {project.participationOptions.map((opt) => {
                     const rgb = hexToRgb(opt.color);
                     const lightBg = rgb
@@ -344,7 +347,7 @@ export default function SubmissionPage() {
                       <button
                         key={opt.id}
                         type="button"
-                        className="btn btn-sm sm:btn-md gap-1.5 sm:gap-2"
+                        className="btn btn-sm gap-1.5"
                         onClick={() => setSelectedParticipationOptionId(opt.id)}
                         style={
                           selectedParticipationOptionId === opt.id
@@ -377,7 +380,7 @@ export default function SubmissionPage() {
               />
             </div>
 
-            <div className="sticky bottom-0 z-10 border-slate-200 border-t bg-white/95 backdrop-blur-sm">
+            <div className="sticky bottom-0 z-10 border-slate-200 border-t bg-white">
               <div className="mx-auto max-w-7xl px-4 py-2 sm:px-6 sm:py-3 lg:px-8">
                 {editMode ? (
                   <div className="flex items-center gap-2">

From 8d17240cdeb9e9becffb1b6db896c11336e9da42 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Sat, 3 Jan 2026 18:15:33 +0900
Subject: [PATCH 29/32] =?UTF-8?q?Home=20=E3=81=A8=E9=96=A2=E9=80=A3?=
 =?UTF-8?q?=E9=83=A8=E5=88=86=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Home.tsx     | 16 ++++++++--------
 client/src/pages/NotFound.tsx |  2 +-
 client/src/pages/Project.tsx  | 12 ++++++------
 3 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index 9cfa31b..9bac0f8 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -63,7 +63,7 @@ export default function HomePage() {
 
   return (
     <>
-      <div className="flex min-h-screen flex-col bg-slate-50 font-sans text-slate-900">
+      <div className="flex min-h-screen flex-col bg-slate-50 text-slate-900">
         <Header />
         <main className="mx-auto w-full max-w-4xl flex-1 px-4 py-8 sm:px-6 lg:px-8">
           <div className="mb-8 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
@@ -129,14 +129,14 @@ function ProjectDashboard({ involvedProjects }: { involvedProjects: BriefProject
 function ProjectSection({ title, icon, projects }: { title: string; icon: React.ReactNode; projects: BriefProject[] }) {
   return (
     <section>
-      <div className="mb-4 flex items-center gap-2 text-slate-700">
+      <div className="flex items-center gap-2 text-slate-700">
         {icon}
-        <h2 className="font-semibold text-lg">{title}</h2>
+        <h2 className="font-bold text-lg">{title}</h2>
         <span className="ml-1 rounded-full bg-slate-200 px-2 py-0.5 font-medium text-slate-600 text-xs">
           {projects.length}
         </span>
       </div>
-      <div className="overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm">
+      <div className="mt-4 overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm">
         {projects.map((project, index) => (
           <ProjectRow key={project.id} project={project} isLast={index === projects.length - 1} />
         ))}
@@ -147,13 +147,13 @@ function ProjectSection({ title, icon, projects }: { title: string; icon: React.
 
 function ProjectRow({ project, isLast }: { project: BriefProject; isLast: boolean }) {
   const formatDate = (date: Date) => {
-    return date.toLocaleDateString("ja-JP", { month: "short", day: "numeric" });
+    return date.toLocaleDateString("ja-JP", { year: "numeric", month: "short", day: "numeric" });
   };
 
   return (
     <NavLink
       to={`/e/${project.id}`}
-      className={`group flex items-center justify-between gap-4 px-4 py-4 transition-colors hover:bg-slate-50 ${
+      className={`group flex items-center justify-between gap-4 p-4 transition-colors hover:bg-slate-50 ${
         !isLast ? "border-slate-100 border-b" : ""
       }`}
     >
@@ -175,11 +175,11 @@ function ProjectRow({ project, isLast }: { project: BriefProject; isLast: boolea
 
 function EmptyState() {
   return (
-    <div className="flex min-h-[400px] flex-col items-center justify-center rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
+    <div className="flex min-h-[300px] flex-col items-center justify-center rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
       <div className="mb-6 flex h-16 w-16 items-center justify-center rounded-full bg-slate-100">
         <LuLayoutList className="h-8 w-8 text-slate-400" />
       </div>
-      <h3 className="mb-2 font-semibold text-lg text-slate-900">まだイベントがありません</h3>
+      <h3 className="mb-2 font-bold text-lg text-slate-900">まだイベントがありません</h3>
       <p className="max-w-sm text-slate-500 text-sm">「新規作成」ボタンから、新しい日程調整を始めましょう。</p>
     </div>
   );
diff --git a/client/src/pages/NotFound.tsx b/client/src/pages/NotFound.tsx
index 1fa1fdf..6576e8e 100644
--- a/client/src/pages/NotFound.tsx
+++ b/client/src/pages/NotFound.tsx
@@ -4,7 +4,7 @@ import Header from "../components/Header";
 
 export default function NotFoundPage() {
   return (
-    <div className="min-h-screen bg-slate-50 font-sans text-slate-900">
+    <div className="min-h-screen bg-slate-50 text-slate-900">
       <Header />
       <main className="mx-auto max-w-7xl px-4 py-16 sm:px-6 sm:py-24 lg:px-8">
         <div className="fade-in zoom-in-95 flex min-h-[500px] animate-in flex-col items-center justify-center rounded-3xl border border-slate-300 border-dashed bg-white/50 p-8 text-center duration-500">
diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index 6d04bc9..f69a212 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -275,7 +275,7 @@ export default function ProjectPage() {
 
   return (
     <>
-      <div className="min-h-screen bg-slate-50 font-sans text-slate-900">
+      <div className="min-h-screen bg-slate-50 text-slate-900">
         <Header />
         {loading ? (
           <div className="flex min-h-[60vh] items-center justify-center">
@@ -300,7 +300,7 @@ export default function ProjectPage() {
             <form id="project-form" onSubmit={handleSubmit(onSubmit)} className="space-y-6">
               {/* 基本情報 */}
               <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
-                <h2 className="mb-4 font-semibold text-base text-slate-900 sm:text-lg">基本情報</h2>
+                <h2 className="mb-4 font-bold text-base text-slate-900 sm:text-lg">基本情報</h2>
                 <div className="space-y-4">
                   <div>
                     <label className="mb-2 block font-medium text-slate-700 text-sm" htmlFor="input-name">
@@ -360,7 +360,7 @@ export default function ProjectPage() {
 
               {/* 日程の範囲 */}
               <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
-                <h2 className="mb-4 font-semibold text-base text-slate-900 sm:text-lg">日程の範囲</h2>
+                <h2 className="mb-4 font-bold text-base text-slate-900 sm:text-lg">日程の範囲</h2>
                 <div className="grid gap-4 sm:grid-cols-2">
                   <div
                     className={project && project.guests.length > 0 ? "tooltip tooltip-top" : ""}
@@ -409,7 +409,7 @@ export default function ProjectPage() {
 
               {/* 時間帯 */}
               <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
-                <h2 className="mb-4 font-semibold text-base text-slate-900 sm:text-lg">時間帯</h2>
+                <h2 className="mb-4 font-bold text-base text-slate-900 sm:text-lg">時間帯</h2>
                 <div
                   className={project && project.guests.length > 0 ? "tooltip tooltip-top w-full" : "w-full"}
                   data-tip={
@@ -532,7 +532,7 @@ export default function ProjectPage() {
                   checked={isParticipationExpanded}
                   onChange={(e) => setIsParticipationExpanded(e.target.checked)}
                 />
-                <div className="collapse-title font-semibold text-base text-slate-900 sm:text-lg">
+                <div className="collapse-title font-bold text-base text-slate-900 sm:text-lg">
                   参加形態の設定 (任意)
                 </div>
                 <div className="collapse-content px-4">
@@ -621,7 +621,7 @@ export default function ProjectPage() {
               {/* イベントの削除 */}
               {project && (
                 <div className="rounded-2xl border border-red-200 bg-red-50/50 p-6 shadow-sm">
-                  <h2 className="mb-2 font-semibold text-base text-slate-900 sm:text-lg">イベントの削除</h2>
+                  <h2 className="mb-2 font-bold text-base text-slate-900 sm:text-lg">イベントの削除</h2>
                   <p className="mb-4 text-slate-600 text-sm">この操作は取り消せません。慎重に行ってください。</p>
                   <button
                     type="button"

From cb6049a7b0c32914c0beade1e301ecaf902d88e7 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Sat, 3 Jan 2026 18:21:06 +0900
Subject: [PATCH 30/32] =?UTF-8?q?NotFound=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/NotFound.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/src/pages/NotFound.tsx b/client/src/pages/NotFound.tsx
index 6576e8e..ca8e081 100644
--- a/client/src/pages/NotFound.tsx
+++ b/client/src/pages/NotFound.tsx
@@ -6,8 +6,8 @@ export default function NotFoundPage() {
   return (
     <div className="min-h-screen bg-slate-50 text-slate-900">
       <Header />
-      <main className="mx-auto max-w-7xl px-4 py-16 sm:px-6 sm:py-24 lg:px-8">
-        <div className="fade-in zoom-in-95 flex min-h-[500px] animate-in flex-col items-center justify-center rounded-3xl border border-slate-300 border-dashed bg-white/50 p-8 text-center duration-500">
+      <main className="mx-auto max-w-7xl px-4 py-8 sm:px-6 sm:py-12 lg:px-8">
+        <div className="flex min-h-[500px] flex-col items-center justify-center rounded-3xl border border-slate-300 border-dashed bg-white/50 p-8 text-center">
           <div className="mb-6 flex h-24 w-24 items-center justify-center rounded-full bg-slate-100 shadow-sm ring-1 ring-slate-200">
             <LuCircleAlert className="h-12 w-12 text-slate-400" />
           </div>

From 1bc0efe9e4d281d8b11327236db470feda97aa52 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Sat, 3 Jan 2026 18:42:08 +0900
Subject: [PATCH 31/32] =?UTF-8?q?Project=20=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Project.tsx | 69 +++++++++++++++++++-----------------
 1 file changed, 37 insertions(+), 32 deletions(-)

diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index f69a212..ca3f4c9 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -11,6 +11,7 @@ import {
   LuClipboard,
   LuClipboardCheck,
   LuInfo,
+  LuPlus,
   LuTrash2,
   LuX,
 } from "react-icons/lu";
@@ -282,7 +283,6 @@ export default function ProjectPage() {
             <span className="loading loading-dots loading-md text-slate-400" />
           </div>
         ) : eventId !== undefined && !project ? (
-          // TODO: NotFound に統一？
           <div className="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
             <div className="flex min-h-[400px] flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
               <p className="text-base text-slate-600 sm:text-xl">イベントが見つかりませんでした。</p>
@@ -310,7 +310,7 @@ export default function ProjectPage() {
                       {...register("name")}
                       id="input-name"
                       className={`w-full rounded-lg border px-3 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-4 sm:py-2.5 ${errors.name ? "border-red-500" : "border-slate-300"}`}
-                      placeholder="例: 3月度 同期飲み会"
+                      placeholder="例: 〇〇サークル 対面定例会議"
                       onBlur={() => trigger("name")}
                     />
                     {errors.name && <p className="mt-1.5 text-red-600 text-sm">{errors.name.message}</p>}
@@ -331,33 +331,6 @@ export default function ProjectPage() {
                 </div>
               </div>
 
-              {/* 情報ボックス */}
-              <div className="collapse-arrow collapse rounded-2xl border border-blue-200 bg-blue-50/50 p-1 text-primary shadow-sm">
-                <input type="checkbox" checked={isInfoExpanded} onChange={(e) => setIsInfoExpanded(e.target.checked)} />
-                <div className="collapse-title flex items-center gap-2 font-medium text-sm">
-                  <LuInfo className="h-5 w-5" />
-                  開始日・終了日／時間帯について
-                </div>
-                <div className="collapse-content px-4 text-sm">
-                  <p>
-                    イツヒマでは、<strong>主催者側で候補日程を設定せずに</strong>日程調整します。
-                    <br />
-                    ここでは、参加者の日程を知りたい日付の範囲と時間帯の範囲を設定してください。
-                    <br />
-                    詳しくは、
-                    <a
-                      href={EXTERNAL_LINKS.GUIDE}
-                      target="_blank"
-                      rel="noreferrer noopener"
-                      className="font-medium text-primary underline hover:text-primary/80"
-                    >
-                      使い方ページ
-                    </a>
-                    をご覧ください。
-                  </p>
-                </div>
-              </div>
-
               {/* 日程の範囲 */}
               <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
                 <h2 className="mb-4 font-bold text-base text-slate-900 sm:text-lg">日程の範囲</h2>
@@ -419,6 +392,7 @@ export default function ProjectPage() {
                   }
                 >
                   <div className="flex items-center gap-2 sm:gap-3">
+                    {/* from */}
                     <div className="flex flex-1 items-center gap-1.5 sm:gap-2">
                       <select
                         className={`flex-1 rounded-lg border px-2 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
@@ -469,6 +443,7 @@ export default function ProjectPage() {
                       </select>
                     </div>
                     <span className="font-medium text-slate-600 text-sm sm:text-base">〜</span>
+                    {/* to */}
                     <div className="flex flex-1 items-center gap-1.5 sm:gap-2">
                       <select
                         className={`flex-1 rounded-lg border px-2 py-2 text-base transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 sm:px-3 sm:py-2.5 ${errors.allowedRanges ? "border-red-500" : "border-slate-300"} ${project && project.guests.length > 0 ? "cursor-not-allowed bg-slate-50 opacity-60" : ""}`}
@@ -525,6 +500,33 @@ export default function ProjectPage() {
                 )}
               </div>
 
+              {/* 情報ボックス */}
+              <div className="collapse-arrow collapse rounded-2xl border border-blue-200 bg-blue-50/50 p-1 text-primary shadow-sm">
+                <input type="checkbox" checked={isInfoExpanded} onChange={(e) => setIsInfoExpanded(e.target.checked)} />
+                <div className="collapse-title flex items-center gap-2 font-medium text-sm">
+                  <LuInfo className="h-5 w-5" />
+                  開始日・終了日／時間帯について
+                </div>
+                <div className="collapse-content px-4 text-sm">
+                  <p>
+                    イツヒマでは、<strong>主催者側で候補日程を設定せずに</strong>日程調整します。
+                    <br />
+                    ここでは、参加者の日程を知りたい日付の範囲と時間帯の範囲を設定してください。
+                    <br />
+                    詳しくは、
+                    <a
+                      href={EXTERNAL_LINKS.GUIDE}
+                      target="_blank"
+                      rel="noreferrer noopener"
+                      className="font-medium text-primary underline hover:text-primary/80"
+                    >
+                      使い方ページ
+                    </a>
+                    をご覧ください。
+                  </p>
+                </div>
+              </div>
+
               {/* 参加形態 */}
               <div className="collapse-arrow collapse rounded-2xl border border-slate-200 bg-white p-3 shadow-sm">
                 <input
@@ -613,7 +615,8 @@ export default function ProjectPage() {
                     }}
                     className="btn btn-outline btn-sm sm:btn-md mt-4"
                   >
-                    + 参加形態を追加
+                    <LuPlus className="h-4 w-4 sm:h-5 sm:w-5" />
+                    <span>参加形態を追加</span>
                   </button>
                 </div>
               </div>
@@ -622,7 +625,9 @@ export default function ProjectPage() {
               {project && (
                 <div className="rounded-2xl border border-red-200 bg-red-50/50 p-6 shadow-sm">
                   <h2 className="mb-2 font-bold text-base text-slate-900 sm:text-lg">イベントの削除</h2>
-                  <p className="mb-4 text-slate-600 text-sm">この操作は取り消せません。慎重に行ってください。</p>
+                  <p className="mb-4 text-slate-600 text-sm">
+                    イベントを削除すると復元できません。慎重に行ってください。
+                  </p>
                   <button
                     type="button"
                     id="delete-button"
@@ -667,7 +672,7 @@ export default function ProjectPage() {
             </form>
 
             {/* 固定フッター */}
-            <div className="fixed right-0 bottom-0 left-0 z-10 border-slate-200 border-t bg-white/95 px-4 py-3 shadow-lg backdrop-blur-sm sm:py-4">
+            <div className="fixed right-0 bottom-0 left-0 z-10 border-slate-200 border-t bg-white px-4 py-3 shadow-lg sm:py-4">
               <div className="mx-auto flex max-w-7xl items-center justify-between gap-2 sm:gap-4">
                 {eventId ? (
                   <NavLink to={`/e/${eventId}`} className="btn btn-outline gap-1.5 sm:gap-2">

From 1cfa1cbd743beffed2f34bb81597094ceb97b819 Mon Sep 17 00:00:00 2001
From: nakaterm <104970808+nakaterm@users.noreply.github.com>
Date: Sat, 3 Jan 2026 18:47:00 +0900
Subject: [PATCH 32/32] =?UTF-8?q?rounded-lg=20=E3=81=AB=E7=B5=B1=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Header.tsx        |  8 ++++----
 client/src/pages/Home.tsx               |  6 +++---
 client/src/pages/Landing.tsx            |  4 ++--
 client/src/pages/Project.tsx            | 20 ++++++++++----------
 client/src/pages/eventId/Submission.tsx |  6 +++---
 5 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/client/src/components/Header.tsx b/client/src/components/Header.tsx
index ddb009f..42ce417 100644
--- a/client/src/components/Header.tsx
+++ b/client/src/components/Header.tsx
@@ -34,7 +34,7 @@ export default function Header() {
         <div className="flex items-center md:hidden">
           <button
             type="button"
-            className="rounded-md p-2 text-slate-600 hover:bg-slate-100"
+            className="rounded-lg p-2 text-slate-600 hover:bg-slate-100"
             onClick={() => setIsMenuOpen(!isMenuOpen)}
           >
             {isMenuOpen ? <LuX className="h-6 w-6" /> : <LuMenu className="h-6 w-6" />}
@@ -47,7 +47,7 @@ export default function Header() {
           <div className="flex flex-col gap-1 px-4 pt-2 pb-4">
             <NavLink
               to="/home"
-              className="block rounded-md px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
+              className="block rounded-lg px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
               onClick={() => setIsMenuOpen(false)}
             >
               ホーム
@@ -56,7 +56,7 @@ export default function Header() {
               href={EXTERNAL_LINKS.GUIDE}
               target="_blank"
               rel="noreferrer noopener"
-              className="block rounded-md px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
+              className="block rounded-lg px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
             >
               使い方ページ
             </a>
@@ -64,7 +64,7 @@ export default function Header() {
               href={EXTERNAL_LINKS.FEEDBACK}
               target="_blank"
               rel="noreferrer noopener"
-              className="block rounded-md px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
+              className="block rounded-lg px-3 py-2 font-medium text-base text-slate-600 hover:bg-slate-50 hover:text-primary"
             >
               ご意見・バグ報告
             </a>
diff --git a/client/src/pages/Home.tsx b/client/src/pages/Home.tsx
index 9bac0f8..a5acdc4 100644
--- a/client/src/pages/Home.tsx
+++ b/client/src/pages/Home.tsx
@@ -136,7 +136,7 @@ function ProjectSection({ title, icon, projects }: { title: string; icon: React.
           {projects.length}
         </span>
       </div>
-      <div className="mt-4 overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm">
+      <div className="mt-4 overflow-hidden rounded-lg border border-slate-200 bg-white shadow-sm">
         {projects.map((project, index) => (
           <ProjectRow key={project.id} project={project} isLast={index === projects.length - 1} />
         ))}
@@ -175,7 +175,7 @@ function ProjectRow({ project, isLast }: { project: BriefProject; isLast: boolea
 
 function EmptyState() {
   return (
-    <div className="flex min-h-[300px] flex-col items-center justify-center rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
+    <div className="flex min-h-[300px] flex-col items-center justify-center rounded-lg border border-slate-200 bg-white p-8 text-center shadow-sm">
       <div className="mb-6 flex h-16 w-16 items-center justify-center rounded-full bg-slate-100">
         <LuLayoutList className="h-8 w-8 text-slate-400" />
       </div>
@@ -194,7 +194,7 @@ function ProjectsSkeleton() {
             <div className="h-5 w-5 animate-pulse rounded bg-slate-200" />
             <div className="h-5 w-40 animate-pulse rounded bg-slate-200" />
           </div>
-          <div className="overflow-hidden rounded-xl border border-slate-200 bg-white shadow-sm">
+          <div className="overflow-hidden rounded-lg border border-slate-200 bg-white shadow-sm">
             {[1, 2, 3].map((row, index) => (
               <div
                 key={`row-${section}-${row}`}
diff --git a/client/src/pages/Landing.tsx b/client/src/pages/Landing.tsx
index 3393bcb..88559ec 100644
--- a/client/src/pages/Landing.tsx
+++ b/client/src/pages/Landing.tsx
@@ -68,9 +68,9 @@ function FeaturesSection() {
             {features.map((feature) => (
               <div
                 key={feature.title}
-                className="flex flex-col rounded-2xl border border-slate-100 bg-white p-8 shadow-sm"
+                className="flex flex-col rounded-lg border border-slate-100 bg-white p-8 shadow-sm"
               >
-                <div className={`inline-flex h-14 w-14 items-center justify-center rounded-xl ${feature.color}`}>
+                <div className={`inline-flex h-14 w-14 items-center justify-center rounded-lg ${feature.color}`}>
                   {feature.icon}
                 </div>
                 <h3 className="mt-6 font-bold text-slate-900 text-xl">{feature.title}</h3>
diff --git a/client/src/pages/Project.tsx b/client/src/pages/Project.tsx
index ca3f4c9..bc1e21a 100644
--- a/client/src/pages/Project.tsx
+++ b/client/src/pages/Project.tsx
@@ -284,7 +284,7 @@ export default function ProjectPage() {
           </div>
         ) : eventId !== undefined && !project ? (
           <div className="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
-            <div className="flex min-h-[400px] flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
+            <div className="flex min-h-[400px] flex-col items-center justify-center gap-4 rounded-lg border border-slate-200 bg-white p-8 text-center shadow-sm">
               <p className="text-base text-slate-600 sm:text-xl">イベントが見つかりませんでした。</p>
               <NavLink to="/" className="btn btn-primary">
                 ホームに戻る
@@ -299,7 +299,7 @@ export default function ProjectPage() {
 
             <form id="project-form" onSubmit={handleSubmit(onSubmit)} className="space-y-6">
               {/* 基本情報 */}
-              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+              <div className="rounded-lg border border-slate-200 bg-white p-6 shadow-sm">
                 <h2 className="mb-4 font-bold text-base text-slate-900 sm:text-lg">基本情報</h2>
                 <div className="space-y-4">
                   <div>
@@ -332,7 +332,7 @@ export default function ProjectPage() {
               </div>
 
               {/* 日程の範囲 */}
-              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+              <div className="rounded-lg border border-slate-200 bg-white p-6 shadow-sm">
                 <h2 className="mb-4 font-bold text-base text-slate-900 sm:text-lg">日程の範囲</h2>
                 <div className="grid gap-4 sm:grid-cols-2">
                   <div
@@ -381,7 +381,7 @@ export default function ProjectPage() {
               </div>
 
               {/* 時間帯 */}
-              <div className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
+              <div className="rounded-lg border border-slate-200 bg-white p-6 shadow-sm">
                 <h2 className="mb-4 font-bold text-base text-slate-900 sm:text-lg">時間帯</h2>
                 <div
                   className={project && project.guests.length > 0 ? "tooltip tooltip-top w-full" : "w-full"}
@@ -501,7 +501,7 @@ export default function ProjectPage() {
               </div>
 
               {/* 情報ボックス */}
-              <div className="collapse-arrow collapse rounded-2xl border border-blue-200 bg-blue-50/50 p-1 text-primary shadow-sm">
+              <div className="collapse-arrow collapse rounded-lg border border-blue-200 bg-blue-50/50 p-1 text-primary shadow-sm">
                 <input type="checkbox" checked={isInfoExpanded} onChange={(e) => setIsInfoExpanded(e.target.checked)} />
                 <div className="collapse-title flex items-center gap-2 font-medium text-sm">
                   <LuInfo className="h-5 w-5" />
@@ -528,7 +528,7 @@ export default function ProjectPage() {
               </div>
 
               {/* 参加形態 */}
-              <div className="collapse-arrow collapse rounded-2xl border border-slate-200 bg-white p-3 shadow-sm">
+              <div className="collapse-arrow collapse rounded-lg border border-slate-200 bg-white p-3 shadow-sm">
                 <input
                   type="checkbox"
                   checked={isParticipationExpanded}
@@ -623,7 +623,7 @@ export default function ProjectPage() {
 
               {/* イベントの削除 */}
               {project && (
-                <div className="rounded-2xl border border-red-200 bg-red-50/50 p-6 shadow-sm">
+                <div className="rounded-lg border border-red-200 bg-red-50/50 p-6 shadow-sm">
                   <h2 className="mb-2 font-bold text-base text-slate-900 sm:text-lg">イベントの削除</h2>
                   <p className="mb-4 text-slate-600 text-sm">
                     イベントを削除すると復元できません。慎重に行ってください。
@@ -696,7 +696,7 @@ export default function ProjectPage() {
       {/* 作成完了ダイアログ */}
       {dialogStatus !== null && (
         <div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/50 p-4 backdrop-blur-sm">
-          <div className="w-full max-w-md rounded-2xl border border-slate-200 bg-white p-5 shadow-2xl sm:p-6">
+          <div className="w-full max-w-md rounded-lg border border-slate-200 bg-white p-5 shadow-2xl sm:p-6">
             <h3 className="mb-1.5 font-bold text-lg text-slate-900 sm:mb-2 sm:text-2xl">
               {dialogStatus.projectName}を作成しました
             </h3>
@@ -740,7 +740,7 @@ export default function ProjectPage() {
       {toast && (
         <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
-            <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
+            <div className="flex items-center gap-3 rounded-lg border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
               <LuCircleCheck className="h-6 w-6 shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
               <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
@@ -748,7 +748,7 @@ export default function ProjectPage() {
               </button>
             </div>
           ) : (
-            <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
+            <div className="flex items-center gap-3 rounded-lg border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
               <LuCircleAlert className="h-6 w-6 shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
               <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
diff --git a/client/src/pages/eventId/Submission.tsx b/client/src/pages/eventId/Submission.tsx
index da77fd9..59df823 100644
--- a/client/src/pages/eventId/Submission.tsx
+++ b/client/src/pages/eventId/Submission.tsx
@@ -277,7 +277,7 @@ export default function SubmissionPage() {
           </div>
         ) : !project ? (
           <div className="mx-auto flex w-full max-w-7xl flex-col items-center justify-center gap-4 px-4 py-16 sm:px-6 lg:px-8">
-            <div className="flex min-h-[400px] w-full flex-col items-center justify-center gap-4 rounded-2xl border border-slate-200 bg-white p-8 text-center shadow-sm">
+            <div className="flex min-h-[400px] w-full flex-col items-center justify-center gap-4 rounded-lg border border-slate-200 bg-white p-8 text-center shadow-sm">
               <p className="text-slate-600 text-xl">イベントが見つかりませんでした。</p>
               <NavLink to="/" className="btn btn-primary">
                 ホームに戻る
@@ -456,7 +456,7 @@ export default function SubmissionPage() {
       {toast && (
         <div className="fixed top-20 right-4 z-50">
           {toast.variant === "success" ? (
-            <div className="flex items-center gap-3 rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
+            <div className="flex items-center gap-3 rounded-lg border border-emerald-200 bg-emerald-50 px-4 py-3 shadow-lg">
               <LuCircleCheck className="h-6 w-6 shrink-0 text-emerald-600" />
               <span className="font-medium text-emerald-900 text-sm">{toast.message}</span>
               <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">
@@ -464,7 +464,7 @@ export default function SubmissionPage() {
               </button>
             </div>
           ) : (
-            <div className="flex items-center gap-3 rounded-xl border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
+            <div className="flex items-center gap-3 rounded-lg border border-red-200 bg-red-50 px-4 py-3 shadow-lg">
               <LuCircleAlert className="h-6 w-6 shrink-0 text-red-600" />
               <span className="font-medium text-red-900 text-sm">{toast.message}</span>
               <button type="button" onClick={() => setToast(null)} className="btn btn-circle btn-ghost btn-xs">