/* TestStar UI — shell layout aligned with Copilot / PRTS */

/* 顶级导航 group 美化(UI 自动化 + 需求转用例 共用) */
#nav-vision-star,
#nav-requirement {
  margin: 0.5rem 0.75rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}

#nav-vision-star .nav-group-toggle,
#nav-requirement .nav-group-toggle {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.9rem 1.25rem;
  background: linear-gradient(135deg, var(--surface) 0%, var(--code-bg) 100%);
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

#nav-vision-star .nav-group-toggle:hover,
#nav-requirement .nav-group-toggle:hover {
  background: linear-gradient(135deg, var(--nav-hover) 0%, var(--code-bg) 100%);
}

#nav-vision-star .nav-group-label,
#nav-requirement .nav-group-label {
  flex: 1;
  text-align: left;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0;
  text-transform: none;
  color: var(--accent);
}

#nav-vision-star .nav-icon,
#nav-requirement .nav-icon {
  color: var(--hg-yellow);
  opacity: 1;
  font-size: 0.8rem;
  margin-right: 10px;
}
/* 📥 emoji 需要更大字号 */
#nav-requirement .nav-icon {
  font-size: 1.05rem;
}

#nav-vision-star .nav-chevron,
#nav-requirement .nav-chevron {
  font-size: 1rem;
  color: var(--muted);
  transition: transform 0.2s;
}

#nav-vision-star.expanded .nav-chevron,
#nav-requirement.expanded .nav-chevron {
  transform: rotate(90deg);
}

#nav-vision-star .nav-group-children,
#nav-requirement .nav-group-children {
  padding: 0.4rem 0;
  gap: 0;
}

#nav-vision-star .nav-sub-item,
#nav-requirement .nav-sub-item {
  display: flex;
  align-items: center;
  padding: 0.75rem 1.25rem 0.75rem 2.5rem;
  color: var(--muted);
  cursor: pointer;
  transition: all 0.15s;
  font-size: 0.88rem;
  font-weight: 500;
  letter-spacing: 0.5px;
  border-left: 3px solid transparent;
  text-decoration: none;
}

#nav-vision-star .nav-sub-item::before,
#nav-requirement .nav-sub-item::before {
  content: "›";
  margin-right: 10px;
  font-size: 0.9rem;
  color: var(--muted);
  opacity: 0.5;
  transition: all 0.15s;
}

#nav-vision-star .nav-sub-item:hover,
#nav-requirement .nav-sub-item:hover {
  color: var(--text);
  background: linear-gradient(90deg, var(--nav-hover) 0%, transparent 100%);
}

#nav-vision-star .nav-sub-item:hover::before,
#nav-requirement .nav-sub-item:hover::before {
  opacity: 1;
  color: var(--accent);
  transform: translateX(2px);
}

#nav-vision-star .nav-sub-item.active,
#nav-requirement .nav-sub-item.active {
  color: var(--hg-yellow);
  background: linear-gradient(90deg, var(--nav-active) 0%, transparent 100%);
  font-weight: 600;
}

#nav-vision-star .nav-sub-item.active::before,
#nav-requirement .nav-sub-item.active::before {
  color: var(--hg-yellow);
  opacity: 1;
}

/* 添加分隔线效果 */
#nav-vision-star .nav-group-children,
#nav-requirement .nav-group-children {
  border-top: 1px solid var(--border);
}

/* 添加微妙的阴影效果 */
#nav-vision-star {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.content:has(#page-vision-star.active) {
  padding: 0.5rem 0.75rem 0.75rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.content:has(#page-vision-star-template.active),
.content:has(#page-vision-star-import.active) {
  padding: 0.5rem 0.75rem 0.75rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

#page-vision-star.page.active {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  height: auto;
}

#page-vision-star h2 {
  margin-bottom: 0;
}

.vs-page-header {
  flex-shrink: 0;
  margin-bottom: 0.65rem;
}

.vs-page-header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.vs-page-title-wrap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
/* 全局 h2 带 1.5rem margin-bottom 会把 flex 盒子撑高, 徽章显得偏低 */
.vs-page-title-wrap h2 {
  margin-bottom: 0;
}

.vs-stat-pill {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  padding: 0.2rem 0.55rem;
  border: 1px solid var(--code-border);
  background: var(--code-bg);
  color: var(--accent);
}

.vs-page-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.vs-intro {
  margin: 0.45rem 0 0;
  padding-left: 14px;
  font-size: 0.88rem;
  color: var(--muted);
  line-height: 1.45;
  max-width: 56rem;
}

.vs-shell {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) minmax(280px, 340px);
  gap: 0.65rem;
  flex: 1;
  min-height: 0;
  height: calc(100vh - 11.5rem);
}

/* 模板/导入页面的 shell 使用 2 列布局 */
.vs-template-shell,
.vs-workshop-shell {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
}

@media (max-width: 1200px) {
  .vs-shell {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 640px;
  }
}

.vs-sidebar,
.vs-main,
.vs-aside {
  border: 1px solid var(--border);
  background: var(--surface);
  min-height: 0;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

.vs-sidebar::after,
.vs-main::after,
.vs-aside::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 14px;
  height: 14px;
  border-bottom: 2px solid var(--muted);
  border-right: 2px solid var(--muted);
  opacity: 0.35;
  pointer-events: none;
}

.vs-panel-head {
  flex-shrink: 0;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, var(--surface2) 0%, var(--surface) 100%);
}

.vs-panel-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--accent);
}

.vs-case-list {
  flex: 1;
  overflow: auto;
  padding: 0.45rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.vs-case-list .empty {
  padding: 1.5rem 0.75rem;
  text-align: center;
  font-size: 0.85rem;
}

.vs-case-item {
  text-align: left;
  border: 1px solid transparent;
  border-left: 3px solid transparent;
  background: var(--bg);
  color: var(--text);
  padding: 0.55rem 0.65rem;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  display: grid;
  grid-template-columns: 1.6rem 1fr;
  grid-template-rows: auto auto;
  column-gap: 0.55rem;
  align-items: center;
}

.vs-case-item .vs-case-index {
  grid-row: 1 / 3;
  align-self: center;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  text-align: center;
  font-variant-numeric: tabular-nums;
  user-select: none;
  padding-left: 0;
}

.vs-case-item:hover .vs-case-index {
  color: var(--accent);
}

.vs-case-item.active .vs-case-index {
  color: var(--accent);
}

.vs-case-item .vs-case-name {
  grid-column: 2;
  grid-row: 1;
}

.vs-case-item .vs-case-meta {
  grid-column: 2;
  grid-row: 2;
}

.vs-case-item:hover {
  border-color: var(--border);
  background: var(--row-hover);
}

.vs-case-item.active {
  border-color: var(--border);
  background: var(--nav-active);
}

.vs-case-name {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 600;
  word-break: break-all;
}

.vs-case-meta {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.7rem;
  color: var(--muted);
}

/* ── 侧边用例库：批量删除 ── */
.vs-case-panel-head {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.vs-case-panel-head .vs-panel-label {
  flex: 1;
}

.vs-batch-toggle,
.vs-batch-actions .btn {
  padding: 0.15rem 0.5rem;
  font-size: 0.72rem;
}

.vs-batch-actions {
  display: flex;
  gap: 0.35rem;
}

.vs-batch-actions[hidden] {
  display: none;
}

.vs-case-item.checking {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.vs-case-item.checking.checked {
  border-color: var(--accent);
  background: var(--nav-active);
}

.vs-case-check {
  flex-shrink: 0;
  margin-top: 0.15rem;
  width: 15px;
  height: 15px;
  accent-color: var(--accent);
  pointer-events: none; /* 整行点击切换，避免 checkbox 与 row 双触发 */
}

.vs-case-item.checking .vs-case-index {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  user-select: none;
  min-width: 1.1rem;
  text-align: center;
  align-self: center;
  padding-top: 0;
}

.vs-case-item.checking:hover .vs-case-index {
  color: var(--accent);
}

.vs-case-item.checking.checked .vs-case-index {
  color: var(--accent);
}

.vs-case-info {
  flex: 1;
  min-width: 0;
}

.vs-editor-head {
  flex-shrink: 0;
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, var(--surface2) 0%, var(--surface) 100%);
}

.vs-editor-head h3 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text);
}

.vs-editor-sub {
  margin: 0.25rem 0 0;
  font-size: 0.78rem;
  color: var(--muted);
}

.vs-editor-wrap {
  flex: 1;
  min-height: 0;
  padding: 0.5rem;
  background: var(--bg);
}

#vs-yaml-editor {
  width: 100%;
  height: 100%;
  min-height: 280px;
  resize: none;
  border: 1px solid var(--code-border);
  background: var(--code-bg);
  color: var(--text);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 0.8rem;
  line-height: 1.55;
  padding: 0.85rem 1rem;
  tab-size: 2;
}

#vs-yaml-editor:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 1px rgba(35, 131, 226, 0.15);
}

.vs-run-log-panel {
  flex-shrink: 0;
  border-top: 1px solid var(--border);
  background: var(--surface2);
  max-height: 640px;
  display: flex;
  flex-direction: column;
}

.vs-run-log-panel[hidden] {
  display: none !important;
}

.vs-run-log-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.45rem 0.85rem;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.vs-run-log-head-left {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.vs-log-brand-mark {
  flex: 0 0 auto;
  opacity: 0.85;
}

.vs-run-log-hint {
  font-size: 0.72rem;
  margin-left: auto;
}

.vs-run-log-sub {
  margin-left: 0.5rem;
  font-size: 0.75rem;
  color: var(--muted);
}

.vs-run-log-close {
  padding: 0.2rem 0.55rem;
  font-size: 0.72rem;
}

.vs-run-log-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.vs-run-log-copy {
  padding: 0.2rem 0.55rem;
  font-size: 0.72rem;
}

.vs-agent-log {
  max-height: 420px;
}

.vs-agent-log .vs-run-log-content {
  min-height: 280px;
  max-height: none;
}

.vs-run-log-content {
  margin: 0;
  padding: 0.65rem 0.85rem;
  overflow: auto;
  flex: 1;
  min-height: 120px;
  max-height: none;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.72rem;
  line-height: 1.45;
  color: var(--text);
  background: rgba(0, 0, 0, 0.22);
}

.vs-editor-footer {
  flex-shrink: 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 0.65rem 0.85rem;
  border-top: 1px solid var(--border);
  background: var(--surface2);
}

.vs-footer-field {
  flex: 1;
  min-width: 180px;
  max-width: 320px;
}

.vs-field-label {
  display: block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--muted);
  margin-bottom: 0.3rem;
}

.vs-footer-field input {
  width: 100%;
  font-family: var(--font-mono);
  font-size: 0.82rem;
}

.vs-run-options {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin-right: 0.15rem;
}

.vs-run-retry {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.82rem;
  color: var(--muted);
}

.vs-run-retry input {
  width: 3.2rem;
  font-family: var(--font-mono);
  font-size: 0.82rem;
  padding: 0.2rem 0.35rem;
}

.vs-footer-actions {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.vs-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.82rem;
  color: var(--muted);
  margin-right: 0.25rem;
  cursor: pointer;
  user-select: none;
}

.vs-check input {
  accent-color: var(--accent);
}

.vs-btn-danger:hover {
  border-color: var(--fail);
  color: var(--fail);
}

.vs-tabs {
  display: flex;
  flex-shrink: 0;
  border-bottom: 1px solid var(--border);
  background: var(--surface2);
}

.vs-tab {
  flex: 1;
  padding: 0.6rem 0.5rem;
  border: none;
  background: transparent;
  color: var(--muted);
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}

.vs-tab:hover {
  color: var(--text);
}

.vs-tab.active {
  color: var(--hg-yellow);
  border-bottom-color: var(--hg-yellow);
  background: var(--nav-active);
}

.vs-tab-panel {
  display: none;
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0.75rem;
}

.vs-tab-panel.active {
  display: flex;
  flex-direction: column;
}

.vs-chat-layout {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--bg);
  border: 1px solid var(--border);
}

.vs-chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.vs-chat-msg {
  display: flex;
  gap: 0.65rem;
  max-width: 95%;
}

.vs-chat-msg.user {
  align-self: flex-end;
  flex-direction: row-reverse;
}

.vs-chat-avatar {
  width: 26px;
  height: 26px;
  border-radius: 4px;
  background: var(--surface2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--muted);
  flex-shrink: 0;
  font-family: var(--font-mono);
}

.vs-chat-msg.assistant .vs-chat-avatar {
  background: rgba(35, 131, 226, 0.15);
  color: var(--accent);
}

.vs-chat-msg.user .vs-chat-avatar {
  background: rgba(107, 114, 128, 0.15);
  color: var(--hg-yellow);
}

.vs-chat-bubble {
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 0.6rem 0.75rem;
  border-radius: 6px;
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--text);
  word-break: break-word;
}

.vs-chat-msg.user .vs-chat-bubble {
  background: var(--surface2);
}

.vs-chat-bubble img {
  max-width: 100%;
  max-height: 160px;
  border-radius: 6px;
  margin-bottom: 0.4rem;
  display: block;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.vs-chat-bubble pre {
  background: var(--code-bg);
  border: 1px solid var(--code-border);
  padding: 0.5rem;
  border-radius: 4px;
  overflow-x: auto;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  margin: 0.5rem 0;
  white-space: pre-wrap;
}

.vs-chat-input-area {
  border-top: 1px solid var(--border);
  background: var(--surface);
  padding: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.vs-granularity-hint {
  margin-left: auto;
  font-size: 0.72rem;
  color: var(--muted);
}
/* ── 用例结果卡: 预览 + 采纳入库 / 弃用 ──
   卡片是工作产物不是对话气泡: 脱离气泡宽度约束占满对话行, 气泡壳退位。
   选择器带 .assistant 提高优先级——后面还有一条 .vs-chat-msg.assistant 会
   压回 flex-start 并给整行加壳 */
.vs-chat-msg.assistant:has(.vs-case-card) {
  align-self: stretch;
  max-width: 100%;
  background: transparent;
  border: 0;
  padding: 0;
}
.vs-chat-msg.assistant:has(.vs-case-card) .vs-chat-bubble {
  flex: 1;
  max-width: none;
  background: transparent;
  border: 0;
  padding: 0;
}
.vs-case-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface, var(--bg));
  overflow: hidden;
  box-shadow: 0 1px 3px rgb(0 0 0 / 4%);
}
.vs-case-card[data-state="discarded"] {
  opacity: 0.62;
}
.vs-case-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--accent) 5%, transparent);
}
.vs-case-card-title {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text);
}
.vs-case-card-badge {
  font-size: 0.74rem;
  font-family: var(--font-mono, monospace);
  padding: 0.14rem 0.6rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  color: var(--muted);
  white-space: nowrap;
}
.vs-case-card-badge.tone-ok {
  color: var(--pass, #157f15);
  border-color: color-mix(in srgb, var(--pass, #157f15) 40%, transparent);
  background: color-mix(in srgb, var(--pass, #157f15) 8%, transparent);
}
.vs-case-card-badge.tone-warn {
  color: var(--fail, #c0392b);
  border-color: color-mix(in srgb, var(--fail, #c0392b) 40%, transparent);
  background: color-mix(in srgb, var(--fail, #c0392b) 8%, transparent);
}
.vs-case-card-preview {
  border-bottom: 1px solid var(--border);
}
.vs-case-card-preview summary {
  cursor: pointer;
  padding: 0.45rem 1rem;
  font-size: 0.78rem;
  color: var(--muted);
  user-select: none;
}
.vs-case-card-preview summary:hover {
  color: var(--text);
}
.vs-case-card-code {
  margin: 0;
  padding: 0.75rem 1rem;
  max-height: 300px;
  overflow: auto;
  font-family: var(--font-mono, monospace);
  font-size: 0.78rem;
  line-height: 1.6;
  color: var(--text);
  white-space: pre;
  background: color-mix(in srgb, var(--border) 8%, transparent);
}
.vs-case-card-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem;
  padding: 0.7rem 1rem;
}
.vs-case-card-id {
  flex: 1;
  min-width: 240px;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.4rem 0.7rem;
  font-family: var(--font-mono, monospace);
  font-size: 0.8rem;
  background: var(--bg);
  color: var(--text);
}
.vs-case-card-id:focus {
  outline: none;
  border-color: var(--accent);
}
.vs-case-card-id.vs-input-err {
  border-color: var(--fail, #c0392b);
}
.vs-case-card-note {
  font-size: 0.78rem;
  color: var(--muted);
}

.vs-chat-attachments {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.vs-chat-attachments:empty {
  display: none;
}

.vs-chat-attach-item {
  position: relative;
  width: 50px;
  height: 50px;
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: hidden;
  background: #000;
}

.vs-chat-attach-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vs-chat-attach-rm {
  position: absolute;
  top: 2px;
  right: 2px;
  background: rgba(0,0,0,0.65);
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  font-size: 9px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vs-chat-attach-rm:hover {
  background: rgba(224, 62, 62, 0.8);
}

.vs-chat-input-box {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
}

#vs-chat-textarea {
  flex: 1;
  resize: none;
  height: auto;
  /* 默认至少 3 行, 输入多行时 autogrow 最高 200px(2026-09-08) */
  min-height: 86px;
  max-height: 200px;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--bg);
  color: var(--text);
  font-family: inherit;
  font-size: 0.85rem;
  line-height: 1.55;
  line-height: 1.4;
}

#vs-chat-textarea:focus {
  outline: none;
  border-color: var(--accent);
}

.vs-chat-btn {
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  border-radius: 4px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1.1rem;
  transition: background 0.2s, color 0.2s;
}

.vs-chat-attach-btn {
  background: var(--surface2);
  color: var(--muted);
  border: 1px solid var(--border);
}

.vs-chat-attach-btn:hover {
  background: var(--border);
  color: var(--text);
}

.vs-chat-send-btn {
  background: var(--accent);
  color: var(--accent-text);
}

.vs-chat-send-btn:hover {
  background: var(--accent-hover);
}

.vs-typing {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8rem;
  color: var(--muted);
}
.vs-typing-dot {
  width: 4px;
  height: 4px;
  background: var(--muted);
  border-radius: 50%;
  animation: typing 1.4s infinite ease-in-out both;
}
.vs-typing-dot:nth-child(1) { animation-delay: -0.32s; }
.vs-typing-dot:nth-child(2) { animation-delay: -0.16s; }
@keyframes typing {
  0%, 80%, 100% { transform: scale(0); }
  40% { transform: scale(1); }
}

.vs-stream-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-width: 0;
}

.vs-stream-status {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.78rem;
  color: var(--accent);
  letter-spacing: 0.02em;
}

.vs-stream-pending {
  display: inline-flex;
  align-items: center;
  gap: 0.22rem;
}
.vs-stream-pending[style*="display: none"] { display: none !important; }

.vs-stream-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
  opacity: 0.35;
  animation: vs-stream-bounce 1.05s ease-in-out infinite;
}
.vs-stream-dot:nth-child(2) { animation-delay: 0.18s; }
.vs-stream-dot:nth-child(3) { animation-delay: 0.36s; }

.vs-stream-pending-text {
  color: var(--accent);
  font-weight: 500;
}
.vs-stream-pending-timer {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-size: 0.72rem;
}
.vs-stream-pending-timer[style*="display: none"] { display: none !important; }

@keyframes vs-stream-bounce {
  0%, 80%, 100% { opacity: 0.35; transform: translateY(0); }
  40%           { opacity: 1;    transform: translateY(-3px); }
}
@media (prefers-reduced-motion: reduce) {
  .vs-stream-dot { animation: none; opacity: 0.7; }
}

.vs-stream-output {
  margin: 0;
  padding: 0.65rem 0.75rem;
  max-height: 320px;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.25);
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--text);
}

.vs-stream-output code {
  white-space: pre-wrap;
  word-break: break-word;
}

.vs-chat-context-bar {
  display: flex;
  gap: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0.5rem;
}

.vs-chat-inline-field {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.vs-chat-inline-field label {
  margin: 0;
  white-space: nowrap;
}

.vs-chat-inline-field input {
  padding: 0.35rem 0.5rem;
  min-width: 200px;
}

.vs-chat-context-bar #vs-btn-agent-save {
  align-self: flex-end;
  white-space: nowrap;
}

.vs-agent-guard-check {
  align-self: flex-end;
  font-size: 0.78rem;
  white-space: nowrap;
}

.vs-agent-shell {
  display: flex;
  min-height: calc(100vh - 12rem);
}

/* 2026-09-07: AI 生成用例页钉成视口内工作台 —— 页头/配置条占自然高度,
   对话区吃剩余高度内部滚动, 颗粒度+输入框恒定贴底可见(此前被内容撑出视口)。
   必须挂在 .active 上: ID 选择器优先级高于全局 .page{display:none},
   否则该页永远可见, 盖住其他页面 */
#page-vision-star-agent.vs-page.active {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 7.6rem);
  min-height: 520px;
  overflow: hidden;
}
#page-vision-star-agent .vs-page-header {
  flex: none;
}
/* 启动地址 / CASE ID / 后端三列: URL 给更大基础宽度,后端下拉保持紧凑 */
.vs-agent-configbar > .vs-chat-inline-field:nth-child(1) { flex: 1.8 1 320px; }
.vs-agent-configbar > .vs-chat-inline-field:nth-child(2) { flex: 1 1 220px; }
.vs-agent-configbar > .vs-chat-inline-field:nth-child(3) { flex: 0 1 200px; }
.vs-agent-configbar > .vs-btn { white-space: nowrap; }
.vs-agent-configbar > .vs-check { flex: 0 0 auto; }
#page-vision-star-agent .vs-agent-shell {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
#page-vision-star-agent .vs-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* 2026-09-09: UI 测试库编辑器塌陷修复 —— .vs-main 此前是普通块级,
   .vs-editor-wrap{flex:1} 不生效塌成 16px(padding 高), 280px 的 textarea
   溢出画到后续 .vs-editor-footer(运行目标/执行选项网格)底下, 点击全被
   网格拦截 → 用例看起来"不能编辑"。与生成页同款 flex 列处理。 */
#page-vision-star .vs-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow-y: auto;
}
#page-vision-star .vs-editor-wrap {
  flex: 1 0 auto;
  min-height: 280px;
}
#page-vision-star-agent .vs-chat-layout {
  flex: 1;
  min-height: 0;
  height: auto;
}
#page-vision-star-agent .vs-agent-log-panel {
  flex: none;
  max-height: 45%;
  overflow: auto;
}
#page-vision-star-agent .vs-agent-aside {
  overflow-y: auto;
  min-height: 0;
}

.vs-agent-shell .vs-main {
  flex: 1.15;
  min-width: 0;
}

.vs-agent-aside {
  flex: 0.85;
  min-width: 280px;
  max-width: 480px;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--border);
  background: var(--surface);
}
/* display:flex 会覆盖 hidden 属性的 UA display:none —— 不补这条,
   未生成 YAML 时右侧面板也空占一列(2026-09-08) */
.vs-agent-aside[hidden] {
  display: none;
}

.vs-agent-yaml-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.vs-agent-yaml-status {
  font-size: 0.72rem;
  color: var(--muted);
}

.vs-agent-yaml {
  flex: 1;
  min-height: 240px;
  width: 100%;
  margin: 0;
  padding: 0.75rem;
  resize: none;
  border: none;
  border-top: 1px solid var(--border);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--text);
  background: var(--code-bg);
}

.vs-run-list {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  flex: 1;
}

.vs-run-list .empty {
  padding: 2rem 0.5rem;
  text-align: center;
  font-size: 0.85rem;
}

.vs-run-row {
  border: 1px solid var(--border);
  padding: 0.55rem 0.65rem;
  background: var(--bg);
  cursor: pointer;
}

.vs-run-row.active {
  background: rgba(35, 131, 226, 0.08);
  border-color: rgba(35, 131, 226, 0.25);
}

.vs-run-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  margin-bottom: 0.35rem;
}

.vs-run-main strong {
  font-family: var(--font-mono);
  font-size: 0.78rem;
}

.vs-run-meta {
  width: 100%;
  font-size: 0.7rem;
  color: var(--muted);
}

.vs-run-actions {
  display: flex;
  justify-content: flex-end;
}

.vs-run-actions .btn {
  padding: 0.25rem 0.55rem;
  font-size: 0.75rem;
}

.vs-aside-tabs {
  display: flex;
  gap: 0.25rem;
  padding: 0.45rem 0.55rem 0;
  border-bottom: 1px solid var(--border);
}

.vs-aside-tab {
  flex: 1;
  border: 1px solid transparent;
  background: transparent;
  color: var(--muted);
  font-size: 0.72rem;
  padding: 0.35rem 0.4rem;
  cursor: pointer;
}

.vs-aside-tab.active {
  color: var(--accent);
  border-color: var(--border);
  background: var(--bg);
}

.vs-aside-panel {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0.5rem;
}

.vs-aside-panel[hidden] {
  display: none !important;
}

.vs-suite-row,
.vs-defect-row {
  border: 1px solid var(--border);
  padding: 0.55rem 0.65rem;
  background: var(--bg);
  margin-bottom: 0.45rem;
}

.vs-suite-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.vs-defect-actions {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: 0.45rem;
}
.vs-defect-actions-group {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}
/* 2026-09-11: 缺陷卡主操作与回写三件套按钮统一收紧,
   视觉上两行等高、字号一致、padding 一致, 不再一高一矮 */
.vs-defect-actions .btn {
  font-size: 0.74rem;
  padding: 0.28rem 0.55rem;
  letter-spacing: 0;
  /* 2026-09-11: 中英文按钮 baseline 不一致("运行日志" 等硬编码中文
     与 i18n 渲染的英文字号基线不齐), 强制固定 height + 上下居中让对齐 */
  height: 26px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
/* 2026-09-09: 同步外部平台三件套弱化处理 —— 右上小字标签提示, 与核心确认/诊断组区分开 */
.vs-defect-actions-verdict .btn {
  font-size: 0.72rem;
  padding: 0.28rem 0.55rem;
  color: var(--muted);
  border-color: var(--line);
}
.vs-defect-actions-verdict .btn:hover { color: var(--text); }
.vs-defect-actions-label {
  font-size: 0.68rem;
  color: var(--muted);
  margin-bottom: 0.1rem;
  letter-spacing: 0.2px;
}

.vs-suite-actions {
  padding-top: 0.5rem;
}

.modal.modal-wide.vs-report-modal {
  width: min(98vw, 1680px);
  max-width: 98vw;
  height: 94vh;
  max-height: 94vh;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}

.vs-report-modal-head {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem 1.1rem;
  border-bottom: 1px solid var(--border);
}

.vs-report-modal-head h3 {
  margin: 0;
  font-size: 1rem;
}

#vs-report-frame {
  flex: 1;
  width: 100%;
  min-height: 0;
  height: 100%;
  border: 0;
  background: #fff;
}

