minimal-agent 0.9.0 → 0.10.0

package/skills/ui-design/tests/e2e/runs/solar-relay-iteration-1/prompt.md

@@ -0,0 +1,15 @@
+# 日冕中继首轮测试题
+
+使用 `Solar Relay / 日冕中继` VI，为一个原创中文网络加速与隐私连接工具设计官网首页 HTML。
+
+要求：
+
+- 主题是“光径加速器”：帮助移动用户在公共网络、跨区访问和拥挤线路中获得更快、更安全的连接。
+- 使用红橙主导、多彩弧带、轻快安全、移动互联网产品感。
+- 可以借鉴多彩网络加速产品的活力气质，但不能出现 `Cloudflare`、`WARP+`、`1.1.1.1` 或任何真实品牌内容。
+- 所有用户可见文案使用简体中文，必要技术缩写除外。
+- 包含首屏、连接状态卡、加速路径弧带、权益/套餐模块、安全说明和移动端模拟界面。
+- 包含 `data-screen-label="01 中文标题"`。
+- 包含唯一合法的 `EDITMODE` JSON block。
+- Tweaks 使用 `{ edits: patch }` 持久化，可调主红橙、彩带强度和界面活力等级。
+- 运行静态检查、语言检查和浏览器截图检查。

package/skills/ui-design/tests/e2e/runs/solar-relay-iteration-1/review.md

@@ -0,0 +1,59 @@
+# 日冕中继首轮端到端评审
+
+## 测试目标
+
+本轮验证第六个 VI 模板 `Solar Relay`，中文名“日冕中继”。目标是把“红橙、多彩弧带、网络加速、轻快安全、移动互联网产品感”转译成原创中文网络加速产品视觉系统，而不是复刻真实品牌或原广告样式。
+
+## 执行结果
+
+- 已新增 `references/vi-solar-relay.md`。
+- 已更新 `SKILL.md` 的视觉模板库，加入日冕中继模板。
+- 已在 `evals/evals.json` 增加日冕中继测试题。
+- 已生成样张：`outputs/index.html`。
+
+## 自动检查
+
+- `quick_validate.py`：通过。
+- `check_ui_artifact.py`：通过，无阻断问题；提示低透明白色面板需复核可读性，截图确认文字仍清楚。
+- `check_language_policy.py`：通过，文档、提示词、评审和 HTML 均符合默认简体中文规则。
+- 浏览器渲染：通过，控制台错误为 0。
+- 响应式检查：桌面 1440px 和移动端 390px 均无横向溢出。
+- 按钮命中区域：桌面与移动端主按钮高度均为 46px，满足 44px 底线。
+
+## 视觉评审
+
+| 维度 | 分数 | 说明 |
+| --- | ---: | --- |
+| 指令对齐 | 9 | 红橙、多彩弧带、网络加速、隐私连接和移动端产品感都明确体现。 |
+| 原创边界 | 9 | 没有出现真实品牌名称、标识、图标轮廓、原广告结构或原 App 文案。 |
+| 配色控制 | 8 | 彩色强、记忆点足；移动端彩带接近上限，但主要文字仍清楚。 |
+| 信息结构 | 8 | 首屏、连接状态、指标、手机界面和功能卡形成完整产品叙事。 |
+| 中文排版 | 8 | 标题有冲击力，移动端断行自然；局部说明文字可在下一轮继续压缩。 |
+| 移动端 | 9 | 无溢出，按钮可点，手机展示区清楚，彩带没有遮挡核心行动。 |
+
+综合评分：8.5 / 10。
+
+方向成立：
+
+- 红橙、金黄、珊瑚和青蓝构成了明显的网络加速活力。
+- 彩色弧带用于表达流量路径和中继轨迹，而不是单纯装饰。
+- 主信息放在白底和深蓝移动端屏幕中，保证文字可读。
+- 青蓝状态与红橙主行动有层级区分。
+- 页面避免出现真实品牌内容，图标和移动端界面均为原创。
+
+## 已确认截图表现
+
+- 桌面首屏明快、有速度感，红橙与青蓝弧带形成强识别。
+- 移动端彩带较强，但没有压住标题、按钮、指标或手机屏幕。
+- 手机模拟界面是原创连接状态表达，没有复刻真实产品。
+- 权益、安全和路径模块有明确产品语义，不只是空泛营销卡片。
+
+## 初步结论
+
+日冕中继可以作为第六个 VI 模板进入模板库。它与 Aqua Glass 的区别在于：Aqua 强调浅色通透和玻璃层级，日冕中继强调红橙多彩路径和移动网络产品活力；与 Nebula Console 的区别在于：Nebula 是深色科技半透明，日冕中继是明亮消费级网络加速风格。
+
+下一轮可继续优化：
+
+- 为套餐/权益模块增加更真实的价格、流量或推荐机制，验证模板是否适合商业页。
+- 为 deck 场景做一次样张，测试大面积彩带在演示页中的可读性。
+- 如果用于更严肃的网络安全产品，可降低彩带强度，提高白底信息区比例。

