reimagine-it

/reimagine-it

参考资料： references/notes.md · references/forms.md · references/webpage-craft.md （仅用于网页表单） · references/craft-floor.md （每个网页输出都必须满足的交互规范；每次运行都要阅读） · references/review.md （§5.d 指定对象准确性 + 克隆扫描；每次验证都要加载） · references/forms/ （非网页表单包：pdf、document、slides、universal） · references/domains/ （仅当用户提供了领域令牌时使用：artistic / dashboard / photography / cinematic（即 3d、webgl）/ ecommerce / landing / portfolio / infographic） · references/modifiers/ （仅当用户提供了修饰符时使用：glassmorphism / bento / neon / brutalism / neumorphism / handdrawn） · references/locks/ （通过 --ref <name> 加载） · references/research/web-craft-2025.md （深度资料包——Awwwards SOTY 技术栈扫描、Rauno/Emil 工艺标准、Lupi/Fragapane 数据人文主义、Feixen/Weingart/Troxler 印刷语法、Apple AIDA 电影感、view-transitions、滚动驱动动画、动态字体、声音、neubrutalism——阅读一次，并在报告中引用） · references/research/infographic-craft.md （15 个来源的信息图表资料包——Cleveland–McGill、Tufte、Bertin、ISOTYPE、Minard/Snow、Cairo、Lupi、FT Visual Vocabulary、USWDS、WCAG 图表、InfoAlign 布局——表单或领域为 infographic 时加载） · examples.md

/reimagine-it 是一个内容衍生设计引擎。已发布的产品读取 HTML 并输出 HTML：提取文件中已有的标题、事实、姓名、日期、数字、链接、电子邮件和颜色，然后使用 17 个令牌之一（或 --auto）生成独立页面。默认输出可离线使用。

不要声称 CLI 可以重新设计 PDF、PPTX、DOCX、MOBI 或“任何文件”。如果用户提供的是其他格式，请先将其转换或封装为 HTML，再运行引擎；之后只有在用户提出要求且工具链可用时，才使用宿主工具导出。应将这一步额外操作报告为宿主转换，而不是引擎功能。

如果此文件旁边存在 local.md，请在此技能之后读取它（宿主配置、组织、路径）。公开安装中没有 local.md。

只需说一次：“正在运行 /reimagine-it。”

引擎 — 运行 CLI；不要自行编造页面

已发布的产品是 CLI。/reimagine-it 是围绕它进行的编排，不是手工编写 HTML 的许可。

1. 如果源文件不是 HTML，请先将其封装或提取为 HTML。不要声称引擎读取了 PDF、PPTX 或 DOCX。
2. 运行对应命令，并使用它写入的文件：

npx reimagine-it --auto -i page.html -o redesign.html
npx reimagine-it -i page.html -t infographic -o poster.html
npx reimagine-it variations -i page.html -n 3 -o review/
npx reimagine-it extract -i page.html
npx reimagine-it audit redesign.html

CLI 以机械方式强制执行源文件保护：如果 --output 路径解析为源文件本身，则会以状态码 2 退出且不写入任何内容。传入 --no-clobber 还可拒绝替换现有输出文件——当 Agent 或 CI 循环不得覆盖已审阅的产物时，这很有用。自动模式还会在产物旁持有一个建议性运行锁，因此，第二个目标相同输出的 Agent 会快速失败，而不会交错写入；崩溃的运行会通过过期锁检测自动恢复，--force 则可覆盖此行为。

3. 打开该产物，并根据它进行报告。如果无法运行 npx reimagine-it，则交付 REIMAGINED: partial，并说明确切的阻碍——不要用模型编写的页面替代。

类别（由你选择 · Agent 决定）

可选令牌。可自由组合。 由你选择令牌；Agent 决定问题、表单（若未指定）、修改内容和延展方向。