.vs-hint {
  font-size: 0.82rem;
  color: var(--muted);
  margin: 0;
  line-height: 1.5;
}

.vs-hint code {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  padding: 0.1rem 0.35rem;
  background: var(--code-bg);
  border: 1px solid var(--code-border);
}

.vs-workshop-shell {
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
  min-height: calc(100vh - 12rem);
}

.vs-workshop-aside {
  flex: 1;
  min-width: 0;
  max-width: 1100px;
  display: flex;
  flex-direction: column;
  border-left: 1px solid rgba(0, 0, 0, 0.06);
  background: #FFFFFF;
  padding: 1.25rem 1.4rem;
  border-radius: 10px;
}

.vs-workshop-config {
  flex: 1.3;
  min-width: 0;
  max-width: 900px;
  padding: 1rem 1.25rem;
  overflow: visible;
}

.vs-workshop-config h3 {
  margin: 0 0 0.35rem;
}

/* ========== 表单字段（精致版） ========== */
.vs-field-group {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.vs-field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.85rem;
}

.vs-form-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.vs-form-field label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0;
  text-transform: none;
  padding-left: 0.1rem;
}

.vs-form-field input[type="text"],
.vs-form-field select {
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg);
  color: var(--text);
  font-size: 0.85rem;
  font-family: inherit;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.vs-form-field input[type="text"]:focus,
.vs-form-field select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(35, 131, 226, 0.15);
}

.vs-form-field input[type="text"]::placeholder {
  color: var(--muted);
  opacity: 0.6;
}

/* 转换模式 */
.vs-import-mode {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.25rem;
}

.vs-import-mode .vs-panel-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0;
  text-transform: none;
  padding-left: 0.1rem;
}

.vs-radio-group {
  display: flex;
  gap: 0.5rem;
}

.vs-radio-label {
  display: inline-flex !important;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  cursor: pointer;
  font-size: 0.82rem !important;
  color: var(--text) !important;
  transition: all 0.15s;
  margin-right: 0 !important;
}

.vs-radio-label:hover {
  border-color: var(--accent);
  background: var(--surface2);
}

.vs-radio-label:has(input:checked) {
  border-color: var(--accent);
  background: rgba(35, 131, 226, 0.08);
}

.vs-radio-label input[type="radio"] {
  accent-color: var(--accent);
  margin: 0;
}

.vs-radio-label span {
  font-size: 0.82rem;
}

.vs-template-form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1rem;
}

.vs-workshop-config-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1rem;
  flex-wrap: wrap;
}

.vs-workshop {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0.75rem;
  gap: 0.5rem;
}

.vs-workshop-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.vs-workshop-btns {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.vs-workshop-yaml {
  flex: 1;
  min-height: 280px;
  width: 100%;
  resize: vertical;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8rem;
  line-height: 1.45;
  padding: 0.75rem;
  border: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.2);
  color: var(--text);
}

.vs-workshop-status {
  font-size: 0.82rem;
  line-height: 1.5;
  min-height: 1.25rem;
}

.vs-workshop-ok { color: var(--ok); }
.vs-workshop-err { color: var(--fail); }
.vs-workshop-warn { color: var(--warning); }

/* 校验警告：可读的列表块 */
.vs-warn-block {
  display: block;
  margin-top: 0.4rem;
  line-height: 1.6;
}
.vs-warn-block ul {
  margin: 0.25rem 0 0;
  padding-left: 1.15rem;
}
.vs-warn-block li {
  font-size: 0.82rem;
  margin-bottom: 0.15rem;
}
.vs-workshop-info { color: var(--accent); }
.vs-workshop-muted { color: var(--muted); }

.vs-workshop-mapping {
  max-height: 120px;
  overflow: auto;
  font-size: 0.78rem;
  border: 1px solid var(--border);
  padding: 0.5rem;
}

.vs-mapping-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 0.35rem;
  padding: 0.2rem 0;
  border-bottom: 1px solid var(--border);
}

.vs-mapping-src { color: var(--text); }
.vs-mapping-arrow { color: var(--muted); }
.vs-mapping-kind { color: var(--accent); font-family: var(--font-mono); }

.vs-workshop-log {
  max-height: 200px;
  margin-top: 0.25rem;
}

/* —— 进度指示（试跑 / 自动修正）—— */
.vs-progress {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.85rem;
  color: var(--text);
}

.vs-progress-spinner {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  border-radius: 50%;
  border: 2px solid rgba(35, 131, 226, 0.25);
  border-top-color: var(--accent);
  animation: vs-spin 0.7s linear infinite;
}

@keyframes vs-spin {
  to { transform: rotate(360deg); }
}

.vs-progress-label {
  flex: 1;
  min-width: 0;
}

.vs-progress-elapsed {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--muted);
  padding: 0.1rem 0.4rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  flex-shrink: 0;
}

/* —— AI 生成页精致化 —— */
#page-vision-star-agent .vs-page-actions .btn.secondary {
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  padding: 0.38rem 0.85rem;
  border-radius: 6px;
}

#page-vision-star-agent .vs-chat-context-bar {
  gap: 0.75rem 1rem;
  align-items: flex-end;
  flex-wrap: wrap;
}

#page-vision-star-agent .vs-chat-inline-field label {
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--muted);
}

#page-vision-star-agent .vs-chat-inline-field input {
  font-size: 0.8rem;
  border-radius: 6px;
  padding: 0.42rem 0.6rem;
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.18);
}

/* 后端选择器 — 跟其他 inline-field 风格一致 */
.vs-backend-field {
  min-width: 140px;
}

.vs-backend-field-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.72rem;
  color: var(--muted);
  margin-right: 0.5rem;
}

.vs-backend-select {
  font-size: 0.78rem;
  padding: 0.42rem 0.6rem;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(0, 0, 0, 0.18);
  color: inherit;
  cursor: pointer;
  min-width: 130px;
}

.vs-backend-select option:disabled {
  color: rgba(255, 255, 255, 0.35);
}

.vs-backend-select.is-unavailable {
  color: rgba(255, 255, 255, 0.45);
  font-style: italic;
}

#page-vision-star-agent #vs-btn-agent-save {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 0.42rem 0.9rem;
  border-radius: 6px;
}

#page-vision-star-agent .vs-agent-guard-check {
  font-size: 0.76rem;
  color: var(--muted);
}

#page-vision-star-agent .vs-agent-guard-check span {
  letter-spacing: 0.02em;
}

#page-vision-star-agent .vs-chat-bubble {
  border-radius: 10px;
  box-shadow: none;
}

#page-vision-star-agent .vs-chat-btn {
  border-radius: 8px;
}

#page-vision-star-agent .vs-chat-send-btn {
  font-size: 1rem;
  box-shadow: 0 0 0 1px rgba(35, 131, 226, 0.25);
}

#page-vision-star-agent .vs-agent-yaml-head .vs-panel-label {
  font-size: 0.78rem;
  letter-spacing: 0.06em;
}

.vs-chat-zoomable {
  cursor: zoom-in;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.vs-chat-zoomable:hover {
  box-shadow: 0 0 0 2px rgba(35, 131, 226, 0.35);
  transform: scale(1.01);
}

.vs-image-zoom-modal {
  width: min(96vw, 1200px);
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  padding: 0;
}

.vs-image-zoom-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid var(--border);
}

.vs-btn-compact {
  padding: 0.28rem 0.65rem;
  font-size: 0.72rem;
  letter-spacing: 0.03em;
}

.vs-image-zoom-body {
  flex: 1;
  overflow: auto;
  padding: 0.75rem;
  background: rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
}

.vs-image-zoom-body img {
  max-width: 100%;
  max-height: calc(92vh - 4rem);
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}

/* 套件页占满视口（与 UI 测试库页一致） */
.content:has(#page-vision-star-suites.active) {
  padding: 0.5rem 0.75rem 0.75rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

#page-vision-star-suites.page.active {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  height: auto;
}

/* 2026-09-08: 系统设置页补同样布局——此前 .page.active{display:block}
   + .vs-page-header{flex-shrink:0} 在非 flex 容器里把标题挤到视口中部,
   表现为 H2 下方一大段空白, 与其他 vs-page 行为不一致 */
#page-vision-star-settings.page.active {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  height: auto;
}
#page-vision-star-settings .vs-page-header { flex-shrink: 0; margin-bottom: 0.65rem; }
#page-vision-star-settings .vs-settings-tabs { flex-shrink: 0; }
#page-vision-star-settings .vs-settings-wrap { flex: 1; min-height: 0; }

.vs-suites-shell {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 0.75rem;
  flex: 1;
  min-height: 0;
  height: calc(100vh - 11.5rem);
}

.vs-suites-sidebar,
.vs-suites-main {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  min-height: 0;
}

.vs-suites-sidebar {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.vs-suites-main {
  padding: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: 0;
}

.vs-suites-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 360px;
  color: var(--muted);
}

.vs-suites-head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: flex-end;
}

.vs-suites-head-actions {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
  margin-left: auto;
}

.vs-suites-desc {
  width: 100%;
  min-height: 56px;
  font-family: var(--font);
  font-size: 0.86rem;
}

.vs-suites-tabs {
  display: flex;
  gap: 0.35rem;
  border-bottom: 1px solid var(--border);
}

.vs-suites-panel {
  display: none;
  flex: 1;
}

.vs-suites-panel.active {
  display: block;
}

.vs-suites-dual {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
  flex: 1;
  min-height: 0;
}

.vss-file-notice {
  padding: 1rem 1.1rem;
  border: 1px dashed var(--border);
  border-radius: var(--radius);
  background: var(--surface2);
  color: var(--muted);
  line-height: 1.5;
}

.vss-file-notice p {
  margin: 0 0 0.35rem;
}

.vss-file-notice p:last-child {
  margin-bottom: 0;
}

.vs-suites-picker {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  min-height: 0;
  background: var(--surface2);
  display: flex;
  flex-direction: column;
}

.vss-picker-head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.vss-picker-head .vs-stat-pill {
  margin-left: auto;
}

.vss-picker-head .btn-sm {
  margin-left: 0.35rem;
}

.vss-picker-toolbar {
  display: flex;
  gap: 0.45rem;
  padding: 0.45rem 0.55rem 0;
  align-items: center;
}

.vss-case-search {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  padding: 0.4rem 0.55rem;
  font-size: 0.84rem;
}

.vss-case-search:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(35, 131, 226, 0.12);
}

.vss-order-hint {
  margin: 0;
  padding: 0.35rem 0.55rem 0;
  font-size: 0.78rem;
  color: var(--muted);
}

/* ── 套件详情（设计精修）── */
.vs-suites-main { padding: 1rem 1.1rem; }

#vss-detail:not([hidden]) {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

#vss-empty {
  flex: 1;
}

.vs-suites-panel {
  min-height: 0;
}

#vss-panel-cases.active {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

#vss-panel-schedules.active {
  overflow: auto;
}

.vssd-head {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 1.4rem;
  align-items: start;
}

/* 套件运行选项卡(2026-09-06): 详情头部,立即运行/定时任务共用;分三组栅格 */
.vss-run-options-wrap {
  margin-top: 0.9rem;
}

.vss-run-options-title {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--muted);
  margin-bottom: 0.45rem;
}

.vss-run-options-hint {
  font-weight: 400;
  margin-left: 0.35rem;
}

/* ═══ 定时任务 Cron(2026-09-06): 表达式输入 + 自然语言解析 + 预览 ═══ */
/* 统一栅格对齐: 标签列固定宽 → 三行输入框同起点同宽,按钮同高(用户反馈要对齐) */
.vs-sched-row {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.vs-sched-row > .vs-field-label {
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  line-height: 1.3;
  margin: 0;
}

.vs-sched-row > .vss-sched-span2 {
  grid-column: 2 / -1;
}

.vs-sched-label-ghost {
  width: 110px;
}

.vs-schedule-form input[type="text"],
.vs-schedule-form input[type="number"] {
  height: 40px;
  padding: 0 12px;
  font-size: 14px;
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--bg-panel);
  color: var(--text);
  box-sizing: border-box;
  width: 100%;
  transition: border-color 0.15s;
}

.vs-schedule-form input:focus {
  outline: none;
  border-color: var(--accent);
}

.vs-schedule-form .vs-sched-row .btn {
  height: 40px;
  padding: 0 18px;
  flex: none;
  white-space: nowrap;
}

.vss-cron-row {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.vss-cron-input {
  font-family: var(--font-mono);
  letter-spacing: 0.03em;
}

.vss-cron-preview {
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--surface);
  padding: 0.5rem 0.7rem;
  font-size: 0.8rem;
  line-height: 1.6;
}

.vss-cron-preview code {
  font-family: var(--font-mono);
  font-weight: 600;
  color: var(--accent);
}

.vss-cron-ok {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.vss-cron-explain {
  color: var(--muted);
}

.vss-cron-next {
  color: var(--muted);
  display: flex;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.vss-cron-next span {
  font-family: var(--font-mono);
  font-size: 0.76rem;
}

.vss-cron-err {
  color: var(--fail);
}

.vss-cron-chip {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.76rem;
  padding: 1px 7px;
  border: 1px solid var(--line2);
  border-radius: 6px;
  background: var(--surface);
  color: var(--accent);
}

.vss-run-options-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.8rem;
  align-items: start;
}

.vssd-fields {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  min-width: 0;
}

.vssd-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.vssd-label {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--muted);
}

.vssd-input {
  width: 100%;
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0.5rem 0.65rem;
  font-size: 0.9rem;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.vssd-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.vssd-input::placeholder {
  color: color-mix(in srgb, var(--muted) 60%, transparent);
  opacity: 1;
}

.vssd-textarea {
  font-family: var(--font);
  resize: vertical;
  min-height: 2.4rem;
}

.vssd-meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-top: 1.05rem;
  min-width: 12rem;
}

.vssd-meta-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.vssd-meta-label {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
}

.vssd-id-input {
  border: 1px solid var(--line2);
  border-radius: 6px;
  background: var(--surface2);
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: 0.75rem;
  padding: 0.3rem 0.5rem;
  width: auto;
  min-width: 5rem;
}

.vssd-source {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  color: var(--muted);
  line-height: 1.5;
}

.vssd-actions {
  display: flex;
  gap: 0.4rem;
  flex-shrink: 0;
  padding-top: 1.05rem;
}

/* 底部下划线式 tab */
.vs-suites-tabs {
  display: flex;
  gap: 0.25rem;
  border-bottom: 1px solid var(--line);
}

.vs-suites-tab {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 600;
  padding: 0.5rem 0.9rem;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 0.12s, border-color 0.12s;
}

.vs-suites-tab:hover { color: var(--text); }
.vs-suites-tab.active { color: var(--accent); border-bottom-color: var(--accent); }

/* 双栏挑选器头部 */
.vss-picker-head {
  padding: 0.6rem 0.7rem 0;
}

.vss-picker-label {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0;
}

.vs-suites-picker-members .vss-picker-label { color: var(--accent); }

#vss-picker-available { background: var(--surface); }
.vs-suites-picker-members { background: color-mix(in srgb, var(--accent) 3%, var(--surface)); }

.vss-picker-count {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--muted);
  background: var(--surface);
  border: 1px solid var(--line2);
  border-radius: 999px;
  padding: 0.08rem 0.5rem;
}

.vss-picker-spacer { flex: 1; }

/* 挑选器搜索框 */
.vss-search-wrap {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}

.vss-search-ico {
  position: absolute;
  left: 0.65rem;
  color: var(--muted);
  pointer-events: none;
}

.vss-search-input {
  flex: 1;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0.5rem 0.65rem 0.5rem 2rem;
  font-size: 0.86rem;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.vss-search-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.vss-search-input::placeholder {
  color: color-mix(in srgb, var(--muted) 65%, transparent);
  opacity: 1;
}

/* 用例行平台标签（可选用例 + 套件成员共用） */
.vss-case-plat {
  display: inline-block;
  padding: 0.04rem 0.35rem;
  margin-right: 0.35rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--accent);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  vertical-align: middle;
}

/* 套件成员行 */
.vss-member-row {
  grid-template-columns: 1.8rem 1fr auto;
  border-radius: 8px;
}

.vss-member-main {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.vss-member-meta {
  font-size: 0.72rem;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 0.2rem;
}

.vss-dirty-hint {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.vss-dirty-hint::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--warn, #b45309);
}

.vs-suites-case-pool {
  padding: 0.55rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.vss-pool-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  text-align: center;
  gap: 0.25rem;
  color: var(--muted);
}

.vss-pool-empty p {
  margin: 0;
  font-size: 0.9rem;
}

.vss-case-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  text-align: left;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  border-radius: 8px;
  padding: 0.45rem 0.55rem;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}

.vss-case-row:hover:not(:disabled) {
  border-color: var(--accent);
  background: rgba(35, 131, 226, 0.04);
}

.vss-case-row:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

.vss-case-row-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.vss-case-row-id {
  font-weight: 600;
  font-size: 0.86rem;
  word-break: break-all;
}

.vss-case-row-meta {
  font-size: 0.74rem;
  color: var(--muted);
}

.vss-case-row-add {
  flex-shrink: 0;
  width: 1.65rem;
  height: 1.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  border: 1px solid var(--border);
  color: var(--accent);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
}

.vss-member-row {
  display: grid;
  grid-template-columns: 2rem 1fr auto;
  gap: 0.45rem;
  align-items: center;
  padding: 0.42rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  font-size: 0.84rem;
}

.vss-member-idx {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}

.vss-member-id {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}

.vss-member-actions {
  display: flex;
  gap: 0.25rem;
  flex-shrink: 0;
}

.vss-dirty-hint {
  color: var(--warn, var(--warning));
  font-size: 0.82rem;
  margin-right: auto;
}

.vss-new-form {
  display: grid;
  gap: 0.65rem;
  margin: 0.75rem 0;
}

.vss-new-form textarea {
  width: 100%;
  min-height: 56px;
  font-family: var(--font);
  font-size: 0.86rem;
}

/* ── 新建回归套件（两栏：基本信息 + 挑选用例）──
   半径规则：modal 16px / 表单字段 8px / 用例行 8px / chips 胶囊 / 按钮沿用平台 4px */
.modal-vss-new {
  width: min(1080px, 95vw);
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
  box-shadow: 0 24px 60px -24px rgba(20, 26, 38, 0.28), 0 2px 8px -2px rgba(20, 26, 38, 0.06);
  animation: vss-modal-in 0.18s ease-out;
}

.modal-vss-new .modal-corner { display: none; }

@keyframes vss-modal-in {
  from { opacity: 0; transform: translateY(6px) scale(0.985); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .modal-vss-new { animation: none; }
}

.modal-vss-new .vss-new-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem 1rem;
  border-bottom: 1px solid var(--line);
}

.modal-vss-new .vss-new-head h3 {
  margin: 0 0 0.3rem;
  font-size: 1.05rem;
  font-weight: 650;
  letter-spacing: 0;
  color: var(--text);
}

.modal-vss-new .vss-new-head .vs-hint {
  margin: 0;
  font-size: 0.78rem;
  color: var(--muted);
  max-width: 46ch;
  line-height: 1.5;
}

.vss-new-body {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(400px, 1.1fr);
  max-height: 68vh;
}

.vss-new-meta {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  border-right: 1px solid var(--line);
  overflow: auto;
}

.vss-new-meta .vs-footer-field {
  max-width: none;
}

.vss-new-meta .vs-field-label {
  display: block;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--muted);
  margin-bottom: 0.35rem;
}

.vss-new-meta input[type="text"],
.vss-new-meta textarea {
  width: 100%;
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0.58rem 0.7rem;
  font-size: 0.9rem;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.vss-new-meta input[type="text"]:focus,
.vss-new-meta textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.vss-new-meta input[type="text"] { font-family: var(--font-mono); }
.vss-new-meta textarea { font-family: var(--font); resize: vertical; min-height: 74px; }

.vss-new-meta input[type="text"]::placeholder,
.vss-new-meta textarea::placeholder {
  color: color-mix(in srgb, var(--muted) 65%, transparent);
  opacity: 1;
}

/* 套件 ID：折叠在高级选项里（自动生成，可手动改） */
.vss-id-details {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface2);
  overflow: hidden;
}

.vss-id-details summary {
  cursor: pointer;
  padding: 0.55rem 0.7rem;
  font-size: 0.78rem;
  color: var(--muted);
  font-weight: 600;
  user-select: none;
  list-style: none;
}

.vss-id-details summary::-webkit-details-marker { display: none; }

.vss-id-details summary::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-right: 0.45rem;
  border-left: 5px solid var(--accent);
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  transition: transform 0.12s;
}

.vss-id-details[open] summary::before { transform: rotate(90deg); }

.vss-id-body {
  padding: 0 0.7rem 0.7rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.vss-new-meta .vss-id-body input[type="text"] {
  width: 100%;
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0.5rem 0.65rem;
  font-family: var(--font-mono);
  font-size: 0.84rem;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.vss-new-meta .vss-id-body input[type="text"]:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.vss-id-body .vs-hint { margin: 0; }

/* 常用标签建议 chips */
.vss-new-tag-suggest {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.4rem;
}

.vss-new-tag-suggest-label {
  font-size: 0.7rem;
  color: var(--muted);
  margin-right: 0.05rem;
}

.vss-tag-sug {
  border: 1px solid var(--line2);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 0.72rem;
  padding: 0.18rem 0.55rem;
  cursor: pointer;
  transition: border-color 0.12s, color 0.12s, background 0.12s;
}

.vss-tag-sug:hover { border-color: var(--accent); color: var(--accent); }
.vss-tag-sug.on { background: var(--accent); border-color: var(--accent); color: var(--accent-text); }

.vss-new-meta .vs-hint {
  margin-top: 0.3rem;
  font-size: 0.72rem;
  color: var(--muted);
}

.vss-id-state {
  margin-top: 0.35rem;
  font-size: 0.74rem;
  font-weight: 600;
}

.vss-id-state.ok { color: var(--ok, #6bae3f); }
.vss-id-state.err { color: var(--fail, #d4516e); }

.vss-new-meta-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 0.5rem;
  padding-top: 1rem;
  border-top: 1px dashed var(--line);
}

.vss-new-summary {
  font-family: var(--font-mono);
  font-size: 0.76rem;
  color: var(--muted);
}

.vss-new-summary.on { color: var(--accent); font-weight: 600; }

.vss-new-actions {
  display: flex;
  gap: 0.5rem;
}

.vss-new-picker {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 1.25rem 1.5rem;
  gap: 0.8rem;
}

.vss-new-picker-head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.vss-new-picker-head .vs-panel-label { flex-shrink: 0; }

.vss-new-filter {
  flex-shrink: 0;
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0.55rem 1.9rem 0.55rem 0.65rem;
  font-size: 0.84rem;
  font-weight: 500;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none' stroke='%235B6470' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.6rem center;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.vss-new-filter:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.vss-new-search-wrap {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}

.vss-new-search-ico {
  position: absolute;
  left: 0.7rem;
  color: var(--muted);
  pointer-events: none;
}

.vss-new-search {
  flex: 1;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0.55rem 0.7rem 0.55rem 2.1rem;
  font-size: 0.9rem;
  transition: border-color 0.12s, box-shadow 0.12s;
}

.vss-new-search:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.vss-new-search::placeholder {
  color: color-mix(in srgb, var(--muted) 65%, transparent);
  opacity: 1;
}

.vss-new-case-pool {
  display: flex;
  flex-direction: column;
  gap: 0.42rem;
  max-height: 360px;
  overflow: auto;
  padding-right: 0.25rem;
}

.vss-new-case-row {
  cursor: pointer;
  border-radius: 8px;
  padding: 0.55rem 0.65rem;
}

.vss-new-plat {
  display: inline-block;
  padding: 0.05rem 0.35rem;
  margin-right: 0.35rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--accent);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  vertical-align: middle;
}

.vss-new-case-row .vss-new-check {
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  accent-color: var(--accent);
}

.vss-new-case-row.on {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 7%, var(--surface));
}

.vss-new-checkmark {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--line2);
  color: transparent;
  font-weight: 700;
  font-size: 0.85rem;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.vss-new-case-row.on .vss-new-checkmark {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-text);
}

.vss-new-selected {
  border-top: 1px dashed var(--line);
  padding-top: 0.7rem;
}

.vss-new-selected-head {
  font-size: 0.74rem;
  color: var(--muted);
  margin-bottom: 0.45rem;
}

.vss-new-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.vss-new-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.22rem 0.5rem;
  border: 1px solid var(--line2);
  border-radius: 999px;
  background: var(--surface2);
  font-family: var(--font-mono);
  font-size: 0.74rem;
  color: var(--text);
}

.vss-new-chip-rm {
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1;
  padding: 0;
}

.vss-new-chip-rm:hover { color: var(--fail, #d4516e); }

@media (max-width: 720px) {
  .modal-vss-new { width: 96vw; }
  .vss-new-body { grid-template-columns: 1fr; max-height: none; }
  .vss-new-meta { border-right: 0; border-bottom: 1px solid var(--line); }
}

.vs-error-hint {
  color: var(--fail, var(--danger));
}

.btn-pulse {
  box-shadow: 0 0 0 2px rgba(35, 131, 226, 0.25);
}

.vs-suites-case-btn {
  text-align: left;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  border-radius: 6px;
  padding: 0.35rem 0.5rem;
  cursor: pointer;
}

.vs-suites-member-row {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: center;
  padding: 0.35rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  font-size: 0.84rem;
}

.vs-suites-panel-actions {
  margin-top: 0.65rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
}

.vs-schedule-form {
  display: grid;
  gap: 0.55rem;
  padding: 0.65rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface2);
  margin-bottom: 0.75rem;
}

.vs-schedule-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.vs-schedule-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.vs-schedule-row-item {
  display: flex;
  justify-content: space-between;
  gap: 0.65rem;
  align-items: flex-start;
  padding: 0.65rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface2);
}

/* ── 定时任务总览页 (2026-09-07) ── */
.vs-sched-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0 1rem 1rem;
}
.vs-sched-empty {
  margin: 3rem auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.8rem;
  color: var(--muted);
}
.vsch-row {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr) auto;
  gap: 0.7rem;
  align-items: start;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface2);
}
.vsch-row-off {
  opacity: 0.55;
}
.vsch-idx {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  color: var(--muted);
  padding-top: 0.15rem;
}
.vsch-main {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
}
.vsch-name-line {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  flex-wrap: wrap;
  min-width: 0;
}
.vsch-suite {
  font-size: 0.72rem;
  font-family: var(--font-mono);
  color: var(--accent);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0 8px;
  background: var(--surface);
}
.vsch-badge {
  font-size: 0.7rem;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid transparent;
}
.vsch-badge.on {
  color: var(--success);
  background: var(--success-weak);
  border-color: var(--success);
}
.vsch-badge.off {
  color: var(--muted);
  background: var(--surface);
  border-color: var(--border);
}
.vsch-meta-sep {
  color: var(--muted);
  margin: 0 0.35rem;
}
.vsch-actions {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

#vs-run-log-stop:not([hidden]),
#vs-agent-log-stop:not([hidden]),
.vswt-log-stop:not([hidden]),
.vswi-log-stop:not([hidden]) {
  border-color: rgba(224, 62, 62, 0.45);
  color: var(--danger);
}

/* ======================================================================
   Workshop page (导入转换) — 三段式布局 + tab + 拖拽上传
   ====================================================================== */

.vs-workshop-section {
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px;
  background: #FFFFFF;
}

.vs-section-title {
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--muted);
  margin: 0 0 0.75rem 0;
}

