/* ==========================================================================
   慧教智研综合智能体平台 v3.0.0 · 共享设计系统
   学院风（学术紫）· 零依赖 · 移动端可用 · 所有页面共用本文件
   ========================================================================== */

/* ------------------------------- 设计令牌 ------------------------------- */
/* v3.2：与 V1 平台统一的设计令牌，全站唯一来源；各页面只引用变量，不再硬编码色值 */
:root {
  /* 主色（学术紫） */
  --brand: #6d5ae0;
  --brand-dark: #5749c9;
  --brand-soft: #eeebfb;
  --brand-soft-2: #f6f4fe;
  --brand-ring: rgba(109, 90, 224, 0.28);
  --grad-brand: linear-gradient(135deg, #6d5ae0 0%, #8f7ff0 100%);
  /* 文字与背景 */
  --ink: #1f2430;
  --ink-2: #3d4351;
  --muted: #7b8494;
  --muted-2: #98a0ae;
  --bg: #f6f7fb;
  --card: #ffffff;
  --line: #eceef3;
  --line-soft: #f1f3f7;
  /* 语义色：仅 绿=成功/已接入、橙=警示、红=错误 */
  --ok: #16a34a;
  --ok-soft: #e8f7ee;
  --warn: #d97706;
  --warn-soft: #fdf3e3;
  --err: #dc2626;
  --err-soft: #fdeceb;
  /* 形状与阴影：卡片 14px / 按钮 10px / 徽标 999px */
  --r-sm: 8px;
  --r: 10px;
  --r-lg: 14px;
  --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(16, 24, 40, 0.06), 0 8px 24px rgba(16, 24, 40, 0.05);
  --shadow-2: 0 2px 6px rgba(16, 24, 40, 0.07), 0 14px 34px rgba(16, 24, 40, 0.1);
  --shadow-3: 0 18px 48px rgba(16, 24, 40, 0.18);
  /* 排版：字号阶 28 / 22 / 17 / 15，间距 8 的倍数 */
  --font: -apple-system, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --mono: ui-monospace, SFMono-Regular, "Cascadia Mono", Consolas, "Liberation Mono", monospace;
  --fs-1: 28px;
  --fs-2: 22px;
  --fs-3: 17px;
  --fs-4: 15px;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --header-h: 60px;
  /* 全站采用参考专区的流式全宽布局；仅保留内容内边距，不再制造宽屏两侧空白。 */
  --maxw: 100%;
}

/* --------------------------------- 基础 --------------------------------- */
* { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink);
  background: var(--bg);
  overflow-x: hidden;
}

h1, h2, h3, h4 { margin: 0; line-height: 1.3; font-weight: 700; }
p { margin: 0; }
a { color: var(--brand-dark); text-decoration: none; }
a:hover { text-decoration: underline; }
button, input, select, textarea { font: inherit; color: inherit; }
img, svg, iframe { max-width: 100%; }
code, .mono { font-family: var(--mono); font-size: 0.86em; }
hr { border: 0; border-top: 1px solid var(--line); margin: 18px 0; }

::selection { background: var(--brand-soft); }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.hidden { display: none !important; }
.mt-0 { margin-top: 0 !important; }
.mt-8 { margin-top: 8px; }
.mt-12 { margin-top: 12px; }
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.muted { color: var(--muted); }
.small { font-size: 13px; }
.tiny { font-size: 12px; }
.strong { font-weight: 700; }
.center { text-align: center; }
.right { text-align: right; }
.nowrap { white-space: nowrap; }
.break { overflow-wrap: anywhere; word-break: break-word; }
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.row { display: flex; align-items: center; gap: 10px; }
.row.spread { justify-content: space-between; }
.row.wrap { flex-wrap: wrap; }
.col { display: flex; flex-direction: column; gap: 10px; }
.grow { flex: 1 1 auto; min-width: 0; }

/* -------------------------------- 顶栏导航 ------------------------------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: #fff;
  border-bottom: 1px solid var(--line);
}

.site-header-inner {
  max-width: var(--maxw);
  margin: 0 auto;
  height: var(--header-h);
  padding: 0 18px;
  display: flex;
  align-items: center;
  gap: 14px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--ink);
  flex: 0 0 auto;
}
.brand:hover { text-decoration: none; }
.brand-logo { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 9px; display: block; }
.brand-text { min-width: 0; }
/* 字标（OpenEduWisdom）：与 V1 平台顶栏一致，窄屏回落为中文简称 */
.brand-wordmark { display: block; height: 15px; width: auto; max-width: 100%; }
.brand-name {
  display: block;
  font-size: 15.5px;
  font-weight: 800;
  letter-spacing: 0.2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.brand-short {
  display: none;
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.brand-sub {
  display: block;
  font-size: 11.5px;
  color: var(--muted);
  white-space: nowrap;
}

.nav {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-left: 6px;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}
.nav-link {
  padding: 7px 11px;
  border-radius: var(--r-pill);
  font-size: 14px;
  color: var(--ink-2);
  white-space: nowrap;
}
.nav-link:hover { background: var(--brand-soft-2); color: var(--brand-dark); text-decoration: none; }
.nav-link.is-active { background: var(--brand-soft); color: var(--brand-dark); font-weight: 700; }

.header-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }

.nav-toggle {
  display: none;
  width: 38px; height: 38px;
  align-items: center; justify-content: center;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: var(--r-sm);
  cursor: pointer;
  font-size: 17px;
  line-height: 1;
}

.model-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px 5px 9px;
  border-radius: var(--r-pill);
  border: 1px solid var(--line);
  background: #fff;
  font-size: 12.5px;
  color: var(--ink-2);
  white-space: nowrap;
  max-width: 320px;
}
.model-badge .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--muted-2);
  flex: 0 0 8px;
}
.model-badge.is-real { border-color: #bfe6cd; background: var(--ok-soft); color: #14663a; }
.model-badge.is-real .dot { background: var(--ok); box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.16); }
.model-badge.is-demo { border-color: #f0d8ae; background: var(--warn-soft); color: #8a5108; }
.model-badge.is-demo .dot { background: var(--warn); box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.16); }
.model-badge .badge-text { overflow: hidden; text-overflow: ellipsis; }

/* --------------------------------- 页面 --------------------------------- */
.page { width: 100%; max-width: var(--maxw); margin: 0; padding: 26px 24px 64px; }
.page-wide,
.page-narrow { max-width: none; }

.page-head { margin-bottom: 22px; }
.page-title { font-size: 24px; letter-spacing: 0.2px; }
.page-desc { color: var(--muted); margin-top: 6px; font-size: 14px; }