类别	由你选择	由 Agent 决定
(无)	默认。不进行访谈。	推断、锁定、确定形式、构建。
自动 — auto / --auto	让工具管理常规的重新设计流程。	提取证据 → 排序连贯的形式 → 生成候选方案 → 验证 → 返回最佳产物。源内容保持只读。
interview	构建前先交流。	提出哪些问题、推荐哪些答案、何时停止。
形式类别 — code cli protocol demo prose product architecture experiment	强制使用该形式类别。	决定如何将笔记融入其中。
视觉形式 — svg 3js infographic canvas html webpage simulation	强制使用视觉形式。	在该媒介中精心制作。infographic 这个标记还会加载 references/domains/infographic.md（论证海报，而非仪表盘）。svg / 3js 标记默认启用 alive-micro（2–4 个与事实关联、起美化作用的循环；简短的 still 可冻结动画）。simulation 会基于此源内容中已有的事实，生成可交互游玩的模型——默认暂停在第一条事实；可检查嵌套的短片段；在侧栏中输入。这些都不是德克萨斯州风格；剩余词语只是一个视角。
宿主格式转换（非 CLI 标记） — pdf document slides	仅当用户提出要求且本地工具可用时。	转换/封装为 HTML → 运行引擎 → 可选导出（Weasyprint、python-docx、python-pptx）。CLI 不会读取或写入这些格式。
领域美学 — webpage 后的第二个词：artistic dashboard photography cinematic（3d、webgl）ecommerce landing portfolio infographic	强制使用网页美学风格。	加载 references/domains/.md，并扩展 webpage-craft 主干。cinematic 会将 3D 地面升级为内嵌 WebGL2。infographic 是统计海报（统一比例的编码 + ISOTYPE + 数据表）——不是运维仪表盘。
修饰风格 — 第三个词或 --style <name>：glassmorphism bento neon brutalism neumorphism handdrawn	在领域风格之上叠加 UI/UX 修饰风格。	加载 references/modifiers/.md；修饰风格可豁免对应的删减清单条目，并添加自身不可妥协的要求。
字体覆盖 — --font "Family, Fallback, generic"	指定展示字体 / 正文字体系列。	构建完整字体栈；若读者的设备上没有该字体系列，则优雅降级。除非同时传入 --allow-fetch，否则绝不在运行时获取网络字体。
声音 — --sound [tier]（ambient / feedback / full，默认 feedback）	为本次运行启用声音设计。默认关闭。	加载 Howler.js 精灵包；遵守耳标音层级（§ craft-floor #7）；提供可见的静音 + 音量控件；绝不自动播放；为每个提示音提供视觉替代方案。若缺少其中任何一项，则降级为 partial。
锁定 / 复用 — lock <path> [as <name>] · --ref <name> · --list-refs	将已交付的输出保存为可复用参考，或应用已有参考。	将配色 + 字体栈 + 母题 + 动效 + 3D 特征提取到 references/locks/.md；使用 --ref 时，像加载领域配置一样加载该配置包。
--notes	显示四条笔记。	决定是哪四条。
--plan-only	不生成文件。	锁定 + 笔记 + 形式 + 延展。
--full	主视觉之后再进行一次额外的增强迭代。	执行一项服务于创意的改动，然后交付。
--variants N	根据同一份需求生成 N 个不同输出，而非一个。	选择 N 种不同的打破常规方式；写入 .../var-1/、.../var-2/、……
--seed <n>	固定创意变化的采样，使两次运行产生相同的结果。默认每次运行都重新采样。	使用种子，在每个变化维度中确定性地选取一个选项。
--variant a|b|c|...	命名种子的简写（a = 第一个规范结果，b = 第二个，……）。	复现某个特定的已交付结果；适用于锁定（--variant b --lock）。
<brief>	已知标记之外的任何剩余词语。开放词汇，不是主题目录。	将其视为关于语域、底色、母题、图案、字体、动效的创意视角。仍需探查上下文；需求描述不能替代源内容中的事实。
审计 — audit	对 HTML 文件运行确定性质量检查。	运行 npx reimagine-it audit — 使用 19 项检查（src/audit.js），涵盖排版、配色、动效、内容、结构和性能，不需要大模型或 API 密钥。Python scripts/audit.py 是 CI 对应版本。必须确保零项失败。支持 --verbose 和 --json。
自由组合。已知的形式、领域或修饰词标记会加载对应资源包。其他所有词都会保留并纳入后续处理。没有允许保留词列表。

/reimagine-it auto
/reimagine-it webpage cinematic

/reimagine-it webpage infographic
/reimagine-it infographic
/reimagine-it infographic <any leftover words>
/reimagine-it svg
/reimagine-it audit
/reimagine-it 3js
/reimagine-it simulation
/reimagine-it webpage artistic glassmorphism --font "Playfair Display, serif"
/reimagine-it lock gold/domains/cinematic/after.html as house-cinema
/reimagine-it webpage --ref house-cinema
/reimagine-it webpage bento --variants 3

除非他们选择了 interview，否则不进行访谈。 不要在未获提示时盘问。不要问“你想要什么风格？”——访谈模式下也不行。

每种模式都必须交付一个成品（除非使用 --plan-only）。列出一堆氛围感不是交付成果。

硬性约定

1. 阅读此文件。加载 references/notes.md 和 references/forms.md。
2. 探查上下文。仅在选择了 interview 时进行访谈。
3. 指出相邻可能性：这里已有的备用部件 + 一个他们没有要求的组合。
4. 私下挑选四条笔记（设备 · 跃迁 · 工艺 · 效果）。用具体改动作答，而非情绪词。
5. 选定一个主形式。使用 CLI 生成该形式（-t 或 --auto）。不要手动编写替代页面。
6. 指出他们不知道可行的一项突破尝试。如果成本低，就把它做出来；否则给出准确的下一条命令。
7. 按 notes.md 中的清单剔除内容。不要说“哇”。不要写提示词套话。不要做成 B-roll 上的 TED 演讲。
8. 付费限制：代码、SVG、HTML、PDF、docx、pptx、本地演示均免费。调用计费的图像／视频／模型 API 前先征求同意。
9. 未经要求，不要提交或推送。
10. 报告：REIMAGINED: shipped | partial | blocked。

流程

REIMAGINED Progress:
- [ ] 0. Mode + categories parsed (leftover words kept as brief) + context sniffed
- [ ] 0.5. Interview only if that category was chosen
- [ ] 0.75. Adjacent possible named (private)
- [ ] 0.85. Anchor list — extract 3–5 concrete nouns/proper nouns/dates/verbs from the source; every plate must map back
- [ ] 1. Four notes chosen (private)
- [ ] 2. Hero form routed (unless user forced one)
- [ ] 2.4. Variation sample picked (avoid previous draw; pin if --seed / --variant)
- [ ] 2.5. Modifiers / font override / --ref loaded if present
- [ ] 2.6. Output is standalone HTML (host conversion only if the user asked and the toolchain exists)
- [ ] 2.7. Craft floor loaded (references/craft-floor.md) — every rule enforceable before render
- [ ] 3. Hero artifact written (or N variants if --variants)
- [ ] 4. Stretch named (and built if cheap)
- [ ] 4.5. --full plus-pass if requested
- [ ] 5. Verify with evidence (functional + visual + craft-floor scan)
- [ ] 6. Report REIMAGINED: shipped | partial | blocked