.vs-tab-row {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.vs-workshop .vs-tab {
  background: transparent;
  border: 0;
  padding: 0.65rem 1.1rem;
  font-size: 0.9rem;
  color: var(--muted);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  border-radius: 0;
}

.vs-workshop .vs-tab:hover {
  color: var(--fg);
  background: #FFFFFF;
}

.vs-workshop .vs-tab.active {
  color: var(--fg);
  border-bottom-color: var(--accent, var(--accent));
  font-weight: 600;
}

.vs-input-pane {
  padding: 0.5rem 0;
}

.vs-input-pane[hidden] {
  display: none;
}

.vs-input-pane textarea {
  width: 100%;
  resize: vertical;
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: 0.88rem;
  line-height: 1.55;
  padding: 0.8rem 0.95rem;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(0, 0, 0, 0.18);
  color: inherit;
}

.vs-input-pane textarea:focus {
  outline: none;
  border-color: var(--accent, var(--accent));
}

.vs-drop-zone {
  border: 2px dashed rgba(255, 255, 255, 0.18);
  border-radius: 10px;
  padding: 1.2rem 1rem;
  text-align: center;
  background: #FFFFFF;
  cursor: pointer;
  transition: all 0.18s ease;
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vs-drop-zone:hover,
.vs-drop-zone:focus {
  border-color: var(--accent, var(--accent));
  background: rgba(35, 131, 226, 0.06);
  outline: none;
}

.vs-drop-zone.is-dragging {
  border-color: var(--accent, var(--accent));
  border-style: solid;
  background: rgba(35, 131, 226, 0.14);
  transform: scale(1.01);
}

.vs-drop-zone-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
}

.vs-drop-zone-icon {
  font-size: 2.4rem;
  opacity: 0.85;
}

.vs-drop-zone-text {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 0.92rem;
  color: var(--muted);
  line-height: 1.5;
}

.vs-drop-zone-text strong {
  color: var(--fg);
  font-size: 1rem;
}

.vs-drop-zone-text a {
  color: var(--accent, var(--accent));
  text-decoration: none;
}

.vs-drop-zone-text a:hover {
  text-decoration: underline;
}

.vs-file-info {
  margin-top: 0.9rem;
  padding: 0.75rem 0.95rem;
  border-radius: 8px;
  background: rgba(35, 131, 226, 0.08);
  border: 1px solid rgba(35, 131, 226, 0.25);
  font-size: 0.88rem;
  line-height: 1.5;
}

.vs-file-info-error {
  background: rgba(224, 62, 62, 0.08);
  border-color: rgba(224, 62, 62, 0.3);
  color: var(--danger);
}

.vs-file-info-meta {
  margin-top: 0.4rem;
  font-size: 0.78rem;
  color: var(--muted);
}

.vs-input-preview {
  margin-top: 0.9rem;
  padding-top: 0.9rem;
  border-top: 1px dashed rgba(255, 255, 255, 0.08);
}

.vs-input-preview label {
  display: block;
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--muted);
  margin-bottom: 0.4rem;
}

.vs-input-preview textarea {
  width: 100%;
  resize: vertical;
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: 0.88rem;
  line-height: 1.55;
  padding: 0.7rem 0.85rem;
  border-radius: 8px;
  border: 1px solid rgba(35, 131, 226, 0.25);
  background: rgba(35, 131, 226, 0.04);
  color: inherit;
}

.vs-workshop-trigger {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: rgba(35, 131, 226, 0.06);
  border-color: rgba(35, 131, 226, 0.25);
}

.vs-workshop-trigger .btn {
  font-size: 1rem;
  padding: 0.65rem 1.5rem;
}

#vswi-backend-wrap[hidden] {
  display: none;
}

/* ======================================================================
   模板创建页面 — 卡片列表 + 整洁表单
   ====================================================================== */

.vs-template-shell {
  display: grid;
  grid-template-columns: 320px 1fr 280px;
  gap: 1rem;
  margin-bottom: 1rem;
}

.vs-template-list-pane {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.vs-template-cards {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.vs-template-card {
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  background: #FFFFFF;
  cursor: pointer;
  transition: all 0.15s ease;
  text-align: left;
  width: 100%;
  font: inherit;
  color: inherit;
}

.vs-template-card:hover {
  border-color: rgba(35, 131, 226, 0.5);
  background: rgba(35, 131, 226, 0.05);
  transform: translateY(-1px);
}

.vs-template-card.active {
  border-color: var(--text);
  background: var(--bg);
  box-shadow: none;
}

.vs-template-card-name {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--fg);
  margin-bottom: 0.3rem;
}

.vs-template-card-desc {
  font-size: 0.78rem;
  color: var(--muted);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.vs-template-card-meta {
  display: flex;
  gap: 0.4rem;
  margin-top: 0.55rem;
}

.vs-template-badge {
  font-size: 0.7rem;
  padding: 0.12rem 0.5rem;
  border-radius: 10px;
  background: #FFFFFF;
  color: var(--muted);
}

.vs-template-badge-required {
  background: transparent;
  color: var(--muted);
  font-weight: 400;
  padding-left: 0;
  padding-right: 0;
}

.vs-template-form-pane {
  min-width: 0;
}

.vs-template-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3rem 1rem;
  border: 1px dashed rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  background: #FFFFFF;
  text-align: center;
  min-height: 240px;
}

.vs-template-empty-icon {
  font-size: 2.6rem;
  opacity: 0.6;
  margin-bottom: 0.8rem;
}

.vs-template-empty-text {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.vs-template-empty-text strong {
  font-size: 1.05rem;
  color: var(--fg);
}

.vs-template-empty-text span {
  font-size: 0.82rem;
  color: var(--muted);
}

.vs-template-detail-head {
  margin-bottom: 1rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.vs-template-detail-head h3 {
  font-size: 1.15rem;
  margin: 0 0 0.3rem;
}

.vs-template-desc {
  font-size: 0.88rem;
  color: var(--muted);
  margin: 0 0 0.55rem;
  line-height: 1.5;
}

.vs-template-badges {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.vs-template-params {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.vs-param {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.vs-param-label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.85rem;
  font-weight: 500;
}

.vs-param-required {
  color: var(--danger);
  font-weight: 700;
}

.vs-param-optional {
  font-size: 0.72rem;
  color: var(--muted);
  font-weight: 400;
  padding: 0.05rem 0.4rem;
  background: #FFFFFF;
  border-radius: 8px;
}

.vs-param-input {
  width: 100%;
  padding: 0.6rem 0.75rem;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(0, 0, 0, 0.18);
  color: inherit;
  font-size: 0.88rem;
  font-family: inherit;
}

.vs-param-input:focus {
  outline: none;
  border-color: var(--accent, var(--accent));
  background: rgba(35, 131, 226, 0.04);
}

.vs-template-generate-bar {
  margin-top: 1.4rem;
  padding: 1rem 1.1rem;
  background: rgba(35, 131, 226, 0.06);
  border: 1px solid rgba(35, 131, 226, 0.25);
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.vs-btn-large {
  padding: 0.7rem 1.6rem;
  font-size: 1rem;
}

.vs-btn-icon {
  margin-right: 0.4rem;
}

.vs-template-tools-pane {
  display: flex;
  flex-direction: column;
}

.vs-template-tools-head {
  padding: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.vs-template-tools-actions {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding-top: 0.4rem;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.vs-template-tools-actions .btn {
  width: 100%;
}

.vs-template-tools-actions .vs-check {
  padding: 0.3rem 0;
}

.vs-template-output-shell {
  margin-top: 1rem;
}

.vs-template-output-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.vs-template-section {
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
}

.vs-template-yaml-pane .vs-panel-head,
.vs-template-log-pane .vs-run-log-head {
  padding: 0.7rem 0.95rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.vs-template-yaml {
  flex: 1;
  min-height: 280px;
  width: 100%;
  resize: vertical;
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: 0.85rem;
  line-height: 1.55;
  padding: 0.8rem 0.95rem;
  border: 0;
  border-radius: 0 0 10px 10px;
  background: transparent;
  color: inherit;
}

.vs-template-yaml:focus {
  outline: none;
}

.vs-template-log-pane .vs-run-log-content {
  flex: 1;
  min-height: 280px;
  max-height: 480px;
  overflow: auto;
  margin: 0;
  border-radius: 0 0 10px 10px;
}

/* ======================================================================
   Agent 颗粒度预设（P0 / P1 / P2）
   ====================================================================== */

.vs-granularity-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.4rem 0;
  flex-wrap: wrap;
}

.vs-granularity-label {
  font-size: 0.78rem;
  color: var(--muted);
  margin-right: 0.15rem;
}

.vs-granularity-pill {
  padding: 0.32rem 0.85rem;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: transparent;
  color: var(--muted);
  font-size: 0.82rem;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.15s ease;
}

.vs-granularity-pill:hover {
  border-color: rgba(35, 131, 226, 0.55);
  color: var(--fg);
  background: rgba(35, 131, 226, 0.06);
}

/* 激活态统一用主色浅底, 不再 P0/P1/P2 各配一套彩色(2026-09-08 去花) */
.vs-granularity-pill.active {
  background: rgba(35, 131, 226, 0.12);
  border-color: var(--accent, var(--accent));
  color: var(--accent, var(--accent));
  font-weight: 600;
}


/* ========== 模板创建页面 (Template Creation) v3 ========== */
#page-vision-star-template.page.active {
  display: flex !important;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

/* 顶部三栏布局 */
.vst-layout {
  display: grid;
  grid-template-columns: 280px 1fr 240px;
  gap: 0.75rem;
  flex-shrink: 0;
  min-height: 0;
  height: 650px;
  margin-bottom: 0.5rem;
}

/* 左：模板列表 */
.vst-list {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  padding: 0.6rem;
}

.vst-list-head {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--muted);
  padding: 0 0.2rem 0.35rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0.4rem;
  flex-shrink: 0;
}

.vst-cards {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}

.vst-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px dashed var(--border);
  border-radius: 8px;
  text-align: center;
  padding: 1.5rem;
  flex: 1;
}

.vst-empty-icon {
  font-size: 2rem;
  opacity: 0.5;
  margin-bottom: 0.5rem;
}

.vst-empty-text strong {
  font-size: 0.95rem;
  color: var(--text);
}

.vst-empty-text span {
  font-size: 0.8rem;
  color: var(--muted);
}

/* 中：参数表单 */
.vst-form {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}

.vst-detail-head {
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 0.5rem;
  flex-shrink: 0;
}

.vst-detail-head h3 {
  font-size: 1rem;
  margin: 0 0 0.2rem;
}

.vst-desc {
  font-size: 0.82rem;
  color: var(--muted);
  margin: 0 0 0.35rem;
  line-height: 1.4;
}

.vst-badges {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}

.vst-params {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}

.vst-generate-bar {
  margin-top: 0.4rem;
  padding: 0.6rem 0.8rem;
  background: rgba(35, 131, 226, 0.06);
  border: 1px solid rgba(35, 131, 226, 0.2);
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 0.7rem;
  flex-shrink: 0;
}

.vst-btn-gen {
  padding: 0.5rem 1.2rem;
  font-size: 0.9rem;
}

/* 右：工具面板 */
.vst-tools {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.vst-tools-inner {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: 0.7rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  flex: 1;
  overflow: hidden;
}

.vst-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.vst-field-label {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--muted);
}

.vst-field input[type="text"] {
  width: 100%;
  padding: 0.45rem 0.6rem;
  border-radius: 5px;
  border: 1px solid var(--border);
  background: rgba(0, 0, 0, 0.18);
  color: inherit;
  font-size: 0.82rem;
}

.vst-field input[type="text"]:focus {
  outline: none;
  border-color: var(--accent);
}

.vst-check {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8rem;
  cursor: pointer;
  padding: 0.15rem 0;
}

.vst-check input[type="checkbox"] {
  accent-color: var(--accent);
  cursor: pointer;
}

.vst-actions {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}

.vst-actions .btn {
  width: 100%;
  justify-content: center;
  padding: 0.4rem 0.6rem;
  font-size: 0.82rem;
}

.vst-status {
  font-size: 0.78rem;
  text-align: center;
  padding-top: 0.35rem;
  border-top: 1px solid var(--border);
  color: var(--muted);
}

/* 底部：YAML 预览 + 试跑日志 */
.vst-output {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.vst-pane {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}

.vst-pane-head {
  padding: 0.5rem 0.8rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.8rem;
  font-weight: 600;
  flex-shrink: 0;
}

.vst-yaml {
  flex: 1;
  width: 100%;
  resize: none;
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: 0.8rem;
  line-height: 1.5;
  padding: 0.6rem 0.8rem;
  border: none;
  background: transparent;
  color: var(--text);
  overflow: auto;
}

.vst-yaml:focus {
  outline: none;
}

.vst-log-actions {
  display: flex;
  gap: 0.3rem;
  align-items: center;
}

.vst-btn-sm {
  padding: 0.2rem 0.5rem;
  font-size: 0.72rem;
}

.vst-btn-danger {
  border-color: rgba(224, 62, 62, 0.4);
  color: var(--danger);
}

.vst-log-content {
  flex: 1;
  margin: 0;
  padding: 0.6rem 0.8rem;
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: 0.78rem;
  line-height: 1.45;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--text);
}

@media (max-width: 1200px) {
  .vst-layout {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
  }
  .vst-output {
    grid-template-columns: 1fr;
  }
}

/* ========== 模板筛选栏 ========== */
.vst-filter-bar {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.5rem 0.65rem;
  border-bottom: 1px solid var(--border);
}

.vst-search-input {
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--bg);
  color: var(--text);
  font-size: 0.78rem;
  font-family: inherit;
  outline: none;
}

.vst-search-input:focus {
  border-color: var(--accent);
}

.vst-filter-select {
  padding: 0.3rem 0.4rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--bg);
  color: var(--text);
  font-size: 0.72rem;
  font-family: inherit;
  cursor: pointer;
  outline: none;
}

.vst-filter-select:focus {
  border-color: var(--accent);
}

/* ========== 模板卡片标签 ========== */
.vs-template-badge-custom {
  background: var(--success)33 !important;
  border-color: var(--success) !important;
  color: var(--success) !important;
}

.vs-template-badge-ai {
  background: var(--accent)33 !important;
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}

/* ========== AI 推荐模态框 ========== */
.vs-ai-recommend-body {
  padding: 1rem 1.25rem;
}

.vs-ai-input-group {
  margin: 0.75rem 0;
}

.vs-ai-input-group textarea {
  width: 100%;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--bg);
  color: var(--text);
  font-family: inherit;
  font-size: 0.85rem;
  line-height: 1.5;
  resize: vertical;
  box-sizing: border-box;
}

.vs-ai-input-group textarea:focus {
  outline: none;
  border-color: var(--accent);
}

.vs-ai-upload {
  margin-top: 0.5rem;
}

.vs-ai-upload label {
  cursor: pointer;
  font-size: 0.78rem;
}

.vs-ai-loading {
  margin: 1rem 0;
  padding: 0.75rem;
  text-align: center;
  color: var(--muted);
  font-style: italic;
}

.vs-ai-error {
  margin: 1rem 0;
  padding: 0.75rem;
  color: var(--hg-red);
  background: rgba(224, 62, 62, 0.1);
  border: 1px solid var(--hg-red);
  border-radius: 4px;
}

.vs-ai-empty {
  margin: 1rem 0;
  padding: 0.75rem;
  text-align: center;
  color: var(--muted);
}

.vs-ai-results-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0.75rem 0 0.5rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
}

.vs-ai-recommended-count {
  color: var(--accent);
  font-size: 0.78rem;
}

.vs-ai-results-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-height: 420px;
  overflow-y: auto;
}

.vs-ai-result-item {
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s;
  background: var(--surface);
}

.vs-ai-result-item:hover {
  border-color: var(--accent);
  background: var(--surface2);
  transform: translateX(2px);
}

.vs-ai-result-item:active {
  transform: translateX(1px);
}

.vs-ai-result-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.3rem;
}

.vs-ai-result-name {
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--text);
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.vs-ai-match-badge {
  display: inline-block;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  background: var(--accent);
  color: var(--bg);
  font-size: 0.65rem;
  font-weight: 700;
}

.vs-ai-result-score {
  font-size: 0.72rem;
  color: var(--muted);
  font-family: var(--font-mono);
}

.vs-ai-result-desc {
  font-size: 0.75rem;
  color: var(--muted);
  margin-bottom: 0.3rem;
  line-height: 1.4;
}

.vs-ai-result-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.vs-ai-score-bar {
  flex: 1;
  max-width: 120px;
  height: 4px;
  background: var(--border);
  border-radius: 2px;
  overflow: hidden;
}

.vs-ai-score-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 2px;
  transition: width 0.3s ease;
}

/* ========== 自定义模板模态框 ========== */
.vs-custom-template-body {
  padding: 1rem 1.25rem;
  max-height: 70vh;
  overflow-y: auto;
}

.vs-custom-form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.vs-custom-params {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.vs-custom-param-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem;
  background: var(--surface2);
  border-radius: 4px;
}

.vs-custom-param-input {
  padding: 0.3rem 0.4rem;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: var(--bg);
  color: var(--text);
  font-size: 0.75rem;
  font-family: inherit;
  flex: 1;
  min-width: 0;
  outline: none;
}

.vs-custom-param-input:focus {
  border-color: var(--accent);
}

.vs-custom-param-row .vs-check {
  margin: 0;
  white-space: nowrap;
}

.vs-custom-param-row .vs-check input {
  width: auto;
}

.vs-custom-param-row .btn-sm {
  flex-shrink: 0;
  padding: 0.2rem 0.5rem;
  font-size: 0.7rem;
}

/* Modal close button alignment */
.vs-image-zoom-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid var(--border);
}

/* ========== 响应式微调 ========== */
@media (max-width: 1200px) {
  .vs-ai-results-list {
    max-height: 300px;
  }
}

/* ========== 知识库页面 (PowerMem) ========== */
.vsk-tabs {
  display: flex;
  gap: 0.35rem;
  margin: 0 0 1rem;
  padding: 0 1.5rem;
  border-bottom: 1px solid var(--border);
}

.vsk-tab {
  background: transparent;
  border: 0;
  padding: 0.65rem 1.1rem;
  font-size: 0.88rem;
  color: var(--muted);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  font-family: inherit;
}

.vsk-tab:hover {
  color: var(--fg);
  background: #FFFFFF;
}

.vsk-tab.active {
  color: var(--fg);
  border-bottom-color: var(--accent, var(--accent));
  font-weight: 600;
}

.vsk-panel {
  display: none;
  padding: 0 1.5rem 1.5rem;
}

.vsk-panel.active {
  display: block;
}

.vsk-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin: 1rem 0;
}

.vsk-stat-card {
  padding: 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.vsk-stat-label {
  font-size: 0.72rem;
  color: var(--muted);
  text-transform: none;
  letter-spacing: 0;
  margin-bottom: 0.4rem;
}

.vsk-stat-value {
  font-size: 2rem;
  font-weight: 700;
  color: var(--accent, var(--accent));
  margin-bottom: 0.25rem;
}

.vsk-stat-sub {
  font-size: 0.78rem;
  color: var(--muted);
}

.vsk-status-on {
  color: var(--success) !important;
}

.vsk-status-off {
  color: var(--hg-yellow) !important;
}

.vsk-tip {
  margin: 1rem 0;
  padding: 1rem 1.25rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  border-left: 3px solid var(--accent);
}

.vsk-tip strong {
  color: var(--accent);
  display: block;
  margin-bottom: 0.5rem;
}

.vsk-tip ul {
  margin: 0;
  padding-left: 1.5rem;
  color: var(--muted);
  font-size: 0.85rem;
  line-height: 1.7;
}

.vsk-toolbar {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  margin: 1rem 0;
}

.vsk-toolbar-spacer { flex: 1; }
.vsk-sel-count {
  font-size: 0.78rem;
  color: var(--accent, var(--accent));
  font-family: var(--font-mono, monospace);
}
.vsk-btn-danger:not([disabled]) {
  color: var(--danger);
}
.vsk-item-check {
  margin: 0;
  cursor: pointer;
  flex-shrink: 0;
}
.vsk-item.sel {
  border-color: var(--accent, var(--accent));
  background: rgba(35, 131, 226, 0.06);
}

.vsk-search-input,
.vsk-filter-select {
  padding: 0.4rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--bg);
  color: var(--text);
  font-size: 0.85rem;
  font-family: inherit;
  outline: none;
}

.vsk-search-input {
  flex: 1;
}

.vsk-search-input:focus,
.vsk-filter-select:focus {
  border-color: var(--accent);
}

.vsk-list {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.vsk-item {
  padding: 0.85rem 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  transition: border-color 0.15s;
}

.vsk-item:hover {
  border-color: var(--accent);
}

.vsk-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}

.vsk-item-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--fg);
}

.vsk-item-module,
.vsk-item-meta {
  font-size: 0.75rem;
  color: var(--muted);
  font-family: ui-monospace, monospace;
  background: var(--code-bg);
  padding: 0.15rem 0.4rem;
  border-radius: 3px;
}

.vsk-item-content {
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.5;
  margin-bottom: 0.5rem;
}

.vsk-item-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-bottom: 0.5rem;
}

.vsk-tag {
  font-size: 0.7rem;
  padding: 0.15rem 0.45rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--muted);
}

.vsk-item-actions {
  display: flex;
  gap: 0.4rem;
  margin-top: 0.5rem;
}

.vsk-item-actions .btn-sm {
  padding: 0.25rem 0.65rem;
  font-size: 0.78rem;
}

.vsk-source-pill {
  font-size: 0.7rem;
  padding: 0.15rem 0.5rem;
  border-radius: 3px;
  font-weight: 600;
}

.vsk-source-manual {
  background: rgba(35, 131, 226, 0.15);
  color: var(--accent);
}

.vsk-source-auto {
  background: rgba(15, 123, 15, 0.15);
  color: var(--success);
}

.vsk-source-fail {
  background: rgba(224, 62, 62, 0.15);
  color: var(--hg-red);
}

.vsk-failure-grid {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  font-size: 0.8rem;
  color: var(--muted);
  background: var(--bg);
  padding: 0.5rem 0.75rem;
  border-radius: 4px;
  margin-top: 0.3rem;
}

.vsk-failure-grid strong {
  color: var(--fg);
  margin-right: 0.4rem;
}

.vsk-detail-body {
  padding: 1.25rem;
}

.vsk-detail-content {
  margin: 0;
  padding: 0.85rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.78rem;
  line-height: 1.5;
  color: var(--text);
  max-height: 60vh;
  overflow: auto;
}

#page-vision-star-knowledge .vsk-panel .empty {
  padding: 2rem;
  text-align: center;
  color: var(--muted);
  background: var(--surface);
  border: 1px dashed var(--border);
  border-radius: 8px;
}

/* ========== 仪表盘 ========== */
.dash-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.75rem;
  margin: 0 1.5rem 1rem;
}

.dash-card {
  padding: 1rem 1.1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.dash-card-label {
  font-size: 0.72rem;
  text-transform: none;
  letter-spacing: 0;
  color: var(--muted);
  margin-bottom: 0.35rem;
}

.dash-card-value {
  font-size: 1.65rem;
  font-weight: 700;
  font-family: var(--font-mono, ui-monospace, monospace);
}

.dash-grid {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  gap: 1rem;
  padding: 0 1.5rem 1.5rem;
}

.dash-col {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.dash-col-wide {
  min-width: 0;
}

.dash-section {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.85rem 1rem;
}

.dash-section h3 {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 0.65rem 0;
}

.dash-bar-row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.4rem;
  font-size: 0.78rem;
}

.dash-bar-label {
  width: 32px;
  flex-shrink: 0;
  color: var(--muted);
  font-weight: 600;
  text-align: right;
}

.dash-bar-track {
  flex: 1;
  height: 6px;
  background: var(--bg);
  border-radius: 3px;
  overflow: hidden;
}

.dash-bar-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 3px;
  transition: width 0.3s;
}

.dash-bar-fill-token {
  background: var(--accent);
}

.dash-bar-val {
  min-width: 50px;
  text-align: right;
  font-family: var(--font-mono, ui-monospace, monospace);
  color: var(--text);
  font-size: 0.75rem;
}

.dash-bar-sub {
  min-width: 70px;
  text-align: right;
  color: var(--muted);
  font-size: 0.7rem;
}

.dash-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.dash-table th {
  text-align: left;
  padding: 0.4rem 0.5rem;
  border-bottom: 1px solid var(--border);
  color: var(--muted);
  font-weight: 600;
  font-size: 0.72rem;
  text-transform: none;
  letter-spacing: 0;
}

.dash-table td {
  padding: 0.4rem 0.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  color: var(--text);
}

.dash-rank {
  display: inline-block;
  width: 24px;
  text-align: center;
  font-weight: 700;
  color: var(--accent);
}

.dash-chart {
  width: 100%;
  height: auto;
}

.dash-legend {
  display: flex;
  gap: 1rem;
  margin-top: 0.4rem;
  font-size: 0.75rem;
  color: var(--muted);
}

