/**
 * style.css - WorkBuddy 模型管理器 (v3)
 *
 * 设计方向：Glassmorphism + 深浅主题（跟随系统 prefers-color-scheme）
 * 三栏布局：中转站导航 / 详情编辑 / 模型映射
 * 品牌色：暖青铜 #AE8555
 */

/* ─── 主题变量 ─────────────────────────────────── */

:root {
  /* 深色主题（默认）*/
  --bg: #0f1316;
  --bg-2: #13181c;
  --panel: rgba(23, 29, 34, 0.72);
  --panel-solid: #171d22;
  --panel-2: #101519;
  --glass: rgba(255, 255, 255, 0.035);
  --glass-2: rgba(255, 255, 255, 0.06);
  --glass-border: rgba(255, 255, 255, 0.08);
  --line: #26313a;
  --line-soft: #1e2830;
  --text: #f1eee8;
  --text-2: #d8d3c8;
  --muted: #b8afa1;
  --soft: #7f8a92;
  --brand: #AE8555;
  --brand-2: #c89a66;
  --brand-soft: rgba(174, 133, 85, 0.14);
  --brand-glow: rgba(174, 133, 85, 0.25);
  --green: #6da77c;
  --green-soft: rgba(109, 167, 124, 0.16);
  --red: #d76a63;
  --red-soft: rgba(215, 106, 99, 0.16);
  --blue: #6a9cc4;
  --radius: 10px;
  --radius-sm: 7px;
  --radius-xs: 5px;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.4);
  --font: 'DM Sans', -apple-system, 'Segoe UI', sans-serif;
  --mono: 'JetBrains Mono', 'Cascadia Code', monospace;
  --nav-w: 238px;
  --workspace-w: 1040px;
}

:root[data-theme="light"] {
    --bg: #f4f1ec;
    --bg-2: #efeae2;
    --panel: rgba(255, 255, 255, 0.78);
    --panel-solid: #ffffff;
    --panel-2: #faf7f2;
    --glass: rgba(0, 0, 0, 0.025);
    --glass-2: rgba(0, 0, 0, 0.04);
    --glass-border: rgba(0, 0, 0, 0.08);
    --line: #e0d9cc;
    --line-soft: #ebe5d9;
    --text: #2a2620;
    --text-2: #4a443b;
    --muted: #756c5e;
    --soft: #a39a8b;
    --brand: #9a7340;
    --brand-2: #AE8555;
    --brand-soft: rgba(174, 133, 85, 0.1);
    --brand-glow: rgba(174, 133, 85, 0.18);
    --green: #4a8a5e;
    --green-soft: rgba(74, 138, 94, 0.12);
    --red: #c4544e;
    --red-soft: rgba(196, 84, 78, 0.12);
    --blue: #4a7ba8;
    --shadow-sm: 0 2px 8px rgba(60, 50, 30, 0.06);
    --shadow: 0 8px 32px rgba(60, 50, 30, 0.1);
    --shadow-lg: 0 16px 48px rgba(60, 50, 30, 0.14);
  }

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]):not([data-theme="light"]) {
    --bg: #f4f1ec;
    --bg-2: #efeae2;
    --panel: rgba(255, 255, 255, 0.78);
    --panel-solid: #ffffff;
    --panel-2: #faf7f2;
    --glass: rgba(0, 0, 0, 0.025);
    --glass-2: rgba(0, 0, 0, 0.04);
    --glass-border: rgba(0, 0, 0, 0.08);
    --line: #e0d9cc;
    --line-soft: #ebe5d9;
    --text: #2a2620;
    --text-2: #4a443b;
    --muted: #756c5e;
    --soft: #a39a8b;
    --brand: #9a7340;
    --brand-2: #AE8555;
    --brand-soft: rgba(174, 133, 85, 0.1);
    --brand-glow: rgba(174, 133, 85, 0.18);
    --green: #4a8a5e;
    --green-soft: rgba(74, 138, 94, 0.12);
    --red: #c4544e;
    --red-soft: rgba(196, 84, 78, 0.12);
    --blue: #4a7ba8;
    --shadow-sm: 0 2px 8px rgba(60, 50, 30, 0.06);
    --shadow: 0 8px 32px rgba(60, 50, 30, 0.1);
    --shadow-lg: 0 16px 48px rgba(60, 50, 30, 0.14);
  }
}

/* ─── 基础重置 ─────────────────────────────────── */

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

html, body {
  height: 100%;
  font-family: var(--font);
  font-size: 15px;
  color: var(--text);
  background: var(--bg);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

body {
  background:
    radial-gradient(circle at 12% 8%, var(--brand-glow) 0%, transparent 38%),
    radial-gradient(circle at 88% 92%, rgba(106, 156, 196, 0.1) 0%, transparent 40%),
    var(--bg);
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--line); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--soft); }

button, input { font-family: inherit; font-size: inherit; color: inherit; outline: none; }
button { cursor: pointer; border: none; background: none; }
.muted { color: var(--soft); }
code { font-family: var(--mono); font-size: 0.92em; }

/* ─── 应用骨架 ─────────────────────────────────── */

#app-shell {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

/* ─── 顶栏 Hero ──────────────────────────────── */

.topbar {
  padding: 0 clamp(14px, 2.5vw, 28px);
  background: var(--panel);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-bottom: 1px solid var(--line-soft);
  position: relative;
  z-index: 50;
  flex-shrink: 0;
}
.topbar::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    var(--brand) 15%,
    var(--brand-2) 50%,
    var(--brand) 85%,
    transparent 100%
  );
  opacity: 0.45;
}

.topbar-inner {
  width: min(100%, var(--workspace-w));
  min-height: 72px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand-block { display: flex; align-items: center; gap: 12px; min-width: 0; }
.brand-mark {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  color: var(--brand);
  filter: drop-shadow(0 5px 12px var(--brand-glow));
  transition: filter 0.25s ease, transform 0.25s ease;
}
.brand-mark svg { display: block; width: 100%; height: 100%; overflow: visible; }
.brand-mark-frame {
  fill: var(--brand-soft);
  stroke: currentColor;
  stroke-width: 1.25;
}
.brand-mark-core {
  fill: none;
  stroke: var(--brand-2);
  stroke-width: 1.15;
}
.brand-mark-link {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.1;
  opacity: 0.72;
}
.brand-mark circle { fill: var(--panel-solid); stroke: currentColor; stroke-width: 1.25; }
.brand-mark:hover {
  filter: drop-shadow(0 7px 16px var(--brand-glow));
  transform: translateY(-1px);
}
.brand-text h1 {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.brand-subtitle {
  display: block;
  margin-top: 4px;
  color: var(--soft);
  font-size: 11px;
  letter-spacing: 0.08em;
}
.brand-stats {
  display: none;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 7px;
  margin-top: 4px;
}
.brand-stat-item {
  min-height: 18px;
  padding: 1px 6px;
  font-size: 10.5px;
  color: var(--muted);
  font-family: var(--mono);
  display: flex;
  align-items: center;
  gap: 4px;
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: 5px;
  line-height: 1.25;
  white-space: nowrap;
}
.brand-stat-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--brand);
  box-shadow: 0 0 0 2px var(--brand-soft);
  flex-shrink: 0;
}

.topbar-actions { display: flex; gap: 9px; }
.top-btn {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--muted);
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-sm);
  transition: all 0.18s ease;
}
.top-btn:hover {
  color: var(--text);
  background: var(--glass-2);
  border-color: var(--brand-glow);
  transform: translateY(-1px);
}
.top-btn-accent {
  color: var(--brand);
  border-color: var(--brand-glow);
}
.top-btn-accent:hover {
  background: var(--brand-soft);
  color: var(--brand-2);
}
.top-btn-ico {
  font-size: 14px;
  color: var(--brand);
  font-weight: 700;
  line-height: 1;
}

/* ─── 双栏主布局（左导航 + 右详情）────────────── */

.main-layout {
  flex: 1;
  width: min(calc(100% - 28px), var(--workspace-w));
  margin: 14px auto 0;
  display: grid;
  grid-template-columns: var(--nav-w) minmax(0, 1fr);
  gap: 1px;
  background: var(--glass-border);
  border: 1px solid var(--glass-border);
  border-bottom: 0;
  border-radius: 12px 12px 0 0;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  min-height: 0;
}

/* ─── 左栏：导航 ───────────────────────────────── */

.nav-panel {
  background: var(--panel);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.nav-overview-link {
  display: none;
}
.nav-overview-icon {
  width: 28px;
  min-width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brand);
  font-size: 16px;
}
.nav-station.dragging { opacity: 0.45; }
.nav-station.drag-over { border-top: 2px solid var(--brand); }
.nav-station { transition: opacity 0.18s ease, border-color 0.18s ease; }

.station-tree {
  flex: 1;
  overflow-y: auto;
  padding: 10px 10px 12px;
}

.nav-empty {
  padding: 40px 16px;
  text-align: center;
  font-size: 14px;
  color: var(--soft);
  line-height: 1.8;
}

.nav-station { margin-bottom: 2px; }
.nav-station-row {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 7px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background 0.14s ease;
}
.nav-station-row:hover { background: var(--glass); }
.nav-station.active .nav-station-row {
  background: var(--brand-soft);
  box-shadow: inset 3px 0 0 var(--brand);
}
.nav-toggle {
  font-size: 14px;
  color: var(--soft);
  width: 36px;
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: var(--radius-xs);
  transition: all 0.15s ease;
  cursor: pointer;
  user-select: none;
}
.nav-toggle:hover {
  background: var(--glass-2);
  color: var(--text);
}
.nav-station-name {
  flex: 1;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav-station.active .nav-station-name { color: var(--brand); font-weight: 700; }
.nav-station-count {
  font-size: 11px;
  color: var(--soft);
  font-family: var(--mono);
  background: var(--glass);
  padding: 2px 7px;
  border-radius: 8px;
}

.nav-kg-list { padding: 2px 0 4px 20px; }
.nav-kg {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px 7px 9px;
  border-radius: var(--radius-xs);
  cursor: pointer;
  transition: background 0.14s ease;
}
.nav-kg:hover { background: var(--glass); }
.nav-kg.active { background: var(--brand-soft); }
.nav-kg-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--soft);
  flex-shrink: 0;
}
.nav-kg.active .nav-kg-dot { background: var(--brand); }
.nav-kg-name {
  flex: 1;
  font-size: 13px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav-kg.active .nav-kg-name { color: var(--text); }
.nav-kg-rate {
  font-size: 11px;
  color: var(--brand);
  font-family: var(--mono);
}
.nav-kg-count {
  font-size: 11px;
  color: var(--soft);
  font-family: var(--mono);
}
.kg-off {
  font-size: 10px;
  color: var(--red);
  background: var(--red-soft);
  padding: 1px 5px;
  border-radius: 3px;
}

.add-btn {
  margin: 10px 12px 14px;
  padding: 11px;
  font-size: 14px;
  color: var(--brand);
  background: var(--brand-soft);
  border: 1px dashed var(--brand-glow);
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.add-btn:hover {
  background: var(--brand);
  color: #fff;
  border-style: solid;
}
.add-btn span { font-size: 17px; line-height: 1; }

/* ─── 中栏：详情编辑 ───────────────────────────── */

.detail-panel {
  background: var(--bg-2);
  overflow-y: auto;
  padding: 26px 32px 100px;
  min-width: 0;
}

.detail-card {
  max-width: 760px;
  margin: 0 auto;
}
.detail-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}
.detail-head h2 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.detail-title-group { display: flex; align-items: center; gap: 10px; min-width: 0; }
.station-detail-head { justify-content: space-between; }
.station-visit-btn { flex: 0 0 auto; white-space: nowrap; }
.station-visit-btn:disabled { opacity: 0.45; cursor: not-allowed; box-shadow: none; }
.station-name-field .form-input { max-width: 300px; }
.station-detail-card .detail-actions { margin-top: 18px; }
.station-detail-card .detail-actions .danger { color: var(--red); border-color: var(--red-soft); }
.refresh-time { display: block; margin-top: 5px; color: var(--soft); font-size: 11px; font-weight: 400; }
.refresh-sync-summary { margin: -4px 0 12px; padding: 9px 12px; color: var(--muted); background: var(--panel-2); border: 1px solid var(--line-soft); border-radius: var(--radius-xs); font-size: 12px; }
.refresh-sync-summary strong { color: var(--text); }
@media (max-width: 520px) {
  .station-detail-head { align-items: flex-start; flex-direction: column; }
  .station-visit-btn { width: 100%; }
  .station-name-field .form-input { max-width: none; }
}
.dirty-badge {
  font-size: 12px;
  color: var(--brand);
  background: var(--brand-soft);
  padding: 3px 9px;
  border-radius: 10px;
  font-weight: 500;
}

.form-grid { display: flex; flex-direction: column; gap: 16px; }
.form-row { display: flex; flex-direction: column; gap: 6px; }
.form-row-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.keygroup-identity-row {
  display: grid;
  grid-template-columns: minmax(220px, 0.75fr) minmax(130px, 0.25fr);
  gap: 14px;
  align-items: end;
}
.keygroup-name-field .form-input { max-width: 420px; }
.rate-input-wrap { position: relative; }
.rate-input-wrap .form-input {
  width: 100%;
  padding-right: 42px;
}
.rate-input-unit {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--soft);
  font-size: 13px;
  pointer-events: none;
}
.api-key-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.api-key-input {
  min-width: 0;
  font-family: var(--mono);
  letter-spacing: 0.02em;
  color: var(--muted);
}
.api-key-input.editing {
  color: var(--text);
  letter-spacing: normal;
}
.api-key-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.copy-info-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 0 12px;
  color: var(--muted);
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
  transition: all 0.16s ease;
}
.copy-info-btn:hover {
  color: var(--text);
  background: var(--brand-soft);
  border-color: var(--brand-glow);
  transform: translateY(-1px);
}
.copy-info-icon {
  font-family: var(--mono);
  font-size: 14px;
  color: var(--brand);
}
@media (max-width: 760px) {
  .keygroup-identity-row { grid-template-columns: minmax(0, 1fr) 120px; }
  .api-key-box { grid-template-columns: 1fr; }
  .api-key-actions { flex-wrap: wrap; }
}
@media (max-width: 520px) {
  .keygroup-identity-row { grid-template-columns: 1fr; }
  .keygroup-name-field .form-input { max-width: none; }
  .api-key-actions .copy-info-btn { flex: 1; }
}
.form-label {
  font-size: 12.5px;
  color: var(--soft);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.form-input {
  padding: 11px 14px;
  font-size: 15px;
  color: var(--text);
  background: var(--panel-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
}
.form-input:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-glow);
}
.form-hint {
  font-size: 12px;
  color: var(--soft);
  margin-top: 2px;
}