自动模式 — 自动设计循环

auto 是面向用户的自然语言调用方式：用户提供上下文，而不是一串命令。根据源内容推断最佳形式，生成最多三个连贯的候选方向，执行工艺底线检查，然后返回最有力的独立成品，以及所选标记、种子、依据和被舍弃的候选项。绝不覆盖源文件。绝不编造事实。如果宿主环境可以渲染预览，就展示选定成品，并提供其他方案供比较。

Auto 刻意不绑定任何模型。Agent 宿主可以将返回的计划作为结构化上下文，委派子 Agent 进行视觉审查，或提供特定模型的渲染器。即使没有 API 密钥，核心引擎仍然确定且安全。--auto 是明确的 CLI 等效调用；单独使用 /reimagine-it 仍会运行完整的推断工作流。

0. 解析标记（开放式需求说明——不要删词）

此技能是一个创意引擎。用户可以在 /reimagine-it 后输入任何内容。不要要求必须匹配某个资源包。不要把未知词自动更正为已列出的领域。不要问“你想要什么风格？”

1. 按空白字符拆分。读取标记及其参数（--seed、--style、--font、--ref、--variants、--sound、--notes、--plan-only、--full、--variant、--allow-fetch、--ask-format、--list-refs）。将 lock … as … 作为独立命令处理。
2. 将其余词中完全匹配已知形式、领域（包括 3d／webgl）或修饰词的词分类。
3. 按顺序将所有剩余词连接起来，作为需求说明。需求说明可以为空。多词需求说明正是此设计的用意。
4. 已知修饰词仍会加载其资源包（neon、handdrawn 等）。它周围的剩余词仍保留在需求说明中。

需求说明是一个观察视角，不是新增内容，也不是封闭的主题列表。将它应用于背景、主题元素、图案、字体和动态效果。源内容中的事实仍是源内容中的事实。在报告的 Brief: 行中记录它（或记录 none）。

0. 探查上下文（不要跳过）

并行、快速地检查：

• 工作区根目录、README，以及存在时的 GOAL.md（读取；不要覆盖）
• 如果是代码库，运行 git status -sb
• 已打开／最近查看过的文件（如果可知）
• 用户在斜杠命令后的文本
• 仓库已指向的领域文件（CONTRIBUTING、协议文档、失败的测试）
• 用户指定的目标文件（优先使用 .html；如果指定的是 PDF／PPTX／DOCX，在调用引擎前先将其包装或提取为 HTML）

用一句话明确：这是什么，以及会给他们带来什么。

如果上下文为空（空白聊天、空文件夹）且没有 interview：仍然交付。根据文件夹名称和任何 README 进行创作。不要因缺少需求说明而停滞。

0.5 访谈类别（未选择时跳过）

仅当他们通过了 interview 时才进行。由你选择类别；由 Agent 决定问题。

• 探查后，只询问上下文无法回答的问题。
• 一次只问一个问题。 等待回答。一次问多个问题会让人不知所措。
• 每个问题都附带一个推荐答案。对方可以接受、替换，或说 just go 跳过剩余问题并开始构建。
• 问题来自笔记库（设备 / 飞跃 / 工艺 / 效果），而不是“想要什么风格”或“有什么偏好吗？”
• 如果代码库能给出答案，就用 Read/Grep，而不是提问。
• 最多问 4 个问题，然后开始构建。不要让访谈环节没完没了。

0.75 相邻可能（私密）

从此仓库或讨论中已有的部分，找出一种尚未使用的组合。这就是飞跃候选。不要罗列情绪板。

选择一个 SCAMPER 字母作为变异方式（替代、组合、调整、修改、另作他用、消除、反转）。不要在聊天中把七种方式全部用一遍。

0.85 锚点列表（私密，但每个版面都必须对应至少一个锚点）

从源内容中提取3–5 个具体锚点：专有名词（人物、地点、品牌）、日期、数字、动作动词、实体物件、引用短语。这些是设计必须服务的内容单元。

输出中的每个版面、卡片、区块、图表或主视觉单元都必须对应至少一个锚点。如果没有对应锚点，就删掉它——不要用 blank、sample 这样的词或替代文本占位来填充占位卡片（参见禁止事项）。

私下记录锚点 → 版面的映射（或记在本地台账中）。在报告的 Anchors: 行中列出，让用户看到设计没有偏离源内容。

示例——德克萨斯笔记源：锚点 = {Jordan Rivers、Big Bend、1836、Post Office、west Texas sunset}。将 C 的着色器主视觉对应日落；活字印刷卡片 #01 对应 1836；地图版面对应 Big Bend；说明文字对应 Rivers；引导语对应 Post Office。每个单元都服务于一个锚点。

1. 四则笔记（私密）