.dash-legend-item {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.dash-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.dash-bar-list {
  max-height: 320px;
  overflow-y: auto;
}

.vsk-empty-hint {
  padding: 1.5rem;
  text-align: center;
  color: var(--muted);
  font-size: 0.85rem;
}

@media (max-width: 1200px) {
  .dash-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   Enhanced Runner: 证据展示样式 (不改 Midscene 源码)
   ============================================================ */

.vs-evidence {
  background: rgba(0,0,0,0.04);
  border-left: 3px solid var(--accent);
  padding: 8px 12px;
  margin: 8px 0;
  border-radius: 4px;
  font-size: 13px;
}
.vs-evidence strong {
  display: block;
  margin-bottom: 6px;
  color: var(--accent);
}
.vs-evidence .badge {
  display: inline-block;
  padding: 2px 8px;
  margin: 2px 4px;
  border-radius: 10px;
  background: var(--border);
  color: var(--muted);
  font-size: 12px;
}
.vs-evidence .badge-red {
  background: var(--danger);
  color: white;
}
.vs-evidence-url,
.vs-evidence-title {
  margin-top: 4px;
  color: var(--muted);
  font-family: monospace;
  font-size: 12px;
}
.vs-evidence-warn {
  margin-top: 4px;
  color: var(--danger);
  font-weight: 500;
}
.vs-evidence-match {
  margin-top: 6px;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 500;
}
.vs-evidence-match.ok {
  background: var(--success-weak);
  color: var(--success);
}
.vs-evidence-match.warn {
  background: var(--warning-weak);
  color: var(--warning);
}
.vs-evidence details {
  margin-top: 6px;
}
.vs-evidence details summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 12px;
}
.vs-evidence details pre {
  margin-top: 4px;
  padding: 6px;
  background: rgba(0,0,0,0.05);
  border-radius: 4px;
  font-size: 11px;
  white-space: pre-wrap;
  word-break: break-all;
  max-height: 200px;
  overflow-y: auto;
}

/* Heal Detail Modal (P1-3+ 2026-08-10) */
.vs-heal-detail-modal {
  max-width: 900px;
  width: 90vw;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  background: var(--bg, var(--surface2));
  color: var(--text, var(--surface2));
  border: 1px solid var(--border, var(--surface3));
  border-radius: 8px;
}
.vs-heal-detail-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.7em 1em;
  border-bottom: 1px solid var(--border, var(--surface3));
}
.vs-heal-detail-body {
  padding: 1em;
  overflow: auto;
}
.vs-heal-detail-meta {
  display: flex;
  gap: 1.2em;
  margin-bottom: 0.8em;
  font-size: 0.9em;
  color: var(--muted, var(--muted));
  flex-wrap: wrap;
}
.vs-heal-detail-meta .badge-success {
  color: var(--success);
  font-weight: 600;
}
.vs-heal-detail-meta .badge-fail {
  color: var(--danger);
  font-weight: 600;
}
.vs-heal-detail-nl {
  background: var(--bg-card, var(--surface3));
  padding: 0.6em 0.8em;
  border-radius: 4px;
  margin-bottom: 1em;
  white-space: pre-wrap;
  font-size: 0.9em;
  line-height: 1.5;
}
.vs-heal-detail-section h4 {
  font-size: 0.95em;
  margin: 0 0 0.4em;
  color: var(--text-sub, var(--muted));
}
.vs-heal-detail-diff {
  font-family: monospace;
  font-size: 0.85em;
  background: var(--surface2);
  padding: 0.6em;
  border-radius: 4px;
  border: 1px solid var(--border, var(--surface3));
  max-height: 60vh;
  overflow: auto;
  white-space: pre-wrap;
  line-height: 1.5;
}
.vs-heal-detail-diff .diff-add {
  color: var(--success);
  background: rgba(15, 123, 15, 0.1);
  padding: 0 0.2em;
}
.vs-heal-detail-diff .diff-del {
  color: var(--danger);
  background: rgba(224, 62, 62, 0.1);
  padding: 0 0.2em;
}
.vs-heal-detail-diff .diff-hunk {
  color: var(--accent);
  font-weight: 600;
  margin-top: 0.3em;
}

/* Log Sources Section (P1-3+ 2026-08-10) */
.vs-log-sources {
  margin: 0 0 0.5em 0;
  padding: 0;
  background: var(--bg-card, var(--surface3));
  border-radius: 4px;
}
.vs-log-sources > summary {
  padding: 0.4em 0.7em;
  cursor: pointer;
  font-size: 0.9em;
  font-weight: 500;
  user-select: none;
  color: var(--text-sub, var(--muted));
}
.vs-log-sources > summary:hover {
  color: var(--text, var(--surface2));
}
.vs-log-sources-list {
  padding: 0.3em 0.7em 0.6em 0.7em;
  display: flex;
  flex-direction: column;
  gap: 0.4em;
}
.vs-log-source-row {
  background: var(--bg, var(--surface2));
  padding: 0.4em 0.6em;
  border-radius: 3px;
  border-left: 2px solid var(--border, var(--surface3));
}
.vs-log-source-name {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.9em;
}
.vs-log-source-ok { color: var(--success); font-size: 0.85em; }
.vs-log-source-missing { color: var(--muted, #6B7280); font-size: 0.85em; opacity: 0.7; }
.vs-log-source-row.is-missing { opacity: 0.55; }
.vs-log-source-desc {
  font-size: 0.8em;
  color: var(--text-sub, var(--muted));
  margin-top: 0.2em;
}
.vs-log-source-path {
  font-family: monospace;
  font-size: 0.75em;
  color: var(--text-sub, var(--muted));
  margin-top: 0.2em;
  display: block;
  word-break: break-all;
}

/* 自愈面板(P1-3+ 2026-08-10)——复用缺陷样式, 始终可见 */
.vs-heal-panel-list {
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.vs-defect-error-wrap {
  margin-top: 0.45em;
}
/* 2026-09-09: 错误摘要卡片 —— 徽章 + 提炼后的可读错误行, 不再直接堆 stdout
   「重点错误行:摘要先行,避免一大坨日志」原结构保留兼容(部分老样式) */
.vs-defect-error-summary {
  display: flex;
  gap: 0.6em;
  align-items: flex-start;
  padding: 0.6em 0.7em;
  background: linear-gradient(180deg, rgba(224,62,62,0.08), rgba(224,62,62,0.03));
  border: 1px solid rgba(224, 62, 62, 0.25);
  border-left: 3px solid var(--danger);
  border-radius: 6px;
}
.vs-defect-error-badge {
  font-size: 1.05em;
  line-height: 1.4;
  color: var(--danger);
  flex-shrink: 0;
}
.vs-defect-error-lines {
  display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0;
}
.vs-defect-error-line {
  font-family: monospace;
  font-size: 0.78em;
  color: var(--danger);
  line-height: 1.45;
  word-break: break-all;
  white-space: pre-wrap;
}
.vs-defect-error-hl {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.vs-defect-error-full {
  margin-top: 0.3em;
}
.vs-defect-error-full summary {
  font-size: 0.78em;
  color: var(--muted, #8C93A0);
  cursor: pointer;
  user-select: none;
}
.vs-defect-error-full[open] summary {
  margin-bottom: 0.2em;
}
.vs-defect-error {
  font-family: monospace;
  font-size: 0.8em;
  color: var(--danger);
  background: rgba(224, 62, 62, 0.08);
  padding: 0.4em 0.5em;
  border-radius: 3px;
  line-height: 1.4;
  white-space: pre-wrap;
  word-break: break-all;
  /* 2026-09-11: max-height 7em→16em 让日志框更高更易读,
     但 width 必须锁在卡片内宽(原 max-content 把 pre 撑出边界了),
     容器用 overflow:auto 给横向滚动兜底 */
  max-height: 16em;
  width: 100%;
  box-sizing: border-box;
  overflow: auto;
}
.vs-defect-log {
  margin-top: 0.3em;
  font-size: 0.8em;
}

/* ── Skill 管理(2026-08-11 创建, 2026-09-07 重设计) ─────────── */
.vs-skills-shell {
  display: grid;
  grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
  gap: 0.75rem;
  flex: 1;
  min-height: 0;
  height: calc(100vh - 11.5rem);
}
.vs-skills-list-pane {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius, 8px);
  background: var(--surface2, var(--bg));
  overflow: hidden;
}
.vs-skills-toolbar {
  padding: 0.6rem 0.7rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.vs-skills-toolbar input[type="search"] {
  width: 100%;
  box-sizing: border-box;
  padding: 0.42rem 0.6rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg, var(--bg));
  color: var(--text);
  font-size: 0.84rem;
}
.vs-skills-toolbar input[type="search"]:focus {
  outline: none;
  border-color: var(--accent);
}
.vs-skill-chips {
  display: flex;
  gap: 0.35rem;
}
.vs-skill-batch-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.45rem;
  min-height: 1.6rem;
}
.vs-skill-selall {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.76rem;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}
.vs-skill-selall:hover {
  color: var(--text);
}
.vs-skill-sel-count {
  font-size: 0.74rem;
  color: var(--accent);
  font-family: var(--font-mono, monospace);
}
.vs-skill-batch-spacer {
  flex: 1;
}
.vs-skill-check {
  flex: none;
  width: 14px;
  height: 14px;
  margin: 0 2px 0 0;
  accent-color: var(--accent);
  cursor: pointer;
}
.vs-skill-row-top .vs-skill-row-name {
  flex: 1;
  min-width: 0;
}
.vs-skill-chip {
  flex: 1;
  border: 1px solid var(--border);
  background: var(--surface, var(--bg));
  color: var(--muted);
  border-radius: 999px;
  padding: 0.24rem 0.5rem;
  font-size: 0.76rem;
  cursor: pointer;
  transition: all 0.12s;
}
.vs-skill-chip b {
  font-weight: 600;
  margin-left: 2px;
}
.vs-skill-chip:hover {
  color: var(--text);
  border-color: var(--accent);
}
.vs-skill-chip.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.vs-skill-list {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.vs-skill-row {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface, var(--bg));
  padding: 0.55rem 0.65rem;
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.vs-skill-row:hover {
  border-color: var(--accent);
}
.vs-skill-row.active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface, var(--bg)));
}
.vs-skill-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
}
.vs-skill-row-name {
  font-family: var(--font-mono, monospace);
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.vs-skill-badge {
  flex: 0 0 auto;
  font-size: 0.68rem;
  padding: 0 7px;
  border-radius: 999px;
  border: 1px solid transparent;
}
.vs-skill-badge.product {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border-color: var(--accent);
}
.vs-skill-badge.general {
  color: var(--muted);
  background: var(--surface2, transparent);
  border-color: var(--border);
}
.vs-skill-row-desc {
  font-size: 0.76rem;
  color: var(--muted);
  margin-top: 0.25rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.vs-skill-row-meta {
  font-size: 0.68rem;
  color: var(--muted);
  opacity: 0.75;
  margin-top: 0.25rem;
  font-family: var(--font-mono, monospace);
}
.vs-skills-editor {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius, 8px);
  background: var(--surface2, var(--bg));
  overflow: hidden;
}
.vs-skills-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.vs-skills-editor-id {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}
.vs-skills-editor-head h3 {
  margin: 0;
  font-family: var(--font-mono, monospace);
  font-size: 1.02rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.vs-skills-editor-actions {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.vs-skill-view-toggle {
  display: inline-flex;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.vs-skill-view-toggle button {
  background: transparent;
  border: 0;
  color: var(--muted);
  padding: 0.3rem 0.7rem;
  font-size: 0.8rem;
  cursor: pointer;
}
.vs-skill-view-toggle button + button {
  border-left: 1px solid var(--border);
}
.vs-skill-view-toggle button.active {
  background: var(--accent);
  color: #fff;
}
.vs-skill-meta-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  padding: 0.45rem 0.9rem;
  border-bottom: 1px solid var(--border);
  font-size: 0.74rem;
  color: var(--muted);
  font-family: var(--font-mono, monospace);
  background: color-mix(in srgb, var(--border) 14%, transparent);
}
.vs-skill-meta-strip:empty {
  display: none;
}
.vs-skills-editor-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.vs-skill-preview {
  padding: 0.9rem 1rem;
}
.vs-skill-preview-desc {
  font-size: 0.92rem;
  color: var(--text);
  border-left: 3px solid var(--accent);
  padding: 0.35rem 0.7rem;
  background: color-mix(in srgb, var(--accent) 6%, transparent);
  border-radius: 0 6px 6px 0;
  margin-bottom: 0.8rem;
}
.vs-skill-preview-files {
  font-size: 0.78rem;
  color: var(--muted);
  margin-bottom: 0.8rem;
}
.vs-skill-preview-files code {
  background: var(--surface, var(--bg));
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 0 5px;
  margin-right: 4px;
}
.vs-skill-preview-body {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: var(--font-mono, monospace);
  font-size: 0.82rem;
  line-height: 1.65;
  color: var(--text);
}
.vs-skill-md {
  font-size: 0.9rem;
  line-height: 1.75;
  color: var(--text);
  word-break: break-word;
}
.vs-skill-md h1,
.vs-skill-md h2,
.vs-skill-md h3,
.vs-skill-md h4,
.vs-skill-md h5,
.vs-skill-md h6 {
  color: var(--text);
  line-height: 1.4;
  margin: 1.4em 0 0.5em;
  font-weight: 700;
}
.vs-skill-md h1:first-child,
.vs-skill-md h2:first-child,
.vs-skill-md h3:first-child {
  margin-top: 0.2em;
}
.vs-skill-md h1 {
  font-size: 1.3rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.35em;
}
.vs-skill-md h2 {
  font-size: 1.12rem;
}
.vs-skill-md h3 {
  font-size: 1rem;
  color: var(--accent);
}
.vs-skill-md h4,
.vs-skill-md h5,
.vs-skill-md h6 {
  font-size: 0.92rem;
}
.vs-skill-md p {
  margin: 0.45em 0;
}
.vs-skill-md ul,
.vs-skill-md ol {
  margin: 0.45em 0;
  padding-left: 1.5em;
}
.vs-skill-md li {
  margin: 0.2em 0;
}
.vs-skill-md ul ul,
.vs-skill-md ol ol,
.vs-skill-md ul ol,
.vs-skill-md ol ul {
  margin: 0.1em 0;
}
.vs-skill-md code {
  font-family: var(--font-mono, monospace);
  font-size: 0.84em;
  background: color-mix(in srgb, var(--border) 22%, transparent);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 0.05em 0.35em;
}
.vs-md-code {
  position: relative;
  margin: 0.7em 0;
  padding: 0.75em 0.9em;
  background: color-mix(in srgb, var(--border) 10%, var(--bg));
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow-x: auto;
  font-family: var(--font-mono, monospace);
  font-size: 0.8rem;
  line-height: 1.6;
}
.vs-md-lang {
  position: absolute;
  top: 6px;
  right: 10px;
  font-size: 0.68rem;
  color: var(--muted);
}
.vs-skill-md blockquote {
  margin: 0.6em 0;
  padding: 0.35em 0.9em;
  border-left: 3px solid var(--accent);
  background: color-mix(in srgb, var(--accent) 6%, transparent);
  color: var(--muted);
}
.vs-skill-md blockquote p {
  margin: 0.15em 0;
}
.vs-skill-md hr {
  border: 0;
  border-top: 1px solid var(--border);
  margin: 1.2em 0;
}
.vs-skill-md table {
  border-collapse: collapse;
  margin: 0.7em 0;
  font-size: 0.84rem;
  width: 100%;
}
.vs-skill-md th,
.vs-skill-md td {
  border: 1px solid var(--border);
  padding: 0.35em 0.7em;
  text-align: left;
  vertical-align: top;
}
.vs-skill-md th {
  background: color-mix(in srgb, var(--border) 14%, transparent);
  font-weight: 600;
}
.vs-skill-md a {
  color: var(--accent);
}
.vs-skills-editor-wrap textarea {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border: 0;
  resize: none;
  padding: 0.9rem 1rem;
  background: var(--bg, var(--bg));
  color: var(--text);
  font-family: var(--font-mono, monospace);
  font-size: 0.82rem;
  line-height: 1.6;
}
.vs-skills-editor-wrap textarea:focus {
  outline: none;
}
.vs-skills-editor-footer {
  padding: 0.45rem 0.9rem;
  border-top: 1px solid var(--border);
}
.vs-skill-empty {
  padding: 1.5rem 1rem;
  text-align: center;
  color: var(--muted);
  font-size: 0.85rem;
}
.vs-skill-run-toolbar {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin: 0.5rem 0;
}
.vs-skill-run-output {
  margin: 0;
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: var(--font-mono, monospace);
  font-size: 0.8rem;
  line-height: 1.6;
  background: var(--bg, var(--bg));
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.7rem 0.8rem;
  color: var(--text);
}

@media (max-width: 1100px) {
  .vs-skills-shell {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 640px;
  }
}

/* ── AI 生成用例页: 模式切换 + pipeline(2026-08-11) ─────── */
.vs-agent-mode-switch {
  display: inline-flex;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  margin-right: 0.5rem;
}
.vs-stat-pill-accent {
  background: rgba(35, 131, 226, 0.12);
  border-color: var(--accent, var(--accent));
  color: var(--accent, var(--accent));
  font-weight: 600;
}
.vs-agent-mode-btn {
  background: transparent;
  border: 0;
  color: var(--muted);
  padding: 0.32rem 0.7rem;
  font-size: 0.82rem;
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}
.vs-agent-mode-btn + .vs-agent-mode-btn {
  border-left: 1px solid var(--border);
}
.vs-agent-mode-btn:hover {
  background: rgba(107, 114, 128, 0.06);
  color: var(--text);
}
.vs-agent-mode-btn.active {
  background: var(--accent, var(--accent));
  color: #fff;
}

.vs-pipeline {
  margin-top: 1rem;
  padding: 0.85rem;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: 6px;
}
.vs-pipeline-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.85rem;
  gap: 1rem;
  flex-wrap: wrap;
}
.vs-pipeline-title-wrap h3 {
  margin: 0;
  font-size: 1rem;
}
.vs-pipeline-sub {
  font-size: 0.78rem;
  color: var(--muted);
}
.vs-pipeline-head-actions {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.vs-pipeline-steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.7rem;
}
.vs-step-card {
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--bg, var(--bg));
  overflow: hidden;
}
.vs-step-card[data-status="running"] {
  border-color: var(--accent, var(--accent));
  box-shadow: 0 0 0 1px rgba(35, 131, 226, 0.18) inset;
}
.vs-step-card[data-status="success"] {
  border-color: rgba(15, 123, 15, 0.55);
}
.vs-step-card[data-status="failed"] {
  border-color: rgba(224, 62, 62, 0.6);
}

.vs-step-head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.75rem;
  background: rgba(107, 114, 128, 0.05);
  border-bottom: 1px solid var(--border);
  font-size: 0.88rem;
}
.vs-step-index {
  display: inline-flex;
  width: 1.6em;
  height: 1.6em;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--accent, var(--accent));
  color: #fff;
  font-weight: 600;
  font-size: 0.78rem;
}
.vs-step-name {
  font-weight: 600;
}
.vs-step-status {
  margin-left: auto;
  font-size: 0.75rem;
  color: var(--muted);
  font-family: var(--font-mono, monospace);
}
.vs-step-card[data-status="running"] .vs-step-status { color: var(--accent, var(--accent)); }
.vs-step-card[data-status="success"] .vs-step-status { color: var(--success); }
.vs-step-card[data-status="failed"] .vs-step-status { color: var(--danger); }

.vs-step-body {
  padding: 0.65rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.vs-step-attach {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.vs-step-attach-list {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}
.vs-step-attach-list img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--border);
}

.vs-step-card:first-child .vs-step-textarea {
  /* 第一步(原始需求)是主入口,稍大稍突出 */
  min-height: 100px;
  font-size: 0.95rem;
  background: rgba(35, 131, 226, 0.06);
  border-color: var(--accent, var(--accent));
}

.vs-step-textarea {
  width: 100%;
  resize: vertical;
  font-family: var(--font-mono, monospace);
  font-size: 0.85rem;
  line-height: 1.5;
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.55rem 0.65rem;
  border-radius: 4px;
  box-sizing: border-box;
}
.vs-step-textarea:focus {
  outline: none;
  border-color: var(--accent, var(--accent));
}
.vs-step-output {
  background: rgba(35, 131, 226, 0.05);
}
.vs-step-output-yaml {
  font-family: var(--font-mono, monospace);
}

.vs-step-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.vs-step-backend,
.vs-step-case-id {
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.32rem 0.5rem;
  border-radius: 4px;
  font-size: 0.82rem;
}
.vs-step-case-id {
  width: 240px;
}

/* ── 需求转用例模块(2026-08-11) ────────────────────── */
.vs-req-tabs {
  display: flex;
  gap: 0.25rem;
  padding: 0.6rem 1rem 0;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 70%, transparent);
}
.vs-req-tab {
  border: 1px solid transparent;
  border-bottom: 0;
  background: transparent;
  padding: 0.45rem 0.9rem;
  border-radius: 6px 6px 0 0;
  font-size: 0.82rem;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.vs-req-tab:hover {
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 5%, transparent);
}
.vs-req-tab.active {
  background: var(--bg);
  color: var(--text);
  border-color: var(--border);
  border-bottom-color: var(--bg);
  font-weight: 600;
  margin-bottom: -1px;
}
.vs-req-panel {
  display: none;
}
.vs-req-panel.active {
  display: block;
}
.vs-req-empty {
  padding: 2rem 1rem;
  text-align: center;
  color: var(--muted);
  font-size: 0.88rem;
}
.vs-req-batch-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 0.65rem;
  margin-top: 0.7rem;
}
.vs-req-batch-card {
  border: 1px solid var(--border);
  border-radius: 5px;
  padding: 0.7rem 0.85rem;
  background: var(--surface);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.vs-req-batch-card:hover {
  border-color: var(--accent, var(--accent));
  background: rgba(35, 131, 226, 0.06);
}
.vs-req-batch-card-title {
  font-weight: 600;
  margin-bottom: 0.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
}
.vs-req-batch-card-meta {
  font-size: 0.75rem;
  color: var(--muted);
  font-family: var(--font-mono, monospace);
  margin-bottom: 0.4rem;
}
.vs-req-batch-card-stats {
  display: flex;
  gap: 0.5rem;
  font-size: 0.78rem;
  flex-wrap: wrap;
}
.vs-req-stat-chip {
  padding: 0.12rem 0.5rem;
  border-radius: 3px;
  border: 1px solid var(--border);
  font-family: var(--font-mono, monospace);
  font-size: 0.72rem;
}
.vs-req-stat-chip.saved { color: var(--success); border-color: rgba(15, 123, 15, 0.4); }
.vs-req-stat-chip.failed { color: var(--danger); border-color: rgba(224, 62, 62, 0.4); }
.vs-req-stat-chip.running { color: var(--accent, var(--accent)); border-color: rgba(35,131,226,0.4); }
.vs-req-stat-chip.pending { color: var(--muted); }

.vs-req-detail-head {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.vs-req-detail-title {
  flex: 1;
  min-width: 200px;
}
.vs-req-detail-title h3 {
  margin: 0;
  font-size: 1rem;
}
.vs-req-detail-sub {
  font-size: 0.78rem;
  color: var(--muted);
}
.vs-req-detail-actions {
  display: flex;
  gap: 0.5rem;
}

.vs-req-shell {
  display: grid;
  grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
  gap: 0.65rem;
  margin-top: 0.85rem;
}
.vs-req-table-pane,
.vs-req-detail-pane {
  border: 1px solid var(--border);
  background: var(--surface);
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.vs-req-table-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--border);
  font-size: 0.85rem;
}
.vs-req-progress-summary {
  font-size: 0.78rem;
  color: var(--muted);
  font-family: var(--font-mono, monospace);
}
.vs-req-toolbar {
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--border);
}
.vs-req-progress-bar {
  height: 18px;
  background: rgba(107, 114, 128, 0.1);
  border-radius: 3px;
  position: relative;
  margin: 0.5rem 0.75rem 0;
  overflow: hidden;
}
.vs-req-progress-fill {
  height: 100%;
  background: var(--accent, var(--accent));
  width: 0%;
  transition: width 0.3s;
}
.vs-req-progress-label {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-family: var(--font-mono, monospace);
  color: var(--text);
  mix-blend-mode: difference;
}
.vs-req-table {
  flex: 1;
  overflow: auto;
  padding: 0.3rem;
}
.vs-req-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.6rem;
  border: 1px solid transparent;
  border-radius: 4px;
  cursor: pointer;
  margin-bottom: 0.25rem;
  font-size: 0.85rem;
  transition: background 0.1s;
}
.vs-req-row:hover {
  background: rgba(107, 114, 128, 0.06);
}
.vs-req-row.active {
  border-color: var(--accent, var(--accent));
  background: rgba(35,131,226,0.08);
}
.vs-req-row-seq {
  width: 1.6em;
  text-align: center;
  color: var(--muted);
  font-family: var(--font-mono, monospace);
  font-size: 0.78rem;
}
.vs-req-row-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.vs-req-row-case {
  font-family: var(--font-mono, monospace);
  font-size: 0.72rem;
  color: var(--muted);
}
.vs-req-row-status {
  font-size: 0.72rem;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  font-family: var(--font-mono, monospace);
}
.vs-req-row-status[data-status="pending"] { background: rgba(107, 114, 128, 0.15); color: var(--muted); }
.vs-req-row-status[data-status*="running"] { background: rgba(35,131,226,0.15); color: var(--accent); }
.vs-req-row-status[data-status="md_done"],
.vs-req-row-status[data-status="yaml_done"] { background: rgba(15, 123, 15, 0.15); color: var(--success); }
.vs-req-row-status[data-status="saved"] { background: rgba(15, 123, 15, 0.3); color: var(--success); font-weight: 600; }
.vs-req-row-status[data-status="failed"] { background: rgba(224, 62, 62, 0.18); color: var(--danger); }

.vs-req-detail-tabs {
  display: flex;
  border-bottom: 1px solid var(--border);
}
.vs-req-tab {
  background: transparent;
  border: 0;
  padding: 0.5rem 0.85rem;
  font-size: 0.85rem;
  color: var(--muted);
  cursor: pointer;
  border-bottom: 2px solid transparent;
}
.vs-req-tab:hover:not(:disabled) {
  color: var(--text);
}
.vs-req-tab.active {
  color: var(--accent, var(--accent));
  border-bottom-color: var(--accent, var(--accent));
}
.vs-req-tab:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.vs-req-tab-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.vs-req-tab-panel {
  display: none;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
  min-height: 0;
}
.vs-req-tab-panel.active {
  display: flex;
}
.vs-req-tab-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.vs-req-tab-actions input[type="text"] {
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.32rem 0.5rem;
  border-radius: 4px;
  font-size: 0.82rem;
}
.vs-req-tab-panel textarea {
  flex: 1;
  min-height: 240px;
  font-family: var(--font-mono, monospace);
  font-size: 0.82rem;
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.6rem;
  border-radius: 4px;
  resize: vertical;
}
.vs-req-tab-panel textarea:focus {
  outline: none;
  border-color: var(--accent, var(--accent));
}
.vs-req-pre {
  flex: 1;
  min-height: 240px;
  margin: 0;
  background: var(--bg, var(--bg));
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 0.6rem;
  overflow: auto;
}
.vs-req-pre code {
  font-family: var(--font-mono, monospace);
  font-size: 0.8rem;
  white-space: pre-wrap;
  word-break: break-word;
}
.vs-req-pre-yaml code {
  color: var(--accent);
}
.vs-req-attachment-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.vs-req-screenshot-list {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}
.vs-req-screenshot-list img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--border);
}

@media (max-width: 1100px) {
  .vs-req-shell {
    grid-template-columns: 1fr;
  }
}