.detail-actions {
  display: flex;
  gap: 9px;
  margin: 20px 0;
  padding-top: 18px;
  border-top: 1px solid var(--line-soft);
}
.ghost-btn, .primary-btn {
  padding: 10px 18px;
  font-size: 14px;
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
  font-weight: 500;
}
.ghost-btn {
  color: var(--muted);
  background: var(--glass);
  border: 1px solid var(--glass-border);
}
.ghost-btn:hover { color: var(--text); background: var(--glass-2); }
.ghost-btn.danger:hover { color: var(--red); border-color: var(--red); background: var(--red-soft); }
.primary-btn {
  color: #fff;
  background: var(--brand);
  border: 1px solid var(--brand-2);
}
.primary-btn:hover { background: var(--brand-2); box-shadow: 0 4px 16px var(--brand-glow); }
.mini-btn {
  padding: 7px 13px;
  font-size: 13px;
  color: var(--brand);
  background: var(--brand-soft);
  border: 1px solid var(--brand-glow);
  border-radius: var(--radius-xs);
  transition: all 0.14s ease;
}
.mini-btn:hover { background: var(--brand); color: #fff; }
.mini { padding: 9px 15px; font-size: 13.5px; }

/* Key 分组列表（中转站面板内）*/
.kg-section { margin-top: 8px; }
.kg-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.kg-section-head h3 {
  font-size: 14px;
  font-weight: 600;
}
.kg-section-head h3 .muted { font-weight: 400; }
.kg-list { display: flex; flex-direction: column; gap: 8px; }
.kg-card {
  padding: 14px 16px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  cursor: pointer;
  transition: all 0.16s ease;
}
.kg-card:hover {
  border-color: var(--brand-glow);
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}
.kg-card.offline { opacity: 0.6; }
.kg-card-head {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 7px;
}
.kg-card-name { font-size: 15px; font-weight: 600; color: var(--text); flex: 1; }
.kg-card-rate {
  font-size: 12px;
  color: var(--brand);
  font-family: var(--mono);
  background: var(--brand-soft);
  padding: 2px 7px;
  border-radius: 8px;
}
.kg-card-off {
  font-size: 11px;
  color: var(--red);
  background: var(--red-soft);
  padding: 2px 7px;
  border-radius: 8px;
}
.kg-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  font-size: 12.5px;
  color: var(--soft);
}
.kg-key { font-family: var(--mono); }
.kg-pool {
  color: var(--blue);
  background: rgba(106, 156, 196, 0.12);
  padding: 2px 7px;
  border-radius: 8px;
}
.kg-enabled { color: var(--green); }
.kg-empty {
  padding: 26px;
  text-align: center;
  font-size: 13.5px;
  color: var(--soft);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
}

.kg-stat {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: 16px;
  padding: 16px;
  background: var(--panel-2);
  border-radius: var(--radius);
  font-size: 13.5px;
  color: var(--muted);
}
.kg-stat strong { color: var(--text); font-weight: 600; }
.kg-stat code { color: var(--brand); word-break: break-all; }

/* Key 内模型列表 */
.kg-models-section {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--line-soft);
}
.kg-models-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.kg-models-head h3 {
  font-size: 15px;
  font-weight: 600;
}
.kg-models-head h3 .muted { font-weight: 400; }
.kg-models-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.mini-search { width: 180px; }
.mini-search #search-models,
.mini-search .kg-model-search {
  width: 100%;
  padding: 8px 12px 8px 30px;
  font-size: 13px;
  color: var(--text);
  background: var(--panel-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
}
.mini-search .kg-model-search:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-glow);
}

.kg-models-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.kg-model-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
}
.kg-model-row:hover {
  border-color: var(--brand-glow);
  background: var(--glass-2);
}
.kg-model-row.enabled {
  border-left: 3px solid var(--green);
}
.kg-model-row.elsewhere {
  opacity: 0.7;
}
.kg-model-info {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.kg-model-realid {
  font-family: var(--mono);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 650;
  letter-spacing: -0.015em;
  color: var(--text);
  padding: 0 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kg-model-alias-row {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.kg-model-alias-label {
  flex: 0 0 auto;
  padding-left: 6px;
  font-size: 10.5px;
  letter-spacing: 0.08em;
  color: var(--soft);
}
.kg-model-name {
  width: min(260px, 100%);
  min-width: 0;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
  background: var(--glass);
  border: 1px solid transparent;
  border-radius: var(--radius-xs);
  transition: all 0.14s ease;
}
.kg-model-name:hover {
  color: var(--text-2);
  background: var(--glass-2);
  border-color: var(--glass-border);
}
.kg-model-name:focus {
  color: var(--text);
  background: var(--panel-solid);
  border-color: var(--brand);
  box-shadow: 0 0 0 2px var(--brand-glow);
}
.kg-model-badge {
  font-size: 11px;
  color: var(--blue);
  background: rgba(106, 156, 196, 0.14);
  padding: 2px 8px;
  border-radius: 8px;
  white-space: nowrap;
}
.kg-model-badge.elsewhere {
  color: var(--brand);
  background: var(--brand-soft);
}
.kg-model-exclude {
  width: 28px;
  height: 28px;
  font-size: 17px;
  color: var(--soft);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-xs);
  transition: all 0.14s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.kg-model-exclude:hover {
  color: var(--red);
  background: var(--red-soft);
  border-color: var(--red);
}
.kg-models-empty {
  padding: 32px 16px;
  text-align: center;
  font-size: 13.5px;
  color: var(--soft);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
}
.kg-models-stat {
  margin-top: 12px;
  font-size: 12.5px;
  color: var(--soft);
}
.kg-models-stat strong { color: var(--brand); font-weight: 600; }

/* 已排除模型折叠区 */
.kg-excluded-section {
  margin-top: 12px;
}
.kg-excluded-toggle {
  padding: 6px 12px;
  font-size: 12.5px;
  color: var(--soft);
  background: var(--glass);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-xs);
  transition: all 0.14s ease;
}
.kg-excluded-toggle:hover { color: var(--muted); background: var(--glass-2); }
.kg-excluded-list {
  margin-top: 8px;
  padding: 10px 12px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.kg-excluded-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 0;
}
.kg-excluded-id {
  flex: 1;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--soft);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 总览面板 */
.overview-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.stat-block {
  padding: 18px 12px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  text-align: center;
}
.stat-num {
  font-size: 28px;
  font-weight: 700;
  color: var(--brand);
  font-family: var(--mono);
  line-height: 1;
}
.stat-label {
  font-size: 11px;
  color: var(--soft);
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.overview-hint {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.8;
}
.overview-hint p { margin-bottom: 6px; }

/* ─── 本机模型面板 ─────────────────────────────── */

.native-hint {
  padding: 14px 16px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  margin-bottom: 18px;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.8;
}
.native-hint code { color: var(--brand); }
.native-hint .muted { color: var(--soft); font-size: 12.5px; }

.stat-block.native { border-color: var(--brand-glow); }
.stat-block.native .stat-num { color: var(--muted); }

.native-models-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.native-model-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px 28px;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
}
.native-model-row:hover {
  border-color: var(--brand-glow);
  background: var(--glass-2);
}
.native-model-row.enabled {
  border-left: 3px solid var(--green);
}
.native-model-info { min-width: 0; }
.native-model-name {
  width: 100%;
  padding: 4px 8px;
  font-size: 14.5px;
  font-weight: 500;
  color: var(--text);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-xs);
  transition: all 0.14s ease;
}
.native-model-name:hover { background: var(--glass-2); }
.native-model-name:focus {
  background: var(--panel-solid);
  border-color: var(--brand);
  box-shadow: 0 0 0 2px var(--brand-glow);
}
.native-model-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 8px;
  margin-top: 3px;
}
.native-model-id {
  font-family: var(--mono);
  font-size: 11.5px;
  color: var(--soft);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}
.native-model-url {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--blue);
  background: rgba(106, 156, 196, 0.1);
  padding: 1px 7px;
  border-radius: 6px;
  white-space: nowrap;
}

.capability-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 10px;
  padding: 6px 8px 0;
}
.capability-control {
  display: inline-grid;
  grid-template-columns: auto auto;
  gap: 2px 5px;
  align-items: center;
  font-size: 11px;
  color: var(--muted);
}
.capability-control select {
  min-width: 58px;
  padding: 2px 4px;
  color: var(--text);
  background: var(--panel-solid);
  border: 1px solid var(--line-soft);
  border-radius: 5px;
  font-size: 11px;
}
.capability-source {
  grid-column: 1 / -1;
  font-size: 10px;
  color: var(--soft);
}
.capability-source.yes { color: var(--green); }

/* ─── 右栏：模型映射 ───────────────────────────── */

.models-panel {
  background: var(--panel);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.models-head {
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--line-soft);
}
.models-head h3 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}
.search-wrap {
  position: relative;
}
.search-ico {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--soft);
  font-size: 14px;
}
#search-models {
  width: 100%;
  padding: 8px 12px 8px 30px;
  font-size: 12.5px;
  color: var(--text);
  background: var(--panel-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
}
#search-models:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-glow);
}
#search-models::placeholder { color: var(--soft); }

.model-list-area {
  flex: 1;
  overflow-y: auto;
  padding: 10px 12px 80px;
}
.models-empty {
  padding: 48px 16px;
  text-align: center;
  font-size: 13px;
  color: var(--soft);
}

.model-card {
  padding: 10px 12px;
  margin-bottom: 6px;
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-sm);
  transition: all 0.16s ease;
}
.model-card:hover {
  background: var(--glass-2);
  border-color: var(--brand-glow);
}
.model-card.pending-enable { border-left: 3px solid var(--green); }
.model-card.pending-disable { opacity: 0.5; border-left: 3px solid var(--red); }
.model-card.pending-switch { border-left: 3px solid var(--blue); }

.mc-main {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 8px;
}
.star-btn {
  font-size: 16px;
  color: var(--soft);
  line-height: 1;
  transition: all 0.14s ease;
}
.star-btn:hover { transform: scale(1.2); }
.star-btn.on { color: var(--brand); }

.mc-info { min-width: 0; }
.mc-name {
  width: 100%;
  padding: 3px 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-xs);
  transition: all 0.14s ease;
}
.mc-name:hover { background: var(--glass-2); }
.mc-name:focus {
  background: var(--panel-2);
  border-color: var(--brand);
}
.mc-name.disabled { color: var(--soft); font-style: italic; }
.mc-realid {
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--soft);
  padding: 0 6px;
  margin-top: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mc-sources {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
  padding-left: 28px;
}
.src-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  font-size: 10.5px;
  color: var(--muted);
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  transition: all 0.14s ease;
}
.src-pill:hover { background: var(--glass-2); border-color: var(--brand-glow); }
.src-pill.active {
  color: #fff;
  background: var(--brand);
  border-color: var(--brand-2);
}
.src-pill-dn {
  font-size: 9.5px;
  opacity: 0.7;
  font-family: var(--mono);
}
.src-pill.active .src-pill-dn { opacity: 0.85; }

/* 拨杆开关 */
.toggle-wrap { display: flex; align-items: center; gap: 10px; }
.toggle-label { font-size: 13px; color: var(--muted); }
.toggle {
  width: 44px;
  height: 24px;
  border-radius: 12px;
  background: var(--line);
  position: relative;
  transition: background 0.2s ease;
  flex-shrink: 0;
}
.toggle .toggle-dot {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  transition: transform 0.2s cubic-bezier(0.34, 1.2, 0.64, 1);
}
.toggle.on { background: var(--green); }
.toggle.on .toggle-dot { transform: translateX(20px); }

/* ─── 保存栏 ───────────────────────────────────── */

.save-bar {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 22px;
  background: var(--panel);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-top: 1px solid var(--brand);
  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.2);
  z-index: 40;
  flex-shrink: 0;
  animation: slideUp 0.24s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes slideUp {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.save-bar-text {
  font-size: 13px;
  color: var(--text-2);
  font-weight: 500;
}
.save-bar-actions { display: flex; gap: 8px; }

/* ─── Busy 栏 ──────────────────────────────────── */

.busy-bar {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  background: var(--panel-solid);
  border: 1px solid var(--brand-glow);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  z-index: 100;
  font-size: 13px;
  color: var(--text);
}
.busy-spinner {
  width: 14px;
  height: 14px;
  border: 2px solid var(--line);
  border-top-color: var(--brand);
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ─── 状态板与刷新反馈 ─────────────────────────── */
.active-board { margin-top: 22px; border-top: 1px solid var(--line-soft); padding-top: 18px; }
.active-board-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 16px; }
.active-board-head h3 { font-size: 16px; font-weight: 600; }
.ov-head-sep { color: var(--soft); }
.ov-head-enabled { font-size: 13px; color: var(--green); font-weight: 500; }
.active-model-row { display: grid; grid-template-columns: minmax(150px, 1.3fr) minmax(150px, 1fr) auto auto auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.active-model-main { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.active-model-main strong, .active-model-main code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.active-model-main code { color: var(--muted); font-size: 11px; }
.active-model-source { display: flex; gap: 6px; align-items: center; color: var(--muted); font-size: 12px; min-width: 0; }
.active-model-source span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.active-model-source em { color: var(--accent); font-style: normal; white-space: nowrap; }
.active-status, .active-pending, .refresh-status-label { font-size: 11px; padding: 3px 7px; border: 1px solid var(--green); color: var(--green); border-radius: 4px; white-space: nowrap; }
.active-status.error, .refresh-report-item.error .refresh-status-label { border-color: var(--red); color: var(--red); }
.active-pending { border-color: var(--line); color: var(--muted); }
.active-pending.pending { border-color: var(--accent); color: var(--accent); }
.refresh-summary { padding: 10px 12px; margin-bottom: 12px; background: var(--glass-2); border-left: 3px solid var(--accent); }
.refresh-report-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.refresh-report-main, .refresh-report-detail { grid-column: 1; min-width: 0; }
.refresh-report-item > .mini-btn { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.refresh-report-main { display: flex; gap: 7px; align-items: center; }
.refresh-report-detail { color: var(--muted); font-size: 12px; padding-left: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.refresh-status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); flex: 0 0 auto; }
.refresh-report-item.error .refresh-status-dot { background: var(--red); }
.refresh-report-item.changed .refresh-status-dot, .refresh-report-item.recovered .refresh-status-dot { background: var(--accent); }
.focus-highlight { animation: focusPulse 1.8s ease both; }
@keyframes focusPulse { 0%, 100% { box-shadow: 0 0 0 rgba(174,133,85,0); } 25%, 70% { box-shadow: 0 0 0 3px rgba(174,133,85,.7), 0 0 24px rgba(174,133,85,.25); background: rgba(174,133,85,.12); } }
@media (max-width: 720px) { .active-model-row { grid-template-columns: 1fr auto; } .active-model-source, .active-status, .active-pending { grid-column: 1; } .active-model-row > .mini-btn { grid-column: 2; grid-row: 1 / span 4; } }

/* ─── 总览模型卡片（v3.5 数字便签卡片）────────── */
.ov-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 900px) {
  .ov-card-grid { grid-template-columns: 1fr; }
}

.ov-model-card {
  display: flex;
  flex-direction: column;
  padding: 18px 20px;
  background: var(--panel-solid);
  border: 1px solid var(--glass-border);
  border-radius: 14px;
  box-shadow: var(--shadow-sm);
  transition: transform 0.2s var(--ease-spring), box-shadow 0.2s ease, border-color 0.2s ease;
}
.ov-model-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
  border-color: var(--brand-glow);
}
.ov-model-card.enabled {
  border-top: 3px solid var(--green);
}
.ov-model-card.pending-enable { border-top-color: var(--green); }
.ov-model-card.pending-switch { border-top-color: var(--blue); }
.ov-model-card.pending-rename { border-top-color: var(--brand); }

.ov-model-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}
.ov-model-titles {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ov-model-dn {
  font-size: 17px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.01em;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ov-model-id {
  font-family: var(--mono);
  font-size: 11.5px;
  color: var(--soft);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ov-model-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.ov-source-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 11px;
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: 18px;
  transition: all 0.18s ease;
}
.ov-source-toggle:hover {
  color: var(--text);
  background: var(--glass-2);
  border-color: var(--brand-glow);
}
.ov-source-toggle.expanded {
  color: var(--brand);
  background: var(--brand-soft);
  border-color: var(--brand-glow);
}
.ov-source-toggle .ov-toggle-icon {
  display: inline-block;
  transition: transform 0.2s ease;
}
.ov-source-toggle.expanded .ov-toggle-icon {
  transform: rotate(180deg);
}
.ov-source-toggle .ov-toggle-label {
  display: inline;
}
@media (max-width: 620px) {
  .ov-source-toggle .ov-toggle-label { display: none; }
  .ov-source-toggle { padding: 6px 8px; }
}

.ov-model-current {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
  padding: 9px 12px;
  margin-bottom: 10px;
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-sm);
  font-size: 12.5px;
  color: var(--muted);
}
.ov-mc-icon {
  color: var(--green);
  font-size: 11px;
}
.ov-mc-source {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ov-mc-source strong {
  color: var(--text-2);
  font-weight: 600;
}
.ov-mc-rate {
  font-size: 11px;
  color: var(--brand);
  font-family: var(--mono);
  background: var(--brand-soft);
  padding: 1px 6px;
  border-radius: 8px;
}
.ov-mc-native-tag {
  font-size: 10px;
  color: var(--cyan);
  background: rgba(19, 169, 161, 0.12);
  padding: 1px 6px;
  border-radius: 6px;
}

.ov-key-status {
  display: inline-flex;
  align-self: flex-start;
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 8px;
  margin-bottom: 10px;
  font-weight: 500;
}
.ov-key-status-ok {
  color: var(--green);
  background: var(--green-soft);
  border: 1px solid var(--green);
}
.ov-key-status-error {
  color: var(--red);
  background: var(--red-soft);
  border: 1px solid var(--red);
}
.ov-key-status-recovered {
  color: var(--brand);
  background: var(--brand-soft);
  border: 1px solid var(--brand);
}

.ov-source-list {
  margin-top: 2px;
  padding: 12px;
  background: var(--glass);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-sm);
  animation: expandIn 0.2s ease;
}
@keyframes expandIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
.ov-source-list-hint {
  font-size: 11.5px;
  color: var(--soft);
  margin-bottom: 10px;
}
.ov-source-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ov-pending-hint {
  margin-top: 10px;
}

.ov-badge {
  font-size: 10.5px;
  padding: 2px 8px;
  border-radius: 8px;
  font-weight: 500;
  white-space: nowrap;
  line-height: 1.4;
}
.ov-badge-saved {
  color: var(--muted);
  background: var(--glass);
  border: 1px solid var(--glass-border);
}
.ov-badge-pending-enable {
  color: var(--green);
  background: var(--green-soft);
  border: 1px solid var(--green);
}
.ov-badge-pending-switch {
  color: var(--blue);
  background: rgba(76, 125, 255, 0.12);
  border: 1px solid var(--blue);
}
.ov-badge-pending-rename {
  color: var(--brand);
  background: var(--brand-soft);
  border: 1px solid var(--brand);
}

.ov-source-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  font-size: 12px;
  color: var(--muted);
  background: var(--panel-2);
  border: 1px solid var(--glass-border);
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.18s ease;
}
.ov-source-pill:hover {
  background: var(--glass-2);
  border-color: var(--brand-glow);
  transform: translateY(-1px);
}
.ov-source-pill.active {
  color: var(--text);
  background: var(--brand-soft);
  border-color: var(--brand);
  font-weight: 500;
}
.ov-source-pill.native {
  border-style: dashed;
}
.ov-sp-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--soft);
  flex-shrink: 0;
}
.ov-source-pill.active .ov-sp-dot {
  background: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-glow);
}
.ov-sp-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 220px;
}
.ov-sp-rate {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--brand);
  background: var(--brand-soft);
  padding: 1px 5px;
  border-radius: 6px;
}
.ov-source-pill.active .ov-sp-rate {
  color: var(--text);
  background: rgba(255,255,255,0.2);
}

