diff --git a/apps/ai-game-creator-shell/package.json b/apps/ai-game-creator-shell/package.json
index 78f73ea34..f2a16f265 100644
--- a/apps/ai-game-creator-shell/package.json
+++ b/apps/ai-game-creator-shell/package.json
@@ -24,12 +24,15 @@
     "lucide-react": "^0.546.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "vite": "^6.2.0"
+    "vite": "^6.2.0",
+    "zustand": "^5.0.14"
   },
   "devDependencies": {
+    "@tailwindcss/vite": "^4.1.14",
     "@tauri-apps/cli": "^2.11.2",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
+    "tailwindcss": "^4.1.14",
     "typescript": "~5.8.2"
   }
 }
diff --git a/apps/ai-game-creator-shell/src/App.tsx b/apps/ai-game-creator-shell/src/App.tsx
index c038dcdb5..960f3f863 100644
--- a/apps/ai-game-creator-shell/src/App.tsx
+++ b/apps/ai-game-creator-shell/src/App.tsx
@@ -32,14 +32,22 @@ import {
   Plus,
   Send,
   Settings,
-  Sparkles,
   Target,
   Trash2,
-  Upload,
   User,
-  X,
   Zap,
 } from 'lucide-react';
+import HomeView, {
+  type HomeDraft,
+  type HomeAgentMode,
+  type HomeAgentModeItem,
+  type HomeAttachmentDraft,
+} from './view/home';
+import { useLauncherHomeDraftStore } from './stores/useHomeDraftStore';
+import {
+  getClientProfileDashboard,
+  getClientProfileWalletLedger,
+} from './services/clientApi';
 
 import type {
   AuthEntryResponse,
@@ -58,7 +66,6 @@ import {
 import type {
   ProfileDashboardSummary,
   ProfileWalletLedgerEntry,
-  ProfileWalletLedgerResponse,
 } from '../../../packages/shared/src/contracts/runtime';
 import {
   createGameCreationAppManifest,
@@ -116,7 +123,6 @@ type LauncherView =
   | 'contact'
   | 'news'
   | 'project-development';
-type HomeAgentMode = 'game' | 'art' | 'doc';
 type AgentChatInteractionMode = 'run' | 'chat' | 'goal';
 type AgentBackgroundSubmitMode = 'steer' | 'queue';
 type AgentChatReplyPhase =
@@ -146,12 +152,6 @@ type AgentGoalDialogState = {
   constraintsText: string;
   verificationText: string;
 };
-
-type HomeAttachmentDraft = {
-  id: string;
-  file: File;
-};
-
 type LauncherImportedAttachment = {
   fileName: string;
   mediaType: string;
@@ -190,26 +190,6 @@ type PendingNonEmptyProject =
       projectPath: string;
     };
 
-type EditorShowcaseResource = {
-  resourceId: string;
-  showcaseId?: string | null;
-  label?: string | null;
-  imageSrc: string;
-  width?: number;
-  height?: number;
-  prompt?: string | null;
-  actualPrompt?: string | null;
-  assetKind?: string | null;
-  authorDisplayName?: string | null;
-  authorPublicUserCode?: string | null;
-  likeCount?: number | null;
-};
-
-type EditorShowcaseResourceListResponse = {
-  resources: EditorShowcaseResource[];
-  nextCursor?: string | null;
-};
-
 interface InitLocalProjectResult {
   projectPath: string;
   manifestPath: string;
@@ -3796,38 +3776,7 @@ async function logoutClientAuthSession() {
   }
 }
 
-function getClientProfileDashboard() {
-  return requestAuthJson<ProfileDashboardSummary>(
-    '/api/profile/dashboard',
-    { method: 'GET' },
-    '读取泥点余额失败',
-  );
-}
-
-function getClientProfileWalletLedger() {
-  return requestAuthJson<ProfileWalletLedgerResponse>(
-    '/api/profile/wallet-ledger',
-    { method: 'GET' },
-    '读取泥点明细失败',
-  );
-}
-
-function listClientShowcaseResources() {
-  return requestAuthJson<EditorShowcaseResourceListResponse>(
-    '/api/editor/showcase/resources',
-    { method: 'GET' },
-    '读取灵感推荐失败',
-    { skipAuth: true },
-  );
-}
-
-const homeAgentModeItems: Array<{
-  mode: HomeAgentMode;
-  label: string;
-  placeholder: string;
-  emptyPrompt: string;
-  icon: typeof Gamepad2;
-}> = [
+const homeAgentModeItems: HomeAgentModeItem[] = [
   {
     mode: 'game',
     label: '做游戏',
@@ -3885,10 +3834,6 @@ function formatLocalDateTime(value: string | number | null | undefined) {
   });
 }
 
-function createHomeAttachmentId(file: File, index: number) {
-  return `${file.name}:${file.size}:${file.lastModified}:${index}:${Date.now()}`;
-}
-
 function buildHomeConversationContent(
   mode: HomeAgentMode,
   prompt: string,
@@ -5427,12 +5372,6 @@ export function WorkspaceLauncher({
   const [projectPath, setProjectPath] = useState(defaultProjectPath);
   const [status, setStatus] = useState('请选择项目');
   const [launcherView, setLauncherView] = useState<LauncherView>(initialView);
-  const [homeAgentMode, setHomeAgentMode] = useState<HomeAgentMode>('game');
-  const [homePrompt, setHomePrompt] = useState('');
-  const [homeAttachments, setHomeAttachments] = useState<HomeAttachmentDraft[]>(
-    [],
-  );
-  const [homeCreationBusy, setHomeCreationBusy] = useState(false);
   const [currentProjectContext, setCurrentProjectContext] =
     useState<LauncherProjectContext | null>(null);
   const [recentWorkspaces, setRecentWorkspaces] =
@@ -5459,13 +5398,11 @@ export function WorkspaceLauncher({
     title: string;
     message: string;
   } | null>(null);
-  const [showcaseResources, setShowcaseResources] = useState<
-    EditorShowcaseResource[]
-  >([]);
-  const [showcaseStatus, setShowcaseStatus] = useState('正在读取灵感');
-  const homeAttachmentInputRef = useRef<HTMLInputElement | null>(null);
   const accountMenuRef = useRef<HTMLDivElement | null>(null);
   const helpMenuRef = useRef<HTMLDivElement | null>(null);
+  const resetLauncherHomeDraft = useLauncherHomeDraftStore(
+    (state) => state.reset,
+  );
   const launcherAgentChatAgents = deriveAgentStatusCards(seedManifest, null);
   const [agentChatProjectPath, setAgentChatProjectPath] =
     useState(defaultProjectPath);
@@ -5920,25 +5857,6 @@ export function WorkspaceLauncher({
           error instanceof Error ? error.message : '泥点读取失败',
         );
       });
-    void listClientShowcaseResources()
-      .then((response) => {
-        if (disposed) {
-          return;
-        }
-        setShowcaseResources(response.resources.slice(0, 6));
-        setShowcaseStatus(
-          response.resources.length > 0 ? '已读取灵感' : '暂无灵感',
-        );
-      })
-      .catch((error) => {
-        if (disposed) {
-          return;
-        }
-        setShowcaseResources([]);
-        setShowcaseStatus(
-          error instanceof Error ? error.message : '灵感读取失败',
-        );
-      });
     return () => {
       disposed = true;
     };
@@ -6066,14 +5984,13 @@ export function WorkspaceLauncher({
   ) {
     const trimmedProjectPath = validateProjectPath(nextProjectPath);
     if (!trimmedProjectPath) {
-      return;
+      return '项目目录无效';
     }
     const invoke = resolveTauriInvoke();
     if (!invoke) {
       setStatus('需要在 Tauri App 内运行');
-      return;
+      return '需要在 Tauri App 内运行';
     }
-    setHomeCreationBusy(true);
     setStatus('正在创建项目');
     try {
       if (!skipNonEmptyCheck) {
@@ -6090,7 +6007,7 @@ export function WorkspaceLauncher({
             attachments,
           });
           setStatus('目标文件夹不是空的');
-          return;
+          return '目标文件夹不是空的，请确认是否继续新建';
         }
       }
       const result = await invoke<InitLocalProjectResult>(
@@ -6145,12 +6062,12 @@ export function WorkspaceLauncher({
         recentRunStopReason: null,
         createdAt: Date.now(),
       });
-      setHomePrompt('');
-      setHomeAttachments([]);
+      resetLauncherHomeDraft();
+      return '已创建项目并进入项目开发';
     } catch (error) {
-      setStatus(error instanceof Error ? error.message : String(error));
-    } finally {
-      setHomeCreationBusy(false);
+      const message = error instanceof Error ? error.message : String(error);
+      setStatus(message);
+      throw error;
     }
   }
 
@@ -6275,17 +6192,21 @@ export function WorkspaceLauncher({
     }
     const pendingProject = pendingNonEmptyProject;
     setPendingNonEmptyProject(null);
-    if (pendingProject.kind === 'home-create') {
-      await createHomeProjectFromDirectory(
-        pendingProject.projectPath,
-        pendingProject.mode,
-        pendingProject.prompt,
-        pendingProject.attachments,
-        true,
-      );
-      return;
+    try {
+      if (pendingProject.kind === 'home-create') {
+        await createHomeProjectFromDirectory(
+          pendingProject.projectPath,
+          pendingProject.mode,
+          pendingProject.prompt,
+          pendingProject.attachments,
+          true,
+        );
+        return;
+      }
+      await createProjectFromProjectPage(pendingProject.projectPath, true);
+    } catch (error) {
+      setStatus(error instanceof Error ? error.message : String(error));
     }
-    await createProjectFromProjectPage(pendingProject.projectPath, true);
   }
 
   function cancelCreateInNonEmptyFolder() {
@@ -6303,43 +6224,51 @@ export function WorkspaceLauncher({
     void openProject(projectPath, 'open');
   }
 
-  async function handleHomeSubmit(event: FormEvent<HTMLFormElement>) {
-    event.preventDefault();
-    const activeMode = homeAgentModeItems.find(
-      (item) => item.mode === homeAgentMode,
-    );
-    if (!homePrompt.trim() && homeAttachments.length === 0) {
-      setStatus(activeMode?.emptyPrompt ?? '请输入需求或上传附件');
-      return;
-    }
+  async function createHomeDraft(draft: HomeDraft) {
     const invoke = resolveTauriInvoke();
     if (!invoke) {
-      setStatus('需要在 Tauri App 内运行');
-      return;
+      throw new Error('需要在 Tauri App 内运行');
     }
-    setHomeCreationBusy(true);
-    setStatus('请选择项目目录');
+    const selectedPath = await invoke<string | null>(
+      'pick_local_project_directory',
+    );
+    if (!selectedPath) {
+      return '已取消';
+    }
+    return createHomeProjectFromDirectory(
+      selectedPath,
+      draft.mode,
+      draft.prompt,
+      draft.attachments,
+    );
+  }
+
+  async function loadWalletLedger() {
+    setWalletLedgerStatus('正在读取明细');
     try {
-      const selectedPath = await invoke<string | null>(
-        'pick_local_project_directory',
-      );
-      if (!selectedPath) {
-        setStatus('已取消');
-        return;
-      }
-      await createHomeProjectFromDirectory(
-        selectedPath,
-        homeAgentMode,
-        homePrompt,
-        homeAttachments,
+      const response = await getClientProfileWalletLedger();
+      setWalletLedger(response.entries.slice(0, 5));
+      setWalletLedgerStatus(
+        response.entries.length > 0 ? '已读取明细' : '暂无泥点明细',
       );
     } catch (error) {
-      setStatus(error instanceof Error ? error.message : String(error));
-    } finally {
-      setHomeCreationBusy(false);
+      setWalletLedger([]);
+      setWalletLedgerStatus(
+        error instanceof Error ? error.message : '明细读取失败',
+      );
     }
   }
 
+  function showLauncherNotice(title: string) {
+    setAccountMenuOpen(false);
+    setHelpMenuOpen(false);
+    setWalletPanelOpen(false);
+    setLauncherNotice({
+      title,
+      message: `${title}正在接入中，当前版本会先保留入口。`,
+    });
+  }
+
   async function handlePickProjectDirectory() {
     const invoke = resolveTauriInvoke();
     if (!invoke) {
@@ -6387,53 +6316,6 @@ export function WorkspaceLauncher({
     }
   }
 
-  function handleHomeAttachmentSelection(event: ChangeEvent<HTMLInputElement>) {
-    const files = Array.from(event.currentTarget.files ?? []);
-    event.currentTarget.value = '';
-    if (files.length === 0) {
-      return;
-    }
-    setHomeAttachments((current) => [
-      ...current,
-      ...files.map((file, index) => ({
-        id: createHomeAttachmentId(file, index),
-        file,
-      })),
-    ]);
-  }
-
-  function removeHomeAttachment(attachmentId: string) {
-    setHomeAttachments((current) =>
-      current.filter((attachment) => attachment.id !== attachmentId),
-    );
-  }
-
-  async function loadWalletLedger() {
-    setWalletLedgerStatus('正在读取明细');
-    try {
-      const response = await getClientProfileWalletLedger();
-      setWalletLedger(response.entries.slice(0, 5));
-      setWalletLedgerStatus(
-        response.entries.length > 0 ? '已读取明细' : '暂无泥点明细',
-      );
-    } catch (error) {
-      setWalletLedger([]);
-      setWalletLedgerStatus(
-        error instanceof Error ? error.message : '明细读取失败',
-      );
-    }
-  }
-
-  function showLauncherNotice(title: string) {
-    setAccountMenuOpen(false);
-    setHelpMenuOpen(false);
-    setWalletPanelOpen(false);
-    setLauncherNotice({
-      title,
-      message: `${title}正在接入中，当前版本会先保留入口。`,
-    });
-  }
-
   function handleRecentWorkspaceRefresh() {
     if (recentWorkspaces.length === 0 || recentWorkspaceRefreshing) {
       return;
@@ -8578,10 +8460,6 @@ export function WorkspaceLauncher({
   const recentProjectRows = projectRows
     .filter((project) => project.canOpen)
     .slice(0, 3);
-  const activeHomeMode =
-    homeAgentModeItems.find((item) => item.mode === homeAgentMode) ??
-    homeAgentModeItems[0]!;
-  const ActiveHomeModeIcon = activeHomeMode.icon;
   const currentAgentChatAgent = selectedLauncherAgentChatAgent();
   const currentAgentChatSession = selectedLauncherAgentChatSession();
   const currentAgentChatSessionArchived =
@@ -8716,7 +8594,9 @@ export function WorkspaceLauncher({
               <div className="launcher-account-popover" role="menu">
                 <strong>{currentUser.displayName || '陶泥儿用户'}</strong>
                 <span>
-                  {currentUser.phoneNumberMasked || currentUser.publicUserCode}
+                  {currentUser.phoneNumberMasked ||
+                    currentUser.publicUserCode ||
+                    '账号信息读取中'}
                 </span>
                 <button
                   type="button"
@@ -8739,7 +8619,14 @@ export function WorkspaceLauncher({
                 >
                   反馈联系
                 </button>
-                <button type="button" role="menuitem" onClick={onLogout}>
+                <button
+                  type="button"
+                  role="menuitem"
+                  onClick={() => {
+                    resetLauncherHomeDraft();
+                    onLogout();
+                  }}
+                >
                   <LogOut size={14} aria-hidden="true" />
                   退出登录
                 </button>
@@ -8867,177 +8754,19 @@ export function WorkspaceLauncher({
         </div>
 
         {launcherView === 'home' ? (
-          <>
-            <section className="launcher-hero" aria-label="首页输入">
-              <div className="launcher-hero-title">
-                <span className="launcher-hero-logo">
-                  <ActiveHomeModeIcon size={18} aria-hidden="true" />
-                </span>
-                <div>
-                  <h1>陶泥儿 GameAgent</h1>
-                  <p>{activeHomeMode.placeholder}</p>
-                </div>
-              </div>
-              <div className="launcher-model-pills" aria-label="Agent 分类">
-                {homeAgentModeItems.map((item) => {
-                  const ModeIcon = item.icon;
-                  return (
-                    <button
-                      type="button"
-                      key={item.mode}
-                      className={
-                        item.mode === homeAgentMode
-                          ? 'launcher-pill-active'
-                          : ''
-                      }
-                      onClick={() => setHomeAgentMode(item.mode)}
-                    >
-                      <ModeIcon size={14} aria-hidden="true" />
-                      {item.label}
-                    </button>
-                  );
-                })}
-              </div>
-              <form
-                className="launcher-prompt-card"
-                onSubmit={handleHomeSubmit}
-              >
-                <textarea
-                  aria-label="创作想法"
-                  placeholder={activeHomeMode.placeholder}
-                  value={homePrompt}
-                  onChange={(event) => setHomePrompt(event.currentTarget.value)}
-                />
-                {homeAttachments.length > 0 ? (
-                  <div
-                    className="launcher-attachment-queue"
-                    aria-label="附件队列"
-                  >
-                    {homeAttachments.map((attachment) => (
-                      <span key={attachment.id}>
-                        {attachment.file.name}
-                        <button
-                          type="button"
-                          aria-label={`移除附件 ${attachment.file.name}`}
-                          onClick={() => removeHomeAttachment(attachment.id)}
-                        >
-                          <X size={12} aria-hidden="true" />
-                        </button>
-                      </span>
-                    ))}
-                  </div>
-                ) : null}
-                <div className="launcher-prompt-actions">
-                  <input
-                    ref={homeAttachmentInputRef}
-                    className="launcher-file-input"
-                    type="file"
-                    multiple
-                    onChange={handleHomeAttachmentSelection}
-                  />
-                  <button
-                    type="button"
-                    aria-label="上传素材"
-                    onClick={() => homeAttachmentInputRef.current?.click()}
-                  >
-                    <Upload size={15} aria-hidden="true" />
-                  </button>
-                  <span>{status}</span>
-                  <button
-                    type="submit"
-                    aria-label="开启创作"
-                    disabled={homeCreationBusy}
-                  >
-                    <Plus size={16} aria-hidden="true" />
-                  </button>
-                </div>
-              </form>
-            </section>
-
-            <section className="launcher-project-list" aria-label="最近项目">
-              <header>
-                <div>
-                  <h2>最近项目</h2>
-                  <p className="launcher-project-status">{status}</p>
-                </div>
-                <div className="launcher-project-list-actions">
-                  <button
-                    type="button"
-                    onClick={() => setLauncherView('projects')}
-                  >
-                    查看全部 〉
-                  </button>
-                </div>
-              </header>
-              {recentProjectRows.length > 0 ? (
-                <div className="launcher-project-grid">
-                  {recentProjectRows.map((project) => (
-                    <article
-                      className="launcher-project-card"
-                      key={project.path}
-                    >
-                      <button
-                        type="button"
-                        className="launcher-project-card-main"
-                        disabled={!project.canOpen}
-                        onClick={() => {
-                          setProjectPath(project.path);
-                          void openProject(project.path, 'open');
-                        }}
-                      >
-                        <span>{project.name.slice(0, 2)}</span>
-                        <strong>{project.name}</strong>
-                        <small>{project.path}</small>
-                        <small>{project.status}</small>
-                      </button>
-                    </article>
-                  ))}
-                </div>
-              ) : (
-                <div className="launcher-project-list-empty">
-                  <FolderKanban size={22} aria-hidden="true" />
-                  <strong>暂无最近项目</strong>
-                  <button
-                    type="button"
-                    onClick={() => setLauncherView('projects')}
-                  >
-                    去项目组
-                  </button>
-                </div>
-              )}
-            </section>
-            <section className="launcher-showcase" aria-label="灵感推荐">
-              <header>
-                <div className="launcher-section-title">
-                  <span>
-                    <h2>灵感推荐</h2>
-                    <Sparkles size={15} aria-hidden="true" />
-                  </span>
-                  <p>{showcaseStatus}</p>
-                </div>
-              </header>
-              {showcaseResources.length > 0 ? (
-                <div className="launcher-showcase-grid">
-                  {showcaseResources.map((resource) => (
-                    <article key={resource.showcaseId ?? resource.resourceId}>
-                      <img
-                        src={resource.imageSrc}
-                        alt={resource.label || resource.prompt || '灵感素材'}
-                      />
-                      <strong>{resource.label || '未命名素材'}</strong>
-                      <small>
-                        {resource.authorDisplayName ||
-                          resource.authorPublicUserCode ||
-                          '陶泥儿精选'}
-                      </small>
-                    </article>
-                  ))}
-                </div>
-              ) : (
-                <div className="launcher-showcase-empty">{showcaseStatus}</div>
-              )}
-            </section>
-          </>
+          <HomeView
+            hasPromo={launcherNotifications.length > 0}
+            status={status}
+            onStatusChange={setStatus}
+            homeAgentModeItems={homeAgentModeItems}
+            recentProjectRows={recentProjectRows}
+            onCreateDraft={createHomeDraft}
+            onProjectsOpen={() => setLauncherView('projects')}
+            onProjectOpen={(path) => {
+              setProjectPath(path);
+              void openProject(path, 'open');
+            }}
+          />
         ) : launcherView === 'projects' ? (
           <section className="launcher-page launcher-projects-page">
             <header>
diff --git a/apps/ai-game-creator-shell/src/services/clientApi.ts b/apps/ai-game-creator-shell/src/services/clientApi.ts
new file mode 100644
index 000000000..1684e04b9
--- /dev/null
+++ b/apps/ai-game-creator-shell/src/services/clientApi.ts
@@ -0,0 +1,152 @@
+import {
+  API_RESPONSE_ENVELOPE_HEADER,
+  API_RESPONSE_ENVELOPE_VERSION,
+  ProfileDashboardSummary,
+  ProfileWalletLedgerResponse,
+  unwrapApiResponse,
+} from '../../../../packages/shared/src';
+
+const ACCESS_TOKEN_STORAGE_KEY = 'genarrative.auth.access-token.v1';
+const DEFAULT_CLIENT_AUTH_API_BASE_URL = 'http://127.0.0.1:8082';
+
+export type EditorShowcaseResource = {
+  resourceId: string;
+  showcaseId?: string | null;
+  label?: string | null;
+  imageSrc: string;
+  width?: number;
+  height?: number;
+  prompt?: string | null;
+  actualPrompt?: string | null;
+  assetKind?: string | null;
+  authorDisplayName?: string | null;
+  authorPublicUserCode?: string | null;
+  likeCount?: number | null;
+};
+
+type EditorShowcaseResourceListResponse = {
+  resources: EditorShowcaseResource[];
+  nextCursor?: string | null;
+};
+
+export class ClientAuthRequestError extends Error {
+  readonly status: number | null;
+  readonly networkError: boolean;
+
+  constructor(
+    message: string,
+    options: { status?: number | null; networkError?: boolean } = {},
+  ) {
+    super(message);
+    this.status = options.status ?? null;
+    this.networkError = options.networkError ?? false;
+  }
+}
+
+export function getStoredAuthAccessToken() {
+  return window.localStorage.getItem(ACCESS_TOKEN_STORAGE_KEY)?.trim() || '';
+}
+
+export function setStoredAuthAccessToken(token: string) {
+  const nextToken = token.trim();
+  if (nextToken) {
+    window.localStorage.setItem(ACCESS_TOKEN_STORAGE_KEY, nextToken);
+    return;
+  }
+  window.localStorage.removeItem(ACCESS_TOKEN_STORAGE_KEY);
+}
+
+export function clearStoredAuthAccessToken() {
+  window.localStorage.removeItem(ACCESS_TOKEN_STORAGE_KEY);
+}
+
+function resolveClientApiUrl(url: string) {
+  if (/^https?:\/\//iu.test(url)) {
+    return url;
+  }
+  if (import.meta.env.DEV) {
+    return url;
+  }
+  const isHttpPage =
+    window.location.protocol === 'http:' ||
+    window.location.protocol === 'https:';
+  if (!window.__TAURI__ && isHttpPage) {
+    return url;
+  }
+  return `${DEFAULT_CLIENT_AUTH_API_BASE_URL}${url}`;
+}
+
+async function readApiErrorMessage(response: Response, fallback: string) {
+  const text = await response.text();
+  if (!text.trim()) {
+    return fallback;
+  }
+  try {
+    unwrapApiResponse(JSON.parse(text) as unknown);
+  } catch (error) {
+    return error instanceof Error ? error.message : fallback;
+  }
+  return fallback;
+}
+
+export async function requestClientApi<T>(
+  url: string,
+  init: RequestInit,
+  fallbackMessage: string,
+  options: { skipAuth?: boolean } = {},
+) {
+  const headers = new Headers(init.headers);
+  headers.set(API_RESPONSE_ENVELOPE_HEADER, API_RESPONSE_ENVELOPE_VERSION);
+  if (!options.skipAuth) {
+    const token = getStoredAuthAccessToken();
+    if (token) {
+      headers.set('Authorization', `Bearer ${token}`);
+    }
+  }
+  let response: Response;
+  try {
+    response = await fetch(resolveClientApiUrl(url), {
+      ...init,
+      credentials: 'same-origin',
+      headers,
+    });
+  } catch {
+    throw new ClientAuthRequestError(
+      '无法连接登录服务，请确认配套后端或 API 代理已启动后重试',
+      { networkError: true },
+    );
+  }
+  if (!response.ok) {
+    throw new ClientAuthRequestError(
+      await readApiErrorMessage(response, fallbackMessage),
+      { status: response.status },
+    );
+  }
+  const text = await response.text();
+  return text ? unwrapApiResponse<T>(JSON.parse(text) as T) : (null as T);
+}
+
+export function getClientProfileDashboard() {
+  return requestClientApi<ProfileDashboardSummary>(
+    '/api/profile/dashboard',
+    { method: 'GET' },
+    '读取泥点余额失败',
+  );
+}
+
+export function getClientProfileWalletLedger() {
+  return requestClientApi<ProfileWalletLedgerResponse>(
+    '/api/profile/wallet-ledger',
+    { method: 'GET' },
+    '读取泥点明细失败',
+  );
+}
+
+export function listClientShowcaseResources() {
+  return requestClientApi<EditorShowcaseResourceListResponse>(
+    '/api/editor/showcase/resources',
+    { method: 'GET' },
+    '读取灵感推荐失败',
+    { skipAuth: true },
+  );
+}
diff --git a/apps/ai-game-creator-shell/src/stores/useHomeDraftStore.ts b/apps/ai-game-creator-shell/src/stores/useHomeDraftStore.ts
new file mode 100644
index 000000000..4773a84c3
--- /dev/null
+++ b/apps/ai-game-creator-shell/src/stores/useHomeDraftStore.ts
@@ -0,0 +1,44 @@
+import { create } from 'zustand';
+
+export type HomeAgentMode = 'game' | 'art' | 'doc';
+
+export type HomeAttachmentDraft = {
+  id: string;
+  file: File;
+};
+
+export type HomeDraft = {
+  mode: HomeAgentMode;
+  prompt: string;
+  attachments: HomeAttachmentDraft[];
+};
+
+type UseHomeDraftStore = HomeDraft & {
+  setMode: (mode: HomeAgentMode) => void;
+  setPrompt: (prompt: string) => void;
+  addAttachments: (attachments: HomeAttachmentDraft[]) => void;
+  removeAttachment: (attachmentId: string) => void;
+  reset: () => void;
+};
+
+const initialHomeDraft: HomeDraft = {
+  mode: 'game',
+  prompt: '',
+  attachments: [],
+};
+
+// Keep non-serializable File objects available while the Home view is unmounted.
+export const useLauncherHomeDraftStore = create<UseHomeDraftStore>((set) => ({
+  ...initialHomeDraft,
+  setMode: (mode) => set({ mode }),
+  setPrompt: (prompt) => set({ prompt }),
+  addAttachments: (attachments) =>
+    set((state) => ({ attachments: [...state.attachments, ...attachments] })),
+  removeAttachment: (attachmentId) =>
+    set((state) => ({
+      attachments: state.attachments.filter(
+        (attachment) => attachment.id !== attachmentId,
+      ),
+    })),
+  reset: () => set(initialHomeDraft),
+}));
diff --git a/apps/ai-game-creator-shell/src/styles.css b/apps/ai-game-creator-shell/src/styles.css
index 7cc7f5e07..a51171a8c 100644
--- a/apps/ai-game-creator-shell/src/styles.css
+++ b/apps/ai-game-creator-shell/src/styles.css
@@ -1,3 +1,5 @@
+@import 'tailwindcss';
+
 :root {
   color: #18202f;
   background: #f5f7fb;
@@ -196,11 +198,8 @@ textarea {
 }
 
 .launcher-sidebar button,
-.launcher-project-list button,
 .launcher-promo button,
-.launcher-account-bar button,
-.launcher-prompt-card button,
-.launcher-model-pills button {
+.launcher-account-bar button {
   border: 0;
   cursor: pointer;
 }
@@ -467,281 +466,12 @@ textarea {
   font-weight: 700;
 }
 
-.launcher-hero {
-  display: grid;
-  align-content: start;
-  justify-items: center;
-  gap: 13px;
-  min-height: 374px;
-  padding: 103px 24px 18px;
-}
-
-.launcher-main-with-promo .launcher-hero {
-  padding-top: 135px;
-}
-
-.launcher-hero-title {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  text-align: center;
-}
-
-.launcher-hero-logo {
-  display: grid;
-  width: 30px;
-  height: 30px;
-  flex: 0 0 auto;
-  border-radius: 50%;
-  background: #060606;
-  color: #fff;
-  font-size: 11px;
-  font-weight: 700;
-  place-items: center;
-}
-
-.launcher-hero-title h1 {
-  margin: 0;
-  font-size: 27px;
-  font-weight: 750;
-  letter-spacing: 0;
-}
-
-.launcher-hero-title p {
-  margin-top: 12px;
-  color: #a0a0a0;
-  font-size: 13px;
-}
-
-.launcher-prompt-card {
-  display: grid;
-  grid-template-rows: minmax(42px, auto) auto auto;
-  width: min(488px, calc(100vw - 110px));
-  min-height: 80px;
-  padding: 13px 12px 8px;
-  border: 1px solid #e1e4e8;
-  border-radius: 18px;
-  background: #fff;
-  box-shadow: 0 8px 24px rgb(15 23 42 / 8%);
-}
-
-.launcher-prompt-card textarea {
-  width: 100%;
-  min-height: 36px;
-  padding: 0;
-  resize: none;
-  border: 0;
-  outline: 0;
-  background: transparent;
-  color: #171717;
-  font-size: 13px;
-}
-
-.launcher-attachment-queue {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 6px;
-  padding: 8px 0 4px;
-}
-
-.launcher-attachment-queue span {
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  max-width: 100%;
-  min-height: 24px;
-  padding: 0 7px;
-  border: 1px solid #e5e7eb;
-  border-radius: 7px;
-  background: #f8fafc;
-  color: #374151;
-  font-size: 11px;
-}
-
-.launcher-attachment-queue button {
-  width: 18px;
-  height: 18px;
-  color: #6b7280;
-}
-
-.launcher-file-input {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  opacity: 0;
-  pointer-events: none;
-}
-
-.launcher-prompt-card textarea::placeholder {
-  color: #bababa;
-}
-
-.launcher-prompt-actions {
-  display: grid;
-  grid-template-columns: auto 1fr auto;
-  align-items: center;
-  gap: 10px;
-  color: #777;
-  font-size: 12px;
-}
-
-.launcher-prompt-actions button {
-  display: grid;
-  width: 24px;
-  height: 24px;
-  padding: 0;
-  border-radius: 50%;
-  background: transparent;
-  color: #666;
-  place-items: center;
-}
-
-.launcher-prompt-actions button:last-child {
-  background: #f1f1f1;
-  color: #9a9a9a;
-}
-
-.launcher-prompt-actions button:disabled {
-  cursor: not-allowed;
-  opacity: 0.55;
-}
-
-.launcher-model-pills {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  gap: 9px;
-  width: min(488px, calc(100vw - 110px));
-}
-
-.launcher-model-pills button {
-  display: inline-flex;
-  align-items: center;
-  gap: 5px;
-  min-height: 27px;
-  padding: 0 12px;
-  border: 1px solid #d6d6d6;
-  border-radius: 999px;
-  background: #fff;
-  color: #333;
-  font-size: 12px;
-}
-
-.launcher-model-pills .launcher-pill-active {
-  border-color: #8b5cf6;
-  background: #f8f2ff;
-  color: #7c3aed;
-}
-
-.launcher-project-list {
-  display: grid;
-  gap: 14px;
-  width: min(1054px, calc(100vw - 122px));
-  margin: 0 auto;
-}
-
-.launcher-project-list header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-}
-
-.launcher-project-list h2 {
-  margin: 0;
-  color: #111827;
-  font-size: 15px;
-}
-
-.launcher-project-status {
-  margin: 4px 0 0;
-  color: #8b8b8b;
-  font-size: 12px;
-}
-
-.launcher-project-list header button,
-.launcher-project-list-empty > button {
-  padding: 0;
-  background: transparent;
-  color: #888;
-  font-size: 12px;
-}
-
 .launcher-project-list-actions {
   display: flex;
   align-items: center;
   gap: 10px;
 }
 
-.launcher-project-grid {
-  display: grid;
-  grid-template-columns: repeat(5, 1fr);
-  gap: 12px;
-  overflow: hidden;
-}
-
-.launcher-project-card {
-  display: grid;
-  min-width: 0;
-}
-
-.launcher-project-card > div,
-.launcher-project-card > button {
-  position: relative;
-  height: 116px;
-  width: 100%;
-  overflow: hidden;
-  border: 1px solid #e1e4e8;
-  border-radius: 8px;
-  background: #f7f7f7;
-  cursor: pointer;
-}
-
-.launcher-project-card-main {
-  display: grid;
-  align-content: start;
-  justify-items: start;
-  gap: 6px;
-  padding: 12px;
-  text-align: left;
-}
-
-.launcher-project-card-main:disabled {
-  cursor: not-allowed;
-  opacity: 0.58;
-}
-
-.launcher-project-card-main > span {
-  display: grid;
-  width: 42px;
-  height: 42px;
-  border-radius: 12px;
-  background: #fff;
-  color: #f26d2d;
-  font-size: 16px;
-  font-weight: 700;
-  place-items: center;
-}
-
-.launcher-project-card strong {
-  min-width: 0;
-  color: #111;
-  font-size: 12px;
-  font-weight: 500;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.launcher-project-card small {
-  margin-top: -5px;
-  color: #8b8b8b;
-  font-size: 11px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
 .launcher-project-create > button {
   display: grid;
   border-style: dashed;
@@ -767,96 +497,6 @@ textarea {
   box-shadow: 0 8px 22px rgb(242 109 45 / 16%);
 }
 
-.launcher-showcase {
-  display: grid;
-  gap: 14px;
-  width: min(1054px, calc(100vw - 122px));
-  margin: 22px auto 0;
-}
-
-.launcher-showcase header {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  gap: 12px;
-}
-
-.launcher-section-title {
-  display: grid;
-  gap: 4px;
-}
-
-.launcher-section-title span {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.launcher-showcase h2 {
-  margin: 0;
-  color: #111827;
-  font-size: 15px;
-}
-
-.launcher-showcase p {
-  margin: 4px 0 0;
-  color: #8b8b8b;
-  font-size: 12px;
-}
-
-.launcher-showcase-grid {
-  display: grid;
-  grid-template-columns: repeat(6, minmax(0, 1fr));
-  gap: 12px;
-}
-
-.launcher-showcase-grid article,
-.launcher-showcase-empty {
-  overflow: hidden;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
-  background: #fff;
-}
-
-.launcher-showcase-grid article {
-  display: grid;
-  gap: 7px;
-  padding-bottom: 10px;
-}
-
-.launcher-showcase-grid img {
-  width: 100%;
-  aspect-ratio: 1 / 1;
-  object-fit: cover;
-  background: #f3f4f6;
-}
-
-.launcher-showcase-grid strong,
-.launcher-showcase-grid small {
-  min-width: 0;
-  padding: 0 9px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.launcher-showcase-grid strong {
-  color: #111827;
-  font-size: 12px;
-}
-
-.launcher-showcase-grid small,
-.launcher-showcase-empty {
-  color: #6b7280;
-  font-size: 11px;
-}
-
-.launcher-showcase-empty {
-  display: grid;
-  min-height: 96px;
-  place-items: center;
-}
-
 .launcher-page {
   display: grid;
   gap: 22px;
@@ -919,18 +559,6 @@ textarea {
   font-size: 12px;
 }
 
-.launcher-project-list-empty {
-  display: grid;
-  justify-items: center;
-  gap: 10px;
-  padding: 18px 0 32px;
-}
-
-.launcher-project-list-empty h2 {
-  color: #111827;
-  font-size: 16px;
-}
-
 .launcher-project-form input {
   min-width: 0;
   height: 34px;
@@ -942,6 +570,7 @@ textarea {
 }
 
 .launcher-page-actions button,
+.launcher-page .launcher-project-list-actions button,
 .launcher-project-table article > button,
 .launcher-empty-projects button {
   height: 32px;
@@ -953,6 +582,11 @@ textarea {
   font-size: 12px;
 }
 
+.launcher-page .launcher-project-list-actions button:disabled {
+  cursor: not-allowed;
+  opacity: 0.55;
+}
+
 .launcher-page-actions button:last-child {
   border-color: #111827;
   background: #111827;
@@ -2111,47 +1745,10 @@ textarea {
     white-space: nowrap;
   }
 
-  .launcher-hero {
-    align-content: start;
-    gap: 16px;
-    min-height: auto;
-    padding: 84px 14px 34px;
-  }
-
-  .launcher-main-with-promo .launcher-hero {
-    padding-top: 84px;
-  }
-
-  .launcher-hero-title {
-    flex-direction: column;
-    gap: 10px;
-  }
-
-  .launcher-hero-title h1 {
-    font-size: 22px;
-  }
-
-  .launcher-prompt-card,
-  .launcher-model-pills,
-  .launcher-project-list {
-    width: min(100%, calc(100vw - 76px));
-  }
-
-  .launcher-project-grid {
-    grid-template-columns: 1fr;
-    overflow: visible;
-  }
-
   .launcher-project-form {
     grid-template-columns: 1fr;
   }
 
-  .launcher-project-card > div,
-  .launcher-project-card > button {
-    height: 132px;
-  }
-
-  .launcher-showcase,
   .launcher-page {
     width: min(100%, calc(100vw - 76px));
   }
@@ -2168,7 +1765,6 @@ textarea {
     overflow-wrap: anywhere;
   }
 
-  .launcher-showcase-grid,
   .launcher-development-grid {
     grid-template-columns: 1fr;
   }
diff --git a/apps/ai-game-creator-shell/src/view/home/index.tsx b/apps/ai-game-creator-shell/src/view/home/index.tsx
new file mode 100644
index 000000000..9cfe6b4e4
--- /dev/null
+++ b/apps/ai-game-creator-shell/src/view/home/index.tsx
@@ -0,0 +1,354 @@
+import {
+  FolderKanban,
+  type LucideIcon,
+  Plus,
+  Sparkles,
+  Upload,
+  X,
+} from 'lucide-react';
+import type {
+  FormEvent,
+} from 'react';
+import { useRef, useState } from 'react';
+
+import {
+  useLauncherHomeDraftStore,
+  type HomeAgentMode,
+  type HomeAttachmentDraft,
+  type HomeDraft,
+} from '../../stores/useHomeDraftStore';
+import { useHomeShowcase } from './useHomeShowcase';
+
+export type {
+  HomeAgentMode,
+  HomeAttachmentDraft,
+  HomeDraft,
+} from '../../stores/useHomeDraftStore';
+
+export type HomeAgentModeItem = {
+  mode: HomeAgentMode;
+  label: string;
+  placeholder: string;
+  emptyPrompt: string;
+  icon: LucideIcon;
+};
+
+export type HomeProjectRow = {
+  path: string;
+  name: string;
+  status: string;
+  canOpen: boolean;
+};
+
+export type HomeShowcaseResource = {
+  resourceId: string;
+  showcaseId?: string | null;
+  label?: string | null;
+  imageSrc: string;
+  prompt?: string | null;
+  authorDisplayName?: string | null;
+  authorPublicUserCode?: string | null;
+};
+
+type HomeViewProps = {
+  hasPromo: boolean;
+  status: string;
+  onStatusChange: (status: string) => void;
+  homeAgentModeItems: readonly HomeAgentModeItem[];
+  recentProjectRows: readonly HomeProjectRow[];
+  onCreateDraft: (draft: HomeDraft) => Promise<string>;
+  onProjectsOpen: () => void;
+  onProjectOpen: (path: string) => void;
+};
+
+export default function HomeView({
+  hasPromo,
+  status,
+  onStatusChange,
+  homeAgentModeItems,
+  recentProjectRows,
+  onCreateDraft,
+  onProjectsOpen,
+  onProjectOpen,
+}: HomeViewProps) {
+  const homeAgentMode = useLauncherHomeDraftStore((state) => state.mode);
+  const homePrompt = useLauncherHomeDraftStore((state) => state.prompt);
+  const homeAttachments = useLauncherHomeDraftStore(
+    (state) => state.attachments,
+  );
+  const setHomeAgentMode = useLauncherHomeDraftStore((state) => state.setMode);
+  const setHomePrompt = useLauncherHomeDraftStore((state) => state.setPrompt);
+  const addHomeAttachments = useLauncherHomeDraftStore(
+    (state) => state.addAttachments,
+  );
+  const removeHomeAttachment = useLauncherHomeDraftStore(
+    (state) => state.removeAttachment,
+  );
+  const [homeCreationBusy, setHomeCreationBusy] = useState(false);
+  const { resources: showcaseResources, status: showcaseStatus } =
+    useHomeShowcase();
+  const homeAttachmentInputRef = useRef<HTMLInputElement | null>(null);
+  const activeHomeMode =
+    homeAgentModeItems.find((item) => item.mode === homeAgentMode) ??
+    homeAgentModeItems[0];
+
+  if (!activeHomeMode) {
+    return null;
+  }
+
+  const ActiveHomeModeIcon = activeHomeMode.icon;
+
+  function handleHomeAttachmentSelection(
+    event: React.ChangeEvent<HTMLInputElement>,
+  ) {
+    const files = Array.from(event.currentTarget.files ?? []);
+    event.currentTarget.value = '';
+    if (files.length === 0) {
+      return;
+    }
+    addHomeAttachments(
+      files.map((file, index) => ({
+        id: `${file.name}:${file.size}:${file.lastModified}:${index}:${Date.now()}`,
+        file,
+      })),
+    );
+  }
+
+  async function handleHomeSubmit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    if (!homePrompt.trim() && homeAttachments.length === 0) {
+      onStatusChange(
+        homeAgentModeItems.find((item) => item.mode === homeAgentMode)
+          ?.emptyPrompt ?? '请输入需求或上传附件',
+      );
+      return;
+    }
+    setHomeCreationBusy(true);
+    onStatusChange('请选择项目目录');
+    try {
+      onStatusChange(
+        await onCreateDraft({
+          mode: homeAgentMode,
+          prompt: homePrompt,
+          attachments: homeAttachments,
+        }),
+      );
+    } catch (error) {
+      onStatusChange(error instanceof Error ? error.message : String(error));
+    } finally {
+      setHomeCreationBusy(false);
+    }
+  }
+
+  return (
+    <>
+      <section
+        className={`grid min-h-93.5 content-start justify-items-center gap-3.25 px-6 pb-4.5 pt-25.75 max-[760px]:min-h-0 max-[760px]:gap-4 max-[760px]:px-3.5 max-[760px]:pb-[34px] max-[760px]:pt-[84px] ${
+          hasPromo ? 'pt-33.75 max-[760px]:pt-21' : ''
+        }`}
+        aria-label="首页输入"
+      >
+        <div className="flex items-center gap-3 text-center max-[760px]:flex-col max-[760px]:gap-2.5">
+          <span className="grid size-7.5 shrink-0 place-items-center rounded-full bg-[#060606] text-[11px] font-bold text-white">
+            <ActiveHomeModeIcon size={18} aria-hidden="true" />
+          </span>
+          <div>
+            <h1 className="m-0 text-[27px] font-[750] tracking-normal max-[760px]:text-[22px]">
+              陶泥儿 GameAgent
+            </h1>
+            <p className="m-0 mt-3 text-[13px] text-[#a0a0a0]">
+              {activeHomeMode.placeholder}
+            </p>
+          </div>
+        </div>
+        <div
+          className="flex w-[min(488px,calc(100vw-110px))] flex-wrap justify-center gap-[9px] max-[760px]:w-[min(100%,calc(100vw-76px))]"
+          aria-label="Agent 分类"
+        >
+          {homeAgentModeItems.map((item) => {
+            const ModeIcon = item.icon;
+            const isActive = item.mode === homeAgentMode;
+            return (
+              <button
+                type="button"
+                key={item.mode}
+                className={`inline-flex min-h-6.75 items-center gap-1.25 rounded-full border px-3 text-[12px] ${
+                  isActive
+                    ? 'border-violet-500 bg-[#f8f2ff] text-violet-600'
+                    : 'border-[#d6d6d6] bg-white text-[#333]'
+                }`}
+                onClick={() => setHomeAgentMode(item.mode)}
+              >
+                <ModeIcon size={14} aria-hidden="true" />
+                {item.label}
+              </button>
+            );
+          })}
+        </div>
+        <form
+          className="grid min-h-20 w-[min(488px,calc(100vw-110px))] grid-rows-[minmax(42px,auto)_auto_auto] rounded-[18px] border border-[#e1e4e8] bg-white px-3 pb-2 pt-[13px] shadow-[0_8px_24px_rgb(15_23_42_/_8%)] max-[760px]:w-[min(100%,calc(100vw-76px))]"
+          onSubmit={handleHomeSubmit}
+        >
+          <textarea
+            className="min-h-9 w-full resize-none border-0 bg-transparent p-0 text-[13px] text-[#171717] outline-0 placeholder:text-[#bababa]"
+            aria-label="创作想法"
+            placeholder={activeHomeMode.placeholder}
+            value={homePrompt}
+            onChange={(event) => setHomePrompt(event.currentTarget.value)}
+          />
+          {homeAttachments.length > 0 ? (
+            <div className="flex flex-wrap gap-1.5 py-2 pb-1" aria-label="附件队列">
+              {homeAttachments.map((attachment) => (
+                <span
+                  className="inline-flex min-h-6 max-w-full items-center gap-1 rounded-[7px] border border-gray-200 bg-slate-50 px-[7px] text-[11px] text-gray-700"
+                  key={attachment.id}
+                >
+                  {attachment.file.name}
+                  <button
+                    className="size-[18px] cursor-pointer border-0 bg-transparent p-0 text-gray-500"
+                    type="button"
+                    aria-label={`移除附件 ${attachment.file.name}`}
+                    onClick={() => removeHomeAttachment(attachment.id)}
+                  >
+                    <X size={12} aria-hidden="true" />
+                  </button>
+                </span>
+              ))}
+            </div>
+          ) : null}
+          <div className="grid grid-cols-[auto_1fr_auto] items-center gap-2.5 text-[12px] text-[#777]">
+            <input
+              ref={homeAttachmentInputRef}
+              className="launcher-file-input pointer-events-none absolute size-px opacity-0"
+              type="file"
+              multiple
+              onChange={handleHomeAttachmentSelection}
+            />
+            <button
+              className="grid size-6 cursor-pointer place-items-center rounded-full border-0 bg-transparent p-0 text-[#666]"
+              type="button"
+              aria-label="上传素材"
+              onClick={() => homeAttachmentInputRef.current?.click()}
+            >
+              <Upload size={15} aria-hidden="true" />
+            </button>
+            <span>{status}</span>
+            <button
+              className="grid size-6 cursor-pointer place-items-center rounded-full border-0 bg-[#f1f1f1] p-0 text-[#9a9a9a] disabled:cursor-not-allowed disabled:opacity-55"
+              type="submit"
+              aria-label="开启创作"
+              disabled={homeCreationBusy}
+            >
+              <Plus size={16} aria-hidden="true" />
+            </button>
+          </div>
+        </form>
+      </section>
+
+      <section
+        className="mx-auto grid w-[min(1054px,calc(100vw-122px))] gap-[14px] max-[760px]:w-[min(100%,calc(100vw-76px))]"
+        aria-label="最近项目"
+      >
+        <header className="flex items-center justify-between gap-3">
+          <div>
+            <h2 className="m-0 text-[15px] text-gray-900">最近项目</h2>
+            <p className="mb-0 mt-1 text-[12px] text-[#8b8b8b]">
+              {status}
+            </p>
+          </div>
+          <div className="launcher-project-list-actions">
+            <button
+              className="cursor-pointer border-0 bg-transparent p-0 text-[12px] text-[#888]"
+              type="button"
+              onClick={onProjectsOpen}
+            >
+              查看全部 〉
+            </button>
+          </div>
+        </header>
+        {recentProjectRows.length > 0 ? (
+          <div className="grid grid-cols-5 gap-3 overflow-hidden max-[760px]:grid-cols-1 max-[760px]:overflow-visible">
+            {recentProjectRows.map((project) => (
+              <article className="grid min-w-0" key={project.path}>
+                <button
+                  className="grid h-auto w-full cursor-pointer content-start justify-items-start gap-1.5 overflow-hidden rounded-lg border border-[#e1e4e8] bg-[#f7f7f7] p-3 text-left disabled:cursor-not-allowed disabled:opacity-[0.58] max-[760px]:h-[132px]"
+                  type="button"
+                  disabled={!project.canOpen}
+                  onClick={() => onProjectOpen(project.path)}
+                >
+                  <span className="grid size-[42px] place-items-center rounded-xl bg-white text-[16px] font-bold text-[#f26d2d]">
+                    {project.name.slice(0, 2)}
+                  </span>
+                  <strong className="min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-[12px] font-medium text-[#111]">
+                    {project.name}
+                  </strong>
+                  <small className="-mt-[5px] min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-[11px] text-[#8b8b8b]">
+                    {project.path}
+                  </small>
+                  <small className="-mt-[5px] min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-[11px] text-[#8b8b8b]">
+                    {project.status}
+                  </small>
+                </button>
+              </article>
+            ))}
+          </div>
+        ) : (
+          <div className="grid justify-items-center gap-2.5 px-0 pb-8 pt-[18px]">
+            <FolderKanban size={22} aria-hidden="true" />
+            <strong>暂无最近项目</strong>
+            <button
+              className="cursor-pointer border-0 bg-transparent p-0 text-[12px] text-[#888]"
+              type="button"
+              onClick={onProjectsOpen}
+            >
+              去项目组
+            </button>
+          </div>
+        )}
+      </section>
+
+      <section
+        className="mx-auto mt-[22px] grid w-[min(1054px,calc(100vw-122px))] gap-[14px] max-[760px]:w-[min(100%,calc(100vw-76px))]"
+        aria-label="灵感推荐"
+      >
+        <header className="flex items-center justify-start gap-3">
+          <div className="grid gap-1">
+            <span className="inline-flex items-center gap-1.5">
+              <h2 className="m-0 text-[15px] text-gray-900">灵感推荐</h2>
+              <Sparkles size={15} aria-hidden="true" />
+            </span>
+            <p className="mb-0 mt-1 text-[12px] text-[#8b8b8b]">{showcaseStatus}</p>
+          </div>
+        </header>
+        {showcaseResources.length > 0 ? (
+          <div className="grid grid-cols-6 gap-3 max-[760px]:grid-cols-1">
+            {showcaseResources.map((resource) => (
+              <article
+                className="grid gap-[7px] overflow-hidden rounded-lg border border-gray-200 bg-white pb-2.5"
+                key={resource.showcaseId ?? resource.resourceId}
+              >
+                <img
+                  className="aspect-square w-full object-cover bg-gray-100"
+                  src={resource.imageSrc}
+                  alt={resource.label || resource.prompt || '灵感素材'}
+                />
+                <strong className="min-w-0 overflow-hidden text-ellipsis whitespace-nowrap px-[9px] text-[12px] text-gray-900">
+                  {resource.label || '未命名素材'}
+                </strong>
+                <small className="min-w-0 overflow-hidden text-ellipsis whitespace-nowrap px-[9px] text-[11px] text-gray-500">
+                  {resource.authorDisplayName ||
+                    resource.authorPublicUserCode ||
+                    '陶泥儿精选'}
+                </small>
+              </article>
+            ))}
+          </div>
+        ) : (
+          <div className="grid min-h-24 place-items-center overflow-hidden rounded-lg border border-gray-200 bg-white text-[11px] text-gray-500">
+            {showcaseStatus}
+          </div>
+        )}
+      </section>
+    </>
+  );
+}
diff --git a/apps/ai-game-creator-shell/src/view/home/useHomeShowcase.ts b/apps/ai-game-creator-shell/src/view/home/useHomeShowcase.ts
new file mode 100644
index 000000000..d6bfd7e82
--- /dev/null
+++ b/apps/ai-game-creator-shell/src/view/home/useHomeShowcase.ts
@@ -0,0 +1,35 @@
+import { useEffect, useState } from 'react';
+
+import {
+  listClientShowcaseResources,
+  type EditorShowcaseResource,
+} from '../../services/clientApi';
+
+export function useHomeShowcase() {
+  const [resources, setResources] = useState<EditorShowcaseResource[]>([]);
+  const [status, setStatus] = useState('正在读取灵感');
+
+  useEffect(() => {
+    let disposed = false;
+    void listClientShowcaseResources()
+      .then((response) => {
+        if (disposed) {
+          return;
+        }
+        setResources(response.resources.slice(0, 6));
+        setStatus(response.resources.length > 0 ? '已读取灵感' : '暂无灵感');
+      })
+      .catch((error) => {
+        if (disposed) {
+          return;
+        }
+        setResources([]);
+        setStatus(error instanceof Error ? error.message : '灵感读取失败');
+      });
+    return () => {
+      disposed = true;
+    };
+  }, []);
+
+  return { resources, status };
+}
diff --git a/apps/ai-game-creator-shell/tests/appSurface.test.ts b/apps/ai-game-creator-shell/tests/appSurface.test.ts
index df689c709..72567ffca 100644
--- a/apps/ai-game-creator-shell/tests/appSurface.test.ts
+++ b/apps/ai-game-creator-shell/tests/appSurface.test.ts
@@ -19816,6 +19816,23 @@ describe('AI 游戏创作 App 界面边界', () => {
     );
   });
 
+  it('keeps launcher page header actions styled after Tailwind preflight', () => {
+    const styles = readFileSync(
+      resolve(process.cwd(), 'apps/ai-game-creator-shell/src/styles.css'),
+      'utf8',
+    );
+    const headerActionRule = styles.match(
+      /\.launcher-page \.launcher-project-list-actions button,[^{]*\{([^}]*)\}/s,
+    );
+
+    expect(headerActionRule?.[1]).toContain('padding: 0 12px;');
+    expect(headerActionRule?.[1]).toContain('border: 1px solid #d8dde5;');
+    expect(headerActionRule?.[1]).toContain('background: #fff;');
+    expect(styles).toMatch(
+      /\.launcher-page \.launcher-project-list-actions button:disabled\s*\{[^}]*cursor:\s*not-allowed;[^}]*opacity:\s*0\.55;/s,
+    );
+  });
+
   it('shows developer panels only in dev mode', () => {
     renderAppAt('/?dev');
 
diff --git a/apps/ai-game-creator-shell/vite.config.ts b/apps/ai-game-creator-shell/vite.config.ts
index d1cbd26fe..ea761219d 100644
--- a/apps/ai-game-creator-shell/vite.config.ts
+++ b/apps/ai-game-creator-shell/vite.config.ts
@@ -2,6 +2,7 @@ import { existsSync, readFileSync } from 'node:fs';
 import { dirname, resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
+import tailwindcss from '@tailwindcss/vite';
 import react from '@vitejs/plugin-react';
 import { defineConfig } from 'vite';
 
@@ -41,6 +42,7 @@ const apiTarget = resolveDevApiTarget();
 export default defineConfig({
   root: appRoot,
   plugins: [
+    tailwindcss(),
     react(),
     {
       name: 'genarrative-ai-game-creator-dev-marker',
diff --git a/docs/technical/【技术方案】AI游戏创作智能体App实施计划-2026-06-24.md b/docs/technical/【技术方案】AI游戏创作智能体App实施计划-2026-06-24.md
index 907f4e269..45bac90bc 100644
--- a/docs/technical/【技术方案】AI游戏创作智能体App实施计划-2026-06-24.md
+++ b/docs/technical/【技术方案】AI游戏创作智能体App实施计划-2026-06-24.md
@@ -319,7 +319,7 @@ game-project/
 - 短期记忆、长期记忆、项目黑板和角色私有记忆按授权本地项目路径读写；普通用户仍只通过聊天命令访问短期 / 长期 / 黑板记忆，角色私有记忆只在单 agent 对话和生成 loop 中按目标 agent 读取。
 - 结构化对话记录按授权本地项目路径追加 JSONL；正式聊天读取 Supervisor active Session 与只读 legacy 项目历史，开发单 Agent 对话读取对应 Agent Session。开发入口已支持本地 Session 新建、切换、归档和分叉，但不提供云端同步。
 - Agent 状态列表从 `.agent/manifest.json` 的任务 / 角色清单、`.agent/run.latest.json` / `.agent/runs/<runId>.json` 的 step、taskGraph、passPlans、lifecycleStatus，以及 `read_game_creator_agent_runtimes` 批量读取的 `.agent/runtime/agents/<taskId>.json` 和最近任务派生；v1 不新增独立状态数据库，也不承诺完整后台 runner。
-- App 启动先检查平台登录态；登录后进入同一个客户端首页，不再有面向用户的启动器 / 主窗口切换概念。首页按 `做游戏` / `做素材` / `做方案` 保存 `game` / `art` / `doc` 初始意图，发送时弹出原生目录选择，目标目录存在且非空时必须二次确认；确认后调用 `init_local_game_project` 初始化本地项目、`upload_local_asset` 导入附件，再把首条需求直接投递给 active `project-supervisor` Session 的后台 Runtime，写入最近项目并切到项目开发页。本流程不调用 `generate_local_game_draft`、`generate_platform_art_asset`、一次性 `chat_with_game_creator_agent` 或 legacy 项目对话 append。
+- App 启动先检查平台登录态；登录后进入同一个客户端首页，不再有面向用户的启动器 / 主窗口切换概念。首页按 `做游戏` / `做素材` / `做方案` 保存 `game` / `art` / `doc` 初始意图，发送时弹出原生目录选择，目标目录存在且非空时必须二次确认；确认后调用 `init_local_game_project` 初始化本地项目、`upload_local_asset` 导入附件，再把首条需求直接投递给 active `project-supervisor` Session 的后台 Runtime，写入最近项目并切到项目开发页。缺少 active Session 时先创建并激活；成功后清空首页草稿，取消或创建失败时在首页回显状态，首页响应式断点与应用外壳统一为 `760px`。本流程不调用 `generate_local_game_draft`、`generate_platform_art_asset`、一次性 `chat_with_game_creator_agent` 或 legacy 项目对话 append。
 - debug 构建启动后在用户 `client` 窗口之外额外打开 `developer` 窗口；该窗口用于开发者单独选择 Agent、管理对应 active/archived Session 并读取历史，用户消息和真实 Agent 回复只持久化到 `.agent/conversations/agents/<agentId>/` 下的规范 Session。普通用户窗口不得出现 `Agent 聊天` 导航、picker 或工具台入口。
 - 首页最近项目只展示最近 3 个有效项目；项目组页在同一窗口管理最近项目、打开项目、新建项目和显示目录。打开项目只读取已初始化项目并切到项目开发页，不打开第二窗口；新建项目仍沿用非空目录确认，不自动重建无效历史路径。
 - 项目开发页保留左侧栏和顶部栏，顶部展示项目名、路径和最近 run 状态；中间只挂载 active `project-supervisor` Session 的正式对话面、Runtime 状态、确认/Needs input 和专业 Agent 协作只读状态，底部保留附件导入结果。真正的项目开发画布仍未落地；专业 Agent picker、完整计划和工具台继续留在开发入口。