/* ── 通用 modal(用于新建批次等弹窗) ─────────────────── */
.vs-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}
.vs-modal {
  background: var(--surface, var(--bg));
  border: 1px solid var(--border);
  border-radius: 6px;
  width: min(720px, 92vw);
  max-height: 86vh;
  display: flex;
  flex-direction: column;
}
.vs-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid var(--border);
}
.vs-modal-head h3 {
  margin: 0;
  font-size: 1rem;
}
.vs-modal-close {
  background: transparent;
  border: 0;
  color: var(--muted);
  font-size: 1.4rem;
  cursor: pointer;
  line-height: 1;
  padding: 0 0.4rem;
}
.vs-modal-close:hover { color: var(--text); }
.vs-modal-body {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  overflow: auto;
}
.vs-modal-row {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
/* 横向字段组(编号/标题/优先级这类短字段一行): 列内仍是 label 上、控件下 */
.vs-modal-fields {
  display: flex;
  flex-direction: row;
  gap: 0.6rem;
}
.vs-modal-fields > * { flex: 1; min-width: 0; }
.vs-modal-fields > .vs-modal-field-fixed { flex: 0 0 auto; }
.vs-modal-row label {
  font-size: 0.82rem;
  color: var(--muted);
  font-weight: 500;
}
.vs-modal-row input[type="text"],
.vs-modal-row select,
.vs-modal-row textarea {
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.5rem 0.6rem;
  border-radius: 4px;
  font-family: var(--font-mono, monospace);
  font-size: 0.85rem;
  width: 100%;
  box-sizing: border-box;
}
.vs-modal-row textarea {
  resize: vertical;
  min-height: 140px;
}
.vs-modal-row input:focus,
.vs-modal-row textarea:focus {
  outline: none;
  border-color: var(--accent, var(--accent));
}
.vs-modal-row .vs-hint {
  font-size: 0.72rem;
  color: var(--muted);
}
.vs-modal-foot {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.7rem 1rem;
  border-top: 1px solid var(--border);
}

/* ── 统一系统弹窗(vsConfirm / vsAlert / vsPrompt, 2026-09-04; 2026-09-05 视觉重做) ──
   语义:图标徽章定调性,标题一句话,正文弱化,双键右对齐。
   focus 环与按钮同色系(蓝环叠红按钮会发脏)。 */
.vs-dialog-backdrop {
  z-index: 10010; /* 盖过普通业务弹层 */
  background: rgba(15, 23, 42, 0.45);
  backdrop-filter: blur(4px) saturate(1.1);
  -webkit-backdrop-filter: blur(4px) saturate(1.1);
  animation: vsDialogFade 0.18s ease both;
}
.vs-dialog {
  position: relative;
  width: min(380px, 92vw);
  background: var(--surface, #fff);
  border: 0;
  border-radius: 14px;
  padding: 24px 24px 20px;
  box-shadow:
    0 32px 80px -20px rgba(15, 23, 42, 0.35),
    0 8px 24px -12px rgba(15, 23, 42, 0.16);
  animation: vsDialogIn 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes vsDialogFade { from { opacity: 0; } }
@keyframes vsDialogIn {
  from { opacity: 0; transform: translateY(10px) scale(0.97); }
}
.vs-dialog-x {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--muted, #94a3b8);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.vs-dialog-x:hover { background: rgba(15, 23, 42, 0.06); color: var(--text); }
.vs-dialog-ico {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  margin-bottom: 14px;
}
.vs-dialog-ico svg { width: 18px; height: 18px; }
.vs-dialog-ico.danger {
  background: rgba(214, 69, 65, 0.1);
  color: var(--fail, #d64541);
  box-shadow: inset 0 0 0 1px rgba(214, 69, 65, 0.1);
  /* 删除确认:开窗瞬间垃圾桶摇一下,一次性注意力提示 */
  animation: vsDialogIcoShake 0.55s cubic-bezier(0.36, 0.07, 0.19, 0.97) 0.12s both;
}
.vs-dialog-ico.info {
  background: rgba(35, 131, 226, 0.1);
  color: var(--accent, #2383e2);
  box-shadow: inset 0 0 0 1px rgba(35, 131, 226, 0.1);
}
@keyframes vsDialogIcoShake {
  0% { transform: scale(0.6); opacity: 0; }
  30% { transform: scale(1.08) rotate(0deg); opacity: 1; }
  45% { transform: translateX(-2px) rotate(-8deg); }
  60% { transform: translateX(2px) rotate(7deg); }
  75% { transform: translateX(-1px) rotate(-4deg); }
  100% { transform: translateX(0) rotate(0deg) scale(1); }
}

/* 技能 nav 图标: 握锤敲一下的循环动效(参考 vsDialogIcoShake 用 transform),
   4.5s 一周期, 父级 hover 时短暂加速 */
.nav-sub-ico-anim {
  display: inline-flex;
  /* 2026-09-09: 图标换成锤子(lucide hammer, 柄在左下) —— 枢轴移到柄尾,
     挥锤才绕手柄转而不是绕图标中心打转 */
  transform-origin: 22% 85%;
}
.nav-sub-ico-anim > svg {
  animation: vsSkillHammer 4.5s ease-in-out infinite;
}
.nav-sub-item:hover .nav-sub-ico-anim > svg {
  /* 悬浮 = 挥锤敲下去(节奏加快, 敲击行程加大) */
  animation-duration: 1.1s;
}
@keyframes vsSkillHammer {
  0%, 66%, 100% { transform: rotate(0deg) translateY(0); }
  72% { transform: rotate(-30deg) translateY(-1px); }
  78% { transform: rotate(8deg) translateY(1px); }
  84% { transform: rotate(-6deg); }
  92% { transform: rotate(2deg); }
}

/* 2026-09-09: 定时任务——日历滴答一摆(闲置 4.5s 一次, 悬浮加快, 同锤子口径) */
.nav-sub-ico-clock {
  display: inline-flex;
  transform-origin: 50% 90%;
}
.nav-sub-ico-clock > svg {
  animation: vsClockTick 4.5s ease-in-out infinite;
}
.nav-sub-item:hover .nav-sub-ico-clock > svg {
  animation-duration: 1.2s;
}
@keyframes vsClockTick {
  0%, 78%, 100% { transform: rotate(0deg); }
  84% { transform: rotate(-11deg); }
  90% { transform: rotate(7deg); }
  95% { transform: rotate(-3deg); }
}

/* 模板创建——拼版呼吸闪动一下 */
.nav-sub-ico-template {
  display: inline-flex;
  transform-origin: 50% 50%;
}
.nav-sub-ico-template > svg {
  animation: vsTemplatePulse 4.5s ease-in-out infinite;
}
.nav-sub-item:hover .nav-sub-ico-template > svg {
  animation-duration: 1.4s;
}
@keyframes vsTemplatePulse {
  0%, 74%, 100% { transform: scale(1); opacity: 1; }
  80% { transform: scale(1.14); opacity: 0.7; }
  88% { transform: scale(0.97); opacity: 1; }
}
.vs-dialog-title {
  margin: 0 0 6px;
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: var(--text);
  padding-right: 24px; /* 给右上角 × 留位 */
}
.vs-dialog-body { font-size: 0.875rem; }
.vs-dialog-msg {
  margin: 0;
  line-height: 1.7;
  color: var(--muted, #64748b);
  word-break: break-word;
  white-space: pre-line;
}
.vs-dialog-input {
  width: 100%;
  box-sizing: border-box;
  margin-top: 10px;
  padding: 9px 12px;
  border: 1px solid var(--line2, var(--border));
  border-radius: 9px;
  background: var(--bg, #fff);
  color: var(--text);
  font: inherit;
  font-size: 0.875rem;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.vs-dialog-input:focus {
  outline: none;
  border-color: var(--accent, #2383e2);
  box-shadow: 0 0 0 3px rgba(35, 131, 226, 0.15);
}
.vs-dialog-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 20px;
}
.vs-dialog-btn {
  min-width: 78px;
  padding: 8px 18px;
  border-radius: 9px;
  border: 1px solid transparent;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s, transform 0.1s, box-shadow 0.15s;
}
.vs-dialog-btn:active { transform: scale(0.97); }
.vs-dialog-btn:focus { outline: none; }
.vs-dialog-btn:focus-visible { box-shadow: 0 0 0 3px rgba(35, 131, 226, 0.22); }
.vs-dialog-btn.ghost {
  background: transparent;
  border-color: var(--line2, var(--border));
  color: var(--text);
}
.vs-dialog-btn.ghost:hover { background: rgba(15, 23, 42, 0.04); }
.vs-dialog-btn.primary {
  background: var(--accent, #2383e2);
  color: #fff;
  box-shadow: 0 1px 2px rgba(35, 131, 226, 0.3), 0 4px 12px -4px rgba(35, 131, 226, 0.35);
}
.vs-dialog-btn.primary:hover { background: var(--accent-hover, #1b6cc4); }
.vs-dialog-btn.primary:focus-visible { box-shadow: 0 0 0 3px rgba(35, 131, 226, 0.25); }
.vs-dialog-btn.danger {
  background: var(--fail, #d64541);
  color: #fff;
  box-shadow: 0 1px 2px rgba(214, 69, 65, 0.3), 0 4px 12px -4px rgba(214, 69, 65, 0.35);
}
.vs-dialog-btn.danger:hover { background: #c03a36; }
.vs-dialog-btn.danger:focus-visible { box-shadow: 0 0 0 3px rgba(214, 69, 65, 0.25); }


.vs-btn-sm {
  font-size: 0.78rem !important;
  padding: 0.25rem 0.55rem !important;
}

/* ── 需求转用例 3.0(2026-08-13)────────────────────────── */
.vs-req-list-view { margin-top: 0.7rem; }
.vs-req-batch-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 0.65rem;
}
.vs-req-batch-card {
  border: 1px solid var(--border);
  border-radius: 5px;
  padding: 0.7rem 0.85rem;
  background: var(--surface);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.vs-req-batch-card:hover { border-color: var(--accent, var(--accent)); background: rgba(35,131,226,0.06); }
.vs-req-batch-card-title { font-weight: 600; display: flex; justify-content: space-between; gap: 0.4rem; margin-bottom: 0.25rem; }
.vs-req-batch-card-meta { font-size: 0.72rem; color: var(--muted); font-family: var(--font-mono, monospace); margin-bottom: 0.4rem; }
.vs-req-batch-card-stats { display: flex; gap: 0.4rem; font-size: 0.78rem; flex-wrap: wrap; }
.vs-req-stat-chip { padding: 0.1rem 0.45rem; border-radius: 3px; border: 1px solid var(--border); font-family: var(--font-mono, monospace); font-size: 0.72rem; }
.vs-req-stat-chip.saved { color: var(--success); border-color: rgba(15, 123, 15, 0.4); }
.vs-req-stat-chip.failed { color: var(--danger); border-color: rgba(224, 62, 62, 0.4); }
.vs-req-stat-chip.running { color: var(--accent); border-color: rgba(35,131,226,0.4); }
.vs-req-stat-chip.pending { color: var(--muted); }

.vs-req-detail-view { margin-top: 0.7rem; display: flex; flex-direction: column; gap: 0.65rem; }
.vs-req-detail-head {
  display: flex; align-items: center; gap: 1rem; padding: 0.55rem 0.75rem;
  border: 1px solid var(--border); background: var(--surface); border-radius: 5px; flex-wrap: wrap;
}
.vs-req-detail-title { flex: 1; min-width: 200px; }
.vs-req-detail-title h3 { margin: 0; font-size: 0.98rem; }
.vs-req-detail-sub { font-size: 0.78rem; color: var(--muted); font-family: var(--font-mono, monospace); }
.vs-req-progress-stat { font-family: var(--font-mono, monospace); font-size: 0.85rem; color: var(--muted); padding: 0 0.5rem; }
.vs-req-detail-actions { display: flex; gap: 0.45rem; flex-wrap: wrap; }

.vs-req-shell {
  display: grid;
  grid-template-columns: minmax(200px, 240px) minmax(0, 1fr) minmax(300px, 400px);
  gap: 0.65rem;
  min-height: 520px;
}
.vs-req-col { border: 1px solid var(--border); background: var(--surface); display: flex; flex-direction: column; overflow: hidden; }
.vs-req-col-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--border);
  background: rgba(107, 114, 128, 0.04); font-size: 0.85rem; gap: 0.4rem;
}
.vs-req-col-head-actions { display: flex; gap: 0.3rem; }

.vs-req-upload-zone { padding: 1rem; display: flex; flex-direction: column; align-items: center; gap: 0.6rem; border-bottom: 1px solid var(--border); }
.vs-req-upload-zone .vs-hint { font-size: 0.7rem; text-align: center; }

.vs-req-doc-list { flex: 1; overflow: auto; padding: 0.4rem; }
.vs-req-doc-row {
  padding: 0.5rem 0.6rem; border: 1px solid transparent; border-radius: 4px; margin-bottom: 0.3rem;
  font-size: 0.82rem; transition: background 0.1s, border-color 0.1s;
}
.vs-req-doc-row:hover { background: rgba(107, 114, 128, 0.05); }
.vs-req-doc-row.active { border-color: var(--accent); background: rgba(35,131,226,0.08); }
.vs-req-doc-name { font-weight: 600; word-break: break-all; }
.vs-req-doc-meta { font-size: 0.7rem; color: var(--muted); font-family: var(--font-mono, monospace); margin-top: 0.15rem; }
.vs-req-doc-status { font-size: 0.68rem; padding: 0.05rem 0.4rem; border-radius: 3px; font-family: var(--font-mono, monospace); }
.vs-req-doc-status[data-status="uploaded"] { background: rgba(107, 114, 128, 0.15); color: var(--muted); }
.vs-req-doc-status[data-status="parsed"] { background: rgba(15, 123, 15, 0.18); color: var(--success); }
.vs-req-doc-status[data-status="parsing"] { background: rgba(35,131,226,0.15); color: var(--accent); }
.vs-req-doc-status[data-status="failed"] { background: rgba(224, 62, 62, 0.18); color: var(--danger); }

.vs-req-config { padding: 0.6rem 0.75rem; display: flex; flex-direction: column; gap: 0.45rem; }
.vs-req-config-row { display: flex; flex-direction: column; gap: 0.2rem; }
.vs-req-config-row span { font-size: 0.72rem; color: var(--muted); }
.vs-req-config-row input { border: 1px solid var(--border); background: var(--bg, var(--bg)); color: var(--text); padding: 0.3rem 0.45rem; border-radius: 4px; font-size: 0.82rem; }

.vs-req-case-list { flex: 1; overflow: auto; padding: 0.4rem; }
.vs-req-case-row {
  padding: 0.5rem 0.6rem; border: 1px solid transparent; border-radius: 4px; margin-bottom: 0.3rem;
  cursor: pointer; font-size: 0.85rem; transition: background 0.1s, border-color 0.1s;
}
.vs-req-case-row:hover { background: rgba(107, 114, 128, 0.05); }
.vs-req-case-row.active { border-color: var(--accent); background: rgba(35,131,226,0.08); }
.vs-req-case-head { display: flex; align-items: center; gap: 0.4rem; }
.vs-req-case-check { margin: 0; cursor: pointer; flex-shrink: 0; }
.vs-req-case-no { font-family: var(--font-mono, monospace); font-size: 0.7rem; color: var(--muted); flex-shrink: 0; }
.vs-req-priority { font-size: 0.7rem; font-weight: 700; padding: 0.05rem 0.4rem; border-radius: 3px; font-family: var(--font-mono, monospace); }
.vs-req-priority.P0 { background: rgba(224, 62, 62, 0.18); color: var(--danger); }
.vs-req-priority.P1 { background: rgba(224, 62, 62, 0.18); color: var(--warning); }
.vs-req-priority.P2 { background: rgba(107, 114, 128, 0.18); color: var(--muted); }
.vs-req-case-name { flex: 1; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vs-req-case-status { font-size: 0.68rem; padding: 0.05rem 0.4rem; border-radius: 3px; font-family: var(--font-mono, monospace); }
.vs-req-case-status[data-status="pending"] { background: rgba(107, 114, 128, 0.15); color: var(--muted); }
.vs-req-case-status[data-status="md_done"] { background: rgba(224, 62, 62, 0.18); color: var(--warning); }
.vs-req-case-status[data-status="yaml_done"] { background: rgba(35,131,226,0.15); color: var(--accent); }
.vs-req-case-status[data-status="saved"] { background: rgba(15, 123, 15, 0.28); color: var(--success); font-weight: 600; }
.vs-req-case-status[data-status="failed"] { background: rgba(224, 62, 62, 0.18); color: var(--danger); }
.vs-req-case-source { font-size: 0.7rem; color: var(--muted); font-family: var(--font-mono, monospace); margin-top: 0.2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vs-req-quality { margin-left: auto; font-size: 0.68rem; font-family: var(--font-mono, monospace); }

.vs-req-case-detail { flex: 1; overflow: auto; padding: 0.6rem; display: flex; flex-direction: column; gap: 0.5rem; }
.vs-req-case-detail .vs-req-empty { margin: auto; }
.vs-req-case-fields { display: flex; flex-direction: column; gap: 0.4rem; }
.vs-req-case-fields label { display: flex; flex-direction: column; gap: 0.2rem; font-size: 0.72rem; color: var(--muted); }
.vs-req-case-fields input, .vs-req-case-fields textarea {
  border: 1px solid var(--border); background: var(--bg, var(--bg)); color: var(--text);
  padding: 0.4rem 0.5rem; border-radius: 4px; font-size: 0.82rem; font-family: var(--font-mono, monospace);
}
.vs-req-case-fields textarea { resize: vertical; min-height: 120px; }
.vs-req-case-fields textarea.yaml { min-height: 200px; color: var(--accent); }
.vs-req-case-actions { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.vs-req-case-error { color: var(--danger); font-size: 0.78rem; font-family: var(--font-mono, monospace); white-space: pre-wrap; }

.vs-req-empty { padding: 1.5rem 1rem; text-align: center; color: var(--muted); font-size: 0.85rem; }

@media (max-width: 1280px) {
  .vs-req-shell { grid-template-columns: 1fr; grid-auto-rows: minmax(280px, auto); }
}

/* ── 悬浮对话球(2026-08-13)────────────────────────── */
.vs-chat-fab {
  position: fixed;
  right: 1.2rem;
  bottom: 1.2rem;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--accent, var(--accent));
  color: var(--accent-text, #fff);
  border: none;
  font-size: 1.4rem;
  cursor: pointer;
  z-index: 9990;
  box-shadow: 0 3px 14px rgba(0,0,0,0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.15s, box-shadow 0.15s;
}
.vs-chat-fab:hover { transform: scale(1.08); box-shadow: 0 5px 20px rgba(0,0,0,0.45); }
.vs-chat-fab.open { background: var(--surface2, var(--surface2)); color: var(--accent); border: 1px solid var(--accent); }

.vs-chat-panel {
  position: fixed;
  right: 1.2rem;
  bottom: 5rem;
  width: 420px;
  max-width: 92vw;
  height: 480px;
  max-height: 70vh;
  background: var(--surface, var(--bg));
  border: 1px solid var(--border);
  border-radius: 8px;
  z-index: 9991;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 6px 30px rgba(0,0,0,0.4);
}
.vs-chat-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.6rem 0.8rem;
  border-bottom: 1px solid var(--border);
  background: rgba(107, 114, 128, 0.06);
  font-size: 0.9rem;
  font-weight: 600;
  gap: 0.5rem;
}
.vs-chat-panel-head-actions { display: flex; align-items: center; gap: 0.5rem; }
.vs-chat-context {
  font-size: 0.72rem;
  color: var(--muted);
  font-weight: 400;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.vs-chat-messages {
  flex: 1;
  overflow: auto;
  padding: 0.6rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.vs-chat-msg {
  padding: 0.5rem 0.7rem;
  border-radius: 6px;
  font-size: 0.84rem;
  max-width: 85%;
  word-break: break-word;
}
.vs-chat-msg.user {
  align-self: flex-end;
  /* 实心蓝太抢眼(2026-09-08 去花): 浅主色底 + 正常文字, 与 assistant 气泡同色系 */
  background: color-mix(in srgb, var(--accent) 9%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent);
  color: var(--text);
}
.vs-chat-msg.assistant {
  align-self: flex-start;
  background: var(--surface2, var(--surface2));
  border: 1px solid var(--border);
  color: var(--text);
}
.vs-chat-loading { color: var(--muted); font-style: italic; }
.vs-chat-muted { color: var(--muted); }
.vs-chat-patch {
  margin: 0.4rem 0 0;
  padding: 0.5rem;
  background: var(--bg, var(--bg));
  border: 1px solid var(--border);
  border-radius: 4px;
  font-family: var(--font-mono, monospace);
  font-size: 0.75rem;
  white-space: pre-wrap;
  max-height: 180px;
  overflow: auto;
}
.vs-chat-diff {
  border-top: 1px solid var(--border);
  background: var(--bg, var(--bg));
  padding: 0.6rem;
  max-height: 220px;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.vs-chat-diff-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.8rem;
  font-weight: 600;
}
.vs-chat-diff-head > div { display: flex; gap: 0.4rem; }
.vs-chat-diff pre {
  margin: 0;
  flex: 1;
  overflow: auto;
  font-family: var(--font-mono, monospace);
  font-size: 0.75rem;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--accent);
}
.vs-chat-input {
  display: flex;
  gap: 0.5rem;
  padding: 0.6rem;
  border-top: 1px solid var(--border);
}
.vs-chat-input textarea {
  flex: 1;
  resize: none;
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.5rem;
  border-radius: 4px;
  font-size: 0.82rem;
  min-height: 34px;
}
.vs-chat-input textarea:focus { outline: none; border-color: var(--accent, var(--accent)); }


/* ── 需求转用例(2026-08-16 简洁版)────────────────────── */
.vs-req-detail-view {
  display: flex; flex-direction: column; gap: 0.8rem; margin-top: 0.7rem;
}
.vs-req-actions {
  display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap;
  padding: 0.7rem 0.9rem; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface);
}
.vs-req-made { font-size: 0.82rem; color: var(--muted); margin-left: auto; font-family: var(--font-mono, monospace); }

.vs-req-current {
  display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap;
  padding: 0.6rem 0.9rem; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface);
}
.vs-req-doc-chip {
  font-size: 0.82rem; padding: 0.25rem 0.6rem; border: 1px solid var(--border);
  border-radius: 4px; background: var(--bg, var(--bg)); color: var(--text);
  font-family: var(--font-mono, monospace);
}
.vs-req-made-stat { font-size: 0.85rem; color: var(--text); font-weight: 600; }
.vs-req-hint { font-size: 0.78rem; color: var(--muted); }

.vs-req-cases {
  display: flex; flex-direction: column; gap: 0.5rem;
  border: 1px solid var(--border); border-radius: 6px; background: var(--surface);
  padding: 0.6rem; min-height: 300px;
}
.vs-req-empty { padding: 1.5rem 1rem; text-align: center; color: var(--muted); font-size: 0.88rem; }

/* 模块分组 */
.vs-req-mod { border: 1px solid var(--border); border-radius: 6px; overflow: hidden; background: var(--bg, var(--bg)); }
.vs-req-mod-head {
  display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.75rem;
  cursor: pointer; font-size: 0.9rem;
}
.vs-req-mod-head:hover { background: rgba(107, 114, 128, 0.05); }
.vs-req-mod-toggle { color: var(--muted); width: 1em; }
.vs-req-mod-name { font-weight: 700; flex: 1; }
.vs-req-mod-count { color: var(--muted); font-family: var(--font-mono, monospace); font-size: 0.8rem; }
.vs-req-mod-attn { color: var(--warning); font-size: 0.75rem; font-weight: 600; }
.vs-req-mod-cases { border-top: 1px dashed var(--border); }

/* 用例行 */
.vs-req-case { border-bottom: 1px solid var(--border); }
.vs-req-case:last-child { border-bottom: none; }
.vs-req-case.attn { border-left: 3px solid var(--warning); }
.vs-req-case.open { background: rgba(35,131,226,0.04); }
.vs-req-case-head {
  display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem;
  cursor: pointer; font-size: 0.85rem;
}
.vs-req-case-head:hover { background: rgba(107, 114, 128, 0.04); }
.vs-req-case-toggle { color: var(--muted); width: 1em; flex-shrink: 0; }
.vs-req-case-check { margin: 0; cursor: pointer; flex-shrink: 0; }
.vs-req-case-no { font-family: var(--font-mono, monospace); font-size: 0.72rem; color: var(--muted); flex-shrink: 0; }
.vs-req-prio { font-size: 0.7rem; font-weight: 700; padding: 0.05rem 0.4rem; border-radius: 3px; font-family: var(--font-mono, monospace); flex-shrink: 0; }
.vs-req-prio.P0 { background: rgba(224, 62, 62, 0.18); color: var(--danger); }
.vs-req-prio.P1 { background: rgba(224, 62, 62, 0.18); color: var(--warning); }
.vs-req-prio.P2 { background: rgba(107, 114, 128, 0.18); color: var(--muted); }
.vs-req-case-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vs-req-attn-mark { color: var(--warning); font-size: 0.72rem; font-weight: 600; flex-shrink: 0; }
.vs-req-case-status { font-size: 0.72rem; padding: 0.05rem 0.4rem; border-radius: 3px; font-family: var(--font-mono, monospace); flex-shrink: 0; }
.vs-req-case-status { background: rgba(107, 114, 128, 0.15); color: var(--muted); }
.vs-req-case-edit { background: transparent; border: none; color: var(--muted); cursor: pointer; font-size: 0.85rem; flex-shrink: 0; }
.vs-req-case-edit:hover { color: var(--text); }
/* 「查看 YAML」直接入口: 已有 yaml 才显示, 浅色描边小标签 */
.vs-req-case-view-yaml {
  flex-shrink: 0;
  font-size: 0.72rem;
  padding: 0.18rem 0.5rem;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  border-radius: 4px;
  background: color-mix(in srgb, var(--accent) 5%, transparent);
  color: var(--accent);
  cursor: pointer;
  font-family: var(--font-mono, monospace);
  white-space: nowrap;
}
.vs-req-case-view-yaml:hover {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  border-color: var(--accent);
}

/* 展开详情 */
.vs-req-case-body { padding: 0.6rem 0.75rem 0.8rem 2.1rem; border-top: 1px dashed var(--border); }
.vs-req-f { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; font-size: 0.82rem; }
.vs-req-f .k { flex: 0 0 42px; color: var(--muted); font-weight: 600; }
.vs-req-f .v { flex: 1; white-space: pre-wrap; word-break: break-word; }
.vs-req-err { color: var(--danger); font-size: 0.8rem; font-family: var(--font-mono, monospace); margin-bottom: 0.5rem; }
.vs-req-yaml { width: 100%; margin-bottom: 0.6rem; }
.vs-req-yaml summary { cursor: pointer; font-size: 0.78rem; color: var(--muted); }
.vs-req-yaml pre { margin: 0.4rem 0 0; padding: 0.6rem; background: var(--surface, var(--bg)); border: 1px solid var(--border); border-radius: 4px; font-size: 0.75rem; color: var(--accent); max-height: 260px; overflow: auto; white-space: pre-wrap; }
.vs-req-case-acts { display: flex; gap: 0.4rem; flex-wrap: wrap; }

/* ── 用例库列表(2026-08-16)────────────────────────── */
.vs-req-hero { text-align: center; padding: 3rem 1rem; }
.vs-req-hero-title { font-size: 1.2rem; font-weight: 700; margin: 0 0 0.5rem; }
.vs-req-hero-sub { font-size: 0.9rem; color: var(--muted); line-height: 1.6; }

.vs-req-group-label {
  font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: none;
  color: var(--muted); padding: 0.6rem 0.2rem 0.3rem;
}
.vs-req-suite {
  border: 1px solid var(--border); border-radius: 8px; padding: 0.8rem 0.9rem;
  cursor: pointer; transition: border-color 0.12s, background 0.12s; background: var(--bg, var(--bg));
  margin-bottom: 0.5rem;
}
.vs-req-suite:hover { border-color: var(--accent); }
.vs-req-suite-main { display: flex; align-items: center; gap: 0.6rem; }
.vs-req-suite-ico { font-size: 1.2rem; }
.vs-req-suite-name { font-weight: 700; font-size: 1rem; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vs-req-suite-count { color: var(--muted); font-family: var(--font-mono, monospace); font-size: 0.8rem; }
.vs-req-suite-status { font-size: 0.72rem; padding: 0.1rem 0.45rem; border-radius: 3px; font-family: var(--font-mono, monospace); }
.vs-req-suite-status[data-status="idle"] { background: rgba(107, 114, 128, 0.15); color: var(--muted); }
.vs-req-suite-status[data-status="running"] { background: rgba(35,131,226,0.15); color: var(--accent); }
.vs-req-suite-status[data-status="completed"] { background: rgba(15, 123, 15, 0.25); color: var(--success); }
.vs-req-suite-status[data-status="failed"] { background: rgba(224, 62, 62, 0.18); color: var(--danger); }
.vs-req-suite-meta { display: flex; gap: 0.8rem; margin-top: 0.35rem; font-size: 0.75rem; color: var(--muted); font-family: var(--font-mono, monospace); flex-wrap: wrap; }
.vs-req-suite-draft { color: var(--warning); font-weight: 600; }

/* 用例库头部 */
.vs-req-suite-title { font-size: 1rem; font-weight: 600; }
.vs-req-suite-docs { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-top: 0.3rem; }
.vs-req-suite-docs .vs-req-doc-chip { cursor: pointer; }
.vs-req-doc-view { color: var(--accent); text-decoration: none; margin-left: 0.3rem; }
.vs-req-suite-stat { font-size: 0.85rem; color: var(--text); font-weight: 600; margin-top: 0.3rem; }

/* ── 首页视图 + 用例库详情(2026-08-16)──────────────── */
.vs-req-home { display: flex; flex-direction: column; gap: 0.8rem; }
.vs-req-home-actions {
  display: flex; align-items: center; gap: 0.8rem; padding: 1.2rem;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.btn.is-pressed { transform: scale(0.97); transition: transform 80ms ease; }
.vs-req-home-suite-head { padding: 0.4rem 0.2rem 0.2rem; }
.vs-req-suite-grid { display: flex; flex-direction: column; gap: 0.5rem; }

.vs-req-suite-view { display: flex; flex-direction: column; gap: 0.8rem; }
.vs-req-suite-top {
  display: flex; align-items: center; gap: 0.8rem; flex-wrap: wrap;
  padding: 0.7rem 0.9rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.vs-req-suite-titlebar { flex: 1; min-width: 180px; }
.vs-req-suite-titlebar h3 { margin: 0; font-size: 1.05rem; }
.vs-req-suite-stat { font-size: 0.8rem; color: var(--muted); font-family: var(--font-mono, monospace); }
.vs-req-suite-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }

.vs-req-suite-docbar {
  display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap;
  padding: 0.6rem 0.9rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
}
.vs-req-doc-chip {
  font-size: 0.8rem; padding: 0.25rem 0.6rem; border: 1px solid var(--border);
  border-radius: 4px; background: var(--bg, var(--bg)); color: var(--text); cursor: pointer;
  font-family: var(--font-mono, monospace);
}
.vs-req-doc-view { color: var(--accent); text-decoration: none; margin-left: 0.3rem; }

/* hidden 属性必须生效:display:flex 会覆盖 hidden,这里强制 */
[hidden] { display: none !important; }

/* ============================================================
   多端运行页 (.vs-mr-*) — 2026-08-18, 依据 docs/development-standards.md
   仅在既有令牌内扩展: --bg/--bg-panel/--line(-strong)/--text/--muted/--hint/--accent/--pass/--warn/--fail
   字号只用 L3 13 / L4 12; 无常新色/新字体/渐变/发光/大写; 输入框用 line-strong + accent 焦点环
   ============================================================ */
.vs-mr-card {
  background: var(--bg-panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 16px;
}
.vs-mr-ready {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.vs-mr-ready-sep { width: 1px; height: 14px; background: var(--line-strong); }
.vs-mr-ready-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
}
.vs-mr-dot { width: 8px; height: 8px; border-radius: 50%; }
.vs-mr-dot.pass { background: var(--pass); }
.vs-mr-dot.warn { background: var(--warn); }
.vs-mr-dot.fail { background: var(--fail); }
.vs-mr-dot.idle { background: var(--muted); }
.vs-mr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 14px 16px;
  margin-top: 16px;
}
.vs-mr-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.vs-mr-field > label { font-size: 12px; color: var(--muted); }
.vs-mr-field.hint-block { display: block; }
.vs-mr-field .vs-mr-hint { display:block; margin-top:2px; font-size:12px; color: var(--hint); }
.vs-mr-field input[type="text"],
.vs-mr-field input[type="number"],
.vs-mr-field select {
  height: 32px;
  font-size: 13px;
  color: var(--text);
  background: var(--bg-panel);
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  padding: 0 8px;
  font-family: var(--font);
}
.vs-mr-field .mono { font-family: var(--code-font); font-size: 12px; }
.vs-mr-field input:focus,
.vs-mr-field select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-weak);
}
.vs-mr-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.vs-mr-check input { accent-color: var(--accent); }
.vs-mr-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.vs-mr-preview {
  width: 100%;
  min-height: 120px;
  margin-top: 16px;
  padding: 10px;
  font-family: var(--code-font);
  font-size: 12px;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  resize: vertical;
}
.vs-mr-body { display: flex; flex-direction: column; gap: 16px; max-width: 860px; }

/* ============ 多端运行页 布局精修(2026-08-18-2) ============ */
.vs-mr-body { gap: 16px; }
.vs-mr-card { padding: 20px; }
.vs-mr-section { padding: 14px 0 18px; }
.vs-mr-section + .vs-mr-section { border-top: 1px solid var(--line); }
.vs-mr-ready {
  margin-top: 12px;
  color: var(--muted);
}
.vs-mr-ready-note { margin: 8px 0 0; font-size: 12px; color: var(--hint); min-height: 16px; }
.vs-mr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vs-mr-optrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 22px;
  margin-top: 12px;
}
.vs-mr-optrow .vs-mr-check,
.vs-mr-optrow .vs-mr-field { margin-top: 2px; }
.vs-mr-optrow .vs-mr-field select { min-width: 200px; }
.vs-mr-actions { border-top: 1px solid var(--line); margin-top: 4px; padding-top: 16px; }
.vs-mr-previewhead { margin-top: 16px; }
.vs-mr-preview { margin-top: 6px; }

.vs-mr-emulo { display:flex; align-items:center; gap:10px; margin-top:10px; flex-wrap:wrap; }
.vs-mr-emulo .vs-mr-hint { font-size:12px; color:var(--hint); }

.vs-mr-avd { display:grid; grid-template-columns: repeat(auto-fill,minmax(150px,1fr)); gap:10px 12px; margin-top:10px; align-items:end; }

/* ============ 多端运行 精修(2026-08-18-4) ============ */
.vs-mr-card { border-radius: 12px; }
.vs-mr-ready { gap: 14px; }
.vs-mr-ready-item { font-size: 13px; gap: 7px; }
.vs-mr-dot { width: 8px; height: 8px; }

/* 运行目标 = 主选择(hero) */
.vs-mr-target {
  display: flex; align-items: flex-end; gap: 12px;
  margin: 4px 0 10px;
}
.vs-mr-target .vs-mr-field { flex: 1; min-width: 0; }
.vs-mr-target select {
  height: 38px; font-size: 14px; font-weight: 600;
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent-weak);
}
.vs-mr-target .vs-mr-field > label { font-weight: 600; color: var(--text); }
.vs-mr-target .vs-mr-hint { font-weight: 400; }
.vs-mr-target .vs-mr-tag {
  flex-shrink: 0; align-self: center;
  font-size: 12px; color: var(--muted);
  background: var(--bg); border: 1px solid var(--line);
  padding: 4px 8px; border-radius: 6px;
}

/* 模拟器管理 = 次级辅助 */
.vs-mr-assist {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px 14px;
  background: var(--bg);
  margin-top: 4px;
}
.vs-mr-assist-title { font-size: 12px; color: var(--hint); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
.vs-mr-avd {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 10px 12px; align-items: end;
}
.vs-mr-avd .vs-btn-sm-row { grid-column: 1 / -1; display: flex; gap: 8px; }
.vs-mr-avd .btn-loading {
  opacity: .6; cursor: progress; pointer-events: none;
}
.vs-mr-note-ok { color: var(--pass); }
.vs-mr-note-err { color: var(--fail); }
.vs-mr-field select:disabled { opacity: .5; }

/* ============================================================
   多端运行 · 整体重设计(2026-08-18-FINAL)
   统一控件/对齐/间距,消除"毕设感"。仅规范令牌 + 系统字体。
   ============================================================ */
.vs-mr-page .vs-mr-body { max-width: 900px; display: flex; flex-direction: column; gap: 18px; }
.vs-mr-page .vs-mr-card { padding: 22px; }
.vs-mr-page .vs-mr-section { padding: 16px 2px 20px; }

/* 字段：标签上置，控件统一 34px */
.vs-mr-page .vs-mr-field { display: flex; flex-direction: column; gap: 6px; }
.vs-mr-page .vs-mr-field > label { font-size: 12px; font-weight: 600; color: var(--muted); letter-spacing: 0; }

/* 统一控件（input / select） */
.vs-mr-page .vs-mr-field .vs-mr-control {
  height: 34px;
  font-size: 13px;
  color: var(--text);
  background: var(--bg-panel);
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  padding: 0 10px;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
  width: 100%;
  font-family: var(--font);
}
.vs-mr-page .vs-mr-field .vs-mr-control:hover { border-color: var(--accent); }
.vs-mr-page .vs-mr-field .vs-mr-control:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-weak);
}
.vs-mr-page .vs-mr-control.vs-mr-mono { font-family: var(--code-font); font-size: 12.5px; }
.vs-mr-page .vs-mr-control::placeholder { color: var(--hint); }

/* 自定义 select：去原生箭头，蓝 chevron */
.vs-mr-page .vs-mr-select { position: relative; display: block; width: 100%; }
.vs-mr-page .vs-mr-select .vs-mr-control {
  -webkit-appearance: none; appearance: none;
  padding-right: 32px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 15px;
}

/* 网格：连接与启动 两列对齐；端选项一行；模拟器两列 */
.vs-mr-page .vs-mr-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 22px;
  margin-top: 6px;
}
.vs-mr-page .vs-mr-optrow { display: flex; flex-wrap: wrap; gap: 16px 26px; align-items: center; margin-top: 6px; }
.vs-mr-page .vs-mr-check { gap: 7px; font-size: 13px; color: var(--muted); cursor: pointer; }
.vs-mr-page .vs-mr-check input { accent-color: var(--accent); }
.vs-mr-page .vs-mr-avd { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 22px; margin-top: 6px; }
.vs-mr-page .vs-mr-avd-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }

/* 运行环境 */
.vs-mr-page .vs-mr-ready { display: flex; align-items: center; gap: 16px; margin: 14px 0 6px; flex-wrap: wrap; }
.vs-mr-page .vs-mr-ready-item { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--muted); }
.vs-mr-page .vs-mr-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.vs-mr-page .vs-mr-dot.pass { background: var(--pass); } .vs-mr-page .vs-mr-dot.warn { background: var(--warn); }
.vs-mr-page .vs-mr-dot.fail { background: var(--fail); } .vs-mr-page .vs-mr-dot.idle { background: var(--muted); }
.vs-mr-page .vs-mr-ready-note { font-size: 12px; color: var(--hint); min-height: 16px; margin: 4px 0 0; }

/* 运行目标 hero */
.vs-mr-page .vs-mr-target { display: flex; align-items: flex-end; gap: 14px; margin: 8px 0 12px; }
.vs-mr-page .vs-mr-target .vs-mr-field { flex: 1; min-width: 0; }
.vs-mr-page .vs-mr-target .vs-mr-target-select { height: 40px; font-size: 14px; font-weight: 600; border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-weak); }
.vs-mr-page .vs-mr-target .vs-mr-field > label { font-size: 13px; font-weight: 700; color: var(--text); }
.vs-mr-page .vs-mr-target .vs-mr-hint { font-weight: 400; color: var(--hint); font-size: 12px; }
.vs-mr-page .vs-mr-tag {
  flex: none; font-size: 12px; color: var(--muted); background: var(--bg);
  border: 1px solid var(--line); border-radius: 6px; padding: 7px 10px; max-width: 46%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 内置模拟器 assist */
.vs-mr-page .vs-mr-assist { border: 1px solid var(--line); background: var(--bg); border-radius: 10px; padding: 16px 18px; margin-top: 6px; }
.vs-mr-page .vs-mr-assist-title { font-size: 12px; font-weight: 600; color: var(--hint); margin-bottom: 4px; }

/* 底部操作 + 预览 */
.vs-mr-page .vs-mr-actions { border-top: 1px solid var(--line); margin-top: 6px; padding-top: 18px; display: flex; justify-content: flex-end; gap: 10px; }
.vs-mr-page .vs-mr-previewhead { margin-top: 20px; }
.vs-mr-page .vs-mr-preview {
  width: 100%; min-height: 128px; margin-top: 8px; padding: 12px;
  font-family: var(--code-font); font-size: 12px; line-height: 1.55;
  color: var(--text); background: var(--bg-panel);
  border: 1px solid var(--line-strong); border-radius: 8px; resize: vertical; outline: none;
}
.vs-mr-page .vs-mr-preview:focus { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-weak); }

/* 反馈 */
.vs-mr-page .vs-mr-note-ok { color: var(--pass); } .vs-mr-page .vs-mr-note-err { color: var(--fail); }
.vs-mr-page .btn-loading { opacity: .6; cursor: progress; }

/* ============ 多端 · 本端运行历史(2026-08-19) ============ */
.vs-mr-history-list { margin-top: 4px; display: flex; flex-direction: column; gap: 6px; }
.vs-mr-history-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-panel); font-size: 13px;
}
.vs-mr-history-id { font-family: var(--code-font); font-size: 12px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vs-mr-history-time { color: var(--muted); font-size: 12px; flex: none; }
.vs-mr-history-actions { flex: none; }
.vs-mr-note-muted { color: var(--hint); font-size: 12px; margin: 6px 0 0; }
/* === 多端运行·重设计(2026-08-21)— 单卡多段 + 统一控件 + 表格化历史 === */
.vs-mr-page .vs-mr-body{ max-width: 1080px; display: flex; flex-direction: column; gap: 18px; }
.vs-mr-page .vs-mr-card{ padding: 0; overflow: hidden; }   /* 单卡,内部分段 */

/* 段:段间一条线,每段 padding */
.vs-mr-page .vs-mr-section{ padding: 18px 22px 20px; }
.vs-mr-page .vs-mr-section + .vs-mr-section{ border-top: 1px solid var(--line); }

/* 标题 */
.vs-mr-page .vs-panel-head{ margin: -2px 0 12px; padding: 0; background: transparent; border: 0; }
.vs-mr-page .vs-panel-label{ font-size: 14px; font-weight: 600; color: var(--accent); letter-spacing: 0; }

/* 统一控件 34px */
.vs-mr-page .vs-mr-control{
  height: 34px; font-size: 13px; color: var(--text); background: var(--bg-panel);
  border: 1px solid var(--line-strong); border-radius: 8px; padding: 0 10px;
  outline: none; width: 100%; font-family: var(--font);
}
.vs-mr-page .vs-mr-control:hover{ border-color: var(--accent); }
.vs-mr-page .vs-mr-control:focus{ border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-weak); }
.vs-mr-page .vs-mr-mono{ font-family: var(--code-font); font-size: 12px; }
.vs-mr-page .vs-mr-control::placeholder{ color: var(--hint); }
.vs-mr-page .vs-mr-select{ position: relative; display: block; width: 100%; }
.vs-mr-page .vs-mr-select .vs-mr-control{
  -webkit-appearance: none; appearance: none; padding-right: 32px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 14px;
}

/* 字段 */
.vs-mr-page .vs-mr-field{ display: flex; flex-direction: column; gap: 6px; }
.vs-mr-page .vs-mr-field > label{ font-size: 12px; color: var(--muted); font-weight: 600; }

/* Hero 运行目标 —— 紧凑在一行 */
.vs-mr-page .vs-mr-target{
  display: grid; grid-template-columns: 1fr auto; gap: 10px 14px; align-items: end;
}
.vs-mr-page .vs-mr-target .vs-mr-field{ grid-column: 1; }
.vs-mr-page .vs-mr-target .vs-mr-hint{ font-weight: 400; color: var(--hint); font-size: 12px; }
.vs-mr-page .vs-mr-tag{ font-size: 12px; color: var(--text); background: var(--accent-weak); border: 1px solid var(--accent-border); border-radius: 6px; padding: 6px 10px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--code-font); }

/* 就绪状态(就一行) */
.vs-mr-page .vs-mr-ready{ display: flex; align-items: center; gap: 14px; margin-top: 14px; }
.vs-mr-page .vs-mr-ready-item{ display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--muted); }
.vs-mr-page .vs-mr-ready-note{ font-size: 12px; color: var(--hint); min-height: 16px; margin: 4px 0 0; }
.vs-mr-page .vs-mr-dot{ width: 8px; height: 8px; border-radius: 50%; }
.vs-mr-page .vs-mr-dot.pass{ background: var(--pass); }
.vs-mr-page .vs-mr-dot.warn{ background: var(--warn); }
.vs-mr-page .vs-mr-dot.fail{ background: var(--fail); }
.vs-mr-page .vs-mr-dot.idle{ background: var(--muted); }

/* 内置模拟器 assist —— 两列 */
.vs-mr-page .vs-mr-assist{ background: var(--bg); border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; margin-top: 14px; }
.vs-mr-page .vs-mr-assist-title{ font-size: 12px; color: var(--hint); margin-bottom: 10px; }
.vs-mr-page .vs-mr-avd{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.vs-mr-page .vs-mr-avd .vs-mr-field:last-child,
.vs-mr-page .vs-mr-avd .vs-mr-field.spans{ grid-column: 1 / -1; }
.vs-mr-page .vs-mr-avd-actions{ display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.vs-mr-page .vs-mr-assist .vs-mr-assist-title{ color: var(--muted); font-weight: 600; }

/* 网格 */
.vs-mr-page .vs-mr-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; }
.vs-mr-page .vs-mr-optrow{ display: flex; flex-wrap: wrap; gap: 16px 22px; align-items: center; }
.vs-mr-page .vs-mr-check{ display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--muted); cursor: pointer; }
.vs-mr-page .vs-mr-check input{ accent-color: var(--accent); }

/* 操作行:主CTA + 辅助 */
.vs-mr-page .vs-mr-actions{ display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin-top: 6px; }

/* 预览 */
.vs-mr-page .vs-mr-previewhead{ margin: 20px 0 6px; }
.vs-mr-page .vs-mr-preview{
  width: 100%; min-height: 140px; padding: 12px; font-family: var(--code-font); font-size: 12px;
  line-height: 1.6; color: var(--text); background: var(--bg); border: 1px solid var(--line-strong); border-radius: 8px; resize: vertical; outline: none;
}
.vs-mr-page .vs-mr-preview:focus{ border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-weak); }

/* 历史 —— 表格化,不要卡片堆 */
.vs-mr-page .vs-mr-history-list{ margin-top: 4px; }
/* 固定列宽:窄面板里让用例列吃剩余宽度(单行省略),状态/用时/操作恒定,按钮不再被挤出面板 */
.vs-mr-page .vs-mr-history-list table{ width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
.vs-mr-page .vs-mr-history-list th,
.vs-mr-page .vs-mr-history-list td{ padding: 10px 6px; text-align: left; border-bottom: 1px solid var(--line); }
.vs-mr-page .vs-mr-history-list th{ font-weight: 600; color: var(--muted); font-size: 12px; }
.vs-mr-page .vs-mr-history-list th:nth-child(2),
.vs-mr-page .vs-mr-history-list td:nth-child(2){ width: 52px; }
.vs-mr-page .vs-mr-history-list th:nth-child(3),
.vs-mr-page .vs-mr-history-list td:nth-child(3){ width: 50px; }
.vs-mr-page .vs-mr-history-list th:nth-child(4),
.vs-mr-page .vs-mr-history-list td:nth-child(4){ width: 180px; }
.vs-mr-page .vs-mr-history-list th{ white-space: nowrap; }
.vs-mr-page .vs-mr-history-list tr:last-child td{ border-bottom: 0; }
.vs-mr-page .vs-mr-history-list .case-id{ font-family: var(--code-font); font-size: 12px; color: var(--text); overflow: hidden; }
.vs-mr-page .vs-mr-history-list .time{ color: var(--muted); font-size: 12px; }
.vs-mr-page .vs-mr-history-list .badge{ white-space: nowrap; }
.vs-mr-page .vs-mr-history-list .actions{ text-align: right; white-space: nowrap; }
/* 操作列固定三键(日志/自愈/报告):不换行、间距一致、不可用置灰弱化 */
.vs-mr-page .vs-mr-history-list .actions .vs-btn-sm{ margin-left: 4px; }
.vs-mr-page .vs-mr-history-list .actions .vs-btn-sm:disabled{
  opacity: .38; cursor: default; pointer-events: none; box-shadow: none;
}

/* 反馈 */
.vs-mr-page .vs-mr-note-muted{ color: var(--hint); font-size: 12px; margin: 6px 0 0; }
.vs-mr-page .vs-mr-note-ok{ color: var(--pass); }
.vs-mr-page .vs-mr-note-err{ color: var(--fail); }
.vs-mr-page .btn-loading{ opacity: .6; cursor: progress; pointer-events: none; }

/* ======================================================================
   多端运行 · 精致化重设(2026-08-21 FINAL)
   目标：去"平/简单/按钮乱"。层次+分区骨干+统一按钮三态+状态色+过渡。
   仍然只走规范令牌,不引新色/字体/大写/渐变/发光。
   ====================================================================== */

/* 卡：12px 圆角 + 细分区，标题带左竖条骨干 */
.vs-mr-page .vs-mr-card{ border-radius: 12px; border: 1px solid var(--line); }
.vs-mr-page .vs-panel-head{ display:flex; align-items:center; gap:8px; }
.vs-mr-page .vs-panel-head::before{ content:""; width:3px; height:14px; border-radius:2px; background:var(--accent); }
.vs-mr-page .vs-panel-head .vs-panel-label{ color:var(--text); font-size:13px; font-weight:600; }

/* 字段/输入：36px，hover=边转 accent，focus=accent 环 */
.vs-mr-page .vs-mr-control{ height:36px; border-radius:8px; }
.vs-mr-page .vs-mr-field > label{ color:var(--muted); }

/* 分区间距 + 段间分隔 */
.vs-mr-page .vs-mr-section{ padding:20px 24px 22px; }
.vs-mr-page .vs-mr-section + .vs-mr-section{ border-top:1px solid var(--line); }

/* ---------- 按钮体系：三态齐全，避免一排平按钮 ---------- */
.vs-mr-page .vs-mr-actions{ margin-top:10px; border-top:1px solid var(--line); padding-top:18px; }
.vs-mr-page .vs-mr-actions .btn{ height:36px; border-radius:8px; font-size:14px; padding:0 18px; }
.vs-mr-page .vs-mr-actions .btn:nth-last-child(1),
.vs-mr-page .vs-mr-actions .btn.primary{ box-shadow:0 1px 0 rgba(0,0,0,.06); }
.vs-mr-page .vs-mr-actions .btn:not(.secondary):hover{ background:var(--accent-hover); transform:translateY(-1px); }
.vs-mr-page .vs-mr-actions .btn.secondary:hover{ border-color:var(--accent); color:var(--accent); background:var(--accent-weak); }

/* 内置模拟器 assist 内的小按钮：压缩成紧凑行，启动为主 */
.vs-mr-page .vs-mr-avd-actions{ align-items:center; }
.vs-mr-page .vs-mr-avd-actions .btn{ height:32px; border-radius:6px; font-size:13px; padding:0 12px; }
.vs-mr-page .vs-mr-avd-actions .btn.secondary{ background:var(--bg-panel); }
.vs-mr-page .vs-mr-avd-actions .btn.secondary:hover{ border-color:var(--accent); color:var(--accent); }

/* 表格历史：表头 + 行 hover + 状态色 pill + 报告用幽灵按钮 */
.vs-mr-page .vs-mr-history-list{ border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.vs-mr-page .vs-mr-history-list table{ border-collapse:collapse; width:100%; }
.vs-mr-page .vs-mr-history-list thead th{ background:var(--bg); color:var(--muted); font-weight:600; font-size:12px; padding:10px 14px; border-bottom:1px solid var(--line-strong); }
.vs-mr-page .vs-mr-history-list tbody td{ padding:11px 14px; font-size:13px; border-bottom:1px solid var(--line); }
.vs-mr-page .vs-mr-history-list tbody tr:last-child td{ border-bottom:0; }
.vs-mr-page .vs-mr-history-list tbody tr:hover{ background:var(--accent-weak); }
.vs-mr-page .vs-mr-history-list .case-id{ font-family:var(--code-font); font-size:12px; color:var(--text); }
.vs-mr-page .vs-mr-history-list .time{ color:var(--muted); font-size:12px; }
.vs-mr-page .vs-mr-history-list .actions button{ border:1px solid var(--line-strong); background:var(--bg-panel); }
.vs-mr-page .vs-mr-history-list .actions button:hover{ border-color:var(--accent); color:var(--accent); background:var(--accent-weak); }

/* 状态徽章：彩色 pill(不靠 .badge 灰) */
.vs-mr-page .vs-stat-pill{ border-radius:999px; padding:2px 10px; font-size:12px; }
.vs-mr-page .vs-stat-pill[data-st="succeeded"], .vs-mr-page .vs-mr-pill-pass{ background:rgba(15,123,15,.10); color:var(--pass); }
.vs-mr-page .vs-stat-pill[data-st="failed"], .vs-mr-page .vs-mr-pill-fail{ background:rgba(224,62,62,.10); color:var(--fail); }
.vs-mr-page .vs-stat-pill[data-st="running"], .vs-mr-page .vs-mr-pill-warn{ background:rgba(180,83,9,.10); color:var(--warn); }
.vs-mr-page .vs-stat-pill[data-st="pending"], .vs-mr-page .vs-mr-pill-idle{ background:rgba(0,0,0,.05); color:var(--muted); }

/* 过渡(精致感) */
.vs-mr-page .vs-mr-control, .vs-mr-page .vs-mr-actions .btn, .vs-mr-page .vs-mr-actions .btn.secondary,
.vs-mr-page .vs-mr-avd-actions .btn, .vs-mr-page .vs-mr-history-list tbody tr, .vs-mr-page .vs-mr-history-list .actions button{
  transition: border-color .15s, color .15s, background .15s, box-shadow .15s, transform .15s;
}

/* 修正：历史表状态徽章——按 vsBadge 实际输出的 badge.<status> 上色(仅多端历史表内) */
.vs-mr-page .vs-mr-history-list .badge{ border-radius:999px; padding:2px 10px; font-size:12px; font-weight:600; }
.vs-mr-page .vs-mr-history-list .badge.succeeded{ background:rgba(15,123,15,.10); color:var(--pass); }
.vs-mr-page .vs-mr-history-list .badge.failed{ background:rgba(224,62,62,.10); color:var(--fail); }
.vs-mr-page .vs-mr-history-list .badge.running{ background:rgba(180,83,9,.10); color:var(--warn); }
.vs-mr-page .vs-mr-history-list .badge.pending{ background:rgba(0,0,0,.05); color:var(--muted); }
/* 2026-09-06 归因分离: 平台夹具/setup 失败 = 环境错误(琥珀色,区别于用例失败的红色) */
.badge.env_error{ background:rgba(180,83,9,.10); color:var(--warn); border-color:transparent; }

/* ============================================================
   多端运行页 · 铺满 + 层级质感(2026-08-21)
   让 Android/iOS/HarmonyOS/桌面 四端页填满内容区：
   主配置(左,自适应铺开) + 运行历史(右,粘性侧栏)。
   只用既有令牌；字号 L3 13/L4 12；不引入新色/新字体。
   ============================================================ */

/* 铺满 + 双栏（主配置 + 历史侧栏） */
.vs-mr-page .vs-mr-body {
  max-width: none;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 344px;
  gap: 18px;
  align-items: start;
}
.vs-mr-page .vs-mr-card { min-width: 0; }
.vs-mr-page .vs-mr-card.vs-mr-history {
  position: sticky;
  top: 12px;
  padding: 18px 20px;
}

/* 主配置卡：更稳的容器 */
.vs-mr-page .vs-mr-card {
  padding: 24px 26px;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0 10px 26px -22px rgba(16, 24, 40, 0.35);
}
.vs-mr-page .vs-mr-card.vs-mr-history {
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
}

/* 连接与启动：字段在三列间自适应铺开 */
.vs-mr-page .vs-mr-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

/* 页头：设备识别条 */
.vs-mr-page .vs-page-header {
  margin-bottom: 0.85rem;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}
.vs-mr-page .vs-page-header h2 { margin-bottom: 0.2rem; }
.vs-mr-page .vs-stat-pill {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-text);
  padding: 3px 10px;
  border-radius: 999px;
}

/* 运行目标 hero 略增高，指南感更足 */
.vs-mr-page .vs-mr-target select { height: 40px; }

/* 模拟器辅助框：虚线 → 次级层级 */
.vs-mr-page .vs-mr-assist { border-style: dashed; }

/* 动作区：主按钮更有力 */
.vs-mr-page .vs-mr-actions { gap: 10px; padding-top: 18px; margin-top: 8px; }
.vs-mr-page .vs-mr-actions .btn { min-height: 36px; padding: 0 20px; border-radius: 8px; }
.vs-mr-page .vs-mr-actions .btn[data-mr-run] { font-weight: 600; }

/* YAML 预览：代码面板感 */
.vs-mr-page .vs-mr-preview { border-radius: 8px; }

/* 窄屏回退：单栏堆叠 */
@media (max-width: 1080px) {
  .vs-mr-page .vs-mr-body { grid-template-columns: minmax(0, 1fr); }
  .vs-mr-page .vs-mr-card.vs-mr-history { position: static; }
}

/* ============================================================
   多端运行 · 设备工作台 (frontend-design 重设计 2026-08-21)
   signature: 每端专属色调 + 设备图腾 hero。仅用既有令牌 + 每端 accent。
   既有令牌面再加 --mrp（platform accent）。双主题自适配(color-mix)。
   ============================================================ */

/* 每端专属身份色 */
.vs-mr-workbench[data-platform="web"]     { --mrp: #6366f1; }
.vs-mr-workbench[data-platform="android"]  { --mrp: #22c55e; }
.vs-mr-workbench[data-platform="ios"]      { --mrp: #3b82f6; }
.vs-mr-workbench[data-platform="harmony"]  { --mrp: #14b8a6; }
.vs-mr-workbench[data-platform="desktop"]  { --mrp: #8b5cf6; }

/* 工作台：hero + 双栏 body 纵向堆叠 */
.vs-mr-workbench {
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 100%;
}

/* ---- hero（签名：设备图腾 + 平台色）---- */
.vs-mr-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 6px 2px 18px;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}
.vs-mr-hero-sigil {
  flex-shrink: 0;
  width: 54px; height: 54px;
  display: grid; place-items: center;
  border-radius: 15px;
  color: var(--mrp);
  background: linear-gradient(135deg, color-mix(in srgb, var(--mrp) 22%, var(--bg-panel)), var(--bg-panel));
  border: 1px solid color-mix(in srgb, var(--mrp) 38%, transparent);
  box-shadow: 0 6px 16px -10px color-mix(in srgb, var(--mrp) 70%, transparent);
}
.vs-mr-hero-sigil svg { width: 28px; height: 28px; }
.vs-mr-hero-meta { min-width: 0; flex: 1 1 260px; }
.vs-mr-hero-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.vs-mr-hero h2 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
  border: 0; padding: 0; margin: 0;
  letter-spacing: 0;
}
.vs-mr-hero-sub-label { font-size: 0.8rem; font-weight: 400; color: var(--muted); margin-left: 4px; }
.vs-mr-hero-pill {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  padding: 2px 9px;
  border-radius: 999px;
  color: var(--mrp);
  background: color-mix(in srgb, var(--mrp) 14%, var(--bg-panel));
  border: 1px solid color-mix(in srgb, var(--mrp) 32%, transparent);
}
.vs-mr-hero-sub { margin: 5px 0 0; font-size: 0.83rem; color: var(--muted); }
.vs-mr-hero-actions { margin-left: auto; }

/* ---- body 双栏：主配置 + 历史侧栏(加宽到 560px) ---- */
.vs-mr-workbench .vs-mr-body {
  max-width: none;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 560px;
  gap: 18px;
  align-items: start;
}

/* ---- 主配置卡：平台色节标题 + 统一容器 ---- */
.vs-mr-workbench .vs-mr-card {
  min-width: 0;
  padding: 24px 26px;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0 10px 26px -22px rgba(16, 24, 40, 0.35);
}
.vs-mr-workbench .vs-mr-card.vs-mr-history {
  position: sticky; top: 12px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
  max-height: calc(100vh - 140px);
  overflow: auto;
}

/* 历史卡头部：标题 + 次数 */
.vs-mr-workbench .vs-mr-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.vs-mr-workbench .vs-mr-history-count {
  font-size: 11px;
  padding: 2px 10px;
}

/* 历史表格：用例两行(标题 + 时间副行) */
/* 用例 ID 单行省略:折行会让每行高度参差 */
.vsmr-cell-id { display: block; font-family: var(--code-font); font-size: 12px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vsmr-cell-time { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }
.vs-mr-workbench .vs-panel-label {
  position: relative;
  padding-left: 10px;
}
.vs-mr-workbench .vs-panel-label::before {
  content: "";
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 3px; height: 12px; border-radius: 2px;
  background: var(--mrp);
}

/* ---- 动作：主「运行」用平台色 ---- */
.vs-mr-workbench .vs-mr-actions { gap: 10px; padding-top: 18px; margin-top: 8px; }
.vs-mr-workbench .vs-mr-actions .btn { min-height: 36px; padding: 0 20px; border-radius: 8px; }
.vs-mr-workbench .vs-mr-actions .btn[data-mr-run] {
  font-weight: 600;
  background: var(--mrp);
  border-color: var(--mrp);
  color: #fff;
}

/* ---- 窄屏：单栏堆叠 ---- */
@media (max-width: 1080px) {
  .vs-mr-workbench .vs-mr-body { grid-template-columns: minmax(0, 1fr); }
  .vs-mr-workbench .vs-mr-card.vs-mr-history { position: static; max-height: none; }
}

/* ============================================================
   设备工作台 · 精致化 (frontend-design pass 2)
   只调质感：平台氛围wash/图腾/呼吸点/输入&按钮对焦/按钮光泽。
   ============================================================ */

/* 每页极淡平台色氛围 wash（衬在内容后） */
.vs-mr-workbench { position: relative; z-index: 0; }
.vs-mr-workbench::before {
  content: "";
  position: absolute; inset: -2px 0 0 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(620px 260px at 10% -8%, color-mix(in srgb, var(--mrp) 16%, transparent), transparent 70%),
    radial-gradient(720px 320px at 94% 114%, color-mix(in srgb, var(--mrp) 9%, transparent), transparent 72%);
}
.vs-mr-workbench > * { position: relative; z-index: 1; }

/* 图腾：双层渐变 + 平台色描边 + 柔和投影 */
.vs-mr-hero-sigil {
  background:
    radial-gradient(130% 130% at 22% 10%, color-mix(in srgb, var(--mrp) 42%, transparent), transparent 55%),
    linear-gradient(160deg, color-mix(in srgb, var(--mrp) 30%, var(--bg-panel)), var(--bg-panel) 66%);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--mrp) 30%, transparent),
    0 9px 22px -12px color-mix(in srgb, var(--mrp) 70%, transparent);
}
.vs-mr-hero-sigil svg { transition: transform .2s cubic-bezier(.2,.8,.2,1); }
.vs-mr-hero:hover .vs-mr-hero-sigil svg { transform: translateY(-1px) scale(1.05); }

/* 连接状态点：在线=呼吸光泽 */
@keyframes vsmrPulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pass) 45%, transparent); }
  55%      { box-shadow: 0 0 0 5px color-mix(in srgb, var(--pass) 0%, transparent); }
}
.vs-mr-dot.pass { animation: vsmrPulse 2.2s ease-in-out infinite; }
.vs-mr-dot.warn { box-shadow: 0 0 0 3px color-mix(in srgb, var(--warn) 22%, transparent); }
.vs-mr-dot.fail { box-shadow: 0 0 0 3px color-mix(in srgb, var(--fail) 26%, transparent); }

/* 输入 & 下拉：圆角、平台色对焦/悬停 */
.vs-mr-workbench .vs-mr-field .vs-mr-control {
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-panel) 55%, var(--bg));
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.vs-mr-workbench .vs-mr-field .vs-mr-control:hover { border-color: color-mix(in srgb, var(--mrp) 55%, var(--line-strong)); }
.vs-mr-workbench .vs-mr-field .vs-mr-control:focus {
  border-color: var(--mrp);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mrp) 16%, transparent);
}