从 references/notes.md 中选取：一则设备、一则飞跃（辽阔感与接纳、道德之美、宏大理念与渺小自我）、一则工艺、一则效果。变异方案要指明具体的删减、版面、吸引点、隐藏的标题、首轮节拍、API 形态或演示，而不是“电影感”。

不要在聊天中罗列整个笔记库。

2. 表单路由器

除非某个类别强制指定表单系列，否则请遵循 references/forms.md。

网页 / HTML / 信息图 → 编写文件前，先加载 references/webpage-craft.md。如果用户添加了领域（第二个词），还要加载 references/domains/ 中匹配的套件。标记 infographic——无论是视觉表单还是领域——都必须加载 references/domains/infographic.md 和 references/research/infographic-craft.md。绘制标记前，先根据此来源锁定结构（列表 / 序列 / 层级 / 对比 / 数值 / 关系）。如果用户添加了修饰词（第三个词或 --style），还要加载 references/modifiers/ 中匹配的套件。其余词语属于简述（步骤 0）——请遵循；不要求提供套件文件。如果用户传入了 --ref <name>，请加载 references/locks/ 中的 references/locks/.md 来替代领域套件，或与领域套件一起加载——将锁定配置视为领域套件。

SVG → 加载 references/forms/svg.md。标记放在场地中，文字放在边栏。路径上不放标签。**Alive-micro 默认设置：**标记上有 2–4 个循环（weenie-breathe + 一个事实循环 + 悬停配对）。简述中的 still / no-motion / print 会冻结循环。其余词语是观察视角。不要将 Texas gold weenie 克隆到其他来源上。

3js → 加载 references/forms/3js.md。保留 HUD 条带。轮廓取自此来源。不是基础图元演示。**Alive-micro 默认设置：**让 2–3 个网格保持空闲动态（weenie-turn、沿来源曲线流动、sun-breath），并加入镜头缓动 / wide-drift。简述中的 still 会固定镜头并冻结网格。其余词语是观察视角。不要将 Texas gold room 克隆到其他来源上。

simulation → 加载 references/forms/simulation.md。为此来源的序列创建可交互模型（年份、天数、握手步骤——该来源计量的任何内容）。文字放在边栏。标记放在场地中。可检查嵌套的短时段。默认暂停在第一个事实处。其余词语是观察视角。不要将 Texas 1836–1995 clock 克隆到其他来源上。

PDF / 文档 / 幻灯片 → 仅使用宿主转换。优先选择：提取或封装为 HTML，运行 npx reimagine-it，交付 HTML。只有当用户明确要求该格式且机器上有 Weasyprint / python-docx / python-pptx 等工具时，才加载 references/forms/。不要将这些套件作为 CLI 标记提供。

任何网页输出——无论是否带有领域 / 修饰词 / 锁定配置——都必须包含主视觉级内嵌 SVG，且能发挥实际作用；任意时刻有三个动态元素；并且静止画面中也能看出 3D 效果（旋转角度 ≥ 12° + 阴影模糊 ≥ 24px，或 translateZ ≥ 30px + 真实阴影，或内嵌 WebGL2）。如果截图无法证明以上三点，就说明这种表单还不够格。**例外——infographic：**海报保持正交投影（仅纸张投影阴影；画板上不得使用 rotateX）。

非 HTML 导出——可选，绝不能默认声称。如果用户要求 PDF/PPTX/DOCX 且工具链可用，请遵循对应的表单套件。否则交付 HTML，并说明缺少的工具。

表单随跃迁而定：

• 此代码库中的功能 → 在此处实现（另附一个小型验证：测试、CLI 或失败演示）。
• 展示类工具（信息图、weenie、画布、说明性 HTML、一次性演示文稿 / PDF）→ <workspace>/reimagined/<yyyy-mm-dd>-<slug>/。
• 绝不要把产品功能藏在 reimagined/ 中，当作纪念品。

2.4 创意变化（绝不重复）

除非调用方使用 --seed <n> 固定种子（或选择命名的 --variant），否则 /reimagine-it 对同一来源不得两次返回相同输出。每次全新运行都会沿着以下维度抽取一种新组合，让相同的简述产出真正多样的结果，而不是千篇一律的“官方”答案：

