cardbuddy 0.11.0 → 0.12.1

package/dist/vendored/App.vue

@@ -1,2858 +0,0 @@
-<!--
-  预览外壳：左侧卡片选择 + 顶部工具条 + 手机框内的实时渲染 +
-  右侧调试面板。
--->
-<template>
-  <div class="app" :class="{ 'app--chrome-off': chromeOff }" :style="{ '--preview-width': previewWidth + 'px', '--api-panel-width': apiPanelWidth + 'px', '--debug-min': debugMinWidth + 'px' }">
-    <header class="app__bar" v-show="!chromeOff">
-      <strong class="app__logo">
-        <img class="app__logo-icon" :src="logoUrl" alt="" />
-        CardBuddy
-        <span class="app__logo-version">v{{ appVersion }}</span>
-      </strong>
-      <div class="csel-combo">
-        <CardSelect class="csel--combo" :value="selectedId" :options="cardList" @change="onSelect" />
-        <button
-          class="csel-combo__btn"
-          type="button"
-          :disabled="!selectedId"
-          @click="openCardFolder"
-          title="在文件管理器中打开当前卡片所在文件夹"
-        >
-          <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-            <path d="M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7z" />
-            <path d="M3 9h18" />
-          </svg>
-        </button>
-      </div>
-      <!-- 卡片网格预览：图标按钮，打开本地全部卡片的缩略图墙，点击任一张载入工作台 -->
-      <button
-        class="app__btn app__btn--icon"
-        type="button"
-        :disabled="!cardList.length"
-        @click="openGallery"
-        title="卡片网格预览"
-      >
-        <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-grid" /></svg>
-      </button>
-      <!-- 新增空白卡片：紧邻网格预览的图标按钮；弹窗收 ID（必填、本地重名前置拦截）+ 描述（选填），创建成功切换到新卡 -->
-      <button
-        class="app__btn app__btn--icon"
-        type="button"
-        @click="openNewCard"
-        title="新增空白卡片"
-      >
-        <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-folder-plus" /></svg>
-      </button>
-      <div
-        ref="validateBadgeEl"
-        class="app__badge"
-        :class="'app__badge--' + validateBadge.state"
-        :title="badgeTitle"
-        v-show="!chromeOff"
-      >
-        <span class="app__badge-dot"></span>
-        <span class="app__badge-text">{{ badgeText }}</span>
-      </div>
-      <div class="app__bar-actions">
-        <div class="app__op-group" role="group" aria-label="编辑历史与本地操作">
-          <!-- 撤销 / 重做：图标 + 文案；无可回退/重做版本时置灰 -->
-          <button class="app__btn app__btn--hist" type="button" :disabled="!preview || !canUndo" @click="undo" title="后退一步（撤销）">
-            <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-undo" /></svg>
-            <span>撤销</span>
-          </button>
-          <button class="app__btn app__btn--hist" type="button" :disabled="!preview || !canRedo" @click="redo" title="前进一步（重做）">
-            <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-redo" /></svg>
-            <span>重做</span>
-          </button>
-          <!-- 保存到本地：当前显示版本（撤销/重做导航到的历史版本，或编辑后未本地保存的版本）
-               与本地磁盘版本不一致时高亮可用；一致时置灰。点击把当前版本真正写回磁盘，
-               使下一次重新打开加载的是这个「真实版本」，而非任意历史记录。 -->
-          <button
-            class="app__btn app__btn--history-save"
-            type="button"
-            :disabled="!preview || !historyDirty || savingCard || loadingCard"
-            :class="{ 'is-dirty': historyDirty }"
-            @click="applyHistoryToLocal"
-            :title="historyDirty ? '当前版本与本地不一致，点击将该版本保存到本地' : '当前版本已与本地一致'"
-          >
-            <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-save" /></svg>
-            <span>保存</span>
-          </button>
-          <button class="app__btn app__btn--op" :disabled="!preview" @click="copySchema" title="复制 schema（含变量 mock 编辑后的数据）">
-            <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-copy" /></svg>
-            <span>{{ copiedSchema ? '已复制 ✓' : '复制' }}</span>
-          </button>
-        </div>
-        <!-- 远端：合并「远端保存 / 远端预览 / 切图上传 / 全量同步 / 选中卡片同步」为一个分组，组名「远端」，云图标 -->
-        <Dropdown
-          class="app__remote-menu"
-          size="md"
-          placement="bottom-end"
-          :disabled="savingRemote || syncingRemote || uploadingSlices"
-          :title="savingRemote ? '正在保存至远端…' : (syncingRemote ? '同步中…' : (uploadingSlices ? '正在上传切图…' : '远端操作：保存到 FinMall / 真机预览 / 切图上传 / 全量或选中卡片同步'))"
-          data-testid="remote-group"
-        >
-          <template #trigger="{ open }">
-            <button
-              type="button"
-              class="app__btn app__btn--remote"
-              :class="{ 'app__btn--warn': savedRemote && verifiedRemote === false, 'app__remote-trigger--active': open, 'is-processing': savingRemote || syncingRemote || uploadingSlices }"
-              :disabled="savingRemote || syncingRemote || uploadingSlices"
-            >
-              <svg v-if="savingRemote || syncingRemote || uploadingSlices" class="app__icon app__icon--spin" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-loading" /></svg>
-              <svg v-else-if="savedRemote && verifiedRemote !== false" class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-cloud-check" /></svg>
-              <svg v-else-if="savedRemote && verifiedRemote === false" class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-cloud-alert" /></svg>
-              <svg v-else class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-cloud" /></svg>
-              <span>远端</span>
-              <svg class="app__icon app__icon--chev" :class="{ 'app__icon--chev--open': open }" viewBox="0 0 16 16" width="12" height="12" aria-hidden="true"><use href="#icon-chevron" /></svg>
-            </button>
-          </template>
-          <template #default="{ close }"><ul class="app__remote-pop dd__menu" role="menu">
-            <li class="app__remote-item app__remote-item--save" :class="{ 'is-disabled': !preview || !selectedId || savingRemote || !hasCardSource }" :title="!hasCardSource ? '该卡未经「同步远程」导入，无远端来源信息，无法推送版本' : '版本推送：把本地卡片版本覆盖到远端 FinMall'" data-testid="save-remote" role="menuitem" @click="chooseRsave('save'); close()">
-              <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-upload-cloud" /></svg>
-              <span>版本推送</span>
-            </li>
-            <li class="app__remote-item" :class="{ 'is-disabled': !preview || !selectedId || !hasCardSource }" :title="!hasCardSource ? '该卡未经「同步远程」导入，无远端来源信息，无法生成真机预览二维码' : '在线预览：生成真机预览二维码（FinMall App 扫码）'" data-testid="remote-preview" role="menuitem" @click="chooseRsave('preview'); close()">
-              <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-grid" /></svg>
-              <span>在线预览</span>
-            </li>
-             <li class="app__remote-item app__remote-item--sync" :class="{ 'is-disabled': !preview || !selectedId || syncingRemote }" data-testid="sync-selected" role="menuitem" @click="chooseSync('selected'); close()">
-              <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-sync-box" /></svg>
-              <span>当前同步</span>
-            </li>
-            <li class="app__remote-item app__remote-item--sync" :class="{ 'is-disabled': syncingRemote }" data-testid="sync-full" role="menuitem" @click="chooseSync('full'); close()">
-              <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-refresh" /></svg>
-              <span>全量同步</span>
-            </li>
-            <!-- 切图上传：仅点击时执行，把「当前卡片引用到的」src/slices 切图上传到 FinMall 图片库
-                 （CC0000.do），并把该卡 schema/data 里的 /slices/ 引用改写为返回的 @filestore/ 线上地址。
-                 没有任何自动上传路径；共享切图若已上传过（sha256 命中 src/slices/manifest.json）直接复用地址。
-                 不要求 hasCardSource：本地自建卡同样需要先把切图传上去，才能推版本 / 出真机预览。 -->
-            <li class="app__remote-item app__remote-item--upload" :class="{ 'is-disabled': !preview || !selectedId || uploadingSlices }" :title="uploadingSlices ? '正在上传切图…' : '切图上传：把当前卡片引用的本地切图（src/slices）上传到 FinMall 图片库，并把卡片里的 /slices/ 引用替换为线上地址（@filestore/…）；本地切图文件保留'" data-testid="slice-upload" role="menuitem" @click="chooseRsave('slices'); close()">
-              <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-image-upload" /></svg>
-              <span>切图上传</span>
-            </li>
-          </ul></template>
-        </Dropdown>
-        <!-- 接口调用面板开关：右侧常驻面板的展开/收起，状态持久化 -->
-        <button
-          class="app__btn app__btn--icon"
-          :class="{ 'app__btn--active': apiPanelOpen }"
-          type="button"
-          :title="apiPanelOpen ? '收起接口调用面板' : '打开接口调用面板'"
-          :aria-pressed="apiPanelOpen"
-          @click="toggleApiPanel"
-        >
-          <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-            <rect x="3" y="4" width="18" height="16" rx="2" />
-            <line x1="15" y1="4" x2="15" y2="20" />
-          </svg>
-        </button>
-        <!-- 主题切换：深色（当前）/ 浅色，复用同名 CSS 变量整体换肤，状态持久化 -->
-        <button
-          class="theme-toggle"
-          type="button"
-          role="switch"
-          :aria-checked="theme === 'light'"
-          :title="theme === 'light' ? '切换到深色主题' : '切换到浅色主题'"
-          @click="toggleTheme"
-        >
-          <span class="theme-toggle__track">
-            <span class="theme-toggle__thumb">
-              <svg
-                v-if="theme === 'light'"
-                class="theme-toggle__icon"
-                viewBox="0 0 24 24"
-                fill="none"
-                stroke="currentColor"
-                stroke-width="2"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                aria-hidden="true"
-              >
-                <circle cx="12" cy="12" r="4.2" />
-                <line x1="12" y1="2.5" x2="12" y2="5" />
-                <line x1="12" y1="19" x2="12" y2="21.5" />
-                <line x1="2.5" y1="12" x2="5" y2="12" />
-                <line x1="19" y1="12" x2="21.5" y2="12" />
-                <line x1="4.9" y1="4.9" x2="6.8" y2="6.8" />
-                <line x1="17.2" y1="17.2" x2="19.1" y2="19.1" />
-                <line x1="4.9" y1="19.1" x2="6.8" y2="17.2" />
-                <line x1="17.2" y1="6.8" x2="19.1" y2="4.9" />
-              </svg>
-              <svg
-                v-else
-                class="theme-toggle__icon"
-                viewBox="0 0 24 24"
-                fill="none"
-                stroke="currentColor"
-                stroke-width="2"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                aria-hidden="true"
-              >
-                <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" />
-              </svg>
-            </span>
-          </span>
-        </button>
-        <!-- 本地开发服务设置入口 -->
-        <div class="app__dev-svc">
-          <button
-            class="app__btn app__btn--icon"
-            type="button"
-            :title="devSvcTitle"
-            :class="devSvcClass"
-            @click="devServiceOpen = !devServiceOpen"
-          >
-            <svg class="app__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-link" /></svg>
-          </button>
-          <!-- 点遮罩关闭：与事件帮助气泡等轻量浮层同一交互 -->
-          <div v-if="devServiceOpen" class="app__dev-svc-mask" @click="devServiceOpen = false"></div>
-          <Transition name="pop">
-            <div v-if="devServiceOpen" class="app__dev-svc-panel" @click.stop>
-              <div class="app__dev-svc-head">
-                <span class="app__dev-svc-title">本地开发服务</span>
-                <button class="app__dev-svc-close" type="button" title="关闭" @click="devServiceOpen = false"></button>
-              </div>
-              <div class="app__dev-svc-body">
-                <label class="app__dev-svc-row">
-                  <span>启用</span>
-                  <Switch v-model="devServiceForm.enabled" />
-                </label>
-                <label class="app__dev-svc-row app__dev-svc-row--col">
-                  <span>服务地址</span>
-                  <input type="text" v-model="devServiceForm.baseUrl" placeholder="http://127.0.0.1:8787" />
-                </label>
-                <label class="app__dev-svc-row app__dev-svc-row--col">
-                  <span>访问令牌（可选）</span>
-                  <input type="text" v-model="devServiceForm.token" placeholder="留空则不校验" />
-                </label>
-                <p class="app__dev-svc-hint" v-if="apiBaseResolved === null">
-                  <template v-if="devSvcBlockReason === 'disabled'">已填写服务地址，但「启用」开关未打开。请开启「启用」开关并点击保存，本地开发服务才会生效。</template>
-                  <template v-else>请填写本机 cardbuddy 服务地址（默认 http://127.0.0.1:8787），打开「启用」开关并保存后，编辑功能才会生效。</template>
-                </p>
-                <div class="app__dev-svc-actions">
-                  <button class="ni-btn ni-btn--ghost" type="button" @click="devServiceOpen = false">关闭</button>
-                  <button class="ni-btn" type="button" @click="saveDevService">保存</button>
-                </div>
-              </div>
-            </div>
-          </Transition>
-        </div>
-      </div>
-      <span style="display: none">{{ rt.revision }}</span>
-    </header>
-
-    <!-- AI 开发助手悬浮入口：右下角圆形按钮（尺寸 / 配色走规范 Token，图标取自 sprite） -->
-    <button
-      class="ai-fab"
-      type="button"
-      :class="{ 'ai-fab--active': aiChatOpen }"
-      :title="aiChatOpen ? 'AI 开发助手（已打开）' : 'AI 开发助手'"
-      :aria-expanded="aiChatOpen ? 'true' : 'false'"
-      data-testid="ai-fab"
-      @click="aiChatOpen = !aiChatOpen"
-    >
-      <svg class="ai-fab__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><use href="#icon-sparkles" /></svg>
-    </button>
-
-    <!-- AI 开发助手对话面板：右侧抽屉，宽度可拖（320px ~ 视口 50%，默认 33%），对话记录按卡片落盘 -->
-    <ChatPanel
-      :visible="aiChatOpen"
-      :card-id="selectedId"
-      :card-name="selectedCardName"
-      @close="aiChatOpen = false"
-    />
-
-    <!-- 部署态但未配置本地开发服务：顶部提示条（chrome=off 截图模式不显示） -->
-    <div v-if="apiBaseResolved === null && !chromeOff" class="app__nosvc-banner">
-      <template v-if="devSvcBlockReason === 'disabled'">
-        ⚠ 本地开发服务未生效：已填写地址，但未打开「启用」开关。请点击右上角 「连接」图标打开「本地开发服务」设置，开启「启用」开关并保存后，编辑功能才会生效。
-      </template>
-      <template v-else>
-        ⚠ 未配置本地开发服务：当前为部署态，编辑功能不可用。请点击右上角 「连接」图标打开「本地开发服务」设置，填写本机 cardbuddy 地址、打开「启用」开关并保存后，才能编辑卡片。
-      </template>
-    </div>
-
-    <!-- 已配置本地服务但实时连接已断开：顶部提示条（chrome=off 截图模式不显示） -->
-    <div v-if="apiBaseResolved !== null && devSvcDown && !chromeOff" class="app__nosvc-banner app__nosvc-banner--disconnected">
-      ⚠ 本地开发服务已断开：连接失败或服务已停止，编辑 / 同步功能暂不可用。请确认本地 cardbuddy 是否运行，或点击右上角「连接」图标重新保存配置。
-    </div>
-
-    <!-- 外部改了当前卡、无未保存改动 → 自动重载后的非阻塞轻提示（chrome=off 截图模式不显示） -->
-    <div v-if="externalReloadNote && !chromeOff" class="app__nosvc-banner app__extreload-banner">
-      ↻ {{ externalReloadNote }}
-    </div>
-
-    <main class="app__stage" ref="stageEl">
-      <div class="phone" :class="{ 'phone--dragging': dragging }" :style="{ width: previewWidth + 'px' }">
-        <!-- 缩放外框：占满整列（宽高由 CSS flex 填满）；画布不做 transform 缩放，直接按实际尺寸布局 -->
-        <div class="phone__frame" :style="frameStyle">
-        <!-- 画布层：直接按实际列宽/列高布局（width/height 100%），不再使用 transform 缩放 -->
-        <div class="phone__scaler">
-        <!-- 画布工具条：原 device-bar（顶 28px）+ preview-statusbar（底 28px）合并为一条 32px，
-             竖向空间还给手机视口。左组=改变画布（背景 / 宽度预设），右组=画布现状与动作（尺寸读数 / 刷新）；
-             预览列窄于 300px 时收起读数与文案只留图标（188 预设下仍单行可用）。 -->
-        <div class="canvas-bar" :class="{ 'canvas-bar--tight': previewWidth < 300 }" v-show="!chromeOff">
-          <!-- 画布背景：触发器带当前底色小样，不展开下拉也可见当前模式 -->
-          <Dropdown
-            borderless
-            size="xs"
-            placement="bottom-start"
-            :value="canvasBg"
-            :options="bgOptions.map((b) => ({ key: b.key, value: b.label + '背景' }))"
-            @change="chooseBg"
-          >
-            <template #trigger>
-              <span class="canvas-bar__chip" :title="'画布背景：' + currentBg.label">
-                <i class="canvas-bar__swatch" :class="'canvas-bar__swatch--' + canvasBg"></i>
-                <span class="canvas-bar__txt">{{ currentBg.label }}背景</span>
-                <svg class="canvas-bar__chev" viewBox="0 0 16 16" aria-hidden="true"><use href="#icon-chevron" /></svg>
-              </span>
-            </template>
-          </Dropdown>
-          <!-- 宽度预设：触发器直接显示当前宽度，省去独立的「宽度」标签 -->
-          <Dropdown
-            borderless
-            size="xs"
-            placement="bottom-start"
-            :value="canvasW"
-            :options="presetSizes"
-            @change="setPresetWidth"
-          >
-            <template #trigger>
-              <span class="canvas-bar__chip" title="画布宽度预设（高度随列高自适应）">
-                <svg class="canvas-bar__icn" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="8 7 4 12 8 17" /><polyline points="16 7 20 12 16 17" /><line x1="4" y1="12" x2="20" y2="12" /></svg>
-                <span class="canvas-bar__txt">{{ canvasW }} px</span>
-                <svg class="canvas-bar__chev" viewBox="0 0 16 16" aria-hidden="true"><use href="#icon-chevron" /></svg>
-              </span>
-            </template>
-          </Dropdown>
-          <span class="canvas-bar__spacer"></span>
-          <span class="canvas-bar__size" title="画布实际尺寸（宽 × 高，高度随窗口自适应）">{{ canvasW }} × {{ viewportHeight }}</span>
-          <button
-            class="canvas-bar__iconbtn"
-            :class="{ 'is-loading': refreshing }"
-            type="button"
-            :disabled="!selectedId || refreshing"
-            title="刷新卡片，重新加载"
-            @click="refreshCard"
-          >
-            <svg class="canvas-bar__icn" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-              <path d="M21 12a9 9 0 1 1-2.64-6.36" />
-              <path d="M21 3v6h-6" />
-            </svg>
-          </button>
-        </div>
-        <!--
-          固定视口：弹层（alertCard / alertDialog / toast）相对此容器 absolute inset:0 定位，
-          不随内层 phone__screen 的卡片内容滚动，保证遮罩始终精确覆盖可视区域。
-        -->
-        <div ref="phoneViewport" class="phone-viewport" @click="onCanvasClick">
-          <div
-            class="phone__screen"
-            :class="'phone__screen--bg-' + (chromeOff ? 'white' : canvasBg)"
-            :style="chromeOff && preview ? { width: (preview.view.width || 375) + 'px' } : null"
-            :data-card-ready="cardReady ? '1' : null"
-          >
-            <!--
-              :key 绑定 selectedId + reloadToken —— 切换卡片、远端同步后重载、重置导入
-              等场景时强制 RenderTree 重新挂载，从而保证新卡片/新数据的「初始化动作」
-              （onReady 等生命周期事件，如 assetOverview 计算 ratio）一定在 created 阶段
-              执行，不会出现重载后 init 不跑、依赖字段为 undefined 而渲染成 NaN% 的问题。
-            -->
-            <RenderTree v-if="preview" :key="selectedId + ':' + reloadToken" :node="preview.view" :scope="rt.state" :selected-node-id="selectedNodeId" />
-            <!-- 节点选中遮罩覆盖层：作为滚动容器子节点，随内容滚动并精确贴合选中元素 -->
-            <SelectionOverlay />
-            <!-- 结构树 hover 参考线：贯穿画布的荧光绿辅助线（左/右竖线、上/下横线），仅 hover 时显示 -->
-            <HoverGuides />
-          </div>
-          <!-- 弹窗卡片图层：alertCard / closeAlertCard 的展现层（在预览区域内弹出） -->
-          <AlertCardLayer :main-rt="rt" />
-          <!-- 设备级模拟 UI：alertDialog 对话框 / showToast 弱提示 / showPicker 选择器 / showDatePicker 日期选择器 -->
-          <DeviceOverlay />
-          <PickerOverlay />
-          <DatePickerOverlay />
-        </div>
-        </div>
-        </div>
-      </div>
-
-
-      <!-- 左分隔条：预览列 | 工作区 接缝。底面板 / 状态栏的左缘即此缝（随预览宽度联动），
-           故定位在 .app__stage 通到底部，全程可拖；右分隔条才收进两栏容器内。 -->
-      <div
-        v-show="!chromeOff"
-        class="splitter"
-        :class="{ 'is-dragging': dragging }"
-        @pointerdown.prevent="startDrag"
-        title="拖拽调整预览区域宽度"
-      ></div>
-
-      <!-- 中右工作区：上为「调试面板 + 接口调用面板」两栏，下为贯穿两栏的共同状态栏。
-           状态栏与底部弹出面板（运行态 / 事件 / 变量绑定）均由 DebugPanel 内 Teleport 注入
-           #app-workside-bar / #app-workside-panels，宽度贯穿中右两栏；Teleport 目标须在 DOM 中
-           先于面板挂载，故两个空容器写在前面，以 flex order 视觉置底。 -->
-      <div class="workside" v-show="!chromeOff">
-        <div id="app-workside-bar" class="workside__bar"></div>
-        <div id="app-workside-panels" class="workside__panels"></div>
-        <div class="workside__cols" ref="colsEl">
-          <!-- 拖拽分隔条：置于两栏容器内（定位上下文），只贯穿列区高度，不穿过底部弹出面板与状态栏 -->
-          <!-- 中右分隔条：调试面板 | 接口调用面板 接缝，拖动调整右栏宽度。
-               约束：中栏最小宽度 ≥ 屏宽 1/3，右栏最小宽度 ≥ 320px（见 startApiDrag） -->
-          <div
-            v-show="!chromeOff && apiPanelOpen"
-            class="splitter splitter--api"
-            :class="{ 'is-dragging': apiDragging }"
-            @pointerdown.prevent="startApiDrag"
-            title="拖拽调整接口调用面板宽度"
-          ></div>
-          <DebugPanel
-            :chrome-off="chromeOff"
-            :rt="rt"
-            :preview="preview"
-            :schema="currentSchema"
-            :card-id="selectedId"
-            :reload-token="reloadToken"
-            :card-count="cardCount"
-            :selected-node-id="selectedNodeId"
-            :move-collapse-token="moveCollapseToken"
-            :active-tab="activeTab"
-            @schema-changed="onSchemaChanged"
-            @schema-commit="onSchemaCommit"
-            @select-node="onSelectNode"
-            @update:active-tab="activeTab = $event"
-            @add-node="onAddNode"
-            @move-node="onMoveNode"
-            @hover-node="onHoverNode"
-            @copy-selected="copySelectedNode"
-            @paste="pasteNode"
-            @duplicate="duplicateNode"
-            @delete-selected="deleteSelectedNode"
-            @reset-import="onRefresh"
-            :dev-svc-class="devSvcClass"
-            :dev-svc-title="devSvcTitle"
-            :dev-svc-label="devSvcLabel"
-            :dev-svc-conn="devSvcConn"
-          />
-
-          <!-- 右侧常驻「接口调用」面板：与预览列 / 调试面板呈左中右布局，
-               展开/收起由顶栏按钮与面板内 ✕ 控制，初始状态持久化 -->
-          <ApiCallPanel
-            v-if="apiPanelOpen"
-            :rt="rt"
-            @close="apiPanelOpen = false"
-          />
-        </div>
-      </div>
-    </main>
-    <!-- 远端预览二维码弹层：点击顶栏「远端预览」按钮打开，手机（FinMall App）扫码真机查看 -->
-    <RemotePreview
-      :visible="remotePreviewOpen"
-      :page-id="currentSchema ? currentSchema.pageId : ''"
-      :schema="currentSchema"
-      @close="remotePreviewOpen = false"
-    />
-    <!-- 登录凭据弹窗：远程同步检测到缺凭据时弹出，填写账号密码（MD5 后）写入 .local/credentials.json -->
-    <Transition name="modal">
-    <div v-if="loginModal" class="login-mask" @click.self="closeLoginModal">
-      <div class="login-modal modal-card" role="dialog" aria-modal="true">
-        <div class="login-modal__title">FinMall 登录凭据</div>
-        <div class="login-modal__desc">
-          本地登录凭据缺失，请填写账号与密码。密码仅做 MD5 后保存，不落明文。
-        </div>
-        <label class="login-modal__row">
-          <span class="login-modal__label">账号</span>
-          <input
-            class="login-modal__input"
-            type="text"
-            v-model="loginName"
-            placeholder="FinMall 登录账号"
-            :disabled="loginSubmitting"
-            @keyup.enter="submitLogin"
-          />
-        </label>
-        <label class="login-modal__row">
-          <span class="login-modal__label">密码</span>
-          <input
-            class="login-modal__input"
-            type="password"
-            v-model="loginPassword"
-            placeholder="FinMall 登录密码"
-            :disabled="loginSubmitting"
-            @keyup.enter="submitLogin"
-          />
-        </label>
-        <div v-if="loginError" class="login-modal__error">{{ loginError }}</div>
-        <div class="login-modal__actions">
-          <button
-            class="login-modal__btn login-modal__btn--ghost"
-            type="button"
-            :disabled="loginSubmitting"
-            @click="closeLoginModal"
-          >
-            取消
-          </button>
-          <button
-            class="login-modal__btn login-modal__btn--primary"
-            type="button"
-            :disabled="loginSubmitting"
-            @click="submitLogin"
-          >
-            {{ loginSubmitting ? '保存中…' : '保存并同步' }}
-          </button>
-        </div>
-      </div>
-    </div>
-    </Transition>
-    <!-- 组件选择面板：点击结构树每行的「＋」后弹出，选择类型即插入对应节点 -->
-    <Transition name="modal">
-      <ComponentPalette
-        v-if="addNodePanelOpen"
-        @pick="onPickComponent"
-        @close="cancelAddNode"
-      />
-    </Transition>
-    <!-- 二次确认弹窗：版本推送 / 当前同步 / 全量同步 等写/覆盖类操作前弹出，确认后才执行 -->
-    <ConfirmDialog
-      :visible="confirm.show"
-      :title="confirm.title"
-      :message="confirm.message"
-      :confirm-text="confirm.confirmText"
-      :cancel-text="confirm.cancelText"
-      :severity="confirm.severity"
-      @confirm="onConfirmDialog"
-      @cancel="onCancelDialog"
-    />
-    <!-- 卡片网格预览弹窗：点击顶栏「网格预览」图标按钮打开，选择卡片即载入工作台 -->
-    <CardGallery
-      :visible="galleryOpen"
-      :cards="cardList"
-      :selected-id="selectedId"
-      @select="onSelect"
-      @close="closeGallery"
-      @delete="onGalleryDelete"
-    />
-    <!-- 新增空白卡片弹窗：创建成功后关弹窗 + 刷列表 + 切换到新卡；existing-ids 供 ID 重名前置判定 -->
-    <NewCardDialog
-      :visible="newCardOpen"
-      :existing-ids="cardIds"
-      @close="newCardOpen = false"
-      @created="onNewCardCreated"
-    />
-    <!-- App 级弱提示：顶栏异步操作（远端保存 / 同步）完成反馈，浮于 App 外壳顶部居中 -->
-    <AppToast />
-  </div>
-</template>
-
-<script>
-import Adapter from '@/runtime/adapter.js'
-import { createCardRuntime } from '@/runtime/card-runtime.js'
-import { buildPreview, buildModelView, createComponentNode, isContainerMeta, getDefaultSlotKey, COMPONENT_META } from '@/runtime/toPreview.js'
-// 节点树剪贴板：复制/粘贴/副本（Ctrl/⌘+C/V/D）共用
-import {
-  setClipboardNode,
-  getClipboardNode,
-  getClipboardSourceCardId,
-  collectClassNames,
-  regenerateComponentIds,
-} from '@/runtime/clipboard-node.js'
-import RenderTree from '@/components/RenderTree.vue'
-import DebugPanel from '@/components/DebugPanel.vue'
-import ApiCallPanel from '@/components/ApiCallPanel.vue'
-import CardSelect from '@/components/CardSelect.vue'
-import AlertCardLayer from '@/components/AlertCardLayer.vue'
-import DeviceOverlay from '@/components/DeviceOverlay.vue'
-import PickerOverlay from '@/components/PickerOverlay.vue'
-import DatePickerOverlay from '@/components/DatePickerOverlay.vue'
-import SelectionOverlay from '@/components/SelectionOverlay.vue'
-import HoverGuides from '@/components/HoverGuides.vue'
-import { hoverGuide, setHoverEl, clearHoverEl } from '@/runtime/hoverGuide.js'
-import RemotePreview from '@/components/RemotePreview.vue'
-import AppToast from '@/components/AppToast.vue'
-import ConfirmDialog from '@/components/ConfirmDialog.vue'
-import CardGallery from '@/components/CardGallery.vue'
-import NewCardDialog from '@/components/NewCardDialog.vue'
-import ComponentPalette from '@/components/ComponentPalette.vue'
-import Switch from '@/components/Switch.vue'
-import ChatPanel from '@/components/ChatPanel.vue'
-import { showAppToast } from '@/runtime/app-toast.js'
-import { clearAllAlerts } from '@/runtime/alert-card.js'
-import { installJsApiMock, clearDeviceUI } from '@/runtime/jsapi-mock.js'
-import logoUrl from '@/assets/site-icon.png'
-import { apiFetch, resolveApiBase, subscribeCardsChanged, loadDevServiceConfig, saveDevServiceConfig } from '@/api.js'
-// 由 schema 单向派生 data 的共享实现（与 server/core 同源，避免逻辑漂移）。
-// 预览渲染注入的数据绑定、本地基线比较、历史快照还原均使用此函数，使 data 永不读回 data.json 文件。
-import { buildDataFromSchema, readMocks } from '../server/core/buildDataFromSchema.js'
-// 编辑器预览态派生 data 时叠加 dictionary.mocks（设计期覆盖）；服务端写盘仍只用 defaultValue。
-const WITH_MOCKS = { includeMocks: true }
-
-// 编辑器自身「保存到本地 / 保存至远端」写盘后，cardbuddy 的 watcher 会把这次落盘经 SSE
-// 推回 cards-changed。这是「自己改自己」的回声，并非外部修改，用此窗口吸收，避免误弹外部重载
-// 提示 / 冲突确认框。窗口仅作用于本窗口——其他窗口 / IDE / 远端同步推来的 cards-changed 仍照常提示。
-const SELF_SAVE_SUPPRESS_MS = 2500
-
-// 模块级单例：renderTree 通过 provide/inject 拿到的是稳定引用，
-// 内部 rootScope 可经 setRootScope 整体替换而引用不变。
-const adapter = new Adapter()
-const cardRuntime = createCardRuntime({}, adapter)
-// 开发期暴露 runtime 单例句柄，供 E2E 回归（如 L2-12 rootScope 整体替换实时同步画布）
-// 直接驱动 rt.setRootScope —— 与 DebugPanel「变量 → 配置变量 mock」Raw「应用」同源。生产构建不暴露。
-if (typeof window !== 'undefined' && import.meta.env.DEV) window.__rt = cardRuntime
-
-// 三栏（预览列 | 调试面板 | 接口调用面板）布局约束的单一来源：
-// 拖拽夹取与 computed 都从这里取值，避免「两套口径」在极限位置互相打架导致接缝跳动 / 整行溢出。
-const PREVIEW_MIN = 188 // 预览列硬下限（= 最小机型预设宽）
-const API_MIN = 320 // 接口调用面板常规下限（空间不足时按 apiPanelBounds 优雅退让，不整行溢出）
-const DEBUG_MIN_FLOOR = 200 // 中栏（调试面板）硬下限；软目标为屏宽 1/3
-const API_ABS_MIN = 160 // 极窄窗口下面板的绝对下限，保证不撑破容器
-
-export default {
-  name: 'App',
-  components: { RenderTree, DebugPanel, ApiCallPanel, CardSelect, AlertCardLayer, DeviceOverlay, PickerOverlay, DatePickerOverlay, SelectionOverlay, HoverGuides, RemotePreview, AppToast, ConfirmDialog, CardGallery, NewCardDialog, ComponentPalette, Switch, ChatPanel },
-  provide() {
-    return {
-      adapter,
-      cardRuntime,
-      customComponents: {},
-    }
-  },
-  data() {
-    return {
-      adapter,
-      rt: cardRuntime,
-      logoUrl,
-      // 顶栏版本号小字：由 vite.config.mjs 经 define 内联的 __APP_VERSION__ 提供，
-      // 与 package.json 的 version 保持一致。
-      appVersion: __APP_VERSION__,
-      cardList: [], // 实时从 GET /__cards 拉取，不缓存启动快照
-      cardCount: 0,
-      galleryOpen: false,
-      // 新增空白卡片弹窗开关（顶栏图标按钮触发）
-      newCardOpen: false, // 卡片网格预览弹窗开关
-      selectedId: '',
-      // 外部（IDE / 其他工具）改了当前卡、且平台无未保存改动时，自动重载后顶部短暂提示
-      // （非阻塞，区别于有未保存改动时的阻塞确认框）。
-      externalReloadNote: '',
-      externalReloadTimer: null,
-      // 自保存标记：记录「本窗口刚发起落盘」的卡片 id 与时刻，用于吸收 watcher 推回的 cards-changed 回声。
-      // 仅本窗口可见——其他窗口 / IDE / 远端同步触发的变更不会带此标记，仍照常提示外部重载。
-      selfSaveId: '',
-      selfSaveAt: 0,
-      preview: null,
-      // chrome=off：纯净截图模式（隐藏顶栏/设备条/调试面板，卡片根挂 data-card-ready），
-      // 供 /__screenshot 无头截图使用。由 URL ?chrome=off 触发。
-      chromeOff: false,
-      // 主题：'dark'（默认，当前配色）/ 'light'（浅色，白底）。持久化于 localStorage，切换即整体换肤。
-      theme: 'dark',
-      // 卡片首帧渲染完成标志：在 /__screenshot 模式下，screenshot.js 等待 [data-card-ready]
-      // 出现再截图（比 networkidle 稳，避免截到尚未挂载的空壳）。
-      cardReady: false,
-      reloadToken: 0,
-      // 拖拽移动成功令牌：每次「节点拖拽移动成功」自增，经 DebugPanel 透传给结构树，
-      // 用于触发「移动完成后：选中被拖节点 + 仅展开其祖先链、其余全部折叠」的行为。
-      moveCollapseToken: 0,
-      refreshing: false,
-      loadingCard: false, // 切卡/载入进行中：临时禁用「保存到本地」，避免沿用上一卡的脏状态或把上一卡误写进新卡
-      currentSchema: null,
-      currentCard: null, // 当前卡片的磁盘最新内容（实时载入的工作副本，非跨卡缓存）
-      // 导入来源元数据（Phase E 可追溯）：GET /__import-meta/:id 的 meta，无侧车（本地新建卡）时为 null。
-      // 顶栏「版本推送」据此置灰——无来源则无远端卡片可推送版本。
-      cardImportMeta: null,
-      // 本地真实版本基线：载入（或「保存到本地」写盘）时记录磁盘当前 schema+data 的克隆。
-      // 用于判断「当前显示版本」是否与本地磁盘一致：撤销/重做到历史版本、或编辑未本地保存
-      // 时两者不一致 → 顶栏「保存到本地」按钮高亮可点；一致时按钮置灰。
-      localSchema: null,
-      localData: null,
-      selectedNodeId: '',
-      // 当前激活的调试面板 tab（变量/组件结构/卡片来源）。
-      // 画布 Ctrl/⌘ 点击会自动切到「组件结构」tab 并在节点树聚焦选中，无需预先停在结构树 tab。
-      activeTab: 'vars',
-      // 右侧常驻「接口调用」面板：展开/收起由顶栏按钮与面板内 ✕ 控制，
-      // 初始状态持久化到 localStorage（cardbuddy:api-panel-open）
-      apiPanelOpen: true,
-      // 组件结构树「添加」面板：addNodePanelOpen 控制弹层显隐；addNodeTarget 记录
-      // 插入锚点与模式（{ node, mode }，来自结构树 add-node 事件）：
-      //   node = 右键/选中 viewNode（null 或 Root → 视作根）；mode 决定落位规则：
-      //     'child'  → 容器内默认插槽末尾追加子节点（根 → view.components 末尾）；
-      //     'before' → 节点相邻兄弟之前插入；
-      //     'after'  → 节点相邻兄弟之后插入；
-      //     'auto'   → 顶部「+ 添加」原行为（容器→子节点末尾；非容器→其后兄弟）。
-      addNodePanelOpen: false,
-      addNodeTarget: null,
-      // 整卡校验徽标（Q3：仅 ok/error，不展开 bindingErrors 明细）
-      validateBadge: { state: 'idle', errors: 0, warnings: 0, renderOk: null, ts: 0 },
-      validateTimer: null,
-      copiedSchema: false,
-      copyTimer: null,
-      savedCard: false,
-      savingCard: false,
-      saveTimer: null,
-      savingRemote: false, // 远端保存（写回 FinMall）进行中
-      savedRemote: false, // 远端保存成功反馈
-      verifiedRemote: null, // 保存后读回校验结果：null=未校验/跳过，true=一致，false=不符
-      saveRemoteTimer: null,
-      syncingRemote: false,
-      syncedRemote: false,
-      remotePreviewOpen: false, // 「远端预览」二维码弹层开关
-      syncTarget: null, // 'full' | 'selected' | null —— 标记上一次/正在进行的同步模式，用于按钮反馈
-      syncTimer: null,
-      uploadingSlices: false, // 「切图上传」进行中（远端分组，仅用户点击触发，无自动上传）
-      // 登录凭据弹窗（远程同步缺凭据时弹出，填写账号密码写入 .local/credentials.json）
-      loginModal: false,
-      loginName: '',
-      loginPassword: '',
-      loginSubmitting: false,
-      loginError: '',
-      // 二次确认弹窗（版本推送 / 当前同步 / 全量同步 等写/覆盖类操作前弹出，确认后才执行 onConfirm）。
-      // severity 三档：primary 常规 / warn 警告（橙黄+警告三角，覆盖类操作：版本推送、全量同步）/ danger 危险（红+禁止，仅明确负面结果如删除，暂无内置操作使用）
-      confirm: {
-        show: false,
-        title: '',
-        message: '',
-        confirmText: '继续',
-        cancelText: '取消',
-        severity: 'primary',
-        onConfirm: null,
-      },
-      // 编辑历史（撤销/重做）：每个快照为 { schema, data }，data 即 rt.rootScope（数据绑定），
-      // 与 schema 一并快照，撤销时两者都还原（否则 syncDataToSchema 会用新数据覆盖回 schema）。
-      // past=可回退的「上一版本」快照（最新在末尾），future=可重做的快照，
-      // baseline=当前已提交版本的 { schema, data } 克隆（schema 比较时忽略 defaultValue 噪声，data 比较用深层相等）。
-      past: [],
-      future: [],
-      baseline: null,
-      _commitTimer: null, // 编辑落定防抖计时器，避免连续编辑产生过多快照
-      viewportHeight: 700, // 手机视口实际高度（高度自适应填充后由 ResizeObserver 实测更新）
-      // 画布背景模式：checker（棋盘格） / white（白色） / gray（浅灰） / black（近黑，深色卡片对色用）
-      canvasBg: 'gray',
-      // 刷新按钮进行态：图标自转 + 禁用，避免连点与「点了没反应」
-      refreshing: false,
-      bgOptions: [
-        { key: 'checker', label: '棋盘' },
-        { key: 'white', label: '白色' },
-        { key: 'gray', label: '浅灰' },
-        { key: 'black', label: '黑色' },
-      ],
-      // —— 预览区宽度可调（拖拽分隔条 / 预设尺寸，画布按实际像素宽度布局，无 transform 缩放）——
-      _previewWidthPx: 372, // 预览列宽度（像素，持久化到 localStorage）；第一次打开未主动设置时默认 372px
-      _apiPanelWidthPx: 360, // 右侧「接口调用」面板宽度（像素，持久化到 localStorage）；默认 360px
-      presetSizes: [ // 预设尺寸下拉选项（仅宽度；高度随列高动态一致）
-        { key: 375, value: '375' },
-        { key: 430, value: '430' },
-        { key: 188, value: '188' },
-      ],
-      stageWidth: typeof window !== 'undefined' ? window.innerWidth : 1280, // 舞台实际宽度（ResizeObserver 实测后更新）
-      colsWidth: 0, // 中右两栏容器（.workside__cols）实测宽度：右栏宽度夹取的单一口径
-      stageHeight: typeof window !== 'undefined' ? window.innerHeight - 52 : 748, // 舞台实际高度（contain 缩放的“高度上限”基准）
-      dragging: false, // 是否正在拖拽分隔条
-      apiDragging: false, // 是否正在拖拽「接口调用」面板分隔条
-      _stageObserver: null,
-      // —— 本地开发服务（前后端分离）配置入口 ——
-      // devServiceForm：设置面板双向绑定的草稿；启用后前端所有 /__xxx 请求改走该地址。
-      devServiceOpen: false,
-      // AI 面板开合跨刷新保持：dev server 重启 / 误刷新后不必重新找入口
-      aiChatOpen: (() => {
-        try {
-          return sessionStorage.getItem('cardbuddy:ai-chat-open') === '1'
-        } catch {
-          return false
-        }
-      })(),
-      devServiceForm: loadDevServiceConfig(),
-      // apiBaseResolved：当前生效的 API 基址；null 表示部署态未配置（必须用本地服务才能编辑）。
-      apiBaseResolved: resolveApiBase(),
-      // devSvcLive：本地开发服务 / 同源 dev server 的实时连接态（由 SSE / Vite HMR 生命周期驱动）：
-      // 'unknown' | 'connecting' | 'open' | 'closed'。与 apiBaseResolved（静态配置态）解耦，
-      // 用于顶栏「连接」图标真实反映服务端是否在运行。
-      devSvcLive: 'unknown',
-      // devSvcDown：是否已确认「本地开发服务断开」。与 devSvcLive 区分——
-      // EventSource 断链后会每 ~3s 自动重连并把 devSvcLive 翻回 'connecting'，
-      // 若直接用 'closed' 判定提示条会闪烁消失；故用独立标志：仅在真正重连成功(open)时清除，
-      // 断开期间（含重连中）始终保持 true，提示条因此持续显示直到重连。
-      devSvcDown: false,
-      _unsubCardsChanged: null,
-    }
-  },
-  computed: {
-    currentBg() {
-      return this.bgOptions.find((b) => b.key === this.canvasBg) || this.bgOptions[0]
-    },
-    /** 本地已有卡片 ID（GET /__cards 实时扫描 src/cards 的结果）：新增空白卡片时做重名前置判定 */
-    cardIds() {
-      return this.cardList.map((c) => c && c.id).filter(Boolean)
-    },
-    // 撤销可用：存在可回退的上一版本；重做可用：存在被撤销后的版本
-    canUndo() {
-      return this.past.length > 0
-    },
-    canRedo() {
-      return this.future.length > 0
-    },
-    // 部署态未生效的具体原因（基于设置面板草稿 devServiceForm 实时判断）：
-    // 'empty'    = 未填写服务地址；
-    // 'disabled' = 已填地址但未打开「启用」开关；
-    // null       = 已正确配置（apiBaseResolved 不应为 null）。
-    devSvcBlockReason() {
-      const f = this.devServiceForm || {}
-      const hasUrl = !!String(f.baseUrl || '').trim()
-      if (!hasUrl) return 'empty'
-      if (!f.enabled) return 'disabled'
-      return null
-    },
-    // 剪贴板是否有可粘贴节点（供结构树「粘贴」按钮 disabled 态）
-    canPaste() {
-      return !!getClipboardNode()
-    },
-    // 当前卡片是否有导入来源信息（经同步远程导入才有 .import-meta.json）：
-    // 无来源 = 本地新建卡，无远端卡片可推送版本，顶栏「版本推送」应置灰。
-    hasCardSource() {
-      return !!(this.cardImportMeta && this.cardImportMeta.source)
-    },
-    // 当前显示版本（schema 结构 + 数据绑定）是否与本地磁盘版本一致：
-    // 不一致（撤销/重做到历史版本、或编辑后未本地保存）时，顶栏「保存到本地」按钮高亮且可点击；
-    // 一致时按钮置灰不可用。
-    // 注意：数据绑定比较用 localData（= buildDataFromSchema(localSchema)，载入/保存时记录），
-    // 而非 data.json 文件 —— data.json 仅为 schema 派生产物，永不读回。
-    historyDirty() {
-      if (!this.localSchema || !this.currentSchema) return false
-      return (
-        !this.structuralEqual(this.currentSchema, this.localSchema) ||
-        !this.dataEqual(this.rt && this.rt.rootScope, this.localData)
-      )
-    },
-    // 本地开发服务连接态聚合：静态配置态(apiBaseResolved) + 实时连接态(devSvcLive)。
-    // - null        = 未配置（部署态必填 / 已填但未启用）
-    // - ''          = 同源 dev 模式（页面本身由 dev server 提供）
-    // - 其它地址     = 已连接本地服务（8787）
-    devSvcConn() {
-      if (this.apiBaseResolved === null) return 'unconfigured'
-      if (this.devSvcLive === 'open') return 'open'
-      if (this.devSvcDown) return 'closed'
-      return 'connecting' // unknown 或 connecting 均视为「连接中 / 重连中」
-    },
-    // 顶栏「连接」图标 tooltip：按模式 + 实时连接态给出可读文案。
-    devSvcTitle() {
-      if (this.apiBaseResolved === null) {
-        return this.devSvcBlockReason === 'disabled'
-          ? '已填地址但未开启用本地服务'
-          : '未配置本地开发服务（部署态必填）'
-      }
-      const prefix = this.apiBaseResolved === '' ? '同源开发服务' : '本地开发服务'
-      if (this.devSvcLive === 'open') return prefix + '已连接'
-      if (this.devSvcDown) return prefix + '已断开（连接失败或服务已停止，重连中…）'
-      return prefix + '连接中 / 重连中…'
-    },
-    // 顶栏「连接」图标配色态。
-    devSvcClass() {
-      if (this.apiBaseResolved === null) return 'app__btn--warn'
-      if (this.devSvcLive === 'open') return 'app__btn--connected'
-      if (this.devSvcDown) return 'app__btn--disconnected'
-      return 'app__btn--reconnecting'
-    },
-    // 底部状态条「连接」状态文案：与 devSvcClass / devSvcConn 同源，给出可朗读的简短状态（顶栏 tooltip 为完整说明）。
-    devSvcLabel() {
-      if (this.apiBaseResolved === null) return '未配置本地服务'
-      if (this.devSvcLive === 'open') return '本地服务已连接'
-      if (this.devSvcDown) return '本地服务已断开'
-      return '本地服务连接中…'
-    },
-    badgeText() {
-      const map = {
-        idle: '待校验',
-        pending: '校验中…',
-        ok: '校验通过',
-        error: '校验未通过',
-        nopython: '未配置校验',
-        fail: '校验服务异常',
-      }
-      return map[this.validateBadge.state] || '待校验'
-    },
-    badgeTitle() {
-      const b = this.validateBadge
-      if (b.state === 'ok') return '结构合法 + 渲染不抛错（不保证画得对，视觉正确性见截图）'
-      if (b.state === 'error') {
-        const parts = []
-        if (b.errors) parts.push(`契约错误 ${b.errors} 个`)
-        if (b.renderOk === false) parts.push('渲染抛出异常')
-        return '校验未通过：' + (parts.join('；') || '详见 /__validate 与 /__render-status')
-      }
-      if (b.state === 'nopython') return '未找到 python3/python，无法跑契约校验（请安装 Python 或设置 DSL_PYTHON）'
-      if (b.state === 'fail') return '校验服务异常（dev server 未启动或端点不可用）'
-      return ''
-    },
-    // 预览列宽度（像素）：chromeOff 时占满整屏（截图/真机模式，非“宽度调整”场景）；
-    // 否则使用 _previewWidthPx 并夹到 previewBounds（拖拽与渲染共用同一口径，杜绝两套夹取打架）
-    previewWidth() {
-      if (this.chromeOff) return this.stageWidth
-      const { min, max } = this.previewBounds
-      const w = this._previewWidthPx || PREVIEW_MIN
-      return Math.max(min, Math.min(max, w))
-    },
-    /** 视口宽（响应式：随 stageWidth / colsWidth 的实测更新一起重算） */
-    viewportWidth() {
-      // 依赖 stageWidth 以便窗口缩放时重算；取值仍用 innerWidth（vw 口径与 CSS 一致）
-      void this.stageWidth
-      return typeof window !== 'undefined' ? window.innerWidth : 1280
-    },
-    /** 中栏软目标宽：屏宽 1/3，且不低于硬下限（下发给 CSS `.debug` 的 min-width） */
-    debugSoftWidth() {
-      return Math.max(DEBUG_MIN_FLOOR, Math.floor(this.viewportWidth / 3))
-    },
-    /** 预览列宽度区间：[188, min(舞台宽/2, 舞台宽 - 右栏下限 - 中栏软目标)]。
-     *  只依赖舞台宽与视口宽（不反向依赖中右两栏实测），杜绝循环夹取。 */
-    previewBounds() {
-      const stage = this.stageWidth || 0
-      const byHalf = Math.floor(stage / 2)
-      const byWorkspace = stage - API_MIN - this.debugSoftWidth
-      return { min: PREVIEW_MIN, max: Math.max(PREVIEW_MIN, Math.min(byHalf, byWorkspace)) }
-    },
-    /** 中栏（调试面板）实际最小宽：软目标（屏宽 1/3）优先，空间不足时退让到硬下限 */
-    debugMinWidth() {
-      const cols = this.colsWidth || Math.max(0, (this.stageWidth || 0) - this.previewWidth)
-      return Math.max(DEBUG_MIN_FLOOR, Math.min(this.debugSoftWidth, Math.floor(cols) - API_MIN))
-    },
-    /** 右栏（接口调用面板）宽度区间：常规 [320, 两栏容器宽 - 中栏最小宽]；
-     *  容器实在放不下 320 时（窄窗口 + 预览列已占位）整体退让到剩余空间，绝不撑破容器
-     *  —— 撑破会让面板被推出视口、分隔条接缝与面板边缘脱节，表现为「拖到极限就跳」。 */
-    apiPanelBounds() {
-      const cols = this.colsWidth || Math.max(0, (this.stageWidth || 0) - this.previewWidth)
-      const max = Math.max(API_ABS_MIN, Math.floor(cols) - this.debugMinWidth)
-      return { min: Math.min(API_MIN, max), max }
-    },
-    // 画布实际宽度（列宽，整数）：canvas-bar__size 实时显示用，拖拽分隔条时随之变化
-    canvasW() {
-      return Math.round(this.previewWidth || 375)
-    },
-    /** 当前卡片名（AI 开发助手头部展示；列表未加载完时回落 id） */
-    selectedCardName() {
-      const hit = this.cardList.find((c) => c.id === this.selectedId)
-      return (hit && hit.name) || this.selectedId || ''
-    },
-    // 右侧「接口调用」面板宽度（像素）：夹到 apiPanelBounds，保证中栏不小于屏宽 1/3、右栏不小于 320px
-    apiPanelWidth() {
-      const { min, max } = this.apiPanelBounds
-      const w = this._apiPanelWidthPx || 360
-      return Math.max(min, Math.min(max, w))
-    },
-    // 缩放外框占满整列（宽高交由 CSS flex 填满；画布不再做 transform 缩放，直接按实际尺寸布局）
-    frameStyle() {
-      return {}
-    },
-  },
-  watch: {
-    // 切到「组件结构」以外的 tab 时，取消任何节点的选中状态
-    activeTab(val) {
-      if (val !== 'structure') {
-        this.selectedNodeId = ''
-        // 离开组件结构 tab：结构树被卸载，hover 参考线不再有意义，清除避免残留
-        clearHoverEl()
-      }
-    },
-    aiChatOpen(val) {
-      try {
-        sessionStorage.setItem('cardbuddy:ai-chat-open', val ? '1' : '0')
-      } catch {
-        /* sessionStorage 不可用时忽略 */
-      }
-    },
-    // 主题切换：把 'dark' / 'light' 写到 <html data-theme>，驱动 CSS 变量整体换肤
-    theme(val) {
-      document.documentElement.dataset.theme = val
-    },
-    // 「接口调用」面板展开/收起状态变化（顶栏按钮 toggleApiPanel 或面板内 ✕ 关闭）时统一持久化
-    apiPanelOpen(val) {
-      try {
-        localStorage.setItem('cardbuddy:api-panel-open', val ? '1' : '0')
-      } catch (e) {
-        /* localStorage 不可用时忽略 */
-      }
-    },
-  },
-  beforeUnmount() {
-    if (this.viewportObserver) this.viewportObserver.disconnect()
-    if (this._stageObserver) this._stageObserver.disconnect()
-    if (this.saveTimer) clearTimeout(this.saveTimer)
-    if (this.syncTimer) clearTimeout(this.syncTimer)
-    if (this.saveRemoteTimer) clearTimeout(this.saveRemoteTimer)
-    window.removeEventListener('keydown', this.onKeydown)
-  },
-  mounted() {
-    // 视口高度随窗口弹性填充，实测高度同步到 canvas-bar 尺寸读数
-    this.viewportObserver = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        this.viewportHeight = Math.round(entry.contentRect.height)
-      }
-    })
-    if (this.$refs.phoneViewport) this.viewportObserver.observe(this.$refs.phoneViewport)
-    // 预览区宽度可调：实测舞台尺寸，驱动 previewWidth/frameStyle 自适应窗口变化
-    this.loadPreviewWidth()
-    this.loadApiPanelWidth()
-    this._stageObserver = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        // 舞台与两栏容器分别实测：右栏夹取要用 colsWidth（不含预览列），不能拿舞台宽反推
-        if (entry.target === this.$refs.colsEl) {
-          this.colsWidth = Math.round(entry.contentRect.width)
-          continue
-        }
-        this.stageWidth = Math.round(entry.contentRect.width)
-        this.stageHeight = Math.round(entry.contentRect.height)
-      }
-    })
-    if (this.$refs.stageEl) this._stageObserver.observe(this.$refs.stageEl)
-    if (this.$refs.colsEl) this._stageObserver.observe(this.$refs.colsEl)
-    // 全局键盘快捷键：复制/粘贴/副本/删除/撤销/重做/取消选中（见 onKeydown）
-    window.addEventListener('keydown', this.onKeydown)
-  },
-  async created() {
-    // ynet.callJSAPI 统一桩：所有 jsapi 模拟集中在 runtime/jsapi-mock.js 分发
-    // （alertCard / closeAlertCard / alertDialog / showToast），不真正发请求。
-    installJsApiMock(cardRuntime)
-    // 纯净截图模式：?chrome=off 触发（隐藏调试外壳，见 template 的 v-show）
-    const chromeParam = new URLSearchParams(location.search).get('chrome')
-    this.chromeOff = chromeParam === 'off' || chromeParam === ''
-    // 主题：恢复本地持久化（默认深色）；尽早应用到 <html>，避免首帧闪烁
-    try {
-      const t = localStorage.getItem('cardbuddy:theme')
-      if (t === 'light' || t === 'dark') this.theme = t
-    } catch (e) {
-      /* localStorage 不可用时忽略 */
-    }
-    document.documentElement.dataset.theme = this.theme
-    // 右侧「接口调用」面板：恢复本地持久化的展开/收起状态（默认展开）
-    try {
-      const v = localStorage.getItem('cardbuddy:api-panel-open')
-      if (v === '0') this.apiPanelOpen = false
-    } catch (e) {
-      /* localStorage 不可用时忽略 */
-    }
-    // 实时拉取卡片列表（不再依赖启动快照），再载入首张卡
-    await this.fetchCardList()
-    // 深链：若 URL 带 ?card=<id> 且命中列表，则预选该卡（供「远端预览」二维码扫码直达）
-    const deep = new URLSearchParams(location.search).get('card')
-    // 本地持久化：上次选中的卡片（无 URL 深链时优先恢复，而不是每次都回到首卡）
-    let persisted = null
-    try {
-      const v = localStorage.getItem('cardbuddy:selected-card')
-      if (v && this.cardList.some((c) => c.id === v)) persisted = v
-    } catch (e) {
-      /* localStorage 不可用时忽略 */
-    }
-    const initial =
-      deep && this.cardList.some((c) => c.id === deep)
-        ? deep
-        : persisted || (this.cardList[0] && this.cardList[0].id)
-    if (initial) {
-      this.selectedId = initial
-      await this.loadCard(this.selectedId)
-    }
-    // 数据绑定（rt.rootScope）深度监听：任意编辑实时回写 schema 的权威数据位 ——
-    // 已配置 mock 的 key 回写 dictionary.mocks[key]，其余回写 inputParams[].defaultValue，
-    // 保证「保存到本地」基于最新数据绑定；预览也经 rt 响应式实时刷新。
-    // ⚠️ 此处【不】写历史——历史由「变量 → 配置变量 mock」视图的「应用」按钮（schema-commit）落定，
-    // 与节点属性/事件面板一致：实时编辑只更新预览与内存，点「应用」才记一笔撤销记录。
-    this.$watch(
-      () => this.rt.rootScope,
-      () => {
-        this.syncDataToSchema()
-      },
-      { deep: true }
-    )
-    // 监听 dev server 推送的磁盘变更事件：同步远程 / 其他窗口保存 / 手工编辑改了
-    // src/cards 后，预览重新拉取列表并在当前卡片受影响时即时重载，保证磁盘是唯一真相。
-    // 订阅磁盘变更推送：部署态经本地服务 SSE，开发期经 Vite HMR（见 @/api.js）
-    this.setupCardsChanged()
-  },
-  methods: {
-    /** 订阅磁盘变更推送：部署态经本地服务 SSE，开发期经 Vite HMR（见 @/api.js）。可重复调用以切换数据源。 */
-    setupCardsChanged() {
-      if (this._unsubCardsChanged) {
-        try { this._unsubCardsChanged() } catch (e) { /* ignore */ }
-        this._unsubCardsChanged = null
-      }
-      // 新订阅建立即进入「连接中」，待首帧 open / error 事件回写真实态
-      this.devSvcLive = 'connecting'
-      this._unsubCardsChanged = subscribeCardsChanged(
-        (payload) => this.onCardsChanged(payload),
-        (state) => this.onDevServiceState(state)
-      )
-    },
-    /**
-     * SSE / Vite HMR 连接态变化时回调，驱动顶栏「连接」图标实时反映服务端运行态。
-     * 断线 watchdog：若持续处于「连接中」超过 8s 仍未 open（服务端确已停止），翻为「已断开」，
-     * 避免用户看到永远转圈的黄灯误以为还活着；EventSource 后台仍会自动重连，恢复时 onopen 会翻回 open。
-     */
-    onDevServiceState(state) {
-      const wasConnecting = this.devSvcLive === 'connecting'
-      this.devSvcLive = state
-      if (state === 'open') {
-        // 真正重连成功：清除「已断开」标志，顶部提示条随之关闭
-        this.devSvcDown = false
-      } else if (state === 'closed') {
-        // 服务确已彻底关闭（EventSource readyState===2 / 显式 close）：标记已断开
-        this.devSvcDown = true
-      }
-      // 注意：state==='connecting' 且此前已 devSvcDown===true（断开后重试）时，
-      // 保持 devSvcDown 为 true，使提示条在重连过程中持续显示，不闪退。
-      if (state === 'connecting') {
-        // 仅在「从其他态首次进入连接中」时启动 watchdog；
-        // 浏览器 EventSource 断链后会每 ~3s 自动重连并重发 onerror('connecting')，
-        // 若每次都重置计时器，则永远到不了 8s —— 故重复 connecting 不再重置。
-        if (!wasConnecting && !this._svcWatchdog) {
-          this._svcWatchdog = setTimeout(() => {
-            if (this.devSvcLive === 'connecting') {
-              this.devSvcLive = 'closed'
-              // watchdog 确认服务停止：标记已断开（即便后续重试翻回 connecting 也保持）
-              this.devSvcDown = true
-            }
-            this._svcWatchdog = null
-          }, 8000)
-        }
-      } else if (this._svcWatchdog) {
-        clearTimeout(this._svcWatchdog)
-        this._svcWatchdog = null
-      }
-    },
-    /** 保存「本地开发服务」配置并即时切换数据源 */
-    saveDevService() {
-      saveDevServiceConfig(this.devServiceForm)
-      this.apiBaseResolved = resolveApiBase()
-      this.setupCardsChanged()
-      this.devServiceOpen = false
-      showAppToast('本地开发服务配置已保存', 'ok')
-      this.fetchCardList()
-    },
-    // —— 列宽拖拽（左：预览列 / 右：接口调用面板）——
-    /**
-     * 分隔条拖拽统一入口：Pointer Events + 指针捕获。
-     * 曾经左条绑 mousedown、处理函数却按 pointer 写（ev.pointerId 为 undefined → 捕获失败，
-     * pointermove 只在 6px 命中区内触发），表现为「左侧分隔条拖不动」；两条统一走这里。
-     * 捕获后即使松手点在视口外，pointerup / pointercancel 仍回送本元素，不会残留拖拽态。
-     * @param {PointerEvent} ev
-     * @param {(e: PointerEvent) => void} onMove 每次移动的夹取写入
-     * @param {() => void} onEnd 收尾（清光标 / 持久化）
-     */
-    beginColumnDrag(ev, onMove, onEnd) {
-      const el = ev && ev.currentTarget
-      if (!el) return
-      const pointerId = ev.pointerId
-      try {
-        el.setPointerCapture(pointerId)
-      } catch {
-        /* 不支持捕获时退化为元素级监听 */
-      }
-      const finish = () => {
-        el.removeEventListener('pointermove', onMove)
-        el.removeEventListener('pointerup', finish)
-        el.removeEventListener('pointercancel', finish)
-        window.removeEventListener('blur', finish)
-        try {
-          if (el.hasPointerCapture?.(pointerId)) el.releasePointerCapture(pointerId)
-        } catch {
-          /* 已释放 */
-        }
-        document.body.style.cursor = ''
-        document.body.style.userSelect = ''
-        onEnd()
-      }
-      document.body.style.cursor = 'col-resize'
-      document.body.style.userSelect = 'none'
-      el.addEventListener('pointermove', onMove)
-      el.addEventListener('pointerup', finish)
-      el.addEventListener('pointercancel', finish)
-      window.addEventListener('blur', finish) // 窗口失焦兜底：切走 / 最小化不卡死拖拽态
-    },
-    // 左分隔条：拖动改变预览列宽度（写像素，previewWidth / canvasW 自动联动），松手持久化
-    startDrag(ev) {
-      if (this.chromeOff) return
-      const stage = this.$refs.stageEl
-      if (!stage) return
-      const baseLeft = stage.getBoundingClientRect().left
-      this.dragging = true
-      this.beginColumnDrag(
-        ev,
-        (e) => {
-          const { min, max } = this.previewBounds
-          this._previewWidthPx = Math.max(min, Math.min(max, Math.round(e.clientX - baseLeft)))
-        },
-        () => {
-          this.dragging = false
-          this.savePreviewWidth()
-        }
-      )
-    },
-    // 右分隔条：拖动改变「接口调用」面板宽度（向左加宽 / 向右收窄），松手持久化。
-    // 基准取两栏容器右缘（= 面板右缘），夹取用 apiPanelBounds，与渲染口径完全一致 → 极限处不再跳动
-    startApiDrag(ev) {
-      if (this.chromeOff || !this.apiPanelOpen) return
-      const cols = this.$refs.colsEl
-      if (!cols) return
-      const baseRight = cols.getBoundingClientRect().right
-      this.apiDragging = true
-      this.beginColumnDrag(
-        ev,
-        (e) => {
-          const { min, max } = this.apiPanelBounds
-          this._apiPanelWidthPx = Math.max(min, Math.min(max, Math.round(baseRight - e.clientX)))
-        },
-        () => {
-          this.apiDragging = false
-          this.saveApiPanelWidth()
-        }
-      )
-    },
-    // 读取上次保存的预览列宽度（像素）；首次打开（无记录）时保持默认 372px
-    loadPreviewWidth() {
-      try {
-        const v = localStorage.getItem('cardbuddy:preview-width')
-        if (v != null) {
-          const px = parseInt(v, 10)
-          if (!Number.isNaN(px) && px >= 188) this._previewWidthPx = px
-        }
-      } catch (e) { /* localStorage 不可用时忽略 */ }
-    },
-    // 持久化预览列宽度（像素）到 localStorage
-    savePreviewWidth() {
-      try {
-        localStorage.setItem('cardbuddy:preview-width', String(Math.round(this._previewWidthPx)))
-      } catch (e) { /* 忽略 */ }
-    },
-    // 预设尺寸切换：375 / 188 一键设定预览列宽度；高度随列高动态保持一致（由 CSS flex 自动填充）
-    setPresetWidth(w) {
-      if (this.chromeOff) return
-      const { min, max } = this.previewBounds
-      this._previewWidthPx = Math.max(min, Math.min(max, w))
-      this.savePreviewWidth()
-    },
-    // 读取上次保存的接口调用面板宽度（像素）；首次打开（无记录）时保持默认 360px
-    loadApiPanelWidth() {
-      try {
-        const v = localStorage.getItem('cardbuddy:api-panel-width')
-        if (v != null) {
-          const px = parseInt(v, 10)
-          if (!Number.isNaN(px) && px >= 320) this._apiPanelWidthPx = px
-        }
-      } catch (e) { /* localStorage 不可用时忽略 */ }
-    },
-    // 持久化接口调用面板宽度（像素，取夹取后的实际值）到 localStorage
-    saveApiPanelWidth() {
-      try {
-        localStorage.setItem('cardbuddy:api-panel-width', String(Math.round(this.apiPanelWidth)))
-      } catch (e) { /* 忽略 */ }
-    },
-    /** 背景下拉：选中某项 */
-    chooseBg(key) {
-      this.canvasBg = key
-    },
-    onSelect(id) {
-      this.loadingCard = true
-      // 乐观置位：下拉立刻跟手。持久化交给 loadCard —— 载入成功才记，
-      // 避免把一张打不开的卡记成「上次选中」，下次进页面直接白屏
-      this.selectedId = id
-      this.loadCard(id, { clearAll: true })
-    },
-    /**
-     * 置为「当前卡」并持久化（下次打开页面自动恢复，沿用 cardbuddy: 前缀约定）。
-     * 顶栏下拉、网格高亮、校验徽标、RenderTree 的 key、导入元数据的过期判定全读 selectedId，
-     * 所以由 loadCard 统一置位：任何调用点（下拉选中、网格点卡、新增空白卡、删除后切下一张）
-     * 都不会再出现「画布切过去了、下拉还停在旧卡」的错位。
-     */
-    selectCard(id) {
-      this.selectedId = id
-      try {
-        localStorage.setItem('cardbuddy:selected-card', id)
-      } catch (e) {
-        /* localStorage 不可用时忽略 */
-      }
-    },
-    /** 打开卡片网格预览弹窗 */
-    openGallery() {
-      if (!this.cardList.length) return
-      this.galleryOpen = true
-    },
-    /** 打开「新增空白卡片」弹窗：先刷一次列表，重名判定才拿得到最新本地卡片（别的窗口 / 同步远程可能刚建过卡） */
-    openNewCard() {
-      this.newCardOpen = true
-      this.fetchCardList()
-    },
-    /** 关闭卡片网格预览弹窗 */
-    closeGallery() {
-      this.galleryOpen = false
-    },
-    /**
-     * 顶栏「打开目录」按钮：请求本地开发服务在系统文件管理器打开
-     * 当前卡片对应文件夹（src/cards/<selectedId>）。跨平台（win/mac）由后端完成。
-     */
-    async openCardFolder() {
-      if (!this.selectedId) return
-      try {
-        const res = await apiFetch('/__open-folder', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ id: this.selectedId }),
-        })
-        const data = (res.headers.get('content-type') || '').includes('application/json')
-          ? await res.json().catch(() => ({}))
-          : {}
-        if (!res.ok || !data.ok) {
-          showAppToast(data.error || '打开文件夹失败', 'err')
-        } else {
-          showAppToast('已打开卡片文件夹', 'ok')
-        }
-      } catch (e) {
-        showAppToast('无法连接本地开发服务，请确认已启动', 'err')
-      }
-    },
-    /**
-     * 底部状态条刷新按钮：重新从本地开发服务拉取当前卡片并重建预览。
-     */
-    async refreshCard() {
-      if (!this.selectedId || this.refreshing) return
-      this.refreshing = true
-      try {
-        await this.loadCard(this.selectedId)
-      } finally {
-        this.refreshing = false
-      }
-    },
-    // 切换深/浅主题：写入 <html data-theme> 并持久化，刷新后保持
-    toggleTheme() {
-      this.theme = this.theme === 'light' ? 'dark' : 'light'
-      try {
-        localStorage.setItem('cardbuddy:theme', this.theme)
-      } catch (e) {
-        /* localStorage 不可用时忽略 */
-      }
-    },
-    /** 展开/收起右侧常驻「接口调用」面板（默认展开）；持久化由 apiPanelOpen 监听器统一处理 */
-    toggleApiPanel() {
-      this.apiPanelOpen = !this.apiPanelOpen
-    },
-    /**
-     * 整卡校验徽标（Q3：仅 ok/error，不展开 bindingErrors 明细）。
-     * 调 /__validate（契约硬校验）与 /__render-status（结构合法 + 渲染不抛错）两个既有端点，
-     * 均读磁盘，故在「载入 / 本地保存」后刷新——编辑→本地保存→徽标即时反映。
-     * 语义三处一致：ok = 结构合法 + 渲染不抛错，**不保证画得对**（视觉见截图）。
-     * bindingErrors 明细不进徽标（已有 DebugPanel 状态栏单独展示）。
-     */
-    async refreshValidateBadge() {
-      const id = this.selectedId
-      if (!id || !this.preview) return
-      if (this.validateTimer) clearTimeout(this.validateTimer)
-      this.validateBadge = { ...this.validateBadge, state: 'pending' }
-      // 轻量去抖：连续保存/热更新时只取最后一次结果
-      await new Promise((r) => {
-        this.validateTimer = setTimeout(r, 120)
-      })
-      if (this.selectedId !== id) return // 已切卡，丢弃过期结果
-      try {
-        const [vRes, rRes] = await Promise.all([
-          apiFetch(`/__validate/${encodeURIComponent(id)}`),
-          apiFetch(`/__render-status/${encodeURIComponent(id)}`),
-        ])
-        // 503 = 未装 python（环境缺失，非卡片问题）
-        if (!vRes.ok) {
-          this.validateBadge = { ...this.validateBadge, state: vRes.status === 503 ? 'nopython' : 'fail' }
-          return
-        }
-        const v = await vRes.json().catch(() => null)
-        const r = rRes.ok ? await rRes.json().catch(() => null) : null
-        if (!v) {
-          this.validateBadge = { ...this.validateBadge, state: 'fail' }
-          return
-        }
-        const contractOk = !!v.ok
-        // 渲染端点异常不强行判错（避免 dev server 预热期 SSR 冷启动误报）
-        const renderOk = r ? !!r.renderOk : true
-        const ok = contractOk && renderOk
-        const next = ok ? 'ok' : 'error'
-        const changed = this.validateBadge.state !== next
-        this.validateBadge = {
-          state: next,
-          errors: (v.errors || []).length,
-          warnings: (v.warnings || []).length,
-          renderOk,
-          ts: Date.now(),
-        }
-        if (changed && (next === 'ok' || next === 'error')) this.celebrateValidate(next)
-      } catch (e) {
-        // 网络/服务不可用：保底不阻断编辑，标记 fail（fail 不触发动画）
-        this.validateBadge = { ...this.validateBadge, state: 'fail' }
-      }
-    },
-    /** 状态跳变时，在徽标局部触发庆祝动画：徽标弹跳 + 碎玻璃碎屑沿轮廓放射爆开，碎屑颜色跟随目标状态主色。仅局部，不铺屏。 */
-    celebrateValidate(state = 'ok') {
-      const el = this.$refs.validateBadgeEl
-      if (!el) return
-      if (window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches) return
-      // 徽标弹跳
-      el.classList.remove('is-celebrating')
-      void el.offsetWidth // 重排以重启动画
-      el.classList.add('is-celebrating')
-      setTimeout(() => el.classList.remove('is-celebrating'), 600)
-      // 碎屑颜色跟随目标状态徽标主色（--ok / --danger / --warn / --text-faint）
-      const r = el.getBoundingClientRect()
-      const colorVar = { ok: '--ok', error: '--danger', pending: '--warn', fail: '--text-faint', nopython: '--text-faint' }[state] || '--ok'
-      const fallback = { ok: '#52c41a', error: '#F5222D', pending: '#FAAD14', fail: '#8c8c8c', nopython: '#8c8c8c' }[state] || '#52c41a'
-      const badgeColor = getComputedStyle(el).getPropertyValue(colorVar).trim() || fallback
-      const box = document.createElement('div')
-      box.className = 'app__confetti'
-      box.style.left = r.left + r.width / 2 + 'px'
-      box.style.top = r.top + r.height / 2 + 'px'
-      // 碎玻璃碎片：从徽标矩形轮廓迸出，沿外法线方向飞散；不规则尖锐多边形 + 尺寸不一
-      const count = 22
-      const clips = [
-        'polygon(50% 0%, 0% 100%, 100% 100%)',
-        'polygon(62% 0%, 100% 40%, 45% 100%, 0% 52%)',
-        'polygon(0% 0%, 100% 18%, 82% 100%, 12% 70%)',
-        'polygon(22% 0%, 100% 8%, 88% 100%, 0% 76%)',
-        'polygon(0% 32%, 100% 0%, 76% 100%, 18% 86%)',
-        'polygon(8% 0%, 100% 22%, 70% 100%, 0% 64%)',
-        'polygon(0% 12%, 100% 0%, 100% 78%, 30% 100%, 12% 55%)',
-      ]
-      const halfW = r.width / 2
-      const halfH = r.height / 2
-      for (let i = 0; i < count; i++) {
-        const bit = document.createElement('span')
-        bit.className = 'app__confetti-bit'
-        // 在徽标矩形轮廓上随机取一点作为迸发起点
-        const edge = (Math.random() * 4) | 0
-        let px, py
-        if (edge === 0) { px = (Math.random() * 2 - 1) * halfW; py = -halfH }
-        else if (edge === 1) { px = halfW; py = (Math.random() * 2 - 1) * halfH }
-        else if (edge === 2) { px = (Math.random() * 2 - 1) * halfW; py = halfH }
-        else { px = -halfW; py = (Math.random() * 2 - 1) * halfH }
-        // 沿轮廓点的外法线方向飞出 + 微抖动
-        const len = Math.hypot(px, py) || 1
-        const a = Math.atan2(py / len, px / len) + (Math.random() - 0.5) * 0.5
-        const dist = 16 + Math.random() * 26
-        bit.style.setProperty('--sx', px.toFixed(1) + 'px')
-        bit.style.setProperty('--sy', py.toFixed(1) + 'px')
-        bit.style.setProperty('--tx', (Math.cos(a) * dist).toFixed(1) + 'px')
-        bit.style.setProperty('--ty', (Math.sin(a) * dist).toFixed(1) + 'px')
-        bit.style.setProperty('--rot', (Math.random() * 720 - 360).toFixed(0) + 'deg')
-        bit.style.setProperty('--clip', clips[(Math.random() * clips.length) | 0])
-        bit.style.setProperty('--c', badgeColor)
-        // 每片独立透明度，半透明玻璃感
-        bit.style.setProperty('--o', (0.68 + Math.random() * 0.27).toFixed(2))
-        // 三层尺寸分布：长薄片 / 中等碎块 / 细微粉尘，强化碎裂参差感
-        const roll = Math.random()
-        let w, h
-        if (roll < 0.35) { w = 1.5 + Math.random() * 2; h = 10 + Math.random() * 10 }       // 细长薄片
-        else if (roll < 0.75) { w = 4 + Math.random() * 5; h = w * (0.6 + Math.random() * 0.8) } // 中等碎块
-        else { w = 2 + Math.random() * 2.5; h = w }                            // 细微粉尘
-        bit.style.width = w.toFixed(0) + 'px'
-        bit.style.height = h.toFixed(0) + 'px'
-        box.appendChild(bit)
-      }
-      document.body.appendChild(box)
-      setTimeout(() => box.remove(), 800)
-    },
-    /** 实时从磁盘读取并载入指定卡片（GET /__card/<id>），不读任何缓存 */
-    async loadCard(id, opts = {}) {
-      if (!id) return
-      this.loadingCard = true
-      try {
-      const res = await apiFetch(`/__card/${encodeURIComponent(id)}`)
-      if (!res.ok) {
-        this.rt.pushError('loadCard', 'HTTP ' + res.status)
-        return
-      }
-      const fresh = await res.json()
-      if (!fresh.schema) {
-        this.rt.pushError('loadCard', 'schema 读取失败')
-        return
-      }
-      // 载入成功即认定这张卡为当前卡：必须在 fetchImportMeta / refreshValidateBadge 之前，
-      // 二者都以 selectedId 作「是否已切卡」的判据，晚置位会把新卡的结果当过期丢掉
-      this.selectCard(id)
-      // 切换卡片：清全部错误；刷新/重建预览：只清绑定错误，保留事件错误
-      if (opts.clearAll) {
-        this.rt.clearErrors()
-      } else {
-        this.rt.clearBindingErrors()
-      }
-      this.rt.clearApiCalls()
-      // schema 被事件编辑器改后重建时保留当前数据绑定编辑，避免被磁盘 data（由 schema 派生）覆盖。
-      // 数据绑定改为由 schema 单向派生，不再读回 data.json 文件。
-      if (!opts.keepScope) this.rt.setRootScope(buildDataFromSchema(fresh.schema, WITH_MOCKS))
-      this.currentCard = { schema: fresh.schema }
-      this.currentSchema = fresh.schema
-      // 重置并在载入后拉取导入来源元数据（Phase E）：本地新建卡无 .import-meta.json → null，
-      // 顶栏「版本推送」据此置灰（无来源则无远端可推送版本）。同步远程后 onRefresh 也会回到此处刷新。
-      this.cardImportMeta = null
-      this.fetchImportMeta(id)
-      // 记录本地真实版本基线（磁盘当前内容），供「保存到本地」按钮判断与本地是否一致。
-      // localData 由 schema 派生（与渲染注入同源），保证纯数据编辑也能触发脏标记。
-      this.localSchema = this.cloneSchema(fresh.schema)
-      this.localData = this.cloneData(buildDataFromSchema(fresh.schema, WITH_MOCKS))
-      this.preview = buildPreview(fresh.schema)
-      // Task #5：把 Property 树模型森林暴露到 window，供浏览器内 AI / skill 直接读取节点可编辑结构
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(fresh.schema)
-      // 标脏后重新挂 data-card-ready：截图模式下 screenshot.js 等该属性出现再截，
-      // 保证截到的是已挂载的首帧而非空壳。先置 false 让切换卡片时属性短暂消失，
-      // 待 RenderTree 重新挂载后于 nextTick 置 true。
-      this.cardReady = false
-      this.$nextTick(() => {
-        this.cardReady = true
-      })
-      // 重建后立即把当前数据绑定同步进 schema（尤其 keepScope 时 currentSchema 被重置为磁盘版）
-      this.syncDataToSchema()
-      this.selectedNodeId = ''
-      // 以刚载入的磁盘版本作为「已提交基线」（仅 schema；数据绑定由 schema.defaultValue 派生，单向）。
-      // 撤销/重做历史快照也只存 schema，还原时由 buildDataFromSchema(schema) 重建数据绑定。
-      this.baseline = {
-        schema: this.cloneSchema(this.currentSchema),
-      }
-      // 递增 token 强制 RenderTree 重新挂载（重跑 init），保证新卡片 / 新 schema 的
-      // 初始化动作（如 assetOverview 计算 ratio）一定在 created 阶段执行。
-      this.reloadToken += 1
-      // 切换主卡片时清理弹窗与设备级模拟 UI，避免残留引用旧上下文
-      clearAllAlerts()
-      clearDeviceUI()
-      // 载入即刷新整卡校验徽标（端点读磁盘，载入后状态最新）
-      this.refreshValidateBadge()
-      // 载入编辑历史（落盘在 .history/）：重置 past/future 并重建撤销栈
-      await this.loadHistory(id)
-      } finally {
-        this.loadingCard = false
-      }
-    },
-    /**
-     * 编辑历史：深拷贝 schema（剥离运行时 _schemaNode 自引用）。
-     */
-    cloneSchema(schema) {
-      if (!schema) return null
-      return JSON.parse(JSON.stringify(schema, (k, v) => (k === '_schemaNode' ? undefined : v)))
-    },
-    /**
-     * 归一化用于结构比较：忽略由数据绑定推导写入的 dictionary.inputParams[].defaultValue
-     * （这部分是数据绑定镜像，非结构性编辑，不应触发快照）。
-     */
-    normalizeForCompare(schema) {
-      const clone = this.cloneSchema(schema)
-      if (clone && clone.dictionary && Array.isArray(clone.dictionary.inputParams)) {
-        for (const p of clone.dictionary.inputParams) {
-          if (p && typeof p === 'object') p.defaultValue = undefined
-        }
-      }
-      return clone
-    },
-    /** 结构性相等（忽略数据绑定 defaultValue 噪声） */
-    structuralEqual(a, b) {
-      if (!a || !b) return a === b
-      return JSON.stringify(this.normalizeForCompare(a)) === JSON.stringify(this.normalizeForCompare(b))
-    },
-    /** 深拷贝数据绑定（rt.rootScope）；同样剥离运行时 _schemaNode，避免自引用 */
-    cloneData(data) {
-      if (data == null) return data
-      return JSON.parse(JSON.stringify(data, (k, v) => (k === '_schemaNode' ? undefined : v)))
-    },
-    /** 数据绑定（rt.rootScope）深层相等：用于判断绑定编辑是否产生了新快照 */
-    dataEqual(a, b) {
-      return JSON.stringify(a) === JSON.stringify(b)
-    },
-    /**
-     * 把历史快照（某一旧版本 { schema }）应用回当前编辑态：替换 currentSchema 与数据绑定，
-     * 重建预览/模型视图，但不产生新的历史记录（撤销/重做本身是导航，不是新修改）。
-     * 数据绑定由 buildDataFromSchema(schema) 从快照的 schema（含 defaultValue 镜像）重建，
-     * 还原后再 syncDataToSchema，保证 schema.dictionary.inputParams.defaultValue 与新数据绑定一致。
-     */
-    applySchemaSnapshot(snapshot) {
-      const id = this.selectedId
-      if (!id || !snapshot) return
-      const schema = snapshot.schema || snapshot
-      // 快照只存 schema；数据绑定由其派生。若老快照带 data 则优先沿用（历史兼容）。
-      const data = snapshot.data != null ? snapshot.data : buildDataFromSchema(schema, WITH_MOCKS)
-      this.currentSchema = this.cloneSchema(schema)
-      this.rt.setRootScope(this.cloneData(data))
-      this.preview = buildPreview(this.currentSchema)
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(this.currentSchema)
-      this.syncDataToSchema()
-      this.selectedNodeId = ''
-      this.reloadToken += 1
-      this.refreshValidateBadge()
-    },
-    /** 提交一次编辑：与 baseline（仅 schema）比较，schema 结构或数据绑定任一变化即算改动，
-     *  把「上一版本(baseline)」压入 past 并落盘（仅 schema），清空重做栈。
-     *  数据绑定比较用 buildDataFromSchema(baseline.schema) 派生，与 baseline 记录时一致。 */
-    commitHistory() {
-      if (!this.currentSchema || !this.baseline) return
-      const sameSchema = this.structuralEqual(this.currentSchema, this.baseline.schema)
-      const sameData = this.dataEqual(this.rt.rootScope, buildDataFromSchema(this.baseline.schema, WITH_MOCKS))
-      if (sameSchema && sameData) return
-      const previous = { schema: this.baseline.schema }
-      this.past.push(previous)
-      if (this.past.length > 30) this.past.shift()
-      this.future = []
-      this.baseline = { schema: this.cloneSchema(this.currentSchema) }
-      // 落盘：把「上一版本」写入卡片同目录 .history/（最多 30 个，由服务端裁剪）
-      this.persistSnapshot(previous)
-    },
-    /** 编辑落定防抖：连续编辑（如连续改属性）合并为一次快照 */
-    scheduleCommit() {
-      if (this._commitTimer) clearTimeout(this._commitTimer)
-      this._commitTimer = setTimeout(() => {
-        this._commitTimer = null
-        this.commitHistory()
-      }, 500)
-    },
-    /** 把上一版本 { schema } 落盘到 .history/（fire-and-forget，失败仅告警；data 由服务端从 schema 派生） */
-    persistSnapshot(snapshot) {
-      const id = this.selectedId
-      if (!id) return
-      const schema = snapshot.schema || snapshot
-      apiFetch(`/__history/${encodeURIComponent(id)}`, {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ schema }, (k, v) => (k === '_schemaNode' ? undefined : v), 2),
-      }).catch((e) => console.warn('[历史快照落盘失败]', e))
-    },
-    /** 载入指定卡片的编辑历史（从 .history/ 读取，旧→新），用于页面重载后重建撤销栈 */
-    async loadHistory(id) {
-      this.past = []
-      this.future = []
-      try {
-        const res = await apiFetch(`/__history/${encodeURIComponent(id)}`)
-        if (!res.ok) return
-        const r = await res.json().catch(() => null)
-        const snaps = (r && r.snapshots) || []
-        // 取末尾最多 30 个作为可回退的上一版本（最新在末尾；仅 schema，data 由 schema 派生）
-        this.past = snaps.slice(-30).map((s) => ({
-          schema: s.schema,
-          data: s.data != null ? s.data : buildDataFromSchema(s.schema, WITH_MOCKS),
-        }))
-      } catch (e) {
-        console.warn('[加载编辑历史失败]', e)
-      }
-    },
-    /** 后退一步（撤销）：弹出最近一次编辑前的版本并应用 */
-    undo() {
-      if (!this.canUndo) return
-      const prev = this.past.pop()
-      this.future.push(this.baseline)
-      if (this.future.length > 30) this.future.shift()
-      this.baseline = prev
-      this.applySchemaSnapshot(prev)
-    },
-    /** 前进一步（重做）：重放被撤销的版本 */
-    redo() {
-      if (!this.canRedo) return
-      const next = this.future.pop()
-      this.past.push(this.baseline)
-      if (this.past.length > 30) this.past.shift()
-      this.baseline = next
-      this.applySchemaSnapshot(next)
-    },
-    /**
-     * 顶栏「保存到本地」：把当前显示的历史版本（撤销/重做导航到的版本，或编辑后未保存的版本）
-     * 真正写回本地磁盘（src/cards/<id>/schema.json + data.json）。写盘成功后 saveCard 会刷新
-     * 本地基线，使按钮在「当前版本 == 本地版本」时自动置灰；下一次重新打开即加载该真实版本，
-     * 而非任意历史记录。
-     */
-    async applyHistoryToLocal() {
-      // 切卡/载入进行中：currentSchema 仍是上一卡、selectedId 已是新卡，拦截以免把上一卡误写进新卡文件
-      if (this.loadingCard) return
-      if (!this.historyDirty || !this.preview || !this.selectedId) return
-      const ok = await this.saveCard()
-      if (ok) showAppToast('已将该版本保存到本地', 'ok')
-    },
-    /**
-     * schema 被事件编辑器修改后，用内存中已编辑（事件编辑器直接改了 currentSchema 对象）
-     * 的版本重建预览，不回读磁盘以免丢失编辑。强制重挂载以重跑 init 生命周期。
-     */
-    /** 实时编辑（属性/事件/数据绑定）重建预览：仅刷新预览，不写历史。
-     *  历史由「应用」按钮（onSchemaCommit）落定写入。 */
-    onSchemaChanged() {
-      const id = this.selectedId
-      if (!id || !this.currentSchema) return
-      this.reloadToken += 1
-      this.preview = buildPreview(this.currentSchema)
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(this.currentSchema)
-      this.syncDataToSchema()
-      this.selectedNodeId = ''
-    },
-    /** 「应用」按钮：以最新编辑重建预览，并写入一次历史（生成一条撤销记录）。
-     *  区别于 onSchemaChanged：这里落定历史，实时编辑路径不写历史。 */
-    onSchemaCommit() {
-      const id = this.selectedId
-      if (!id || !this.currentSchema) return
-      this.reloadToken += 1
-      this.preview = buildPreview(this.currentSchema)
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(this.currentSchema)
-      this.syncDataToSchema()
-      this.selectedNodeId = ''
-      this.commitHistory()
-    },
-    /**
-     * 把数据绑定（rt.rootScope）的编辑实时同步回 schema 的权威数据位：
-     * key 已在 dictionary.mocks 中 → 回写 mocks[key]（设计期覆盖仓）；
-     * 否则回写 schema.dictionary.inputParams[i].defaultValue（随卡发布的缺省仓）。
-     * 这样「本地保存」时 schema.json 携带最新两仓数据，而 data.json 仍只由 defaultValue 派生，
-     * mock 不会泄漏进发布数据；两仓也不会互相覆盖。
-     */
-    syncDataToSchema() {
-      const schema = this.currentSchema
-      if (!schema || !schema.dictionary || !Array.isArray(schema.dictionary.inputParams)) return
-      const root = this.rt && this.rt.rootScope
-      if (!root || typeof root !== 'object') return
-      const params = schema.dictionary.inputParams
-      const mocks = readMocks(schema)
-      for (const key of Object.keys(root)) {
-        const param = params.find((p) => p && (p.key === key || p.name === key))
-        if (!param) continue
-        // 深拷贝，避免数据绑定与 schema 共享同一引用（setRootScope 重建后会失联）
-        const value = JSON.parse(JSON.stringify(root[key], (k, v) => (k === '_schemaNode' ? undefined : v)))
-        if (mocks && Object.prototype.hasOwnProperty.call(mocks, key)) mocks[key] = value
-        else param.defaultValue = value
-      }
-    },
-    /** 结构树选中节点 */
-    onSelectNode(id) {
-      this.selectedNodeId = id || ''
-    },
-    /**
-     * 在预览树（preview.view）中按运行时 id 递归查找对应节点。
-     * @param {Object} view 预览树根（或任意子树入口）
-     * @param {string} id 目标节点的运行时 id（即 selectedNodeId 的取值）
-     * @returns {Object|null}
-     */
-    findPreviewNodeById(view, id) {
-      if (!view || id == null) return null
-      const key = String(id)
-      const walk = (node) => {
-        if (!node) return null
-        if (String(node.id) === key) return node
-        const kids = []
-        if (node.components) kids.push(...node.components)
-        if (node.slots) for (const s of node.slots) if (s.components) kids.push(...s.components)
-        for (const k of kids) {
-          const r = walk(k)
-          if (r) return r
-        }
-        return null
-      }
-      return walk(view)
-    },
-    /**
-     * 复制选中节点：把其在 schema 树中的子树深拷贝进剪贴板（含子节点）。
-     * 根节点或空选区不处理。
-     */
-    copySelectedNode() {
-      const id = this.selectedNodeId
-      if (!id || id === '_root' || !this.currentSchema || !this.preview) return
-      const vn = this.findPreviewNodeById(this.preview.view, id)
-      if (!vn) return
-      const loc = this.findSchemaNodeByComponentId(this.currentSchema.view, vn.componentId)
-      if (!loc) return
-      // 记录来源卡片 id，供跨卡片粘贴标注与兼容性校验
-      setClipboardNode(loc.node, this.selectedId)
-      showAppToast('已复制节点（含子节点）', 'ok')
-    },
-    /**
-     * 粘贴剪贴板节点到当前选区：
-     *  - 选区为容器 → 追加到其默认插槽末尾（作为子节点）；
-     *  - 选区为非容器 → 作为其后兄弟（同级相邻），禁止再把复制的节点插入为非容器的子节点；
-     *  - 选区为空或根 → 追加到根组件列表末尾。
-     * 重复粘贴互不干扰（每次都重新克隆 + 重新生成 componentId）。
-     */
-    pasteNode() {
-      const clip = getClipboardNode()
-      if (!clip || !this.currentSchema) return
-      // 跨卡片兼容性校验：克隆子树引用的组件类型必须在本编辑器组件注册表中存在，
-      // 否则粘贴到目标卡片会因找不到组件而渲染异常。未知类型直接阻断并提示。
-      const classNames = collectClassNames(clip)
-      const unknown = [...new Set(classNames.filter((c) => !COMPONENT_META[c]))]
-      if (unknown.length) {
-        showAppToast('粘贴失败：含未知组件类型 ' + unknown.join('、'), 'err')
-        return
-      }
-      const clone = JSON.parse(
-        JSON.stringify(clip, (k, v) => (k === '_schemaNode' ? undefined : v)),
-      )
-      regenerateComponentIds(clone)
-      const anchor =
-        this.selectedNodeId && this.selectedNodeId !== '_root'
-          ? this.findPreviewNodeById(this.preview.view, this.selectedNodeId)
-          : null
-      let position = 'root'
-      // 显式约束：非容器节点禁止作为「粘贴为子节点」的目标——只有容器锚点才允许 'into'，
-      // 非容器锚点一律降级为 'after'（粘为紧随其后的同级兄弟），避免把节点误塞进不可承载子节点的节点内。
-      if (anchor) position = isContainerMeta(anchor.className) ? 'into' : 'after'
-      this.insertClone(clone, anchor, position)
-      // 粘贴成功提示：区分同卡副本与跨卡片粘贴，来源卡片 id 来自剪贴板记录
-      const src = getClipboardSourceCardId()
-      if (src && src !== this.selectedId) {
-        showAppToast(`已从卡片「${src}」跨卡片粘贴到「${this.selectedId}」`, 'ok')
-      } else {
-        showAppToast('已粘贴节点（含子节点）', 'ok')
-      }
-    },
-    /**
-     * 副本：把选中节点就地复制为一个新节点，插入到其原位置之后（兄弟）。
-     * 根节点或空选区不处理。
-     */
-    duplicateNode() {
-      const id = this.selectedNodeId
-      if (!id || id === '_root' || !this.currentSchema || !this.preview) return
-      const vn = this.findPreviewNodeById(this.preview.view, id)
-      if (!vn) return
-      const loc = this.findSchemaNodeByComponentId(this.currentSchema.view, vn.componentId)
-      if (!loc) return
-      const clone = JSON.parse(
-        JSON.stringify(loc.node, (k, v) => (k === '_schemaNode' ? undefined : v)),
-      )
-      regenerateComponentIds(clone)
-      loc.parentArr.splice(loc.index + 1, 0, clone)
-      this.afterStructuralEdit(clone.componentId)
-    },
-    /**
-     * 把已生成的 schema 克隆节点插入指定位置并重建预览/选中/历史。
-     * @param {Object} clone 已重新生成 componentId 的 schema 节点
-     * @param {Object|null} anchor 锚点预览节点（null 表示根）
-     * @param {'root'|'into'|'after'} position 插入位置
-     */
-    insertClone(clone, anchor, position) {
-      const schema = this.currentSchema
-      if (position === 'root') {
-        if (!schema.view.components) schema.view.components = []
-        schema.view.components.push(clone)
-      } else if (position === 'into') {
-        const tgt = anchor && anchor._schemaNode
-        if (!tgt) {
-          if (!schema.view.components) schema.view.components = []
-          schema.view.components.push(clone)
-          this.afterStructuralEdit(clone.componentId)
-          return
-        }
-        const slotKey = getDefaultSlotKey(anchor.className)
-        let slot = (tgt.slots || []).find((s) => s.slotKey === slotKey)
-        if (!slot) {
-          if (!tgt.slots) tgt.slots = []
-          slot = { slotKey, slotScope: false, slotSwitch: '1', components: [] }
-          tgt.slots.push(slot)
-        }
-        if (!slot.components) slot.components = []
-        slot.components.push(clone)
-      } else {
-        // after：作为锚点的同父兄弟，插入其后
-        const loc = this.findSchemaNodeByComponentId(schema.view, anchor.componentId)
-        if (!loc) {
-          if (!schema.view.components) schema.view.components = []
-          schema.view.components.push(clone)
-        } else {
-          loc.parentArr.splice(loc.index + 1, 0, clone)
-        }
-      }
-      this.afterStructuralEdit(clone.componentId)
-    },
-    /**
-     * 结构性编辑（增/删/移动/粘贴/副本）后的统一收尾：
-     * 重建预览 → 暴露模型 → 同步数据绑定 → 选中新节点 → 落定历史。
-     * @param {string} [selectComponentId] 编辑后需选中的节点 componentId
-     */
-    afterStructuralEdit(selectComponentId) {
-      const schema = this.currentSchema
-      this.reloadToken += 1
-      this.preview = buildPreview(schema)
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(schema)
-      this.syncDataToSchema()
-      this.selectedNodeId = selectComponentId
-        ? this.findViewIdByComponentId(this.preview.view, selectComponentId) || ''
-        : ''
-      this.scheduleCommit()
-    },
-    /** 删除选中节点（非根）：从 schema 树移除并重建；可撤销。 */
-    deleteSelectedNode() {
-      const id = this.selectedNodeId
-      if (!id || id === '_root' || !this.currentSchema || !this.preview) return
-      const vn = this.findPreviewNodeById(this.preview.view, id)
-      if (!vn) return
-      const loc = this.findSchemaNodeByComponentId(this.currentSchema.view, vn.componentId)
-      if (!loc) return
-      loc.parentArr.splice(loc.index, 1)
-      this.reloadToken += 1
-      this.preview = buildPreview(this.currentSchema)
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(this.currentSchema)
-      this.syncDataToSchema()
-      this.selectedNodeId = ''
-      clearHoverEl()
-      this.scheduleCommit()
-    },
-    /** 页面是否存在非空文本选区：有则视为「文本复制/粘贴」意图，交还原生行为 */
-    hasTextSelection() {
-      if (typeof window === 'undefined' || !window.getSelection) return false
-      const sel = window.getSelection()
-      return !!sel && !sel.isCollapsed && sel.toString().trim() !== ''
-    },
-    /** 是否存在可用于节点操作的选区（选中了非根节点）：节点复制/粘贴/副本的前提 */
-    hasNodeSelection() {
-      return !!this.selectedNodeId && this.selectedNodeId !== '_root'
-    },
-    /** 判断按键事件焦点是否在可编辑元素内（输入框/文本域/可选文本），此时不劫持快捷键 */
-    isEditableTarget(e) {
-      const t = e.target
-      if (!t) return false
-      const tag = t.tagName
-      if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT') return true
-      if (t.isContentEditable) return true
-      return false
-    },
-    /**
-     * 全局键盘快捷键（编辑器标配）：
-     *  Ctrl/⌘+C 复制节点 · Ctrl/⌘+V 粘贴 · Ctrl/⌘+D 副本 · Delete/Backspace 删除 ·
-     *  Ctrl/⌘+Z 撤销 · Ctrl/⌘+Shift+Z / Ctrl+Y 重做 · Esc 取消选中。
-     * 焦点在输入框/JSON 编辑器等可编辑元素内时，仅放行 Esc，其余交还原生行为
-     * （避免误删节点或劫持文本撤销/复制）。
-     * 节点复制/粘贴与系统文本复制/粘贴共存判据（按优先级）：
-     *  1) 焦点可编辑 → 一律原生（文本撤销/复制/粘贴）；
-     *  2) 存在非空文本选区 → 一律原生（用户意图是文本）；
-     *  3) 节点类操作还要求已选中非根节点（粘贴另要求节点剪贴板非空），
-     *     否则不 preventDefault，把按键还给浏览器（如 ⌘D 书签）。
-     */
-    onKeydown(e) {
-      if (this.chromeOff || !this.preview) return
-      const editable = this.isEditableTarget(e)
-      const ctrl = e.ctrlKey || e.metaKey
-      const k = e.key
-
-      if (ctrl && (k === 'c' || k === 'C')) {
-        if (editable) return
-        if (this.hasTextSelection() || !this.hasNodeSelection()) return
-        this.copySelectedNode()
-        e.preventDefault()
-        return
-      }
-      if (ctrl && (k === 'v' || k === 'V')) {
-        if (editable) return
-        if (this.hasTextSelection() || !this.hasNodeSelection() || !getClipboardNode()) return
-        this.pasteNode()
-        e.preventDefault()
-        return
-      }
-      if (ctrl && (k === 'd' || k === 'D')) {
-        if (editable) return
-        if (this.hasTextSelection() || !this.hasNodeSelection()) return
-        this.duplicateNode()
-        e.preventDefault()
-        return
-      }
-      if (ctrl && (k === 'z' || k === 'Z')) {
-        if (editable) return
-        e.preventDefault()
-        if (e.shiftKey) this.redo()
-        else this.undo()
-        return
-      }
-      if (ctrl && (k === 'y' || k === 'Y')) {
-        if (editable) return
-        e.preventDefault()
-        this.redo()
-        return
-      }
-      if (k === 'Delete' || k === 'Backspace') {
-        if (editable) return
-        if (!this.selectedNodeId || this.selectedNodeId === '_root') return
-        e.preventDefault()
-        this.deleteSelectedNode()
-        return
-      }
-      if (k === 'Escape') {
-        if (this.selectedNodeId) {
-          this.selectedNodeId = ''
-          e.preventDefault()
-        }
-        return
-      }
-    },
-    /**
-     * 结构树节点 hover：把对应节点（componentId / id）解析为画布 DOM 元素，
-     * 驱动参考线框出该元素；鼠标移出节点区域（payload 为 null）则清除参考线。
-     * 解析依据：RenderTree 在组件根元素挂载 data-cid = node.componentId || node.id，
-     * 与结构树节点组件标识一致，故按 data-cid 反查即可定位画布元素。
-     * @param {{componentId:*, id:*}|null} payload
-     */
-    onHoverNode(payload) {
-      if (!payload) { clearHoverEl(); return }
-      // 离开事件：仅当离开的正是当前高亮节点时才清除（防止「进入 B 后再离开 A」的竞态误清）
-      if (payload.leave) { clearHoverEl(payload.id); return }
-      const screen = typeof document !== 'undefined' ? document.querySelector('.phone__screen') : null
-      if (!screen) { clearHoverEl(payload.id); return }
-      const esc = (v) => (window.CSS && CSS.escape) ? CSS.escape(String(v)) : String(v).replace(/["\\\]]/g, '\\$&')
-      let el = null
-      if (payload.componentId != null) el = screen.querySelector('[data-cid="' + esc(payload.componentId) + '"]')
-      if (!el && payload.id != null) el = screen.querySelector('[data-cid="' + esc(payload.id) + '"]')
-      if (el) setHoverEl(el, payload.id)
-      else clearHoverEl(payload.id)
-    },
-    /**
-     * 画布点击定位：仅当「组件结构」tab 激活且按住 Ctrl(Windows/Linux) 或 ⌘Cmd(macOS) 时生效。
-     * 取点击位置最内层组件根元素（[data-cid]），把其 componentId 解析回预览树节点，
-     * 写入 selectedNodeId（复用现有选中机制：高亮 + 结构树展开祖先 + 滚动可见）。
-     * 普通点击保持原行为不变（不干涉卡片自身运行期 click 事件）。
-     * @param {MouseEvent} e
-     */
-    onCanvasClick(e) {
-      if (!e.ctrlKey && !e.metaKey) return
-      if (this.chromeOff) return
-      const el = e.target && e.target.closest ? e.target.closest('[data-cid]') : null
-      if (!el) return
-      const cid = el.getAttribute('data-cid')
-      if (!cid) return
-      const node = this.findPreviewNodeByCid(cid)
-      if (!node) return
-      // 自动切到「组件结构」tab，并在节点树中聚焦选中该节点。
-      // 结构树挂载后会对 selectedNodeId 变化展开祖先并滚动可见；
-      // 当前不在结构树 tab 时，结构树是首次挂载即带选中态，故其
-      // selectedNodeId 监听器设为 immediate，挂载即 ensureVisible。
-      this.activeTab = 'structure'
-      this.selectedNodeId = node.id
-    },
-    /**
-     * 在预览树（preview.view）中按 componentId（回退 id）递归查找对应节点。
-     * @param {string} cid
-     * @returns {Object|null}
-     */
-    findPreviewNodeByCid(cid) {
-      const view = this.preview && this.preview.view
-      if (!view) return null
-      const key = String(cid)
-      const walk = (node) => {
-        if (!node) return null
-        const nodeCid = String(node.componentId != null ? node.componentId : node.id)
-        if (nodeCid === key) return node
-        const kids = []
-        if (node.components) kids.push(...node.components)
-        if (node.slots) for (const s of node.slots) if (s.components) kids.push(...s.components)
-        for (const k of kids) {
-          const r = walk(k)
-          if (r) return r
-        }
-        return null
-      }
-      return walk(view)
-    },
-    /**
-     * 结构树发起「添加」：打开组件选择面板，并记录插入锚点与模式。
-     * @param {{node:Object|null, mode:string}} payload
-     *   node 为右键/选中的 viewNode（className 'Root' 或组件；null 视作根）；
-     *   mode ∈ 'child' | 'before' | 'after' | 'auto'，决定 onPickComponent 的落位规则。
-     */
-    onAddNode(payload) {
-      if (!this.currentSchema) return
-      this.addNodeTarget = payload || null
-      this.addNodePanelOpen = true
-    },
-    /** 关闭组件选择面板（取消添加） */
-    cancelAddNode() {
-      this.addNodePanelOpen = false
-      this.addNodeTarget = null
-    },
-    /**
-     * 在 schema 树中定位某节点所在的容器数组与下标（用于非容器节点的"插入兄弟"）。
-     * @returns {{containerArr:Array, index:number}|null}
-     */
-    findSchemaLocation(node, needle) {
-      const search = (containerArr) => {
-        for (let i = 0; i < containerArr.length; i++) {
-          const c = containerArr[i]
-          if (c === needle) return { containerArr, index: i }
-          const slots = c.slots || []
-          for (const s of slots) {
-            const r = search(s.components || [])
-            if (r) return r
-          }
-        }
-        return null
-      }
-      return search((node && node.components) || [])
-    },
-    /** 在预览树中按 componentId 找到对应 viewNode 的运行时 id（选中键） */
-    findViewIdByComponentId(viewNode, componentId) {
-      if (!viewNode) return null
-      if (viewNode.componentId === componentId) return viewNode.id
-      const kids = []
-      if (viewNode.components) kids.push(...viewNode.components)
-      if (viewNode.slots) for (const s of viewNode.slots) if (s.components) kids.push(...s.components)
-      for (const k of kids) {
-        const r = this.findViewIdByComponentId(k, componentId)
-        if (r) return r
-      }
-      return null
-    },
-    /** 在 schema 树中按 componentId 定位节点，返回 {node, parentArr, index, owner}（owner 为父节点或 'root'） */
-    findSchemaNodeByComponentId(view, compId) {
-      const search = (arr, owner) => {
-        for (let i = 0; i < arr.length; i++) {
-          const c = arr[i]
-          if (c.componentId === compId) return { node: c, parentArr: arr, index: i, owner }
-          const slots = c.slots || []
-          for (const s of slots) {
-            const r = search(s.components || [], c)
-            if (r) return r
-          }
-        }
-        return null
-      }
-      return search((view && view.components) || [], 'root')
-    },
-    /** compId 是否位于 node 子树内（防环：禁止把节点拖入自身或其后代） */
-    isDescendantCompId(compId, node) {
-      if (!node || !node.componentId) return false
-      if (node.componentId === compId) return true
-      const kids = []
-      if (node.components) kids.push(...node.components)
-      if (node.slots) for (const s of node.slots) if (s.components) kids.push(...s.components)
-      for (const k of kids) if (this.isDescendantCompId(compId, k)) return true
-      return false
-    },
-    /**
-     * 结构性移动：把 sourceCompId 节点移动到 targetCompId 的相对位置。
-     * @param {string} position 'before' | 'after' | 'inside'
-     * @returns {Object|false} 被移动的 schema 节点；非法移动返回 false
-     */
-    moveNode(sourceCompId, targetCompId, position) {
-      const schema = this.currentSchema
-      if (!schema || !schema.view) return false
-      if (sourceCompId === targetCompId) return false
-      const src = this.findSchemaNodeByComponentId(schema.view, sourceCompId)
-      if (!src) return false
-      const sourceNode = src.node
-      // 防环：目标不能是源自身或其后代
-      if (this.isDescendantCompId(targetCompId, sourceNode)) return false
-
-      let destArr
-      let insertIndex
-      if (targetCompId === '__root__') {
-        if (!schema.view.components) schema.view.components = []
-        destArr = schema.view.components
-        insertIndex = destArr.length
-      } else {
-        const tgt = this.findSchemaNodeByComponentId(schema.view, targetCompId)
-        if (!tgt) return false
-        const targetNode = tgt.node
-        if (position === 'inside') {
-          if (!isContainerMeta(targetNode.className)) return false
-          const slotKey = getDefaultSlotKey(targetNode.className)
-          let slot = (targetNode.slots || []).find((s) => s.slotKey === slotKey)
-          if (!slot) {
-            if (!targetNode.slots) targetNode.slots = []
-            slot = { slotKey, slotScope: false, slotSwitch: '1', components: [] }
-            targetNode.slots.push(slot)
-          }
-          if (!slot.components) slot.components = []
-          destArr = slot.components
-          insertIndex = destArr.length
-        } else {
-          destArr = tgt.parentArr
-          insertIndex = position === 'before' ? tgt.index : tgt.index + 1
-        }
-      }
-
-      // 从原父数组移除（记录是否在同一数组且位于插入点之前，用于修正下标）
-      const sameArr = destArr === src.parentArr
-      const removeBefore = sameArr && src.index < insertIndex
-      src.parentArr.splice(src.index, 1)
-      if (removeBefore) insertIndex -= 1
-      destArr.splice(insertIndex, 0, sourceNode)
-      return sourceNode
-    },
-    /** 结构树拖拽移动：改写 currentSchema → 重建预览 → 选中移动后的节点。
-     *  按需求：拖拽仅实时预览（不在此提交历史），历史由后续「应用/保存到本地」落定。 */
-    onMoveNode({ sourceCompId, targetCompId, position }) {
-      if (!this.currentSchema) return
-      const moved = this.moveNode(sourceCompId, targetCompId, position)
-      if (!moved) return
-      this.reloadToken += 1
-      this.preview = buildPreview(this.currentSchema)
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(this.currentSchema)
-      this.syncDataToSchema()
-      const newId = this.findViewIdByComponentId(this.preview.view, sourceCompId)
-      this.selectedNodeId = newId || ''
-      // 仅当移动成功且能定位到新节点时才触发「折叠其他、仅展开祖先」行为
-      if (newId) this.moveCollapseToken += 1
-    },
-    /**
-     * 从组件选择面板选定类型后，按插入规则把新节点写进 currentSchema，再重建预览并选中新节点。
-     * 规则：
-     *  - 锚点为根（或未指定）→ 追加到 view.components 末尾；
-     *  - 锚点为容器节点 → 追加到其默认插槽 children 末尾（插槽缺失时依 meta 建立）；
-     *  - 锚点为非容器节点 → 在同父级、该节点之后插入兄弟节点；
-     *    找不到父级时兜底追加到根。
-     */
-    onPickComponent(className) {
-      const payload = this.addNodeTarget || {}
-      const targetNode = payload.node || null
-      const mode = payload.mode || 'auto'
-      const schema = this.currentSchema
-      if (!schema) {
-        this.cancelAddNode()
-        return
-      }
-      let newNode
-      try {
-        newNode = createComponentNode(className)
-      } catch (e) {
-        console.error('[创建组件节点失败]', e)
-        this.rt.pushError('addNode', String(e && e.message))
-        this.cancelAddNode()
-        return
-      }
-
-      const targetIsRoot = !targetNode || targetNode.className === 'Root'
-      if ((mode === 'before' || mode === 'after') && !targetIsRoot) {
-        // 相邻兄弟插入：在非根节点所在的容器数组内，按 'before'/'after' 相对位置落位
-        const targetSchema = targetNode._schemaNode
-        const loc = targetSchema ? this.findSchemaLocation(schema.view, targetSchema) : null
-        if (!loc) {
-          // 兜底：找不到父数组则追加到根末尾
-          if (!schema.view.components) schema.view.components = []
-          schema.view.components.push(newNode)
-        } else {
-          const idx = mode === 'before' ? loc.index : loc.index + 1
-          loc.containerArr.splice(idx, 0, newNode)
-        }
-      } else if (targetIsRoot) {
-        // 根：添加子节点（'child'）或 'auto' → 追加到 view.components 末尾
-        if (!schema.view.components) schema.view.components = []
-        schema.view.components.push(newNode)
-      } else {
-        // 'child' / 'auto' 且非根：容器 → 默认插槽末尾；非容器 → 其后兄弟
-        const targetSchema = targetNode._schemaNode
-        if (!targetSchema) {
-          this.cancelAddNode()
-          return
-        }
-        if (isContainerMeta(targetNode.className)) {
-          const slotKey = getDefaultSlotKey(targetNode.className)
-          let slot = (targetSchema.slots || []).find((s) => s.slotKey === slotKey)
-          if (!slot) {
-            if (!targetSchema.slots) targetSchema.slots = []
-            slot = { slotKey, slotScope: false, slotSwitch: '1', components: [] }
-            targetSchema.slots.push(slot)
-          }
-          if (!slot.components) slot.components = []
-          slot.components.push(newNode)
-        } else {
-          const loc = this.findSchemaLocation(schema.view, targetSchema)
-          if (!loc) {
-            if (!schema.view.components) schema.view.components = []
-            schema.view.components.push(newNode)
-          } else {
-            loc.containerArr.splice(loc.index + 1, 0, newNode)
-          }
-        }
-      }
-
-      this.cancelAddNode()
-      // 重建预览并选中新节点（与 onSchemaChanged 同款重建路径）
-      this.reloadToken += 1
-      this.preview = buildPreview(schema)
-      if (typeof window !== 'undefined') window.__cardModel = buildModelView(schema)
-      this.syncDataToSchema()
-      const newId = this.findViewIdByComponentId(this.preview.view, newNode.componentId)
-      this.selectedNodeId = newId || ''
-      // 结构性编辑落定后提交一次历史记录（防抖合并连续编辑）
-      this.scheduleCommit()
-    },
-    /** 复制 schema（合并数据绑定编辑后的数据：写入 dictionary.inputParams.defaultValue，并保留顶层 .data） */
-    async copySchema() {
-      if (!this.currentSchema) return
-      // 确保数据绑定已同步进 schema（实时 watcher 之外再加一道保险，避免编辑后立刻复制时落空）
-      this.syncDataToSchema()
-      let text = ''
-      try {
-        const merged = { ...this.currentSchema }
-        if (this.rt && this.rt.rootScope) {
-          merged.data = this.rt.rootScope
-        }
-        // 过滤掉 _schemaNode 引用（不可序列化）
-        text = JSON.stringify(merged, (key, val) => {
-          if (key === '_schemaNode') return undefined
-          return val
-        }, 2)
-      } catch (e) {
-        text = '(无法序列化)'
-      }
-      const ok = await this.doCopy(text)
-      if (ok) {
-        this.copiedSchema = true
-        if (this.copyTimer) clearTimeout(this.copyTimer)
-        this.copyTimer = setTimeout(() => { this.copiedSchema = false }, 1500)
-      }
-    },
-    async doCopy(text) {
-      try {
-        if (navigator.clipboard && navigator.clipboard.writeText) {
-          await navigator.clipboard.writeText(text)
-          return true
-        }
-      } catch (e) { /* fallback */ }
-      try {
-        const ta = document.createElement('textarea')
-        ta.value = text
-        ta.style.position = 'fixed'
-        ta.style.opacity = '0'
-        document.body.appendChild(ta)
-        ta.select()
-        const ok = document.execCommand('copy')
-        document.body.removeChild(ta)
-        return ok
-      } catch (e) {
-        return false
-      }
-    },
-    /**
-     * 从 FinMall UAT 拉取卡片最新 schema/封面并写回 src/cards。
-     * 经 dev-server 的 /__sync 端点触发（端点内部复用 finmall-card-sync 的 syncCards，
-     * 通过 connectOverCDP 连用户已开的 Chrome，在已登录的 FinMall 页内发起 API 请求）。
-     * 纯前端无法直接调 FinMall：跨域 + 无 token，故必须经此中转。
-     * @param {string} [cardCode] 传值时仅同步该卡；不传则拉取完整远程卡片列表逐张覆盖本地（全量同步）。
-     */
-    async runSync(cardCode) {
-      if (this.syncingRemote) return
-      if (cardCode && !this.selectedId) return
-      this.syncingRemote = true
-      this.syncedRemote = false
-      this.syncTarget = cardCode ? 'selected' : 'full'
-      try {
-        const res = await apiFetch('/__sync', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify(cardCode ? { cardCode } : {}),
-        })
-        if (!res.ok) {
-          const err = await res.json().catch(() => ({}))
-          throw new Error(err.message || err.error || 'HTTP ' + res.status)
-        }
-        const r = await res.json()
-        if (r.needCredentials) {
-          // 凭据缺失：弹出登录表单，由用户填写账号密码后自动重试同步
-          this.openLoginModal()
-          return
-        }
-        if (!r.success) {
-          const detail = (r.failed || []).map((f) => `${f.id}: ${f.error}`).join('; ')
-          throw new Error(detail || '同步失败')
-        }
-        this.syncedRemote = true
-        if (this.syncTimer) clearTimeout(this.syncTimer)
-        this.syncTimer = setTimeout(() => { this.syncedRemote = false; this.syncTarget = null }, 1800)
-        // 把刚拉取的最新卡片载入预览
-        await this.onRefresh()
-        // 操作完成提示：全量 / 选中卡片区分文案
-        showAppToast(this.syncTarget === 'selected' ? '已同步当前卡片到本地' : '全量同步完成', 'ok')
-      } catch (e) {
-        console.error('[同步远程数据失败]', e)
-        // 远端操作接口报错：仅弹出错误提示，不写入事件/绑定错误记录（避免污染事件面板）
-        showAppToast('同步失败：' + (e && e.message), 'err')
-      } finally {
-        this.syncingRemote = false
-      }
-    },
-    /** 全量同步：拉取完整远程卡片列表，逐张覆盖本地同名卡片（本地独有卡片保留）。 */
-    syncRemote() {
-      return this.runSync()
-    },
-    /** 仅同步当前选中卡片。 */
-    syncSelected() {
-      return this.runSync(this.selectedId)
-    },
-    /** 打开 FinMall 登录凭据弹窗（远程同步检测到缺凭据时调用） */
-    openLoginModal() {
-      this.loginModal = true
-      this.loginName = ''
-      this.loginPassword = ''
-      this.loginError = ''
-    },
-    /** 关闭登录凭据弹窗（提交中不可关闭） */
-    closeLoginModal() {
-      if (this.loginSubmitting) return
-      this.loginModal = false
-      this.loginPassword = ''
-      this.loginError = ''
-    },
-    /** 提交账号密码：写入本地凭据后，自动重试上一次同步 */
-    async submitLogin() {
-      if (this.loginSubmitting) return
-      const loginName = this.loginName.trim()
-      const loginPassword = this.loginPassword
-      if (!loginName || !loginPassword) {
-        this.loginError = '账号与密码均不能为空'
-        return
-      }
-      this.loginSubmitting = true
-      this.loginError = ''
-      try {
-        const res = await apiFetch('/__login-credentials', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ loginName, loginPassword }),
-        })
-        const r = await res.json().catch(() => ({}))
-        if (!res.ok || !r.ok) {
-          throw new Error(r.message || r.error || 'HTTP ' + res.status)
-        }
-        this.loginModal = false
-        this.loginPassword = ''
-        showAppToast('凭据已保存，正在重试同步…', 'ok')
-        // 沿用上一次同步模式自动重试
-        await this.runSync(this.syncTarget === 'selected' ? this.selectedId : undefined)
-      } catch (e) {
-        this.loginError = '保存失败：' + (e && e.message)
-      } finally {
-        this.loginSubmitting = false
-      }
-    },
-    /** 下拉菜单选中某项：执行对应同步（先二次确认） */
-    chooseSync(target) {
-      if (target === 'full') {
-        if (this.syncingRemote) return
-        this.requestConfirm({
-          title: '全量同步',
-          message: '即将从远端 FinMall 拉取完整卡片列表，并逐张覆盖本地同名卡片。本地独有卡片会保留，但被覆盖卡片的未保存改动将丢失，且无法撤销。是否继续？',
-          confirmText: '继续同步',
-          severity: 'warn',
-          onConfirm: () => this.syncRemote(),
-        })
-        return
-      }
-      if (!this.preview || !this.selectedId || this.syncingRemote) return
-      this.requestConfirm({
-        title: '当前同步',
-        message: `即将从远端 FinMall 拉取当前卡片「${this.selectedId}」的最新版本并覆盖本地。本地未保存的改动将丢失，且无法撤销。是否继续？`,
-        confirmText: '继续同步',
-        onConfirm: () => this.syncSelected(),
-      })
-    },
-    /** 「远端」分组菜单项：版本推送 / 在线预览 / 切图上传（写覆盖类操作先二次确认） */
-    chooseRsave(target) {
-      if (target === 'save') {
-        if (!this.preview || !this.selectedId || this.savingRemote || !this.hasCardSource) return
-        this.requestConfirm({
-          title: '版本推送',
-          message: `即将把本地卡片「${this.selectedId}」的当前版本推送并覆盖到远端 FinMall。线上版本会被立即更新，且该操作不可撤销。是否继续？`,
-          confirmText: '继续推送',
-          severity: 'warn',
-          onConfirm: () => this.saveToRemote(),
-        })
-        return
-      }
-      if (target === 'slices') {
-        if (!this.preview || !this.selectedId || this.uploadingSlices) return
-        this.requestConfirm({
-          title: '切图上传',
-          message:
-            `即将把当前卡片「${this.selectedId}」引用的本地切图（src/slices/）上传到 FinMall 图片库，` +
-            `并把卡片里的 /slices/ 引用替换为线上地址（@filestore/…）。本地切图文件保留不动；` +
-            `内容未变的切图会直接复用已有线上地址，不重复上传。` +
-            (this.historyDirty ? '\n当前卡片有未保存的改动，会先保存到本地再执行，避免被随后的重载丢弃。' : '') +
-            '\n是否继续？',
-          confirmText: '继续上传',
-          onConfirm: () => this.uploadCardSlices(),
-        })
-        return
-      }
-      if (!this.preview || !this.selectedId || !this.hasCardSource) return
-      this.remotePreviewOpen = true
-    },
-    /** 请求二次确认：统一在写/覆盖类操作前弹出，确认后执行 onConfirm 回调 */
-    requestConfirm({ title, message, confirmText, cancelText, severity, onConfirm }) {
-      this.confirm = {
-        show: true,
-        title,
-        message,
-        confirmText: confirmText || '继续',
-        cancelText: cancelText || '取消',
-        severity: ['primary', 'warn', 'danger'].includes(severity) ? severity : 'primary',
-        onConfirm,
-      }
-    },
-    /** 确认弹窗点击「确认」：执行挂起的回调 */
-    onConfirmDialog() {
-      const cb = this.confirm.onConfirm
-      this.confirm.show = false
-      this.confirm.onConfirm = null
-      if (typeof cb === 'function') cb()
-    },
-    /** 确认弹窗点击「取消」或遮罩：丢弃挂起操作 */
-    onCancelDialog() {
-      this.confirm.show = false
-      this.confirm.onConfirm = null
-    },
-    /** 把预览内编辑后的最新数据绑定 + schema 写回 src/cards/<id>/（经 dev 中间件 POST） */
-    async saveCard() {
-      if (!this.preview || !this.selectedId) return
-      this.savingCard = true
-      const id = this.selectedId
-      // 标记本窗口即将落盘：吸收随后 watcher 经 SSE 推回的 cards-changed 回声，避免误弹外部重载提示。
-      // 落盘未成功时（catch）清除，以免误吞后续真正的外部改动。
-      this.selfSaveId = id
-      this.selfSaveAt = Date.now()
-      try {
-        // 保存前从磁盘校准元数据（pageId/name/desc 由远端/磁盘权威决定，内存编辑不修改它们），
-        // 取磁盘最新值覆盖内存，避免滞后于同步结果把真实 cardId 写回成旧值。
-        try {
-          const fresh = await this.fetchDiskCard(this.selectedId)
-          if (fresh && fresh.schema) {
-            const disk = fresh.schema
-            const mem = this.currentSchema
-            if (mem) {
-              if (disk.pageId) mem.pageId = disk.pageId
-              if (disk.name) mem.name = disk.name
-              if (disk.desc !== undefined) mem.desc = disk.desc
-            }
-          }
-        } catch { /* 磁盘读取失败不阻塞保存 */ }
-        // 保存前确保数据绑定已同步进 schema.dictionary.inputParams.defaultValue
-        this.syncDataToSchema()
-        // 只发 schema：服务端写 schema.json 后会用 buildDataFromSchema(schema) 单向重算
-        // data.json，data 永不随请求上传、也不作为写入来源。
-        const payload = {
-          schema: this.currentSchema,
-        }
-        const body = JSON.stringify(payload, (k, v) => (k === '_schemaNode' ? undefined : v), 2)
-        const res = await apiFetch(`/__card/${encodeURIComponent(this.selectedId)}`, {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body,
-        })
-        if (!res.ok) {
-          const err = await res.json().catch(() => ({}))
-          throw new Error(err.message || 'HTTP ' + res.status)
-        }
-        // 写盘成功：更新内存工作副本，便于后续操作基于刚落盘的内容。磁盘变更也会经
-        // watcher 触发 onCardsChanged 重新载入，二者最终一致。
-        this.currentCard = { schema: payload.schema }
-        // 写盘成功后，当前显示版本即成为本地真实版本：刷新本地基线，使顶栏
-        // 「保存到本地」按钮在「当前版本 == 本地版本」时自动置灰。
-        this.localSchema = this.cloneSchema(this.currentSchema)
-        // 基线数据必须与载入 / 历史快照同源（含 mocks）：rt.rootScope 是含 mock 覆盖的，
-        // 若此处漏传 WITH_MOCKS，只要存在 mock 数据，保存后 rootScope 与 localData 永远
-        // 不等 → historyDirty 恒真，「保存到本地」按钮保存成功也保持高亮。
-        this.localData = this.cloneData(buildDataFromSchema(this.currentSchema, WITH_MOCKS))
-        this.savedCard = true
-        // 本地保存后磁盘已更新，刷新整卡校验徽标（端点读磁盘）
-        this.refreshValidateBadge()
-        if (this.saveTimer) clearTimeout(this.saveTimer)
-        this.saveTimer = setTimeout(() => { this.savedCard = false }, 1800)
-        return true
-      } catch (e) {
-        console.error('[本地保存失败]', e)
-        this.rt.pushError('saveCard', String(e && e.message))
-        // 落盘未成功：清除自保存标记，避免误吞后续真正的外部改动
-        this.selfSaveId = ''
-        this.selfSaveAt = 0
-        return false
-      } finally {
-        this.savingCard = false
-      }
-    },
-    /** 从磁盘读取指定卡片最新 schema/data（供保存前校准与刷新使用） */
-    async fetchDiskCard(id) {
-      const res = await apiFetch(`/__card/${encodeURIComponent(id)}`)
-      if (!res.ok) throw new Error('HTTP ' + res.status)
-      return res.json()
-    },
-    /**
-     * 拉取当前卡片的导入来源元数据（Phase E）：GET /__import-meta/:id。
-     * 本地新建卡无 .import-meta.json → 端点 404 → 置 null（顶栏「版本推送」据此置灰）。
-     * 与 DebugPanel「来源」tab 同源，但此处为顶栏按钮的响应式来源标志，覆盖每次切卡/同步刷新。
-     */
-    async fetchImportMeta(id) {
-      if (!id) { this.cardImportMeta = null; return }
-      try {
-        const res = await apiFetch(`/__import-meta/${encodeURIComponent(id)}`)
-        if (!res.ok) { this.cardImportMeta = null; return }
-        const r = await res.json().catch(() => ({}))
-        this.cardImportMeta = (r && r.meta) || null
-      } catch {
-        this.cardImportMeta = null
-      }
-    },
-    /**
-     * 把当前预览的卡片 schema 写回 FinMall 远端（线上编辑器「保存」接口 IDC10010.do）。
-     * 经 dev 中间件 /__save 触发：端点内部复用 finmall-card-sync 的 saveCardToRemote，
-     * 通过已登录的 FinMall 浏览器会话（与「同步」共用）中转 POST，body 含 cardId(=pageId) 与
-     * schemaValue（整张 schema 的 JSON 字符串）。纯前端无法直接调 FinMall（跨域 + 需 token），故须经此中转。
-     * 无自动保存——仅手动触发。
-     */
-    async saveToRemote() {
-      if (!this.preview || !this.selectedId || this.savingRemote) return
-      this.savingRemote = true
-      this.savedRemote = false
-      this.verifiedRemote = null
-      try {
-        // 保存前从磁盘校准 pageId：避免内存滞后于同步结果，把当前卡片误存到旧的远端 cardId。
-        try {
-          const fresh = await this.fetchDiskCard(this.selectedId)
-          if (fresh && fresh.schema && fresh.schema.pageId && this.currentSchema) {
-            this.currentSchema.pageId = fresh.schema.pageId
-          }
-        } catch { /* 磁盘读取失败不阻塞保存 */ }
-        // 保存前确保数据绑定已同步进 schema.dictionary.inputParams.defaultValue
-        this.syncDataToSchema()
-        // 标记本窗口即将落盘（saveCardToRemote 会写回 src/cards），吸收 watcher 推回的 cards-changed 回声
-        this.selfSaveId = this.selectedId
-        this.selfSaveAt = Date.now()
-        const res = await apiFetch('/__save', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify(
-            { code: this.selectedId, schema: this.currentSchema },
-            (k, v) => (k === '_schemaNode' ? undefined : v),
-            2
-          ),
-        })
-        if (!res.ok) {
-          const err = await res.json().catch(() => ({}))
-          throw new Error(err.message || err.error || 'HTTP ' + res.status)
-        }
-        const r = await res.json()
-        if (!r.ok) throw new Error(r.error || '远端保存失败')
-        // verified: {ok, cardIdMatched, fingerprintMatched, diff, readBackError}
-        // ok=true → 保存并读回一致；ok=false → 「交易成功」但内容未落库（FinMall 静默空返回）
-        this.verifiedRemote = r.verified ? !!r.verified.ok : null
-        this.savedRemote = true
-        if (this.verifiedRemote === false) {
-          const v = r.verified || {}
-          const detail = (v.diff && v.diff.length)
-            ? '差异：' + v.diff.join('；')
-            : (v.readBackError || '读回校验未通过')
-          // 远端操作结果异常：仅弹出错误提示，不写入事件/绑定错误记录
-          console.warn('[保存校验不符]', v)
-          showAppToast('已保存至远端，但读回校验未通过', 'err')
-        } else {
-          showAppToast('已保存至远端', 'ok')
-        }
-        if (this.saveRemoteTimer) clearTimeout(this.saveRemoteTimer)
-        this.saveRemoteTimer = setTimeout(() => { this.savedRemote = false; this.verifiedRemote = null }, 2500)
-      } catch (e) {
-        console.error('[保存至远端失败]', e)
-        // 远端操作接口报错：仅弹出错误提示，不写入事件/绑定错误记录（避免污染事件面板）
-        showAppToast('保存至远端失败：' + (e && e.message), 'err')
-        // 落盘未成功：清除自保存标记，避免误吞后续真正的外部改动
-        this.selfSaveId = ''
-        this.selfSaveAt = 0
-      } finally {
-        this.savingRemote = false
-      }
-    },
-    /**
-     * 把「当前卡片」引用的本地切图上传到 FinMall 图片库（CC0000.do），并把卡片里的
-     * `/slices/<name>` 引用改写为返回的线上地址（`@filestore/...`）。
-     * 经 dev-server 的 /__slice-upload 端点触发（端点内部复用 finmall-card-sync 的 uploadSlices，
-     * 与「同步」「版本推送」共用同一后台 FinMall 会话）。纯前端无法直接调 FinMall：
-     * 跨域 + 需 token（token 只在页面上下文内读取，不回传 Node），故必须经此中转。
-     *
-     * 纪律：
-     * - **只在用户点击「远端 → 切图上传」时执行**，保存 / 推送 / 同步都不会顺带上传切图；
-     * - 上传与改写范围都只限当前卡；共享切图若已被别的卡上传过（sha256 命中
-     *   src/slices/manifest.json），直接复用线上地址，不重复上传；
-     * - 本地 src/slices 真源保留不动（映射清单记录 本地文件 ↔ 线上地址）。
-     */
-    async uploadCardSlices() {
-      if (!this.preview || !this.selectedId || this.uploadingSlices) return
-      const id = this.selectedId
-      this.uploadingSlices = true
-      try {
-        // 端点改写的是磁盘上的 schema.json；若编辑器里有未保存改动，先落盘再上传，
-        // 否则随后从磁盘重载会把未保存编辑静默丢掉。
-        if (this.historyDirty) {
-          const saved = await this.saveCard()
-          if (!saved) throw new Error('本地保存失败，已中止切图上传')
-        }
-        // 标记本窗口即将落盘（端点会改写 src/cards/<id>/schema.json），吸收 watcher 经 SSE 推回的
-        // cards-changed 回声，避免误弹「卡片已在编辑器外被修改」提示。
-        this.selfSaveId = id
-        this.selfSaveAt = Date.now()
-        const res = await apiFetch('/__slice-upload', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ cardId: id }),
-        })
-        if (!res.ok) {
-          const err = await res.json().catch(() => ({}))
-          throw new Error(err.message || err.error || 'HTTP ' + res.status)
-        }
-        const r = await res.json()
-        if (r.needCredentials) {
-          // 凭据缺失：弹出登录表单，由用户填写账号密码后再点一次「切图上传」
-          this.openLoginModal()
-          return
-        }
-        // 上传可能耗时数秒（逐张传），落盘发生在响应前一刻：再刷一次自保存时间戳，
-        // 让 2.5s 抑制窗口覆盖到这次回声（否则慢上传会漏抑制）。
-        this.selfSaveAt = Date.now()
-        if (!r.success) {
-          const detail = (r.failed || []).map((f) => `${f.name}: ${f.error}`).join('; ')
-          throw new Error(detail || '切图上传失败')
-        }
-        // 磁盘上的引用已被改写为线上地址，重新载入让预览即时生效。
-        await this.onRefresh()
-        const replaced = (r.rewritten || []).reduce((n, item) => n + item.count, 0)
-        if (!r.referenced) {
-          showAppToast('当前卡片没有引用本地切图，无需上传', 'ok')
-        } else {
-          showAppToast(
-            `切图上传完成：新上传 ${r.uploaded.length} 张、复用 ${r.skipped.length} 张，替换引用 ${replaced} 处`,
-            'ok'
-          )
-        }
-        if (r.dangling && r.dangling.length) {
-          showAppToast(`有 ${r.dangling.length} 处引用的切图在 src/slices 下不存在：${r.dangling.join('、')}`, 'err')
-        }
-      } catch (e) {
-        console.error('[切图上传失败]', e)
-        // 远端操作接口报错：仅弹出错误提示，不写入事件/绑定错误记录（避免污染事件面板）
-        showAppToast('切图上传失败：' + (e && e.message), 'err')
-        // 未落盘：清除自保存标记，避免误吞后续真正的外部改动
-        this.selfSaveId = ''
-        this.selfSaveAt = 0
-      } finally {
-        this.uploadingSlices = false
-      }
-    },
-    /** 实时拉取卡片列表（GET /__cards），替换下拉框选项，不缓存 */
-    async fetchCardList() {
-      try {
-        const res = await apiFetch('/__cards')
-        if (!res.ok) return
-        const r = await res.json()
-        const cards = (r && r.cards) || []
-        this.cardList = cards
-        this.cardCount = cards.length
-      } catch (e) {
-        console.error('[加载卡片列表失败]', e)
-      }
-    },
-    /**
-     * 网格预览删除卡片：格子删除钮 → 警告确认 → 这里真删（DELETE /__card/<id> 递归删本地目录）。
-     * 删完刷列表；若删的正是当前卡，切到剩余首卡，避免工作台指向已不存在的目录（保存会 404）。
-     */
-    async onGalleryDelete(id) {
-      try {
-        const res = await apiFetch(`/__card/${encodeURIComponent(id)}`, { method: 'DELETE' })
-        const r = await res.json().catch(() => null)
-        if (!res.ok) throw new Error((r && (r.message || r.error)) || `HTTP ${res.status}`)
-        showAppToast(`已删除本地卡片 ${id}`, 'ok')
-        await this.fetchCardList()
-        if (this.selectedId === id) {
-          const next = this.cardList[0]
-          if (next) await this.loadCard(next.id)
-          else {
-            this.selectedId = ''
-            this.currentSchema = null
-            this.preview = null
-          }
-        }
-      } catch (e) {
-        showAppToast(`删除卡片失败：${e.message}`, 'err')
-      }
-    },
-    /** 新增空白卡片创建成功：关弹窗 → 刷列表 → 切换到新卡（空白卡无封面，网格显示占位图） */
-    async onNewCardCreated(id) {
-      this.newCardOpen = false
-      showAppToast(`已创建空白卡片 ${id}`, 'ok')
-      await this.fetchCardList()
-      await this.loadCard(id)
-    },
-    /** 刷新当前卡片：从磁盘重新读取 schema/data 并强制重挂载 */
-    async onRefresh() {
-      const id = this.selectedId
-      if (!id || this.refreshing) return
-      this.refreshing = true
-      try {
-        await this.loadCard(id)
-        // 立即刷新卡片列表：同步远程可能新增 / 重命名卡片，
-        // 让顶栏下拉框即时反映，无需等待 dev server 文件监听事件。
-        await this.fetchCardList()
-        // 同步下拉框名称（若 schema.name 有改动，以内存态为准兜底）
-        const item = this.cardList.find((c) => c.id === id)
-        if (item && this.currentSchema && this.currentSchema.name) item.name = this.currentSchema.name
-      } catch (e) {
-        console.error('[刷新卡片失败]', e)
-        this.rt.pushError('refresh', String(e && e.message))
-      } finally {
-        this.refreshing = false
-      }
-    },
-    /**
-     * 处理 dev server 推送的磁盘变更事件（同步远程 / 其他窗口保存 / 手工编辑）。
-     * - 始终重新拉取卡片列表（新增 / 改名 / 删除的卡即时反映在下拉框）。
-     * - 若变更的是当前选中卡片的文件，重新从磁盘载入，使预览即时生效
-     *   （这正是「连接本地开发服务后，编辑器外改文件，预览立刻刷新」的关键路径）。
-     * - 若当前卡片存在未保存编辑，先用既有 ConfirmDialog 二次确认，避免静默丢弃编辑。
-     * 用极短防抖合并同步写盘的突发多文件变更，避免重复重载。
-     */
-    onCardsChanged(payload) {
-      const file = (payload && payload.file) || ''
-      // 编辑历史快照落盘在 src/cards/<id>/.history/ 下写 .json，不属于卡片本体变更，
-      // 须忽略，否则会触发 loadCard 自动重载、丢弃未保存编辑并关闭属性面板。
-      if (/\.history[\\/]/.test(file)) return
-      // data.json 是 schema 的单向派生产物，其变更（写盘重算 / 外部直改）不应触发重载；
-      // 真正触发重载的只有 schema.json 变更（此处与 8787 watcher 形成双保险）。
-      if (/data\.json$/i.test(file)) return
-      const m = file.match(/src[\\/]cards[\\/]([^\\/]+)[\\/]/)
-      const changedId = m ? m[1] : null
-      if (this._cardsChangedTimer) return
-      this._cardsChangedTimer = setTimeout(() => {
-        this._cardsChangedTimer = null
-        this.fetchCardList()
-        if (changedId && changedId === this.selectedId) {
-          // 本窗口自己的「保存到本地 / 保存至远端」刚落盘，watcher 推回的 cards-changed 是回声，
-          // 并非外部修改——内存态已由 saveCard / saveToRemote 就地更新，不应弹外部重载提示或冲突确认框。
-          // 仅吸收本窗口的回声；其他窗口 / IDE / 远端同步的变更仍照常提示（其 selfSaveId 不会被设置）。
-          if (this.selfSaveId === changedId && Date.now() - this.selfSaveAt < SELF_SAVE_SUPPRESS_MS) {
-            this.selfSaveId = ''
-            this.selfSaveAt = 0
-            return
-          }
-          if (this.historyDirty) {
-            // 当前卡有未保存编辑，外部又改了文件 → 二次确认，避免静默丢弃编辑
-            this.promptExternalReload(changedId)
-          } else {
-            // 无未保存改动：外部改动直接自动重载（符合「主动刷新重载」诉求），
-            // 但给一条非阻塞轻提示，避免「改了却毫无感知」。
-            const name = (this.currentSchema && this.currentSchema.name) || changedId
-            this.showExternalReloadNote(`卡片「${name}」已在编辑器外被修改，已自动重新载入预览`)
-            this.loadCard(this.selectedId)
-          }
-        }
-      }, 120)
-    },
-    /**
-     * 外部（IDE / 其他工具 / 远端同步）改动了当前卡片文件，而平台有未保存编辑时，
-     * 复用既有的 ConfirmDialog 弹二次确认（与同步发布 / 版本推送同款组件）：
-     * - 「重新载入」：放弃本地未保存改动，从磁盘重新载入（onConfirm 执行 loadCard）。
-     * - 「保留我的改动」：取消，保留编辑器内未保存编辑、不重载。
-     * 已有确认弹窗打开时跳过，避免同一波变更重复弹窗。
-     */
-    promptExternalReload(id) {
-      if (this.confirm.show) return
-      const name = (this.currentSchema && this.currentSchema.name) || id
-      this.requestConfirm({
-        title: '卡片已在编辑器外被修改',
-        message: `卡片「${name}」的 schema / data 在编辑器外发生了变更（例如 IDE 或其他工具覆盖了文件）。\n当前编辑器存在未保存的改动，是否放弃本地未保存改动并重新载入磁盘版本？`,
-        confirmText: '重新载入',
-        cancelText: '保留我的改动',
-        onConfirm: () => this.loadCard(id),
-      })
-    },
-    /**
-     * 外部改了当前卡、但平台无未保存改动时的非阻塞轻提示：顶部短暂出现、自动消失。
-     * 与 promptExternalReload（阻塞确认）互补——脏时弹确认、非脏时给提示。
-     */
-    showExternalReloadNote(msg) {
-      this.externalReloadNote = msg
-      if (this.externalReloadTimer) clearTimeout(this.externalReloadTimer)
-      this.externalReloadTimer = setTimeout(() => {
-        this.externalReloadNote = ''
-        this.externalReloadTimer = null
-      }, 3500)
-    },
-  },
-}
-</script>