/* 运行目标（hero 下拉）强调平台色 */
.vs-mr-workbench .vs-mr-target select {
  border-color: color-mix(in srgb, var(--mrp) 46%, var(--line-strong));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--mrp) 12%, transparent);
}
.vs-mr-workbench .vs-mr-target select:focus {
  border-color: var(--mrp);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mrp) 16%, transparent);
}

/* 主「运行」按钮：平台色光泽 + 悬停提亮 */
.vs-mr-workbench .vs-mr-actions .btn[data-mr-run] {
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--mrp) 90%, #fff 10%), var(--mrp));
  box-shadow: 0 7px 18px -9px color-mix(in srgb, var(--mrp) 75%, transparent);
  transition: filter .15s, box-shadow .15s, transform .12s;
}
.vs-mr-workbench .vs-mr-actions .btn[data-mr-run]:hover { filter: brightness(1.07); box-shadow: 0 9px 22px -9px color-mix(in srgb, var(--mrp) 85%, transparent); }
.vs-mr-workbench .vs-mr-actions .btn[data-mr-run]:active { transform: translateY(1px); }

/* 历史侧栏 & 辅助框：更通透的平台tint */
.vs-mr-workbench .vs-mr-card.vs-mr-history { background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg)); }
.vs-mr-workbench .vs-mr-assist { background: color-mix(in srgb, var(--mrp) 6%, var(--bg)); }