维度	选项（由 Agent 选择；内容会缩小选项范围）
读者语域	整个页面采用的表达视角——决定节奏、语气，以及其他维度的组合方式。dashboard-live（Bloomberg / 产品页面式节奏）、editorial-drift（杂志专题，刻意留白）、field-guide-quiet（Colossal / Feixen 式沉静自信）、cinematic-shader（Cartier / Lando Norris——全屏着色器主视觉，可选声音）、neubrutalist-blunt（粗边框、硬阴影、高饱和配色、不使用渐变）、poster-jazz-improv（Troxler——字号统一、非从左到右阅读、高度不对称）、data-humanist（Lupi / Fragapane——身份就是数据，根据源内容定制视觉字母表）。
底色 / 配色权重	从内容推导出的调色板通常包含约 4 种色相（例如：Texas 笔记本 → 藏青 · 奶油色 · 红色 · 金色）。每次生成都会为底色选择一种不同的主色相：deep-night（藏青底色，暖色点缀）、parchment（奶油色底色，红色点缀）、void（近黑底色，单色相点缀）、raw-paper（灰白底色，墨色点缀）、field-blue（中蓝底色，奶油色点缀）、shader-glow（全屏动态渐变 / 着色器作为底色，上方叠加墨色内容）。
主视觉设计	kpi-skyline、illustrated-map、kinetic-type-headline、inline-shader-hero（基于滚动驱动 uniform 的 WebGL2 全屏效果）、oversized-numeral、letterpress-plate、photograph-strip、weenie-object、variable-font-morph-hero（滚动驱动的 wght/wdth 轴脉冲；预留字距缓冲区）、sticky-evidence-pin（BBC-Lost-Tablet 模式——叙事滚动时，文物保持固定）、oversized-quote-with-drop-cap、priestley-timeline（日期采用统一年份刻度）、isotype-unit-count（N 个相同尺寸的象形图副本）、portrait-grid-poster（主视觉编码 + 辅助网格）。
信息图结构（当形式或领域为 infographic 时）	先判断此来源（AntV 风格路由器，而非其模板）：list（无序同类项）、sequence（步骤 / 带日期的事件）、hierarchy（树形结构）、compare（两个或更多组）、values（数量级）、relation（来源实际提及的节点 + 边）。然后选择 InfoAlign 布局：grid、star、portrait、landscape、portrait-grid、spiral（只有隐喻是螺旋时才选 spiral）。Gold Texas 是 portrait-grid 上的 sequence + compare；gold Jules 是锥体周围的 sequence + star。不要默认选择其中任何一种。
图版风格	对于包含 3 个项目的版块：dashboard-tile、editorial-dropcap、letterpress-card（带编号和印章）、line-art-token、photograph-plate、bento-cell、index-card-stack、custom-data-glyph（Fragapane 风格的有机标记，由数据点衍生——叶片、编织纹、蛇形等，依内容而定）、poster-tile-one-size（Troxler——所有信息字号统一，仅靠构图体现层级）。
动效预算	dashboard-live（计数器 + 脉冲）、editorial-drift（花瓣 / 尘埃 / 纸张）、kinetic-type-sway（标题摇摆）、shader-loop（全屏着色器）、still-with-one-loop（一个动画元素）、no-motion、scroll-driven-axis-morph（可变字体 wght/wdth 绑定到 animation-timeline: scroll(root)）、sticky-highlight-reveal（BBC / Pudding——固定证据并以情境线条照亮）、view-transition-morph（多页面套件使用 @view-transition { navigation: auto; }——原生交叉淡化，无需 JS）。**当主视觉形式为 svg 或 3js 时：**强制使用 alive-micro（2–4 个与事实相关的循环 + 悬停配对），除非需求说明 still / no-motion / print。**当主视觉形式为 simulation 时：**动效就是时钟（先按天，再按年）；默认暂停在第一年；不要将网页动效套用到模拟上。不要将仅用于网页的动效（shader-loop、view-transition-morph）套用到 weenie、Three.js 场景或时钟上。
字体点缀	sans+mono、serif+italic、small-caps、mixed-italic、display-cut（超大字号切分）、blackletter+grotesk、custom-display+workhorse-sans（M/M Paris 模式——一种定制展示字体 + 一种中性无衬线正文字体——例如 Editorial New + Neue Montreal，或 Söhne + Signifier 等）、variable-single-family（一个可变字体系列，通过三个轴承担层级表达——GT Standard / Recursive）。
3D 标志性效果	card-fan（rotateY ±14°）、letterpress-deboss（内阴影）、floating-hero（translateZ 40px）、depth-strata（三个 z 轴图层）、parallax-scroll、no-3D-just-shadow、matcap-hero（Bruno Simon 技法——在真实 Three.js 网格上使用 matcap 纹理，以零光照计算实现逼真的假阴影）、alcove-scenes（Cartier——若干各自独立的 3D 场景，每个场景对应一个版块；隐藏的手势会带来探索惊喜）。
规则：

1. 绝不重复上一轮抽取的完全相同组合。 在会话期间将其记录在内存或本地账本中。
2. 内容会缩小选择范围——印刷版实地指南不要选 card-fan，WebGL 电影级作品不要选 letterpress-deboss。内容决定哪个子空间合乎逻辑；变化发生在其中。剩余需求可以重新调整该子空间的权重（背景、图案、字体、动效），但不能添加事实。
3. 读者语域决定内容是否协调。 选定语域后，其他轴必须符合其语法。cinematic-shader 语域需要 inline-shader-hero + shader-loop 动效 + matcap-hero 或 alcove-scenes 3D；poster-jazz-improv 语域需要 poster-tile-one-size 版面 + no-3D-just-shadow + 高度不对称。不要拼凑不兼容的轴。svg / 3js 形式忽略网页动效样例——它们使用形式包中的 alive-micro。simulation 也会忽略它们——它使用 forms/simulation.md 中的时钟。
4. --seed <n> 固定样例，实现确定性生成。 给定相同的源内容和相同的种子，输出必须逐字节等同，以便用户在锁定或 PR 中复现特定抽取结果。
5. --variant a / --variant b / … 是命名种子。a 是第一个规范抽取结果，b 是第二个，依此类推。当黄金示例包展示了这些差异时，将它们分别保存为 after.html、after-2.html、after-3.html。
6. 在报告的 Draw: 行中显示样例，让用户知道选中了哪个组合（例如 Draw: cinematic-shader · shader-glow · inline-shader-hero · custom-data-glyph · scroll-driven-axis-morph · variable-single-family · matcap-hero）。

