:root {
  --c-dark: #3A44B0;
  --c-primary: #535FE8;
  --c-light: #7681F8;
  --c-lighter: #A0A7FA;
  --c-lightest: #C2C7FB;
  --c-bg: #f0f1fe;
  --c-card: rgba(255,255,255,0.75);
  --c-text: #1a1a2e;
  --c-text-sec: #6b7280;
  --c-text-light: #9ca3af;
  --c-border: rgba(255,255,255,0.3);
  --c-ok: #10b981;
  --c-err: #ef4444;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 24px;
  --shadow: 0 8px 32px rgba(58,68,176,0.2);
  --blur: 20px;
}

*{margin:0;padding:0;box-sizing:border-box}

html,body{
  width:100%;min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'PingFang SC','Microsoft YaHei',sans-serif;
  color:var(--c-text);
  -webkit-font-smoothing:antialiased;
  background:linear-gradient(135deg,var(--c-dark) 0%,var(--c-primary) 30%,var(--c-light) 60%,var(--c-lighter) 85%,var(--c-lightest) 100%);
  background-attachment:fixed;
}

::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-thumb{background:rgba(83,95,232,.3);border-radius:3px}

/* ===== 导航栏 ===== */
.navbar{
  position:fixed;top:0;left:0;right:0;z-index:100;
  backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  background:rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.2);
}
.navbar-inner{
  max-width:1200px;margin:0 auto;padding:0 24px;height:64px;
  display:flex;align-items:center;justify-content:space-between;
}
.navbar-brand{display:flex;align-items:center;gap:10px}
.brand-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center}
.brand-text{font-size:18px;font-weight:700;color:#fff;letter-spacing:.5px}
.tool-tab{
  display:flex;align-items:center;gap:6px;padding:8px 16px;border:none;
  background:rgba(255,255,255,.12);color:rgba(255,255,255,.85);border-radius:var(--r-sm);
  cursor:pointer;font-size:14px;font-weight:500;transition:all .3s;
  border:1px solid rgba(255,255,255,.15);
}
.tool-tab:hover{color:#fff;background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3)}

/* ===== 主内容 ===== */
.main-content{max-width:1200px;margin:0 auto;padding:88px 24px 40px}
.watermark-tool{max-width:100%;margin:0 auto;display:flex;flex-direction:column;gap:20px}

/* 工具头部 */
.tool-header{text-align:center;padding:40px 0 8px}
.tool-badge{
  width:56px;height:56px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--c-primary),var(--c-light));border-radius:var(--r-lg);
  color:#fff;box-shadow:0 8px 24px rgba(83,95,232,.4);
}
.tool-title{font-size:24px;font-weight:700;color:#fff;margin-bottom:6px}
.tool-desc{font-size:14px;color:rgba(255,255,255,.7)}

/* 输入卡片 */
.input-card{
  background:var(--c-card);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  border-radius:var(--r-xl);padding:24px;border:1px solid var(--c-border);box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:16px;
}
.input-wrapper{position:relative}
.url-input{
  width:100%;padding:14px 40px 14px 16px;border:2px solid transparent;border-radius:var(--r-md);
  background:rgba(83,95,232,.06);font-size:15px;color:var(--c-text);resize:none;
  transition:all .3s;outline:none;font-family:inherit;
}
.url-input::placeholder{color:var(--c-text-light)}
.url-input:focus{border-color:var(--c-light);background:#fff;box-shadow:0 0 0 4px rgba(83,95,232,.1)}
.clear-btn{
  position:absolute;right:10px;top:12px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  border:none;background:rgba(107,114,128,.15);border-radius:50%;color:var(--c-text-sec);cursor:pointer;transition:all .2s;
}
.clear-btn:hover{background:rgba(107,114,128,.25);color:var(--c-text)}

/* 解析按钮 */
.parse-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px;
  border:none;border-radius:var(--r-md);
  background:linear-gradient(135deg,var(--c-primary),var(--c-light));
  color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s;position:relative;overflow:hidden;
}
.parse-btn::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,var(--c-light),var(--c-primary));opacity:0;transition:opacity .3s;
}
.parse-btn:hover:not(:disabled)::before{opacity:1}
.parse-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px rgba(83,95,232,.4)}
.parse-btn:active:not(:disabled){transform:translateY(0)}
.parse-btn:disabled{opacity:.5;cursor:not-allowed}
.parse-btn>*{position:relative;z-index:1}
.parse-btn.loading{
  background:linear-gradient(135deg,var(--c-light),var(--c-lighter));animation:breathe 2s ease-in-out infinite;
}
@keyframes breathe{0%,100%{opacity:1}50%{opacity:.7}}
.spinner{
  width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;
  border-radius:50%;animation:spin .6s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* 错误卡片 */
.error-card{
  display:flex;align-items:center;gap:8px;padding:14px 18px;
  background:rgba(255,255,255,.85);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  border:1px solid rgba(239,68,68,.25);border-radius:var(--r-md);
  color:#b91c1c;font-size:14px;
  animation:fadeSlideIn .4s cubic-bezier(.16,1,.3,1);
}

/* 结果卡片 */
.result-card{
  background:var(--c-card);backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));
  border-radius:var(--r-xl);padding:24px;border:1px solid var(--c-border);box-shadow:var(--shadow);
  animation:fadeSlideIn .4s cubic-bezier(.16,1,.3,1);
  display:flex;flex-direction:column;gap:18px;
}
@keyframes fadeSlideIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