.ov-head-pending {
  font-size: 12.5px;
  font-weight: 500;
}
.ov-head-pending.pending-enable { color: var(--green); }
.ov-head-pending.pending-switch { color: var(--blue); }

.overview-hint p { margin-bottom: 4px; }

/* ─── Toast ────────────────────────────────────── */

#toast {
  position: fixed;
  top: 70px;
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
  padding: 10px 20px;
  background: var(--panel-solid);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  font-size: 13px;
  color: var(--text);
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 200;
}
#toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
#toast.toast-error { border-color: var(--red); color: var(--red); }
#toast.toast-info { border-color: var(--brand-glow); }

/* ─── 模态框 ───────────────────────────────────── */

.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 300;
  animation: fadeIn 0.2s ease;
}
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.modal-box {
  width: 90%;
  max-width: 520px;
  max-height: 80vh;
  overflow-y: auto;
  background: var(--panel-solid);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  animation: modalIn 0.24s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes modalIn {
  from { transform: scale(0.95) translateY(10px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}
.modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  border-bottom: 1px solid var(--line-soft);
}
.modal-head h3 { font-size: 16px; font-weight: 700; }
.modal-close {
  font-size: 20px;
  color: var(--soft);
  line-height: 1;
  padding: 4px;
}
.modal-close:hover { color: var(--text); }
.modal-body { padding: 20px 22px; }
.modal-body p { font-size: 13px; color: var(--muted); line-height: 1.7; margin-bottom: 10px; }
.data-menu-note { margin-bottom: 14px !important; color: var(--muted) !important; }
.data-menu-body { display: grid; gap: 10px; }
.data-action {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 10px;
  text-align: left;
  padding: 13px 14px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  transition: all 0.18s ease;
}
.data-action:hover { border-color: var(--brand); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.data-action > span { grid-row: 1 / span 2; color: var(--brand); font-size: 22px; text-align: center; }
.data-action strong { font-size: 14px; color: var(--text); }
.data-action small { color: var(--soft); font-size: 12px; margin-top: 3px; }

.modal-body .backup-item {
  padding: 10px 12px;
  margin-bottom: 6px;
  background: var(--panel-2);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all 0.14s ease;
  font-size: 12.5px;
}
.modal-body .backup-item:hover { border-color: var(--brand-glow); background: var(--glass-2); }
.empty-box { padding: 20px; text-align: center; color: var(--soft); font-size: 13px; }

/* ─── 响应式 ───────────────────────────────────── */

@media (max-width: 1100px) {
  :root { --nav-w: 220px; }
  .topbar-inner { width: min(100%, var(--workspace-w)); }
}
@media (max-width: 900px) {
  .main-layout {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
  }
  .nav-panel { max-height: 220px; }
  .form-row-2col { grid-template-columns: 1fr; }
  .detail-panel { padding: 18px; }
  .kg-model-row {
    grid-template-columns: 22px minmax(0, 1fr) auto auto;
  }
}
@media (max-width: 620px) {
  .topbar { padding: 12px 16px; }
  .top-btn { padding: 7px 11px; font-size: 13px; }
  .top-btn-label { display: none; }
  .detail-panel { padding: 14px; }
  .kg-models-head { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}



/* ─── 多彩极简编辑器主题（视觉层改版） ───────────── */
:root {
  --bg: #f4f6f8;
  --bg-2: #eef1f5;
  --panel: #ffffff;
  --panel-solid: #ffffff;
  --panel-2: #f8fafc;
  --glass: rgba(24, 32, 42, 0.035);
  --glass-2: rgba(24, 32, 42, 0.07);
  --glass-border: #e1e6ed;
  --line: #d9e0e8;
  --line-soft: #e9edf2;
  --text: #1c2530;
  --text-2: #344252;
  --muted: #637286;
  --soft: #8b98a8;
  --brand: #ff6b4a;
  --brand-2: #f45132;
  --brand-soft: rgba(255, 107, 74, 0.12);
  --brand-glow: rgba(255, 107, 74, 0.28);
  --green: #19a974;
  --green-soft: rgba(25, 169, 116, 0.12);
  --red: #e05252;
  --red-soft: rgba(224, 82, 82, 0.12);
  --blue: #4c7dff;
  --yellow: #e5a51b;
  --cyan: #13a9a1;
  --radius: 10px;
  --radius-sm: 8px;
  --radius-xs: 6px;
  --shadow-sm: 0 2px 10px rgba(31, 43, 56, 0.06);
  --shadow: 0 12px 30px rgba(31, 43, 56, 0.09);
  --shadow-lg: 0 20px 56px rgba(31, 43, 56, 0.16);
  --nav-w: 252px;
  --workspace-w: 1120px;
}

:root[data-theme="light"] {
  --bg: #f4f6f8;
  --bg-2: #eef1f5;
  --panel: #ffffff;
  --panel-solid: #ffffff;
  --panel-2: #f8fafc;
  --glass: rgba(24, 32, 42, 0.035);
  --glass-2: rgba(24, 32, 42, 0.07);
  --glass-border: #e1e6ed;
  --line: #d9e0e8;
  --line-soft: #e9edf2;
  --text: #1c2530;
  --text-2: #344252;
  --muted: #637286;
  --soft: #8b98a8;
  --brand: #ff6b4a;
  --brand-2: #f45132;
  --brand-soft: rgba(255, 107, 74, 0.12);
  --brand-glow: rgba(255, 107, 74, 0.28);
  --green: #19a974;
  --green-soft: rgba(25, 169, 116, 0.12);
  --red: #e05252;
  --red-soft: rgba(224, 82, 82, 0.12);
  --blue: #4c7dff;
  --yellow: #e5a51b;
  --cyan: #13a9a1;
  --shadow-sm: 0 2px 10px rgba(31, 43, 56, 0.06);
  --shadow: 0 12px 30px rgba(31, 43, 56, 0.09);
  --shadow-lg: 0 20px 56px rgba(31, 43, 56, 0.16);
}

:root[data-theme="dark"] {
  --bg: #111418;
  --bg-2: #171b20;
  --panel: #1b2026;
  --panel-solid: #20262d;
  --panel-2: #161b20;
  --glass: rgba(255, 255, 255, 0.035);
  --glass-2: rgba(255, 255, 255, 0.07);
  --glass-border: #303941;
  --line: #35404a;
  --line-soft: #29323a;
  --text: #f3f6f8;
  --text-2: #d9e0e6;
  --muted: #a2afbb;
  --soft: #73818d;
  --brand: #ff8062;
  --brand-2: #ff987e;
  --brand-soft: rgba(255, 128, 98, 0.16);
  --brand-glow: rgba(255, 128, 98, 0.3);
  --green: #35c791;
  --green-soft: rgba(53, 199, 145, 0.16);
  --red: #ff746e;
  --red-soft: rgba(255, 116, 110, 0.16);
  --blue: #78a0ff;
  --yellow: #f2bf47;
  --cyan: #37c9c0;
  --shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.2);
  --shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, 0.4);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]):not([data-theme="light"]) {
    --bg: #f4f6f8;
    --bg-2: #eef1f5;
    --panel: #ffffff;
    --panel-solid: #ffffff;
    --panel-2: #f8fafc;
    --glass: rgba(24, 32, 42, 0.035);
    --glass-2: rgba(24, 32, 42, 0.07);
    --glass-border: #e1e6ed;
    --line: #d9e0e8;
    --line-soft: #e9edf2;
    --text: #1c2530;
    --text-2: #344252;
    --muted: #637286;
    --soft: #8b98a8;
    --brand: #ff6b4a;
    --brand-2: #f45132;
    --brand-soft: rgba(255, 107, 74, 0.12);
    --brand-glow: rgba(255, 107, 74, 0.28);
    --green: #19a974;
    --green-soft: rgba(25, 169, 116, 0.12);
    --red: #e05252;
    --red-soft: rgba(224, 82, 82, 0.12);
    --blue: #4c7dff;
    --yellow: #e5a51b;
    --cyan: #13a9a1;
    --shadow-sm: 0 2px 10px rgba(31, 43, 56, 0.06);
    --shadow: 0 12px 30px rgba(31, 43, 56, 0.09);
    --shadow-lg: 0 20px 56px rgba(31, 43, 56, 0.16);
  }
}

body {
  background:
    radial-gradient(circle at 7% 0%, rgba(255, 107, 74, 0.11), transparent 27%),
    radial-gradient(circle at 95% 100%, rgba(76, 125, 255, 0.1), transparent 31%),
    var(--bg);
}