黄金示例演示（gold/webpage/）：抽取 A after.html（dashboard-live · deep-night），抽取 B after-2.html（editorial-drift · parchment），抽取 C after-3.html（cinematic-shader · shader-glow——v2.2 研究所树立的更高标准）。twins.png 一眼即可展示其范围。

黄金信息图（gold/domains/infographic/after.html，v2.3）：仅有一个 Texas 笔记本抽取结果。实时运行需从此源内容（以及剩余需求）中推导出配色、图案、字形和构图。将该黄金示例的场景或海报装饰复制到不同源内容上，即为失败。

黄金 Jules（gold/jules/）：仅有一个客厅抽取结果。默认网页应是你步入的客厅（铺满画面的柜台 + 蛋筒），而非一张文具便签。艺术风格应描绘这家店的材料（而非黄金示例中的奶油色 / 珊瑚色正弦波）。摄影内容应是大理石 / 冰柜 / 外带窗口的静物（而非 VOL/ISSUE 活页册的克隆）。信息图应以蛋筒为中心呈星形。SVG 应采用层叠冰淇淋球。3js 摄像机位于柜台上。Simulation 应展示口味牌。证明第二个源内容不应看起来像第一个。

黄金形式（gold/forms/）：每种形式仅有一个 Texas 笔记本抽取结果。实时运行 svg / 3js / simulation 时，需从此源内容中推导出小香肠、网格、时钟单位、地理位置、配色和构图。不要复用 weenie-left / schematic-center / gutter-right / timeline-bottom、The years run 或 All three 地点 HUD。

2.5 修饰项 · 字体 · 锁定（扩展套件）

• 修饰项具有叠加性，且可以组合。glassmorphism 免除主干规范中“模糊／glassmorphism 作为设计”的禁用项，并增加自身的硬性要求（玻璃背后要有真实纵深、面板分层、降低动态效果预算）。bento 会将分区网格重构为带名称的区块。修饰项可以叠加（artistic glassmorphism 是一种真实组合）；套件不得与主干规范在网格／调色板上限／单一视觉母题方面冲突。
• 字体覆盖（--font "..."）会替换展示字体或正文字体系列。构建完整的 CSS 字体栈，并提供合理的后备字体（衬线字体系列最后加上 serif，等宽字体系列最后加上 monospace）。绝不获取网页字体；如果用户需要网页字体，必须传入 --allow-fetch，并了解这会破坏离线承诺。
• 锁定：执行 /reimagine-it lock <path> [as <name>] 时，读取 <path>（HTML/CSS/JSON/PDF 元数据等），并提取调色板＋字体栈＋视觉母题＋动态效果＋3D 特征＋分区结构。将 references/locks/.md 写为完整套件。之后，/reimagine-it <target> --ref <name> 会将该套件作为领域加载，因此可以把相同的设计 DNA 应用于不同目标（或不同媒介——webpage 锁定文件可以为 slides 套件提供参考）。

2.6 输出格式——HTML 是引擎产物

CLI 和 Playground 始终交付独立 HTML。这是有效的产品声明。

1. **默认：**对 HTML 运行 npx reimagine-it（或 --auto），并写入 .html。不要凭空编造 PDF/PPTX/DOCX 版本。
2. **如果源文件不是 HTML：**先将其转换或封装为 HTML（把文本提取到简单页面中）。然后运行引擎。在报告的 Formats: 行中说明这一点。
3. 如果用户明确要求 PDF／slides／docx，且本地工具链可用，则在 HTML 产物生成后，遵循 references/forms/ 中对应的套件。如果缺少工具链，则交付 HTML 并明确指出后续要运行的命令——不要声称引擎生成了该格式。
4. --ask-format 仅用于可选的导出步骤，不用于决定引擎是否工作。默认仍为 HTML。

在报告的 Formats: 行中记录此决定（通常为 html）。

3. 构建

在一次性文件夹旁附上一个 5 行的 README.md：说明它是什么、如何运行／打开，以及由哪条笔记驱动。原地修改代码时，README 就是验证方法（测试或演示命令）。

主视觉匠心（任何形式）：

• 在首次接触时安排一个吸引点（小玩意、首次运行命令、第一句话、首次先失败再通过的演示、首个跨页、首张幻灯片）
• 使用当前上下文中的真实内容——不用 lorem，不伪造统计数据，不编造 API
• 效果先于方法：用户应该能说出发生了什么，而不只是你如何实现
• 等产物真正发挥作用后再揭示其标签

**拓展项（报告中必填）：**加入一项用户不知道可以纳入范围的内容。如果只需多一个文件或一个小型配套文件，就直接构建；否则提供确切的后续斜杠命令（/reimagine-it auto、/reimagine-it webpage cinematic、/reimagine-it lock <path>，……）。

4. --full 加强轮次

主视觉完成后：重新阅读并审视。应用一项加强建议（其中必须包含一个新动作）。不要重新开始。不要添加第二个产品。

4.5 --variants N（可选）

如果用户要求 N 个变体，就根据同一份需求简报生成 N 个不同的输出。每个变体都必须采用不同的打破常规手法（不能只是换个颜色的同一页面）。写入 <hero>/var-1/、<hero>/var-2/、……，并交付一张 strip.png 合成图，供用户挑选。

5. 验证（功能＋视觉）