/* 平台 pill 细调 */
.vs-mr-hero-pill { font-weight: 600; }

/* ══════════════════════════════════════════════════════════════════
   设备农场 (.vs-farm-*) — 2026-08-23
   亮色商务分栏风 / 白底卡片 / 1px 边框 / 10px 圆角 / 无阴影
   ══════════════════════════════════════════════════════════════════ */

.vs-farm { display: flex; gap: 16px; min-height: calc(100vh - 180px); }

/* 左侧设备列表 */
.vs-farm-sidebar {
  width: 240px; flex-shrink: 0;
  background: var(--bg-panel);
  border: 1px solid var(--line); border-radius: 10px;
  padding: 16px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 10px;
}
.vs-farm-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 20px; padding: 0 6px;
  background: var(--accent-weak, rgba(35,131,226,0.08));
  color: var(--accent); font-size: 12px; font-weight: 600; border-radius: 10px;
}
.vs-farm-device-list { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.vs-farm-device-card {
  display: flex; align-items: center; gap: 10px;
  width: 100%; padding: 10px 12px;
  background: var(--bg-panel); border: 1px solid var(--line); border-radius: 10px;
  cursor: pointer; transition: border-color 0.15s;
}
.vs-farm-device-card:hover,
.vs-farm-device-card.active { border-color: var(--accent); background: var(--accent-weak, rgba(35,131,226,0.04)); }
.vs-farm-device-sigil { width: 28px; height: 28px; color: var(--muted); flex-shrink: 0; }
.vs-farm-device-sigil svg { width: 100%; height: 100%; }
.vs-farm-device-meta { display: flex; flex-direction: column; min-width: 0; }
.vs-farm-device-model { font-size: 13px; font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vs-farm-device-sub { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vs-farm-device-trailing { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }

/* ═══ 设备独占锁 (2026-09-08) ═══ */
.vs-farm-lock-badge {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 10px; font-weight: 600;
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid;
  white-space: nowrap;
  cursor: help;
}
.vs-farm-lock-badge.automation { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
.vs-farm-lock-badge.manual     { background: color-mix(in srgb, var(--warn) 14%, transparent);   color: var(--warn);   border-color: color-mix(in srgb, var(--warn)   34%, transparent); }
.vs-farm-lock-badge.schedule   { background: color-mix(in srgb, var(--ok) 12%, transparent);      color: var(--ok);     border-color: color-mix(in srgb, var(--ok)     30%, transparent); }

.vs-farm-lock-banner {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px;
  margin-bottom: 10px;
  border-radius: 10px;
  font-size: 12.5px;
}
.vs-farm-lock-banner.free { background: color-mix(in srgb, var(--ok) 8%, transparent); color: var(--ok); }
.vs-farm-lock-banner.mine { background: color-mix(in srgb, var(--warn) 10%, transparent); color: var(--warn); }
.vs-farm-lock-banner.busy { background: color-mix(in srgb, var(--fail) 10%, transparent); color: var(--fail); }
.vs-farm-lock-banner .btn { margin-left: auto; }
.vs-farm-note-muted { color: var(--muted); font-size: 13px; line-height: 1.6; text-align: center; margin-top: 1rem; }
.vs-farm-note-err { color: var(--fail); font-size: 13px; }

/* 右侧详情区 */
.vs-farm-detail { flex: 1; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.vs-farm-card {
  background: var(--bg-panel);
  border: 1px solid var(--line); border-radius: 10px;
  padding: 16px;
}

/* 实时画面 */
.vs-farm-screen-card { padding-bottom: 12px; }
.vs-farm-screen-meta { display: flex; gap: 12px; align-items: center; font-size: 12px; color: var(--muted); }
.vs-farm-stream-state { color: var(--accent); font-weight: 600; }
.vs-farm-screen-wrap {
  display: flex; justify-content: center; align-items: center;
  background: var(--bg); border: 1px solid var(--line); border-radius: 8px;
  min-height: 200px; overflow: hidden; margin-top: 8px;
}
.vs-farm-screen {
  max-width: 100%; max-height: 560px;
  object-fit: contain; display: block;
  image-rendering: -webkit-optimize-contrast;
}

/* 生成测试表单 */
.vs-farm-gen-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.vs-farm-field { display: flex; flex-direction: column; gap: 4px; }
.vs-farm-field label { font-size: 12px; color: var(--muted); }
.vs-farm-control {
  height: 36px; padding: 0 10px; font-size: 13px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-panel); color: var(--text); outline: none;
  transition: border-color 0.15s;
}
.vs-farm-control:focus { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-weak, rgba(35,131,226,0.08)); }
.vs-farm-control option { background: var(--bg-panel); color: var(--text); }
.vs-farm-mono { font-family: var(--code-font, "SF Mono", "Fira Code", monospace); font-size: 12px; }
textarea.vs-farm-control { height: auto; padding: 10px; resize: vertical; min-height: 36px; }
.vs-farm-gen-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.vs-farm-note { font-size: 12px; color: var(--muted); margin-top: 8px; min-height: 18px; }

/* YAML 预览 */
.vs-farm-yaml {
  width: 100%; min-height: 260px; margin-top: 8px;
  font-family: var(--code-font, "SF Mono", "Fira Code", monospace); font-size: 12px;
  padding: 12px; border: 1px solid var(--line); border-radius: 6px;
  background: color-mix(in srgb, var(--bg-panel) 96%, var(--bg));
  color: var(--text); resize: vertical; outline: none;
}
.vs-farm-yaml:focus { border-color: var(--accent); }

/* ═══ 用例中心:筛选条 + 平台徽标 — 2026-08-23 ═══ */
.vs-case-filter { display: flex; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.vs-case-filter-select {
  height: 28px; font-size: 12px; padding: 0 6px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-panel); color: var(--text); outline: none;
}
.vs-case-filter-search {
  flex: 1; height: 28px; font-size: 12px; padding: 0 8px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-panel); color: var(--text); outline: none;
}
.vs-case-filter-search:focus, .vs-case-filter-select:focus { border-color: var(--accent); }
.vs-plat-badge {
  display: inline-flex; align-items: center; justify-content: center;
  height: 18px; padding: 0 6px; margin-right: 6px;
  font-size: 11px; font-weight: 600; letter-spacing: 0;
  border-radius: 3px; vertical-align: middle;
}
.vs-badge-android { background: rgba(61,148,88,0.12); color: #2E7D4F; }
.vs-badge-ios { background: rgba(80,90,100,0.12); color: #4A5568; }
.vs-badge-harmony { background: rgba(200,80,40,0.10); color: #C05020; }
.vs-badge-web { background: rgba(35,131,226,0.10); color: #1E6FCC; }
.vs-badge-desktop { background: rgba(120,80,200,0.10); color: #7050C8; }
.vsw-plat-tag {
  font-size: 11px; font-weight: 700; letter-spacing: 0.5px;
  color: var(--accent); background: var(--accent-weak, rgba(35,131,226,0.08));
  padding: 3px 8px; border-radius: 4px;
}

/* ═══ 新建用例向导 (.vsw-*) — 2026-08-23 ═══ */
.vsw-overlay {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0,0,0,0.4);
  display: flex; align-items: center; justify-content: center;
}
.vsw-modal {
  width: min(640px, 92vw); max-height: 86vh;
  background: var(--bg-panel); border: 1px solid var(--line); border-radius: 10px;
  display: flex; flex-direction: column; overflow: hidden;
}
.vsw-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-bottom: 1px solid var(--line);
}
.vsw-head h3 { margin: 0; font-size: 16px; }
.vsw-steps {
  display: flex; align-items: center; gap: 6px;
  padding: 10px 20px; border-bottom: 1px solid var(--line);
  font-size: 12px; color: var(--muted);
}
.vsw-step.active { color: var(--accent); font-weight: 600; }
.vsw-step-sep { flex: 1; height: 1px; background: var(--line); }
.vsw-body { flex: 1; overflow-y: auto; padding: 20px; }
.vsw-foot {
  display: flex; justify-content: flex-end; gap: 8px;
  padding: 12px 20px; border-top: 1px solid var(--line);
}
.vsw-hint { font-size: 13px; color: var(--muted); margin: 0 0 14px; }
.vsw-loading, .vsw-err { text-align: center; padding: 40px 0; color: var(--muted); font-size: 14px; }
.vsw-err { color: var(--fail); }
/* 2026-09-09: 第 1 步底部“跳过向导直接编写”链接 —— 用户能在向导里直接走人工编写路线 */
.vsw-manual-link { text-align: center; margin: 16px 0 0; }
.vsw-manual-link a {
  color: var(--accent); text-decoration: none; font-size: 13px;
  border-bottom: 1px dashed var(--accent); padding-bottom: 1px;
}
.vsw-manual-link a:hover { color: var(--accent-strong, var(--accent)); border-bottom-style: solid; }

.vsw-platform-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
/* 2026-09-09: 5 张卡(4 平台 + 1 手动)改 3 列布局: 第 5 张跨两行放在右侧 */
.vsw-platform-grid-3 { grid-template-columns: 1fr 1fr 1fr; }
.vsw-platform-card {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 18px 12px; cursor: pointer;
  background: var(--bg-panel); border: 1px solid var(--line); border-radius: 10px;
  transition: border-color 0.15s;
}
.vsw-platform-card:hover, .vsw-platform-card.active { border-color: var(--accent); background: var(--accent-weak, rgba(35,131,226,0.04)); }
.vsw-platform-icon { font-size: 28px; }
.vsw-platform-name { font-size: 14px; font-weight: 600; color: var(--text); }
.vsw-platform-desc { font-size: 11px; color: var(--muted); }

/* 「手动编写 YAML」卡: 跨两行, 用实线主色边框与平台卡虚线感区分, 一眼是"快捷模式" */
.vsw-platform-card-manual {
  grid-column: 3;
  grid-row: 1 / span 2;
  justify-content: center;
  border: 1.5px dashed var(--accent);
  background: linear-gradient(180deg, rgba(35,131,226,0.04), transparent 60%);
}
.vsw-platform-card-manual:hover { background: var(--accent-weak, rgba(35,131,226,0.10)); border-style: solid; }

.vsw-field { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.vsw-field label { font-size: 12px; color: var(--muted); }
.vsw-control {
  height: 36px; padding: 0 10px; font-size: 13px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-panel); color: var(--text); outline: none;
}
.vsw-control:focus { border-color: var(--accent); }
.vsw-mono { font-family: var(--code-font, monospace); font-size: 12px; }
select.vsw-control { height: 36px; }

.vsw-domain-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.vsw-domain-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: 14px 12px; cursor: pointer; text-align: left;
  background: var(--bg-panel); border: 1px solid var(--line); border-radius: 10px;
}
.vsw-domain-card:hover, .vsw-domain-card.active { border-color: var(--accent); }
.vsw-domain-name { font-size: 14px; font-weight: 600; }
.vsw-domain-desc { font-size: 11px; color: var(--muted); }

.vsw-yaml {
  width: 100%; min-height: 320px; font-family: var(--code-font, monospace); font-size: 12px;
  padding: 12px; border: 1px solid var(--line); border-radius: 6px;
  background: color-mix(in srgb, var(--bg-panel) 96%, var(--bg));
  color: var(--text); resize: vertical; outline: none;
}
.vsw-yaml:focus { border-color: var(--accent); }

/* ═══ 用例库运行:设备/App 下拉 — 2026-08-23 ═══ */
#vs-run-device-select, #vs-run-app-select {
  height: 30px; min-width: 160px; max-width: 220px;
  font-size: 12px; padding: 0 6px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-panel); color: var(--text); outline: none;
}
#vs-run-device-select:focus, #vs-run-app-select:focus { border-color: var(--accent); }
.vs-field-hint { font-style: normal; font-size: 11px; color: var(--hint); margin-left: 4px; font-weight: 400; }

/* ═══ 运行面板实时画面 — 2026-08-23 ═══ */
.vs-run-screen {
  flex-shrink: 0;
  border: 1px solid var(--line); border-radius: 8px;
  margin: 8px 12px 4px; overflow: hidden;
}
.vs-run-screen-head {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 12px; font-size: 12px;
  background: color-mix(in srgb, var(--bg-panel) 90%, var(--bg));
  border-bottom: 1px solid var(--line);
}
.vs-run-screen-label { font-weight: 600; color: var(--text); }
.vs-run-screen-device { color: var(--muted); font-family: var(--code-font, monospace); }
.vs-run-screen-state { color: var(--accent); font-weight: 600; margin-left: auto; }
.vs-run-screen-wrap {
  display: flex; justify-content: center; align-items: center;
  background: var(--bg); min-height: 120px; max-height: 240px;
}
.vs-run-screen-img {
  max-width: 100%; max-height: 240px; object-fit: contain;
  display: block; image-rendering: -webkit-optimize-contrast;
}

/* ═══ 实时画面放大按钮 + 大图 modal ═══ */
.vs-run-screen-wrap { position: relative; }
.vs-run-screen-zoom {
  position: absolute; top: 8px; right: 8px;
  width: 28px; height: 28px; border: none; border-radius: 6px;
  background: rgba(0,0,0,0.55); color: #fff; font-size: 14px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  opacity: 0.7; transition: opacity 0.15s;
}
.vs-run-screen-zoom:hover { opacity: 1; }
.vs-run-screen-modal {
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(0,0,0,0.6);
  display: flex; align-items: center; justify-content: center;
}
.vs-run-screen-modal-box {
  background: var(--bg-panel); border: 1px solid var(--line); border-radius: 10px;
  max-width: 92vw; max-height: 90vh; display: flex; flex-direction: column; overflow: hidden;
}
.vs-run-screen-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 16px; border-bottom: 1px solid var(--line); font-size: 14px; font-weight: 600;
}
.vs-run-screen-modal-img {
  max-width: 92vw; max-height: calc(90vh - 50px); object-fit: contain; display: block;
}

/* ═══════ 运行配置区重构 (.vs-run-config) — 2026-08-23 ═══════ */
.vs-editor-footer {
  border-top: 1px solid var(--line);
  background: var(--bg-panel);
  padding: 18px 20px 20px;
  display: block;
}
.vs-run-config {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}
.vs-run-config-section {
  border: 1px solid var(--line); border-radius: 10px;
  padding: 16px 18px;
}
.vs-run-config-title {
  font-size: 12px; font-weight: 600; color: var(--muted);
  margin-bottom: 14px; padding-bottom: 8px; border-bottom: 1px solid var(--line);
}
.vs-run-config-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.vs-run-config-checks { align-content: start; }
.vs-run-config-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.vs-run-config-field label {
  font-size: 12px; color: var(--muted);
  white-space: normal; line-height: 1.35; word-break: break-word;
}
.vs-run-config-field input[type="text"],
.vs-run-config-field input[type="number"],
.vs-run-config-field select {
  height: 46px; width: 100%; padding: 0 14px; font-size: 15px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg-panel); color: var(--text); outline: none;
  box-sizing: border-box; transition: border-color 0.15s;
}
.vs-run-config-field input:focus, .vs-run-config-field select:focus { border-color: var(--accent); }
.vs-run-config-field input::placeholder { color: var(--hint); }
.vs-run-config-compact { justify-content: flex-start; }
.vs-run-check { box-sizing: border-box; }
.vs-run-check, .vs-run-config-field { height: 46px; }
.vs-run-config-field { justify-content: flex-end; }
.vs-run-check {
  display: flex; align-items: center; gap: 8px;
  height: 46px; padding: 0 14px;
  font-size: 15px; color: var(--text); cursor: pointer;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg-panel); transition: border-color 0.15s, background 0.15s;
  white-space: nowrap;
}
.vs-run-check:hover { border-color: var(--accent); }
.vs-run-check input { accent-color: var(--accent); width: 18px; height: 18px; }
.vs-run-config-field input[type="number"] { text-align: center; font-weight: 600; }
.vs-run-config-field select { cursor: pointer; }
.vs-run-check span { flex: 1; }
.vs-run-config-actions {
  /* 2026-09-11: 整条用例的全局操作条 —— 已移出 .vs-run-config 容器,
     独立于三张配置卡(运行目标/执行选项/AI 自愈)之外,右对齐 + 虚线分隔 */
  display: flex; align-items: center; justify-content: flex-end; gap: 8px;
  margin-top: 8px; padding: 12px 4px 0;
  border-top: 1px dashed var(--line);
}
.vs-run-config-actions .btn { height: 40px; padding: 0 22px; font-size: 15px; }
.vs-field-hint { font-style: normal; font-size: 11px; color: var(--hint); font-weight: 400; }