.topbar {
  background: rgba(255, 255, 255, 0.88);
  border-bottom-color: #e1e6ed;
}
.topbar::after {
  height: 3px;
  background: linear-gradient(90deg, #ff6b4a 0%, #ffbd3e 35%, #28c49a 68%, #4c7dff 100%);
  opacity: 1;
}
.brand-block { gap: 14px; }
.brand-mark {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
  padding: 6px;
  background: linear-gradient(145deg, #fff4eb, #ffe1d4);
  border: 1px solid #ffd0c0;
  border-radius: 13px;
  box-shadow: 0 7px 16px rgba(255, 107, 74, 0.17);
}
.brand-mark-frame { fill: transparent; stroke: #ff6b4a; }
.brand-mark-core { stroke: #ff9d45; }
.brand-mark circle { fill: #fff; stroke: #ff6b4a; }
.brand-text h1 { font-size: 19px; letter-spacing: 0; }
.brand-subtitle { color: #8b98a8; letter-spacing: 0.1em; }
.topbar-actions { gap: 8px; }
.top-btn {
  padding: 10px 14px;
  color: var(--text-2);
  background: #fff;
  border-color: #e1e6ed;
  border-radius: 9px;
  box-shadow: 0 2px 5px rgba(31, 43, 56, 0.035);
}
.top-btn:hover { color: var(--text); border-color: var(--brand); background: #fff8f5; }
.top-btn-accent { color: var(--brand-2); background: #fff4ef; border-color: #ffd3c6; }
.top-btn-ico { color: var(--brand-2); }

.main-layout {
  width: min(calc(100% - 32px), var(--workspace-w));
  margin-top: 18px;
  gap: 0;
  background: #dfe5ec;
  border: 0;
  border-radius: 14px 14px 0 0;
  box-shadow: 0 18px 42px rgba(31, 43, 56, 0.1);
}
.nav-panel { background: #f8fafc; }
.station-tree { padding: 16px 12px 12px; }
.nav-station-row { padding: 7px 8px; gap: 8px; }
.nav-station-row:hover { background: #eef2f6; }
.nav-station.active .nav-station-row {
  background: linear-gradient(90deg, #fff0eb, #fff8f5);
  box-shadow: inset 4px 0 0 var(--brand);
}
.nav-station-name { color: #536274; font-weight: 600; }
.nav-station.active .nav-station-name { color: var(--brand-2); }
.nav-station-count { background: #edf1f5; color: #8492a1; }
.nav-toggle:hover { background: #e9eef4; color: var(--brand-2); }
.nav-kg-list { padding-left: 24px; }
.nav-kg { padding: 8px 10px; }
.nav-kg.active { background: #eef4ff; }
.nav-kg.active .nav-kg-dot { background: var(--blue); box-shadow: 0 0 0 4px rgba(76, 125, 255, 0.12); }
.nav-kg.active .nav-kg-name { color: #3b64d5; font-weight: 600; }
.nav-kg-rate { color: var(--yellow); }
.add-btn { margin: 10px 12px 16px; background: #fff4ef; border-color: #ffc9b9; color: var(--brand-2); }
.add-btn:hover { background: var(--brand); color: #fff; }

.detail-panel { background: #eef1f5; padding: 32px 38px 110px; }
.detail-card { max-width: 820px; }
.detail-head { margin-bottom: 24px; }
.detail-head h2 { font-size: 24px; letter-spacing: 0; }
.dirty-badge { color: #b97400; background: #fff3d3; border: 1px solid #f7d98a; }
.form-grid { gap: 18px; }
.form-label { color: #718092; font-size: 12px; letter-spacing: 0.08em; }
.form-input {
  padding: 13px 15px;
  background: #fff;
  border-color: #dce3eb;
  border-radius: 9px;
  box-shadow: inset 0 1px 2px rgba(31, 43, 56, 0.025);
}
.form-input:hover { border-color: #bfcbd8; }
.form-input:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(76, 125, 255, 0.14); }
.form-hint { color: #8a98a8; }
.detail-actions { border-top-color: #dfe5ec; }
.ghost-btn { background: #fff; border-color: #dce3eb; color: #617083; }
.ghost-btn:hover { border-color: #aebdcb; background: #f8fafc; }
.primary-btn { background: var(--brand); border-color: var(--brand); box-shadow: 0 5px 12px rgba(255, 107, 74, 0.2); }
.primary-btn:hover { background: var(--brand-2); box-shadow: 0 8px 18px rgba(255, 107, 74, 0.28); }
.mini-btn { color: #3b64d5; background: #eef4ff; border-color: #cbd9ff; }
.mini-btn:hover { background: var(--blue); border-color: var(--blue); color: #fff; }

.kg-section-head h3, .kg-models-head h3 { font-size: 15px; }
.kg-card {
  padding: 16px 18px;
  background: #fff;
  border-color: #e0e6ed;
  border-radius: 10px;
  box-shadow: 0 2px 7px rgba(31, 43, 56, 0.035);
}
.kg-card:hover { border-color: #ffb7a5; box-shadow: 0 8px 18px rgba(255, 107, 74, 0.1); }
.kg-card-rate { color: #b77900; background: #fff3d3; }
.kg-card-off { color: var(--red); background: var(--red-soft); }
.kg-pool { color: #087d87; background: #e2f7f5; }
.kg-enabled { color: var(--green); }
.kg-stat, .native-hint { background: #fff; border-color: #e0e6ed; }
.kg-models-section, .active-board { border-top-color: #dfe5ec; }
.kg-model-row, .native-model-row { background: #fff; border-color: #e0e6ed; }
.kg-model-row:hover, .native-model-row:hover { background: #fff9f7; border-color: #ffb7a5; }
.kg-model-row.enabled, .native-model-row.enabled { border-left-color: var(--green); }
.kg-model-name:focus, .native-model-name:focus { background: #fff; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(76, 125, 255, 0.12); }
.kg-model-badge { color: #087d87; background: #e2f7f5; }
.kg-model-badge.elsewhere { color: #b77900; background: #fff3d3; }
.kg-model-exclude:hover { color: var(--red); background: var(--red-soft); border-color: #f3aaa6; }
.mini-search #search-models, .mini-search .kg-model-search, #search-models { background: #fff; border-color: #dce3eb; }

.overview-stats { gap: 14px; }
.stat-block { padding: 20px 12px; background: #fff; border-color: #e0e6ed; box-shadow: 0 2px 7px rgba(31, 43, 56, 0.035); }
.stat-block:nth-child(1) .stat-num { color: var(--brand); }
.stat-block:nth-child(2) .stat-num { color: var(--blue); }
.stat-block:nth-child(3) .stat-num { color: var(--cyan); }
.stat-block:nth-child(4) .stat-num { color: var(--green); }
.stat-block:nth-child(5) .stat-num { color: var(--yellow); }
.stat-label { color: #7c8b9a; }

.toggle { background: #cbd4de; }
.toggle.on { background: var(--green); box-shadow: 0 2px 8px rgba(25, 169, 116, 0.24); }
.save-bar { background: rgba(255, 255, 255, 0.94); border-top-color: var(--brand); box-shadow: 0 -8px 24px rgba(31, 43, 56, 0.1); }
.busy-bar, .modal-box { background: #fff; border-color: #e0e6ed; }
.data-action { background: #f8fafc; border-color: #e0e6ed; }
.data-action:hover { border-color: var(--blue); background: #f4f7ff; }

:root[data-theme="dark"] .topbar { background: rgba(22, 26, 31, 0.94); border-bottom-color: #303941; }
:root[data-theme="dark"] .top-btn { background: #20262d; border-color: #35404a; }
:root[data-theme="dark"] .top-btn:hover { background: #282f37; }
:root[data-theme="dark"] .brand-mark { background: linear-gradient(145deg, #3b2926, #2c2321); border-color: #70483c; }
:root[data-theme="dark"] .brand-mark circle { fill: #20262d; }
:root[data-theme="dark"] .main-layout { background: #303941; }
:root[data-theme="dark"] .nav-panel { background: #1b2026; }
:root[data-theme="dark"] .nav-station-row:hover { background: #252c33; }
:root[data-theme="dark"] .nav-station.active .nav-station-row { background: #362a28; }
:root[data-theme="dark"] .nav-station-count { background: #272f37; }
:root[data-theme="dark"] .nav-kg.active { background: #242d40; }
:root[data-theme="dark"] .add-btn { background: #362a28; border-color: #70483c; }
:root[data-theme="dark"] .detail-panel { background: #171b20; }
:root[data-theme="dark"] .form-input, :root[data-theme="dark"] .kg-card, :root[data-theme="dark"] .kg-stat, :root[data-theme="dark"] .native-hint, :root[data-theme="dark"] .kg-model-row, :root[data-theme="dark"] .native-model-row, :root[data-theme="dark"] .stat-block, :root[data-theme="dark"] .save-bar, :root[data-theme="dark"] .busy-bar, :root[data-theme="dark"] .modal-box { background: #20262d; }
:root[data-theme="dark"] .form-input:focus { border-color: var(--blue); }
:root[data-theme="dark"] .kg-card:hover, :root[data-theme="dark"] .kg-model-row:hover, :root[data-theme="dark"] .native-model-row:hover { background: #2b2524; border-color: #8c4e3f; }
:root[data-theme="dark"] .ghost-btn, :root[data-theme="dark"] .top-btn { background: #20262d; }
:root[data-theme="dark"] .mini-search #search-models, :root[data-theme="dark"] .mini-search .kg-model-search, :root[data-theme="dark"] #search-models { background: #161b20; }

@media (max-width: 620px) {
  .brand-mark { width: 40px; height: 40px; flex-basis: 40px; }
  .brand-text h1 { font-size: 17px; }
  .topbar-actions { gap: 5px; }
  .top-btn { padding: 8px 10px; }
}

/* ─── 轻玻璃工作台：材质与动效收束层 ─────────────── */
:root {
  --ease-spring: cubic-bezier(0.34, 1.36, 0.64, 1);
  --ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
  --glass-blur: blur(18px) saturate(150%);
}

/* 暗色为主视觉：用透明叠层拉开深度，避免整块纯黑矩形 */
:root[data-theme="dark"] {
  --bg: #10151a;
  --bg-2: #151c22;
  --panel: rgba(27, 34, 41, 0.72);
  --panel-solid: #202a32;
  --panel-2: rgba(22, 29, 35, 0.78);
  --glass: rgba(255, 255, 255, 0.045);
  --glass-2: rgba(255, 255, 255, 0.085);
  --glass-border: rgba(205, 220, 230, 0.13);
  --line: rgba(205, 220, 230, 0.16);
  --line-soft: rgba(205, 220, 230, 0.09);
  --text: #f4f7f8;
  --text-2: #dce5e8;
  --muted: #aab9c0;
  --soft: #7e909a;
  --brand: #d39a61;
  --brand-2: #e1ae76;
  --brand-soft: rgba(211, 154, 97, 0.15);
  --brand-glow: rgba(211, 154, 97, 0.28);
  --shadow-sm: 0 4px 14px rgba(0, 0, 0, 0.2);
  --shadow: 0 14px 36px rgba(0, 0, 0, 0.28);
  --shadow-lg: 0 26px 72px rgba(0, 0, 0, 0.42);
}

:root[data-theme="light"] {
  --glass: rgba(255, 255, 255, 0.66);
  --glass-2: rgba(255, 255, 255, 0.88);
  --glass-border: rgba(116, 132, 148, 0.2);
  --shadow-sm: 0 4px 14px rgba(31, 43, 56, 0.07);
  --shadow: 0 14px 34px rgba(31, 43, 56, 0.1);
}

body {
  background:
    radial-gradient(circle at 8% 0%, var(--brand-glow), transparent 30%),
    radial-gradient(circle at 92% 96%, rgba(76, 125, 255, 0.1), transparent 34%),
    var(--bg);
}

.topbar,
.nav-panel,
.models-panel,
.save-bar {
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
}

.topbar {
  background: var(--panel);
  border-bottom-color: var(--glass-border);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}
.top-btn,
.ghost-btn,
.add-btn,
.mini-btn {
  transition: transform 0.24s var(--ease-spring), background 0.2s ease,
    border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}
.top-btn:hover,
.ghost-btn:hover,
.add-btn:hover,
.mini-btn:hover {
  transform: translateY(-2px);
}
.top-btn:active,
.ghost-btn:active,
.add-btn:active,
.mini-btn:active,
.primary-btn:active,
.kg-model-exclude:active {
  transform: translateY(1px) scale(0.97);
}

.main-layout {
  background: var(--glass-border);
  box-shadow: var(--shadow);
}
.nav-panel {
  background: var(--panel);
}
.detail-panel {
  background: color-mix(in srgb, var(--bg-2) 86%, transparent);
}

.nav-station-row,
.nav-kg,
.kg-card,
.stat-block,
.native-hint,
.kg-model-row,
.native-model-row,
.model-card,
.data-action {
  transition: transform 0.28s var(--ease-spring), background 0.2s ease,
    border-color 0.2s ease, box-shadow 0.24s ease, opacity 0.2s ease;
}
.nav-station-row:hover,
.nav-kg:hover {
  transform: translateX(2px);
}
.kg-card:hover,
.stat-block:hover,
.kg-model-row:hover,
.native-model-row:hover,
.model-card:hover,
.data-action:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-sm);
}

/* 模型列表：从分隔行升级为轻量玻璃条目 */
.kg-model-row,
.native-model-row {
  background: linear-gradient(135deg, var(--panel-2), var(--glass));
  border-color: var(--glass-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}
.kg-model-row.enabled,
.native-model-row.enabled {
  border-left-width: 3px;
  background: linear-gradient(135deg, var(--green-soft), var(--panel-2) 52%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 5px 16px rgba(53, 199, 145, 0.08);
}
.kg-model-row:hover,
.native-model-row:hover {
  border-color: var(--brand-glow);
  background: linear-gradient(135deg, var(--brand-soft), var(--glass-2));
}

.kg-model-name,
.native-model-name,
.mc-name {
  transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.kg-model-name:focus,
.native-model-name:focus,
.mc-name:focus {
  box-shadow: 0 0 0 3px var(--brand-glow);
}

.toggle {
  cursor: pointer;
  transition: background 0.24s ease, box-shadow 0.24s ease, transform 0.24s var(--ease-spring);
}
.toggle:hover { transform: scale(1.06); }
.toggle:active { transform: scale(0.94); }
.toggle .toggle-dot {
  transition: transform 0.3s var(--ease-spring), box-shadow 0.24s ease;
}
.toggle.on .toggle-dot {
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3), 0 0 0 3px var(--green-soft);
}

.primary-btn {
  transition: transform 0.24s var(--ease-spring), background 0.2s ease,
    box-shadow 0.2s ease, border-color 0.2s ease;
}
.primary-btn:hover { transform: translateY(-2px); }

.save-bar {
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  border-top-color: var(--brand);
}

@keyframes modelRowIn {
  from { opacity: 0; transform: translateY(7px) scale(0.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.kg-model-row,
.native-model-row,
.model-card {
  animation: modelRowIn 0.34s var(--ease-smooth) both;
}

@media (prefers-reduced-motion: reduce) {
  .kg-model-row,
  .native-model-row,
  .model-card { animation: none; }
}

/* ─── 暗色粘土工作台：最终视觉收束层 ─────────────── */
:root[data-theme="dark"] {
  --bg: #0d1217;
  --bg-2: #141b22;
  --panel: #18212a;
  --panel-solid: #202b35;
  --panel-2: #111920;
  --glass: rgba(218, 231, 238, 0.045);
  --glass-2: rgba(218, 231, 238, 0.085);
  --glass-border: rgba(181, 204, 214, 0.18);
  --line: #33434e;
  --line-soft: #26343e;
  --text: #f5f7f6;
  --text-2: #d9e4e7;
  --muted: #a9b8be;
  --soft: #7f939d;
  --brand: #c99862;
  --brand-2: #e0b17a;
  --brand-soft: rgba(201, 152, 98, 0.14);
  --brand-glow: rgba(201, 152, 98, 0.28);
  --green: #65d09d;
  --green-soft: rgba(101, 208, 157, 0.14);
  --red: #f07c78;
  --red-soft: rgba(240, 124, 120, 0.14);
  --blue: #8bb7d9;
  --shadow-sm: 0 5px 12px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.035);
  --shadow: 0 16px 38px rgba(0, 0, 0, 0.3);
}

:root[data-theme="dark"] body {
  background: radial-gradient(circle at 12% 0%, rgba(201, 152, 98, 0.08), transparent 27%),
    radial-gradient(circle at 95% 100%, rgba(101, 208, 157, 0.06), transparent 31%), var(--bg);
}

:root[data-theme="dark"] .main-layout {
  background: #26333d;
  border: 1px solid #33434e;
  box-shadow: 0 22px 54px rgba(0, 0, 0, 0.34);
}
:root[data-theme="dark"] .nav-panel { background: #151e26; }
:root[data-theme="dark"] .detail-panel { background: #121a21; }
:root[data-theme="dark"] .detail-card,
:root[data-theme="dark"] .overview { isolation: isolate; }

:root[data-theme="dark"] .stat-block {
  background: linear-gradient(145deg, #202d37, #1a252e);
  border: 1px solid #3a4b56;
  border-radius: 12px;
  box-shadow: 5px 5px 0 rgba(5, 9, 12, 0.24), inset 1px 1px 0 rgba(255, 255, 255, 0.045);
}
:root[data-theme="dark"] .stat-block:hover {
  transform: translateY(-2px);
  border-color: var(--brand);
  box-shadow: 6px 7px 0 rgba(5, 9, 12, 0.28), 0 0 0 3px rgba(201, 152, 98, 0.08);
}
:root[data-theme="dark"] .stat-num { text-shadow: 0 0 18px rgba(201, 152, 98, 0.2); }

/* 独立的激活模型区域：明确框选，不再依赖分隔线 */
:root[data-theme="dark"] .active-board {
  margin-top: 24px;
  padding: 18px;
  border: 1px solid #435560;
  border-top: 3px solid var(--brand);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(32, 45, 55, 0.92), rgba(19, 28, 35, 0.96));
  box-shadow: 7px 7px 0 rgba(5, 9, 12, 0.25), inset 1px 1px 0 rgba(255, 255, 255, 0.045);
}
:root[data-theme="dark"] .active-board-head {
  margin: -2px -2px 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #3a4a55;
}
:root[data-theme="dark"] .active-board-head h3 { color: var(--text); }
:root[data-theme="dark"] .active-model-row {
  margin-top: 8px;
  padding: 12px 12px 12px 14px;
  border: 1px solid #354751;
  border-left: 3px solid var(--green);
  border-radius: 10px;
  background: #18242c;
  box-shadow: 3px 3px 0 rgba(4, 8, 11, 0.2), inset 1px 1px 0 rgba(255, 255, 255, 0.03);
  transition: transform 0.2s var(--ease-spring), border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
:root[data-theme="dark"] .active-model-row:hover {
  transform: translateX(2px);
  border-color: var(--brand);
  background: #1d2b34;
  box-shadow: 4px 4px 0 rgba(4, 8, 11, 0.24), 0 0 0 3px rgba(201, 152, 98, 0.07);
}

:root[data-theme="dark"] .kg-model-row,
:root[data-theme="dark"] .native-model-row,
:root[data-theme="dark"] .model-card {
  border-color: #334550;
  border-radius: 10px;
  background: linear-gradient(145deg, #1a2730, #162129);
  box-shadow: 4px 4px 0 rgba(4, 8, 11, 0.2), inset 1px 1px 0 rgba(255, 255, 255, 0.035);
}
:root[data-theme="dark"] .kg-model-row:hover,
:root[data-theme="dark"] .native-model-row:hover,
:root[data-theme="dark"] .model-card:hover {
  transform: translateY(-1px);
  border-color: var(--brand);
  background: linear-gradient(145deg, #22323c, #1a2730);
  box-shadow: 5px 6px 0 rgba(4, 8, 11, 0.24), 0 0 0 3px rgba(201, 152, 98, 0.07);
}
:root[data-theme="dark"] .kg-model-row.enabled,
:root[data-theme="dark"] .native-model-row.enabled {
  border-left: 4px solid var(--green);
  background: linear-gradient(145deg, rgba(101, 208, 157, 0.16), #182a2c 58%);
  box-shadow: 4px 4px 0 rgba(4, 8, 11, 0.22), 0 0 0 1px rgba(101, 208, 157, 0.12), 0 0 18px rgba(101, 208, 157, 0.08);
}
:root[data-theme="dark"] .kg-model-row.enabled:hover,
:root[data-theme="dark"] .native-model-row.enabled:hover {
  border-color: var(--green);
  box-shadow: 5px 6px 0 rgba(4, 8, 11, 0.24), 0 0 0 3px rgba(101, 208, 157, 0.09);
}
:root[data-theme="dark"] .kg-model-row.elsewhere { opacity: 0.62; filter: saturate(0.72); }
:root[data-theme="dark"] .kg-model-name:focus,
:root[data-theme="dark"] .native-model-name:focus,
:root[data-theme="dark"] .mc-name:focus {
  background: #25343e;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(201, 152, 98, 0.16), inset 1px 1px 0 rgba(255, 255, 255, 0.05);
}
:root[data-theme="dark"] .active-status,
:root[data-theme="dark"] .active-pending { border-radius: 6px; }

@media (prefers-reduced-motion: reduce) {
  :root[data-theme="dark"] .stat-block:hover,
  :root[data-theme="dark"] .active-model-row:hover,
  :root[data-theme="dark"] .kg-model-row:hover,
  :root[data-theme="dark"] .native-model-row:hover,
  :root[data-theme="dark"] .model-card:hover { transform: none; }
}

/* B · 喜茶式极简模型工作台 */
:root { --bg:#fff; --bg-2:#fff; --panel:#fff; --panel-solid:#fff; --panel-2:#fff; --glass:#fff; --glass-2:#fafafa; --glass-border:#e8e8e8; --line:#e8e8e8; --line-soft:#eee; --text:#171717; --text-2:#333; --muted:#777; --soft:#999; --brand:#171717; --brand-2:#171717; --brand-soft:#f5f5f5; --brand-glow:#d9eb7f; --green:#171717; --green-soft:#f5f5f5; --blue:#777; --font:'Microsoft YaHei UI','PingFang SC',sans-serif; }
html,body { background:#fff; color:#171717; font-size:14px; overflow:auto; }
#app-shell { min-height:100vh; height:auto; background:#fff; }
.topbar { position:sticky; top:0; z-index:20; height:72px; background:#fff; border-bottom:1px solid #e8e8e8; box-shadow:none; }
.topbar-inner { max-width:none; padding:0 32px; gap:32px; }
.brand-mark,.brand-subtitle { display:none; }
.brand-text h1 { color:#171717; font-size:22px; letter-spacing:-.04em; }
.brand-text { gap:0; }
.main-tabs { display:flex; align-self:stretch; align-items:center; gap:28px; margin-right:auto; }
.main-tab { height:100%; padding:0 2px; border:0; border-bottom:2px solid transparent; color:#777; background:none; font:inherit; cursor:pointer; }
.main-tab.active { color:#171717; border-bottom-color:#171717; }
.topbar-actions { gap:8px; }
.top-btn { color:#555; background:#fff; border:1px solid #e8e8e8; border-radius:5px; box-shadow:none; }
.top-btn-accent { color:#171717; background:#d9eb7f; border-color:#d9eb7f; }
.top-btn-label { display:inline; }
.main-layout { display:grid; grid-template-columns:176px minmax(520px,1fr) 270px; gap:28px; width:auto; max-width:none; height:auto; min-height:calc(100vh - 72px); margin:0; padding:36px 32px 64px; overflow:visible; }
.nav-panel { display:block; overflow:visible; padding:0; background:#fff; border:0; box-shadow:none; }
.station-tree,.add-btn { display:none; }
.model-filters { display:flex; flex-direction:column; gap:4px; }
.nav-filter { display:flex; justify-content:space-between; width:100%; padding:10px 12px; text-align:left; color:#555; background:none; border:0; border-radius:5px; font:inherit; cursor:pointer; }
.nav-filter span:last-child { color:#999; }
.nav-filter.active { color:#171717; background:#f5f5f5; box-shadow:inset 3px 0 #d9eb7f; }
.filter-caption { margin:24px 12px 8px; color:#999; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.detail-panel { min-width:0; overflow:visible; background:#fff; border:0; box-shadow:none; }
.models-home { max-width:1000px; margin:0 auto; }
.models-page-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin:5px 0 36px; }
.eyebrow { margin-bottom:10px; color:#888; font-size:11px; letter-spacing:.1em; }
.models-page-head h2 { font-size:36px; line-height:1.2; letter-spacing:-.055em; font-weight:600; }
.search-wrap { width:min(320px,42%); flex:0 0 auto; }
#search-models { padding:12px 14px 12px 38px; color:#171717; background:#fff; border:1px solid #ddd; border-radius:5px; font-size:13px; }
#search-models:focus { border-color:#777; box-shadow:0 0 0 2px #eee; }
.models-list-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:4px; padding:0 8px 14px; border-bottom:1px solid #ddd; font-weight:600; }
.models-list-head span:last-child { color:#888; font-size:12px; font-weight:400; }
.model-list-area { padding:0 0 64px; overflow:visible; }
.model-card { display:grid; grid-template-columns:48px minmax(180px,1fr) minmax(210px, .8fr) 40px; align-items:center; gap:16px; min-height:104px; margin:0; padding:16px 8px; background:#fff; border:0; border-bottom:1px solid #e8e8e8; border-radius:0; box-shadow:none; }
.model-card:hover { background:#fcfcfa; border-color:#e8e8e8; }
.model-card.pending-enable,.model-card.pending-switch,.model-card.pending-disable { border-left:0; background:#f5fbed; }
.model-brand-icon { display:grid; width:44px; height:44px; place-items:center; }
.model-brand-icon img { width:32px; height:32px; object-fit:contain; }
.model-row-main { min-width:0; }
.model-title-line { display:flex; align-items:center; gap:8px; }
.mc-name { min-width:0; padding:0; color:#171717; font-size:19px; font-weight:600; }
.mc-name:hover,.mc-name:focus { background:transparent; border-color:transparent; box-shadow:none; }
.star-btn { color:#aaa; font-size:17px; }
.star-btn.on { color:#99ae45; }
.mc-realid { overflow:hidden; margin-top:4px; color:#888; font-family:ui-monospace,monospace; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.capability-tags { display:flex; gap:6px; margin-top:7px; }
.capability-tags span { padding:2px 6px; color:#555; background:#f4f4f1; border-radius:3px; font-size:10px; }
.model-source-control { display:flex; flex-direction:column; gap:5px; min-width:0; }
.model-source-control select { width:100%; padding:8px 28px 8px 9px; color:#444; background:#fff; border:1px solid #e3e3e3; border-radius:4px; font:inherit; font-size:12px; }
.model-source-control small { overflow:hidden; color:#999; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.toggle { width:34px; height:20px; background:#ddd; border:0; border-radius:14px; box-shadow:none; }
.toggle.on { background:#d9eb7f; }
.toggle-dot { width:14px; height:14px; background:#fff; box-shadow:0 1px 3px #0002; }
.toggle.on .toggle-dot { left:17px; }
.change-summary { position:sticky; top:100px; align-self:start; min-height:300px; padding:20px 18px; border:1px solid #e8e8e8; border-radius:6px; background:#fff; }
.change-head { display:flex; justify-content:space-between; align-items:center; padding-bottom:16px; border-bottom:1px solid #eee; }
.change-head h3 { margin-bottom:5px; font-size:17px; }
.change-head span { color:#888; font-size:11px; }
.change-count { display:grid; width:28px; height:28px; place-items:center; color:#171717!important; background:#d9eb7f; border-radius:50%; }
.change-empty { display:flex; flex-direction:column; align-items:center; padding:44px 8px; text-align:center; }
.change-empty span { display:grid; width:30px; height:30px; margin-bottom:14px; place-items:center; background:#f5f7ee; border-radius:50%; }
.change-empty strong { font-size:13px; }
.change-empty p,.change-note { margin-top:8px; color:#888; font-size:11px; line-height:1.6; }
.change-list { display:flex; flex-direction:column; gap:0; max-height:45vh; margin:8px 0; overflow:auto; list-style:none; }
.change-list li { display:flex; flex-direction:column; gap:4px; padding:12px 0; border-bottom:1px solid #f0f0f0; }
.change-list b { color:#788a34; font-size:10px; font-weight:500; }
.change-list span { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.change-actions { display:flex; flex-direction:column; gap:8px; margin-top:18px; }
.change-actions button { width:100%; min-height:38px; border-radius:4px; }
.change-actions .primary-btn { color:#171717; background:#d9eb7f; border-color:#d9eb7f; box-shadow:none; }
.change-actions .ghost-btn { border:1px solid #e5e5e5; }
.save-bar { display:none!important; }
.providers-page .main-layout { grid-template-columns:240px minmax(0,1fr); max-width:1320px; margin:auto; }
.providers-page .model-filters,.providers-page .change-summary { display:none; }
.providers-page .station-tree { display:block; }
.providers-page .add-btn { display:flex; }
.providers-page .detail-panel { padding:20px; border:1px solid #e8e8e8; }
.providers-page .nav-panel { padding:18px 10px; border-right:1px solid #eee; }
@media (max-width:1199px) { .main-layout { grid-template-columns:150px minmax(0,1fr); } .change-summary { grid-column:2; position:static; min-height:0; } .change-empty { padding:24px 8px; } }
@media (max-width:760px) { .topbar { height:auto; } .topbar-inner { flex-wrap:wrap; padding:12px 16px; gap:12px; } .main-tabs { order:3; width:100%; height:38px; } .topbar-actions { margin-left:auto; } .topbar-actions .top-btn:not(.top-btn-accent) { display:none; } .main-layout { display:flex; flex-direction:column; gap:18px; padding:24px 16px 100px; } .nav-panel { order:0; } .detail-panel { order:1; } .change-summary { order:2; } .model-filters { display:grid; grid-template-columns:repeat(3,1fr); } .filter-caption,.vendor-filter { display:none; } .models-page-head { align-items:stretch; flex-direction:column; margin:0 0 24px; } .models-page-head h2 { font-size:29px; } .search-wrap { width:100%; } .model-card { grid-template-columns:38px minmax(0,1fr) 34px; gap:10px; min-height:96px; padding:14px 2px; } .model-brand-icon { width:36px; height:36px; } .model-brand-icon img { width:30px; height:30px; } .model-source-control { grid-column:2; grid-row:2; } .model-card .toggle { grid-column:3; grid-row:1; } .mc-name { font-size:16px; } .model-source-control small { display:none; } .providers-page .main-layout { display:grid; grid-template-columns:1fr; } .providers-page .nav-panel { order:0; border:0; } }

/* B 版工作台：清除旧版深色皮肤对统一白底界面的局部覆盖。 */
.topbar-actions .top-btn:not(.top-btn-accent) { display:none; }
.providers-page .topbar-actions .top-btn:not(.top-btn-accent) { display:inline-flex; }
.topbar::after { display:none!important; }
.top-btn-accent { color:#171717!important; background:#d9eb7f!important; border-color:#d9eb7f!important; }
#search-models { color:#171717!important; background:#fff!important; border-color:#ddd!important; }

/* 中转站与记录仍沿用原结构，但表单和弹窗需与 B 版白底保持一致。 */
.providers-page .nav-panel,
.providers-page .detail-panel { color:#171717; background:#fff; }
.providers-page .form-input,
.providers-page .kg-card,
.providers-page .kg-stat,
.providers-page .native-hint,
.providers-page .kg-model-row,
.providers-page .native-model-row,
.refresh-report-modal { color:#171717; background:#fff; }
.providers-page .form-input { border-color:#d9d9d9; }
.providers-page .form-input::placeholder { color:#999; }
.providers-page .form-label,
.providers-page .form-hint,
.providers-page .muted { color:#777; }
.providers-page .ghost-btn { color:#555; background:#fff; border-color:#ddd; }
.providers-page .primary-btn { color:#171717; }
.providers-page .nav-station-row { color:#555; background:transparent; }
.providers-page .nav-station-row:hover { background:#f6f6f3; }
.providers-page .nav-station.active .nav-station-row { color:#171717; background:#f5f5f5; box-shadow:inset 3px 0 #d9eb7f; }
.providers-page .nav-station-name { color:#555; }
.providers-page .nav-station.active .nav-station-name { color:#171717; }
.providers-page .nav-station-count { color:#777; background:#f2f2f2; }
.providers-page .nav-toggle { color:#777; }
.providers-page .add-btn { color:#171717; background:#f5f8e9; border-color:#e3e9cb; }
.providers-page .add-btn:hover { color:#171717; background:#d9eb7f; border-color:#d9eb7f; }
.refresh-report-modal .modal-head,
.refresh-report-modal .modal-body { color:#171717; }
.refresh-report-modal .refresh-report-main strong { color:#171717; }
.refresh-report-modal .refresh-report-detail,
.refresh-report-modal .refresh-time { color:#777; }
.refresh-report-modal .refresh-sync-summary { color:#555; background:#f7f7f7; border-color:#e8e8e8; }
.refresh-report-modal .refresh-sync-summary strong { color:#171717; }
.refresh-report-modal .mini-btn { color:#315fc4; background:#eef4ff; border-color:#cbd9ff; }
:root[data-theme="dark"] .providers-page .nav-panel,
:root[data-theme="dark"] .providers-page .detail-panel { color:#171717; background:#fff; }
:root[data-theme="dark"] .providers-page .form-input,
:root[data-theme="dark"] .providers-page .kg-card,
:root[data-theme="dark"] .providers-page .kg-stat,
:root[data-theme="dark"] .providers-page .native-hint,
:root[data-theme="dark"] .providers-page .kg-model-row,
:root[data-theme="dark"] .providers-page .native-model-row { color:#171717; background:#fff; }
:root[data-theme="dark"] .providers-page .form-input { border-color:#d9d9d9; }
:root[data-theme="dark"] .providers-page .ghost-btn { color:#555; background:#fff; border-color:#ddd; }
:root[data-theme="dark"] .providers-page .nav-station-row,
:root[data-theme="dark"] .providers-page .nav-station-name,
:root[data-theme="dark"] .providers-page .nav-toggle { color:#555; background:transparent; }
:root[data-theme="dark"] .providers-page .nav-station.active .nav-station-row { color:#171717; background:#f5f5f5; box-shadow:inset 3px 0 #d9eb7f; }
:root[data-theme="dark"] .providers-page .nav-station.active .nav-station-name { color:#171717; }
:root[data-theme="dark"] .providers-page .nav-station-count { color:#777; background:#f2f2f2; }
:root[data-theme="dark"] .providers-page .add-btn { color:#171717; background:#f5f8e9; border-color:#e3e9cb; }
:root[data-theme="dark"] .refresh-report-modal { color:#171717; background:#fff; }
:root[data-theme="dark"] body,
:root[data-theme="dark"] #app-shell { color:#171717; background:#fff; }
:root[data-theme="dark"] .topbar { color:#171717; background:#fff; border-color:#e8e8e8; }
:root[data-theme="dark"] .main-layout,
:root[data-theme="dark"] .nav-panel,
:root[data-theme="dark"] .detail-panel { color:#171717; background:#fff; border-color:#e8e8e8; box-shadow:none; }
:root[data-theme="dark"] .models-home,
:root[data-theme="dark"] .models-page-head h2,
:root[data-theme="dark"] .models-list-head,
:root[data-theme="dark"] .change-summary { color:#171717; background:#fff; }
:root[data-theme="dark"] .model-card,
:root[data-theme="dark"] .model-card:hover { color:#171717; background:#fff; border-color:#e8e8e8; box-shadow:none; }
:root[data-theme="dark"] .model-card.pending-enable,
:root[data-theme="dark"] .model-card.pending-switch,
:root[data-theme="dark"] .model-card.pending-disable { background:#f5fbed; }
:root[data-theme="dark"] .mc-name,
:root[data-theme="dark"] .model-source-control select,
:root[data-theme="dark"] #search-models { color:#171717; background:#fff; }
:root[data-theme="dark"] .modal-box { color:#171717; background:#fff; }
:root[data-theme="dark"] .top-btn { color:#555; background:#fff; border-color:#e8e8e8; }
:root[data-theme="dark"] .top-btn-accent { color:#171717; background:#d9eb7f; border-color:#d9eb7f; }

@media (max-width:760px) {
  .providers-page .topbar-actions .top-btn:not(.top-btn-accent) { display:none; }
  .topbar-actions .top-btn-label { display:none; }
  .topbar-actions .top-btn { min-width:38px; padding:9px 11px; }
  .providers-page .main-layout { width:auto; max-width:none; margin:0; padding:18px 16px 64px; }
  .providers-page .detail-panel { padding:18px 14px; }
}
/* 日常模型工作流：两栏清单，来源与检查结果保持同一阅读行。 */
.main-layout { width:100%; grid-template-columns:164px minmax(0,1fr); max-width:1440px; margin:auto; gap:36px; border:0; border-radius:0; box-shadow:none; }
.detail-panel { padding:0; }
:root[data-theme="dark"] .main-layout { border:0; border-radius:0; }
:root[data-theme="dark"] .workflow-toolbar .ghost-btn,:root[data-theme="dark"] .workflow-dialog .ghost-btn,:root[data-theme="dark"] .workflow-row-actions .ghost-btn { color:#333; background:#fff; }
.models-home { max-width:1100px; }
.models-page-head { align-items:center; margin-bottom:24px; }
.models-page-head h2 { font-size:32px; letter-spacing:-.025em; }
.home-subtitle { margin-top:12px; color:#777; font-size:13px; }
.workflow-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:18px 0 24px; }
.workflow-toolbar .primary-btn,.workflow-dialog .primary-btn { background:#d9eb7f; color:#171717; border:1px solid #cddd74; border-radius:5px; box-shadow:none; }
.workflow-toolbar .ghost-btn,.workflow-dialog .ghost-btn,.workflow-row-actions .ghost-btn { color:#333; background:#fff; border:1px solid #ddd; border-radius:5px; box-shadow:none; padding:9px 12px; }
.text-btn { border:0; padding:8px; background:transparent; color:#666; font:inherit; font-size:12px; cursor:pointer; }
.attention-banner { display:flex; justify-content:space-between; align-items:center; width:auto; gap:20px; margin:0 0 16px; padding:8px 12px; text-align:left; color:#333; background:#f6f7f2; border:1px solid #e6e9db; border-radius:6px; font:inherit; cursor:pointer; }
.attention-banner strong { display:block; font-weight:500; font-size:13px; }
.attention-banner small { display:block; margin-top:6px; font-size:12px; color:#777; }
.attention-banner > span:last-child { flex-shrink:0; font-size:12px; }
.attention-banner.has-warning { background:#fff8ed; border-color:#f0dec0; }
.health-warning,.workflow-current small.health-warning { color:#9a4b17; }
.workflow-model { grid-template-columns:44px minmax(0,1fr) 220px; min-height:98px; gap:14px; }
.workflow-model-name { color:#171717; font-size:19px; font-weight:500; overflow-wrap:anywhere; }
.workflow-current { display:flex; min-width:0; flex-direction:column; gap:8px; }
.workflow-current strong { color:#333; font-size:13px; font-weight:500; overflow-wrap:anywhere; }
.workflow-current small { color:#777; font-size:11px; line-height:1.6; }
.workflow-row-actions { display:flex; justify-content:flex-end; gap:4px; align-items:center; }
.workflow-row-actions .ghost-btn { white-space:nowrap; font-size:12px; }
.workflow-row-actions .text-btn { font-size:18px; }
.workflow-receipt { display:flex; justify-content:space-between; align-items:center; padding:8px 12px; margin-bottom:16px; background:#f5fbed; font-size:12px; }
.change-summary { grid-column:2; position:static; min-height:0; }
.change-summary[hidden] { display:none; }
.change-summary .change-list { max-height:180px; }
.change-actions { flex-direction:row; }
.change-actions button { width:auto; min-width:140px; }
.save-bar[style*="flex"] { display:flex!important; position:fixed; bottom:18px; left:50%; transform:translateX(-50%); width:calc(100% - 32px); max-width:900px; z-index:30; color:#171717; background:#f7faed; border:1px solid #cfdaaa; box-shadow:0 4px 24px #0001; }
.save-bar .primary-btn { color:#171717; background:#d9eb7f; border-color:#d9eb7f; }
.workflow-dialog { width:min(760px,calc(100vw - 32px)); max-width:760px; max-height:85vh; overflow:auto; color:#171717!important; background:#fff!important; border:1px solid #e8e8e8; border-radius:10px; box-shadow:0 20px 70px #0002; }
.workflow-dialog .modal-head { position:sticky; top:0; z-index:1; padding:22px 24px; background:#fff; border-bottom:1px solid #eee; }
.workflow-dialog .modal-body { padding:24px; max-height:none; overflow:visible; }
.workflow-dialog .modal-close { color:#555; background:#f6f6f6; }
.workflow-dialog h4 { font-size:13px; color:#666; font-weight:500; }
.workflow-note { color:#777; font-size:12px; line-height:1.8; margin-bottom:24px; }
.dialog-model-id { color:#171717; font-size:19px; overflow-wrap:anywhere; margin-bottom:12px; }
:root[data-theme="dark"] .workflow-dialog .dialog-model-id { color:#171717; }
:root[data-theme="dark"] .workflow-dialog .workflow-note { color:#666; }
.source-choice-list section + section { margin-top:24px; }
.source-choice { display:flex; justify-content:space-between; align-items:center; gap:16px; width:100%; text-align:left; padding:16px 4px; border:0; border-bottom:1px solid #e8e8e8; color:#333; background:#fff; font:inherit; cursor:pointer; }
.source-choice:hover { background:#f5fbed; }
.source-choice strong { font-size:15px; font-weight:500; }
.source-choice small { display:block; margin-top:6px; color:#777; font-size:11px; }
.source-choice > span:last-child { flex-shrink:0; font-size:13px; }
.attention-model { display:flex; flex-direction:column; gap:12px; padding:18px 0; border-bottom:1px solid #eee; }
.attention-model strong { font-weight:500; overflow-wrap:anywhere; }
.attention-model small,.attention-source small { display:block; margin-top:5px; color:#777; font-size:12px; line-height:1.6; }
.attention-target,.workflow-dialog .form-input { width:100%; padding:10px; border:1px solid #ddd; background:#fff; color:#333; border-radius:4px; }
.attention-models + .primary-btn { margin-top:20px; }
.attention-subhead { margin-top:32px; }
.attention-source { padding:14px 0; border-bottom:1px solid #eee; }
.attention-source strong { color:#333; font-weight:500; font-size:13px; }
.attention-source details { margin-top:8px; color:#777; font-size:12px; overflow-wrap:anywhere; }
.attention-source summary { cursor:pointer; }
.attention-source details p { margin-top:8px; line-height:1.7; }
#workflow-error { margin-top:12px; font-size:13px; }
.workflow-model:focus-within,.source-choice:focus-visible,.text-btn:focus-visible,.attention-banner:focus-visible { outline:2px solid #9baa5d; outline-offset:2px; }
:root[data-theme="dark"] .workflow-model,:root[data-theme="dark"] .workflow-model:hover { border-radius:0; transform:none; }
@media(max-width:1100px) { .main-layout { gap:24px; padding:28px 24px 100px; grid-template-columns:135px minmax(0,1fr); } .workflow-model { grid-template-columns:44px minmax(0,1fr) 200px; gap:10px; } .models-page-head { align-items:flex-start; flex-direction:column; gap:18px; } .search-wrap { width:100%; } }
@media(max-width:760px) { .main-layout { display:flex; padding:24px 16px 110px; } .models-page-head h2 { font-size:27px; } .workflow-model { grid-template-columns:36px minmax(0,1fr); gap:10px; padding:18px 2px; } .workflow-model .workflow-current { grid-column:2 / 4; grid-row:2; } .workflow-model .workflow-row-actions { grid-column:3; grid-row:1; } .workflow-model-name { font-size:15px; } .workflow-model .star-btn { display:none; } .attention-banner { gap:10px; padding:13px; } .attention-banner > span:last-child { max-width:56px; } .workflow-dialog .modal-body { padding:18px; } .workflow-dialog .modal-head { padding:18px; } .change-summary { width:100%; } .save-bar { flex-wrap:wrap; gap:10px; padding:12px; } .source-choice { gap:10px; } }

/* 青柠主页：布局、来源浮层和空态的单一维护区。 */
body:not(.providers-page) .main-layout { display:block; max-width:1120px; padding:48px 32px 100px; background:#fff; }
body:not(.providers-page) .nav-panel, body:not(.providers-page) .topbar-actions { display:none; }
.models-home { max-width:none; }
.models-page-head { justify-content:space-between; flex-direction:row; }
.models-page-head .primary-btn { background:#d9eb7f; color:#171717; border:1px solid #cddd74; box-shadow:none; border-radius:6px; padding:12px 18px; }
.workflow-toolbar { justify-content:space-between; }
.source-trigger { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:12px 16px; border:1px solid #d6d8d0; border-radius:6px; background:#fff; text-align:left; }
.source-trigger span:first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.source-trigger:focus-visible, .models-home button:focus-visible, .workflow-dialog button:focus-visible { outline:2px solid #829b29; outline-offset:3px; }
.workflow-model:hover { background:#fafbf7; }
.source-choice { padding:12px 10px; border-radius:6px; gap:12px; }
.source-choice.selected { background:#eff8d4; }
.source-choice:disabled { cursor:not-allowed; opacity:.65; }
.source-copy { flex:1; min-width:0; overflow-wrap:anywhere; }
.station-avatar { display:grid; place-items:center; flex:0 0 32px; height:32px; border-radius:8px; color:#333; background:#eef0e8; font-size:14px; }
.source-empty { text-align:center; padding:16px 0; color:#666; font-size:13px; }
.source-empty img { width:80px; height:60px; }
.empty-art { display:block; width:128px; height:96px; margin:0 auto 20px; }
.models-empty p { margin-bottom:18px; }
.source-picker { animation:lime-enter 140ms ease-out; }
@media(min-width:761px) { .source-picker-overlay { background:transparent; backdrop-filter:none; } }
@keyframes lime-enter { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:reduce) { .source-picker { animation:none; } }
:root[data-theme="dark"] body:not(.providers-page),
:root[data-theme="dark"] body:not(.providers-page) #app-shell,
:root[data-theme="dark"] body:not(.providers-page) .topbar,
:root[data-theme="dark"] body:not(.providers-page) .main-layout,
:root[data-theme="dark"] body:not(.providers-page) .detail-panel,
:root[data-theme="dark"] .models-home,
:root[data-theme="dark"] .models-page-head h2,
:root[data-theme="dark"] .models-list-head,
:root[data-theme="dark"] .workflow-model { background:#181b17; color:#f0f2ea; border-color:#353b30; }
:root[data-theme="dark"] body:not(.providers-page) .brand-text h1,
:root[data-theme="dark"] body:not(.providers-page) .main-tab,
:root[data-theme="dark"] .workflow-model-name { color:#f0f2ea; }
:root[data-theme="dark"] .source-trigger,
:root[data-theme="dark"] .workflow-dialog,
:root[data-theme="dark"] .workflow-dialog .modal-head,
:root[data-theme="dark"] .source-choice,
:root[data-theme="dark"] #search-models { background:#22271f!important; color:#f0f2ea!important; border-color:#46503d; }
:root[data-theme="dark"] .workflow-model:hover { background:#22271f; }
:root[data-theme="dark"] .source-choice.selected { background:#354124!important; }
:root[data-theme="dark"] .workflow-dialog .dialog-model-id,
:root[data-theme="dark"] .workflow-dialog .workflow-note,
:root[data-theme="dark"] .source-choice small,
:root[data-theme="dark"] .workflow-dialog .text-btn { color:#c1cab7; }
:root[data-theme="dark"] .health-warning { color:#ecb47d; }
:root[data-theme="dark"] .model-brand-icon { background:#f0f2ea; border-radius:8px; }
:root[data-theme="dark"] .models-home .text-btn { color:#c1cab7; }
@media(max-width:760px) {
  body:not(.providers-page) .main-layout { padding:28px 16px 100px; }
  .models-page-head { align-items:center; gap:12px; }
  .models-page-head h2 { font-size:27px; }
  .models-page-head .primary-btn { padding:10px 12px; white-space:nowrap; }
  .workflow-toolbar .search-wrap { flex:1; min-width:0; }
  .workflow-model .source-trigger { grid-column:2; }
  .workflow-model-name { font-size:18px; }
  .main-tabs { width:auto; order:0; margin-left:auto; }
  .topbar-inner { gap:12px; }
}

/* 中转站设置：把站点列表整理成轻量便利贴看板，保留原编辑与选择行为。 */
.providers-page .main-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 22px;
  width: min(100% - 56px, 1280px);
  max-width: 1280px;
  margin: 0 auto;
  padding: 32px 0 110px;
}
.providers-page .nav-panel {
  display: block;
  min-width: 0;
  overflow: visible;
  padding: 0;
  border: 0;
  background: transparent;
}
.providers-page .station-tree {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  overflow: visible;
  padding: 0;
}
.providers-page .station-board-intro {
  grid-column: 1 / -1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 3px;
  color: #171717;
}
.providers-page .station-board-intro h2 { font-size: 22px; line-height: 1.2; letter-spacing: -.025em; }
.providers-page .station-board-intro p { margin-top: 6px; color: #777; font-size: 13px; }
.providers-page .station-board-intro > span { padding-bottom: 2px; color: #777; font-size: 12px; white-space: nowrap; }
.providers-page .station-note {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 18px 17px 15px;
  overflow: hidden;
  cursor: pointer;
  color: #171717;
  background: #fffef8;
  border: 1px solid #e9e6d9;
  border-radius: 12px;
  box-shadow: 0 2px 4px rgba(40, 39, 25, .035), 0 8px 18px rgba(40, 39, 25, .045);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.providers-page .station-note::before {
  position: absolute;
  top: 0;
  left: 50%;
  width: 44px;
  height: 8px;
  content: '';
  background: #d9eb7f;
  border-radius: 0 0 4px 4px;
  transform: translateX(-50%);
}
.providers-page .station-note:hover {
  border-color: #d7dcbd;
  box-shadow: 0 5px 10px rgba(40, 39, 25, .045), 0 12px 22px rgba(40, 39, 25, .06);
  transform: translateY(-2px);
}
.providers-page .station-note.active {
  background: #f8faef;
  border-color: #dce5b9;
  box-shadow: 0 0 0 2px rgba(217, 235, 127, .28), 0 8px 20px rgba(40, 39, 25, .055);
}
.providers-page .station-note.active::before { background: #bfd64d; }
.providers-page .station-note .nav-station-row {
  min-width: 0;
  min-height: 29px;
  gap: 9px;
  padding: 0;
  color: #171717;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}
.providers-page .station-note .nav-station-row:hover { background: transparent; }
.providers-page .station-note-pin {
  display: inline-grid;
  flex: 0 0 12px;
  place-items: center;
  width: 12px;
  height: 12px;
  color: #82845c;
  font-size: 10px;
}
.providers-page .station-note:not(.overview-nav):not(.native) .station-note-pin::before {
  width: 8px;
  height: 8px;
  content: '';
  background: #d9eb7f;
  border: 1px solid rgba(105, 119, 48, .22);
  border-radius: 50%;
  box-shadow: 0 1px 1px rgba(30, 35, 10, .12);
}
.providers-page .station-note .nav-station-name,
.providers-page .station-note.active .nav-station-name {
  min-width: 0;
  color: #171717;
  font-size: 15px;
  font-weight: 650;
}
.providers-page .station-note .nav-station-count {
  flex: 0 0 auto;
  padding: 4px 7px;
  color: #555;
  background: #f2f1e9;
  border-radius: 999px;
  font-family: inherit;
  font-size: 11px;
}
.providers-page .station-note-endpoint {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  padding-top: 11px;
  border-top: 1px dashed #e4e1d4;
}
.providers-page .station-note-endpoint span { color: #888; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.providers-page .station-note-endpoint code {
  min-width: 0;
  overflow: hidden;
  color: #555;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.providers-page .station-note-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  margin-top: 10px;
  color: #777;
  font-size: 11px;
}
.providers-page .station-note-expand {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  padding: 3px 0 3px 6px;
  color: #59632f;
  background: transparent;
  font-size: 11px;
}
.providers-page .station-note-expand span { font-size: 14px; line-height: 1; }
.providers-page .station-note .nav-kg-list {
  margin-top: 10px;
  padding: 9px 0 0;
  border-top: 1px dashed #e4e1d4;
}
.providers-page .station-note .nav-kg { padding: 7px 8px; }
.providers-page .station-note .nav-kg:hover,
.providers-page .station-note .nav-kg.active { background: #f0f3e5; }
.providers-page .station-note.overview-nav,
.providers-page .station-note.native { min-height: 112px; cursor: pointer; }
.providers-page .station-note.overview-nav .station-note-meta,
.providers-page .station-note.native .station-note-meta { margin: 13px 0 0 21px; }
.providers-page .station-note.overview-nav::before { background: #e9e6d9; }
.providers-page .station-note.native::before { background: #cdd9e0; }
.providers-page .add-btn {
  width: fit-content;
  min-width: 190px;
  margin: 14px 0 0;
  color: #414820;
  background: #f7f9ed;
  border-color: #dce5b9;
  border-radius: 10px;
}
.providers-page .add-btn:hover { color: #171717; background: #d9eb7f; border-color: #d9eb7f; }
.providers-page .detail-panel { min-width: 0; padding: 0; border: 0; background: transparent; }
.providers-page .detail-card { max-width: 1120px; }
.providers-page .station-detail-card {
  position: relative;
  padding: 27px 30px 30px;
  background: #fffef8;
  border: 1px solid #e9e6d9;
  border-radius: 14px;
  box-shadow: 0 3px 8px rgba(40, 39, 25, .035), 0 12px 24px rgba(40, 39, 25, .045);
}
.providers-page .station-detail-card::before {
  position: absolute;
  top: 0;
  left: 30px;
  width: 54px;
  height: 9px;
  content: '';
  background: #d9eb7f;
  border-radius: 0 0 5px 5px;
}
.providers-page .station-detail-card .detail-head { margin-bottom: 24px; }
.providers-page .station-detail-card .kg-section { margin-top: 26px; padding-top: 20px; border-top: 1px dashed #e4e1d4; }
.providers-page .station-detail-card .kg-card { background: #fff; border-color: #e9e6d9; }

@media (max-width: 980px) {
  .providers-page .station-tree { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .providers-page .main-layout { width: auto; padding: 22px 18px 88px; }
  .providers-page .station-tree { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .providers-page .station-detail-card { padding: 25px 20px 22px; }
  .providers-page .station-detail-card::before { left: 20px; }
}
@media (max-width: 540px) {
  .providers-page .main-layout { gap: 18px; padding: 18px 14px 76px; }
  .providers-page .station-tree { grid-template-columns: minmax(0, 1fr); gap: 11px; }
  .providers-page .station-board-intro { align-items: center; }
  .providers-page .station-board-intro h2 { font-size: 20px; }
  .providers-page .station-note.overview-nav,
  .providers-page .station-note.native { min-height: 0; }
  .providers-page .station-detail-card { padding: 24px 16px 18px; }
  .providers-page .station-detail-card::before { left: 16px; }
}

/* R2 sticky-note workstation */
body:has(.sticky-workspace) { min-width:320px; background-color:#f5f1e8; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)' opacity='.14'/%3E%3C/svg%3E"),radial-gradient(ellipse at 12% 8%,rgba(255,255,255,.9),transparent 48%),linear-gradient(120deg,rgba(255,255,255,.25),rgba(221,211,191,.12)); background-size:180px 180px,auto,auto; background-attachment:fixed; color:#20201e; }
body:has(.sticky-workspace)::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; background-color:#f5f1e8; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)' opacity='.16'/%3E%3C/svg%3E"), radial-gradient(ellipse at 12% 8%,rgba(255,255,255,.9),transparent 48%),linear-gradient(120deg,rgba(255,255,255,.25),rgba(221,211,191,.12)); background-size:180px 180px,auto,auto; opacity:.72; }
:root[data-theme] body:has(.sticky-workspace) { background-color:#f5f1e8; color:#20201e; }
:root[data-theme] body:has(.sticky-workspace) .topbar.sticky-topbar { background:rgba(249,247,241,.9); color:#262521; border-color:rgba(77,68,54,.15); }
.sticky-workspace { min-height:100vh; }
#app-shell.sticky-workspace { background:transparent!important; }
.topbar.sticky-topbar { position:sticky; top:0; z-index:30; height:60px; background:rgba(249,247,241,.9); border-bottom:1px solid rgba(77,68,54,.15); backdrop-filter:blur(12px); box-shadow:none; }
.sticky-topbar::after { display:none; }
.sticky-brand { display:flex; align-items:baseline; gap:14px; margin-right:auto; }
.sticky-brand h1 { margin:0; color:#262521; font-size:23px; line-height:1; font-weight:760; letter-spacing:.01em; }
.sticky-brand span { color:#77746d; font-size:15px; font-weight:520; }
.sticky-header-actions { display:flex; gap:8px; }
.icon-action { display:grid; place-items:center; width:36px; height:36px; border:1px solid transparent; border-radius:9px; background:transparent; color:#6d6a63; font:inherit; font-size:21px; cursor:pointer; }
.icon-action:hover,.icon-action:focus-visible { border-color:#d4cec1; background:#fffdf8; color:#252420; outline:none; }
.sticky-main { display:block; width:100%; max-width:1600px; box-sizing:border-box; flex:1 0 auto; margin:0 auto; padding:20px 3.1vw 112px; }
.station-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:50px; }
.station-toolbar-left { display:flex; align-items:center; gap:18px; }
.station-add-button { height:46px; padding:0 19px; display:flex; align-items:center; gap:9px; border:1px solid #282825; border-radius:9px; background:#292a28; color:#fff; font:inherit; font-size:16px; font-weight:650; box-shadow:0 3px 7px rgba(35,34,31,.15); cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,background .16s ease; }
.station-add-button span { font-size:21px; line-height:1; }
.station-add-button:hover { transform:translateY(-1px); background:#171816; box-shadow:0 6px 13px rgba(35,34,31,.18); }
.station-filter { display:flex; align-items:center; gap:4px; }
.station-filter button { min-height:42px; padding:0 17px; border:1px solid transparent; border-radius:8px; background:transparent; color:#67645e; font:inherit; font-weight:570; cursor:pointer; }
.station-filter button.active { border-color:#d4cec2; background:rgba(255,255,255,.73); color:#272622; box-shadow:0 2px 5px rgba(38,35,29,.07); }
.station-search,.station-model-search { display:flex; align-items:center; gap:10px; height:46px; padding:0 14px; border:1px solid #cbc6bd; border-radius:10px; background:rgba(255,255,255,.52); color:#77736c; }
.station-search { width:min(330px,32vw); }
.station-search span,.station-model-search span { font-size:26px; line-height:1; transform:rotate(-15deg); }
.station-search input,.station-model-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:#262521; font:inherit; font-size:15px; }
.station-search:focus-within,.station-model-search:focus-within { border-color:#908878; box-shadow:0 0 0 3px rgba(131,119,95,.12); }
.station-undo:empty,.station-attention:empty { display:none; }
.station-undo:not(:empty),.station-attention:not(:empty) { margin:-32px 0 24px; }
.station-undo .workflow-receipt,.station-attention .attention-banner { max-width:570px; border-radius:9px; }
.station-board { display:grid; width:100%; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; gap:34px 32px; }
.station-note { --note-bg:#e4e4e1; --note-avatar:#a8aaa8; position:relative; isolation:isolate; min-width:0; min-height:640px; padding:41px 27px 25px; color:#22221f; background-color:var(--note-bg); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E"),linear-gradient(135deg,rgba(255,255,255,.35),transparent 55%),linear-gradient(0deg,rgba(80,67,43,.025),rgba(255,255,255,.1)); background-size:150px 150px,auto,auto; border-radius:7px 8px 18px 7px; box-shadow:0 4px 8px rgba(49,44,34,.11),0 19px 25px rgba(49,44,34,.17),0 32px 40px rgba(49,44,34,.06); transition:transform .2s ease,filter .2s ease; }
.station-note:hover { transform:translateY(-2px) rotate(.1deg); }
.station-note.has-enabled[data-note-tone="yellow"] { --note-bg:#ffeba0; --note-avatar:#efbf3d; }
.station-note.has-enabled[data-note-tone="green"] { --note-bg:#e0edca; --note-avatar:#91bb72; }
.station-note.has-enabled[data-note-tone="peach"] { --note-bg:#f6dcc3; --note-avatar:#dca16e; }
.station-note.is-muted { --note-bg:#e5e5e5; --note-avatar:#abadad; }
.station-note::before { content:""; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:linear-gradient(135deg,rgba(255,255,255,.13),transparent 50%); pointer-events:none; }
.station-note::after { content:""; position:absolute; z-index:-1; right:0; bottom:0; width:58px; height:58px; border-radius:0 0 16px 0; background:linear-gradient(140deg,rgba(121,100,59,.1),rgba(255,255,255,.85) 53%,rgba(210,198,171,.56)); clip-path:polygon(100% 0,100% 100%,0 100%); filter:drop-shadow(-2px -2px 3px rgba(56,48,35,.12)); }
.station-tape { position:absolute; z-index:2; top:-14px; left:calc(50% - 44px); width:88px; height:36px; transform:rotate(-5deg); background:linear-gradient(90deg,rgba(231,201,119,.28),rgba(255,251,224,.67) 20%,rgba(221,190,111,.34) 82%,rgba(255,255,255,.48)); border:1px solid rgba(179,154,99,.1); box-shadow:0 2px 5px rgba(54,47,35,.08); backdrop-filter:blur(1px); }
.station-note.has-enabled[data-note-tone="green"] .station-tape { background:linear-gradient(90deg,rgba(139,175,119,.2),rgba(244,255,231,.42) 20%,rgba(135,170,112,.31) 82%,rgba(255,255,255,.32)); }
.station-note.has-enabled[data-note-tone="peach"] .station-tape { background:linear-gradient(90deg,rgba(186,135,98,.2),rgba(255,238,218,.45) 20%,rgba(198,145,111,.27) 82%,rgba(255,255,255,.35)); }
.station-note.is-muted .station-tape { background:linear-gradient(90deg,rgba(135,139,143,.2),rgba(255,255,255,.43) 20%,rgba(133,137,141,.3) 82%,rgba(255,255,255,.35)); }
.station-note-head { display:flex; align-items:center; gap:14px; min-width:0; margin:4px 0 22px; }
.station-avatar { flex:0 0 50px; width:50px; height:50px; display:grid; place-items:center; border-radius:50%; background:var(--note-avatar); color:#191916; font-size:24px; font-weight:700; }
.station-note-head h2 { min-width:0; overflow:hidden; margin:0; color:#20201d; font-size:24px; font-weight:710; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.station-menu { position:relative; margin-left:auto; align-self:flex-start; }
.station-menu summary { width:34px; height:32px; display:grid; place-items:center; border-radius:7px; color:#252521; font-size:22px; font-weight:700; line-height:1; list-style:none; cursor:pointer; }
.station-menu summary::-webkit-details-marker { display:none; }
.station-menu summary:hover,.station-menu[open] summary { background:rgba(255,255,255,.48); }
.station-menu-popover { position:absolute; z-index:10; top:35px; right:0; width:174px; padding:5px; border:1px solid rgba(69,65,55,.16); border-radius:10px; background:#fffdf8; box-shadow:0 9px 25px rgba(35,32,26,.17); }
.station-menu-popover button { display:block; width:100%; padding:9px 10px; border:0; border-radius:6px; background:transparent; color:#272622; font:inherit; text-align:left; cursor:pointer; }
.station-menu-popover button:hover { background:#f0ede5; }
.station-menu-popover button.danger { color:#a43b2d; }
.station-key-row { display:grid; grid-template-columns:98px minmax(0,1fr); align-items:center; gap:14px; }
.station-key-row label { font-size:16px; font-weight:550; white-space:nowrap; }
.station-key-row select,.station-add-key { width:100%; min-width:0; height:49px; padding:0 13px; border:1px solid rgba(96,91,78,.45); border-radius:9px; outline:0; background:rgba(255,255,255,.34); color:#24231f; font:inherit; font-size:15px; }
.station-key-row select:focus,.station-add-key:focus-visible { border-color:#716a5b; box-shadow:0 0 0 3px rgba(131,119,95,.13); }
.station-add-key { cursor:pointer; }
.station-fetch-status { display:flex; align-items:center; gap:10px; min-height:49px; margin:5px 0 0; color:#5f5e57; font-size:14px; }
.fetch-mark { flex:0 0 26px; width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:#4f9365; color:white; font-size:15px; font-weight:700; }
.station-fetch-status:not(.is-error) .fetch-mark { background:#4d9263; }
.station-fetch-status.is-error { color:#9a382d; }
.station-fetch-status.is-error .fetch-mark { background:#b94b3f; }
.station-fetch-status button { margin-left:auto; padding:5px 9px; border:1px solid rgba(89,82,68,.34); border-radius:6px; background:rgba(255,255,255,.35); color:#514a3f; font:inherit; cursor:pointer; }
.station-fetch-status .station-key-refresh { box-sizing: border-box; flex: 0 0 56px; width: 56px; height: 32px; padding: 5px 3px; display: inline-flex; align-items: center; justify-content: center; gap: 2px; white-space: nowrap; }
.station-key-refresh > span { font-size: 12px; }
.station-key-refresh:disabled { opacity: .5; cursor: default; }
.station-key-refresh[aria-busy="true"] > span { animation: spin 1s linear infinite; }
.key-error-dot { display: inline-block; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: #c9483c; box-shadow: 0 0 0 2px #c9483c15; }
.station-note-head > .key-error-dot { margin-left: -10px; }
.station-model-heading { display:flex; align-items:center; justify-content:space-between; margin-top:5px; padding:15px 0 10px; border-top:1px solid rgba(89,82,68,.34); color:#25241f; font-size:15px; }
.station-model-heading strong { font-size:17px; font-weight:700; }
.station-model-heading span { color:#5d5b54; }
.station-model-search { height:45px; gap:9px; padding:0 12px; border-color:rgba(99,91,75,.35); background:rgba(255,255,255,.38); }
.station-model-search span { font-size:24px; }
.station-model-search input { font-size:14px; }
.station-model-list { max-height:308px; min-height:186px; overflow:auto; margin-top:9px; scrollbar-color:rgba(87,82,70,.35) transparent; scrollbar-width:thin; }
.station-model-row { display:flex; align-items:center; gap:14px; min-height:52px; padding:5px 7px; border-bottom:1px solid rgba(88,82,70,.15); cursor:pointer; }
.station-model-row:hover { background:rgba(255,255,255,.24); }
.station-model-row input { flex:0 0 25px; width:25px; height:25px; margin:0; accent-color:#1677ee; cursor:pointer; }
.station-model-row input:disabled { cursor:not-allowed; }
.station-model-id { min-width:0; overflow-wrap:anywhere; color:#25241f; font-size:15px; line-height:1.35; }
.station-model-row.is-missing .station-model-id { color:#6f6254; }
.model-status-tag { flex:0 0 auto; margin-left:auto; color:#786c5d; font-size:11px; }
.station-model-empty { display:grid; min-height:100px; place-items:center; padding:12px; color:#736f66; font-size:14px; text-align:center; }
.station-note-foot { display:flex; align-items:center; gap:10px; min-height:42px; margin-top:7px; border-top:1px solid rgba(89,82,68,.3); color:#5f5c54; font-size:14px; }
.enabled-indicator { width:14px; height:14px; border-radius:50%; background:#8c8d8b; }
.has-enabled .enabled-indicator { background:#4c9161; }
.station-board-empty { grid-column:1/-1; display:grid; justify-items:center; gap:15px; padding:80px 20px; color:#6e695f; }
.station-board-empty strong { color:#393730; font-size:20px; }
.station-board-empty button { padding:9px 15px; border:1px solid #c8c1b4; border-radius:8px; background:#fffdf8; color:#292823; font:inherit; cursor:pointer; }
.sticky-main #change-summary { display:none!important; }
.station-attention .attention-banner { display:flex; width:100%; padding:12px 15px; border:1px solid rgba(173,112,74,.3); background:rgba(255,248,236,.76); color:#574736; text-align:left; cursor:pointer; }
.station-attention { display:none!important; }
.station-undo .workflow-receipt { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:10px 14px; border:1px solid rgba(83,134,95,.3); background:rgba(245,251,241,.82); color:#425a46; }
.station-undo .workflow-receipt .text-btn { color:#315f3a; }
.sticky-workspace .save-bar { transform:none; position:fixed; z-index:40; right:18px; bottom:16px; left:18px; width:auto; max-width:780px; margin:0 auto; padding:12px 16px; border:1px solid rgba(69,65,55,.18); border-radius:13px; background:rgba(255,254,249,.96); box-shadow:0 11px 35px rgba(41,37,29,.19); backdrop-filter:blur(12px); }
.sticky-workspace .save-bar-text { color:#504d45; }
.sticky-workspace .save-bar-actions { gap:9px; }
.sticky-workspace .save-bar .primary-btn { color:#fffdf8; background:#292a28; }
.data-quick-actions { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.data-backup-section { margin-top:14px; padding-top:15px; border-top:1px solid rgba(80,74,64,.15); }
.data-backup-section>div:first-child { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.data-backup-section>div:first-child strong { color:#34322c; }
.data-backup-list { display:grid; gap:7px; max-height:190px; overflow:auto; }
.data-backup-list .backup-item { padding:9px 11px; border:1px solid #e7e1d5; border-radius:8px; background:#fffdfa; color:#3c3931; cursor:pointer; }
.data-backup-list .backup-item:hover { border-color:#bcb39f; }
.sticky-workspace .main-layout,.sticky-workspace .nav-panel,.sticky-workspace .detail-panel { display:none!important; }
@media(max-width:1199px) { .station-board { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px 26px; } }
@media(max-width:760px) { .topbar.sticky-topbar { height:56px; } .sticky-brand h1 { font-size:20px; } .sticky-brand span { font-size:14px; } .sticky-main { padding:17px 17px 108px; } .station-toolbar { align-items:stretch; flex-direction:column; gap:13px; margin-bottom:33px; } .station-toolbar-left { justify-content:space-between; gap:8px; } .station-add-button { height:43px; padding:0 12px; font-size:14px; } .station-filter { gap:0; } .station-filter button { padding:0 10px; font-size:13px; } .station-search { width:100%; height:43px; } .station-board { grid-template-columns:minmax(0,1fr); gap:30px; max-width:520px; margin:0 auto; } .station-note { min-height:600px; padding:35px 21px 20px; } .station-note-head { margin-bottom:17px; } .station-avatar { flex-basis:46px; width:46px; height:46px; font-size:22px; } .station-note-head h2 { font-size:22px; } .station-key-row { grid-template-columns:83px minmax(0,1fr); gap:9px; } .station-key-row label { font-size:14px; } .station-key-row select { height:45px; font-size:14px; } .station-model-list { max-height:280px; } .station-undo:not(:empty),.station-attention:not(:empty) { margin:-18px 0 20px; } .sticky-workspace .save-bar { right:10px; bottom:10px; left:10px; padding:10px 11px; } .sticky-workspace .save-bar-text { max-width:44%; font-size:12px; } .sticky-workspace .save-bar-actions .primary-btn,.sticky-workspace .save-bar-actions .ghost-btn { padding:9px 10px; font-size:12px; } }
@media(max-width:380px) { .station-toolbar-left { align-items:flex-start; flex-direction:column; } .station-filter { width:100%; } .station-filter button { flex:1; } .station-model-row { gap:10px; } .station-model-id { font-size:14px; } .sticky-workspace .save-bar-text { display:none; } }
@media(prefers-reduced-motion:reduce) { .station-note,.station-add-button { transition:none; } }

/* R2 reference calibration: release the legacy viewport shell and align the paper board. */
html:has(.sticky-workspace), body:has(.sticky-workspace) {
  height: auto;
  min-height: 100%;
  overflow: visible;
}
#app-shell.sticky-workspace { height: auto; }
.topbar.sticky-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  padding: 0 max(3.1vw, calc((100vw - 1500px) / 2));
}
.sticky-brand { white-space: nowrap; }
.sticky-header-actions { flex: 0 0 auto; align-items: center; }
.station-refresh-button { display: inline-flex; align-items: center; gap: 5px; min-height: 34px; padding: 0 10px; border: 1px solid #a79d893d; border-radius: 7px; background: #fffdf842; color: #514a3f; font: inherit; font-size: 13px; white-space: nowrap; cursor: pointer; }
.station-refresh-button:hover { background: #fffdf899; }
.station-refresh-button:focus-visible { outline: 2px solid #928779; outline-offset: 3px; }
:root[data-theme="dark"] .station-refresh-button { background: #fffdf8; color: #514a3f; }
@media (max-width: 380px) { .sticky-brand span { display: none; } }
.sticky-main { padding-bottom: 72px; }
.station-toolbar-left { gap: 28px; }
.station-add-button, .station-filter { flex-shrink: 0; white-space: nowrap; }
.station-search, .station-model-search { border-radius: 7px; background: rgba(255,255,255,.32); }
.station-search span, .station-model-search span {
  position: relative;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  font-size: 0;
  border: 2px solid currentColor;
  border-radius: 50%;
  transform: none;
}
.station-search span::after, .station-model-search span::after {
  content: '';
  position: absolute;
  right: -6px;
  bottom: -3px;
  width: 8px;
  height: 2px;
  border-radius: 1px;
  background: currentColor;
  transform: rotate(48deg);
}
.station-board { gap: 40px 34px; }
.station-note {
  min-height: 0;
  padding: 34px 30px 18px;
  border-radius: 6px 7px 64px 6px / 6px 7px 42px 6px;
  box-shadow: 0 2px 4px rgba(49,44,34,.08), 0 13px 18px rgba(49,44,34,.16), 0 24px 32px rgba(49,44,34,.08);
}
.station-note::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 150'%3E%3Cfilter id='fiber'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.15 .62' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23fiber)' opacity='.13'/%3E%3C/svg%3E"), linear-gradient(135deg,rgba(255,255,255,.13),transparent 50%);
  background-size: 150px 150px, auto;
}
.station-note::after {
  width: 64px;
  height: 54px;
  border-radius: 70% 0 70% 0;
  background: linear-gradient(138deg,transparent 25%,rgba(255,255,255,.2) 42%,rgba(255,255,255,.72) 52%,rgba(115,100,69,.22) 72%,rgba(255,255,255,.08));
  clip-path: polygon(100% 0,100% 100%,0 100%,27% 78%,45% 38%,77% 27%);
  filter: drop-shadow(-3px -2px 3px rgba(56,48,35,.13));
}
.station-tape { height: 42px; transform: rotate(-7deg); opacity: .82; backdrop-filter: blur(.3px); }
.station-tape::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cfilter id='t'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.3 .7' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23t)' opacity='.2'/%3E%3C/svg%3E");
  border-top: 1px dashed rgba(255,255,255,.25);
  border-bottom: 1px dashed rgba(111,98,65,.1);
}
.station-note-head { gap: 18px; margin: 0 0 18px; }
.station-avatar { flex-basis: 52px; width: 52px; height: 52px; }
.station-note-head h2 { font-size: 28px; }
.station-key-row label { font-size: 18px; }
.station-key-row select { font-size: 18px; border-radius: 7px; background: rgba(255,255,255,.24); }
.station-fetch-status { min-height: 68px; margin: 0; font-size: 17px; }
.station-model-heading { margin-top: 0; padding: 16px 0 12px; font-size: 17px; }
.station-model-heading strong { font-size: 19px; }
.station-model-search input { font-size: 17px; }
.station-model-list { height: 270px; min-height: 0; max-height: none; margin-top: 8px; }
.station-model-row { min-height: 54px; }
.station-model-id { font-size: 18px; }
.station-note-foot { min-height: 48px; font-size: 17px; }
@media (max-width: 760px) {
  .topbar.sticky-topbar { padding: 0 17px; }
  .sticky-brand { gap: 9px; }
  .sticky-header-actions { gap: 2px; }
  .station-refresh-button { padding: 0 6px; font-size: 12px; gap: 3px; }
  .icon-action { width: 31px; }
  .station-toolbar-left { gap: 6px; }
  .station-filter button { padding: 0 8px; }
  .station-note { padding: 29px 21px 17px; border-bottom-right-radius: 48px 34px; }
  .station-note-head { gap: 13px; margin-bottom: 17px; }
  .station-avatar { flex-basis: 46px; width: 46px; height: 46px; }
  .station-note-head h2 { font-size: 22px; }
  .station-key-row label, .station-key-row select { font-size: 14px; }
  .station-fetch-status { min-height: 57px; font-size: 14px; }
  .station-fetch-status .station-key-refresh { flex-basis: 48px; width: 48px; height: 28px; padding: 5px 2px; gap: 1px; }
  .station-model-heading { padding: 12px 0 10px; font-size: 14px; }
  .station-model-heading strong { font-size: 17px; }
  .station-model-search input { font-size: 15px; }
  .station-model-list { height: 220px; }
  .station-model-row { min-height: 44px; gap: 11px; padding: 5px 3px; }
  .station-model-row input { flex-basis: 22px; width: 22px; height: 22px; }
  .station-model-id { font-size: 16px; }
  .model-status-tag { font-size: 10px; }
  .station-note-foot { min-height: 44px; font-size: 15px; }
}
@media (min-width: 761px) {
  .station-toolbar { margin-bottom: 58px; }
  .station-add-button { padding: 0 22px; font-size: 18px; }
  .station-filter button { padding: 0 22px; font-size: 18px; }
  .station-search input { font-size: 18px; }
}
.station-model-row:last-child { border-bottom: 0; }

/* 用户选定第一版总览：大图标与暖白卡片，独立于便签筛选，只展示已保存启用项。 */
.enabled-model-overview { margin: 16px 0 38px; }
.enabled-overview-head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 18px; }
.enabled-overview-head h2 { margin: 0; color: #252521; font-size: 24px; font-weight: 700; line-height: 1.3; }
.enabled-overview-count { color: #77736c; font-size: 20px; }
.enabled-overview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.enabled-overview-card { display: flex; align-items: center; min-width: 0; min-height: 124px; box-sizing: border-box; gap: 20px; padding: 24px; border: 1px solid #dedbd3; border-radius: 10px; background: rgba(255, 253, 249, .82); box-shadow: 0 4px 10px rgba(49, 44, 34, .045); }
.enabled-overview-logo { display: block; flex: 0 0 60px; width: 60px; height: 60px; object-fit: contain; }
.enabled-overview-mask { mask-image: var(--overview-logo); -webkit-mask-image: var(--overview-logo); mask-size: contain; -webkit-mask-size: contain; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; }
.enabled-overview-mask.brand-deepseek { background-color: #4d6bfe; }
.enabled-overview-mask.brand-claude { background-color: #d97757; }
.enabled-overview-mask.brand-qwen { background-color: #615ced; }
.enabled-overview-mask.brand-gemini { background: linear-gradient(35deg, #4285f4 15%, #9b72cb 55%, #d96570 90%); }
.enabled-overview-copy { display: grid; gap: 8px; min-width: 0; }
.enabled-overview-model { overflow: hidden; color: #252521; font-size: 20px; font-weight: 650; line-height: 1.3; white-space: nowrap; text-overflow: ellipsis; }
.enabled-overview-source { overflow: hidden; color: #78746e; font-size: 16px; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; }
.enabled-overview-empty { margin: 0; padding: 24px; border: 1px solid #dedbd3; border-radius: 10px; background: rgba(255, 253, 249, .65); color: #78746e; font-size: 16px; }
@media (max-width: 1200px) {
  .enabled-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .enabled-model-overview { margin: 8px 0 28px; }
  .enabled-overview-head { gap: 12px; margin-bottom: 14px; }
  .enabled-overview-head h2 { font-size: 21px; }
  .enabled-overview-count { font-size: 16px; }
  .enabled-overview-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .enabled-overview-card { min-height: 112px; padding: 20px; gap: 18px; }
  .enabled-overview-logo { flex-basis: 52px; width: 52px; height: 52px; }
  .enabled-overview-model { font-size: 18px; }
  .enabled-overview-source { font-size: 15px; }
}