分两轮。任一轮都不能跳过；否则最多只能算 partial，不能算 shipped。

5.a 功能轮——产物能够实现目标：

• 路径存在。以 Markdown 链接形式报告。
• 代码/命令行：实际运行过该命令或测试；贴出退出状态或证明性输出行。
• 文件视觉格式正确：SVG 中有 viewBox；HTML 可以打开；如果要求离线使用，则不依赖必需的 CDN；PDF 可以在查看器中打开；docx/pptx 可以在目标应用中打开；电子书（mobi/epub）可以在 Kindle Previewer / Calibre 中打开。
• 动效 / 3D：间隔 500 ms 的两张静帧呈现可见的像素变化；至少一个元素具有 ≥ 12° 的旋转角度和 ≥ 24 px 的阴影模糊半径，或使用内联 WebGL2。
• 文案：内容必须是用户可以保留的文件，而不只是聊天内容。
• 协议：必须是可供实现的规范，或可以运行的试验版本，不能只是比喻。

5.b 视觉验证——实际查看渲染结果。

将主视觉渲染为图像（HTML 用无头 Chrome 导出为宽度 ≥ 1400 px 的 PNG；PDF 导出首页 PNG；docx 先导出为 PDF，再转为 PNG；pptx 导出首张幻灯片 PNG；mobi/epub 在 Previewer 中打开并截取前两页）。阅读图像工具的结果（或在 IDE 查看器中打开），并在报告 shipped 前手动检查以下所有问题：

• 空白卡片 / 占位标签。 任何可见元素都不能直接显示 blank、placeholder、TBD、TODO、lorem、…、[…]、xxx、sample text、Title goes here、caption 或替代文本占位内容。如果某个区域没有来自源内容的实际内容，删除该区域——不要在卡片上写「blank」。
• 每张卡片都对应一个锚点。 对照第 0.85 步中的锚点列表，逐一核对所有可见单元。没有对应项的图块属于偏离内容——删除它们。
• 文字被裁切 / 重叠。 任何标签都不能被其他元素遮挡（例如，前景形状遮住文字，导致 POST OFFICE 显示成 POST O CE）。修复 z-index / 内边距 / overflow，或移动重叠元素。**SVG / 3js：**不得让标签叠在标记、网格或路径上；3js HUD 必须放在预留的条带中，不能堆叠在画布上。
• 图像损坏 / SVG 损坏。 图片应显示的位置不能出现 alt 文本；<svg> 不能渲染为空。
• 列溢出 / 主视觉被压扁。 任何内容都不能超出视口范围。主视觉不能被纵向压扁。
• 强调色超出调色板。 所有彩色元素都必须符合从内容提取的调色板。不能出现多余的 CSS 默认蓝色链接或浏览器默认的 <button> 样式。
• 内容错误。 渲染结果中的所有文案都必须确实出现在源内容中（或是此技能添加的图注/索引）。不得虚构地名、日期、统计数据或人物。
• 动效证明。 如果资源包声称含有动效（svg/3js 默认值为 alive-micro），请截取两帧（间隔约 600 ms）并比较哈希值；哈希值相同表示动效未运行。短暂的 still 除外。

5.c 工艺底线检查（仅限网页）——对生成的 HTML/CSS 执行 grep，确认符合 craft-floor 合约： 运行确定性审计： npx reimagine-it audit <output-file.html>（或 /reimagine-it audit）。该审计不使用 LLM 或 API 密钥，涵盖排版、调色板、动效、内容、结构和性能，共 19 项检查。Python scripts/audit.py 是 GitHub Action 的镜像实现，两者必须给出一致结果。必须通过所有失败项；警告仅供参考。支持在 CI 中使用 --verbose 和 --json。

• 焦点与选中：至少有一条 ::selection 规则；至少有一条 :focus-visible 规则；没有未提供真实替代样式的 outline: 0 / outline: none。
• 减少动态效果：存在 @media (prefers-reduced-motion: reduce) 块，且处理正确（关闭过渡效果、保持焦点指示器可见、保留必要的状态反馈）。
• 仅合成器动画：没有 @keyframes 或过渡效果为 top、left、right、bottom、width、height、margin、padding、font-size、letter-spacing、line-height、word-spacing、color 或 background-color 设置动画（最后两项仅在静态元素的 :hover 状态下允许）。滚动或交互期间的所有动画都只使用 transform、opacity 或 filter。
• 禁止 transition: all。 始终明确指定属性。
• 动态字体预留空间：任何可变字体轴变化，都必须在动画元素上设置 letter-spacing 缓冲值或 min-width 预留空间。
• 交互元素具有悬停与焦点状态（不能只有 :hover）。
• 默认关闭声音：如果未传入 --sound，则不能有 <audio autoplay>、Howler autoplay: true，也不能有未经明确用户操作就取消静音的 <video>。
• 自动模式的源文件安全：auto 只能读取和写入生成的产物／报告；除非用户明确要求编辑，否则不得修改源文件。

如果其中任何一项不符合要求，一次性修补 CSS；如果修复需要“新增整个子系统”，则降级为 partial，并指出具体未完成项。

5.d 命名对象与克隆检查 — 加载 references/review.md。如果源内容命名了一个公开对象（孤星旗、圆锥、压力机），那么 weenie 就是该对象，而不是金色星星／奶油条纹的混搭。第二个源内容不得使用德州金色基因或布局装饰。金色装饰检查：python scripts/review_gold.py。

