Increase VectorEngine timeouts and add image UI

Add VectorEngine image generation config and raise request timeouts (env + scripts) from 180000 to 1000000ms. Introduce a reusable CreativeImageInputPanel component with tests and wire up mobile keyboard-focus helpers; update generation views and related tests (CustomWorldGenerationView, BarkBattle editor, Match3D, Puzzle flows). Improve API error handling / VectorEngine request guidance (packages/shared http.ts and docs), and apply multiple backend/frontend fixes for puzzle/match3d/prompt handling. Also include extensive docs and decision-log updates describing UI/UX decisions and verification steps.

src/components/custom-world-home/creationWorkShelf.ts

@@ -17,6 +17,9 @@ import {
 } from '../../services/publicWorkCode';
 import type { CustomWorldProfile } from '../../types';
 
+const MATCH3D_CONTAINER_REFERENCE_COVER_SRC =
+  '/match3d-background-references/pot-fused-reference.png';
+
 export type CreationWorkShelfKind =
   | 'rpg'
   | 'big-fish'
@@ -620,15 +623,33 @@ function normalizeCoverImageSrc(value?: string | null) {
   return value?.trim() || null;
 }
 
+function isCreationTypeReferenceCoverImageSrc(value?: string | null) {
+  const normalizedValue = normalizeCoverImageSrc(value);
+  if (!normalizedValue) {
+    return false;
+  }
+
+  // 中文注释：玩法参考图只做草稿页兜底，不应覆盖作品已经生成出来的真实关卡图或运行态背景图。
+  return /^\/?creation-type-references\/[^/?#]+(?:[?#].*)?$/u.test(
+    normalizedValue,
+  );
+}
+
 function resolvePuzzleWorkCoverImageSrc(item: PuzzleWorkSummary) {
   const directCoverImageSrc = normalizeCoverImageSrc(item.coverImageSrc);
-  if (directCoverImageSrc) {
+  if (
+    directCoverImageSrc &&
+    !isCreationTypeReferenceCoverImageSrc(directCoverImageSrc)
+  ) {
     return directCoverImageSrc;
   }
 
   for (const level of item.levels ?? []) {
     const levelCoverImageSrc = normalizeCoverImageSrc(level.coverImageSrc);
-    if (levelCoverImageSrc) {
+    if (
+      levelCoverImageSrc &&
+      !isCreationTypeReferenceCoverImageSrc(levelCoverImageSrc)
+    ) {
       return levelCoverImageSrc;
     }
 
@@ -638,14 +659,17 @@ function resolvePuzzleWorkCoverImageSrc(item: PuzzleWorkSummary) {
             level.candidates.find(
               (candidate) => candidate.candidateId === level.selectedCandidateId,
             )?.imageSrc,
-          )
+        )
         : null;
     const fallbackCandidateImageSrc = normalizeCoverImageSrc(
       level.candidates[level.candidates.length - 1]?.imageSrc,
     );
     const candidateImageSrc = selectedCandidateImageSrc || fallbackCandidateImageSrc;
 
-    if (candidateImageSrc) {
+    if (
+      candidateImageSrc &&
+      !isCreationTypeReferenceCoverImageSrc(candidateImageSrc)
+    ) {
       return candidateImageSrc;
     }
   }
@@ -655,22 +679,46 @@ function resolvePuzzleWorkCoverImageSrc(item: PuzzleWorkSummary) {
 
 function resolveMatch3DWorkCoverImageSrc(item: Match3DWorkSummary) {
   const directCoverImageSrc = normalizeCoverImageSrc(item.coverImageSrc);
-  if (directCoverImageSrc) {
+  if (
+    directCoverImageSrc &&
+    !isCreationTypeReferenceCoverImageSrc(directCoverImageSrc)
+  ) {
     return directCoverImageSrc;
   }
 
+  const topLevelContainerImageSrc =
+    normalizeCoverImageSrc(item.generatedBackgroundAsset?.containerImageSrc) ||
+    normalizeCoverImageSrc(item.generatedBackgroundAsset?.containerImageObjectKey);
+  if (topLevelContainerImageSrc) {
+    return topLevelContainerImageSrc;
+  }
+
+  for (const asset of item.generatedItemAssets ?? []) {
+    const assetContainerImageSrc =
+      normalizeCoverImageSrc(asset.backgroundAsset?.containerImageSrc) ||
+      normalizeCoverImageSrc(asset.backgroundAsset?.containerImageObjectKey);
+    if (assetContainerImageSrc) {
+      return assetContainerImageSrc;
+    }
+  }
+
   const backgroundImageSrc =
     normalizeCoverImageSrc(item.backgroundImageSrc) ||
     normalizeCoverImageSrc(item.backgroundImageObjectKey) ||
     normalizeCoverImageSrc(item.generatedBackgroundAsset?.imageSrc) ||
-    normalizeCoverImageSrc(item.generatedBackgroundAsset?.imageObjectKey) ||
-    normalizeCoverImageSrc(item.generatedBackgroundAsset?.containerImageSrc) ||
-    normalizeCoverImageSrc(item.generatedBackgroundAsset?.containerImageObjectKey);
+    normalizeCoverImageSrc(item.generatedBackgroundAsset?.imageObjectKey);
   if (backgroundImageSrc) {
     return backgroundImageSrc;
   }
 
   for (const asset of item.generatedItemAssets ?? []) {
+    const assetBackgroundImageSrc =
+      normalizeCoverImageSrc(asset.backgroundAsset?.imageSrc) ||
+      normalizeCoverImageSrc(asset.backgroundAsset?.imageObjectKey);
+    if (assetBackgroundImageSrc) {
+      return assetBackgroundImageSrc;
+    }
+
     const imageView = asset.imageViews?.find(
       (view) =>
         normalizeCoverImageSrc(view.imageSrc) ||
@@ -682,12 +730,16 @@ function resolveMatch3DWorkCoverImageSrc(item: Match3DWorkSummary) {
     const itemImageSrc =
       normalizeCoverImageSrc(asset.imageSrc) ||
       normalizeCoverImageSrc(asset.imageObjectKey);
-    if (imageViewSrc || itemImageSrc) {
-      return imageViewSrc || itemImageSrc;
+    const preferredImageSrc = imageViewSrc || itemImageSrc;
+    if (
+      preferredImageSrc &&
+      !isCreationTypeReferenceCoverImageSrc(preferredImageSrc)
+    ) {
+      return preferredImageSrc;
     }
   }
 
-  return null;
+  return MATCH3D_CONTAINER_REFERENCE_COVER_SRC;
 }
 
 function resolveSquareHoleWorkCoverImageSrc(item: SquareHoleWorkSummary) {