.section { margin-top: 34px; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.section-title { font-size: 17px; display: flex; align-items: center; gap: 8px; }
.section-title::before {
  content: ""; width: 4px; height: 16px; border-radius: 2px; background: var(--brand);
}
.section-desc { color: var(--muted); font-size: 13.5px; margin-top: 6px; }
/* 慧教智研 品牌角标（卡片封面右上角 · 小巧弱化不抢眼，不拦截卡片点击） */
.brand-chip { position: absolute; top: 8px; right: 8px; z-index: 3; display: inline-flex; align-items: center; gap: 4px; padding: 2px 7px 2px 4px; border-radius: var(--r-pill); background: rgba(255, 255, 255, 0.78); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); border: 1px solid rgba(109, 90, 224, 0.16); font: 500 9px/1.2 var(--font); color: #8a8696; letter-spacing: 0.2px; pointer-events: none; opacity: 0.9; }
.brand-chip img { width: 11px; height: 11px; border-radius: 3px; display: block; }
/* 修正：proj-shot/course-cover 内存在 img 铺满规则，固定尺寸小图标用 !important 钉死 */
.course-cover .brand-chip img, .proj-shot .brand-chip img, .proj-card .proj-shot .brand-chip img { width: 11px !important; height: 11px !important; border-radius: 3px; display: block; }

/* --------------------------------- 卡片 --------------------------------- */
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-1);
}
.card-pad { padding: 18px; }
.card-head {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line-soft);
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
}
.card-title { font-size: 15.5px; }
.card-desc { color: var(--muted); font-size: 13.5px; margin-top: 5px; }
.card-body { padding: 18px; }
.card-hover { transition: box-shadow 0.16s ease, transform 0.16s ease, border-color 0.16s ease; }
.card-hover:hover { box-shadow: var(--shadow-2); transform: translateY(-2px); border-color: #d9d3f7; }
.card-link { display: block; color: inherit; }
.card-link:hover { text-decoration: none; }

.grid { display: grid; gap: 14px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-auto { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.grid-auto-sm { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

/* 统计块 */
.stat { padding: 16px 18px; }
.stat-value { font-size: 26px; font-weight: 800; letter-spacing: -0.4px; color: var(--brand-dark); }
.stat-label { color: var(--muted); font-size: 13px; margin-top: 2px; }
.stat-hint { color: var(--muted-2); font-size: 12px; margin-top: 4px; }

/* -------------------------------- 按钮 --------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 9px 16px;
  border-radius: var(--r);
  border: 1px solid transparent;
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.btn:hover { text-decoration: none; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }
.btn-primary { background: var(--brand); color: #fff; box-shadow: 0 2px 10px rgba(109, 90, 224, 0.28); }
.btn-primary:hover:not(:disabled) { background: var(--brand-dark); }
.btn-outline { background: #fff; border-color: var(--line); color: var(--ink-2); }
.btn-outline:hover:not(:disabled) { border-color: #cbc6f0; color: var(--brand-dark); background: var(--brand-soft-2); }
.btn-ghost { background: transparent; color: var(--muted); }
.btn-ghost:hover:not(:disabled) { background: var(--brand-soft-2); color: var(--brand-dark); }
.btn-danger { background: #fff; border-color: #f3c9c5; color: var(--err); }
.btn-danger:hover:not(:disabled) { background: var(--err-soft); }
.btn-sm { padding: 5px 11px; font-size: 12.5px; border-radius: var(--r-sm); }
.btn-lg { padding: 12px 22px; font-size: 15.5px; border-radius: var(--r-lg); }
.btn-block { width: 100%; }

.icon-btn {
  width: 30px; height: 30px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm);
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font-size: 14px;
}
.icon-btn:hover { color: var(--brand-dark); border-color: #cbc6f0; background: var(--brand-soft-2); }
.icon-btn.danger:hover { color: var(--err); border-color: #f3c9c5; background: var(--err-soft); }

/* -------------------------- 徽标 / 标签 / 胶囊 -------------------------- */
.badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 9px;
  border-radius: var(--r-pill);
  font-size: 12px;
  font-weight: 600;
  border: 1px solid transparent;
  white-space: nowrap;
}
.badge-brand { background: var(--brand-soft); color: var(--brand-dark); border-color: #ddd6f8; }
.badge-muted { background: #f1f2f5; color: var(--muted); border-color: #e7e8ec; }
.badge-ok { background: var(--ok-soft); color: #14663a; border-color: #c6e8d3; }
.badge-warn { background: var(--warn-soft); color: #8a5108; border-color: #f0d8ae; }
.badge-err { background: var(--err-soft); color: #a41f1f; border-color: #f3c9c5; }

.chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px;
  border-radius: var(--r-pill);
  background: #f4f5f8;
  color: var(--ink-2);
  font-size: 12px;
  border: 1px solid var(--line-soft);
}
.chip-brand { background: var(--brand-soft); color: var(--brand-dark); border-color: #ddd6f8; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }

.swatch { width: 16px; height: 16px; border-radius: 5px; display: inline-block; border: 1px solid rgba(0, 0, 0, 0.08); }
.swatches { display: flex; gap: 6px; align-items: center; }

/* --------------------------------- 表单 --------------------------------- */
.form-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid .span-2 { grid-column: 1 / -1; }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.label { font-size: 13.5px; font-weight: 600; color: var(--ink-2); }
.label .req { color: var(--err); margin-left: 3px; }
.input, .select, .textarea {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: var(--r);
  background: #fff;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  min-width: 0;
}
.textarea { resize: vertical; min-height: 96px; line-height: 1.6; }
.input:focus, .select:focus, .textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-ring); }
.input::placeholder, .textarea::placeholder { color: var(--muted-2); }
.input[readonly] { background: #fafbfc; color: var(--muted); }
.help { font-size: 12.5px; color: var(--muted); }
.inline-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* 单/多选卡片（类型切换、模板选择、工具多选） */
.pick {
  position: relative;
  display: block;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.pick:hover { border-color: #cbc6f0; box-shadow: var(--shadow-1); }
.pick input { position: absolute; opacity: 0; pointer-events: none; }
.pick.is-selected { border-color: var(--brand); background: var(--brand-soft-2); box-shadow: 0 0 0 3px var(--brand-ring); }
.pick-title { font-weight: 700; font-size: 14.5px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pick-desc { color: var(--muted); font-size: 13px; margin-top: 5px; }
.pick-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }

/* 开关 */
.switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.switch-track {
  width: 40px; height: 22px; border-radius: var(--r-pill);
  background: #d6d8de; position: relative; transition: background 0.16s ease; flex: 0 0 40px;
}
.switch-track::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px;
  border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.16s ease;
}
.switch input:checked + .switch-track { background: var(--brand); }
.switch input:checked + .switch-track::after { transform: translateX(18px); }
.switch input:focus-visible + .switch-track { box-shadow: 0 0 0 3px var(--brand-ring); }
.switch-text { font-size: 12.5px; color: var(--muted); }

/* 分段控件 */
.segmented { display: inline-flex; padding: 3px; background: #f1f2f5; border-radius: var(--r-pill); gap: 3px; flex-wrap: wrap; }
.segmented button {
  border: 0; background: transparent; padding: 7px 15px; border-radius: var(--r-pill);
  font-size: 13.5px; font-weight: 600; color: var(--muted); cursor: pointer;
}
.segmented button.is-active { background: #fff; color: var(--brand-dark); box-shadow: var(--shadow-1); }

/* --------------------------------- 表格 --------------------------------- */
.table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.data { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 520px; }
table.data th, table.data td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
table.data th { background: #fafbfc; color: var(--ink-2); font-weight: 600; white-space: nowrap; }
table.data tr:last-child td { border-bottom: 0; }
table.data td.wrap-cell { min-width: 220px; }

/* --------------------------------- 提示 --------------------------------- */
.notice {
  padding: 11px 14px;
  border-radius: var(--r);
  border: 1px solid var(--line);
  background: #fafbfc;
  font-size: 13.5px;
  color: var(--ink-2);
}
.notice-info { background: var(--brand-soft-2); border-color: #ddd6f8; color: var(--brand-dark); }
.notice-ok { background: var(--ok-soft); border-color: #c6e8d3; color: #14663a; }
.notice-warn { background: var(--warn-soft); border-color: #f0d8ae; color: #8a5108; }
.notice-err { background: var(--err-soft); border-color: #f3c9c5; color: #a41f1f; }

.empty {
  padding: 30px 18px;
  text-align: center;
  color: var(--muted);
  font-size: 13.5px;
  border: 1px dashed var(--line);
  border-radius: var(--r-lg);
  background: #fcfcfd;
}
.empty .empty-icon { font-size: 22px; display: block; margin-bottom: 6px; opacity: 0.8; }

.loading { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13.5px; padding: 14px 0; }
.spinner {
  width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid var(--brand-soft);
  border-top-color: var(--brand);
  animation: spin 0.7s linear infinite;
  flex: 0 0 16px;
}
@keyframes spin { to { transform: rotate(360deg); } }
.skeleton {
  background: linear-gradient(90deg, #f1f2f5 25%, #e9eaee 37%, #f1f2f5 63%);
  background-size: 400% 100%;
  animation: shimmer 1.3s ease infinite;
  border-radius: var(--r-sm);
  height: 14px;
}
@keyframes shimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }

/* --------------------------------- toast -------------------------------- */
.toast-wrap {
  position: fixed; z-index: 200;
  left: 50%; bottom: 24px; transform: translateX(-50%);
  display: flex; flex-direction: column; gap: 8px; align-items: center;
  width: max-content; max-width: calc(100vw - 24px);
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  padding: 10px 16px;
  border-radius: var(--r);
  background: #23283a;
  color: #fff;
  font-size: 13.5px;
  box-shadow: var(--shadow-3);
  max-width: 100%;
  animation: toast-in 0.18s ease;
  overflow-wrap: anywhere;
}
.toast-ok { background: #14663a; }
.toast-warn { background: #8a5108; }
.toast-err { background: #a41f1f; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ------------------------------ 模态 / 预览 ------------------------------ */
.modal-backdrop {
  position: fixed; inset: 0; z-index: 150;
  background: rgba(24, 27, 36, 0.5);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  animation: fade-in 0.14s ease;
}
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
.modal {
  background: #fff;
  border-radius: var(--r-lg);
  width: 100%;
  max-width: 620px;
  max-height: calc(100vh - 40px);
  display: flex; flex-direction: column;
  box-shadow: var(--shadow-3);
  overflow: hidden;
}
.modal.modal-lg { max-width: 880px; }
.modal-head {
  padding: 15px 18px; border-bottom: 1px solid var(--line-soft);
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.modal-title { font-size: 16px; }
.modal-body { padding: 18px; overflow-y: auto; }
.modal-foot {
  padding: 13px 18px; border-top: 1px solid var(--line-soft);
  display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap;
  background: #fcfcfd;
}

/* 产物 / 课堂 全屏预览层 */
.preview-layer {
  position: fixed; inset: 0; z-index: 180;
  background: rgba(18, 20, 28, 0.72);
  display: flex; flex-direction: column;
  padding: 14px;
}
.preview-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 8px 12px; background: #fff; border-radius: var(--r) var(--r) 0 0;
}
.preview-title { font-weight: 700; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.preview-frame-wrap { flex: 1 1 auto; background: #fff; border-radius: 0 0 var(--r) var(--r); overflow: hidden; min-height: 0; }
.preview-frame { width: 100%; height: 100%; border: 0; display: block; background: #fff; }
.preview-text {
  flex: 1 1 auto; margin: 0; padding: 18px; overflow: auto; background: #fff;
  border-radius: 0 0 var(--r) var(--r);
  font-family: var(--mono); font-size: 12.5px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere;
}

/* --------------------------------- 进度 --------------------------------- */
.progress { height: 8px; border-radius: var(--r-pill); background: #eceef2; overflow: hidden; }
.progress-bar { height: 100%; background: var(--brand); border-radius: var(--r-pill); transition: width 0.3s ease; }
.progress-bar.is-done { background: var(--ok); }

.steps { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.step {
  padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r);
  background: #fff; font-size: 13px; color: var(--muted);
}
.step-name { font-weight: 700; color: var(--ink-2); display: flex; align-items: center; gap: 6px; }
.step.is-active { border-color: var(--brand); background: var(--brand-soft-2); box-shadow: 0 0 0 3px var(--brand-ring); }
.step.is-active .step-name { color: var(--brand-dark); }
.step.is-done { border-color: #c6e8d3; background: var(--ok-soft); }
.step.is-done .step-name { color: #14663a; }
.step-desc { margin-top: 4px; font-size: 12.5px; }

/* --------------------------------- 时间轴 ------------------------------- */
.timeline { position: relative; padding-left: 20px; }
.timeline::before { content: ""; position: absolute; left: 5px; top: 6px; bottom: 6px; width: 2px; background: var(--line); }
.timeline-item { position: relative; padding: 0 0 16px 0; }
.timeline-item:last-child { padding-bottom: 0; }
.timeline-item::before {
  content: ""; position: absolute; left: -19px; top: 6px; width: 10px; height: 10px;
  border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft);
}
.timeline-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-weight: 700; font-size: 14px; }
.timeline-body { color: var(--muted); font-size: 13px; margin-top: 4px; }

/* 分钟分布条 */
.bar-row { display: grid; grid-template-columns: 132px 1fr 54px; gap: 10px; align-items: center; font-size: 13px; }
.bar-track { height: 10px; border-radius: var(--r-pill); background: #eceef2; overflow: hidden; }
.bar-fill { height: 100%; border-radius: var(--r-pill); background: linear-gradient(90deg, var(--brand), #8f7ff0); }
.bar-value { text-align: right; color: var(--muted); }

/* ------------------------------ 工作台布局 ------------------------------ */
.wb-layout {
  display: grid;
  grid-template-columns: 268px minmax(0, 1fr) 316px;
  gap: 14px;
  align-items: start;
  height: calc(100vh - var(--header-h) - 34px);
  min-height: 540px;
}
.wb-layout > * { min-width: 0; }
.panel { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-1); height: 100%; }
.panel-head {
  padding: 11px 14px; border-bottom: 1px solid var(--line-soft);
  display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap;
}
.panel-title { font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
.panel-body { flex: 1 1 auto; overflow-y: auto; padding: 12px; min-height: 0; }
.panel-foot { border-top: 1px solid var(--line-soft); padding: 10px 12px; background: #fcfcfd; }

/* 会话列表 */
.session-item {
  padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r);
  background: #fff; cursor: pointer; margin-bottom: 8px;
}
.session-item:hover { border-color: #cbc6f0; background: var(--brand-soft-2); }
.session-item.is-active { border-color: var(--brand); background: var(--brand-soft-2); box-shadow: 0 0 0 2px var(--brand-ring); }
.session-goal { font-size: 13.5px; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.session-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 6px; font-size: 11.5px; color: var(--muted); }

/* 对话流 */
.stream { display: flex; flex-direction: column; gap: 10px; }
.msg { border-radius: var(--r); padding: 10px 12px; font-size: 13.5px; border: 1px solid var(--line-soft); background: #fcfcfd; overflow-wrap: anywhere; }
.msg-head { display: flex; align-items: center; gap: 7px; font-weight: 700; font-size: 12.5px; color: var(--ink-2); margin-bottom: 5px; flex-wrap: wrap; }
.msg-head .time { font-weight: 400; color: var(--muted-2); font-size: 11.5px; margin-left: auto; }
.msg-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.msg-thought { border-left: 3px solid #b9aef2; background: #fbfaff; color: var(--ink-2); font-style: italic; }
.msg-notice-info { border-left: 3px solid var(--brand); background: var(--brand-soft-2); }
.msg-notice-warn { border-left: 3px solid var(--warn); background: var(--warn-soft); }
.msg-notice-error { border-left: 3px solid var(--err); background: var(--err-soft); }
.msg-stage { border-left: 3px solid var(--brand); background: #fff; }
.msg-step { border-left: 3px solid #cdc6f4; background: #fff; }
.msg-delta { border-left: 3px solid #d8d2f6; background: #fff; font-size: 13px; }
.msg-artifact { border-left: 3px solid var(--ok); background: var(--ok-soft); }
.msg-reply { border-left: 3px solid var(--brand-dark); background: #fbfaff; }
.msg-summary { border-left: 3px solid var(--ok); background: #fff; }
.msg-error { border-left: 3px solid var(--err); background: var(--err-soft); color: #a41f1f; }
.msg-user { border-left: 3px solid var(--ink-2); background: #f4f5f8; }
.msg-observation { border-left: 3px solid #8f7ff0; background: #fbfaff; }
.msg-plan { border-left: 3px solid var(--brand); background: var(--brand-soft-2); }
.msg-unit { padding: 7px 12px; background: #fff; }
.msg-skill { border-left: 3px solid #a99cf0; background: #fbfaff; }
.msg-degraded { border-left: 3px solid var(--warn); background: var(--warn-soft); }

/* 产物面板 */
.artifact-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border: 1px solid var(--line); border-radius: var(--r);
  background: #fff; margin-bottom: 8px;
}
.artifact-item:hover { border-color: #cbc6f0; background: var(--brand-soft-2); }
.artifact-icon { font-size: 19px; width: 26px; text-align: center; flex: 0 0 26px; }
.artifact-main { min-width: 0; flex: 1 1 auto; }
.artifact-name { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; line-height: 1.4; }
.artifact-meta { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.artifact-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }

/* 输入区 */
.composer { display: flex; flex-direction: column; gap: 8px; }
.composer-row { display: flex; gap: 8px; align-items: flex-end; }
.composer textarea {
  flex: 1 1 auto; min-height: 60px; max-height: 150px; resize: vertical;
}

/* -------------------------------- 落地页 -------------------------------- */
.hero {
  padding: 34px 30px;
  border-radius: 18px;
  background:
    radial-gradient(1100px 380px at 12% -10%, #f1eefe 0%, rgba(241, 238, 254, 0) 62%),
    linear-gradient(180deg, #ffffff 0%, #fafaff 100%);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-1);
}
.hero-brand { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.hero-logo { width: 54px; height: 54px; border-radius: 14px; }
.hero-title { font-size: 27px; letter-spacing: 0.2px; }
.hero-slogan { font-size: 16px; color: var(--brand-dark); font-weight: 700; margin-top: 16px; }
.hero-desc { color: var(--muted); margin-top: 8px; max-width: 760px; font-size: 14px; }
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }

.big-card { padding: 22px; display: flex; flex-direction: column; gap: 10px; height: 100%; }
.big-card-icon { font-size: 24px; width: 46px; height: 46px; border-radius: 13px; background: var(--brand-soft); display: flex; align-items: center; justify-content: center; }
.big-card-title { font-size: 18px; }
.big-card-desc { color: var(--muted); font-size: 13.5px; }
.feature-list { margin: 0; padding-left: 18px; color: var(--ink-2); font-size: 13.5px; display: flex; flex-direction: column; gap: 4px; }
.big-card-foot { margin-top: auto; padding-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }

/* 既有平台卡片 */
.legacy-card { padding: 16px; height: 100%; display: flex; flex-direction: column; gap: 8px; }
.legacy-role { font-size: 12.5px; color: var(--brand-dark); background: var(--brand-soft); border-radius: var(--r-sm); padding: 4px 8px; align-self: flex-start; }
.legacy-method { font-size: 13px; color: var(--ink-2); background: #fafbfc; border: 1px dashed var(--line); border-radius: var(--r-sm); padding: 8px 10px; }

/* -------------------------------- 页脚 --------------------------------- */
.site-footer {
  border-top: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  font-size: 12.5px;
}
.site-footer-inner { max-width: var(--maxw); margin: 0 auto; padding: 30px 18px 20px; }
.footer-brand { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; color: var(--ink-2); }
.footer-brand b { font-size: 13.5px; }
.footer-brand span { color: var(--muted); font-size: 12.5px; }
.footer-link-groups { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; margin-top: 22px; }
.footer-group b { display: block; margin-bottom: 7px; color: var(--ink); font-size: 13px; font-weight: 600; letter-spacing: .04em; }
.footer-group a { display: block; width: fit-content; padding: 3px 0; color: var(--muted); line-height: 1.7; text-decoration: none; }
.footer-group a:hover { color: var(--brand); text-decoration: none; }
.footer-copy { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--line-soft); color: var(--muted-2); font-size: 12px; }
.footer-copy-links { display: inline-flex; gap: 14px; }
.footer-copy a { color: inherit; }
@media (max-width: 720px) {
  .footer-link-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 420px) {
  .footer-link-groups { grid-template-columns: minmax(0, 1fr); }
}

/* 页底平台管理区（2026-10-31 用户要求：管理类入口从顶栏移到平台底部，仅管理员可见） */
.footer-admin {
  max-width: var(--maxw); margin: 0 auto; padding: 10px 18px 16px;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  border-top: 1px dashed var(--line);
  font-size: 12.5px;
}
.footer-admin.hidden { display: none; }
.footer-admin .footer-admin-label { font-weight: 700; color: var(--brand-dark); letter-spacing: .02em; }
.footer-admin a { color: var(--muted); text-decoration: none; padding: 2px 0; border-bottom: 2px solid transparent; }
.footer-admin a:hover { color: var(--brand); border-bottom-color: var(--brand); text-decoration: none; }

/* 右上角「管理员」徽标可点击：直达管理员专属页面（2026-10-31 用户要求） */
.role-badge-link { cursor: pointer; text-decoration: none; transition: box-shadow .16s var(--ease), transform .16s var(--ease); }
.role-badge-link:hover { text-decoration: none; box-shadow: 0 0 0 3px var(--brand-soft); transform: translateY(-1px); }

/* 顶栏溢出拖动：菜单多窗口窄时按住拖动 / 滚轮横移（仅桌面横向导航态） */
@media (min-width:1200px) {
  .nav { cursor: grab; }
  .nav.dragging { cursor: grabbing; user-select: none; }
  .nav.dragging .nav-link { pointer-events: none; }
}

/* -------------------------------- 抽屉 -------------------------------- */
.drawer-backdrop { position: fixed; inset: 0; z-index: 150; background: rgba(24, 27, 36, 0.42); }
.drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 151;
  width: min(560px, 100vw);
  background: #fff; box-shadow: var(--shadow-3);
  display: flex; flex-direction: column;
}
.drawer-head { padding: 15px 18px; border-bottom: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.drawer-body { flex: 1 1 auto; overflow-y: auto; padding: 18px; }
.drawer-foot { padding: 13px 18px; border-top: 1px solid var(--line-soft); display: flex; gap: 10px; justify-content: flex-end; background: #fcfcfd; }

/* 键值行 */
.kv { display: flex; gap: 12px; padding: 7px 0; border-bottom: 1px dashed var(--line-soft); font-size: 13.5px; }
.kv:last-child { border-bottom: 0; }
.kv-key { color: var(--muted); flex: 0 0 108px; }
.kv-val { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }

/* 日志 */
.log-list { max-height: 320px; overflow-y: auto; font-family: var(--mono); font-size: 12px; }
.log-row { display: flex; gap: 8px; padding: 5px 8px; border-bottom: 1px solid var(--line-soft); }
.log-row:last-child { border-bottom: 0; }
.log-at { color: var(--muted-2); flex: 0 0 66px; }
.log-level { flex: 0 0 54px; font-weight: 700; }
.log-level.info { color: var(--brand-dark); }
.log-level.warn { color: var(--warn); }
.log-level.error { color: var(--err); }
.log-msg { flex: 1 1 auto; overflow-wrap: anywhere; }

/* 分页 */
.pager { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center; margin-top: 18px; }
.pager-info { color: var(--muted); font-size: 13px; }

/* -------------------------------- 响应式 ------------------------------- */
@media (max-width: 1180px) {
  .wb-layout { grid-template-columns: 232px minmax(0, 1fr); height: auto; }
  .wb-layout .wb-col { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: none; height: auto; }
  .wb-col > .panel { max-height: 520px; height: auto; }
}

@media (max-width: 980px) {
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 880px) {
  .nav-toggle { display: inline-flex; }
  .nav {
    position: absolute; top: var(--header-h); left: 0; right: 0;
    flex-direction: column; align-items: stretch;
    background: #fff; border-bottom: 1px solid var(--line);
    padding: 10px 14px 14px; gap: 4px;
    box-shadow: var(--shadow-2);
    display: none;
    max-height: calc(100vh - var(--header-h));
    overflow-y: auto;
  }
  .nav.is-open { display: flex; }
  .nav-link { padding: 11px 13px; border-radius: var(--r); font-size: 15px; }
  .brand-sub { display: none; }
  .brand-name { font-size: 14.5px; }
  .brand-wordmark { height: 14px; }
  .model-badge { max-width: 210px; }
  .wb-layout { grid-template-columns: minmax(0, 1fr); }
  .wb-layout .panel { height: auto; }
  .wb-layout .panel-sessions { max-height: 320px; }
  .wb-layout .panel-chat { min-height: 460px; }
}

@media (max-width: 720px) {
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: minmax(0, 1fr); }
  .page { padding: 20px 14px 56px; }
  .page-title { font-size: 21px; }
  .hero { padding: 24px 18px; }
  .hero-title { font-size: 22px; }
  .steps { grid-template-columns: minmax(0, 1fr); }
  .bar-row { grid-template-columns: 96px 1fr 46px; }
  .kv { flex-direction: column; gap: 2px; }
  .kv-key { flex-basis: auto; }
  .header-actions .model-badge .badge-text { max-width: 90px; }
  .modal { max-height: calc(100vh - 24px); }
  .modal-backdrop { padding: 12px; }
  .toast-wrap { bottom: 14px; }
  .site-header-inner { padding: 0 12px; gap: 8px; }
}

@media (max-width: 420px) {
  body { font-size: 14.5px; }
  .btn { padding: 8px 13px; }
  .btn-lg { padding: 11px 16px; font-size: 15px; }
  .model-badge { max-width: 160px; padding: 4px 9px; font-size: 12px; }
  .model-badge .badge-rest { display: none; }
  .brand-name { display: none; }
  .brand-short { display: block; }
  .brand-wordmark { display: none; }
  .stat-value { font-size: 22px; }
  .card-pad, .card-body { padding: 14px; }
  .big-card { padding: 16px; }
  .page { padding: 16px 12px 52px; }
  .site-header-inner { padding: 0 10px; }
  .brand-logo { width: 30px; height: 30px; flex-basis: 30px; }
  .brand-name { font-size: 14px; }
  table.data { min-width: 460px; }
}

/* 打印：只留正文 */
@media print {
  .site-header, .site-footer, .toast-wrap { display: none !important; }
  body { background: #fff; }
}

/* ==========================================================================
   v3.1 增量：登录 / 用户区 / 任务进度时间轴 / 实时思考 / 技能优选 / 管理后台 / 发布中心
   ========================================================================== */

/* ------------------------------ 顶栏用户区 ------------------------------ */

.header-user { display: flex; align-items: center; gap: 8px; min-width: 0; }
.user-chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 4px 10px 4px 5px; border: 1px solid var(--line);
  border-radius: var(--r-pill); background: #fff; min-width: 0;
}
.user-chip .avatar {
  width: 24px; height: 24px; flex: 0 0 24px; border-radius: 50%;
  background: var(--brand-soft); color: var(--brand-dark);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 12.5px;
}
.user-chip .uname {
  font-size: 12.5px; font-weight: 600; color: var(--ink-2);
  max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.role-badge {
  font-size: 11px; padding: 1px 7px; border-radius: var(--r-pill);
  border: 1px solid var(--line); background: #f1f2f5; color: var(--muted); white-space: nowrap;
}
.role-badge.is-admin { background: var(--brand-soft); color: var(--brand-dark); border-color: #ddd6f8; font-weight: 700; }
.role-badge.is-teacher { background: #f1f2f5; color: var(--muted); }
/* 单位名称（所属单位）：顶栏只显示一行、超长省略，完整值看 title */
.unit-badge {
  font-size: 11px; padding: 1px 7px; border-radius: var(--r-pill);
  border: 1px solid #d7e3f6; background: #eef4fd; color: #2a5aa8;
  max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* -------------------------------- 登录页 -------------------------------- */

.login-page {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  padding: 30px 16px;
  background:
    radial-gradient(1100px 520px at 12% -10%, #efeaff 0%, rgba(239, 234, 255, 0) 62%),
    radial-gradient(900px 480px at 100% 8%, #f2f0ff 0%, rgba(242, 240, 255, 0) 58%),
    var(--bg);
}
.login-shell { width: 100%; max-width: 940px; display: grid; gap: 22px; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); align-items: center; }
.login-intro { padding: 6px 4px; }
.login-card {
  width: 100%; max-width: 460px; margin-left: auto;
  background: #fff; border: 1px solid var(--line); border-radius: 18px;
  box-shadow: var(--shadow-3); padding: 28px;
}
.login-brand { display: flex; align-items: center; gap: 12px; }
.login-brand img { width: 44px; height: 44px; border-radius: 12px; flex: 0 0 44px; }
.login-title { font-size: 20px; letter-spacing: 0.2px; }
.login-sub { color: var(--muted); font-size: 12.5px; margin-top: 3px; }
.login-form { display: flex; flex-direction: column; gap: 14px; margin-top: 22px; }
.login-error { display: none; }
.login-error.is-on { display: block; }
.acct-card {
  border: 1px dashed #cfc7f4; background: var(--brand-soft-2);
  border-radius: var(--r); padding: 12px 14px; margin-top: 18px;
}
.acct-card .acct-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; margin-top: 6px; }
.acct-card code {
  font-family: var(--mono); background: #fff; border: 1px solid var(--line);
  border-radius: 6px; padding: 2px 7px; font-size: 12.5px;
}
.login-foot { margin-top: 16px; font-size: 12.5px; }
.login-feature { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--ink-2); }
.login-feature + .login-feature { margin-top: 12px; }
.login-feature .ic { font-size: 18px; line-height: 1.3; }

/* ------------------------ 任务进度（阶段时间轴） ------------------------ */

.progress-panel { border-bottom: 1px solid var(--line-soft); background: #fcfcfd; padding: 12px 12px 10px; }
.progress-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.progress-num { font-size: 19px; font-weight: 800; color: var(--brand-dark); letter-spacing: -0.4px; }
.progress-facts { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12px; color: var(--muted); margin-top: 8px; }
.progress-facts b { color: var(--ink-2); font-weight: 700; }

.tl-list { margin-top: 10px; position: relative; padding-left: 4px; }
.tl-step { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px; padding: 6px 0; position: relative; }
.tl-step + .tl-step::before {
  content: ""; position: absolute; left: 11px; top: -6px; height: 12px;
  border-left: 2px dotted var(--line);
}
.tl-icon {
  width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--line);
  background: #fff; color: var(--muted-2); font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; z-index: 1;
}
.tl-step.is-pending .tl-title { color: var(--muted); font-weight: 500; }
.tl-step.is-running .tl-icon { background: var(--brand); border-color: var(--brand); color: #fff; animation: tl-pulse 1.15s ease-in-out infinite; }
.tl-step.is-running .tl-title { color: var(--brand-dark); font-weight: 700; }
.tl-step.is-done .tl-icon { background: var(--ok-soft); border-color: #c6e8d3; color: #14663a; }
.tl-step.is-failed .tl-icon { background: var(--err-soft); border-color: #f3c9c5; color: #a41f1f; }
.tl-step.is-skipped .tl-icon { background: #f7f8fa; color: var(--muted-2); }
.tl-step.is-skipped .tl-title { color: var(--muted-2); }
.tl-title { font-size: 13.5px; font-weight: 600; line-height: 1.5; }
.tl-meta { font-size: 11.5px; color: var(--muted); margin-top: 1px; display: flex; gap: 8px; flex-wrap: wrap; }
.tl-result {
  font-size: 12.5px; color: var(--ink-2); margin-top: 5px;
  background: #fff; border: 1px solid var(--line-soft); border-left: 3px solid var(--line);
  border-radius: 0 6px 6px 0; padding: 5px 9px; overflow-wrap: anywhere;
}
.tl-step.is-done .tl-result { border-left-color: #9ad4b3; }
.tl-step.is-failed .tl-result { border-left-color: #eda9a4; }
@keyframes tl-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(109, 90, 224, 0.38); } 50% { box-shadow: 0 0 0 5px rgba(109, 90, 224, 0.06); } }

/* ------------------------------ 实时思考区 ------------------------------ */

.think-wrap { margin-top: 12px; }
.think-box { border: 1px solid var(--line); border-radius: var(--r); background: #fbfaff; overflow: hidden; }
.think-head {
  display: flex; align-items: center; gap: 8px; padding: 8px 11px;
  border-bottom: 1px solid var(--line-soft); font-size: 12.5px; font-weight: 700;
  color: var(--ink-2); cursor: pointer; user-select: none;
}
.think-head .grow { font-weight: 700; }
.think-head .chev { margin-left: auto; color: var(--muted); font-size: 11px; }
.think-body {
  max-height: 200px; overflow-y: auto; padding: 10px 12px;
  font-size: 12.8px; line-height: 1.75; color: var(--ink-2);
  white-space: pre-wrap; overflow-wrap: anywhere;
}
.think-box.is-collapsed .think-body { display: none; }
.think-caret::after {
  content: "▍"; color: var(--brand); margin-left: 1px;
  animation: think-caret 1s steps(1, end) infinite;
}
@keyframes think-caret { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
.think-empty { color: var(--muted-2); font-size: 12.5px; }

.thought-list { display: flex; flex-direction: column; gap: 6px; max-height: 240px; overflow-y: auto; margin-top: 10px; }
.thought-item {
  font-size: 12.5px; line-height: 1.6; padding: 6px 9px;
  border-left: 3px solid var(--line); background: #fcfcfd;
  border-radius: 0 8px 8px 0; overflow-wrap: anywhere;
}
.thought-item .tk { font-size: 11px; font-weight: 700; margin-right: 6px; }
.thought-item.k-plan { border-left-color: var(--brand); background: var(--brand-soft-2); }
.thought-item.k-plan .tk { color: var(--brand-dark); }
.thought-item.k-skill { border-left-color: #a99cf0; background: #fbfaff; }
.thought-item.k-skill .tk { color: #6a5acd; }
.thought-item.k-stage { border-left-color: #8f7ff0; background: #fbfaff; }
.thought-item.k-stage .tk { color: var(--brand-dark); }
.thought-item.k-unit { border-left-color: #b9aef2; background: #fcfcff; }
.thought-item.k-unit .tk { color: #6a5acd; }
.thought-item.k-result { border-left-color: var(--ok); background: var(--ok-soft); }
.thought-item.k-result .tk { color: #14663a; }
.thought-item.k-warn { border-left-color: var(--warn); background: var(--warn-soft); }
.thought-item.k-warn .tk { color: #8a5108; }
.thought-item.k-steer { border-left-color: var(--ink-2); background: #f4f5f8; }
.thought-item.k-steer .tk { color: var(--ink-2); }
.thought-item.k-reason { border-left-color: #cdc6f4; background: #fcfcfd; }
.thought-item.k-reason .tk { color: var(--muted); }

/* ------------------------------- 技能优选 ------------------------------- */

.skill-sel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin-top: 10px; }
.skill-sel-col { border: 1px solid var(--line); border-radius: var(--r); background: #fff; padding: 12px; min-width: 0; }
.skill-sel-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; font-weight: 700; }
.skill-hit { padding: 8px 0; border-bottom: 1px dashed var(--line-soft); }
.skill-hit:last-child { border-bottom: 0; }
.skill-hit-title { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.skill-hit-meta { font-size: 11.5px; color: var(--muted); margin-top: 3px; display: flex; gap: 8px; flex-wrap: wrap; }
.skill-hit-why { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
.score-pill { font-family: var(--mono); font-size: 11px; color: var(--brand-dark); background: var(--brand-soft); border-radius: var(--r-pill); padding: 1px 7px; }
.trust-badge { font-size: 10.5px; padding: 1px 6px; border-radius: var(--r-pill); border: 1px solid var(--line); }
.trust-badge.trust-high { background: var(--ok-soft); color: #14663a; border-color: #c6e8d3; }
.trust-badge.trust-medium { background: var(--warn-soft); color: #8a5108; border-color: #f0d8ae; }
.trust-badge.trust-general { background: #f1f2f5; color: var(--muted); }
.web-cand { border: 1px solid var(--line-soft); border-radius: var(--r-sm); padding: 8px 10px; margin-top: 8px; background: #fcfcfd; }
.web-cand-title { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.web-cand-host { font-size: 11.5px; color: var(--muted); font-family: var(--mono); }
.web-cand-snippet { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
.strategy-tag { font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: var(--r-pill); background: var(--brand-soft); color: var(--brand-dark); border: 1px solid #ddd6f8; }

/* ------------------------------ 授课形式多选 ------------------------------ */

.mode-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.mode-card { position: relative; cursor: pointer; }
.mode-card input { position: absolute; opacity: 0; pointer-events: none; }
.mode-card-inner {
  border: 1px solid var(--line); border-radius: var(--r); background: #fff;
  padding: 12px 13px; height: 100%; display: flex; flex-direction: column; gap: 4px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.mode-card-inner:hover { border-color: #cbc6f0; }
.mode-card input:checked + .mode-card-inner {
  border-color: var(--brand); background: var(--brand-soft-2); box-shadow: 0 0 0 3px var(--brand-ring);
}
.mode-card input:focus-visible + .mode-card-inner { box-shadow: 0 0 0 3px var(--brand-ring); }
.mode-card-title { font-weight: 700; font-size: 14px; display: flex; align-items: center; gap: 7px; }
.mode-card-desc { color: var(--muted); font-size: 12.5px; }
.mode-check { margin-left: auto; font-size: 12px; color: var(--brand-dark); font-weight: 700; }
.mode-card input:not(:checked) + .mode-card-inner .mode-check::after { content: ""; }
.mode-card input:checked + .mode-card-inner .mode-check::after { content: "✓ 已选"; }

/* ------------------------------- 管理后台 ------------------------------- */

.stat-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); }
.stat-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; box-shadow: var(--shadow-1); }
.stat-card .v { font-size: 24px; font-weight: 800; color: var(--brand-dark); letter-spacing: -0.4px; }
.stat-card .l { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.stat-card .h { font-size: 11.5px; color: var(--muted-2); margin-top: 4px; overflow-wrap: anywhere; }
.row-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.self-tag { font-size: 10.5px; color: var(--brand-dark); background: var(--brand-soft); border-radius: var(--r-pill); padding: 1px 6px; margin-left: 5px; }

/* ------------------------------- 发布中心 ------------------------------- */

.deploy-steps { display: flex; flex-direction: column; }
.deploy-step {
  display: flex; align-items: flex-start; gap: 9px; padding: 7px 2px;
  border-bottom: 1px dashed var(--line-soft); font-size: 13px;
}
.deploy-step:last-child { border-bottom: 0; }
.deploy-step .st { flex: 0 0 20px; text-align: center; font-weight: 700; }
.deploy-step.ok .st { color: var(--ok); }
.deploy-step.bad .st { color: var(--err); }
.deploy-step .nm { font-weight: 600; }
.deploy-step .dt { color: var(--muted); font-size: 12px; margin-top: 1px; overflow-wrap: anywhere; }
.deploy-step .ms { margin-left: auto; color: var(--muted-2); font-size: 11.5px; font-family: var(--mono); white-space: nowrap; }
.addr-box {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  flex: 1 1 auto; min-width: 0;
  background: #fafbfc; border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 8px 10px; margin-top: 6px;
}
.addr-box .url { font-family: var(--mono); font-size: 12.5px; overflow-wrap: anywhere; flex: 1 1 auto; color: var(--brand-dark); }
.site-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; box-shadow: var(--shadow-1); }
.site-card + .site-card { margin-top: 10px; }
.site-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.site-title { font-size: 14.5px; font-weight: 700; }
.deploy-loading {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  border: 1px dashed #cfc7f4; background: var(--brand-soft-2); border-radius: var(--r); font-size: 13px;
}
.pub-split { display: grid; gap: 16px; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); }
.env-list { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.env-item { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 9px 11px; background: #fff; }
.env-item .k { font-size: 11.5px; color: var(--muted); }
.env-item .v { font-size: 13px; font-weight: 600; margin-top: 2px; overflow-wrap: anywhere; }

/* ------------------------------ 工作台右列 ------------------------------ */

.wb-col {
  display: grid; grid-template-rows: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 14px; height: 100%; min-width: 0;
}
.wb-col > .panel { min-height: 0; }
.panel-progress .panel-body { padding: 12px 12px 14px; }
.panel-progress.is-body-hidden .panel-body { display: none; }
.progress-top { display: flex; align-items: center; gap: 10px; }
.progress-top .progress { flex: 1 1 auto; height: 10px; }

@media (max-width: 1180px) {
  .wb-col { grid-template-rows: none; grid-template-columns: minmax(0, 1fr); height: auto; }
  .wb-col > .panel { max-height: 560px; }
}

@media (max-width: 880px) {
  .wb-layout .wb-col { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 1400px) {
  .brand-sub { display: none; }
  .nav-link { padding: 7px 9px; }
  .model-badge .badge-rest { display: none; }
}

@media (max-width: 1240px) {
  .brand-name { display: none; }
  .brand-short { display: block; }
  .brand-wordmark { display: none; }
  .nav-link { font-size: 12.5px; padding: 7px 8px; }
}

/* -------------------------------- 响应式 -------------------------------- */

@media (max-width: 980px) {
  .login-shell { grid-template-columns: minmax(0, 1fr); max-width: 520px; }
  .login-intro { display: none; }
  .login-card { margin: 0 auto; }
  .pub-split { grid-template-columns: minmax(0, 1fr); }
  .skill-sel { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 880px) {
  .header-user .uname { display: none; }
  .user-chip { padding: 4px 8px 4px 4px; }
}

@media (max-width: 600px) {
  .header-actions { gap: 6px; }
  .model-badge { max-width: 132px; }
  .role-badge { display: none; }
  .header-user .btn { padding: 5px 8px; font-size: 12px; }
}

@media (max-width: 420px) {
  .model-badge { display: none; }
  .login-card { padding: 20px 16px; }
  .stat-card { padding: 12px; }
  .think-body { max-height: 160px; }
  .tl-step { grid-template-columns: 20px minmax(0, 1fr); gap: 8px; }
  .tl-icon { width: 20px; height: 20px; font-size: 11px; }
}

/* ==========================================================================
   v3.2 增量：统一视觉层（细线图标 / 克制的特效 / 试用申请）
   —— 令牌全部来自文件顶部 :root；本层不写死新色值（除个别派生灰阶）。
   ========================================================================== */

/* ------------------------------ 细线图标系统 ------------------------------ */
/* 单色内联 SVG 图标：stroke 取 currentColor，随语义色自动变化，替代彩色 emoji 堆叠 */
.ic {
  width: 18px; height: 18px; flex: 0 0 18px;
  display: inline-block; vertical-align: -0.18em;
  stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
.ic-xs { width: 14px; height: 14px; flex-basis: 14px; }
.ic-sm { width: 16px; height: 16px; flex-basis: 16px; }
.ic-md { width: 20px; height: 20px; flex-basis: 20px; }
.ic-lg { width: 24px; height: 24px; flex-basis: 24px; }
.ic-xl { width: 30px; height: 30px; flex-basis: 30px; }
.ic-brand { color: var(--brand); }
.ic-ok { color: var(--ok); }
.ic-warn { color: var(--warn); }
.ic-err { color: var(--err); }
.ic-muted { color: var(--muted-2); }
.ic-white { color: #fff; }

/* 原先放 emoji 的装饰位：统一为细线图标 + 单色底 */
.big-card-icon {
  color: var(--brand-dark);
  background: linear-gradient(150deg, #f2effe 0%, #e9e4fc 100%);
}
.big-card-icon .ic { width: 22px; height: 22px; flex-basis: 22px; }
.pick-title .ic, .card-title .ic, .panel-title .ic, .section-title .ic,
.msg-head .ic, .skill-sel-head .ic, .drawer-head .ic { color: var(--brand); }
.page-title { font-size: var(--fs-2); display: flex; align-items: center; gap: 9px; }
.page-title .ic { width: 22px; height: 22px; flex-basis: 22px; color: var(--brand); }
.empty .empty-icon { font-size: 0; line-height: 0; margin-bottom: 8px; }
.empty .empty-icon .ic { width: 26px; height: 26px; flex-basis: 26px; color: var(--brand); }
.login-feature .ic { width: 18px; height: 18px; flex-basis: 18px; margin-top: 2px; color: var(--brand); }
.deploy-step .st .ic { width: 15px; height: 15px; flex-basis: 15px; }
.tl-icon .ic { width: 13px; height: 13px; flex-basis: 13px; }
.artifact-icon { display: flex; align-items: center; justify-content: center; color: var(--brand-dark); }
.artifact-icon .ic { width: 20px; height: 20px; flex-basis: 20px; }

/* 状态点：比 emoji 更克制、语义更清楚 */
.status-dot {
  width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px;
  display: inline-block; background: var(--muted-2);
}
.status-dot.is-ok { background: var(--ok); box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.14); }
.status-dot.is-warn { background: var(--warn); box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.14); }
.status-dot.is-err { background: var(--err); box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.14); }
.status-dot.is-brand { background: var(--brand); box-shadow: 0 0 0 3px rgba(109, 90, 224, 0.16); }

/* ------------------------------ 导航滑入下划线 ----------------------------- */
.nav-link { position: relative; transition: color 0.16s var(--ease), background 0.16s var(--ease); }
.nav-link::after {
  content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 2px;
  border-radius: 2px; background: var(--brand);
  transform: scaleX(0); transform-origin: 50% 50%;
  transition: transform 0.24s var(--ease);
}
.nav-link:hover::after, .nav-link.is-active::after { transform: scaleX(1); }

.site-header { transition: box-shadow 0.2s var(--ease); }
.site-header.is-scrolled { box-shadow: var(--shadow-1); }

/* --------------------------- 卡片 hover 上浮 + 阴影 -------------------------- */
.card-hover, .card-link, .legacy-card, .site-card, .stat-card, .pick, .mode-card-inner {
  transition: transform 0.18s var(--ease), box-shadow 0.18s var(--ease),
    border-color 0.18s var(--ease), background 0.18s var(--ease);
}
.card-hover:hover, .card-link:hover, .legacy-card:hover, .site-card:hover, .stat-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-2);
  border-color: #ddd6f8;
}
.session-item, .artifact-item, .skill-hit, .web-cand {
  transition: border-color 0.16s var(--ease), background 0.16s var(--ease), transform 0.16s var(--ease);
}

/* -------------------------------- 按钮过渡 -------------------------------- */
.btn {
  transition: background 0.18s var(--ease), color 0.18s var(--ease), border-color 0.18s var(--ease),
    box-shadow 0.18s var(--ease), transform 0.12s var(--ease);
}
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn-primary { background: var(--grad-brand); }
.btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #5749c9 0%, #7a68e8 100%);
  box-shadow: 0 4px 16px rgba(109, 90, 224, 0.32);
}
a:focus-visible, button:focus-visible, .nav-link:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--brand); outline-offset: 2px; border-radius: 4px;
}
.input:focus-visible, .select:focus-visible, .textarea:focus-visible { outline: none; }

/* --------------------------- 区块视口淡入上移（IO） -------------------------- */
/* data-reveal 由 site.js 在运行时添加：无 JS / 降级环境下不影响内容可读 */
[data-reveal] {
  opacity: 0; transform: translateY(14px);
  transition: opacity 0.6s var(--ease), transform 0.6s var(--ease);
}
[data-reveal].is-in { opacity: 1; transform: none; }
[data-reveal] .grid > *, [data-reveal] .stat-grid > *, [data-reveal] .pick-grid > *, [data-reveal] .mode-grid > * {
  opacity: 0; transform: translateY(12px);
  transition: opacity 0.5s var(--ease), transform 0.5s var(--ease);
}
[data-reveal].is-in .grid > *, [data-reveal].is-in .stat-grid > *,
[data-reveal].is-in .pick-grid > *, [data-reveal].is-in .mode-grid > * { opacity: 1; transform: none; }
[data-reveal].is-in .grid > *:nth-child(2), [data-reveal].is-in .stat-grid > *:nth-child(2) { transition-delay: 60ms; }
[data-reveal].is-in .grid > *:nth-child(3), [data-reveal].is-in .stat-grid > *:nth-child(3) { transition-delay: 120ms; }
[data-reveal].is-in .grid > *:nth-child(4), [data-reveal].is-in .stat-grid > *:nth-child(4) { transition-delay: 180ms; }
[data-reveal].is-in .grid > *:nth-child(5), [data-reveal].is-in .stat-grid > *:nth-child(5) { transition-delay: 240ms; }
[data-reveal].is-in .grid > *:nth-child(6), [data-reveal].is-in .stat-grid > *:nth-child(6) { transition-delay: 300ms; }
[data-reveal].is-in .grid > *:nth-child(7), [data-reveal].is-in .stat-grid > *:nth-child(7) { transition-delay: 360ms; }
[data-reveal].is-in .grid > *:nth-child(8), [data-reveal].is-in .stat-grid > *:nth-child(8) { transition-delay: 420ms; }
[data-reveal].is-in .grid > *:nth-child(n + 9), [data-reveal].is-in .stat-grid > *:nth-child(n + 9) { transition-delay: 480ms; }

/* ------------------------- 数字滚动 / 骨架 / 渐变 ------------------------- */
.stat-value, .stat-card .v, .progress-num, [data-countup] { font-variant-numeric: tabular-nums; }
.skeleton {
  background: linear-gradient(90deg, #f1f3f7 25%, #e7e9f0 37%, #f1f3f7 63%);
  background-size: 400% 100%;
}
.grad-line { height: 3px; border-radius: 3px; background: var(--grad-brand); }
.section-title::before { background: var(--grad-brand); }
.progress-bar { background: var(--grad-brand); }
.bar-fill { background: var(--grad-brand); }
.stat-value, .stat-card .v { background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.model-pill-num { font-variant-numeric: tabular-nums; }

/* ------------------------------ 全宽流式布局 ------------------------------ */
.page { padding: 28px 24px 72px; }
.page-wide { max-width: none; }
.section { margin-top: 40px; }
.section-title { font-size: var(--fs-3); }
.grid { gap: 16px; }
.grid-auto { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
#stats-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
#entry-grid { grid-template-columns: repeat(auto-fit, minmax(224px, 1fr)); }
.card-pad, .card-body { padding: 20px; }
.card-head { padding: 15px 20px; }
.hero { padding: 40px 34px; }

/* ------------------------------ 细节对齐 ------------------------------ */
/* 长路径 / URL / 密钥等不可断行内容一律允许任意换行，避免 375px 下撑破布局 */
.mono, code, kbd, samp { overflow-wrap: anywhere; word-break: break-word; }
.env-hint, .notice, .tiny, .help { overflow-wrap: anywhere; }

/* --------------------------- 登录页 · 申请试用 --------------------------- */
/* 用途提示：替代已移除的说明卡，保证登录卡删块后不留空档 */
.login-tip { margin-top: 16px; line-height: 1.6; }
.login-trial {
  margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line);
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 12.5px; color: var(--muted);
}
.trial-link {
  background: none; border: 0; padding: 0; font: inherit; font-size: 12.5px; font-weight: 700;
  color: var(--brand-dark); cursor: pointer;
  border-bottom: 1px dashed rgba(87, 73, 201, 0.45);
  transition: color 0.16s var(--ease), border-color 0.16s var(--ease);
}
.trial-link:hover { color: var(--brand); border-bottom-color: var(--brand); }

.trial-form { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.trial-form .span-2 { grid-column: 1 / -1; }
.trial-form .field-err { color: var(--err); font-size: 12px; }
.input.is-invalid, .textarea.is-invalid, .select.is-invalid {
  border-color: var(--err); box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.14);
}
.form-alert {
  padding: 10px 12px; border-radius: var(--r); font-size: 13px;
  border: 1px solid var(--line); background: #fafbfc; color: var(--ink-2);
}
.form-alert.is-err { background: var(--err-soft); border-color: #f3c9c5; color: #a41f1f; }
.form-alert.is-ok { background: var(--ok-soft); border-color: #c6e8d3; color: #14663a; }
.form-alert.is-warn { background: var(--warn-soft); border-color: #f0d8ae; color: #8a5108; }
.trial-result {
  border: 1px solid #c6e8d3; border-radius: var(--r-lg); padding: 20px;
  background: linear-gradient(160deg, #f2fbf6 0%, #ffffff 72%);
}
.trial-result .rc-title { display: flex; align-items: center; gap: 8px; font-size: var(--fs-3); font-weight: 700; color: #14663a; }
.trial-result .rc-no {
  font-family: var(--mono); font-size: 21px; font-weight: 800; letter-spacing: 0.6px;
  color: var(--brand-dark); margin: 12px 0 4px; overflow-wrap: anywhere;
}
.trial-result .rc-meta { font-size: 12.5px; color: var(--muted); }
.trial-result .rc-line { margin-top: 10px; font-size: 13.5px; color: var(--ink-2); }
.trial-status-card { border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; background: #fcfcfd; font-size: 13px; }
.trial-status-card .ts-head { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.trial-steps { display: flex; gap: 6px; margin-top: 10px; }
.trial-steps span { flex: 1 1 0; height: 4px; border-radius: 2px; background: #e7e9f0; }
.trial-steps span.is-on { background: var(--grad-brand); }
.link-quiet { background: none; border: 0; padding: 0; font: inherit; font-size: 12.5px; color: var(--muted); cursor: pointer; }
.link-quiet:hover { color: var(--brand-dark); text-decoration: underline; }
@media (max-width: 620px) {
  .trial-form { grid-template-columns: minmax(0, 1fr); }
  .hero { padding: 24px 18px; }
  .card-pad, .card-body { padding: 16px; }
  .card-head { padding: 13px 16px; }
}

/* --------------------- 工作台顶栏 + 模型配置模态 --------------------- */
.wb-topbar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 10px 14px; margin-bottom: 12px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--shadow-1);
}
.wb-topbar .panel-title { font-size: var(--fs-3); }
.wb-topbar .model-badge { max-width: 300px; }
.wb-layout.has-topbar { height: calc(100vh - var(--header-h) - 118px); }

.mc-status {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r); background: #fcfcfd;
}
.mc-status .mc-main { font-weight: 700; font-size: var(--fs-4); }
.mc-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; background: var(--muted-2); }
.mc-dot.is-real { background: var(--ok); box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.14); }
.mc-dot.is-demo { background: var(--muted-2); box-shadow: 0 0 0 3px rgba(152, 160, 174, 0.16); }
.mc-kv { font-size: 12.5px; color: var(--muted); overflow-wrap: anywhere; }
.mc-field-row { display: flex; gap: 8px; align-items: center; }
.mc-field-row .input { flex: 1 1 auto; min-width: 0; }
.mc-hint { font-size: 12px; color: var(--muted); }
.mc-readonly {
  font-family: var(--mono); font-size: 12.5px; color: var(--ink-2);
  background: #fafbfc; border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 8px 10px; overflow-wrap: anywhere;
}
@media (max-width: 1180px) { .wb-layout.has-topbar { height: auto; } }
@media (max-width: 720px) {
  .wb-topbar { padding: 10px 12px; }
  .wb-topbar .tiny { flex-basis: 100%; }
}

/* ================== 统一展示首页（V3 / 与展示层同口径） ================== */
.hero-kicker { display: block; margin-top: 14px; font-size: 13px; letter-spacing: 0.2px; color: var(--brand-dark); font-weight: 700; }
.hero-lead { margin-top: 10px; font-size: var(--fs-1); line-height: 1.25; letter-spacing: 0.4px; }
.hero-lead .lead-grad { background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero-hints { margin-top: 14px; font-size: 12.5px; color: var(--muted); }
.hero-hints a { display: inline-block; margin-left: 6px; padding: 2px 10px; border-radius: var(--r-pill); border: 1px solid var(--line); background: #fff; color: var(--ink-2); }
.hero-hints a:hover { border-color: #cbc6f0; color: var(--brand-dark); text-decoration: none; }
.hero-flow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 20px; }
.hero-flow .flow-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: var(--r-pill); background: #fff; border: 1px solid var(--line); font-size: 12.5px; color: var(--ink-2); }
.hero-flow .flow-chip .n { width: 18px; height: 18px; border-radius: 50%; background: var(--brand-soft); color: var(--brand-dark); font-size: 11.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.hero-flow .arr { color: var(--muted-2); font-size: 12px; }
.hero-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-top: 22px; }
.hero-stats .hstat { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-1); padding: 14px 14px 12px; transition: transform 0.18s var(--ease), box-shadow 0.18s var(--ease); }
.hero-stats .hstat:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); }
.hero-stats .hstat-num { font-size: 24px; font-weight: 800; letter-spacing: -0.4px; background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-variant-numeric: tabular-nums; }
.hero-stats .hstat-lbl { margin-top: 4px; font-size: 12px; color: var(--muted); line-height: 1.5; }

.feat-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.feat-col { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-1); padding: 18px; }
.feat-col-head h3 { font-size: var(--fs-3); display: flex; align-items: center; gap: 8px; }
.feat-col-head h3 .bar { width: 4px; height: 16px; border-radius: 2px; background: var(--grad-brand); }
.feat-col-head p { margin-top: 4px; font-size: 12.5px; color: var(--muted); line-height: 1.55; }
/* 每条能力压成「图标 + 标题 + 一句话」，整段版面高度约为原来的一半 */
.feat-col-grid { display: grid; gap: 8px; margin-top: 12px; }
.feat-card { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line-soft); border-radius: var(--r); background: #fcfcfd; transition: border-color 0.16s var(--ease), background 0.16s var(--ease); }
.feat-card:hover { border-color: #ddd6f8; background: var(--brand-soft-2); }
.feat-card .feat-ic { color: var(--brand); flex: 0 0 auto; margin-top: 1px; }
.feat-card h4 { font-size: 13.5px; line-height: 1.5; display: inline; }
.feat-card h4::after { content: ' · '; color: var(--muted-2); font-weight: 400; }
.feat-card p { display: inline; font-size: 12.5px; color: var(--muted); line-height: 1.5; }

.course-grid { display: grid; gap: 24px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.course-card { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-1); overflow: hidden; transition: transform 0.22s var(--ease), box-shadow 0.22s var(--ease), border-color 0.22s var(--ease); }
.course-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-2); border-color: #d9d3f7; }
.course-card.is-coming:hover { transform: none; }
.course-cover { position: relative; display: flex; align-items: center; justify-content: center; height: 150px; color: #fff; overflow: hidden; }
.course-cover .cover-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 0.6s var(--ease); }
.course-card:hover .course-cover .cover-img { transform: scale(1.06); }
.course-cover .cover-scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(16,20,34,.14) 0%, rgba(16,20,34,0) 38%, rgba(16,20,34,.6) 100%); }
.course-cover .ic { color: rgba(255, 255, 255, 0.92); z-index: 2; position: relative; }
.course-cover .ic-lg { width: 48px; height: 48px; flex-basis: 48px; }
.course-cover .cover-mono { font-size: 24px; font-weight: 800; color: rgba(255, 255, 255, 0.92); letter-spacing: 4px; z-index: 2; position: relative; }
/* 建设层级徽标（封面左上 · 统一学术紫药丸） */
.course-card .lv-badge { position: absolute; left: 12px; top: 12px; z-index: 3; display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 11px; font-size: 11.5px; line-height: 1; font-weight: 700; white-space: nowrap; color: #fff; background: linear-gradient(135deg, #5749c9, #7e6ee8); border-radius: 7px; box-shadow: 0 2px 6px rgba(16, 24, 40, 0.22); }
.course-card .lv-badge .ic { width: 13px; height: 13px; color: #fff; }
.course-cover .cover-badge { position: absolute; top: 12px; right: 12px; z-index: 3; padding: 3px 11px; border-radius: var(--r-pill); background: rgba(255, 255, 255, 0.94); color: var(--brand-dark); font-size: 11px; font-weight: 600; letter-spacing: 0.5px; }
.course-cover .cover-src { position: absolute; left: 12px; bottom: 10px; z-index: 3; font-size: 11px; color: rgba(255, 255, 255, 0.97); background: rgba(16, 20, 34, 0.5); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); padding: 2px 10px; border-radius: var(--r-pill); }
.course-card.is-coming .course-cover .cover-src { color: #4c5162; text-shadow: none; background: rgba(255,255,255,.9); }
.course-body { display: flex; flex-direction: column; padding: 18px 18px 16px; flex: 1 1 auto; }
.course-card .course-level { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.course-card .lv-note { font-size: 12px; font-weight: 700; color: var(--brand); letter-spacing: 0.3px; line-height: 1.5; }
.course-card .seal-tb { margin-left: auto; }
.course-name { font-size: 17px; line-height: 1.45; font-weight: 700; color: var(--ink); margin: 0 0 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.course-desc { font-size: 13px; color: var(--muted); line-height: 1.75; margin: 0 0 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.course-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.course-tags span { font-size: 11px; padding: 3px 10px; border-radius: var(--r-pill); background: #f4f5f8; border: 1px solid var(--line-soft); color: var(--muted); }
.course-links { margin-top: auto; display: flex; }
.course-go { display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex: 1; padding: 9px 16px; border-radius: 10px; background: var(--brand); color: #fff; font-size: 13.5px; font-weight: 600; box-shadow: 0 2px 8px rgba(109, 90, 224, 0.22); transition: background 0.18s var(--ease), transform 0.18s var(--ease); }
.course-go::after { content: "→"; font-size: 14px; line-height: 1; }
.course-go:hover { background: var(--brand-dark); text-decoration: none; transform: translateY(-1px); }
.course-go.is-disabled { background: #f1f2f5; color: var(--muted-2); cursor: not-allowed; box-shadow: none; }
.course-go.is-disabled::after { content: ""; }

.proj-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.proj-card { display: flex; flex-direction: column; gap: 8px; padding: 18px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-1); transition: transform 0.18s var(--ease), box-shadow 0.18s var(--ease), border-color 0.18s var(--ease); }
.proj-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); border-color: #ddd6f8; }
.proj-badge { font-size: 11.5px; color: var(--brand-dark); }
.proj-card h3 { font-size: 15px; line-height: 1.5; }
.proj-card p { font-size: 12.5px; color: var(--muted); line-height: 1.7; }
.proj-foot { margin-top: auto; padding-top: 8px; }
.proj-go { font-size: 13px; font-weight: 600; color: var(--brand-dark); }
.proj-go:hover { text-decoration: underline; }

.join-cta { margin-top: 40px; }
.join-inner {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  padding: 26px 28px; border-radius: 18px; border: 1px solid var(--line);
  background: radial-gradient(900px 300px at 12% -20%, #f1eefe 0%, rgba(241, 238, 254, 0) 62%), linear-gradient(180deg, #fff, #fafaff);
  box-shadow: var(--shadow-1);
}
.jc-eyebrow { font-size: 12px; color: var(--brand-dark); font-weight: 700; letter-spacing: 0.4px; }
.join-inner h3 { margin-top: 6px; font-size: var(--fs-2); }
.join-inner p { margin-top: 8px; font-size: 13px; color: var(--muted); max-width: 720px; line-height: 1.7; }
.jc-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.jc-note { font-size: 12px; color: var(--muted); line-height: 1.6; }

@media (max-width: 1080px) { .hero-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 880px) { .feat-cols { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 720px) {
  .hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .course-grid, .proj-grid { grid-template-columns: minmax(0, 1fr); }
  .join-inner { padding: 20px; }
  .hero-lead { font-size: 24px; }
}

/* --------------------------- 移动端导航降级 --------------------------- */
@media (max-width: 880px) {
  .nav-link::after { display: none; }
}

/* --------------------------- 无障碍降级：减少动效 --------------------------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  [data-reveal], [data-reveal].is-in,
  [data-reveal] .grid > *, [data-reveal].is-in .grid > *,
  [data-reveal] .stat-grid > *, [data-reveal].is-in .stat-grid > *,
  [data-reveal] .pick-grid > *, [data-reveal].is-in .pick-grid > *,
  [data-reveal] .mode-grid > *, [data-reveal].is-in .mode-grid > * {
    opacity: 1 !important; transform: none !important;
  }
  .card-hover:hover, .card-link:hover, .legacy-card:hover, .site-card:hover, .stat-card:hover { transform: none; }
  .btn:active:not(:disabled) { transform: none; }
  .skeleton, .spinner { animation: none; }
}

/* ==========================================================================
   思考区滚动边界（需求：下方有边界、滚轮可滚动、生成中自动跟随、完成后可回看）
   ========================================================================== */

/* 容器等高、下边界明确；滚到边界不带动整页滚动；出现滚动条时不抖动布局 */
.think-box { position: relative; }

.think-body {
  position: relative;
  max-height: 240px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  /* 下边界：底部渐隐遮罩，暗示「下面还有内容，可继续滚动」 */
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 18px), transparent 100%);
  mask-image: linear-gradient(to bottom, #000 calc(100% - 18px), transparent 100%);
}
.think-body::-webkit-scrollbar { width: 8px; }
.think-body::-webkit-scrollbar-thumb { background: rgba(109, 90, 224, .28); border-radius: 999px; }
.think-body::-webkit-scrollbar-thumb:hover { background: rgba(109, 90, 224, .45); }
.think-body::-webkit-scrollbar-track { background: transparent; }

/* 「回到最新」浮动按钮：仅在用户上滚离开底部时出现 */
.think-to-bottom {
  position: absolute;
  right: 12px;
  bottom: 10px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(109, 90, 224, .28);
  background: rgba(255, 255, 255, .94);
  color: var(--brand-dark);
  font-size: 11.5px;
  font-weight: 700;
  box-shadow: var(--shadow-1);
  cursor: pointer;
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition: opacity .18s var(--ease), transform .18s var(--ease);
  z-index: 3;
}
.think-to-bottom.show { opacity: 1; transform: translateY(0); pointer-events: auto; }
.think-to-bottom:hover { background: #fff; border-color: rgba(109, 90, 224, .5); }
.think-to-bottom:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) { .think-to-bottom { transition: none; } }

/* ==========================================================================
   落地页 Hero —— 保留原有卡片边框/圆角/阴影（第 646 行的 .hero 写法）与悬停动效，
   内容一律居中（对齐展示层 7200 首页的「头部排版」）；再叠加立体感与轻动效；
   KPI 数据卡不再通栏到两端，宽度与上下区块保持同一版心。
   ========================================================================== */
.hero {
  position: relative;
  overflow: hidden;
  padding: 46px 26px 38px;
  text-align: center;
  border-radius: 18px;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-1);
  background:
    radial-gradient(1100px 380px at 12% -10%, #f1eefe 0%, rgba(241, 238, 254, 0) 62%),
    linear-gradient(180deg, #ffffff 0%, #fafaff 100%);
}
/* 缓慢流动的品牌光晕：给卡片内部加「立体 + 动态」层次（不遮挡任何内容） */
.hero::before {
  content: '';
  position: absolute; left: -10%; right: -10%; top: -34%; height: 460px;
  background:
    radial-gradient(closest-side, rgba(109, 90, 224, .16), rgba(109, 90, 224, 0) 72%) 22% 46% / 46% 92% no-repeat,
    radial-gradient(closest-side, rgba(143, 127, 240, .14), rgba(143, 127, 240, 0) 72%) 80% 34% / 42% 92% no-repeat;
  animation: hero-glow 16s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes hero-glow {
  from { transform: translate3d(-2%, 0, 0) scale(1); opacity: .8; }
  to { transform: translate3d(3%, 2%, 0) scale(1.07); opacity: 1; }
}
.hero > * { position: relative; z-index: 1; }
.hero-brand-row { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; }
.hero-brand-row .hero-logo {
  width: 44px; height: 44px; border-radius: 13px;
  box-shadow: 0 6px 16px rgba(109, 90, 224, .22);
  animation: hero-float 6.5s ease-in-out infinite;
}
@keyframes hero-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
.hero-brand-name { font-size: 20px; font-weight: 800; letter-spacing: .3px; color: var(--ink); }
.hero-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; color: var(--brand-dark); letter-spacing: 1px;
  background: var(--brand-soft); border: 1px solid rgba(109, 90, 224, .24);
  border-radius: var(--r-pill); padding: 6px 16px;
}
.hero-keyline { display: block; width: 56px; height: 3px; border-radius: 2px; background: var(--brand); margin: 20px auto 0; opacity: .9; }
.hero-lead {
  font-size: 42px; line-height: 1.34; font-weight: 700; letter-spacing: .02em;
  margin: 18px auto 16px; color: var(--ink);
}
.hero-lead .lead-grad {
  background: linear-gradient(92deg, #7b68ee 10%, var(--brand-dark) 90%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.hero-sub { font-size: 16px; color: var(--muted); max-width: 680px; margin: 0 auto; line-height: 1.9; }
.hero-form {
  max-width: 680px; margin: 32px auto 0; display: flex; gap: 10px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 10px;
  box-shadow: var(--shadow-1);
  transition: box-shadow .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
.hero-form:hover { transform: translateY(-2px); box-shadow: var(--shadow-2); }
.hero-form:focus-within { border-color: rgba(109, 90, 224, .55); box-shadow: 0 0 0 4px rgba(109, 90, 224, .10), var(--shadow-1); transform: none; }
.hero-form input { flex: 1; border: none; outline: none; font-size: 16px; padding: 12px 14px; background: none; min-width: 0; font-family: inherit; color: var(--ink); }
.hero-form input::placeholder { color: #9aa1b0; }
.hero-gen {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer;
  border: none; border-radius: var(--r); padding: 0 26px; font-size: 16px; font-weight: 600; color: #fff;
  letter-spacing: .04em; background: var(--brand); box-shadow: 0 4px 12px rgba(109, 90, 224, .26);
  transition: background .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease); white-space: nowrap;
}
.hero-gen:hover { background: var(--brand-dark); transform: translateY(-1px); box-shadow: 0 8px 20px rgba(109, 90, 224, .32); }
.hero-gen:active { transform: translateY(0); }
.hero-note { margin: 14px auto 0; font-size: 13px; line-height: 1.7; color: var(--muted-2); max-width: 820px; }
.hero-sub-actions { margin-top: 20px; display: flex; justify-content: center; gap: 12px; align-items: center; flex-wrap: wrap; }
.hero-link-btn {
  display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600;
  color: var(--brand-dark); background: #fff; border: 1px solid var(--line);
  padding: 10px 22px; border-radius: var(--r-pill); box-shadow: var(--shadow-1);
  transition: border-color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease);
}
.hero-link-btn:hover { border-color: var(--brand); transform: translateY(-3px); box-shadow: var(--shadow-2); text-decoration: none; }
.hero .hero-hints { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 8px; margin-top: 22px; font-size: 13px; color: var(--muted-2); }
.hero .hero-hints a { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: var(--r-pill); border: 1px solid var(--line); background: #fff; color: var(--ink-2); }
.hero .hero-hints a:hover { border-color: #cbc6f0; color: var(--brand-dark); text-decoration: none; }

/* 建课流水线：六个步骤 + 持续右流动的箭头（动态 + 循环），步骤依次点亮 */
.hero .hero-flow { justify-content: center; margin-top: 30px; }
.hero-flow > .flow-arr {
  position: relative;
  flex: 0 0 auto;
  display: inline-block;
  width: 30px;
  height: 14px;
  color: #c4c9d4;
}
/* 每条连接处放两枚箭头，错开 0.22s 出发 → 看起来是一串箭头不断向右流动 */
.hero-flow > .flow-arr::before,
.hero-flow > .flow-arr::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 7px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  border-radius: 1px;
  transform: translateY(-50%) rotate(45deg);
  animation: flow-arrow 1.5s linear infinite;
}
.hero-flow > .flow-arr::after { left: 9px; animation-delay: .22s; }
@keyframes flow-arrow {
  0% { opacity: 0; transform: translate(-5px, -50%) rotate(45deg); }
  22% { opacity: 1; }
  62% { opacity: 1; }
  100% { opacity: 0; transform: translate(9px, -50%) rotate(45deg); }
}
.hero-flow > .flow-chip { animation: chip-flow 2.8s ease-in-out infinite; }
.hero-flow > .flow-chip:nth-child(1) { animation-delay: 0s; }
.hero-flow > .flow-chip:nth-child(3) { animation-delay: .32s; }
.hero-flow > .flow-chip:nth-child(5) { animation-delay: .64s; }
.hero-flow > .flow-chip:nth-child(7) { animation-delay: .96s; }
.hero-flow > .flow-chip:nth-child(9) { animation-delay: 1.28s; }
.hero-flow > .flow-chip:nth-child(11) { animation-delay: 1.6s; }
@keyframes chip-flow {
  0%, 100% { border-color: var(--line); box-shadow: none; transform: translateY(0); }
  8%, 20% { border-color: rgba(109, 90, 224, .5); box-shadow: 0 6px 16px rgba(109, 90, 224, .16); transform: translateY(-2px); }
}

/* KPI 数据卡：随卡片内容列排版（不再通栏到屏幕两端，与上下区块同一版心） */
.hero-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin: 28px auto 0;
}
.hero-stats .hstat {
  position: relative;
  text-align: center;
  background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
  box-shadow: var(--shadow-1); padding: 17px 14px 14px;
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
  animation: stat-in .46s var(--ease) backwards;
  will-change: transform;
}
.hero-stats .hstat::after {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  border-radius: var(--r-lg) var(--r-lg) 0 0; background: var(--grad-brand); opacity: .85;
}
.hero-stats .hstat:nth-child(2) { animation-delay: .05s; }
.hero-stats .hstat:nth-child(3) { animation-delay: .1s; }
.hero-stats .hstat:nth-child(4) { animation-delay: .15s; }
.hero-stats .hstat:nth-child(5) { animation-delay: .2s; }
.hero-stats .hstat:nth-child(6) { animation-delay: .25s; }
.hero-stats .hstat:hover { transform: translateY(-5px); box-shadow: var(--shadow-2); border-color: rgba(109, 90, 224, .35); }
@keyframes stat-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 1080px) {
  .hero-lead { font-size: 34px; }
  .hero-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .hero { padding: 34px 16px 28px; }
  .hero-brand-row { margin-bottom: 18px; }
  .hero-lead { font-size: 28px; }
  .hero-form { flex-direction: column; margin-top: 26px; padding: 8px; }
  .hero-gen { min-height: 46px; }
  .hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero::before, .hero-brand-row .hero-logo, .hero-flow > .flow-chip, .hero-stats .hstat { animation: none !important; }
  .hero-flow > .flow-arr::before, .hero-flow > .flow-arr::after { animation: none !important; opacity: 1; transform: translateY(-50%) rotate(45deg); }
  .hero-form:hover, .hero-link-btn:hover, .hero-stats .hstat:hover { transform: none; }
}

/* 首页主标题精排：收紧字距与行高，第一句在桌面和窄屏均保持单行。 */
.hero-lead {
  font-size:clamp(34px,3vw,42px);font-weight:750;line-height:1.26;letter-spacing:-.025em;
}
.hero-lead .hero-title-line{display:inline-block;white-space:nowrap}
@media (max-width:1080px) {
  .hero-lead{font-size:34px}
}
@media (max-width:760px) {
  .hero-lead{font-size:clamp(22px,6vw,30px);line-height:1.3;letter-spacing:-.035em}
}
@media (max-width:360px) {
  .hero-lead{font-size:21px}
}



/* ==========================================================================
   示范项目：项目缩略图 + 指针跟随的 3D 立体倾斜 + 掠过高光（动态）
   ========================================================================== */
.proj-grid { perspective: 1400px; }
.proj-card {
  display: flex; flex-direction: column; gap: 0;
  padding: 0; overflow: hidden; position: relative;
  transform-style: preserve-3d; will-change: transform;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.proj-card:hover { box-shadow: 0 18px 44px rgba(16, 24, 40, .14); border-color: #d8d0f6; }
/* 缩略图改为固定高度的「宽幅条」，不再按 16:10 撑高整张卡；
   正文压到 3 行，整卡高度约降 1/3，上下比例（图:文 ≈ 1:1.15）更紧凑 */
.proj-shot {
  position: relative; display: block;
  height: 150px; overflow: hidden;
  background: linear-gradient(135deg, #f3f1fd, #eef0f6);
  border-bottom: 1px solid var(--line);
}
.proj-shot img {
  width: 100%; height: 100%; display: block;
  object-fit: cover; object-position: top center;
  transform: scale(1.01);
  transition: transform .6s var(--ease);
}
.proj-card:hover .proj-shot img { transform: scale(1.06); }
.proj-shot::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(31, 36, 48, 0) 52%, rgba(31, 36, 48, .30));
}
.proj-shot-cta {
  position: absolute; right: 10px; bottom: 10px; z-index: 2;
  font-size: 12px; font-weight: 600; color: #fff;
  background: rgba(109, 90, 224, .94);
  border-radius: var(--r-pill); padding: 4px 12px;
  opacity: 0; transform: translateY(6px);
  box-shadow: 0 6px 16px rgba(109, 90, 224, .34);
  transition: opacity .25s var(--ease), transform .25s var(--ease);
}
.proj-card:hover .proj-shot-cta { opacity: 1; transform: none; }
.proj-body { display: flex; flex-direction: column; gap: 5px; padding: 11px 14px 13px; flex: 1; }
/* 描述最多 3 行，超出省略：项目卡高度可预期，版面不再被长文撑长 */
.proj-card .proj-body p {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden; line-height: 1.6;
}
.proj-card h3 { font-size: 14.5px; line-height: 1.45; }
.proj-card .proj-foot { margin-top: auto; padding-top: 4px; }
.proj-card .proj-go { font-size: 12.5px; }
/* 悬停掠过的高光，强化立体质感 */
.proj-card::before {
  content: ''; position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: linear-gradient(115deg, rgba(255, 255, 255, 0) 34%, rgba(255, 255, 255, .5) 50%, rgba(255, 255, 255, 0) 66%);
  transform: translateX(-130%);
  transition: transform .85s var(--ease);
}
.proj-card:hover::before { transform: translateX(130%); }
@media (prefers-reduced-motion: reduce) {
  .proj-card, .proj-shot img, .proj-shot-cta, .proj-card::before { transition: none !important; }
  .proj-card:hover .proj-shot img { transform: none; }
}

/* ==========================================================================
   顶栏一级菜单：桌面端「居中 + 等宽平铺」
   原先 .nav 是 flex 左对齐 —— 菜单挤在品牌后面，右侧留一大片空白。
   现按栏目文字宽度分配：每列至少放得下文字，剩余宽度等分 → 居中且均衡。
   只在 ≥881px 生效 —— ≤880px 时 .nav 会折叠成汉堡下拉，不能被网格覆盖。
   ========================================================================== */
/* 13 项一级菜单在 1200px 以下排不下 → 与窄屏一致折叠为汉堡下拉，避免出现菜单被裁的显示不全。
   （2026-10-31 起管理类入口已移至页脚「平台管理」区，不再计入顶栏） */
@media (min-width:881px) and (max-width:1199px){
  .nav-toggle{display:inline-flex}
  .nav{
    position:absolute; top:var(--header-h); left:0; right:0;
    flex-direction:column; align-items:stretch;
    background:#fff; border-bottom:1px solid var(--line);
    padding:10px 14px 14px; gap:4px;
    box-shadow:var(--shadow-2);
    display:none;
    max-height:calc(100vh - var(--header-h));
    overflow-y:auto;
  }
  .nav.is-open{display:flex}
  .nav-link{padding:11px 13px; border-radius:var(--r); font-size:15px}
}
@media (min-width:1200px){
  .nav{
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    /* 刻意不用 justify-content:center —— 一旦内容超出，居中会把**左右两端一起裁掉**
       （实测：管理员 10 项时「首页」与「插件中心」同时被切）。改为从左侧开始，
       余量由 flex-grow 均分，装得下时视觉上依然是居中等宽。 */
    justify-content:flex-start;
    gap:0;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
  }
  .nav::-webkit-scrollbar{display:none}
  .nav-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    /* 基础宽度取内容宽度，剩余空间等分；min-width:max-content 保证文字永不被压行。
       管理类入口已移至页脚（2026-10-31），顶栏 13 项产品菜单，
       1200px 起才显示横向导航，故内边距与字号按最窄可用宽度定档，确保一项都不被裁掉。 */
    flex:1 1 auto;
    min-width:max-content;
    padding:7px 4px;
    font-size:12px;
  }
}
/* 顶栏与正文同步全宽，宽屏导航可使用完整可视区域。 */
@media (min-width:1440px){
  .site-header-inner{max-width:none}
}

/* ---- 首页主标题下的一体化行（用户要求：位置重要、展示程度比主标题略小） ---- */
.hero-oneline{
  margin:6px 0 2px;
  font-size:clamp(22px,2.4vw,30px);
  font-weight:700;
  letter-spacing:.02em;
  line-height:1.35;
  text-align:center;
  background:linear-gradient(135deg,var(--brand),var(--brand-dark));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-fill-color:transparent;
}

/* ==== 首页核心公式：智慧课程 ＝ AI 教学平台 ＋ AI 互动课堂 ＋ AI 数字教材 ====
   整条做成「一体化公式条」：
   · 左侧「智慧课程」与右侧三个组成部分**同字号**（不再是标题级大小），
     只靠「实心品牌胶囊 vs 白底描边胶囊」区分主次；
   · 运算符 ＝ ＋ 做成白色圆形节点徽章，呼应「接力 / 串联」；
   · 条面有一道流光缓慢掠过，「AI」统一做成小徽标作为视觉锚点。
   注：圆角写死数值 —— V1 用 --radius-pill、V3 用 --r-pill，命名不同，写死可保证两端完全一致。 */
.hero-eq{
  position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:9px 10px;width:fit-content;max-width:100%;
  margin:14px auto 4px;padding:11px 18px;
  border:1px solid rgba(109,90,224,.16);border-radius:999px;
  background:linear-gradient(135deg,rgba(109,90,224,.075),rgba(109,90,224,.02) 55%,rgba(109,90,224,.06));
  box-shadow:0 8px 26px rgba(109,90,224,.09),inset 0 1px 0 #fff;
}
.hero-eq>*{position:relative;z-index:1}
/* 缓慢掠过的流光（从胶囊缝隙间透出，不压在文字上） */
.hero-eq::after{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 32%,rgba(255,255,255,.85) 50%,transparent 68%);
  transform:translateX(-130%);
}
@media (prefers-reduced-motion:no-preference){
  .hero-eq::after{animation:eqSweep 6s var(--ease) infinite}
}
@keyframes eqSweep{
  0%,58%{transform:translateX(-130%)}
  88%,100%{transform:translateX(130%)}
}
/* 左项：与三个组成部分同字号，用实心品牌胶囊拉开层次 */
.eq-lhs{
  font-size:clamp(15px,1.45vw,18px);font-weight:700;letter-spacing:.02em;line-height:1.2;
  padding:6px 15px;border-radius:999px;
  background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;
  box-shadow:0 5px 14px rgba(109,90,224,.3);
}
.eq-op,.eq-plus{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:22px;height:22px;border-radius:50%;font-size:12.5px;font-weight:800;line-height:1;
  color:var(--brand);background:#fff;border:1px solid rgba(109,90,224,.3);
  box-shadow:0 2px 7px rgba(109,90,224,.16);
}
.eq-op{width:26px;height:26px;font-size:14px}
.eq-rhs{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px}
.eq-part{
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  padding:6px 14px;border-radius:999px;
  background:#fff;color:var(--ink);border:1px solid rgba(109,90,224,.18);
  font-size:clamp(15px,1.45vw,18px);font-weight:650;letter-spacing:.01em;
  box-shadow:0 3px 10px rgba(24,25,50,.06);
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),border-color .18s var(--ease);
}
.eq-part:hover{transform:translateY(-2px);border-color:rgba(109,90,224,.5);box-shadow:0 9px 20px rgba(109,90,224,.18)}
/* 「AI」小徽标：三个组成部分共用同一视觉锚点 */
.eq-part i{
  font-style:normal;font-weight:800;font-size:.82em;letter-spacing:.06em;
  color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-dark));
  padding:1px 6px;border-radius:6px;
}
/* 窄屏：整条竖排成「算式」——每行一个元素，运算符居中夹在中间，
   避免出现「＋ 悬在行尾、末项被挤到下一行」的碎版 */
@media (max-width:640px){
  .hero-eq{width:100%;flex-direction:column;gap:6px;padding:12px 14px;border-radius:14px}
  .eq-rhs{flex-direction:column;width:100%;gap:6px}
  .eq-part{width:100%;justify-content:center}
  .eq-op,.eq-plus{width:20px;height:20px;font-size:11.5px}
}
@media (prefers-reduced-motion:reduce){
  .eq-part{transition:none}
  .eq-part:hover{transform:none}
}

/* ==== 内嵌播放：白板讲授 / 智慧互动课堂等资源在本页播放，不再新开网页 ==== */
.inline-stage{margin:0 0 var(--sp-4);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;background:var(--card);box-shadow:var(--shadow)}
.inline-stage-bar{display:flex;align-items:center;gap:10px;justify-content:space-between;
  padding:8px 12px;border-bottom:1px solid var(--line);background:var(--brand-soft-2,#f6f4fe)}
.inline-stage-title{font-size:13.5px;font-weight:650;color:var(--ink);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.inline-stage-box{position:relative;background:var(--ink)}
.inline-stage-frame{display:block;width:100%;height:clamp(320px,52vh,620px);border:0;background:var(--card)}
.inline-stage:fullscreen{border-radius:0;border:0}
.inline-stage:fullscreen .inline-stage-bar{background:var(--ink);border-bottom-color:var(--line)}
.inline-stage:fullscreen .inline-stage-title{color:var(--card)}
.inline-stage:fullscreen .inline-stage-frame{height:calc(100vh - 46px)}
button.proj-go,button.go{font:inherit;cursor:pointer;border:0;background:transparent;padding:0}
@media (max-width:640px){.inline-stage-frame{height:clamp(280px,44vh,460px)}}

/* ==========================================================================
   智慧课程三件套（#suite）：与「把专业团队的工作，变成三步操作」同级别的独立宣传区块
   —— 原先是智能体右栏里的一个条目，现独立成区，三件套各占一张卡
   （V1 用 --radius-pill，V3 用 --r-pill；此处按 V3 令牌书写）
   ========================================================================== */
.suite-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.suite-card{
  position:relative;display:flex;flex-direction:column;gap:6px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:20px 20px 18px;box-shadow:0 2px 10px rgba(31,36,48,.05);color:var(--ink);overflow:hidden;
  transition:transform .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.suite-card::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:var(--brand);opacity:.9}
.suite-card.s2::before{background:linear-gradient(90deg,#6D5AE0,#8A79EC)}
.suite-card.s3::before{background:linear-gradient(90deg,#5749C9,#6D5AE0)}
.suite-card:hover{border-color:rgba(109,90,224,.42);transform:translateY(-3px);box-shadow:0 12px 26px rgba(109,90,224,.14);text-decoration:none}
.suite-card .suite-no{
  font-size:12px;font-weight:700;letter-spacing:1px;color:var(--brand);
  background:var(--brand-soft);border-radius:999px;padding:2px 10px;align-self:flex-start;
}
.suite-card b{font-size:16.5px;font-weight:700;color:var(--ink);letter-spacing:.02em}
.suite-card small{font-size:12.5px;color:var(--brand-dark);font-weight:600}
.suite-card em{font-style:normal;font-size:13px;color:var(--muted);line-height:1.7;margin-top:2px}
.suite-card em:last-child{margin-top:auto;padding-top:10px;font-weight:600;color:var(--brand-dark)}
@media (max-width:1024px){
  .suite-grid{grid-template-columns:1fr;gap:12px}
}
@media (prefers-reduced-motion:reduce){
  .suite-card{transition:none}
  .suite-card:hover{transform:none}
}

/* ------- 课程归属学校标识（2026-10-25，首页课程卡片） ------- */
.course-school { margin: 6px 0 2px; }
.school-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 9px; border-radius: 999px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .02em; line-height: 1.7;
  color: #5A4A86; background: #F4F1FB; border: 1px solid #DFD7F1; white-space: nowrap;
}
.school-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #8B7BC6; display: inline-block; }
.school-badge.is-partner { color: #8A4B2E; background: #FBF1EA; border-color: #EAD4C2; }
.school-badge.is-partner::before { background: #C77B4E; }