在报告中记录验证结果：

• Visual verify: 写明检查内容和修复内容
• Craft floor: 写明 grep 检查结果（例如 ::selection ✓, :focus-visible ✓, prefers-reduced-motion ✓, compositor-only ✓, no transition:all ✓, sound off ✓）。

如果存在任何故障模式且无法一次性修复，则交付 partial 并指出具体错误——绝不要把占位内容包装成已完成。

6. 报告

REIMAGINED: shipped | partial | blocked
Mode: reimagine-it
About: <one sentence>
Hero: <path + how to run/open>
Domain / modifier / --ref: <if any>
Brief: <leftover phrase, or none>
Font stack: <if --font was passed>
Anchors: <3–5 nouns/proper nouns/dates from the source that every plate mapped back to>
Draw: <reader-register> · <ground> · <hero-move> · <plate-style> · <motion> · <type-accent> · <3D-signature>
      (svg / 3js: motion is `alive-micro` unless the brief was `still`)
Seed: <n if pinned, else "fresh">
Formats: <usually "html"; name any optional host export>
Sound: <off | ambient | feedback | full — with tier + mute-control + no-autoplay confirmed>
Stretch: <what they didn't know was possible>
Notes: <only if --notes>
Functional verify: <what you actually ran, opened, or checked>
Visual verify: <scan result: no blank plates? no clipped text? every plate maps to an anchor? palette on-source? named weenie is the real object (flag cloth is white star / white over red, not gold-on-parchment)? motion advanced? composition is this source's object, not gold's layout chrome?>
Craft floor: <::selection ✓, :focus-visible ✓, prefers-reduced-motion ✓, compositor-only motion ✓, no transition:all ✓, sound off unless --sound ✓>

面向用户的回复应以产物和扩展部分开头，而不是以流程开头。

禁止事项

• 交付项目符号列表，而不是成品
• 对同一来源返回相同的抽取结果两次，除非明确指定 --seed/--variant
• 丢弃用户留下的词语，只因为它们不是命名形式、领域或修饰词
• 将黄金 DNA 或黄金构图克隆到并非那本笔记本的来源上——不能照搬配色（Texas 羊皮纸色／海军蓝／星条红）、景物（Lone Star、Alamo 礼拜堂、1836–1995 地图时钟），也不能照搬布局装饰（00 · MASTHEAD 导轨、/reimagine-it infographic 引导语、左侧小插图／中间地图／右侧沟槽／底部时间线 SVG、The years run + All three HUD）。方法可以沿用，构图不行。
• 未经视觉验证（5.b）就报告 shipped——没有例外
• 绘制文字内容恰好为 blank、placeholder、TBD、TODO、lorem、sample、caption、…、[…]、Title goes here 或任何替代文本占位符的版面。 空槽位 → 删除槽位。只放真实内容。
• 交付文字被裁切或重叠的渲染结果（例如前景形状遮住标签的一半）。报告 shipped 前，修复 z-index／padding／overflow。
• 当 npx reimagine-it 可以运行时，手工编写重新设计的页面。 CLI 是引擎；技能是封装层。
• 声称 CLI 可以重新设计 PDF、PPTX、DOCX、MOBI 或“任何文件”。 输入 HTML，输出 HTML。宿主转换是额外选项，并非必需。
• 不要悄悄假装缺失的导出工具链已经运行。 如果用户要求 PDF/PPTX，但缺少相应工具，就交付 HTML，并说明下一条命令。
• 交付未达到工艺底线（§5.c）的网页输出。 以下各项必须全部满足：::selection 已设置样式、:focus-visible 已设置样式、prefers-reduced-motion 代码块存在且正确拆分、动效仅使用合成器属性、不使用 transition: all、不在没有真正替代样式的情况下使用 outline: 0，以及未传入 --sound 时不自动播放声音。一次性修复，或降级为 partial。
• 对任何在滚动或交互期间运行的内容，不要为 top／left／right／bottom／width／height／margin／padding／font-size／letter-spacing／line-height／word-spacing／color／background-color 添加动画。只使用 transform、opacity 或 filter——其他属性每帧都会触发布局重算，导致视觉验证失败。
• 使用 transition: all——始终明确指定属性。任何父级变化都会导致 all 反复触发布局。
• 交付使用了 outline: 0／outline: none，却没有可见焦点替代样式的页面——WCAG 2.4.7 是硬性要求。
• 绘制无法对应回步骤 0.85 中某个锚点的版面（即偏离并编造内容）。每个可见元素都必须服务于来源中的某个锚点，否则就删除。
• 将 /reimagine-it 当作纯图形工具
• 让 auto 覆盖来源，或隐藏所选方向
• 未使用 interview 类别就进行访谈
• 询问“你想要什么风格？”
• 使用 wow、“让它更吸睛”或以震撼为策略
• 未经询问就调用付费图像／视频 API
• 将 Dribbble / Collect UI 克隆作为创意
• 伪造书法或统计数据
• 编造来源中不存在的内容（虚构地名、捏造的统计数据、虚构人物）
• 未经请求就向无关仓库搭建全新应用
• 未使用 --allow-fetch 就获取网页字体
• 将锁文件保存到 references/locks/ 之外（或宿主配置的锁文件路径之外）