package/skills/ui-design/tests/e2e/runs/verdant-grid-preview-1/outputs/index.html

@@ -0,0 +1,508 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>绿脉电网预览</title>
+  <style>
+    :root {
+      --ink: #111513;
+      --ink-soft: #27302b;
+      --muted: #5f6b64;
+      --paper: #fbfdfb;
+      --paper-green: #eef8f1;
+      --surface: #ffffff;
+      --surface-soft: #f7fbf8;
+      --line: rgba(17, 21, 19, 0.10);
+      --line-green: rgba(0, 122, 61, 0.22);
+      --grid-green: #007a3d;
+      --energy-green: #0b9b55;
+      --leaf-green: #74c88a;
+      --pale-green: #dff3e5;
+      --blue: #1769d1;
+      --amber: #d99722;
+      --danger: #c93d3d;
+      --shadow: rgba(0, 122, 61, 0.12);
+      font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", Inter, sans-serif;
+      color: var(--ink);
+      background: var(--paper);
+    }
+
+    * { box-sizing: border-box; }
+
+    body {
+      margin: 0;
+      min-height: 100vh;
+      overflow-x: hidden;
+      background:
+        radial-gradient(circle at 76% 22%, rgba(116, 200, 138, 0.18), transparent 28%),
+        linear-gradient(135deg, #fbfdfb 0%, #f5fbf7 52%, #eef8f1 100%);
+    }
+
+    body::before {
+      content: "";
+      position: fixed;
+      inset: 0;
+      pointer-events: none;
+      background-image:
+        linear-gradient(rgba(0, 122, 61, 0.035) 1px, transparent 1px),
+        linear-gradient(90deg, rgba(0, 122, 61, 0.035) 1px, transparent 1px);
+      background-size: 54px 54px;
+      mask-image: linear-gradient(90deg, transparent, black 18%, black 82%, transparent);
+    }
+
+    .page {
+      position: relative;
+      width: min(1440px, 100%);
+      min-height: 100vh;
+      margin: 0 auto;
+      padding: 26px clamp(18px, 4vw, 64px) 56px;
+    }
+
+    .topbar {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 18px;
+      min-height: 66px;
+      padding-bottom: 18px;
+      border-bottom: 1px solid var(--line);
+    }
+
+    .brand {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+      font-weight: 850;
+      color: var(--ink);
+    }
+
+    .mark {
+      display: grid;
+      place-items: center;
+      width: 44px;
+      height: 44px;
+      border-radius: 13px;
+      color: #fff;
+      background:
+        linear-gradient(135deg, var(--grid-green), var(--energy-green)),
+        radial-gradient(circle at 70% 28%, rgba(255,255,255,0.7), transparent 20%);
+      box-shadow: 0 16px 34px var(--shadow);
+    }
+
+    .mark::before {
+      content: "";
+      width: 22px;
+      height: 22px;
+      border: 2px solid currentColor;
+      border-radius: 50%;
+      box-shadow: 0 0 0 6px rgba(255,255,255,0.16);
+    }
+
+    .nav {
+      display: flex;
+      align-items: center;
+      gap: 24px;
+      color: var(--ink-soft);
+      font-size: 14px;
+      font-weight: 720;
+    }
+
+    .nav .cta {
+      display: inline-flex;
+      align-items: center;
+      min-height: 44px;
+      padding: 0 18px;
+      border-radius: 999px;
+      color: #fff;
+      background: var(--grid-green);
+      box-shadow: 0 16px 32px var(--shadow);
+    }
+
+    .hero {
+      display: grid;
+      grid-template-columns: minmax(0, 0.9fr) minmax(440px, 1.1fr);
+      gap: clamp(26px, 5vw, 76px);
+      align-items: center;
+      padding: 54px 0 32px;
+    }
+
+    .eyebrow {
+      display: inline-flex;
+      align-items: center;
+      gap: 8px;
+      min-height: 34px;
+      padding: 0 12px;
+      border: 1px solid var(--line-green);
+      border-radius: 999px;
+      color: var(--grid-green);
+      background: rgba(223, 243, 229, 0.76);
+      font-size: 13px;
+      font-weight: 780;
+    }
+
+    h1 {
+      margin: 22px 0 18px;
+      max-width: 720px;
+      font-size: clamp(46px, 6vw, 76px);
+      line-height: 1.06;
+      letter-spacing: 0;
+      color: var(--ink);
+    }
+
+    .green-word {
+      color: var(--grid-green);
+      white-space: nowrap;
+    }
+
+    .lead {
+      max-width: 620px;
+      margin: 0;
+      color: var(--muted);
+      font-size: clamp(16px, 1.55vw, 19px);
+      line-height: 1.68;
+    }
+
+    .actions {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 12px;
+      margin-top: 30px;
+    }
+
+    button {
+      min-height: 48px;
+      border-radius: 12px;
+      padding: 0 20px;
+      font: inherit;
+      font-weight: 780;
+    }
+
+    .primary {
+      border: 0;
+      color: #fff;
+      background: linear-gradient(135deg, var(--grid-green), var(--energy-green));
+      box-shadow: 0 18px 36px var(--shadow);
+    }
+
+    .secondary {
+      border: 1px solid var(--line);
+      color: var(--ink);
+      background: #fff;
+    }
+
+    .metrics {
+      display: grid;
+      grid-template-columns: repeat(3, minmax(0, 1fr));
+      gap: 12px;
+      margin-top: 34px;
+    }
+
+    .metric {
+      min-height: 126px;
+      padding: 18px;
+      border: 1px solid var(--line);
+      border-radius: 14px;
+      background: rgba(255,255,255,0.86);
+      box-shadow: 0 18px 42px rgba(17,21,19,0.05);
+    }
+
+    .metric span {
+      display: block;
+      color: var(--muted);
+      font-size: 13px;
+    }
+
+    .metric strong {
+      display: block;
+      margin-top: 16px;
+      font-size: 32px;
+      line-height: 1;
+      color: var(--ink);
+    }
+
+    .metric small {
+      display: block;
+      margin-top: 12px;
+      color: var(--energy-green);
+      font-size: 13px;
+      font-weight: 780;
+    }
+
+    .panel {
+      position: relative;
+      min-height: 620px;
+      overflow: hidden;
+      border: 1px solid var(--line-green);
+      border-radius: 28px;
+      background:
+        linear-gradient(145deg, rgba(255,255,255,0.95), rgba(238,248,241,0.88)),
+        radial-gradient(circle at 62% 36%, rgba(11,155,85,0.12), transparent 28%);
+      box-shadow: 0 30px 80px rgba(0,122,61,0.12);
+    }
+
+    .panel::before {
+      content: "";
+      position: absolute;
+      inset: 24px;
+      border: 1px solid rgba(0, 122, 61, 0.12);
+      border-radius: 22px;
+      background:
+        linear-gradient(rgba(0,122,61,0.04) 1px, transparent 1px),
+        linear-gradient(90deg, rgba(0,122,61,0.04) 1px, transparent 1px);
+      background-size: 42px 42px;
+    }
+
+    .green-strip {
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 82px;
+      background: linear-gradient(90deg, var(--grid-green), var(--energy-green));
+      clip-path: polygon(0 0, 100% 0, 100% 68%, 82% 100%, 0 100%);
+    }
+
+    .strip-title {
+      position: absolute;
+      left: 28px;
+      top: 22px;
+      color: #fff;
+      font-size: 18px;
+      font-weight: 850;
+    }
+
+    .map {
+      position: absolute;
+      inset: 122px 42px 150px;
+    }
+
+    .line {
+      position: absolute;
+      height: 2px;
+      transform-origin: left center;
+      background: linear-gradient(90deg, rgba(0,122,61,0.18), rgba(0,122,61,0.58), rgba(23,105,209,0.44));
+    }
+
+    .line.a { left: 12%; top: 25%; width: 58%; transform: rotate(11deg); }
+    .line.b { left: 18%; top: 62%; width: 52%; transform: rotate(-18deg); }
+    .line.c { left: 33%; top: 38%; width: 36%; transform: rotate(62deg); }
+    .line.d { left: 48%; top: 22%; width: 30%; transform: rotate(110deg); }
+
+    .node {
+      position: absolute;
+      display: grid;
+      place-items: center;
+      width: 62px;
+      height: 62px;
+      border: 2px solid rgba(0,122,61,0.28);
+      border-radius: 50%;
+      color: var(--grid-green);
+      background: #fff;
+      box-shadow: 0 16px 34px rgba(0,122,61,0.12);
+      font-size: 13px;
+      font-weight: 850;
+    }
+
+    .node::after {
+      content: "";
+      position: absolute;
+      width: 10px;
+      height: 10px;
+      right: 6px;
+      top: 8px;
+      border-radius: 50%;
+      background: var(--energy-green);
+      box-shadow: 0 0 0 5px rgba(11,155,85,0.12);
+    }
+
+    .node.one { left: 8%; top: 18%; }
+    .node.two { left: 38%; top: 2%; }
+    .node.three { right: 10%; top: 28%; }
+    .node.four { left: 22%; bottom: 12%; }
+    .node.five { right: 25%; bottom: 8%; }
+
+    .node.warn {
+      border-color: rgba(217,151,34,0.44);
+      color: var(--amber);
+    }
+
+    .node.warn::after { background: var(--amber); box-shadow: 0 0 0 5px rgba(217,151,34,0.15); }
+
+    .recommend {
+      position: absolute;
+      left: 28px;
+      right: 28px;
+      bottom: 24px;
+      display: grid;
+      grid-template-columns: 1.2fr 0.8fr;
+      gap: 12px;
+    }
+
+    .card {
+      padding: 18px;
+      border: 1px solid var(--line);
+      border-radius: 16px;
+      background: rgba(255,255,255,0.94);
+      box-shadow: 0 18px 40px rgba(17,21,19,0.06);
+    }
+
+    .card h2 {
+      margin: 0 0 8px;
+      font-size: 18px;
+      line-height: 1.25;
+    }
+
+    .card p {
+      margin: 0;
+      color: var(--muted);
+      font-size: 14px;
+      line-height: 1.55;
+    }
+
+    .risk {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+    }
+
+    .risk b {
+      color: var(--amber);
+      font-size: 30px;
+    }
+
+    .bottom-grid {
+      display: grid;
+      grid-template-columns: repeat(4, minmax(0, 1fr));
+      gap: 14px;
+      margin-top: 20px;
+    }
+
+    .mini {
+      min-height: 116px;
+      padding: 18px;
+      border: 1px solid var(--line);
+      border-radius: 14px;
+      background: var(--surface);
+    }
+
+    .mini::before {
+      content: "";
+      display: block;
+      width: 38px;
+      height: 6px;
+      margin-bottom: 16px;
+      border-radius: 999px;
+      background: var(--grid-green);
+    }
+
+    .mini:nth-child(2)::before { background: var(--blue); }
+    .mini:nth-child(3)::before { background: var(--energy-green); }
+    .mini:nth-child(4)::before { background: var(--amber); }
+
+    .mini b {
+      display: block;
+      font-size: 18px;
+      margin-bottom: 8px;
+    }
+
+    .mini span {
+      display: block;
+      color: var(--muted);
+      font-size: 13px;
+      line-height: 1.5;
+    }
+
+    @media (max-width: 980px) {
+      .nav span:not(.cta) { display: none; }
+      .hero { grid-template-columns: 1fr; }
+      .panel { min-height: 580px; }
+      .bottom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+    }
+
+    @media (max-width: 560px) {
+      .page { padding: 18px 14px 42px; }
+      .topbar { align-items: flex-start; flex-direction: column; }
+      h1 { font-size: clamp(38px, 12vw, 50px); line-height: 1.08; }
+      .lead { font-size: 15px; }
+      .actions { flex-direction: column; }
+      button { width: 100%; }
+      .metrics { grid-template-columns: 1fr; }
+      .panel { min-height: 620px; border-radius: 22px; }
+      .map { inset: 116px 18px 210px; }
+      .node { width: 54px; height: 54px; font-size: 12px; }
+      .recommend { grid-template-columns: 1fr; left: 16px; right: 16px; }
+      .bottom-grid { grid-template-columns: 1fr; }
+    }
+  </style>
+</head>
+<body>
+  <main class="page" data-screen-label="01 绿脉电网调度首页">
+    <header class="topbar">
+      <div class="brand"><span class="mark" aria-hidden="true"></span><span>绿脉电网</span></div>
+      <nav class="nav" aria-label="主导航">
+        <span>负荷预测</span><span>储能调度</span><span>线路风险</span><span>低碳指标</span><span class="cta">进入调度台</span>
+      </nav>
+    </header>
+
+    <section class="hero">
+      <div>
+        <span class="eyebrow">智能电网 · 源网荷储协同</span>
+        <h1>把负荷、储能和线路风险放进<span class="green-word">一张调度图</span>。</h1>
+        <p class="lead">面向城市能源平台的调度首页，用白底保证阅读，深绿建立行业识别，浅绿分区表达安全运行，蓝色只用于数字化链路。</p>
+        <div class="actions">
+          <button class="primary">生成调度建议</button>
+          <button class="secondary">查看风险清单</button>
+        </div>
+
+        <section class="metrics" aria-label="核心指标">
+          <article class="metric"><span>今日预测负荷</span><strong>8.42 GW</strong><small>较昨日 +3.1%</small></article>
+          <article class="metric"><span>储能可调容量</span><strong>426 MWh</strong><small>峰时段可调用</small></article>
+          <article class="metric"><span>供电可靠性</span><strong>99.96%</strong><small>主网运行稳定</small></article>
+        </section>
+      </div>
+
+      <section class="panel" aria-label="电网拓扑面板">
+        <div class="green-strip"></div>
+        <div class="strip-title">区域电网拓扑与实时状态</div>
+        <div class="map">
+          <i class="line a"></i><i class="line b"></i><i class="line c"></i><i class="line d"></i>
+          <div class="node one">北站</div>
+          <div class="node two">光伏</div>
+          <div class="node three warn">东线</div>
+          <div class="node four">储能</div>
+          <div class="node five">主网</div>
+        </div>
+        <div class="recommend">
+          <article class="card"><h2>调度建议</h2><p>18:00 前释放 82 MWh 储能，东线负荷转移 6%，优先保障工业园区连续供电。</p></article>
+          <article class="card risk"><div><h2>风险状态</h2><p>东线温升接近阈值</p></div><b>Ⅱ</b></article>
+        </div>
+      </section>
+    </section>
+
+    <section class="bottom-grid" aria-label="行动模块">
+      <article class="mini"><b>负荷预测</b><span>按区域、时段和天气修正峰谷曲线。</span></article>
+      <article class="mini"><b>数字链路</b><span>蓝色只表达数据采集、云端计算和 AI 预测。</span></article>
+      <article class="mini"><b>低碳优化</b><span>优先消纳新能源，输出可追踪减排指标。</span></article>
+      <article class="mini"><b>风险处置</b><span>按线路、责任班组和处理时限生成清单。</span></article>
+    </section>
+  </main>
+  <script>
+    window.addEventListener("message", (event) => {
+      if (event.data && event.data.type === "__edit_mode_set_keys") {
+        const edits = event.data.edits || {};
+        if (edits.green) document.documentElement.style.setProperty("--grid-green", edits.green);
+        if (edits.light) document.documentElement.style.setProperty("--paper-green", edits.light);
+        if (edits.blue) document.documentElement.style.setProperty("--blue", edits.blue);
+      }
+    });
+    const UI_DESIGN_TWEAKS = /*EDITMODE-BEGIN*/{
+      "green": "#007a3d",
+      "light": "#eef8f1",
+      "blue": "#1769d1"
+    }/*EDITMODE-END*/;
+    window.parent.postMessage({ type: "__edit_mode_available", edits: UI_DESIGN_TWEAKS }, "*");
+  </script>
+</body>
+</html>

package/skills/ui-design/tests/e2e/runs/verdant-grid-preview-1/screenshots/browser-check.json

@@ -0,0 +1,49 @@
+{
+  "html": "/Volumes/D 1/code/kakadeai/minimal-agent/skills/ui-design/tests/e2e/runs/verdant-grid-preview-1/outputs/index.html",
+  "desktop": {
+    "viewport": {
+      "width": 1440,
+      "height": 980
+    },
+    "screenshot": "/Volumes/D 1/code/kakadeai/minimal-agent/skills/ui-design/tests/e2e/runs/verdant-grid-preview-1/screenshots/desktop.png",
+    "console": [],
+    "inspection": {
+      "title": "绿脉电网预览",
+      "screenLabels": [
+        "01 绿脉电网调度首页"
+      ],
+      "editModeBlocks": 1,
+      "hasEditModeAvailable": true,
+      "hasEditModeSetKeys": true,
+      "hasEditsPayload": true,
+      "documentWidth": 1440,
+      "viewportWidth": 1440,
+      "horizontalOverflow": false,
+      "smallTargets": []
+    }
+  },
+  "mobile": {
+    "viewport": {
+      "width": 390,
+      "height": 844
+    },
+    "screenshot": "/Volumes/D 1/code/kakadeai/minimal-agent/skills/ui-design/tests/e2e/runs/verdant-grid-preview-1/screenshots/mobile.png",
+    "console": [],
+    "inspection": {
+      "title": "绿脉电网预览",
+      "screenLabels": [
+        "01 绿脉电网调度首页"
+      ],
+      "editModeBlocks": 1,
+      "hasEditModeAvailable": true,
+      "hasEditModeSetKeys": true,
+      "hasEditsPayload": true,
+      "documentWidth": 390,
+      "viewportWidth": 390,
+      "horizontalOverflow": false,
+      "smallTargets": []
+    }
+  },
+  "issues": [],
+  "pass": true
+}

package/skills/ui-design/tests/e2e/runs/violet-meridian-iteration-1/checks/browser-check.json

@@ -0,0 +1,54 @@
+{
+  "pass": true,
+  "console": [],
+  "desktop": {
+    "title": "智轨工作台 - 紫曜经线样张",
+    "labels": [
+      "01 紫曜经线首页"
+    ],
+    "viewport": {
+      "width": 1440,
+      "height": 980
+    },
+    "scrollWidth": 1440,
+    "hasHorizontalOverflow": false,
+    "buttons": [
+      {
+        "text": "创建交付路径",
+        "width": 134,
+        "height": 46
+      },
+      {
+        "text": "查看工作台示例",
+        "width": 150,
+        "height": 46
+      }
+    ],
+    "errors": []
+  },
+  "mobile": {
+    "title": "智轨工作台 - 紫曜经线样张",
+    "labels": [
+      "01 紫曜经线首页"
+    ],
+    "viewport": {
+      "width": 390,
+      "height": 844
+    },
+    "scrollWidth": 390,
+    "hasHorizontalOverflow": false,
+    "buttons": [
+      {
+        "text": "创建交付路径",
+        "width": 362,
+        "height": 46
+      },
+      {
+        "text": "查看工作台示例",
+        "width": 362,
+        "height": 46
+      }
+    ],
+    "errors": []
+  }
+}