/* ═══ 问号悬浮注释 tooltip (.vs-tip) ═══ */
.vs-tip {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  margin-left: 4px; vertical-align: middle; line-height: 0;
  color: var(--hint); cursor: help; transition: color 0.15s;
}
.vs-tip svg { width: 13px; height: 13px; }
.vs-tip:hover, .vs-tip:focus { color: var(--accent); }
.vs-tip::after {
  content: attr(data-tip);
  position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%);
  width: max-content; max-width: 240px;
  background: var(--text); color: var(--bg-panel);
  padding: 7px 10px; border-radius: 6px; font-size: 12px; font-weight: 400; line-height: 1.5;
  white-space: normal; opacity: 0; visibility: hidden;
  transition: opacity 0.15s, visibility 0.15s; z-index: 30;
  pointer-events: none; box-shadow: 0 2px 10px rgba(0,0,0,0.15);
}
.vs-tip:hover::after, .vs-tip:focus::after { opacity: 1; visibility: visible; }
.vs-run-config-title .vs-tip::after { bottom: auto; top: calc(100% + 8px); }

/* ═══ 运行页签(2026-09-06): 并发运行一键互切 ═══ */
.vs-run-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 8px 14px 0;
  border-bottom: 1px dashed var(--line);
}

.vs-run-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 240px;
  padding: 5px 12px;
  font-size: 12.5px;
  color: var(--muted);
  background: transparent;
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.12s, background 0.12s, border-color 0.12s;
}

.vs-run-tab:hover { color: var(--text); background: color-mix(in srgb, var(--accent) 6%, transparent); }

.vs-run-tab.active {
  color: var(--text);
  font-weight: 600;
  background: var(--bg-panel);
  border-color: var(--line);
}

.vs-run-tab-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--hint);
  flex: none;
}

.vs-run-tab-dot.live {
  background: var(--ok, #22a06b);
  animation: vs-run-tab-pulse 1.6s ease-in-out infinite;
}

@keyframes vs-run-tab-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}

/* ═══ 收起日志后的恢复条 ═══ */
.vs-log-reopen {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 14px; margin-bottom: 8px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg-panel);
}
.vs-log-reopen-info { font-size: 13px; color: var(--muted); }

/* ── 需求转用例 重设计(2026-08-23) ────────────────── */
/* 首页 drop-zone */
.vs-req-dropzone {
  border: 1px dashed var(--border);
  border-radius: 6px;
  background: var(--surface);
  padding: 1.4rem 1.2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.vs-req-dropzone:hover,
.vs-req-dropzone:focus-visible,
.vs-req-dropzone.drag-over {
  border-color: var(--accent, var(--accent));
  background: rgba(35, 131, 226, 0.05);
  outline: none;
}
.vs-req-dropzone-main {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}
.vs-req-dropzone-ico {
  color: var(--accent, var(--accent));
  margin-bottom: 0.3rem;
}
.vs-req-dropzone-title {
  font-size: 0.98rem;
  font-weight: 600;
}
.vs-req-dropzone-sub {
  font-size: 0.75rem;
  color: var(--muted);
  font-family: var(--font-mono, monospace);
}
.vs-req-dropzone-actions {
  display: flex;
  gap: 0.5rem;
  flex-shrink: 0;
}
.vs-req-drop-hint {
  font-size: 0.75rem;
  color: var(--muted);
  margin: 0;
}

/* 详情: 4 段流水线状态条 */
.vs-req-pipeline {
  display: flex;
  align-items: stretch;
  gap: 0.25rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  padding: 0.5rem 0.6rem;
}
.vs-req-pipe-stage {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.4rem 0.55rem;
  border-radius: 4px;
  border: 1px solid transparent;
  cursor: pointer;
  min-width: 0;
}
.vs-req-pipe-stage:hover {
  background: rgba(107, 114, 128, 0.08);
}
.vs-req-pipe-ico {
  width: 1.1em;
  text-align: center;
  font-size: 0.9rem;
  flex-shrink: 0;
}
.vs-req-pipe-stage.idle .vs-req-pipe-ico { color: var(--muted); }
.vs-req-pipe-stage.active .vs-req-pipe-ico { color: var(--accent, var(--accent)); }
.vs-req-pipe-stage.done .vs-req-pipe-ico { color: var(--success); }
.vs-req-pipe-stage.idle { color: var(--muted); }
.vs-req-pipe-stage.active { color: var(--text); }
.vs-req-pipe-stage.done { color: var(--text); }
.vs-req-pipe-stage.active { background: rgba(35, 131, 226, 0.07); }
.vs-req-pipe-stage.done { background: rgba(15, 123, 15, 0.06); }
.vs-req-pipe-name {
  font-weight: 600;
  font-size: 0.84rem;
  white-space: nowrap;
}
.vs-req-pipe-sub {
  font-size: 0.72rem;
  color: var(--muted);
  font-family: var(--font-mono, monospace);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.vs-req-pipe-arrow {
  color: var(--muted);
  align-self: center;
  flex-shrink: 0;
  font-size: 0.8rem;
}

/* 流水线"没到不能点" + 转换中进行时置灰 */
.vs-req-pipe-stage.disabled { cursor: not-allowed; opacity: 0.45; pointer-events: none; }
.vs-req-pipe-stage.disabled .vs-req-pipe-name { font-weight: 500; }
.vs-req-toolbar2 .btn:disabled { opacity: 0.45; cursor: not-allowed; }

/* 解析进行中(2026-09-05): 呼吸点 + 文档条状态 */
.vs-req-pipe-stage.parsing { flex: 1.7; }
.vs-req-pipe-stage.parsing .vs-req-pipe-ico {
  color: var(--accent);
  animation: vsReqParsePulse 1.2s ease-in-out infinite;
}
@keyframes vsReqParsePulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.8); }
}
.vs-doc-chip-status {
  font-size: 0.7rem;
  padding: 0.05rem 0.4rem;
  border-radius: 999px;
  white-space: nowrap;
  flex-shrink: 0;
}
.vs-doc-chip-status.parsing {
  color: var(--accent);
  background: rgba(35, 131, 226, 0.1);
  animation: vsReqParsePulse 1.2s ease-in-out infinite;
}
.vs-doc-chip-status.failed {
  color: var(--danger, #c62828);
  background: rgba(198, 40, 40, 0.1);
}
.vs-doc-chip-status.ok {
  color: var(--success);
  background: rgba(15, 123, 15, 0.08);
}

/* 文档预览:页面视图(PDF 逐页渲染,含截图)/ 原文 切换 */
.vs-doc-tabs {
  display: flex;
  gap: 0.35rem;
  flex-shrink: 0;
}
.vs-doc-tab {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--muted);
  border-radius: 6px;
  padding: 0.25rem 0.75rem;
  font-size: 0.78rem;
  cursor: pointer;
}
.vs-doc-tab:hover { color: var(--text); }
.vs-doc-tab.active {
  color: var(--accent);
  border-color: var(--accent);
  background: rgba(35, 131, 226, 0.08);
  font-weight: 600;
}
.vs-doc-pages {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  overflow: auto;
  max-height: 70vh;
  padding: 2px;
}
.vs-doc-page {
  margin: 0;
  position: relative;
}
.vs-doc-page img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
}
.vs-doc-page figcaption {
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  font-size: 0.68rem;
  font-family: var(--font-mono, monospace);
  color: var(--muted);
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.05rem 0.5rem;
}
.vs-doc-pages-note {
  margin: 0;
  font-size: 0.75rem;
  color: var(--muted);
  text-align: center;
}
.vs-doc-text {
  overflow: auto;
  max-height: 70vh;
}

/* 被测环境配置条 */
.vs-req-envbar {
  display: flex; align-items: center; gap: 8px;
  flex-wrap: wrap; padding: 6px 10px;
  border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface); margin: 6px 0 2px;
}
.vs-req-env-label { font-size: 12px; font-weight: 600; color: var(--muted); white-space: nowrap; }
.vs-req-env-input {
  flex: 1; min-width: 240px;
  padding: 5px 8px; font-size: 12px;
  background: #fff; border: 1px solid #D4D4D1; border-radius: 5px; color: #1A1A1A;
}
.vs-req-env-input:focus { border-color: #2383E2; box-shadow: 0 0 0 2px rgba(35,131,226,.12); outline: none; }
.vs-req-env-input.vs-req-env-platform { flex: 0 1 260px; min-width: 180px; }
.vs-req-env-input.vs-req-env-acct { flex: 0 1 200px; min-width: 140px; }
.vs-req-env-status { font-size: 12px; white-space: nowrap; }

/* 批量工具栏 + 筛选 */
.vs-req-toolbar2 {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  padding: 0.4rem 0.2rem;
}
.vs-req-batch-all {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.82rem;
  color: var(--text);
  cursor: pointer;
}
.vs-req-batch-all input { cursor: pointer; }
.vs-req-toolbar-spacer { flex: 1; }
.vs-req-filter-chips {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}
.vs-req-chip {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--muted);
  border-radius: 999px;
  padding: 0.15rem 0.6rem;
  font-size: 0.75rem;
  cursor: pointer;
  font-family: var(--font-mono, monospace);
}
.vs-req-chip:hover { color: var(--text); border-color: var(--accent, var(--accent)); }
.vs-req-chip.active {
  background: var(--accent, var(--accent));
  border-color: var(--accent, var(--accent));
  color: #fff;
}
.vs-req-search {
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.3rem 0.55rem;
  border-radius: 4px;
  font-size: 0.82rem;
  width: 160px;
}
.vs-req-search:focus {
  outline: none;
  border-color: var(--accent, var(--accent));
}

/* 平铺用例行 */
.vs-req-case-row2 {
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  margin-bottom: 0.4rem;
  cursor: pointer;
  overflow: hidden;
}
.vs-req-case-row2:hover { border-color: var(--accent, var(--accent)); }
.vs-req-case-row2.attn { border-left: 3px solid var(--warning); }
.vs-req-case-row2.failed { border-color: rgba(224, 62, 62, 0.5); background: rgba(224, 62, 62, 0.04); }
.vs-req-case-row2.open { border-color: var(--accent, var(--accent)); }
.vs-req-row2-main {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.45rem 0.7rem;
}
.vs-req-row2-main .vs-req-case-check { margin: 0; cursor: pointer; flex-shrink: 0; }
.vs-req-row2-main .vs-req-case-no { flex-shrink: 0; }
.vs-req-row2-main .vs-req-case-name { flex: 1; }
.vs-req-score {
  font-family: var(--font-mono, monospace);
  font-size: 0.75rem;
  color: var(--warning);
  flex-shrink: 0;
}
.vs-req-row2-toggle { color: var(--muted); flex-shrink: 0; }

/* 对话改用例 */
.vs-req-chatbar {
  display: flex;
  gap: 0.5rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  margin-top: 0.4rem;
}
.vs-req-chatbar input {
  flex: 1;
  border: 1px solid var(--border);
  background: var(--bg, var(--bg));
  color: var(--text);
  padding: 0.42rem 0.6rem;
  border-radius: 4px;
  font-size: 0.85rem;
}
.vs-req-chatbar input:focus { outline: none; border-color: var(--accent, var(--accent)); }

/* 覆盖度 / 对话弹层辅助 */
.vs-req-sugg-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.35rem 0;
  border-bottom: 1px dashed var(--border);
  font-size: 0.84rem;
}
.vs-req-sugg-row:last-child { border-bottom: none; }
.vs-req-chat-new {
  margin: 0;
  padding: 0.6rem;
  background: var(--bg, var(--bg));
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 0.78rem;
  max-height: 260px;
  overflow: auto;
  white-space: pre-wrap;
  color: var(--accent, var(--accent));
}

/* 历史用例库批量删除 */
.vs-req-home-suite-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.4rem 0.2rem 0.2rem;
}
.vs-req-home-suite-tools {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.vs-req-sel-count {
  font-size: 0.78rem;
  color: var(--accent, var(--accent));
  font-family: var(--font-mono, monospace);
}
.vs-req-suite-checkall {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.78rem;
  color: var(--text-secondary, inherit);
  cursor: pointer;
  user-select: none;
}
.vs-req-suite-checkall input {
  margin: 0;
  cursor: pointer;
}
.vs-req-suite-check {
  margin: 0;
  cursor: pointer;
  flex-shrink: 0;
}
.vs-req-suite.sel {
  border-color: var(--accent, var(--accent));
  background: rgba(35, 131, 226, 0.06);
}

/* ═══════ 多端工作台重构(.vs-mr-cols) — 2026-08-23 ═══════ */
.vs-mr-cols {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 16px;
  align-items: start;
}
.vs-mr-env .vs-mr-section { padding: 14px 2px 10px; }
.vs-mr-env .vs-mr-ready {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  margin-top: 8px;
}
.vs-mr-ops .vs-mr-section { padding: 12px 0 14px; }
.vs-mr-ops .vs-mr-section + .vs-mr-section { border-top: 1px solid var(--line); }

/* 分组标题 */
.vs-mr-sec-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 10px;
}
.vs-mr-sec-title {
  font-size: 13px; font-weight: 600; color: var(--text);
  padding-left: 8px; border-left: 3px solid var(--accent);
  line-height: 1.2;
}
.vs-mr-env .vs-mr-sec-head .vs-mr-ready { margin-top: 0; }

/* 操作步骤 textarea 放大 */
.vs-mr-steps {
  min-height: 96px; font-size: 13px; line-height: 1.6;
  resize: vertical;
}

/* 设备目标卡更清晰 */
.vs-mr-target {
  display: flex; align-items: flex-end; gap: 10px;
  margin: 6px 0 4px;
}
.vs-mr-target .vs-mr-field { flex: 1; min-width: 0; }
.vs-mr-target .vs-mr-field > label { font-weight: 600; color: var(--text); }
.vs-mr-target .vs-mr-hint { font-weight: 400; }
.vs-mr-target select {
  height: 40px; font-size: 14px; font-weight: 600;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-weak, rgba(35,131,226,0.08));
}

/* 端特有 assist 卡 */
.vs-mr-assist {
  margin-top: 12px; padding: 12px;
  border: 1px dashed var(--line-strong, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-panel) 92%, var(--bg));
}
.vs-mr-assist-title { font-size: 12px; color: var(--hint); margin-bottom: 10px; }

/* 运行按钮更突出 */
.vs-mr-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; }
.vs-mr-actions .btn { height: 38px; padding: 0 20px; font-size: 14px; }

/* 响应式: 窄屏单栏 */
@media (max-width: 1080px) {
  .vs-mr-cols { grid-template-columns: 1fr; }
}

/* ═══ 套件调度 · 左侧卡片列表(2026-09-03 重设计) ═══ */
.vss-suite-card {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--line, var(--border, #E5E7EB));
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background .15s;
  font: inherit;
}
.vss-suite-card:hover {
  border-color: var(--accent, #2383E2);
  box-shadow: 0 2px 10px rgba(35, 131, 226, 0.10);
}
.vss-suite-card.active {
  border-color: var(--accent, #2383E2);
  background: linear-gradient(180deg, rgba(35, 131, 226, 0.07), rgba(255, 255, 255, 0.9));
  box-shadow: inset 0 0 0 1px var(--accent, #2383E2);
}
.vss-suite-card-top {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.vss-suite-dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #9CA3AF;
}
.vss-suite-dot.run { background: var(--accent, #2383E2); animation: vss-dot-pulse 1.4s ease-in-out infinite; }
.vss-suite-dot.ok { background: var(--ok, #16A34A); }
.vss-suite-dot.bad { background: var(--danger, #E03E3E); }
.vss-suite-dot.off { background: #D1D5DB; }
@keyframes vss-dot-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(35, 131, 226, 0.35); }
  50% { box-shadow: 0 0 0 5px rgba(35, 131, 226, 0); }
}
.vss-suite-name {
  font-weight: 600;
  font-size: 0.86rem;
  color: var(--text, #1F2328);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.vss-suite-tag {
  flex: 0 0 auto;
  font-size: 0.66rem;
  padding: 1px 6px;
  border-radius: 99px;
  background: #F3F4F6;
  color: var(--muted, #6B7280);
  border: 1px solid var(--line, #E5E7EB);
}
.vss-suite-card-mid {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}
.vss-suite-id {
  font-size: 0.72rem;
  color: var(--muted, #6B7280);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.vss-suite-badge {
  flex: 0 0 auto;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 1px 8px;
  border-radius: 99px;
}
.vss-suite-badge.run { color: var(--accent, #2383E2); background: rgba(35, 131, 226, 0.10); }
.vss-suite-badge.ok { color: var(--ok, #16A34A); background: rgba(22, 163, 74, 0.10); }
.vss-suite-badge.bad { color: var(--danger, #E03E3E); background: rgba(224, 62, 62, 0.10); }
.vss-suite-badge.idle, .vss-suite-badge.off { color: var(--muted, #6B7280); background: #F3F4F6; }
.vss-suite-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.72rem;
  color: var(--muted, #6B7280);
}
.vss-suite-sched { color: var(--accent, #2383E2); font-weight: 600; }

/* ═══ UI测试库右侧「套件」窄面板 · 迷你卡片(2026-09-03) ═══ */
.vs-suite-mini {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 8px 10px;
  border: 1px solid var(--line, var(--border, #E5E7EB));
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  margin-bottom: 8px;
  transition: border-color .15s, box-shadow .15s;
}
.vs-suite-mini:hover {
  border-color: var(--accent, #2383E2);
  box-shadow: 0 2px 8px rgba(35, 131, 226, 0.10);
}
.vs-suite-mini-top {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.vs-suite-mini-name {
  flex: 1;
  font-weight: 600;
  font-size: 0.8rem;
  color: var(--text, #1F2328);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.vs-suite-mini-run {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 1px solid var(--accent, #2383E2);
  background: transparent;
  color: var(--accent, #2383E2);
  font-size: 0.6rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background .15s, color .15s;
}
.vs-suite-mini-run:hover { background: var(--accent, #2383E2); color: #fff; }
.vs-suite-mini-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.68rem;
  color: var(--muted, #6B7280);
  min-width: 0;
}
.vs-suite-mini-meta .mono {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}
.vs-suite-mini-state { flex: 0 0 auto; font-weight: 600; }
.vs-suite-mini-state.run { color: var(--accent, #2383E2); }
.vs-suite-mini-state.ok { color: var(--ok, #16A34A); }
.vs-suite-mini-state.bad { color: var(--danger, #E03E3E); }
/* 门禁检查按钮通栏 */
.vs-suite-actions .btn { width: 100%; }

/* ═══ 右侧 aside 面板头(标签 + 操作链接) ═══ */
.vs-aside-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 2px 2px 10px;
}
.vs-aside-panel-label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--muted, #8C93A0);
}
.vs-aside-panel-link {
  font-size: 0.74rem;
  font-weight: 500;
  color: var(--accent, #2383E2);
  text-decoration: none;
  padding: 3px 8px;
  border-radius: 6px;
  transition: background .15s;
  white-space: nowrap;
}
.vs-aside-panel-link:hover {
  background: rgba(35, 131, 226, 0.09);
  text-decoration: none;
}

/* ═══ UI测试库右侧「自愈」窄面板 · 紧凑卡片(2026-09-04) ═══ */
.vs-heal-mini {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 9px 10px;
  border: 1px solid var(--line, var(--border, #E5E7EB));
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  margin-bottom: 8px;
  transition: border-color .15s, box-shadow .15s;
}
.vs-heal-mini:hover {
  border-color: var(--danger, #E03E3E);
  box-shadow: 0 2px 8px rgba(224, 62, 62, 0.08);
}
.vs-heal-mini-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
  min-width: 0;
}
.vs-heal-mini-id {
  font-weight: 600;
  font-size: 0.76rem;
  color: var(--text, #1F2328);
  font-family: var(--font-mono, ui-monospace, monospace);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.vs-heal-mini-time {
  flex: 0 0 auto;
  font-size: 0.64rem;
  color: var(--muted, #8C93A0);
  white-space: nowrap;
}
.vs-heal-mini-actions {
  display: flex;
  gap: 6px;
}
.vs-heal-mini-actions .btn {
  flex: 1;
  font-size: 0.7rem;
  padding: 3px 6px;
  height: auto;
  line-height: 1.4;
  white-space: nowrap;
}
.vs-heal-mini-actions .vs-heal-mini-ai {
  background: var(--accent, #2383E2);
  border-color: var(--accent, #2383E2);
  color: #fff;
}
.vs-heal-mini-actions .vs-heal-mini-ai:hover { filter: brightness(1.08); }
.vs-heal-mini-actions .vs-heal-mini-ai:disabled {
  opacity: .6;
  cursor: default;
}

/* ═══ aside 面板批量清理 ═══ */
.vs-aside-panel-head-links {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.vs-cleanup-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  margin-bottom: 8px;
  border: 1px dashed var(--danger, #E03E3E);
  border-radius: 8px;
  background: rgba(224, 62, 62, 0.05);
  flex-wrap: wrap;
}
.vs-cleanup-all {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  color: var(--text, #1F2328);
  cursor: pointer;
  white-space: nowrap;
}
.vs-cleanup-count {
  flex: 1;
  font-size: 0.7rem;
  color: var(--danger, #E03E3E);
  font-weight: 600;
  min-width: 0;
  text-align: right;
}
.vs-cleanup-bar .btn { padding: 2px 10px; font-size: 0.72rem; height: auto; }
.vs-cleanup-check {
  flex: 0 0 auto;
  margin: 0;
  cursor: pointer;
}
.vs-defect-main-head {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.vs-heal-mini-top input.vs-cleanup-check { align-self: center; }

/* ═══ 悬浮对话球 + 面板 · 浅色主题重设计(2026-09-04) ═══ */
.vs-chat-fab {
  background: #fff;
  color: var(--accent, #2383E2);
  border: 1px solid var(--line, #E5E7EB);
  box-shadow: 0 4px 16px rgba(35, 131, 226, 0.18), 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: transform .15s, box-shadow .15s, background .15s, color .15s, border-color .15s;
}
.vs-chat-fab:hover {
  transform: translateY(-2px);
  background: var(--accent, #2383E2);
  color: #fff;
  border-color: var(--accent, #2383E2);
  box-shadow: 0 8px 22px rgba(35, 131, 226, 0.32);
}
.vs-chat-fab.open {
  background: var(--accent, #2383E2);
  color: #fff;
  border-color: var(--accent, #2383E2);
  box-shadow: 0 6px 18px rgba(35, 131, 226, 0.3);
}
.vs-chat-panel {
  border-radius: 14px;
  border: 1px solid var(--line, #E5E7EB);
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.14), 0 2px 8px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}
.vs-chat-panel .vs-chat-close,
#vs-chat-close {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: none;
  background: #F3F4F6;
  color: var(--muted, #6B7280);
  font-size: 0.85rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
}
#vs-chat-close:hover { background: rgba(224, 62, 62, 0.1); color: var(--danger, #E03E3E); }

/* ═══ 仪表盘·最近运行 批量清理 ═══ */
.dash-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.dash-runs .vs-cleanup-check {
  margin: 0 6px 0 0;
  vertical-align: middle;
  cursor: pointer;
  flex: 0 0 auto;
}

/* 自愈修复人工确认提示条样式 */
.vs-heal-pending-badge {
  flex: 0 0 auto;
  font-size: 0.66rem;
  font-weight: 700;
  line-height: 1;
  padding: 3px 7px;
  border-radius: 999px;
  color: #9A6700;
  background: rgba(255, 193, 7, 0.16);
  border: 1px solid rgba(255, 193, 7, 0.45);
  white-space: nowrap;
}
.vs-heal-pending-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  width: 100%;
  margin-bottom: 8px;
  padding: 8px 10px;
  border: 1px dashed rgba(255, 193, 7, 0.55);
  border-radius: 8px;
  background: rgba(255, 193, 7, 0.07);
}
.vs-heal-pending-hint {
  flex: 1;
  min-width: 200px;
  font-size: 0.78rem;
  color: var(--muted, #5B6470);
}

/* ═══ 全局 tooltip 浮动层(2026-09-11): JS 接管定位后抑制原 ::after,避免双气泡 ═══ */
.vs-tip-js .vs-tip::after,
.vs-tip-js .vs-tip:hover::after,
.vs-tip-js .vs-tip:focus::after { display: none !important; }
#vs-tip-float {
  display: none;
  position: fixed;
  z-index: 99999;
  max-width: 240px;
  padding: 7px 10px;
  border-radius: 6px;
  background: var(--text);
  color: var(--bg-panel);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  white-space: normal;
  text-align: left;
  pointer-events: none;
  box-shadow: 0 2px 10px rgba(0,0,0,0.15);
}