.result-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.result-type-badge{
  display:inline-flex;align-items:center;gap:6px;padding:5px 12px;
  background:rgba(16,185,129,.12);color:var(--c-ok);border-radius:20px;font-size:13px;font-weight:600;
  border:1px solid rgba(16,185,129,.2);
}
.platform-badge{
  display:inline-flex;align-items:center;gap:6px;padding:4px 12px;
  border-radius:20px;font-size:12px;font-weight:700;letter-spacing:.3px;
  color:#fff;background:linear-gradient(135deg,var(--c-primary),var(--c-dark));
  box-shadow:0 2px 8px rgba(83,95,232,.25);
}
.platform-badge.xhs, .platform-badge.redbook{background:linear-gradient(135deg,#ff2442,#ff5c7c);box-shadow:0 2px 10px rgba(255,36,66,.3)}
.platform-badge.douyin{background:linear-gradient(135deg,#111827,#22d3ee);box-shadow:0 2px 10px rgba(34,211,238,.3)}
.platform-badge.weibo{background:linear-gradient(135deg,#f59e0b,#ef4444);box-shadow:0 2px 10px rgba(239,68,68,.3)}
.platform-badge.kuaishou{background:linear-gradient(135deg,#ff5000,#ff8533);box-shadow:0 2px 10px rgba(255,80,0,.3)}
.platform-badge.bilibili{background:linear-gradient(135deg,#fb7299,#ff85ad);box-shadow:0 2px 10px rgba(251,114,153,.3)}
.platform-badge.xigua{background:linear-gradient(135deg,#ff3b30,#ff6b6b);box-shadow:0 2px 10px rgba(255,59,48,.3)}
.platform-badge.haokan{background:linear-gradient(135deg,#2563eb,#38bdf8);box-shadow:0 2px 10px rgba(37,99,235,.3)}
.platform-badge.qsmusic{background:linear-gradient(135deg,#059669,#10b981);box-shadow:0 2px 10px rgba(16,185,129,.3)}

/* 实时自动识别平台指示器 */
.wm-detected-tip{
  display:flex;align-items:center;gap:8px;padding:8px 14px;
  background:rgba(83,95,232,.08);border:1px solid rgba(83,95,232,.18);
  border-radius:var(--r-md);font-size:12.5px;color:var(--c-text);
  animation:fadeSlideIn .3s ease;
}
.wm-detect-pulse{
  width:8px;height:8px;border-radius:50%;background:#10b981;
  box-shadow:0 0 0 0 rgba(16,185,129,.7);
  animation:detectPulse 1.8s infinite;
}
@keyframes detectPulse{
  0%{transform:scale(0.95);box-shadow:0 0 0 0 rgba(16,185,129,.7)}
  70%{transform:scale(1);box-shadow:0 0 0 8px rgba(16,185,129,0)}
  100%{transform:scale(0.95);box-shadow:0 0 0 0 rgba(16,185,129,0)}
}
.wm-detect-label{color:var(--c-text-sec);font-weight:500}
.wm-detect-badge{
  font-weight:700;color:var(--c-primary);background:rgba(83,95,232,.12);
  padding:2px 8px;border-radius:12px;font-size:11.5px;
}
.supported-platforms-box{
  margin-top:14px;padding-top:14px;border-top:1px dashed rgba(83,95,232,.15);
}
.supported-platforms-head{
  display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;
}
.supported-title{
  font-size:12px;font-weight:600;color:var(--c-text-sec);letter-spacing:.2px;
}
.wm-platform-tags{
  display:flex;flex-wrap:wrap;gap:6px;max-height:160px;overflow-y:auto;padding-right:2px;
}
.wm-tag-item{
  display:inline-flex;align-items:center;gap:4px;
  font-size:11.5px;padding:4px 9px;border-radius:14px;
  background:rgba(83,95,232,.05);color:var(--c-text-sec);
  border:1px solid rgba(83,95,232,.1);cursor:default;
  transition:all .25s ease;user-select:none;
}
.platform-logo-img{
  width:14px;height:14px;object-fit:contain;border-radius:3px;flex-shrink:0;
}
.platform-monogram{
  display:inline-flex;align-items:center;justify-content:center;
  width:14px;height:14px;border-radius:3px;
  color:#fff;font-size:9.5px;font-weight:700;line-height:1;flex-shrink:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
}
.wm-tag-item:hover{
  background:rgba(83,95,232,.1);color:var(--c-primary);
  border-color:rgba(83,95,232,.25);transform:translateY(-1px);
}
.wm-tag-item.active{
  background:linear-gradient(135deg,rgba(83,95,232,.18),rgba(83,95,232,.08));
  color:var(--c-primary);border-color:var(--c-primary);
  font-weight:700;box-shadow:0 2px 8px rgba(83,95,232,.2);transform:scale(1.05);
}

/* 作者卡片 */
.wm-author-card{
  display:flex;align-items:center;gap:16px;padding:16px;
  background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.5);
  border-radius:var(--r-lg);box-shadow:0 4px 16px rgba(58,68,176,.06);
}
.wm-avatar-wrap{position:relative;flex-shrink:0;width:52px;height:52px}
.wm-avatar{
  width:52px;height:52px;border-radius:50%;object-fit:cover;
  border:2.5px solid #fff;box-shadow:0 0 0 2px rgba(83,95,232,.3);
  position:relative;z-index:2;background:#fff;
}
.wm-avatar-fallback{
  width:52px;height:52px;border-radius:50%;background:rgba(83,95,232,.12);
  display:flex;align-items:center;justify-content:center;color:var(--c-primary);
  border:2px solid rgba(83,95,232,.25);
}
.wm-author-meta{flex:1;min-width:0}
.result-title{
  font-size:16px;font-weight:700;color:var(--c-text);margin-bottom:6px;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.wm-author-line{display:flex;align-items:center;gap:8px}
.wm-label{font-size:12px;color:var(--c-text-sec)}
.wm-author-name{font-size:13px;font-weight:600;color:var(--c-primary)}

/* 文案描述 */
.wm-desc-card{
  padding:14px 16px;background:rgba(83,95,232,.04);border:1px solid rgba(83,95,232,.12);
  border-radius:var(--r-md);display:flex;flex-direction:column;gap:8px;
}
.wm-desc-head{display:flex;align-items:center;justify-content:space-between}
.wm-desc-tag{font-size:12px;font-weight:600;color:var(--c-primary);letter-spacing:.4px}
.wm-btn-tiny{
  display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:6px;
  background:rgba(255,255,255,.8);border:1px solid rgba(83,95,232,.2);
  color:var(--c-primary);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;
}
.wm-btn-tiny:hover{background:#fff;border-color:var(--c-primary);box-shadow:0 2px 6px rgba(83,95,232,.15)}
.wm-desc-text{font-size:13px;line-height:1.6;color:var(--c-text-sec);white-space:pre-wrap;word-break:break-all;max-height:160px;overflow-y:auto}

/* 视频播放器区块 */
.wm-video-section{display:flex;flex-direction:column;gap:14px}
.wm-player-box{
  width:100%;max-width:100%;border-radius:var(--r-md);overflow:hidden;background:#000;
  box-shadow:0 8px 24px rgba(0,0,0,.15);line-height:0;
}
.wm-video-player{width:100%;max-height:480px;display:block;outline:none}

/* 图集区块 */
.wm-gallery-section{display:flex;flex-direction:column;gap:16px}
.wm-gallery-bar{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;
  padding:12px 16px;background:rgba(83,95,232,.05);border:1px solid rgba(83,95,232,.12);
  border-radius:var(--r-md);
}
.wm-gallery-badge{
  display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--c-primary);
}
.wm-gallery-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wm-action-btn{
  display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--r-sm);
  font-size:13px;font-weight:600;cursor:pointer;transition:all .25s;border:none;
}
.wm-zip-btn{
  background:linear-gradient(135deg,var(--c-primary),var(--c-light));color:#fff;
  box-shadow:0 4px 12px rgba(83,95,232,.3);
}
.wm-zip-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 16px rgba(83,95,232,.4)}
.wm-zip-btn:disabled{opacity:.6;cursor:not-allowed}
.wm-batch-btn{
  background:rgba(255,255,255,.9);color:var(--c-text);border:1px solid rgba(83,95,232,.25);
}
.wm-batch-btn:hover{background:#fff;color:var(--c-primary);border-color:var(--c-primary)}
.wm-copy-all-btn{
  background:rgba(83,95,232,.08);color:var(--c-primary);border:1px solid transparent;
}
.wm-copy-all-btn:hover{background:rgba(83,95,232,.15)}

/* 图集网格布局 */
.wm-gallery-grid{
  display:grid;grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));gap:12px;
}
.wm-gallery-grid.grid-1{grid-template-columns:1fr;max-width:540px;margin:0 auto}
.wm-gallery-grid.grid-2{grid-template-columns:repeat(2, 1fr)}
.wm-gallery-grid.grid-3{grid-template-columns:repeat(3, 1fr)}
.wm-gallery-grid.grid-4{grid-template-columns:repeat(2, 1fr)}

.wm-image-card{
  position:relative;border-radius:var(--r-md);overflow:hidden;background:#0d0e15;
  box-shadow:0 4px 14px rgba(58,68,176,.08);border:1px solid rgba(255,255,255,.2);
  aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
}
.wm-gallery-grid.grid-1 .wm-image-card{aspect-ratio:auto;max-height:600px}
.wm-gallery-img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.wm-image-card:hover .wm-gallery-img{transform:scale(1.05)}
.wm-img-idx{
  position:absolute;top:8px;left:8px;z-index:3;
  padding:2px 7px;font-size:11px;font-weight:700;color:#fff;
  background:rgba(0,0,0,.6);backdrop-filter:blur(4px);border-radius:6px;
  pointer-events:none;
}
.wm-img-overlay{
  position:absolute;inset:0;background:linear-gradient(transparent 50%, rgba(0,0,0,.75));
  opacity:0;transition:opacity .25s;display:flex;align-items:flex-end;justify-content:space-between;
  padding:10px;z-index:2;
}
.wm-image-card:hover .wm-img-overlay{opacity:1}
.wm-overlay-btn{
  display:inline-flex;align-items:center;gap:4px;padding:5px 8px;border-radius:6px;
  font-size:11px;font-weight:600;color:#fff;text-decoration:none;border:none;cursor:pointer;
  background:rgba(255,255,255,.2);backdrop-filter:blur(6px);transition:background .2s;
}
.wm-overlay-btn:hover{background:rgba(255,255,255,.35);color:#fff}
.wm-overlay-down{background:var(--c-primary)}
.wm-overlay-down:hover{background:var(--c-light)}

.result-url-box{
  padding:12px;background:rgba(83,95,232,.04);border-radius:var(--r-sm);
  border:1px dashed rgba(83,95,232,.2);
}
.result-url{font-size:12px;color:var(--c-text-sec);word-break:break-all;line-height:1.6;user-select:all}
.result-actions{display:flex;gap:12px}
.action-btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;
  border:none;border-radius:var(--r-md);font-size:14px;font-weight:600;
  cursor:pointer;transition:all .3s;text-decoration:none;
}
.copy-btn{background:linear-gradient(135deg,var(--c-primary),var(--c-light));color:#fff}
.copy-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px rgba(83,95,232,.4)}
.open-btn{background:rgba(83,95,232,.12);color:var(--c-primary)}
.open-btn:hover{background:rgba(83,95,232,.22);transform:translateY(-1px)}
.download-btn{background:rgba(83,95,232,.08);color:var(--c-primary)}
.download-btn:hover{background:rgba(83,95,232,.16);transform:translateY(-1px)}

/* 无公开媒体流时的封面兜底与版权说明（如微信视频号） */
.wm-cover-fallback{
  width:100%;max-height:64vh;object-fit:contain;border-radius:var(--r-md);
  background:#000;display:block;
}
.wm-media-notice{
  display:flex;align-items:flex-start;gap:8px;padding:12px 14px;margin-top:12px;
  background:rgba(255,171,0,.08);border:1px solid rgba(255,171,0,.25);
  border-radius:var(--r-sm);font-size:13px;line-height:1.7;color:#8a5b00;
}

/* ===== 模式切换 ===== */
.mode-switch{display:flex;gap:4px;background:rgba(83,95,232,.06);padding:4px;border-radius:var(--r-md)}
.mode-btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border:none;
  background:transparent;color:var(--c-text-sec);border-radius:var(--r-sm);
  cursor:pointer;font-size:13px;font-weight:600;transition:all .3s;
}
.mode-btn.active{color:var(--c-primary);background:#fff;box-shadow:0 1px 4px rgba(58,68,176,.12)}
.mode-btn:hover:not(.active){color:var(--c-text)}

/* 单行输入 */
.url-input-single{padding:14px 16px}

/* ===== 上传区 ===== */
.upload-zone{
  border:2px dashed rgba(83,95,232,.25);border-radius:var(--r-md);
  padding:32px 20px;text-align:center;cursor:pointer;transition:all .3s;
  background:rgba(83,95,232,.02);
}
.upload-zone:hover,.upload-zone.dragover{border-color:var(--c-light);background:rgba(83,95,232,.06)}
.upload-placeholder{display:flex;flex-direction:column;align-items:center;gap:10px}
.upload-text{font-size:14px;color:var(--c-text-sec);font-weight:500}
.upload-hint{font-size:12px;color:var(--c-text-light)}

.upload-file-info{
  display:flex;align-items:center;gap:8px;padding:10px 14px;
  background:rgba(83,95,232,.06);border-radius:var(--r-sm);
}
.upload-file-info span{flex:1;font-size:13px;color:var(--c-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.upload-file-info .clear-btn{position:static;flex-shrink:0;width:24px;height:24px}

/* ===== 进度条 ===== */
.progress-bar-wrap{display:flex;flex-direction:column;gap:6px}
.progress-bar-row{display:flex;align-items:center;gap:10px}
.progress-bar{flex:1;height:10px;background:rgba(83,95,232,.1);border-radius:5px;overflow:hidden}
.progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--c-primary),var(--c-light));border-radius:5px;transition:width .6s ease}
.progress-pct{font-size:13px;font-weight:700;color:var(--c-primary);min-width:40px;text-align:right}
.progress-text{font-size:13px;color:var(--c-text-sec);text-align:center;font-weight:500}

/* ===== 转文字结果 ===== */
.text-result-box{
  padding:16px;background:rgba(83,95,232,.04);border-radius:var(--r-md);
  font-size:15px;line-height:1.8;color:var(--c-text);max-height:400px;overflow-y:auto;
  white-space:pre-wrap;word-break:break-all;user-select:text;
}

/* ===== 首页 ===== */
.view-home{
  display:flex;flex-direction:column;align-items:center;
  min-height:calc(100vh - 128px);padding-top:60px;
}
.hero{text-align:center;margin-bottom:48px}
.hero-icon{
  width:80px;height:80px;margin:0 auto 20px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--c-primary),var(--c-light));
  border-radius:20px;box-shadow:0 8px 32px rgba(83,95,232,.4);
}
.hero-title{font-size:32px;font-weight:800;color:#fff;margin-bottom:8px;letter-spacing:1px}
.hero-desc{font-size:16px;color:rgba(255,255,255,.7)}

.app-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:20px;max-width:860px;width:100%;padding:0 20px;
}
.app-card{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  padding:28px 16px 20px;
  background:rgba(255,255,255,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.15);border-radius:var(--r-lg);
  cursor:pointer;transition:all .3s;position:relative;user-select:none;
}
.app-card:hover{
  transform:translateY(-4px);
  background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.3);
  box-shadow:0 12px 40px rgba(83,95,232,.25);
}
.app-card:active{transform:translateY(-2px)}
.app-card-icon{
  width:56px;height:56px;display:flex;align-items:center;justify-content:center;
  border-radius:var(--r-lg);color:#fff;box-shadow:0 4px 16px rgba(0,0,0,.15);
}
.app-card-icon svg{width:28px;height:28px}
.app-card-name{font-size:15px;font-weight:700;color:#fff;text-align:center}
.app-card-desc{font-size:12px;color:rgba(255,255,255,.55);text-align:center;line-height:1.4;max-width:160px}
.app-card-delete{
  position:absolute;top:8px;right:8px;width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;
  border:none;background:rgba(255,255,255,.1);border-radius:50%;
  color:rgba(255,255,255,.5);cursor:pointer;font-size:14px;
  opacity:0;transition:all .2s;
}
.app-card:hover .app-card-delete{opacity:1}
.app-card-delete:hover{background:rgba(239,68,68,.5);color:#fff}

/* 视图切换 */
.view-tool{max-width:100%;margin:0 auto}

/* 返回按钮 */
.back-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 16px;margin-bottom:20px;
  background:rgba(255,255,255,.12);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.2);border-radius:10px;
  color:rgba(255,255,255,.8);font-size:14px;font-weight:500;
  cursor:pointer;transition:all .2s;
}
.back-btn:hover{background:rgba(255,255,255,.22);color:#fff}

/* 工作流返回首页按钮 */
.wf-back-home-btn{
  background:rgba(255,255,255,.1);color:rgba(255,255,255,.8);
  border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;gap:4px;
}
.wf-back-home-btn:hover{background:rgba(255,255,255,.2);color:#fff}

/* 生成应用按钮 */
.wf-gen-app-btn{
  background:rgba(16,185,129,.2);color:#6ee7b7;
  border:1px solid rgba(16,185,129,.3);
}
.wf-gen-app-btn:hover{background:rgba(16,185,129,.35);color:#fff;border-color:rgba(16,185,129,.5)}

/* ===== 公众号排版 ===== */
#viewGzhDesign{
  width:min(1760px,calc(100vw - 48px));
  max-width:none;
  margin-left:50%;
  transform:translateX(-50%);
}
.gzh-shell{
  display:grid;grid-template-columns:288px minmax(480px,1fr) minmax(340px,430px);gap:16px;
  height:calc(100vh - 188px);min-height:520px;align-items:stretch;
}
.gzh-side,.gzh-editor,.gzh-preview-panel,.admin-panel{
  background:rgba(255,255,255,.12);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.18);border-radius:var(--r-lg);box-shadow:var(--shadow);
  min-height:0;
}
.gzh-side{padding:20px;display:flex;flex-direction:column;gap:18px;color:#fff;overflow-y:auto;overflow-x:hidden}
.gzh-brand{display:flex;align-items:center;gap:12px;margin-bottom:4px}
.gzh-brand-mark{
  width:48px;height:48px;display:flex;align-items:center;justify-content:center;
  border-radius:14px;background:linear-gradient(135deg,#2563EB,#60A5FA);
  color:#fff;font-size:14px;font-weight:900;letter-spacing:0;box-shadow:0 8px 24px rgba(37,99,235,.25);
}
.gzh-brand h2{font-size:22px;color:#fff;margin:0 0 3px}
.gzh-brand p{font-size:12px;color:rgba(255,255,255,.62);margin:0;line-height:1.5}
.gzh-control{display:flex;flex-direction:column;gap:8px}
.gzh-control-title,.gzh-label{font-size:13px;font-weight:700;color:rgba(255,255,255,.86)}
.gzh-palette-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gzh-palette-card{
  min-height:64px;padding:10px;border:none;border-radius:10px;background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.13);color:#fff;text-align:left;cursor:pointer;
  transition:all .2s;display:flex;flex-direction:column;justify-content:space-between;gap:8px;
}
.gzh-palette-card:hover,.gzh-palette-card.active{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.34)}
.gzh-palette-card.active{box-shadow:0 0 0 2px rgba(96,165,250,.7)}
.gzh-palette-card span:last-child{font-size:12px;font-weight:700}
.gzh-palette-swatches{display:flex;gap:4px}
.gzh-palette-swatches i{width:16px;height:16px;border-radius:50%;border:1px solid rgba(255,255,255,.35);display:block}
.gzh-select,.gzh-mini-input{
  width:100%;height:42px;border:1px solid rgba(255,255,255,.16);border-radius:10px;
  background:rgba(255,255,255,.12);color:#fff;padding:0 12px;outline:none;font-family:inherit;font-size:13px;
}
.gzh-select option{color:#111827;background:#fff}
.gzh-select:focus,.gzh-mini-input:focus{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.18)}
.gzh-color-row{display:grid;grid-template-columns:52px 1fr;gap:10px}
.gzh-color-row input[type=color]{
  width:52px;height:42px;border:1px solid rgba(255,255,255,.2);border-radius:10px;
  background:rgba(255,255,255,.12);padding:4px;cursor:pointer;
}
.gzh-secondary-btn,.gzh-ghost-btn,.gzh-copy-rich{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:10px;
  font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:all .2s;text-decoration:none;
}
.gzh-secondary-btn{
  width:100%;padding:12px;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.18);
}
.gzh-secondary-btn:hover{background:rgba(255,255,255,.2)}
.gzh-secondary-btn:disabled,.gzh-ghost-btn:disabled{opacity:.55;cursor:not-allowed}
.gzh-editor{padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0;overflow:hidden}
.gzh-editor-head,.gzh-preview-toolbar,.admin-list-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.gzh-tabs{display:flex;gap:6px;background:rgba(255,255,255,.1);padding:4px;border-radius:10px}
.gzh-tab{
  border:none;background:transparent;color:rgba(255,255,255,.66);border-radius:8px;padding:8px 12px;
  font-size:13px;font-weight:700;cursor:pointer;transition:all .2s;
}
.gzh-tab.active{background:#fff;color:var(--c-primary)}
.gzh-editor-actions,.gzh-preview-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.gzh-ghost-btn{
  padding:8px 12px;background:rgba(255,255,255,.12);color:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.16);
}
.gzh-ghost-btn:hover{background:rgba(255,255,255,.2);color:#fff}
.gzh-meta-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gzh-meta-input{
  width:100%;height:42px;border:1px solid rgba(255,255,255,.16);border-radius:10px;
  background:rgba(255,255,255,.92);color:var(--c-text);padding:0 12px;outline:none;font-family:inherit;font-size:13px;
}
.gzh-meta-input::placeholder{color:var(--c-text-light)}
.gzh-textarea{
  width:100%;flex:1;min-height:0;border:1px solid rgba(255,255,255,.16);border-radius:14px;
  background:rgba(18,24,38,.72);color:#e5e7eb;resize:none;outline:none;padding:18px;
  font:14px/1.75 SFMono-Regular,Consolas,'PingFang SC','Microsoft YaHei',monospace;
  overflow:auto;
}
.gzh-textarea:focus{border-color:rgba(255,255,255,.36);box-shadow:0 0 0 4px rgba(255,255,255,.08)}
.gzh-source{color:#a7f3d0}
.gzh-preview-panel{padding:16px;display:flex;flex-direction:column;gap:14px;min-width:0;overflow:hidden}
.gzh-preview-toolbar{color:#fff}
.gzh-preview-toolbar strong{font-size:16px}
.gzh-preview-toolbar span{display:inline-block;margin-left:8px;font-size:12px;color:rgba(255,255,255,.62)}
.gzh-preview-toolbar span.ok{color:#86efac}
.gzh-preview-toolbar span.warn{color:#fde68a}
.gzh-preview-toolbar span.bad{color:#fecaca}
.gzh-copy-rich{padding:8px 13px;background:linear-gradient(135deg,#2563EB,#60A5FA);color:#fff}
.gzh-copy-rich:hover{box-shadow:0 6px 18px rgba(37,99,235,.35);transform:translateY(-1px)}
.gzh-phone{
  width:min(100%,414px);height:auto;aspect-ratio:9/19.5;max-height:100%;
  align-self:center;min-height:0;background:#fff;border-radius:24px;padding:18px 10px 10px;
  box-shadow:0 20px 60px rgba(15,23,42,.28);overflow:hidden;border:1px solid rgba(255,255,255,.7);
  display:flex;flex-direction:column;
}
.gzh-phone-top{width:72px;height:5px;border-radius:5px;background:#e5e7eb;margin:0 auto 14px}
.gzh-preview{
  flex:1;min-height:0;overflow:auto;padding:0 12px 22px;background:#fff;border-radius:12px;
}
.gzh-preview img{max-width:100%}

/* ===== 后台管理 ===== */
.admin-shell{max-width:1180px;margin:0 auto}
.admin-header{padding-top:16px}
.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.admin-panel{padding:20px;display:flex;flex-direction:column;gap:12px}
.admin-panel h3{font-size:17px;color:#fff;margin:0 0 4px}
.admin-list-panel{grid-column:1/-1}
.admin-config-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.admin-provider-card{
  background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.45);border-radius:12px;padding:14px;color:var(--c-text);
}
.admin-provider-main{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:8px}
.admin-provider-main strong{display:block;font-size:15px;margin-bottom:4px}
.admin-provider-main span{display:block;font-size:11px;color:var(--c-text-sec);word-break:break-all;line-height:1.45}
.admin-key-line{font-size:12px;color:var(--c-text-sec);margin-bottom:10px}
.admin-mini-danger{
  border:none;border-radius:8px;background:rgba(239,68,68,.1);color:#b91c1c;
  padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer;flex-shrink:0;
}
.admin-mini-danger:hover{background:rgba(239,68,68,.18)}
.admin-model-list{display:flex;flex-wrap:wrap;gap:8px}
.admin-model-chip{
  display:flex;align-items:center;gap:6px;background:rgba(83,95,232,.08);border:1px solid rgba(83,95,232,.12);
  border-radius:999px;padding:5px 7px 5px 10px;font-size:12px;color:var(--c-text);
}
.admin-model-chip button{
  width:18px;height:18px;border:none;border-radius:50%;background:rgba(107,114,128,.15);
  color:var(--c-text-sec);cursor:pointer;line-height:18px;
}
.admin-model-chip button:hover{background:rgba(239,68,68,.18);color:#b91c1c}
.admin-empty,.admin-empty-inline{font-size:13px;color:rgba(255,255,255,.7)}
.admin-empty-inline{color:var(--c-text-sec)}
.admin-msg{
  margin-top:4px;padding:10px 12px;border-radius:10px;font-size:13px;font-weight:700;text-align:center;
}
.admin-msg.ok{background:rgba(16,185,129,.14);color:#6ee7b7;border:1px solid rgba(16,185,129,.2)}
.admin-msg.bad{background:rgba(239,68,68,.14);color:#fecaca;border:1px solid rgba(239,68,68,.2)}

/* 响应式 */
@media(max-width:640px){
  .navbar-inner{padding:0 16px}
  .main-content{padding:80px 16px 32px}
  .tool-title{font-size:20px}
  .input-card,.result-card{padding:18px}
  .result-actions{flex-direction:column}
  .mode-switch{flex-direction:column}
  .wf-editor-main{flex-direction:column}
  .wf-palette{width:100%!important;flex-direction:row!important;overflow-x:auto;max-height:none!important}
  .wf-pal-card{flex-shrink:0}
  .wf-topbar{flex-direction:column;gap:8px}
  #viewGzhDesign{width:100%;margin-left:0;transform:none}
  .gzh-shell{height:auto;min-height:0}
  .gzh-shell,.admin-grid{grid-template-columns:1fr}
  .gzh-meta-row{grid-template-columns:1fr}
  .gzh-textarea{min-height:380px;flex:none}
  .gzh-preview-panel{min-height:640px}
  .gzh-phone{width:min(100%,390px);height:auto;aspect-ratio:9/19.5;max-height:none}
  .gzh-editor-head,.gzh-preview-toolbar{align-items:flex-start;flex-direction:column}
  .gzh-editor-actions,.gzh-preview-actions{justify-content:flex-start}
}

@media(min-width:641px) and (max-width:1280px){
  #viewGzhDesign{width:calc(100vw - 32px)}
  .gzh-shell{grid-template-columns:260px minmax(420px,1fr) minmax(300px,360px);gap:14px}
}

@media(min-width:641px) and (max-width:1060px){
  .gzh-shell{height:auto;grid-template-columns:260px 1fr}
  .gzh-preview-panel{grid-column:1/-1;min-height:780px}
  .gzh-textarea{min-height:520px;flex:none}
  .gzh-phone{width:min(100%,414px);height:auto;aspect-ratio:9/19.5;max-height:none}
}

/* ===== 工作流 - 全屏画布编辑器 ===== */
.wf-fullscreen{
  position:fixed;top:64px;left:0;right:0;bottom:0;display:flex;flex-direction:column;
  background:linear-gradient(135deg,var(--c-dark) 0%,var(--c-primary) 30%,var(--c-light) 60%,var(--c-lighter) 85%,var(--c-lightest) 100%);
  background-attachment:fixed;z-index:50;
}

/* 顶部栏 */
.wf-topbar{
  display:flex;align-items:center;gap:12px;padding:10px 16px;
  background:rgba(255,255,255,.12);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.2);flex-shrink:0;
}
.wf-topbar-left{flex-shrink:0}
.wf-topbar-center{flex:1;display:flex;justify-content:center}
.wf-topbar-right{display:flex;gap:8px;flex-shrink:0}

.wf-saved-bar{display:flex;gap:6px;align-items:center}
.wf-saved-scroll{display:flex;gap:6px}
.wf-chip{
  display:flex;align-items:center;gap:5px;padding:5px 12px;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.2);border-radius:16px;
  color:rgba(255,255,255,.9);font-size:12px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap;
}
.wf-chip:hover{background:rgba(255,255,255,.25);color:#fff}
.wf-chip.active{background:rgba(255,255,255,.3);color:#fff;border-color:rgba(255,255,255,.4)}
.wf-chip-del{
  width:16px;height:16px;display:flex;align-items:center;justify-content:center;
  border:none;background:rgba(255,255,255,.15);border-radius:50%;color:inherit;
  cursor:pointer;font-size:12px;transition:background .2s;
}
.wf-chip-del:hover{background:rgba(239,68,68,.5)}
.wf-new-btn{
  padding:5px 12px;border:1px dashed rgba(255,255,255,.35);border-radius:16px;
  background:transparent;color:rgba(255,255,255,.8);font-size:12px;cursor:pointer;transition:all .2s;
}
.wf-new-btn:hover{border-color:rgba(255,255,255,.6);color:#fff;background:rgba(255,255,255,.15)}

.wf-name-input{
  width:260px;padding:6px 14px;border:1px solid rgba(255,255,255,.25);border-radius:8px;
  background:rgba(255,255,255,.15);font-size:14px;font-weight:600;color:#fff;
  outline:none;text-align:center;font-family:inherit;
}
.wf-name-input:focus{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.25)}
.wf-name-input::placeholder{color:rgba(255,255,255,.4)}

.wf-act-btn{
  padding:7px 16px;border:none;border-radius:8px;font-size:13px;font-weight:600;
  cursor:pointer;transition:all .2s;
}
.wf-save-btn{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.25)}
.wf-save-btn:hover{background:rgba(255,255,255,.25)}
.wf-clear-btn{background:rgba(255,255,255,.1);color:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.15)}
.wf-clear-btn:hover{background:rgba(255,255,255,.2);color:#fff}
.wf-exec-top-btn{background:linear-gradient(135deg,#535FE8,#7681F8);color:#fff}
.wf-exec-top-btn:hover{box-shadow:0 4px 16px rgba(83,95,232,.5)}

/* 编辑器主体 */
.wf-editor-main{display:flex;flex:1;overflow:hidden;position:relative}

/* 工具面板 */
.wf-palette{
  width:220px;flex-shrink:0;padding:12px;overflow-y:auto;
  background:rgba(255,255,255,.1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-right:1px solid rgba(255,255,255,.15);
  display:flex;flex-direction:column;gap:8px;
}
.wf-pal-card{
  display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 10px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:10px;
  cursor:grab;transition:all .2s;user-select:none;text-align:center;
}
.wf-pal-card:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.3);transform:translateY(-1px)}
.wf-pal-card:active{cursor:grabbing;opacity:.8}
.wf-pal-card span{display:block;font-size:13px;font-weight:600;color:#fff}
.wf-pal-card small{display:block;font-size:11px;color:rgba(255,255,255,.5);margin-top:2px;line-height:1.3}
.wf-pal-card svg{flex-shrink:0;width:22px;height:22px}

/* 画布 */
.wf-canvas-wrap{flex:1;overflow:auto;position:relative;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.06) 0%, transparent 60%),
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:100% 100%, 24px 24px, 24px 24px;
}
.wf-canvas{position:relative;width:4000px;height:3000px}
.wf-canvas.drag-over{box-shadow:inset 0 0 60px rgba(255,255,255,.1)}

/* 缩放控件 */
.wf-zoom-controls{
  position:absolute;bottom:16px;right:16px;z-index:10;
  display:flex;align-items:center;gap:4px;padding:6px 10px;
  background:rgba(255,255,255,.15);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.2);border-radius:10px;
}
.wf-zoom-btn{
  width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  border:none;background:rgba(255,255,255,.1);border-radius:6px;color:#fff;
  cursor:pointer;font-size:16px;transition:all .2s;
}
.wf-zoom-btn:hover{background:rgba(255,255,255,.25)}
.wf-zoom-label{font-size:12px;color:rgba(255,255,255,.7);min-width:40px;text-align:center}

/* SVG 连线层 */
.wf-svg{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}
.wf-edge-path{pointer-events:stroke;cursor:pointer;transition:stroke .2s}
.wf-edge-path:hover{stroke-width:4!important;filter:drop-shadow(0 0 6px rgba(255,255,255,.4))}
.wf-edge-dot{pointer-events:none}

/* 节点 */
.wf-node{
  position:absolute;width:200px;
  background:rgba(30,30,52,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.1);border-radius:12px;
  box-shadow:0 4px 24px rgba(0,0,0,.3);user-select:none;transition:box-shadow .2s;
}
.wf-node:hover{box-shadow:0 8px 32px rgba(0,0,0,.4)}
.wf-node.dragging{opacity:.85;z-index:100;box-shadow:0 12px 48px rgba(83,95,232,.3)}
.wf-node.wf-node-processing{box-shadow:0 0 0 3px rgba(83,95,232,.4),0 4px 24px rgba(0,0,0,.3)}
.wf-node.wf-node-success{box-shadow:0 0 0 3px rgba(16,185,129,.5),0 4px 24px rgba(0,0,0,.3)}
.wf-node.wf-node-error{box-shadow:0 0 0 3px rgba(239,68,68,.5),0 4px 24px rgba(0,0,0,.3)}

.wf-node-header{
  display:flex;align-items:center;gap:8px;padding:10px 12px;
  border-radius:12px 12px 0 0;cursor:grab;
}
.wf-node-header:active{cursor:grabbing}
.wf-node-icon{display:flex;align-items:center}
.wf-node-title{flex:1;font-size:13px;font-weight:700;color:#fff}
.wf-node-del{
  width:20px;height:20px;display:flex;align-items:center;justify-content:center;
  border:none;background:rgba(255,255,255,.15);border-radius:50%;color:rgba(255,255,255,.7);
  cursor:pointer;font-size:14px;transition:all .2s;
}
.wf-node-del:hover{background:rgba(239,68,68,.5);color:#fff}

.wf-node-body{padding:8px 0}
.wf-port-group{display:flex;flex-direction:column;gap:4px}
.wf-port-in{margin-bottom:4px}
.wf-port-row{display:flex;align-items:center;gap:8px;padding:4px 12px;font-size:12px;color:rgba(255,255,255,.65);position:relative}
.wf-port-out .wf-port-row{justify-content:flex-end}

.wf-port-dot{
  width:12px;height:12px;border-radius:50%;
  border:2px solid rgba(255,255,255,.3);background:rgba(30,30,52,.9);
  cursor:crosshair;transition:all .2s;flex-shrink:0;
}
.wf-port-dot:hover{border-color:#fff;background:rgba(255,255,255,.3);box-shadow:0 0 8px rgba(255,255,255,.5);transform:scale(1.3)}

/* 执行弹窗 */
.wf-modal{
  position:fixed;top:0;left:0;right:0;bottom:0;z-index:200;
  background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.wf-modal-box{
  width:100%;max-width:600px;max-height:80vh;
  background:rgba(255,255,255,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-radius:20px;border:1px solid rgba(255,255,255,.3);
  box-shadow:0 24px 80px rgba(0,0,0,.3);overflow:hidden;
  display:flex;flex-direction:column;
}
.wf-modal-header{
  display:flex;align-items:center;justify-content:space-between;padding:16px 20px;
  border-bottom:1px solid rgba(83,95,232,.1);
}
.wf-modal-header h3{font-size:16px;font-weight:700;color:var(--c-text)}
.wf-modal-close{
  width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  border:none;background:rgba(107,114,128,.1);border-radius:50%;color:var(--c-text-sec);
  cursor:pointer;font-size:18px;
}
.wf-modal-body{padding:20px;display:flex;flex-direction:column;gap:12px;overflow-y:auto}
.wf-modal-footer{padding:0 20px 20px}

/* 结果展示 */
.wf-result-body{display:flex;flex-direction:column;gap:12px;max-height:40vh;overflow-y:auto}
.wf-result-step{
  padding:12px;background:rgba(83,95,232,.04);border-radius:10px;border:1px solid rgba(83,95,232,.08);
}
.wf-result-header{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.wf-result-badge{
  width:22px;height:22px;display:flex;align-items:center;justify-content:center;
  border-radius:50%;font-size:12px;font-weight:700;color:#fff;flex-shrink:0;
}
.wf-result-badge.ok{background:#10b981}
.wf-result-badge.err{background:#ef4444}
.wf-result-name{font-size:14px;font-weight:600;color:var(--c-text)}
.wf-result-text{font-size:14px;line-height:1.8;color:var(--c-text);white-space:pre-wrap;max-height:200px;overflow-y:auto}
.wf-result-title{font-size:14px;font-weight:600;color:var(--c-text);margin-bottom:4px}
.wf-result-url{font-size:11px;color:var(--c-text-sec);word-break:break-all}
.wf-result-err{font-size:13px;color:#b91c1c}