# G01 Empty Frame Transparency Implementation Plan

> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.

**Goal:** 移除 G01 空状态的不透明面板底，并让透明框内的内容尺度与纵向节奏更饱满。

**Architecture:** 设计流水线从已确认的 `g01-empty-panel.png` 精确提取原双金线和四角纹样，输出透明 `g01-empty-panel-frame.png`。空状态只渲染该透明框；错误状态继续使用原不透明资产。

**Tech Stack:** uni-app、Vue 3、SCSS、PowerShell 合同测试、Chrome H5。

## Global Constraints

- 不生成或覆盖现有资产。
- 不改变空状态按钮、文案和跳转行为。
- 不使用多代理、worktree 或 Git 写操作。
- H5 证据不表示 Android/HBuilderX 或 G01 整页正式验收。

---

### Task 1: 空状态透明框

**Files:**
- Modify: `tests/g01-empty-state-contract.ps1`
- Modify: `pages/genealogy/g01-my-genealogies.vue`

**Interfaces:**
- Consumes: `list-slip-frame.png`、`.empty-panel`、`.empty-panel__content`。
- Produces: 可重建的 `g01-empty-panel-frame.png`、`.empty-panel__frame` 透明框层和 `26rpx` `.empty-create-note`。
- Produces: `1120rpx` 空状态框、垂直居中的内容组、放大的谱印/标题/说明/操作按钮，以及更明显的纵向节奏。

- [ ] **Step 1: 写入失败契约**

锁定空状态模板不再引用不透明面板、使用 `empty-panel__frame`，并设置 `1120rpx` 框高、垂直居中、`560×124rpx` 主操作与 `26rpx` 提示文字。

- [ ] **Step 2: 验证合同失败**

Run: `powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-empty-state-contract.ps1`

Expected: FAIL，指出空状态仍使用不透明面板或缺少透明框。

- [ ] **Step 3: 实施最小模板与样式修改**

```scss
.empty-panel__frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.empty-create-note { font-size: 26rpx; line-height: 38rpx; }
```

- [ ] **Step 4: 验证**

Run:

```powershell
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-empty-state-contract.ps1
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-visual-contract.ps1
powershell -NoProfile -ExecutionPolicy Bypass -File tests/compile-audit.ps1
node tests/g01-empty-state-runtime-smoke.js http://localhost:5173
```

Expected: 全部 PASS。