@ttmg/cli 0.4.6-vibe-beta.18 → 0.4.6-vibe-beta.20

package/dist/index.js

@@ -7248,6 +7248,7 @@ const messages = {
         'cli.command.game.categories.category': 'Filter by an exact category value, e.g. Puzzle',
         'cli.command.game.categories.unknown': 'Unknown category. Run ttmg game categories --format json for valid values.',
         'cli.command.game.categories.invalidFormat': 'Use text, json, or ndjson output.',
+        'cli.command.upload.minisType': 'MINI_GAME (default) or MINI_TOOL (local PPE trial; Native ZIP, Efficiency & Office)',
         'cli.command.upload.vibeCategory': 'Optional game category; provide with --subcategory (--vibe). Query ttmg game categories --format json',
         'cli.command.upload.vibeDescription': 'Optional game description (--vibe); default: Discover the fun of TikTok Mini Games.',
         'cli.command.upload.vibeSubcategory': 'Optional subcategory belonging to --category; omit both to keep Other/Other (--vibe)',
@@ -7263,8 +7264,9 @@ Vibe QR upload (real PPE trial):
   Keep this process running. At waiting_authorization, scan the QR on pageUrl with TikTok on your phone.
   pageUrl is the local QR/progress page on the CLI computer. Reopen it with authorizationOpenCommand.
   The CLI polls and uploads avatar, app_info and package automatically after authorization. Do not start a second upload.
-  After upload, pageUrl returns to the original binding QR. waiting_preview keeps polling the same task until previewUrl is available.
-  previewReady=true means the preview link is available; qrPurpose=authorization_binding describes the original QR retained on pageUrl. A preview timeout preserves uploaded=true; do not reupload.
+  After upload, waiting_preview keeps polling the same task until previewUrl is available, including status 9 (waiting for review submission).
+  When previewReady=true, pageUrl keeps the original QR on the left for checking progress and shows the preview QR on the right. qrPurpose is game_preview or tool_preview. A preview timeout preserves uploaded=true; do not reupload.
+  The operation timeout defaults to 1800 seconds (maximum 3600). The page stays available during the operation and for 30 minutes after the CLI finishes.
   Real success: terminal=true, status=uploaded, uploaded=true, simulation=false. On failure, read errorCode and nextAction.
   The local QR page opens for every output format; --no-open disables automatic opening.
   The page displays the submitted title, icon, description, category and subcategory.
@@ -7483,7 +7485,7 @@ Vibe QR upload (real PPE trial):
         'cli.command.upload.vibeApi': 'Minis Import API origin on a loopback IP only (--vibe)',
         'cli.command.upload.vibeAuthorizeUrl': 'Obsolete: remove this option; task creation returns landing_url (--vibe)',
         'cli.command.upload.vibePollInterval': 'Override task polling interval; otherwise use poll_interval_seconds (--vibe)',
-        'cli.command.upload.vibeTimeout': 'Operation timeout in seconds (--vibe; default 300)',
+        'cli.command.upload.vibeTimeout': 'Operation timeout in seconds (--vibe; default 1800, maximum 3600)',
         'cli.command.upload.vibeRequired': 'These options require --vibe; the existing platform upload has not been executed.',
         'cli.command.testAccount.desc': 'Manage Mini Game test-account access',
         'cli.command.testAccount.add.desc': 'Generate the authorization entry for adding a TikTok test account',
@@ -7698,6 +7700,7 @@ Vibe QR upload (real PPE trial):
         'cli.command.game.categories.category': '按类型的精确值筛选，例如 Puzzle',
         'cli.command.game.categories.unknown': '类型不存在。使用 ttmg game categories --format json 查询有效值。',
         'cli.command.game.categories.invalidFormat': '输出格式请使用 text、json 或 ndjson。',
+        'cli.command.upload.minisType': 'MINI_GAME（默认）或 MINI_TOOL（本地 PPE 试用；Native ZIP、效率办公类）',
         'cli.command.upload.vibeCategory': '可选游戏类型，须与 --subcategory 同传（--vibe）；用 ttmg game categories --format json 查询',
         'cli.command.upload.vibeDescription': '可选游戏描述（--vibe）；默认值：Discover the fun of TikTok Mini Games.',
         'cli.command.upload.vibeSubcategory': '所属类型的可选子类型；两者均不传保留 Other/Other（--vibe）',
@@ -7713,8 +7716,9 @@ Vibe 扫码上传（真实 PPE 试用）：
   保持原进程运行。在 waiting_authorization 阶段，使用手机 TikTok 扫描 pageUrl 页面中的二维码。
   pageUrl 是 CLI 所在电脑的二维码／进度页；重新打开时，执行返回的 authorizationOpenCommand。
   CLI 负责轮询，授权后自动上传 avatar、app_info、package，不再启动第二次上传。
-  上传成功后 pageUrl 平滑返回原绑定二维码；waiting_preview 继续查询同一任务直到取得 previewUrl。
-  previewReady=true 表示预览链接已返回；qrPurpose=authorization_binding 表示 pageUrl 保留原绑定码。等待超时仍保留 uploaded=true，请核对任务，不要重传。
+  上传成功后 waiting_preview 继续查询同一任务直到取得 previewUrl，包括状态 9（等待提交代码审核）。
+  previewReady=true 时，pageUrl 左侧保留原码用于查看进度，右侧显示预览码；qrPurpose 为 game_preview 或 tool_preview。等待超时仍保留 uploaded=true，请核对任务，不要重传。
+  整体超时默认 1800 秒，最大 3600 秒；页面在任务进行中保持可用，CLI 结束后再保留 30 分钟。
   真实成功：terminal=true、status=uploaded、uploaded=true、simulation=false。失败时读取 errorCode 和 nextAction。
   所有输出格式都会打开本地二维码页；--no-open 可关闭自动打开。
   页面展示本次提交的标题、头像、描述、类型和子类型。
@@ -7933,7 +7937,7 @@ Vibe 扫码上传（真实 PPE 试用）：
         'cli.command.upload.vibeApi': 'Minis Import 接口地址，仅接受回环 IP（--vibe）',
         'cli.command.upload.vibeAuthorizeUrl': '已废弃，请移除此参数；授权地址由创建任务返回（--vibe）',
         'cli.command.upload.vibePollInterval': '覆盖 task 轮询间隔；默认使用接口 poll_interval_seconds（--vibe）',
-        'cli.command.upload.vibeTimeout': '操作超时秒数（--vibe，默认 300）',
+        'cli.command.upload.vibeTimeout': '操作超时秒数（--vibe，默认 1800，最大 3600）',
         'cli.command.upload.vibeRequired': '这些参数需要 --vibe；没有执行原有平台上传。',
         'cli.command.testAccount.desc': '管理小游戏测试账号访问',
         'cli.command.testAccount.add.desc': '生成添加 TikTok 测试账号的授权入口',
@@ -16382,7 +16386,7 @@ async function authStatus(options = {}) {
     return result;
 }
 
-var version = "0.4.6-vibe-beta.18";
+var version = "0.4.6-vibe-beta.20";
 var engines = {
 	node: ">=20.19.1 <21 || >=22"
 };
@@ -16405,6 +16409,23 @@ const VIBE_INPUT_REQUIREMENTS = {
     categoryPairRequiredWhenProvided: true,
     defaultCategory: { category: 'Other', subcategory: 'Other' },
 };
+const VIBE_TOOL_INPUT_REQUIREMENTS = {
+    ...VIBE_INPUT_REQUIREMENTS,
+    defaultMetadataProfile: 'ppe-tool-trial',
+    optionalSkillInputs: ['description', 'minisType'],
+    defaultDescription: 'A simple productivity tool for everyday tasks.',
+    categoryQuery: undefined,
+    categoryPairRequiredWhenProvided: false,
+    defaultCategory: { category: 'EFFICIENCY_AND_OFFICE', subcategory: '' },
+    region: 'US', minSDKVersion: '1.0.0',
+};
+function resolveMinisType(value) {
+    if (value === undefined)
+        return 'MINI_GAME';
+    if (value !== 'MINI_GAME' && value !== 'MINI_TOOL')
+        throw new VibeError('VIBE_INVALID_MINIS_TYPE');
+    return value;
+}
 class VibeError extends Error {
     constructor(code) {
         super(code);
@@ -17142,6 +17163,10 @@ function getCapabilities() {
                 networkRequired: false,
             },
             vibeUpload: {
+                minisType: {
+                    option: '--minis-type', default: 'MINI_GAME', values: ['MINI_GAME', 'MINI_TOOL'],
+                    tool: { readiness: 'local-ppe-trial', deviceVerified: false, category: 'EFFICIENCY_AND_OFFICE', region: 'US', minSDKVersion: '1.0.0', assetType: 'NativeRuntime', metadataOverrides: false },
+                },
                 command: 'ttmg upload --vibe --dir <gameDir> --title <title> --icon <iconPath> --format ndjson',
                 mockCommand: 'ttmg upload --vibe --mock --dir <gameDir> --title <title> --icon <iconPath> --format ndjson',
                 guide: 'vibe-upload.md',
@@ -17268,14 +17293,16 @@ function getCapabilities() {
                 provisionalHttpAdapter: 'loopback-only',
                 httpContract: 'minis-import-task',
                 authorizationQr: true,
-                previewQr: false,
+                previewQr: true,
                 preview: {
                     taskEndpoint: 'get_minis_import_task_detail_for_agent',
                     waitingStatus: 'waiting_preview',
                     resultFields: ['previewUrl', 'previewReady', 'clientKey', 'appId', 'codeAssetId', 'minisCenterHistoryId'],
                     readiness: 'nonempty-valid-preview-url',
-                    qrPurpose: 'authorization_binding',
-                    pageQrSource: 'original-landing-url',
+                    qrPurpose: 'game_preview',
+                    toolQrPurpose: 'tool_preview',
+                    pageQrSource: 'preview-url',
+                    retainsBindingQr: true,
                     sameTask: true,
                     timeout: 'shared-operation-timeout',
                     failurePreservesUploaded: true,
@@ -18039,6 +18066,7 @@ withVerboseOption(program
     .option('--serve-preview-page', t('cli.command.upload.servePreviewPage'))
     .option('--no-open', t('cli.command.upload.noOpen'))
     .option('--vibe', t('cli.command.upload.vibe'))
+    .option('--minis-type <type>', t('cli.command.upload.minisType'))
     .addOption(new commander.Option('--web', t('cli.command.upload.vibeWeb')).hideHelp())
     // Vibe v2 backend selection (including opt-in ppe-mock) stays outside the Skill workflow.
     .option('--title <title>', t('cli.command.upload.vibeTitle'))
@@ -18064,6 +18092,7 @@ withVerboseOption(program
     }
     if ([
         cmd.title,
+        cmd.minisType,
         cmd.description,
         cmd.icon,
         cmd.appInfo,
@@ -18664,7 +18693,10 @@ function taskId(value) {
     return value;
 }
 function status(value) {
-    if (!Number.isInteger(value) || Number(value) < 1 || Number(value) > 8)
+    // IDL status 9 waits for code review submission; preview may already be ready.
+    // Keep polling it just like other non-failure states and use preview_url to
+    // determine preview readiness, rather than treating review as a prerequisite.
+    if (!Number.isInteger(value) || Number(value) < 1 || Number(value) > 9)
         throw new VibeError('VIBE_INVALID_RESPONSE');
     return Number(value);
 }
@@ -18775,7 +18807,7 @@ function createBackend(mode, transport) {
                 path: MINIS_IMPORT_PATHS.info,
                 data: {
                     ...credentials(task),
-                    app_info: { ...(appInfo || VIBE_PPE_DEFAULT_APP_INFO), app_name: title, icon_uri: iconUri },
+                    app_info: { ...Object.fromEntries(Object.entries(appInfo || VIBE_PPE_DEFAULT_APP_INFO).filter(([, value]) => value !== '')), app_name: title, icon_uri: iconUri },
                 },
                 signal,
             });
@@ -18967,7 +18999,7 @@ function createMockBackend(scenario = 'success') {
         if (path === MINIS_IMPORT_PATHS.create) {
             if (created ||
                 data.source_type !== 1 ||
-                data.minis_type !== 'MINI_GAME' ||
+                !['MINI_GAME', 'MINI_TOOL'].includes(data.minis_type) ||
                 !nonempty(data.source_project_id) ||
                 !nonempty(data.task_idempotency_id))
                 throw new VibeError('VIBE_INVALID_RESPONSE');
@@ -19271,9 +19303,19 @@ function readFile(file, limit, code) {
 }
 async function prepareVibeInput(options, onPackaging, signal, deps = { check: executeCheck, zip: zipCwdToBuffer }) {
     const title = options.title?.trim();
+    const minisType = resolveMinisType(options.minisType);
     if (!title)
         throw new VibeError('VIBE_TITLE_REQUIRED');
-    const appInfo = applyVibeCategory(options, applyVibeDescription(options.description, readVibeAppInfo(options.appInfo)));
+    if (minisType === 'MINI_TOOL' && (options.appInfo || options.category || options.subcategory))
+        throw new VibeError('VIBE_TOOL_TRIAL_METADATA');
+    const appInfo = minisType === 'MINI_TOOL'
+        ? applyVibeDescription(options.description, {
+            description: 'A simple productivity tool for everyday tasks.',
+            category: 'EFFICIENCY_AND_OFFICE', subcategory: '',
+            terms_of_service: 'https://www.tiktok.com', privacy_policy: 'https://www.tiktok.com',
+            copyright_confirmation: true, region: 'US', min_sdk_version: '1.0.0',
+        })
+        : applyVibeCategory(options, applyVibeDescription(options.description, readVibeAppInfo(options.appInfo)));
     if (options.package && options.dir)
         throw new VibeError('VIBE_INPUT_CONFLICT');
     const image = readFile(options.icon, VIBE_ICON_LIMIT, 'VIBE_INVALID_ICON');
@@ -19307,6 +19349,7 @@ async function prepareVibeInput(options, onPackaging, signal, deps = { check: ex
     if (signal.aborted)
         throw new VibeError('VIBE_CANCELLED');
     const input = {
+        minisType,
         title,
         ...(appInfo ? { appInfo } : {}),
         icon: {
@@ -19326,28 +19369,254 @@ const vibePageStyles = `
 :root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:#24282f;background:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
 *{box-sizing:border-box}
 body{margin:0;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:64px 24px;font-size:14px;line-height:1.5}
-.shell{position:relative;width:100%;max-width:400px}
-.steps{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 24px;padding:0;list-style:none}
+.shell{position:relative;width:480px;max-width:100%}
+.steps{display:flex;align-items:center;justify-content:center;gap:10px;margin:24px 0 20px;padding:0;list-style:none}
 .step{display:flex;align-items:center;gap:6px;font-size:11px;color:#9298a2;white-space:nowrap}
 .step:after{content:"";height:1px;width:25px;margin-left:4px;background:#e9ebef}.step:last-child:after{display:none}
 .step-number{height:18px;min-width:18px;border-radius:50%;border:1px solid #e2e5e9;display:grid;place-items:center;font-size:10px}
-.step.active{color:#272c34;font-weight:600}.step.active .step-number{background:#272c34;color:#fff;border-color:#272c34}
-.step.done{color:#537565}.step.done .step-number{background:#edf6f0;color:#287c54;border-color:#edf6f0}
-.heading{text-align:center}h1{font-size:26px;font-weight:650;line-height:1.35;letter-spacing:-.6px;margin:0 0 10px}
-.subtitle{color:#7a818c;font-size:12px;line-height:1.7;margin:0;overflow-wrap:anywhere}
-.game{margin:24px 0 0;padding-top:20px;border-top:1px solid #eceef1;text-align:center}
-.game-summary{display:flex;align-items:center;justify-content:center;gap:12px}.game-title{max-width:100%;margin:0;font-size:15px;font-weight:600;overflow-wrap:anywhere;min-width:0}
+.step.active{color:#272c34;font-weight:600}.step.active .step-number{background:none;color:#272c34;border-color:transparent}
+.step.done{color:#7a818c}.step.done .step-number{background:#a3e635;color:#24282f;border-color:#a3e635}
+.swirl{display:block;width:18px;height:18px;border-radius:50%;background:conic-gradient(transparent 0 .1turn,currentColor 1turn);-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 2.5px),#000 0);mask:radial-gradient(farthest-side,#0000 calc(100% - 2.5px),#000 0);animation:swirl-spin .9s linear infinite}
+@keyframes swirl-spin{to{transform:rotate(1turn)}}
+.heading{text-align:center}h1{font-size:20px;font-weight:600;line-height:1.6;letter-spacing:-.3px;margin:0 0 12px}
+.subtitle{color:#7a818c;font-size:14px;line-height:1.6;margin:0;min-height:22px;overflow-wrap:anywhere}
+.preview-loading{width:min(240px,100%);height:4px;margin:18px auto 0;border-radius:4px;overflow:hidden;background:#eceef1}
+.preview-loading span{display:block;width:40%;height:100%;border-radius:inherit;background:#858c96;animation:preview-loading-slide 1.8s ease-in-out infinite}
+@keyframes preview-loading-slide{from{transform:translateX(-100%)}to{transform:translateX(250%)}}
+@media(prefers-reduced-motion:reduce){.preview-loading span{animation:none;transform:translateX(75%)}}
+.game{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;align-items:start;margin:24px 22px 0;padding:16px 18px;border-radius:16px;background:#f7f8fa;text-align:left}
+.game-summary{display:contents}.game-title{grid-column:2;max-width:100%;margin:0;font-size:15px;font-weight:600;overflow-wrap:anywhere;min-width:0}
 .game-icon,.game-avatar{width:44px;height:44px;border-radius:10px;flex-shrink:0;background:#f0f2f5}.game-avatar{object-fit:cover}.game-icon{display:grid;place-items:center;color:#707b8b}
-.game-details{margin:16px 0 0;font-size:13px}.game-details>div:first-child,.game-categories>div{display:flex;align-items:baseline;justify-content:center;gap:8px}.game-details dt{flex-shrink:0;font-size:11px;color:#9298a2;margin:0}.game-details dd{min-width:0;margin:0;text-align:left;overflow-wrap:anywhere}
-.game-description{white-space:pre-wrap;line-height:1.65}.game-categories{display:grid;grid-template-columns:1fr;gap:16px;margin-top:16px}
-.scan-action{text-align:center;font-size:13px;font-weight:500;margin:26px 0 10px}.qr-area{display:flex;justify-content:center}.qr-frame{padding:8px;width:208px;height:208px}.qr-frame img{display:block;width:192px;height:192px;max-width:100%}
-.game+.qr-area{margin-top:20px}.scan-hint{text-align:center;font-size:11px;color:#7a818c;line-height:1.7;margin:8px 0 0}
+.game-icon,.game-avatar{grid-column:1;grid-row:1 / 3;align-self:center}
+.game-details{grid-column:2;margin:4px 0 0;font-size:12px;color:#7a818c}.game-details>div:first-child,.game-categories>div{display:flex;align-items:baseline;gap:6px}.game-details dt{flex-shrink:0;font-size:11px;color:#9298a2;margin:0}.game-details dd{min-width:0;margin:0;text-align:left;overflow-wrap:anywhere}
+.game-description{white-space:pre-wrap;line-height:1.65}.game-categories{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:6px}
+/* 32px preserves at least four quiet modules even for a 21-module QR at 160px. */
+.scan-action{text-align:center;font-size:13px;font-weight:500;margin:26px 0 10px}.qr-area{display:flex;justify-content:center}.qr-frame{padding:32px;width:224px;height:224px;background:#fff}.qr-frame img{display:block;width:160px;height:160px;max-width:100%}
+.game+.qr-area{margin-top:20px}.scan-hint{text-align:center;font-size:11px;color:#7a818c;line-height:1.7;margin:8px 0 0;min-height:19px}
+.qr-area{flex-wrap:wrap;gap:20px;min-height:288px;align-content:flex-start}.qr-code{margin:0;width:224px;text-align:center}.qr-code figcaption{font-size:13px;font-weight:600;margin-top:4px;min-height:60px}.qr-code figcaption span{display:block;font-size:11px;font-weight:400;color:#7a818c;margin-top:4px;min-height:35px}
+.snake{display:grid;grid-template-columns:repeat(var(--cells),var(--module));color:#24282f;width:160px;height:160px}
+.snake i{width:var(--module);height:var(--module)}.snake i.lit,.snake i.on{background:currentColor}.snake i.fresh{animation:snake-settle .5s ease-out}.snake i.apple{background:#a3e635;animation:snake-apple 1.2s ease-in-out infinite}
+@keyframes snake-settle{from{background:#a3e635}to{background:currentColor}}@keyframes snake-apple{50%{opacity:.4}}
+@media(prefers-reduced-motion:reduce){.swirl,.snake i.fresh,.snake i.apple{animation:none}}
 .upload-area{display:flex;align-items:center;flex-direction:column;gap:16px;padding-top:26px}.percentage{font-size:34px;line-height:1;font-variant-numeric:tabular-nums;font-weight:550}.percentage span{font-size:16px;color:#858e9d;padding-left:3px}
 .progress-wrap{width:100%}progress{display:block;width:100%;height:4px;border:none;border-radius:20px;overflow:hidden;background:#edf0f4;accent-color:#4c6378}progress::-webkit-progress-bar{background:#edf0f4;border-radius:20px}progress::-webkit-progress-value{background:#4c6378;border-radius:20px}progress::-moz-progress-bar{background:#4c6378;border-radius:20px}.transfer-label{text-align:center;font-size:11px;color:#8b939f;margin:8px 0 0}
 .footer{text-align:center;font-size:10px;line-height:1.7;color:#a0a5ae;margin:24px 0 0}.footer .dot{display:inline-block;height:5px;width:5px;border-radius:50%;background:#c1995e;vertical-align:middle;margin-right:5px}.mock-badge{width:fit-content;margin:0 0 10px auto;font-size:10px;padding:2px 7px;border:1px solid #dfe2e7;border-radius:5px;color:#707783}
-@media(max-width:380px){body{padding-left:20px;padding-right:20px}.steps{gap:7px}.step:after{width:16px;margin-left:1px}h1{font-size:24px}}
+@media(max-width:380px){body{padding-left:20px;padding-right:20px}.steps{gap:7px}.step:after{width:16px;margin-left:1px}}
+@media(max-width:520px){.game{margin-left:0;margin-right:0}.scan-hint{min-height:38px}}
 `;
 
+// Adapted from tiktok-minis-skills publish_tool.js at 132cd91.
+// Decorative waiting animation only; real preview QRs always use previewUrl.
+const qrPreviewLoader = `(() => {
+  const neighbours = (p, w) => {
+    const row = (p / w) | 0, col = p % w, out = [];
+    if (row > 0) out.push(p - w);
+    if (row < w - 1) out.push(p + w);
+    if (col > 0) out.push(p - 1);
+    if (col < w - 1) out.push(p + 1);
+    return out;
+  };
+
+  /** First step of a shortest path from 'from' to 'to', body cells excluded. */
+  function stepToward(from, to, blocked, w) {
+    if (from === to) return from;
+    const prev = new Map([[from, from]]);
+    let front = [from];
+    while (front.length) {
+      const next = [];
+      for (const cell of front)
+        for (const nb of neighbours(cell, w)) {
+          if (prev.has(nb) || (blocked.has(nb) && nb !== to)) continue;
+          prev.set(nb, cell);
+          if (nb === to) {
+            let node = nb;
+            while (prev.get(node) !== from) node = prev.get(node);
+            return node;
+          }
+          next.push(nb);
+        }
+      front = next;
+    }
+    return -1;
+  }
+
+  /** Nearest still-unlit module, by plain grid distance from the head. */
+  function nearestTarget(head, pending, w) {
+    const hr = (head / w) | 0, hc = head % w;
+    let best = -1, bestD = Infinity;
+    for (const cell of pending) {
+      const d = Math.abs(((cell / w) | 0) - hr) + Math.abs((cell % w) - hc);
+      if (d < bestD) { bestD = d; best = cell; }
+    }
+    return best;
+  }
+
+  function play(matrix, w, maxLength) {
+    const pending = new Set();
+    for (let i = 0; i < w * w; i++) if (matrix[i]) pending.add(i);
+
+    // The snake starts on a dark module, and only moving lights one, so the
+    // starting square has to be lit here or the finished code is a module
+    // short -- a hole the error correction hides rather than a code that is
+    // actually right.
+    const start = [...pending][0];
+    pending.delete(start);
+    const snake = [start];
+    const body = new Set(snake);
+    const lit = new Set([start]);
+    const frames = [];
+    let budget = w * w * 6;
+
+    while (pending.size && --budget > 0) {
+      const head = snake[snake.length - 1];
+      const target = nearestTarget(head, pending, w);
+      if (target < 0) break;
+      const move = stepToward(head, target, body, w);
+      if (move < 0) break;
+
+      snake.push(move);
+      body.add(move);
+      while (snake.length > maxLength) body.delete(snake.shift());
+      if (matrix[move]) { lit.add(move); pending.delete(move); }
+
+      frames.push({ snake: [...snake], lit: [...lit], apple: target });
+    }
+    return frames;
+  }
+
+  function mount(host) {
+    if (host.dataset.mounted) return;
+    host.dataset.mounted = '1';
+    const matrix = JSON.parse(host.dataset.matrix);
+    const w = Number(host.dataset.size);
+    const SPEED = Number(host.dataset.speed) || 20;   // ms a step
+    host.style.setProperty('--cells', w);
+    host.replaceChildren(...Array.from({ length: w * w }, () => document.createElement('i')));
+    const dots = Array.from(host.children);
+
+    const frames = play(matrix, w, 14);
+    const last = frames.length - 1;
+    if (last < 1) return;
+    const all = frames[last].lit;
+
+    // A lap stops short of the last modules and fades, rather than holding a
+    // finished code that would read as the preview having arrived.
+    const DRAW = Math.round(0.95 * last);
+    const FADE = 20;
+    const lap = DRAW + FADE;
+    // Below this a lap is too unfinished for a sprint to be worth watching.
+    const SPRINTABLE = 0.6;
+
+    // One clock for the whole wait. <main> is replaced as the upload advances,
+    // so a board may be a later stand-in for an earlier one; it has to carry
+    // on from where that one stopped instead of starting the code over.
+    window.__snakeStart = window.__snakeStart || Date.now();
+
+    let sprint = null;
+
+    /**
+     * Only the cells that changed. Repainting all 841 every frame meant ~2500
+     * class writes 50 times a second to move a 14-cell snake; this touches
+     * about 30. The lit list only ever grows within a pass, so the new
+     * modules are its tail, and the body and the apple are small.
+     *
+     * The settle flag is off while the snake is only wandering: the flash
+     * means a module was just revealed, and nothing is revealed then.
+     */
+    const litSet = new Set();
+    let litCount = 0;
+    let prevBody = [];
+    let prevApple = -1;
+
+    const cell = (k, className, opacity) => {
+      const dot = dots[k];
+      if (dot.className !== className) dot.className = className;
+      if (dot.style.opacity !== opacity) dot.style.opacity = opacity;
+    };
+    const restingClass = (k) => (litSet.has(k) ? 'lit' : '');
+
+    const paint = ({ snake, lit, apple }, settle = true) => {
+      if (lit.length < litCount) {   // a fresh pass: start from an empty board
+        litSet.clear(); litCount = 0; prevBody = []; prevApple = -1;
+        for (const dot of dots) { dot.className = ''; dot.style.opacity = ''; }
+      }
+      // Paint every new module here rather than relying on the body to
+      // uncover it: frames are skipped whenever the board moves faster than
+      // one step a tick -- the sprint skips dozens -- and a module the body
+      // never sat on would otherwise stay dark in a finished code.
+      for (let i = litCount; i < lit.length; i++) { litSet.add(lit[i]); cell(lit[i], 'lit', ''); }
+      litCount = lit.length;
+
+      // The module the snake lit is under its head; it shows when the tail
+      // clears it, so the flash belongs to the cell the body just left.
+      for (const k of prevBody)
+        if (!snake.includes(k))
+          cell(k, litSet.has(k) && settle ? 'lit fresh' : restingClass(k), '');
+
+      const length = snake.length;
+      snake.forEach((k, i) => cell(k, 'on', String(0.2 + 0.55 * ((i + 1) / length))));
+      prevBody = snake;
+
+      if (prevApple !== apple) {
+        if (prevApple >= 0 && !snake.includes(prevApple))
+          cell(prevApple, restingClass(prevApple), '');
+        if (apple >= 0) cell(apple, 'apple', '');
+        prevApple = apple;
+      }
+    };
+
+    const step = () => Math.floor((Date.now() - window.__snakeStart) / SPEED) % lap;
+    /** How far into its draw this lap is, 0 to 1. */
+    const lapProgress = () => Math.min(1, step() / DRAW);
+
+    if (window.matchMedia?.('(prefers-reduced-motion: reduce)').matches) {
+      paint(frames[Math.floor(DRAW / 3)], false);
+      host.finish = () => Promise.resolve();
+      return;
+    }
+
+    const timer = setInterval(() => {
+      // The page swaps <main> as the upload advances; stop with the old board.
+      if (!host.isConnected) { clearInterval(timer); return; }
+      if (sprint) {
+        const k = Math.min(1, (Date.now() - sprint.at) / sprint.ms);
+        const p = sprint.from + (1 - sprint.from) * k;
+        if (p >= 1) {
+          paint({ snake: [], lit: all, apple: -1 });
+          clearInterval(timer);
+          sprint.done();
+          return;
+        }
+        paint(frames[Math.round(p * last)]);
+        return;
+      }
+      const at = step();
+      if (at > DRAW) {                       // fading out before the next lap
+        host.style.opacity = String(1 - (at - DRAW) / FADE);
+        return;
+      }
+      if (host.style.opacity) host.style.opacity = '';
+      paint(frames[at]);
+    }, SPEED);
+
+    host.finish = () => {
+      if (sprint) return Promise.resolve();
+      const from = lapProgress();
+      if (from < SPRINTABLE) return Promise.resolve();
+      host.style.opacity = '';
+      sprint = { from, at: Date.now(), ms: 300 + 500 * (1 - from), done: () => {} };
+      return new Promise((resolve) => { sprint.done = resolve; });
+    };
+  }
+
+  const boards = () => [...document.querySelectorAll('.snake')];
+  const start = () => boards().forEach(mount);
+  window.__mountSnakes = start;
+  window.__snakeFinish = () => Promise.all(boards().map((b) => b.finish?.()));
+  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', start);
+  else start();
+})();`;
+
 const VIBE_PAGE_WORKER = '__vibe-page-server';
 // Includes the base64 form of the locally validated image (up to 10 MiB).
 const VIBE_PAGE_HTML_LIMIT = 16 * 1024 * 1024;
@@ -19361,6 +19630,7 @@ const pageUpdates = `(() => {
     const height = current.getBoundingClientRect().height;
     if (animate) await current.animate([{opacity: 1}, {opacity: 0}], {duration: 140, fill: 'forwards'}).finished.catch(() => {});
     current.replaceWith(updated);
+    window.__mountSnakes?.();
     if (animate) await updated.animate([
       {opacity: 0, height: height + 'px', overflow: 'hidden'},
       {opacity: 1, height: updated.getBoundingClientRect().height + 'px', overflow: 'hidden'}
@@ -19368,17 +19638,19 @@ const pageUpdates = `(() => {
   }
   async function show(updated) {
     let current = document.querySelector('main');
-    if (!current || current.outerHTML === updated.outerHTML) return;
-    if (updated.dataset.uploadedBinding === 'true' && current.dataset.uploadedBinding !== 'true') {
-      // Return to the original binding QR after showing the upload receipt,
+    if (!current || current.dataset.rev === updated.dataset.rev) return;
+    if (updated.dataset.phase === 'preview' && current.querySelector('.snake'))
+      await window.__snakeFinish?.();
+    if (updated.dataset.uploaded === 'true' && current.dataset.uploaded !== 'true') {
+      // Show the upload receipt before either the binding or ready preview QR,
       // even when polling skips intermediate upload states.
       const success = updated.cloneNode(true);
       success.dataset.phase = 'upload_success';
-      delete success.dataset.uploadedBinding;
+      delete success.dataset.uploaded;
       const heading = success.querySelector('.heading');
       success.querySelector('h1').textContent = heading.dataset.uploadTitle;
       success.querySelector('.subtitle').textContent = heading.dataset.uploadSubtitle;
-      success.querySelectorAll('.qr-area, .scan-action, .scan-hint').forEach(node => node.remove());
+      success.querySelectorAll('.qr-area, .scan-action, .scan-hint, .preview-loading').forEach(node => node.remove());
       await replace(current, success);
       current = success;
       await delay(1200);
@@ -19395,6 +19667,7 @@ const pageUpdates = `(() => {
         const updated = next.querySelector('main');
         if (updated) await show(updated);
         document.title = next.title;
+        document.documentElement.lang = next.documentElement.lang;
       }
     } catch { /* Keep the current page readable during a temporary connection failure. */ }
     if (!terminal()) setTimeout(refresh, 2000);
@@ -19404,14 +19677,20 @@ const pageUpdates = `(() => {
 const escape = (s) => s.replace(/[&<>"']/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' })[c]);
 async function renderVibePage(input) {
     const zh = input.language !== 'en-US';
+    const message = input.localizedMessages?.[zh ? 'zh-CN' : 'en-US'] ?? input.message;
+    const tool = input.minisType === 'MINI_TOOL';
     const phase = input.phase ||
         (input.purpose === 'authorization_binding' ? 'binding' : 'uploading');
     const uploadedBinding = !input.simulation && input.purpose === 'authorization_binding' &&
         (phase === 'waiting_preview' || phase === 'preview' || phase === 'complete');
+    const preview = !input.simulation && phase === 'preview' &&
+        (input.purpose === 'game_preview' || input.purpose === 'tool_preview');
+    const uploaded = uploadedBinding || preview;
     const copy = zh
         ? {
-            steps: ['扫码授权', '上传游戏', '完成'],
+            steps: ['扫码授权', '上传游戏', '预览'],
             mock: input.hybrid ? 'PPE + Mock' : '模拟',
+            game: '当前游戏',
             gameIcon: '游戏头像',
             bindingTitle: '上传到 TikTok',
             bindingAction: input.hybrid ? '真实授权二维码 · 混合联调' : '使用 TikTok 扫描二维码',
@@ -19424,6 +19703,7 @@ async function renderVibePage(input) {
             uploadingTitle: '正在上传小游戏',
             uploadingSubtitle: input.simulation ? '正在模拟授权后的上传流程，不会上传游戏内容。' : '授权已完成，正在上传本次游戏内容。',
             uploadLabel: input.simulation ? '模拟上传进度' : '上传进度',
+            uploadStatus: '正在上传游戏，请稍候',
             completeTitle: input.simulation ? '模拟上传完成' : '上传完成',
             completeSubtitle: input.simulation
                 ? '绑定和上传流程模拟完成，未向 TikTok 上传游戏。'
@@ -19434,8 +19714,9 @@ async function renderVibePage(input) {
             mockNote: input.hybrid ? '真实创建 / 查询任务 · 授权 / 上传为模拟 · 不改变真实任务状态' : '模拟运行 · 无需扫码，不会真实上传',
         }
         : {
-            steps: ['Authorize', 'Upload', 'Done'],
+            steps: ['Scan', 'Upload', 'Preview'],
             mock: input.hybrid ? 'PPE + Mock' : 'MOCK',
+            game: 'YOUR GAME',
             gameIcon: 'Game icon',
             bindingTitle: 'Upload to TikTok',
             bindingAction: input.hybrid ? 'Real authorization QR · integration demo' : 'Scan the QR code with TikTok',
@@ -19452,6 +19733,7 @@ async function renderVibePage(input) {
             uploadLabel: input.simulation
                 ? 'Simulated upload progress'
                 : 'Upload progress',
+            uploadStatus: 'Uploading your game. Please wait.',
             completeTitle: input.simulation ? 'Simulated upload complete' : 'Upload complete',
             completeSubtitle: input.simulation
                 ? 'Binding and upload simulation complete. Nothing was uploaded to TikTok.'
@@ -19461,6 +19743,16 @@ async function renderVibePage(input) {
             accepted: input.simulation ? 'Simulation complete' : 'Uploaded',
             mockNote: input.hybrid ? 'Real task creation / polling · Mock authorization / upload · Real task status unchanged' : 'Mock only · no scan needed, nothing is uploaded',
         };
+    if (tool) {
+        for (const key of Object.keys(copy)) {
+            const value = copy[key];
+            if (typeof value === 'string')
+                copy[key] = value.replace(/小游戏|游戏/g, '工具').replace(/game/gi, 'tool');
+        }
+        copy.steps[1] = zh ? '上传工具' : 'Upload';
+    }
+    if (input.simulation)
+        copy.steps[2] = zh ? '完成' : 'Done';
     if (input.web) {
         copy.steps[0] = zh ? '网页授权' : 'Web authorization';
         copy.bindingAction = zh ? '在浏览器完成授权绑定' : 'Authorize in your browser';
@@ -19469,22 +19761,22 @@ async function renderVibePage(input) {
             : (zh ? '请在已打开的 TikTok 页面确认授权，当前命令会继续查询绑定状态。' : 'Confirm authorization on the opened TikTok page. The command continues polling.');
         copy.bindingStatus = input.simulation ? (zh ? '模拟等待授权' : 'Simulating authorization') : (zh ? '等待网页授权' : 'Waiting for browser authorization');
     }
-    const step = phase === 'binding' ? 0 : phase === 'uploading' ? 1 : 2;
+    const step = phase === 'binding' ? 0 : phase === 'uploading' ? 1 : phase === 'preview' ? 3 : 2;
     // Only embed the chosen raster image; never fetch a URL or expose its local path.
     const icon = input.iconDataUrl &&
         input.iconDataUrl.length <= 14 * 1024 * 1024 &&
         /^data:image\/(?:png|jpeg|webp);base64,[A-Za-z0-9+/]+=*$/.test(input.iconDataUrl)
         ? `<img class="game-avatar" width="44" height="44" alt="${copy.gameIcon}" src="${input.iconDataUrl}">`
         : '<span class="game-icon" aria-hidden="true"><svg width="22" height="22" viewBox="0 0 24 24" fill="none"><path d="M7 7h10c2 0 3 2 3 4l1 5c.4 2-1 3-2.5 2l-3-2h-7l-3 2C4 19 2.6 18 3 16l1-5c0-2 1-4 3-4Z" stroke="currentColor" stroke-width="1.4" stroke-linejoin="round"/><path d="M8 10v4m-2-2h4m6-1h.01M18 13h.01" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg></span>';
-    const game = `<div class="game"><div class="game-summary">${icon}<p class="game-title">${escape(input.title)}</p></div><dl class="game-details"><div><dt>${zh ? '描述' : 'Description'}</dt><dd class="game-description">${escape(input.description ?? VIBE_PPE_DEFAULT_APP_INFO.description)}</dd></div><div class="game-categories"><div><dt>${zh ? '类型' : 'Category'}</dt><dd>${escape(input.category ?? VIBE_PPE_DEFAULT_APP_INFO.category)}</dd></div><div><dt>${zh ? '子类型' : 'Subcategory'}</dt><dd>${escape(input.subcategory ?? VIBE_PPE_DEFAULT_APP_INFO.subcategory)}</dd></div></div></dl></div>`;
+    const game = `<div class="game"><div class="game-summary">${icon}<p class="game-title">${escape(input.title)}</p></div><dl class="game-details"><div><dt>${zh ? '描述' : 'Description'}</dt><dd class="game-description">${escape(input.description ?? VIBE_PPE_DEFAULT_APP_INFO.description)}</dd></div><div class="game-categories"><div><dt>${zh ? '类型' : 'Category'}</dt><dd>${escape(tool && input.category === 'EFFICIENCY_AND_OFFICE' ? (zh ? '效率办公' : 'Efficiency & Office') : input.category ?? VIBE_PPE_DEFAULT_APP_INFO.category)}</dd></div>${tool ? '' : `<div><dt>${zh ? '子类型' : 'Subcategory'}</dt><dd>${escape(input.subcategory ?? VIBE_PPE_DEFAULT_APP_INFO.subcategory)}</dd></div>`}</div></dl></div>`;
     const checkIcon = '<svg width="12" height="12" viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="m3 8 3 3 7-7" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/></svg>';
     const uploadSuccessTitle = zh ? '上传成功' : 'Upload complete';
     const uploadSuccessSubtitle = zh
-        ? '游戏内容已上传，正在返回扫码页面。'
-        : 'Your game has been uploaded. Returning to the scan page.';
-    const title = uploadedBinding ? (zh ? '扫码打开绑定页面' : 'Scan to open the binding page')
+        ? `${tool ? '工具' : '游戏'}内容已上传，正在返回扫码页面。`
+        : `Your ${tool ? 'tool' : 'game'} has been uploaded. Returning to the scan page.`;
+    const title = uploadedBinding ? (phase === 'waiting_preview' ? (zh ? '正在生成预览' : 'Preparing preview') : zh ? '扫码查看进度' : 'Scan to check progress')
         : phase === 'waiting_preview' ? (zh ? '正在准备预览' : 'Preparing preview')
-            : phase === 'preview' ? (zh ? '扫码预览游戏' : 'Scan to preview')
+            : phase === 'preview' ? (zh ? `扫码预览${tool ? '工具' : '游戏'}` : 'Scan to preview')
                 : phase === 'binding'
                     ? copy.bindingTitle
                     : phase === 'uploading'
@@ -19492,55 +19784,83 @@ async function renderVibePage(input) {
                         : phase === 'failed'
                             ? copy.failedTitle
                             : copy.completeTitle;
-    const subtitle = uploadedBinding ? (phase === 'complete' ? escape(input.message) : zh
-        ? '本次游戏代码包已上传完成，再次扫码即可查看预览版本并提交审核。'
-        : 'Your game package has been uploaded. Scan again to view the preview version and submit it for review.')
-        : phase === 'waiting_preview' ? (zh ? '游戏内容已上传，预览就绪后会自动显示二维码。' : 'Game content uploaded. The preview QR will appear when ready.')
-            : phase === 'preview' ? (zh ? '上传完成，使用手机 TikTok 扫描下方二维码。' : 'Upload complete. Scan the QR below with TikTok on your phone.')
-                : phase === 'complete' && !input.simulation ? escape(input.message)
+    const subtitle = uploadedBinding ? (phase === 'complete' ? escape(message) : phase === 'waiting_preview'
+        ? (zh ? '代码包已上传，正在生成预览。准备好后会自动显示预览二维码。' : 'Package uploaded. Your preview is being prepared; its QR will appear when ready.') : zh
+        ? `本次${tool ? '工具' : '游戏'}代码包已上传完成，再次扫码即可查看预览版本并提交审核。`
+        : `Your ${tool ? 'tool' : 'game'} package has been uploaded. Scan again to view the preview version and submit it for review.`)
+        : phase === 'waiting_preview' ? (zh ? '内容已上传，预览就绪后会自动显示二维码。' : 'Content uploaded. The preview QR will appear when ready.')
+            : phase === 'preview' ? ''
+                : phase === 'complete' && !input.simulation ? escape(message)
                     : phase === 'binding'
                         ? copy.bindingSubtitle
                         : phase === 'uploading'
                             ? copy.uploadingSubtitle
                             : phase === 'failed'
-                                ? escape(input.message)
+                                ? escape(message)
                                 : copy.completeSubtitle;
-    const qr = (phase === 'binding' || phase === 'preview' || uploadedBinding) && !input.web && input.qrUrl
+    const qr = (phase === 'binding' || phase === 'uploading' || phase === 'preview' || uploadedBinding) && !input.web && input.qrUrl
         ? await QRCode.toDataURL(input.qrUrl, {
             width: 384,
-            margin: 4,
+            // Fixed CSS quiet zones keep different QR versions visually equal.
+            margin: 0,
             errorCorrectionLevel: 'M',
         })
         : '';
-    const purpose = phase === 'preview' && !uploadedBinding ? (zh ? '游戏预览二维码' : 'Game preview QR') : copy.bindingCode;
-    const done = phase === 'complete' || phase === 'preview' || phase === 'waiting_preview';
+    const progressCode = zh ? '查看进度二维码' : 'Progress QR';
+    const purpose = preview ? (zh ? `${tool ? '工具' : '游戏'}预览二维码` : `${tool ? 'Tool' : 'Game'} preview QR`) : uploadedBinding || phase === 'uploading' ? (zh ? '应用页面二维码' : 'App page QR') : copy.bindingCode;
+    const bindingQr = preview && !input.web && input.bindingQrUrl && input.bindingQrUrl !== input.qrUrl
+        ? await QRCode.toDataURL(input.bindingQrUrl, { width: 384, margin: 0, errorCorrectionLevel: 'M' }) : '';
+    const done = phase === 'preview' || phase === 'complete' && input.simulation;
+    const active = phase === 'binding' || phase === 'uploading' || phase === 'waiting_preview';
+    const waiting = phase === 'waiting_preview';
+    const matrix = waiting ? QRCode.create('https://www.tiktok.com/minis/').modules : undefined;
+    const pendingQr = matrix ? `<figure class="qr-code qr-pending"><div class="qr-frame" role="img" aria-label="${zh ? '预览正在生成' : 'Preview is being prepared'}"><div class="snake" aria-hidden="true" data-size="${matrix.size}" data-speed="20" data-matrix='${JSON.stringify(Array.from(matrix.data))}' style="--module:${160 / matrix.size}px"></div></div><figcaption>${zh ? '正在生成预览' : 'Preparing preview'}</figcaption></figure>` : '';
     const progress = typeof input.progressPercent === 'number' &&
         Number.isFinite(input.progressPercent)
         ? Math.max(0, Math.min(100, Math.round(input.progressPercent)))
         : undefined;
+    const progressQr = bindingQr ? `<figure class="qr-code"><div class="qr-frame"><img width="160" height="160" alt="${progressCode}" src="${bindingQr}"></div><figcaption>${zh ? '查看进度' : 'Check progress'}<span>${zh ? '查看应用信息并提交审核' : 'View app details and submit for review'}</span></figcaption></figure>` : '';
+    // Keep the original scan entry on the left while the right side becomes a preview.
     const content = qr
-        ? `<div class="qr-area"><div class="qr-frame"><img width="192" height="192" alt="${purpose}" src="${qr}"></div></div>`
+        ? `<div class="qr-area">${progressQr}<figure class="qr-code"><div class="qr-frame"><img width="160" height="160" alt="${purpose}" src="${qr}"></div>${preview ? `<figcaption>${zh ? '扫码预览' : 'Preview'}<span>${zh ? '打开本次上传的预览版本' : 'Open the preview of this upload'}</span></figcaption>` : phase === 'binding' ? `<figcaption>${zh ? '扫码授权' : 'Authorize upload'}</figcaption>` : `<figcaption>${zh ? '查看进度' : 'Check progress'}<span>${zh ? '扫码查看应用信息' : 'Scan to view app details'}</span></figcaption>`}</figure>${pendingQr}</div>`
         : phase === 'uploading' && progress !== undefined
             ? `<div class="upload-area"><div class="percentage">${progress}<span>%</span></div><div class="progress-wrap"><progress aria-label="${copy.uploadLabel}" max="100" value="${progress}"></progress><p class="transfer-label">${copy.uploadLabel}</p></div></div>`
             : '';
+    const previewLoading = phase === 'waiting_preview'
+        ? `<div class="preview-loading" role="progressbar" aria-label="${zh ? '正在生成预览' : 'Preparing preview'}"><span aria-hidden="true"></span></div>`
+        : '';
+    const revision = crypto.createHash('sha256').update(JSON.stringify(input)).digest('hex');
+    const steps = phase === 'failed' ? '' : `<ol class="steps" aria-label="${zh ? '上传步骤' : 'Upload steps'}">${copy.steps.map((label, i) => `<li class="step ${done || i < step ? 'done' : active && i === step ? 'active' : ''}"${!done && active && i === step ? ' aria-current="step"' : ''}><span class="step-number">${done || i < step ? checkIcon : active && i === step ? '<span class="swirl" aria-hidden="true"></span>' : i + 1}</span>${label}</li>`).join('')}</ol>`;
     return `<!doctype html><html lang="${zh ? 'zh-CN' : 'en'}"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>${escape(title)} · ${escape(input.title)}</title><style>${vibePageStyles}</style><script src="?updates" defer></script></head>
-<body><main class="shell" data-phase="${phase}"${uploadedBinding ? ' data-uploaded-binding="true"' : ''}>${input.simulation ? `<p class="mock-badge">${copy.mock}</p>` : ''}
-<section class="card" aria-labelledby="page-title">${phase === 'failed' ? '' : `<ol class="steps" aria-label="${zh ? '上传步骤' : 'Upload steps'}">${copy.steps.map((label, i) => `<li class="step ${done || i < step ? 'done' : i === step ? 'active' : ''}"${!done && i === step ? ' aria-current="step"' : ''}><span class="step-number">${done || i < step ? checkIcon : i + 1}</span>${label}</li>`).join('')}</ol>`}
-<div class="heading"${uploadedBinding ? ` data-upload-title="${escape(uploadSuccessTitle)}" data-upload-subtitle="${escape(uploadSuccessSubtitle)}"` : ''}><h1 id="page-title">${title}</h1><p class="subtitle" role="status">${subtitle}</p></div>${game}${phase === 'binding' || uploadedBinding ? `<p class="scan-action">${copy.bindingAction}</p>` : ''}${content}${uploadedBinding ? `<p class="scan-hint">${zh ? '这是本次上传的原绑定二维码，无需重复上传。' : 'This is the original binding QR for this upload. No need to upload again.'}</p>` : ''}
+<body><main class="shell${bindingQr || pendingQr ? ' dual-qr' : ''}" data-phase="${phase}" data-rev="${revision}"${uploaded ? ' data-uploaded="true"' : ''}>${input.simulation ? `<p class="mock-badge">${copy.mock}</p>` : ''}
+<section class="card" aria-labelledby="page-title">
+<div class="heading"${uploaded ? ` data-upload-title="${escape(uploadSuccessTitle)}" data-upload-subtitle="${escape(uploadSuccessSubtitle)}"` : ''}><h1 id="page-title">${title}</h1><p class="subtitle" role="status">${subtitle}</p>${previewLoading}</div>${game}${steps}${phase === 'binding' && (input.web || input.hybrid) ? `<p class="scan-action">${copy.bindingAction}</p>` : ''}${content}<p class="scan-hint">${uploadedBinding ? (zh ? '可扫码查看进度信息，无需重复上传。' : 'Scan to view app details. No need to upload again.') : ''}</p>
 </section>
 ${input.simulation ? `<p class="footer"><span class="dot" aria-hidden="true"></span>${copy.mockNote}</p>` : ''}</main></body></html>`;
 }
+// Follow the reader's preferred browser language, as in the Tool skill.
+function browserPageLanguage(header) {
+    const preferred = (header || '').split(',').map(part => {
+        const [tag, ...parameters] = part.trim().split(';');
+        const quality = parameters.find(value => /^\s*q=/i.test(value));
+        const q = quality ? Number(quality.split('=')[1]) : 1;
+        return { tag: tag.toLowerCase(), q };
+    }).filter(item => item.tag && Number.isFinite(item.q) && item.q > 0 && item.q <= 1)
+        .sort((a, b) => b.q - a.q)[0];
+    return preferred?.tag.split('-')[0] === 'zh' ? 'zh-CN' : 'en-US';
+}
 async function createVibePageServer() {
     const route = `/${crypto.randomBytes(24).toString('hex')}`;
     let html = 'Starting…';
     let etag = '';
+    let variants = {};
     let landingUrl;
     const server = http.createServer((req, res) => {
         const address = server.address();
         const host = address && typeof address !== 'string' ? `127.0.0.1:${address.port}` : '';
         if (req.method === 'GET' && req.url === `${route}?updates` && req.headers.host === host) {
             res.writeHead(200, { 'Content-Type': 'text/javascript; charset=utf-8', 'Cache-Control': 'no-store', 'X-Content-Type-Options': 'nosniff' });
-            res.end(pageUpdates);
+            res.end(qrPreviewLoader + '\n' + pageUpdates);
             return;
         }
         if (req.url === `${route}/authorize` && req.headers.host === host &&
@@ -19563,19 +19883,23 @@ async function createVibePageServer() {
             res.writeHead(404).end();
             return;
         }
-        if (etag && req.headers['if-none-match'] === etag) {
-            res.writeHead(304, { 'ETag': etag, 'Cache-Control': 'no-store' }).end();
+        const localized = variants[browserPageLanguage(req.headers['accept-language'])];
+        const responseHtml = localized?.html ?? html;
+        const responseEtag = localized?.etag ?? etag;
+        if (responseEtag && req.headers['if-none-match'] === responseEtag) {
+            res.writeHead(304, { 'ETag': responseEtag, 'Cache-Control': 'no-store', 'Vary': 'Accept-Language' }).end();
             return;
         }
         res.writeHead(200, {
-            'ETag': etag,
+            'ETag': responseEtag,
+            'Vary': 'Accept-Language',
             'Content-Type': 'text/html; charset=utf-8',
             'Cache-Control': 'no-store',
             'Referrer-Policy': 'no-referrer',
             'X-Content-Type-Options': 'nosniff',
             'Content-Security-Policy': "default-src 'none'; img-src data:; style-src 'unsafe-inline'; script-src 'self'; connect-src 'self'; frame-ancestors 'none'",
         });
-        res.end(html);
+        res.end(responseHtml);
     });
     await new Promise((resolve, reject) => {
         server.once('error', reject);
@@ -19584,9 +19908,15 @@ async function createVibePageServer() {
     const address = server.address();
     return {
         url: `http://127.0.0.1:${address.port}${route}`,
-        update: (value, authorization) => {
+        update: (value, authorization, localizedHtml) => {
             html = value;
             etag = '"' + crypto.createHash('sha256').update(value).digest('hex') + '"';
+            variants = {};
+            for (const language of ['zh-CN', 'en-US']) {
+                const localized = localizedHtml?.[language];
+                if (typeof localized === 'string' && localized.length < VIBE_PAGE_HTML_LIMIT)
+                    variants[language] = { html: localized, etag: '"' + crypto.createHash('sha256').update(localized).digest('hex') + '"' };
+            }
             landingUrl = browserLandingUrl(authorization);
         },
         close: () => server.close(),
@@ -19599,24 +19929,34 @@ async function runVibePageWorker() {
     }
     const server = await createVibePageServer();
     const requestedTtl = Number(process.env.TTMG_VIBE_PAGE_TTL_MS);
-    const ttl = requestedTtl > 0 && requestedTtl <= 900000 ? requestedTtl : 900000;
-    const timer = setTimeout(() => {
+    const ttl = requestedTtl > 0 && requestedTtl <= 1800000 ? requestedTtl : 1800000;
+    let timer;
+    let closing = false;
+    const close = () => {
+        closing = true;
+        clearTimeout(timer);
         server.close();
         if (process.connected)
             process.disconnect();
-    }, ttl);
+    };
+    // The parent owns the operation deadline. Keep the page alive during polling,
+    // then start its retention window when the parent detaches (or exits).
+    const retain = () => {
+        if (!closing && !timer)
+            timer = setTimeout(close, ttl);
+    };
+    process.once('disconnect', retain);
+    if (!process.connected)
+        retain();
     process.on('message', (message) => {
         if (message?.type === 'render' &&
             typeof message.html === 'string' &&
             message.html.length < VIBE_PAGE_HTML_LIMIT) {
-            server.update(message.html, message.browserLandingUrl);
+            server.update(message.html, message.browserLandingUrl, message.localizedHtml);
             process.send?.({ type: 'rendered', id: message.id });
         }
         if (message?.type === 'close') {
-            clearTimeout(timer);
-            server.close();
-            if (process.connected)
-                process.disconnect();
+            close();
         }
     });
     process.send({ type: 'ready', url: server.url });
@@ -19654,11 +19994,15 @@ async function startVibePage() {
         return {
             url: ready.url,
             async update(input) {
-                const html = await renderVibePage(input);
+                const [zh, en] = await Promise.all([
+                    renderVibePage({ ...input, language: 'zh-CN' }),
+                    renderVibePage({ ...input, language: 'en-US' }),
+                ]);
+                const html = input.language === 'en-US' ? en : zh;
                 const current = ++id;
                 const ack = receive(m => m?.type === 'rendered' && m.id === current);
                 const landingUrl = input.phase === 'binding' ? browserLandingUrl(input.browserLandingUrl) : undefined;
-                child.send({ type: 'render', id: current, html, browserLandingUrl: landingUrl }, error => {
+                child.send({ type: 'render', id: current, html, localizedHtml: { 'zh-CN': zh, 'en-US': en }, browserLandingUrl: landingUrl }, error => {
                     if (error)
                         child.emit('error', error);
                 });
@@ -19682,6 +20026,7 @@ async function startVibePage() {
 
 // Source identity is project metadata, not a Skill input or a credential.
 function getVibeProjectId(options) {
+    const minisType = resolveMinisType(options.minisType);
     const root = path.resolve(options.package ? path.dirname(options.package) : options.dir || '.');
     const dir = path.join(root, '.ttmg');
     const file = path.join(dir, 'vibe-project.json');
@@ -19689,7 +20034,7 @@ function getVibeProjectId(options) {
         fs.mkdirSync(dir, { recursive: true });
         const id = crypto.randomUUID();
         try {
-            fs.writeFileSync(file, JSON.stringify({ schemaVersion: '1', sourceProjectId: id }) + '\n', { flag: 'wx', mode: 0o600 });
+            fs.writeFileSync(file, JSON.stringify({ schemaVersion: '1', sourceProjectId: id, minisType }) + '\n', { flag: 'wx', mode: 0o600 });
         }
         catch (error) {
             if (error.code !== 'EEXIST')
@@ -19700,9 +20045,13 @@ function getVibeProjectId(options) {
             typeof saved.sourceProjectId !== 'string' ||
             !/^[a-zA-Z0-9_-]{1,100}$/.test(saved.sourceProjectId))
             throw new Error();
+        if ((saved.minisType || 'MINI_GAME') !== minisType)
+            throw new VibeError('VIBE_PROJECT_TYPE_CONFLICT');
         return saved.sourceProjectId;
     }
-    catch {
+    catch (error) {
+        if (error instanceof VibeError)
+            throw error;
         throw new VibeError('VIBE_PROJECT_STATE_FAILED');
     }
 }
@@ -19790,6 +20139,7 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
     let page;
     let backend = deps.backend;
     let task;
+    let authorizationUrl;
     let detached = false;
     let progressUpdates = Promise.resolve();
     let ppeLane;
@@ -19833,6 +20183,10 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
     try {
         if (options.web)
             throw new VibeError('VIBE_WEB_DISABLED');
+        const minisType = resolveMinisType(options.minisType);
+        result.minisType = minisType;
+        if (minisType === 'MINI_TOOL')
+            result.inputRequirements = VIBE_TOOL_INPUT_REQUIREMENTS;
         // Real QR uploads use the release-owned PPE route.
         // Explicit test backends remain opt-in; real failures never fall back to them.
         if (!options.mock && !options.vibeApi && process.env.TTMG_VIBE_BACKEND) {
@@ -19873,7 +20227,7 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
             throw new VibeError('VIBE_BACKEND_OPTION_CONFLICT');
         if (options.pollInterval !== undefined)
             seconds(options.pollInterval, 1);
-        const timeoutMs = seconds(options.timeout, 300);
+        const timeoutMs = seconds(options.timeout, 1800);
         timeout = setTimeout(() => {
             timedOut = true;
             controller.abort();
@@ -19908,7 +20262,7 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
                 category: (input.appInfo || VIBE_PPE_DEFAULT_APP_INFO).category,
                 subcategory: (input.appInfo || VIBE_PPE_DEFAULT_APP_INFO).subcategory,
                 source: options.category !== undefined ? 'arguments' : options.appInfo !== undefined ? 'app-info' : 'defaults',
-                catalogVersion: GAME_CATEGORY_CATALOG_VERSION,
+                catalogVersion: minisType === 'MINI_TOOL' ? 'mini-tool-ppe-trial-2026-09-19' : GAME_CATEGORY_CATALOG_VERSION,
             },
             iconSizeBytes: input.icon.bytes.length,
             packageSizeBytes: input.code.bytes.length,
@@ -19920,6 +20274,7 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
             return result;
         const submittedInfo = input.appInfo || VIBE_PPE_DEFAULT_APP_INFO;
         pageMetadata = {
+            minisType,
             iconDataUrl: `data:${input.icon.contentType};base64,${input.icon.bytes.toString('base64')}`,
             description: submittedInfo.description,
             category: submittedInfo.category,
@@ -19937,10 +20292,10 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
             source_type: 1,
             source_project_id: sourceProjectId,
             task_idempotency_id: result.operationId,
-            minis_type: 'MINI_GAME',
+            minis_type: minisType,
         }, controller.signal);
         ensureActive();
-        const authorizationUrl = createAuthorizationScheme(task.landingUrl);
+        authorizationUrl = createAuthorizationScheme(task.landingUrl);
         const pollMs = seconds(options.pollInterval, task.pollIntervalSeconds);
         result = {
             ...result,
@@ -20019,6 +20374,8 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
             ...pageGame,
             language: getCurrentLanguage(),
             phase: 'uploading',
+            qrUrl: result.simulation ? undefined : authorizationUrl,
+            purpose: result.simulation ? undefined : 'authorization_binding',
             simulation: result.simulation,
             message: text('uploading', result.simulation),
         });
@@ -20057,6 +20414,8 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
                             ...pageGame,
                             language: getCurrentLanguage(),
                             phase: 'uploading',
+                            qrUrl: result.simulation ? undefined : authorizationUrl,
+                            purpose: result.simulation ? undefined : 'authorization_binding',
                             simulation: result.simulation,
                             message: text('uploading', result.simulation),
                             progressPercent: percent(loaded, validTotal),
@@ -20104,17 +20463,20 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
             ...pageGame,
             language: getCurrentLanguage(),
             phase: result.previewReady ? 'preview' : 'complete',
-            qrUrl: result.simulation ? undefined : authorizationUrl,
-            purpose: result.simulation ? undefined : 'authorization_binding',
+            qrUrl: result.simulation ? undefined : result.previewUrl || authorizationUrl,
+            bindingQrUrl: result.previewReady ? authorizationUrl : undefined,
+            purpose: result.simulation ? undefined : result.previewReady
+                ? result.minisType === 'MINI_TOOL' ? 'tool_preview' : 'game_preview'
+                : 'authorization_binding',
             simulation: result.simulation,
             message: text('uploaded', result.simulation),
         });
         page.detach();
         detached = true;
         return emit('uploaded', { terminal: true, nextAction: result.previewReady ? 'scan_qr' : 'none',
-            qrPurpose: result.previewReady ? 'authorization_binding' : undefined,
+            qrPurpose: result.previewReady ? result.minisType === 'MINI_TOOL' ? 'tool_preview' : 'game_preview' : undefined,
             ...(result.previewReady ? { message: getCurrentLanguage() === 'zh-CN'
-                    ? '上传完成。原绑定二维码已保留，可使用 TikTok 再次扫码打开绑定页面。' : 'Upload complete. The original binding QR is available to reopen the binding page with TikTok.' } : {}) });
+                    ? '预览已就绪，请使用 TikTok 扫描预览二维码；也可扫描“查看进度”二维码查看应用信息并提交审核。' : 'Preview ready. Scan the preview QR with TikTok, or scan the progress QR to view app details and submit for review.' } : {}) });
     }
     catch (error) {
         const code = timedOut
@@ -20132,6 +20494,9 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
         const messages = {
             VIBE_CATEGORY_PAIR_REQUIRED: ['--category 和 --subcategory 必须同时提供；均不传时保留默认分类。使用 ttmg game categories --format json 查询。', 'Provide --category and --subcategory together, or omit both to keep the default. Query ttmg game categories --format json.'],
             VIBE_INVALID_CATEGORY: ['类型或子类型无效，或两者不匹配。使用 ttmg game categories --format json 查询有效组合。', 'Invalid category/subcategory pair. Query valid values with ttmg game categories --format json.'],
+            VIBE_INVALID_MINIS_TYPE: ['应用类型须为 MINI_GAME 或 MINI_TOOL。', 'Minis type must be MINI_GAME or MINI_TOOL.'],
+            VIBE_TOOL_TRIAL_METADATA: ['本地 Tool 试用固定使用效率办公类、US 和 SDK 1.0.0；暂不接受分类或 app-info 覆盖。', 'The local Tool trial uses Efficiency & Office, US and SDK 1.0.0; category and app-info overrides are not supported yet.'],
+            VIBE_PROJECT_TYPE_CONFLICT: ['该工程已使用其他应用类型，请为新的 Tool 使用独立工程目录。', 'This project has a different Minis type. Use a separate project directory for a new Tool.'],
             VIBE_INVALID_DESCRIPTION: ['描述必须是非空的有效 Unicode 文本；省略 --description 可使用默认描述。', 'Description must be non-empty valid Unicode text; omit --description to use the default.'],
             VIBE_AUTH_DENIED: [
                 '已取消授权，本次未上传。',
@@ -20213,7 +20578,7 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
                 text(status);
         controller.abort();
         await progressUpdates;
-        // Remove the binding QR on failure too. Keep a readable terminal result page.
+        // After upload, preserve the original code for checking progress even if preview lookup stops.
         if (page && (code !== 'VIBE_CANCELLED' || result.uploaded)) {
             try {
                 await page.update({
@@ -20223,10 +20588,19 @@ async function executeVibeUpload(options, onEvent = () => { }, dependencies = {}
                     simulation: result.simulation,
                     hybrid: result.backend === 'ppe-mock',
                     phase: result.uploaded ? 'complete' : 'failed',
+                    qrUrl: result.uploaded && !result.simulation ? authorizationUrl : undefined,
+                    purpose: result.uploaded && !result.simulation ? 'authorization_binding' : undefined,
+                    localizedMessages: result.uploaded && !result.simulation ? {
+                        'zh-CN': '代码包已上传，本页已停止等待预览。可扫码查看进度，无需重复上传。',
+                        'en-US': 'Package uploaded. This page has stopped waiting for the preview. Scan to check progress; no need to upload again.',
+                    } : {
+                        'zh-CN': messages[code]?.[0] || '本次操作未完成，请检查 CLI 输出。',
+                        'en-US': messages[code]?.[1] || 'This operation did not complete. Check the CLI output.',
+                    },
                     message: result.uploaded && !result.simulation
                         ? getCurrentLanguage() === 'zh-CN'
-                            ? '本次游戏代码包已上传完成，可在手机端查看预览版本并提交审核。'
-                            : 'Your game package has been uploaded. You can view the preview version and submit it for review on your phone.'
+                            ? '代码包已上传，本页已停止等待预览。可扫码查看进度，无需重复上传。'
+                            : 'Package uploaded. This page has stopped waiting for the preview. Scan to check progress; no need to upload again.'
                         : message,
                 });
                 page.detach();