收口创作流程统一总计划并修复等待页窄屏裁切

src/components/unified-creation/UnifiedCreationPage.tsx

@@ -13,13 +13,26 @@ export function UnifiedCreationPage({
 }: UnifiedCreationPageProps) {
   return (
     <div
-      className="unified-creation-page flex h-full min-h-0 flex-col"
+      className="unified-creation-page platform-remap-surface mx-auto flex w-full max-w-5xl flex-col px-3 pt-2 sm:px-4 sm:pt-3"
       data-play-id={spec.playId}
       data-field-kinds={spec.fields.map((field) => field.kind).join(',')}
       data-workspace-stage={spec.workspaceStage}
       data-generation-stage={spec.generationStage}
       data-result-stage={spec.resultStage}
     >
+      <header className="unified-creation-page__header shrink-0 pb-3">
+        <div className="flex items-center justify-between gap-3">
+          <h1 className="m-0 min-w-0 truncate text-[1.35rem] font-black leading-tight tracking-normal text-[var(--platform-text-strong)] sm:text-[1.65rem]">
+            {spec.title}
+          </h1>
+          <span
+            className="unified-creation-page__play-badge shrink-0 rounded-full border border-[var(--platform-subpanel-border)] bg-white/80 px-3 py-1 text-[11px] font-black text-[var(--platform-text-soft)]"
+            data-testid="unified-creation-play-badge"
+          >
+            {spec.playId}
+          </span>
+        </div>
+      </header>
       <div className="sr-only" data-testid="unified-creation-spec">
         <h1>{spec.title}</h1>
         <ul>
@@ -36,7 +49,9 @@ export function UnifiedCreationPage({
           ))}
         </ul>
       </div>
-      {children}
+      <div className="unified-creation-page__content pb-3 sm:pb-4">
+        {children}
+      </div>
     </div>
   );
 }